@vectojs/core 1.32.0 → 1.32.2

package/dist/index.js

@@ -1998,30 +1998,79 @@ var Scene = (_class7 = class _Scene {
   __init60() {this.contentGridCalibrationStamp = ""}
   /** Invalidates grid font calibration after browser font availability changes. */
   __init61() {this.contentFontEpoch = 0}
+  /**
+   * Bumped whenever the viewport itself changes shape, which re-tiers blocks
+   * without moving any of them.
+   *
+   * The settled-walk fast path in {@link syncContentProjection} decides a block
+   * is unchanged from its own local transform plus its parent's world transform.
+   * Both are viewport-independent, so a resize alone would slip past it and leave
+   * every block holding DOM built for the old viewport — a block that should have
+   * been promoted to the fine tier keeping no carriers, or a demoted one keeping
+   * carriers it no longer needs. Scrolling needs no such epoch: it moves the root,
+   * so every block's parent world transform changes and the check fails honestly.
+   */
+  __init62() {this.contentViewportEpoch = 0}
+  /**
+   * One-entry memo for a parent's world transform, held as scalars.
+   *
+   * The a11y walk visits all of one parent's children consecutively, so a
+   * one-entry memo hits for every child after the first — turning an
+   * O(children) sequence of `getWorldTransform()` calls, each of which
+   * allocates a fresh object on its cache-hit path
+   * ({@link Entity.getWorldTransform}), into one call per parent. Flattened to
+   * scalars rather than a cached object so the memo itself never allocates.
+   *
+   * Keyed on `(entity, syncSerial)`: the serial is bumped once per top-level
+   * sync, so a memo can never survive into a frame in which the parent has
+   * moved.
+   */
+  __init63() {this._pwNode = null}
+  __init64() {this._pwSerial = -1}
+  __init65() {this._pwa = 1}
+  __init66() {this._pwb = 0}
+  __init67() {this._pwc = 0}
+  __init68() {this._pwd = 1}
+  __init69() {this._pwe = 0}
+  __init70() {this._pwf = 0}
+  /** Incremented once per top-level `syncA11y`, invalidating `_pwNode`. */
+  __init71() {this._syncSerial = 0}
+  /**
+   * Disables the settled-walk fast path in {@link syncContentProjection}.
+   *
+   * Exists so a benchmark can measure both arms in ONE run on ONE commit, rather
+   * than comparing two builds and inheriting every difference between them. Also
+   * lets a test assert that a behaviour is genuinely unchanged by the fast path
+   * rather than merely unobserved.
+   *
+   * Not part of the public API and not documented as an option: turning it on only
+   * makes a settled document slower, never more correct.
+   */
+  __init72() {this.disableSettledFastPath = false}
   /** Cached Canvas-to-client scale for the current font/viewport epoch. */
-  __init62() {this.contentMetricScaleEpoch = -1}
-  __init63() {this.contentMetricScaleX = 1}
-  __init64() {this.contentProjectionEnabled = true}
+  __init73() {this.contentMetricScaleEpoch = -1}
+  __init74() {this.contentMetricScaleX = 1}
+  __init75() {this.contentProjectionEnabled = true}
   // Virtualization margin (px) for the content-projection CARRIER band;
   // `undefined` → one viewport height, resolved at sync time. `Infinity` is
   // unsupported here: it unwindows every carrier, which is O(total glyphs).
-  __init65() {this.contentProjectionMargin = void 0}
+  __init76() {this.contentProjectionMargin = void 0}
   // Virtualization margin (px) for the SEMANTIC tier — whether a block has
   // any projected DOM. `undefined` → falls back to contentProjectionMargin, so
   // the default keeps one gate. `Infinity` = every block keeps resident text.
-  __init66() {this.contentSemanticMargin = void 0}
+  __init77() {this.contentSemanticMargin = void 0}
   // How many coarse-tier blocks may be MATERIALIZED per sync, spreading the
   // resident tier's document-open cost across frames. `Infinity` = one
   // synchronous pass.
-  __init67() {this.contentSemanticBudget = DEFAULT_CONTENT_SEMANTIC_BUDGET}
+  __init78() {this.contentSemanticBudget = DEFAULT_CONTENT_SEMANTIC_BUDGET}
   // Remaining materializations in the CURRENT sync. Reset at the start of each
   // a11y walk; decremented per coarse block that creates its element.
-  __init68() {this.contentSemanticBudgetLeft = 0}
+  __init79() {this.contentSemanticBudgetLeft = 0}
   // Set when a sync deferred at least one block, so the scene knows to keep
   // drawing frames until the resident tier is complete. Without it a static
   // scene in `onDemand` mode would stop rendering with the document half
   // materialized and never finish.
-  __init69() {this.contentSemanticDeferred = false}
+  __init80() {this.contentSemanticDeferred = false}
   /**
    * Per-sync memo of "does the document hold a selection at all".
    *
@@ -2044,43 +2093,43 @@ var Scene = (_class7 = class _Scene {
    * the user, so its presence cannot change mid-walk. Resolving it once per walk
    * turns O(blocks) forced layouts into O(1). `null` = not yet resolved.
    */
-  __init70() {this.contentSelectionPresentThisSync = null}
+  __init81() {this.contentSelectionPresentThisSync = null}
   /**
    * True while a text-selection drag that started on a projection's blank
    * region (no text node under the press) is being driven manually — the
    * browser has no native anchor for it, so mousemove extends the Selection
    * from the position we resolved ourselves.
    */
-  __init71() {this.blankRegionSelectionDrag = false}
-  __init72() {this.contentSelectionAnchor = null}
-  __init73() {this.contentSelectionEndListener = null}
+  __init82() {this.blankRegionSelectionDrag = false}
+  __init83() {this.contentSelectionAnchor = null}
+  __init84() {this.contentSelectionEndListener = null}
   // Animation/interactive flags collected during the render walk (tree-walk
   // fusion): the loop reads last frame's answers instead of re-walking the
   // tree up to 4× per tick. Start true so the first tick stays conservative.
-  __init74() {this.frameHadAnimation = true}
-  __init75() {this.frameHadInteractive = true}
+  __init85() {this.frameHadAnimation = true}
+  __init86() {this.frameHadInteractive = true}
   
   /** Active `(resolution: Ndppx)` media query watching for a runtime DPR change
    *  (window moved between monitors, browser zoom) so the canvas backing store
    *  can be re-scaled — otherwise it stays rasterized at the old DPR and blurs.
    *  A resolution media query only fires when leaving its exact value, so the
    *  handler re-arms a fresh query for the new DPR each time. */
-  __init76() {this.dprMediaQuery = null}
+  __init87() {this.dprMediaQuery = null}
   /** For embedded (`disableWindowResize`) scenes: observes the canvas element so
    *  a CSS/layout-driven size change re-runs `resize()`. A window `resize`
    *  listener never fires for these (the window isn't what changed), so without
    *  this an embedded canvas stayed at its initial size forever. */
-  __init77() {this.canvasResizeObserver = null}
-  __init78() {this.dprChangeHandler = null}
-  __init79() {this.focusedA11yElement = null}
+  __init88() {this.canvasResizeObserver = null}
+  __init89() {this.dprChangeHandler = null}
+  __init90() {this.focusedA11yElement = null}
   /** Last geometry `syncOverlayGeometry` wrote, so an unchanged frame can skip the
    *  style writes entirely. Reset to `null` to force the next sync (a new overlay
    *  layer was created and has never been positioned). */
-  __init80() {this._overlayGeometry = null}
+  __init91() {this._overlayGeometry = null}
   /** Shadow elements the pointer is currently inside. Lets a removal that happens
    *  mid-hover synthesize the `pointerleave` the browser never sends for a
    *  detached element, so the entity doesn't keep its hover state. */
-  __init81() {this.hoveredA11yElements = /* @__PURE__ */ new WeakSet()}
+  __init92() {this.hoveredA11yElements = /* @__PURE__ */ new WeakSet()}
   /**
    * Entity ids the application has pinned via {@link requestA11yProjection}.
    *
@@ -2088,22 +2137,22 @@ var Scene = (_class7 = class _Scene {
    * a stale id simply never matches. Cleared per-entity by
    * {@link releaseA11yProjection}.
    */
-  __init82() {this.a11yProjectionRequests = /* @__PURE__ */ new Set()}
+  __init93() {this.a11yProjectionRequests = /* @__PURE__ */ new Set()}
   /** Persistent tabindex=-1 element in a11yRoot. When the focused a11y mirror is
    *  pruned (virtualization/streaming/removal) while it holds focus, we move
    *  focus here instead of letting the browser drop it to <body> — keeping the
    *  screen-reader virtual cursor inside the scene's a11y region. */
-  __init83() {this.focusSentinel = null}
-  __init84() {this.caretBlinkTimer = null}
-  __init85() {this.a11yNeedsReorder = true}
-  __init86() {this.portalRoot = null}
-  __init87() {this.fullViewportElements = []}
-  __init88() {this.normalElements = []}
-  __init89() {this.activeIds = /* @__PURE__ */ new Set()}
+  __init94() {this.focusSentinel = null}
+  __init95() {this.caretBlinkTimer = null}
+  __init96() {this.a11yNeedsReorder = true}
+  __init97() {this.portalRoot = null}
+  __init98() {this.fullViewportElements = []}
+  __init99() {this.normalElements = []}
+  __init100() {this.activeIds = /* @__PURE__ */ new Set()}
   /** Per-parent insertion cursor, reused by `enforceA11yDomOrder`. */
-  __init90() {this.a11yOrderCursors = /* @__PURE__ */ new Map()}
+  __init101() {this.a11yOrderCursors = /* @__PURE__ */ new Map()}
   /** Membership set for the elements being ordered, reused per reorder pass. */
-  __init91() {this.a11yOrderMembers = /* @__PURE__ */ new Set()}
+  __init102() {this.a11yOrderMembers = /* @__PURE__ */ new Set()}
   /**
    * Elements that are an *ancestor* of another ordered element, reused per pass.
    *
@@ -2111,11 +2160,21 @@ var Scene = (_class7 = class _Scene {
    * items) spans every descendant row, so it must not extend a visual row band —
    * see {@link sortNormalElementsVisually}.
    */
-  __init92() {this.a11yOrderContainers = /* @__PURE__ */ new Set()}
-  __init93() {this.activePortalsThisFrame = /* @__PURE__ */ new Set()}
-  __init94() {this.activePortalsPrevFrame = /* @__PURE__ */ new Set()}
-  __init95() {this.portalEntities = /* @__PURE__ */ new Map()}
-  __init96() {this.renderOrderCounter = 0}
+  __init103() {this.a11yOrderContainers = /* @__PURE__ */ new Set()}
+  /**
+   * Nearest `clipChildren` ancestor per ordered element — its *region* — reused
+   * per pass. Written by `enforceA11yDomOrder`'s collect walk, which already has
+   * the entity in hand, so a region costs one comparison per node rather than an
+   * ancestor walk per element.
+   *
+   * Absent means the element sits under no clipping ancestor and belongs to the
+   * implicit root region. See {@link sortNormalElementsVisually}.
+   */
+  __init104() {this.a11yOrderRegions = /* @__PURE__ */ new Map()}
+  __init105() {this.activePortalsThisFrame = /* @__PURE__ */ new Set()}
+  __init106() {this.activePortalsPrevFrame = /* @__PURE__ */ new Set()}
+  __init107() {this.portalEntities = /* @__PURE__ */ new Map()}
+  __init108() {this.renderOrderCounter = 0}
   /**
    * Monotonic render-frame counter, bumped once per authoritative `render()`
    * pass. Entities stamp their per-frame world-matrix cache with this value and
@@ -2124,7 +2183,7 @@ var Scene = (_class7 = class _Scene {
    * back to the ancestor walk. Public for the same reason `Entity._getTrig`/
    * `_setWorldCache` are: it is a cross-class render-internal contract.
    */
-  __init97() {this.currentFrame = 0}
+  __init109() {this.currentFrame = 0}
   // ── WASM transform backend (invisible accelerator) ──────────────────────────
   // When `_transformBackend === 'wasm'`, the main render walk sources each
   // entity's world matrix from an SoA store composed by `_wasm` (see
@@ -2132,24 +2191,24 @@ var Scene = (_class7 = class _Scene {
   // fallback and the default: a null backend, a non-main renderer, or any entity
   // absent from the store all fall back to the JS composition, so WASM can only
   // ever change *how fast* a world matrix is produced, never *what* it is.
-  __init98() {this._wasm = null}
-  __init99() {this._transformBackend = "js"}
+  __init110() {this._wasm = null}
+  __init111() {this._transformBackend = "js"}
   // Resident store state (Stage 3). The store layout — slot assignment + sibling
   // runs — depends only on tree TOPOLOGY, so it is rebuilt only when the
   // structure changes (add/remove/reparent bump `_structureVersion`). Between
   // rebuilds the per-frame cost is: gather each entity's transform into the
   // resident wasm input view + run the kernel — no reallocation, no readback.
-  __init100() {this._treeStore = null}
-  __init101() {this._slotEntity = []}
+  __init112() {this._treeStore = null}
+  __init113() {this._slotEntity = []}
   // store slot -> entity (also validates slots)
-  __init102() {this._wasmInputs = null}
-  __init103() {this._wasmWorld = null}
-  __init104() {this._structureVersion = 0}
-  __init105() {this._storeStructureVersion = -1}
+  __init114() {this._wasmInputs = null}
+  __init115() {this._wasmWorld = null}
+  __init116() {this._structureVersion = 0}
+  __init117() {this._storeStructureVersion = -1}
   // Cached list of ComputeParticleEntity instances in the tree, keyed by the
   // structure version it was gathered at. Rebuilt only on a topology change.
-  __init106() {this._computeEntities = []}
-  __init107() {this._computeEntitiesVersion = -1}
+  __init118() {this._computeEntities = []}
+  __init119() {this._computeEntitiesVersion = -1}
   /** Invalidate the resident WASM store layout; the next wasm-mode frame rebuilds
    *  it. Called by `Entity.add`/`remove` (topology changes only). */
   markStructureChanged() {
@@ -2234,7 +2293,7 @@ var Scene = (_class7 = class _Scene {
    * cached globally; the instance is per-Scene, which is the isolation that
    * actually matters.
    */
-  __init108() {this._wasmRuntime = null}
+  __init120() {this._wasmRuntime = null}
   /**
    * Load (or reuse) this Scene's shared WASM runtime.
    *
@@ -2262,30 +2321,30 @@ var Scene = (_class7 = class _Scene {
   get wasmRuntime() {
     return this._wasmRuntime;
   }
-  __init109() {this._hitWasm = null}
+  __init121() {this._hitWasm = null}
   // Cache key: which frame + structure version the grid was last (successfully,
   // non-overflowing) built for. findEntityAt is called ad-hoc (pointer
   // hover/click), not every frame, so the grid is refreshed lazily on demand
   // rather than proactively every render() — unlike the transform store, which
   // every frame's draw depends on.
-  __init110() {this._hitGridFrame = -1}
-  __init111() {this._hitGridOk = false}
-  __init112() {this._hitSlotEntity = []}
-  __init113() {this._hitBoundless = []}
+  __init122() {this._hitGridFrame = -1}
+  __init123() {this._hitGridOk = false}
+  __init124() {this._hitSlotEntity = []}
+  __init125() {this._hitBoundless = []}
   /** Reused buffer for the fused gather, so a pointer query allocates nothing. */
-  __init114() {this._hitGatherBuffer = null}
+  __init126() {this._hitGatherBuffer = null}
   /**
    * Whether the last grid build sourced its AABBs from the WASM transform store
    * rather than recomputing them in JS. Diagnostic only — both paths must
    * produce the same entity for a given point.
    */
-  __init115() {this._hitFusedGather = false}
+  __init127() {this._hitFusedGather = false}
   /**
    * Whether `compute_aabbs` has run against the current frame's world matrices.
    * The AABB pass is only meaningful after a `compose_*`, so the fused gather
    * must not read the views before then.
    */
-  __init116() {this._wasmAabbsFresh = false}
+  __init128() {this._wasmAabbsFresh = false}
   /** Did the last hit-grid build use the fused (WASM-store) gather? */
   get hitGatherPath() {
     return this._hitFusedGather ? "fused" : "js";
@@ -2294,9 +2353,9 @@ var Scene = (_class7 = class _Scene {
    * Why the transform accelerator did or did not run on the most recent frame.
    * Written by the render walk and `_syncWasmStore`.
    */
-  __init117() {this._transformReason = "not-installed"}
+  __init129() {this._transformReason = "not-installed"}
   /** Why the batched-driver accelerator did or did not run. */
-  __init118() {this._animReason = "not-installed"}
+  __init130() {this._animReason = "not-installed"}
   /**
    * Why the hit-test accelerator did or did not serve the last pointer query.
    * The grid is built lazily on demand, not every frame, so this describes the
@@ -2304,11 +2363,11 @@ var Scene = (_class7 = class _Scene {
    * before a backend exists; `_ensureHitGrid` moves it to `'not-applicable'`
    * once one is installed but nothing has queried yet.
    */
-  __init119() {this._hitReason = "not-installed"}
+  __init131() {this._hitReason = "not-installed"}
   /** Why the particle accelerator did or did not run. */
-  __init120() {this._particleReason = "not-applicable"}
+  __init132() {this._particleReason = "not-applicable"}
   /** Which particle implementation actually simulated the most recent frame. */
-  __init121() {this._particlePath = "none"}
+  __init133() {this._particlePath = "none"}
   /**
    * Per-frame status of every invisible accelerator: whether each is installed,
    * whether it actually ran on the most recent frame, and why.
@@ -2468,25 +2527,25 @@ var Scene = (_class7 = class _Scene {
   // EasingFn (which cannot cross into WASM) all fall through to it — WASM can
   // only ever change *how* a driver is advanced, never *what* value it lands
   // on.
-  __init122() {this._animWasm = null}
+  __init134() {this._animWasm = null}
   // Entities with at least one active driver, added by Entity._spawnDriver.
   // Self-pruning: _tickBatchedDrivers drops an entry the first time it visits
   // an entity whose drivers have since all completed or been removed. This is
   // what lets the batch pass find its candidates in O(active drivers), not
   // O(tree size) — the exact mistake G3's first integrated benchmark made.
-  __init123() {this._activeDriverEntities = /* @__PURE__ */ new Set()}
+  __init135() {this._activeDriverEntities = /* @__PURE__ */ new Set()}
   // Reused across frames instead of allocating a fresh array + N {entity,prop,
   // driver} objects every call — the integrated benchmark
   // (benchmarks/anim-wasm-scene) found that allocation churn was the
   // dominant integrated cost, not the wasm kernel itself. Parallel arrays,
   // truncated to the live count after each use so a stale tail slot never
   // pins a no-longer-active entity/driver in memory.
-  __init124() {this._springEntities = []}
-  __init125() {this._springProps = []}
-  __init126() {this._springDrivers = []}
-  __init127() {this._tweenEntities = []}
-  __init128() {this._tweenProps = []}
-  __init129() {this._tweenDrivers = []}
+  __init136() {this._springEntities = []}
+  __init137() {this._springProps = []}
+  __init138() {this._springDrivers = []}
+  __init139() {this._tweenEntities = []}
+  __init140() {this._tweenProps = []}
+  __init141() {this._tweenDrivers = []}
   /**
    * Minimum number of batchable (spring, or named-easing tween) active drivers
    * before a frame engages the WASM batch path at all; below it, every driver
@@ -2558,7 +2617,7 @@ var Scene = (_class7 = class _Scene {
    * Setting {@link animDriverGateCount} overwrites all three, so existing code
    * that tuned the single knob keeps working unchanged.
    */
-  __init130() {this._animBatchedLastFrame = false}
+  __init142() {this._animBatchedLastFrame = false}
   /**
    * Whether the WASM batch path actually ran on the most recent frame.
    *
@@ -2570,7 +2629,7 @@ var Scene = (_class7 = class _Scene {
   get animBatchedLastFrame() {
     return this._animBatchedLastFrame;
   }
-  __init131() {this.animGate = {
+  __init143() {this.animGate = {
     spring: 128,
     tween: 256,
     mixed: 128
@@ -2608,7 +2667,7 @@ var Scene = (_class7 = class _Scene {
   // (benchmarks/particle-wasm). f32 (matches the WGSL shader), bit-identical to
   // a JS f32 reference oracle; updateCPU (f64) stays the permanent fallback when
   // no backend is installed or a scene runs on WebGPU.
-  __init132() {this._particleWasm = null}
+  __init144() {this._particleWasm = null}
   /** Which backend runs the CPU particle simulation. Reflects only whether a
    *  backend is installed (the WebGPU compute path, when active, is used first
    *  regardless). */
@@ -2885,24 +2944,24 @@ var Scene = (_class7 = class _Scene {
    * sync, so retaining the order prevents a newly opened overlay from spending
    * its first frame below previously projected controls.
    */
-  __init133() {this.a11yRenderOrders = /* @__PURE__ */ new Map()}
+  __init145() {this.a11yRenderOrders = /* @__PURE__ */ new Map()}
   // Optional WebGL point-cloud layer (see SceneOptions.pointBackend).
-  __init134() {this.pointRenderer = null}
-  __init135() {this.glCanvas = null}
-  __init136() {this.glContextLostHandler = null}
-  __init137() {this.glContextRestoredHandler = null}
+  __init146() {this.pointRenderer = null}
+  __init147() {this.glCanvas = null}
+  __init148() {this.glContextLostHandler = null}
+  __init149() {this.glContextRestoredHandler = null}
   
   
   
-  __init138() {this.disableWindowResize = false}
+  __init150() {this.disableWindowResize = false}
   /** See {@link SceneOptions.maxDPR}. `undefined` = uncapped (real DPR). */
   
   // WebGPU properties
-  __init139() {this.destroyed = false}
-  __init140() {this.device = null}
-  __init141() {this.deviceLost = false}
-  __init142() {this.particleBackend = "auto"}
-  __init143() {this._webgpuDisabled = false}
+  __init151() {this.destroyed = false}
+  __init152() {this.device = null}
+  __init153() {this.deviceLost = false}
+  __init154() {this.particleBackend = "auto"}
+  __init155() {this._webgpuDisabled = false}
   get webgpuDisabled() {
     return this._webgpuDisabled || this.particleBackend === "cpu";
   }
@@ -2930,22 +2989,22 @@ var Scene = (_class7 = class _Scene {
   set webgpuDisabled(value) {
     this._webgpuDisabled = value;
   }
-  __init144() {this.recoveryTimerId = null}
-  __init145() {this.manager = null}
-  __init146() {this.initializingWebGPU = false}
-  __init147() {this.gpuCanvas = null}
-  __init148() {this.gpuContext = null}
+  __init156() {this.recoveryTimerId = null}
+  __init157() {this.manager = null}
+  __init158() {this.initializingWebGPU = false}
+  __init159() {this.gpuCanvas = null}
+  __init160() {this.gpuContext = null}
   /** True while the GPU canvas holds a presented particle frame (needs clearing when they leave). */
-  __init149() {this.gpuHasContent = false}
-  __init150() {this.mouseX = -9999}
-  __init151() {this.mouseY = -9999}
-  __init152() {this.pointerMoveListener = null}
-  __init153() {this.pointerLeaveListener = null}
+  __init161() {this.gpuHasContent = false}
+  __init162() {this.mouseX = -9999}
+  __init163() {this.mouseY = -9999}
+  __init164() {this.pointerMoveListener = null}
+  __init165() {this.pointerLeaveListener = null}
   /** Element the pointer listeners are bound to (parent container if present,
    *  else the canvas). Stored so `destroy()` detaches from the same element. */
-  __init154() {this.pointerEventTarget = null}
-  __init155() {this.hasWarnedZeroSize = false}
-  __init156() {this.fontLoadHandler = null}
+  __init166() {this.pointerEventTarget = null}
+  __init167() {this.hasWarnedZeroSize = false}
+  __init168() {this.fontLoadHandler = null}
   // ── Dev-mode warning infrastructure ──────────────────────────────
   //
   // Enable with `Scene.devMode = true` or by setting `globalThis.__DEV__`.
@@ -2979,7 +3038,7 @@ var Scene = (_class7 = class _Scene {
     return false;
   }
   
-  __init157() {this._devFrameCount = 0}
+  __init169() {this._devFrameCount = 0}
   _devWarn(message) {
     if (!this._devActive) return;
     console.warn(`[vectojs/dev] ${message}`);
@@ -3056,7 +3115,7 @@ var Scene = (_class7 = class _Scene {
     };
     walkProjections(this.root);
   }
-  constructor(canvas, options = {}) {;_class7.prototype.__init27.call(this);_class7.prototype.__init28.call(this);_class7.prototype.__init29.call(this);_class7.prototype.__init30.call(this);_class7.prototype.__init31.call(this);_class7.prototype.__init32.call(this);_class7.prototype.__init33.call(this);_class7.prototype.__init34.call(this);_class7.prototype.__init35.call(this);_class7.prototype.__init36.call(this);_class7.prototype.__init37.call(this);_class7.prototype.__init38.call(this);_class7.prototype.__init39.call(this);_class7.prototype.__init40.call(this);_class7.prototype.__init41.call(this);_class7.prototype.__init42.call(this);_class7.prototype.__init43.call(this);_class7.prototype.__init44.call(this);_class7.prototype.__init45.call(this);_class7.prototype.__init46.call(this);_class7.prototype.__init47.call(this);_class7.prototype.__init48.call(this);_class7.prototype.__init49.call(this);_class7.prototype.__init50.call(this);_class7.prototype.__init51.call(this);_class7.prototype.__init52.call(this);_class7.prototype.__init53.call(this);_class7.prototype.__init54.call(this);_class7.prototype.__init55.call(this);_class7.prototype.__init56.call(this);_class7.prototype.__init57.call(this);_class7.prototype.__init58.call(this);_class7.prototype.__init59.call(this);_class7.prototype.__init60.call(this);_class7.prototype.__init61.call(this);_class7.prototype.__init62.call(this);_class7.prototype.__init63.call(this);_class7.prototype.__init64.call(this);_class7.prototype.__init65.call(this);_class7.prototype.__init66.call(this);_class7.prototype.__init67.call(this);_class7.prototype.__init68.call(this);_class7.prototype.__init69.call(this);_class7.prototype.__init70.call(this);_class7.prototype.__init71.call(this);_class7.prototype.__init72.call(this);_class7.prototype.__init73.call(this);_class7.prototype.__init74.call(this);_class7.prototype.__init75.call(this);_class7.prototype.__init76.call(this);_class7.prototype.__init77.call(this);_class7.prototype.__init78.call(this);_class7.prototype.__init79.call(this);_class7.prototype.__init80.call(this);_class7.prototype.__init81.call(this);_class7.prototype.__init82.call(this);_class7.prototype.__init83.call(this);_class7.prototype.__init84.call(this);_class7.prototype.__init85.call(this);_class7.prototype.__init86.call(this);_class7.prototype.__init87.call(this);_class7.prototype.__init88.call(this);_class7.prototype.__init89.call(this);_class7.prototype.__init90.call(this);_class7.prototype.__init91.call(this);_class7.prototype.__init92.call(this);_class7.prototype.__init93.call(this);_class7.prototype.__init94.call(this);_class7.prototype.__init95.call(this);_class7.prototype.__init96.call(this);_class7.prototype.__init97.call(this);_class7.prototype.__init98.call(this);_class7.prototype.__init99.call(this);_class7.prototype.__init100.call(this);_class7.prototype.__init101.call(this);_class7.prototype.__init102.call(this);_class7.prototype.__init103.call(this);_class7.prototype.__init104.call(this);_class7.prototype.__init105.call(this);_class7.prototype.__init106.call(this);_class7.prototype.__init107.call(this);_class7.prototype.__init108.call(this);_class7.prototype.__init109.call(this);_class7.prototype.__init110.call(this);_class7.prototype.__init111.call(this);_class7.prototype.__init112.call(this);_class7.prototype.__init113.call(this);_class7.prototype.__init114.call(this);_class7.prototype.__init115.call(this);_class7.prototype.__init116.call(this);_class7.prototype.__init117.call(this);_class7.prototype.__init118.call(this);_class7.prototype.__init119.call(this);_class7.prototype.__init120.call(this);_class7.prototype.__init121.call(this);_class7.prototype.__init122.call(this);_class7.prototype.__init123.call(this);_class7.prototype.__init124.call(this);_class7.prototype.__init125.call(this);_class7.prototype.__init126.call(this);_class7.prototype.__init127.call(this);_class7.prototype.__init128.call(this);_class7.prototype.__init129.call(this);_class7.prototype.__init130.call(this);_class7.prototype.__init131.call(this);_class7.prototype.__init132.call(this);_class7.prototype.__init133.call(this);_class7.prototype.__init134.call(this);_class7.prototype.__init135.call(this);_class7.prototype.__init136.call(this);_class7.prototype.__init137.call(this);_class7.prototype.__init138.call(this);_class7.prototype.__init139.call(this);_class7.prototype.__init140.call(this);_class7.prototype.__init141.call(this);_class7.prototype.__init142.call(this);_class7.prototype.__init143.call(this);_class7.prototype.__init144.call(this);_class7.prototype.__init145.call(this);_class7.prototype.__init146.call(this);_class7.prototype.__init147.call(this);_class7.prototype.__init148.call(this);_class7.prototype.__init149.call(this);_class7.prototype.__init150.call(this);_class7.prototype.__init151.call(this);_class7.prototype.__init152.call(this);_class7.prototype.__init153.call(this);_class7.prototype.__init154.call(this);_class7.prototype.__init155.call(this);_class7.prototype.__init156.call(this);_class7.prototype.__init157.call(this);
+  constructor(canvas, options = {}) {;_class7.prototype.__init27.call(this);_class7.prototype.__init28.call(this);_class7.prototype.__init29.call(this);_class7.prototype.__init30.call(this);_class7.prototype.__init31.call(this);_class7.prototype.__init32.call(this);_class7.prototype.__init33.call(this);_class7.prototype.__init34.call(this);_class7.prototype.__init35.call(this);_class7.prototype.__init36.call(this);_class7.prototype.__init37.call(this);_class7.prototype.__init38.call(this);_class7.prototype.__init39.call(this);_class7.prototype.__init40.call(this);_class7.prototype.__init41.call(this);_class7.prototype.__init42.call(this);_class7.prototype.__init43.call(this);_class7.prototype.__init44.call(this);_class7.prototype.__init45.call(this);_class7.prototype.__init46.call(this);_class7.prototype.__init47.call(this);_class7.prototype.__init48.call(this);_class7.prototype.__init49.call(this);_class7.prototype.__init50.call(this);_class7.prototype.__init51.call(this);_class7.prototype.__init52.call(this);_class7.prototype.__init53.call(this);_class7.prototype.__init54.call(this);_class7.prototype.__init55.call(this);_class7.prototype.__init56.call(this);_class7.prototype.__init57.call(this);_class7.prototype.__init58.call(this);_class7.prototype.__init59.call(this);_class7.prototype.__init60.call(this);_class7.prototype.__init61.call(this);_class7.prototype.__init62.call(this);_class7.prototype.__init63.call(this);_class7.prototype.__init64.call(this);_class7.prototype.__init65.call(this);_class7.prototype.__init66.call(this);_class7.prototype.__init67.call(this);_class7.prototype.__init68.call(this);_class7.prototype.__init69.call(this);_class7.prototype.__init70.call(this);_class7.prototype.__init71.call(this);_class7.prototype.__init72.call(this);_class7.prototype.__init73.call(this);_class7.prototype.__init74.call(this);_class7.prototype.__init75.call(this);_class7.prototype.__init76.call(this);_class7.prototype.__init77.call(this);_class7.prototype.__init78.call(this);_class7.prototype.__init79.call(this);_class7.prototype.__init80.call(this);_class7.prototype.__init81.call(this);_class7.prototype.__init82.call(this);_class7.prototype.__init83.call(this);_class7.prototype.__init84.call(this);_class7.prototype.__init85.call(this);_class7.prototype.__init86.call(this);_class7.prototype.__init87.call(this);_class7.prototype.__init88.call(this);_class7.prototype.__init89.call(this);_class7.prototype.__init90.call(this);_class7.prototype.__init91.call(this);_class7.prototype.__init92.call(this);_class7.prototype.__init93.call(this);_class7.prototype.__init94.call(this);_class7.prototype.__init95.call(this);_class7.prototype.__init96.call(this);_class7.prototype.__init97.call(this);_class7.prototype.__init98.call(this);_class7.prototype.__init99.call(this);_class7.prototype.__init100.call(this);_class7.prototype.__init101.call(this);_class7.prototype.__init102.call(this);_class7.prototype.__init103.call(this);_class7.prototype.__init104.call(this);_class7.prototype.__init105.call(this);_class7.prototype.__init106.call(this);_class7.prototype.__init107.call(this);_class7.prototype.__init108.call(this);_class7.prototype.__init109.call(this);_class7.prototype.__init110.call(this);_class7.prototype.__init111.call(this);_class7.prototype.__init112.call(this);_class7.prototype.__init113.call(this);_class7.prototype.__init114.call(this);_class7.prototype.__init115.call(this);_class7.prototype.__init116.call(this);_class7.prototype.__init117.call(this);_class7.prototype.__init118.call(this);_class7.prototype.__init119.call(this);_class7.prototype.__init120.call(this);_class7.prototype.__init121.call(this);_class7.prototype.__init122.call(this);_class7.prototype.__init123.call(this);_class7.prototype.__init124.call(this);_class7.prototype.__init125.call(this);_class7.prototype.__init126.call(this);_class7.prototype.__init127.call(this);_class7.prototype.__init128.call(this);_class7.prototype.__init129.call(this);_class7.prototype.__init130.call(this);_class7.prototype.__init131.call(this);_class7.prototype.__init132.call(this);_class7.prototype.__init133.call(this);_class7.prototype.__init134.call(this);_class7.prototype.__init135.call(this);_class7.prototype.__init136.call(this);_class7.prototype.__init137.call(this);_class7.prototype.__init138.call(this);_class7.prototype.__init139.call(this);_class7.prototype.__init140.call(this);_class7.prototype.__init141.call(this);_class7.prototype.__init142.call(this);_class7.prototype.__init143.call(this);_class7.prototype.__init144.call(this);_class7.prototype.__init145.call(this);_class7.prototype.__init146.call(this);_class7.prototype.__init147.call(this);_class7.prototype.__init148.call(this);_class7.prototype.__init149.call(this);_class7.prototype.__init150.call(this);_class7.prototype.__init151.call(this);_class7.prototype.__init152.call(this);_class7.prototype.__init153.call(this);_class7.prototype.__init154.call(this);_class7.prototype.__init155.call(this);_class7.prototype.__init156.call(this);_class7.prototype.__init157.call(this);_class7.prototype.__init158.call(this);_class7.prototype.__init159.call(this);_class7.prototype.__init160.call(this);_class7.prototype.__init161.call(this);_class7.prototype.__init162.call(this);_class7.prototype.__init163.call(this);_class7.prototype.__init164.call(this);_class7.prototype.__init165.call(this);_class7.prototype.__init166.call(this);_class7.prototype.__init167.call(this);_class7.prototype.__init168.call(this);_class7.prototype.__init169.call(this);
     this.canvas = canvas;
     this.debugA11y = _nullishCoalesce(options.debugA11y, () => ( false));
     this.disableWindowResize = _nullishCoalesce(options.disableWindowResize, () => ( false));
@@ -4107,6 +4166,7 @@ var Scene = (_class7 = class _Scene {
     if (node === this.root) {
       this.contentSemanticBudgetLeft = this.contentSemanticBudget;
       this.contentSemanticDeferred = false;
+      this._syncSerial++;
       this.contentSelectionPresentThisSync = null;
     }
     if (node.isDOMPortal) {
@@ -4546,6 +4606,26 @@ var Scene = (_class7 = class _Scene {
    * rejected by an ancestor clip box that itself overlaps the viewport would sit
    * transparently on top of whatever is really drawn there.
    */
+  /**
+   * Load `parent`'s world transform into the `_pw*` scalar memo.
+   *
+   * Exists so the settled-walk fast path costs no allocation. The walk visits a
+   * parent's children consecutively, so this recomputes at most once per parent
+   * per sync and is a serial + identity comparison for every child after the
+   * first. See the `_pwNode` field for why it is keyed the way it is.
+   */
+  readParentWorld(parent) {
+    if (this._pwNode === parent && this._pwSerial === this._syncSerial) return;
+    const tf = parent.getWorldTransform();
+    this._pwa = tf.a;
+    this._pwb = tf.b;
+    this._pwc = tf.c;
+    this._pwd = tf.d;
+    this._pwe = tf.e;
+    this._pwf = tf.f;
+    this._pwNode = parent;
+    this._pwSerial = this._syncSerial;
+  }
   projectionBoxVisible(node, tf, margin, viewportOnly = false) {
     if (!(node.width > 0 && node.height > 0)) return true;
     const { a, b, c, d, e, f } = tf;
@@ -4643,6 +4723,23 @@ var Scene = (_class7 = class _Scene {
   syncContentProjection(node) {
     if (!this.contentProjectionEnabled || !this.a11yRoot) return;
     let el = this.contentElements.get(node.id);
+    const prior0 = this.disableSettledFastPath ? void 0 : this.contentSyncState.get(node.id);
+    if (prior0 !== void 0 && el !== void 0) {
+      const epoch0 = node.getContentEpoch();
+      if (epoch0 !== null && prior0.epoch === epoch0 && prior0.fontEpoch === this.contentFontEpoch && prior0.viewportEpoch === this.contentViewportEpoch && prior0.lx === node.x && prior0.ly === node.y && prior0.lScaleX === node.scaleX && prior0.lScaleY === node.scaleY && prior0.lRotation === node.rotation && prior0.width === node.width && prior0.height === node.height && prior0.interactive === node.interactive) {
+        const parent = node.parent;
+        if (parent === null) {
+          if (prior0.pa === 1 && prior0.pb === 0 && prior0.pc === 0 && prior0.pd === 1 && prior0.pe === 0 && prior0.pf === 0) {
+            return;
+          }
+        } else {
+          this.readParentWorld(parent);
+          if (prior0.pa === this._pwa && prior0.pb === this._pwb && prior0.pc === this._pwc && prior0.pd === this._pwd && prior0.pe === this._pwe && prior0.pf === this._pwf) {
+            return;
+          }
+        }
+      }
+    }
     const releaseProjectionEl = () => {
       if (el) {
         this.clearContentGridState(node.id, el);
@@ -4826,6 +4923,28 @@ var Scene = (_class7 = class _Scene {
       const next = _nullishCoalesce(prior, () => ( {}));
       next.epoch = epoch;
       next.fontEpoch = this.contentFontEpoch;
+      next.viewportEpoch = this.contentViewportEpoch;
+      next.lx = node.x;
+      next.ly = node.y;
+      next.lScaleX = node.scaleX;
+      next.lScaleY = node.scaleY;
+      next.lRotation = node.rotation;
+      if (node.parent === null) {
+        next.pa = 1;
+        next.pb = 0;
+        next.pc = 0;
+        next.pd = 1;
+        next.pe = 0;
+        next.pf = 0;
+      } else {
+        this.readParentWorld(node.parent);
+        next.pa = this._pwa;
+        next.pb = this._pwb;
+        next.pc = this._pwc;
+        next.pd = this._pwd;
+        next.pe = this._pwe;
+        next.pf = this._pwf;
+      }
       next.a = a2;
       next.b = b2;
       next.c = c2;
@@ -5170,12 +5289,14 @@ var Scene = (_class7 = class _Scene {
     this.fullViewportElements.length = 0;
     this.normalElements.length = 0;
     this.activeIds.clear();
-    const collect = (node) => {
+    this.a11yOrderRegions.clear();
+    const collect = (node, region) => {
       if (node.isDOMPortal) return;
       const contentEl = this.contentElements.get(node.id);
       if (contentEl) {
         if (node.a11yFullViewport) this.fullViewportElements.push(contentEl);
         else this.normalElements.push(contentEl);
+        if (region) this.a11yOrderRegions.set(contentEl, region);
       }
       if (this.shouldProjectA11y(node)) {
         const el = this.a11yElements.get(node.id);
@@ -5183,14 +5304,16 @@ var Scene = (_class7 = class _Scene {
           this.activeIds.add(node.id);
           if (node.a11yFullViewport) this.fullViewportElements.push(el);
           else this.normalElements.push(el);
+          if (region) this.a11yOrderRegions.set(el, region);
         }
       }
-      for (const child of node.children) collect(child);
+      const childRegion = node.clipChildren && node.width > 0 && node.height > 0 ? node : region;
+      for (const child of node.children) collect(child, childRegion);
       if (node === this.root) {
-        for (const overlay of this.overlayRoot.children) collect(overlay);
+        for (const overlay of this.overlayRoot.children) collect(overlay, null);
       }
     };
-    collect(this.root);
+    collect(this.root, null);
     let elementsPruned = false;
     for (const [id, el] of this.a11yElements.entries()) {
       if (!this.activeIds.has(id)) {
@@ -5252,6 +5375,18 @@ var Scene = (_class7 = class _Scene {
    * parents, which no `insertBefore` ever acts on. Normalizing everything back
    * to world coordinates here would cost a transform per element per frame to
    * change nothing observable.
+   *
+   * Banding runs **per region** — per nearest `clipChildren` ancestor, recorded
+   * by {@link enforceA11yDomOrder}'s collect walk — rather than once over the
+   * whole scene. Purely visual banding is right for a screen reader but wrong
+   * for selection: a DOM `Selection` covers everything between anchor and focus
+   * in DOM order, so under one global banding a vertical drag through a
+   * transcript also swallowed a sidebar whose headings happened to fall in the
+   * same rows. Regions are laid out side by side, so ordering region-major keeps
+   * each one a contiguous DOM run and a drag stays inside it, while reading
+   * order *within* a region is unchanged. Regions are emitted in the order their
+   * clipper is first reached by the depth-first walk, so a screen reader still
+   * meets them in the author's declared order.
    */
   sortNormalElementsVisually() {
     const els = this.normalElements;
@@ -5279,30 +5414,40 @@ var Scene = (_class7 = class _Scene {
       }
       return { top, left };
     };
-    const order = els.map((el, i) => {
+    const decorated = els.map((el, i) => {
       const { top, left } = absolute(el);
       return { el, i, top, left, container: containers.has(el) };
     });
-    order.sort((p, q) => p.top - q.top || p.i - q.i);
+    const regions = this.a11yOrderRegions;
+    const buckets = /* @__PURE__ */ new Map();
+    for (const d of decorated) {
+      const key = _nullishCoalesce(regions.get(d.el), () => ( null));
+      const bucket = buckets.get(key);
+      if (bucket) bucket.push(d);
+      else buckets.set(key, [d]);
+    }
     const bandBottom = (r) => r.top + (r.container ? 4 : heightOf(r.el));
     const sorted = [];
-    let rowStart = 0;
-    let rowBottom = order.length ? bandBottom(order[0]) : 0;
-    const flushRow = (end) => {
-      const row = order.slice(rowStart, end);
-      row.sort((p, q) => (rtl ? q.left - p.left : p.left - q.left) || p.i - q.i);
-      for (const r of row) sorted.push(r.el);
-    };
-    for (let k = 1; k < order.length; k++) {
-      if (order[k].top < rowBottom) {
-        rowBottom = Math.max(rowBottom, bandBottom(order[k]));
-      } else {
-        flushRow(k);
-        rowStart = k;
-        rowBottom = bandBottom(order[k]);
+    for (const order of buckets.values()) {
+      order.sort((p, q) => p.top - q.top || p.i - q.i);
+      let rowStart = 0;
+      let rowBottom = order.length ? bandBottom(order[0]) : 0;
+      const flushRow = (end) => {
+        const row = order.slice(rowStart, end);
+        row.sort((p, q) => (rtl ? q.left - p.left : p.left - q.left) || p.i - q.i);
+        for (const r of row) sorted.push(r.el);
+      };
+      for (let k = 1; k < order.length; k++) {
+        if (order[k].top < rowBottom) {
+          rowBottom = Math.max(rowBottom, bandBottom(order[k]));
+        } else {
+          flushRow(k);
+          rowStart = k;
+          rowBottom = bandBottom(order[k]);
+        }
       }
+      flushRow(order.length);
     }
-    flushRow(order.length);
     for (let i = 0; i < sorted.length; i++) els[i] = sorted[i];
   }
   /** Keep DOM/WebGL overlay layers aligned with the canvas's CSS box. */
@@ -5931,6 +6076,7 @@ var Scene = (_class7 = class _Scene {
     this.width = width;
     this.height = height;
     this.contentFontEpoch++;
+    this.contentViewportEpoch++;
     if (typeof this.renderer.resize === "function") {
       if ("maxDPR" in this.renderer) this.renderer.maxDPR = this.maxDPR;
       this.renderer.resize(width, height);
@@ -6237,17 +6383,17 @@ var TextEntity = (_class8 = class extends _chunkTRT2TRCWjs.Entity {
   
   
   
-  __init158() {this.nodes = []}
+  __init170() {this.nodes = []}
   
-  __init159() {this.fillStyle = "#94a3b8"}
-  __init160() {this.strokeStyle = null}
-  __init161() {this.hoveredFillStyle = "#ffffff"}
-  __init162() {this.lineWidth = 1}
-  __init163() {this.isHovered = false}
+  __init171() {this.fillStyle = "#94a3b8"}
+  __init172() {this.strokeStyle = null}
+  __init173() {this.hoveredFillStyle = "#ffffff"}
+  __init174() {this.lineWidth = 1}
+  __init175() {this.isHovered = false}
   /** Bumped by {@link applyLayout}; read by `Scene` to skip an unchanged sync. */
-  __init164() {this.contentEpoch = 0}
+  __init176() {this.contentEpoch = 0}
   constructor(text, atlas, maxWidth, fontSize = 24) {
-    super();_class8.prototype.__init158.call(this);_class8.prototype.__init159.call(this);_class8.prototype.__init160.call(this);_class8.prototype.__init161.call(this);_class8.prototype.__init162.call(this);_class8.prototype.__init163.call(this);_class8.prototype.__init164.call(this);;
+    super();_class8.prototype.__init170.call(this);_class8.prototype.__init171.call(this);_class8.prototype.__init172.call(this);_class8.prototype.__init173.call(this);_class8.prototype.__init174.call(this);_class8.prototype.__init175.call(this);_class8.prototype.__init176.call(this);;
     this.text = text;
     this.atlas = atlas;
     this.fontSize = fontSize;
@@ -6366,15 +6512,15 @@ var TextEntity = (_class8 = class extends _chunkTRT2TRCWjs.Entity {
 // src/components/GridTextEntity.ts
 var GridTextEntity = (_class9 = class extends _chunkTRT2TRCWjs.Entity {
   
-  __init165() {this.fillStyle = "#ffffff"}
-  __init166() {this.grid = []}
+  __init177() {this.fillStyle = "#ffffff"}
+  __init178() {this.grid = []}
   // Array of rows
-  __init167() {this.cols = 0}
-  __init168() {this.rows = 0}
+  __init179() {this.cols = 0}
+  __init180() {this.rows = 0}
   
   
   constructor(_atlas, fontSize = 10) {
-    super();_class9.prototype.__init165.call(this);_class9.prototype.__init166.call(this);_class9.prototype.__init167.call(this);_class9.prototype.__init168.call(this);;
+    super();_class9.prototype.__init177.call(this);_class9.prototype.__init178.call(this);_class9.prototype.__init179.call(this);_class9.prototype.__init180.call(this);;
     this.fontSize = fontSize;
     this.charWidth = fontSize * 1;
     this.charHeight = fontSize * 1.1;
@@ -6466,23 +6612,23 @@ var SplineEntity = (_class10 = class extends _chunkTRT2TRCWjs.Entity {
   
   
   
-  __init169() {this.offscreen = null}
-  __init170() {this.baked = false}
+  __init181() {this.offscreen = null}
+  __init182() {this.baked = false}
   /** Logical (CSS-pixel) size of the baked bitmap — the blit destination size. */
-  __init171() {this.bakedWidth = 0}
-  __init172() {this.bakedHeight = 0}
+  __init183() {this.bakedWidth = 0}
+  __init184() {this.bakedHeight = 0}
   /** Gradient strokes can't be baked to a solid-color bitmap; they render per-frame. */
   
   /** Lazily-flattened polylines (one Float32Array of [x,y,...] per segment) for hit-testing. */
-  __init173() {this.polylines = null}
+  __init185() {this.polylines = null}
   /**
    * When `true`, the renderer draws a rounded-rect outline of the entity's
    * local bounds after painting the curves. Useful for drag feedback and
    * debugging hit areas. Defaults to `false`.
    */
-  __init174() {this.showBounds = false}
+  __init186() {this.showBounds = false}
   constructor(doc, opts = {}) {
-    super();_class10.prototype.__init169.call(this);_class10.prototype.__init170.call(this);_class10.prototype.__init171.call(this);_class10.prototype.__init172.call(this);_class10.prototype.__init173.call(this);_class10.prototype.__init174.call(this);;
+    super();_class10.prototype.__init181.call(this);_class10.prototype.__init182.call(this);_class10.prototype.__init183.call(this);_class10.prototype.__init184.call(this);_class10.prototype.__init185.call(this);_class10.prototype.__init186.call(this);;
     this.doc = doc;
     this.lineWidth = _nullishCoalesce(opts.lineWidth, () => ( 2));
     this.cache = _nullishCoalesce(opts.cache, () => ( true));
@@ -6863,19 +7009,19 @@ var _math = require('@vectojs/math'); _createStarExport(_math);
 // src/tree/DOMPortalEntity.ts
 var DOMPortalEntity = (_class11 = class extends _chunkTRT2TRCWjs.Entity {
   
-  __init175() {this.isDOMPortal = true}
-  __init176() {this.domListeners = []}
-  __init177() {this.resizeObserver = null}
-  __init178() {this.domBound = false}
-  __init179() {this.cachedWidth = 100}
-  __init180() {this.cachedHeight = 100}
-  __init181() {this.lastWidth = ""}
-  __init182() {this.lastHeight = ""}
-  __init183() {this.lastTransform = ""}
-  __init184() {this.lastZIndex = ""}
-  __init185() {this.lastOpacity = ""}
+  __init187() {this.isDOMPortal = true}
+  __init188() {this.domListeners = []}
+  __init189() {this.resizeObserver = null}
+  __init190() {this.domBound = false}
+  __init191() {this.cachedWidth = 100}
+  __init192() {this.cachedHeight = 100}
+  __init193() {this.lastWidth = ""}
+  __init194() {this.lastHeight = ""}
+  __init195() {this.lastTransform = ""}
+  __init196() {this.lastZIndex = ""}
+  __init197() {this.lastOpacity = ""}
   constructor(domElement, width, height, id) {
-    super(id);_class11.prototype.__init175.call(this);_class11.prototype.__init176.call(this);_class11.prototype.__init177.call(this);_class11.prototype.__init178.call(this);_class11.prototype.__init179.call(this);_class11.prototype.__init180.call(this);_class11.prototype.__init181.call(this);_class11.prototype.__init182.call(this);_class11.prototype.__init183.call(this);_class11.prototype.__init184.call(this);_class11.prototype.__init185.call(this);;
+    super(id);_class11.prototype.__init187.call(this);_class11.prototype.__init188.call(this);_class11.prototype.__init189.call(this);_class11.prototype.__init190.call(this);_class11.prototype.__init191.call(this);_class11.prototype.__init192.call(this);_class11.prototype.__init193.call(this);_class11.prototype.__init194.call(this);_class11.prototype.__init195.call(this);_class11.prototype.__init196.call(this);_class11.prototype.__init197.call(this);;
     this.domElement = domElement;
     this.width = _nullishCoalesce(width, () => ( 0));
     this.height = _nullishCoalesce(height, () => ( 0));

package/dist/index.mjs

@@ -1997,6 +1997,55 @@ var Scene = class _Scene {
   contentGridCalibrationStamp = "";
   /** Invalidates grid font calibration after browser font availability changes. */
   contentFontEpoch = 0;
+  /**
+   * Bumped whenever the viewport itself changes shape, which re-tiers blocks
+   * without moving any of them.
+   *
+   * The settled-walk fast path in {@link syncContentProjection} decides a block
+   * is unchanged from its own local transform plus its parent's world transform.
+   * Both are viewport-independent, so a resize alone would slip past it and leave
+   * every block holding DOM built for the old viewport — a block that should have
+   * been promoted to the fine tier keeping no carriers, or a demoted one keeping
+   * carriers it no longer needs. Scrolling needs no such epoch: it moves the root,
+   * so every block's parent world transform changes and the check fails honestly.
+   */
+  contentViewportEpoch = 0;
+  /**
+   * One-entry memo for a parent's world transform, held as scalars.
+   *
+   * The a11y walk visits all of one parent's children consecutively, so a
+   * one-entry memo hits for every child after the first — turning an
+   * O(children) sequence of `getWorldTransform()` calls, each of which
+   * allocates a fresh object on its cache-hit path
+   * ({@link Entity.getWorldTransform}), into one call per parent. Flattened to
+   * scalars rather than a cached object so the memo itself never allocates.
+   *
+   * Keyed on `(entity, syncSerial)`: the serial is bumped once per top-level
+   * sync, so a memo can never survive into a frame in which the parent has
+   * moved.
+   */
+  _pwNode = null;
+  _pwSerial = -1;
+  _pwa = 1;
+  _pwb = 0;
+  _pwc = 0;
+  _pwd = 1;
+  _pwe = 0;
+  _pwf = 0;
+  /** Incremented once per top-level `syncA11y`, invalidating `_pwNode`. */
+  _syncSerial = 0;
+  /**
+   * Disables the settled-walk fast path in {@link syncContentProjection}.
+   *
+   * Exists so a benchmark can measure both arms in ONE run on ONE commit, rather
+   * than comparing two builds and inheriting every difference between them. Also
+   * lets a test assert that a behaviour is genuinely unchanged by the fast path
+   * rather than merely unobserved.
+   *
+   * Not part of the public API and not documented as an option: turning it on only
+   * makes a settled document slower, never more correct.
+   */
+  disableSettledFastPath = false;
   /** Cached Canvas-to-client scale for the current font/viewport epoch. */
   contentMetricScaleEpoch = -1;
   contentMetricScaleX = 1;
@@ -2111,6 +2160,16 @@ var Scene = class _Scene {
    * see {@link sortNormalElementsVisually}.
    */
   a11yOrderContainers = /* @__PURE__ */ new Set();
+  /**
+   * Nearest `clipChildren` ancestor per ordered element — its *region* — reused
+   * per pass. Written by `enforceA11yDomOrder`'s collect walk, which already has
+   * the entity in hand, so a region costs one comparison per node rather than an
+   * ancestor walk per element.
+   *
+   * Absent means the element sits under no clipping ancestor and belongs to the
+   * implicit root region. See {@link sortNormalElementsVisually}.
+   */
+  a11yOrderRegions = /* @__PURE__ */ new Map();
   activePortalsThisFrame = /* @__PURE__ */ new Set();
   activePortalsPrevFrame = /* @__PURE__ */ new Set();
   portalEntities = /* @__PURE__ */ new Map();
@@ -4106,6 +4165,7 @@ var Scene = class _Scene {
     if (node === this.root) {
       this.contentSemanticBudgetLeft = this.contentSemanticBudget;
       this.contentSemanticDeferred = false;
+      this._syncSerial++;
       this.contentSelectionPresentThisSync = null;
     }
     if (node.isDOMPortal) {
@@ -4545,6 +4605,26 @@ var Scene = class _Scene {
    * rejected by an ancestor clip box that itself overlaps the viewport would sit
    * transparently on top of whatever is really drawn there.
    */
+  /**
+   * Load `parent`'s world transform into the `_pw*` scalar memo.
+   *
+   * Exists so the settled-walk fast path costs no allocation. The walk visits a
+   * parent's children consecutively, so this recomputes at most once per parent
+   * per sync and is a serial + identity comparison for every child after the
+   * first. See the `_pwNode` field for why it is keyed the way it is.
+   */
+  readParentWorld(parent) {
+    if (this._pwNode === parent && this._pwSerial === this._syncSerial) return;
+    const tf = parent.getWorldTransform();
+    this._pwa = tf.a;
+    this._pwb = tf.b;
+    this._pwc = tf.c;
+    this._pwd = tf.d;
+    this._pwe = tf.e;
+    this._pwf = tf.f;
+    this._pwNode = parent;
+    this._pwSerial = this._syncSerial;
+  }
   projectionBoxVisible(node, tf, margin, viewportOnly = false) {
     if (!(node.width > 0 && node.height > 0)) return true;
     const { a, b, c, d, e, f } = tf;
@@ -4642,6 +4722,23 @@ var Scene = class _Scene {
   syncContentProjection(node) {
     if (!this.contentProjectionEnabled || !this.a11yRoot) return;
     let el = this.contentElements.get(node.id);
+    const prior0 = this.disableSettledFastPath ? void 0 : this.contentSyncState.get(node.id);
+    if (prior0 !== void 0 && el !== void 0) {
+      const epoch0 = node.getContentEpoch();
+      if (epoch0 !== null && prior0.epoch === epoch0 && prior0.fontEpoch === this.contentFontEpoch && prior0.viewportEpoch === this.contentViewportEpoch && prior0.lx === node.x && prior0.ly === node.y && prior0.lScaleX === node.scaleX && prior0.lScaleY === node.scaleY && prior0.lRotation === node.rotation && prior0.width === node.width && prior0.height === node.height && prior0.interactive === node.interactive) {
+        const parent = node.parent;
+        if (parent === null) {
+          if (prior0.pa === 1 && prior0.pb === 0 && prior0.pc === 0 && prior0.pd === 1 && prior0.pe === 0 && prior0.pf === 0) {
+            return;
+          }
+        } else {
+          this.readParentWorld(parent);
+          if (prior0.pa === this._pwa && prior0.pb === this._pwb && prior0.pc === this._pwc && prior0.pd === this._pwd && prior0.pe === this._pwe && prior0.pf === this._pwf) {
+            return;
+          }
+        }
+      }
+    }
     const releaseProjectionEl = () => {
       if (el) {
         this.clearContentGridState(node.id, el);
@@ -4825,6 +4922,28 @@ var Scene = class _Scene {
       const next = prior ?? {};
       next.epoch = epoch;
       next.fontEpoch = this.contentFontEpoch;
+      next.viewportEpoch = this.contentViewportEpoch;
+      next.lx = node.x;
+      next.ly = node.y;
+      next.lScaleX = node.scaleX;
+      next.lScaleY = node.scaleY;
+      next.lRotation = node.rotation;
+      if (node.parent === null) {
+        next.pa = 1;
+        next.pb = 0;
+        next.pc = 0;
+        next.pd = 1;
+        next.pe = 0;
+        next.pf = 0;
+      } else {
+        this.readParentWorld(node.parent);
+        next.pa = this._pwa;
+        next.pb = this._pwb;
+        next.pc = this._pwc;
+        next.pd = this._pwd;
+        next.pe = this._pwe;
+        next.pf = this._pwf;
+      }
       next.a = a2;
       next.b = b2;
       next.c = c2;
@@ -5169,12 +5288,14 @@ var Scene = class _Scene {
     this.fullViewportElements.length = 0;
     this.normalElements.length = 0;
     this.activeIds.clear();
-    const collect = (node) => {
+    this.a11yOrderRegions.clear();
+    const collect = (node, region) => {
       if (node.isDOMPortal) return;
       const contentEl = this.contentElements.get(node.id);
       if (contentEl) {
         if (node.a11yFullViewport) this.fullViewportElements.push(contentEl);
         else this.normalElements.push(contentEl);
+        if (region) this.a11yOrderRegions.set(contentEl, region);
       }
       if (this.shouldProjectA11y(node)) {
         const el = this.a11yElements.get(node.id);
@@ -5182,14 +5303,16 @@ var Scene = class _Scene {
           this.activeIds.add(node.id);
           if (node.a11yFullViewport) this.fullViewportElements.push(el);
           else this.normalElements.push(el);
+          if (region) this.a11yOrderRegions.set(el, region);
         }
       }
-      for (const child of node.children) collect(child);
+      const childRegion = node.clipChildren && node.width > 0 && node.height > 0 ? node : region;
+      for (const child of node.children) collect(child, childRegion);
       if (node === this.root) {
-        for (const overlay of this.overlayRoot.children) collect(overlay);
+        for (const overlay of this.overlayRoot.children) collect(overlay, null);
       }
     };
-    collect(this.root);
+    collect(this.root, null);
     let elementsPruned = false;
     for (const [id, el] of this.a11yElements.entries()) {
       if (!this.activeIds.has(id)) {
@@ -5251,6 +5374,18 @@ var Scene = class _Scene {
    * parents, which no `insertBefore` ever acts on. Normalizing everything back
    * to world coordinates here would cost a transform per element per frame to
    * change nothing observable.
+   *
+   * Banding runs **per region** — per nearest `clipChildren` ancestor, recorded
+   * by {@link enforceA11yDomOrder}'s collect walk — rather than once over the
+   * whole scene. Purely visual banding is right for a screen reader but wrong
+   * for selection: a DOM `Selection` covers everything between anchor and focus
+   * in DOM order, so under one global banding a vertical drag through a
+   * transcript also swallowed a sidebar whose headings happened to fall in the
+   * same rows. Regions are laid out side by side, so ordering region-major keeps
+   * each one a contiguous DOM run and a drag stays inside it, while reading
+   * order *within* a region is unchanged. Regions are emitted in the order their
+   * clipper is first reached by the depth-first walk, so a screen reader still
+   * meets them in the author's declared order.
    */
   sortNormalElementsVisually() {
     const els = this.normalElements;
@@ -5278,30 +5413,40 @@ var Scene = class _Scene {
       }
       return { top, left };
     };
-    const order = els.map((el, i) => {
+    const decorated = els.map((el, i) => {
       const { top, left } = absolute(el);
       return { el, i, top, left, container: containers.has(el) };
     });
-    order.sort((p, q) => p.top - q.top || p.i - q.i);
+    const regions = this.a11yOrderRegions;
+    const buckets = /* @__PURE__ */ new Map();
+    for (const d of decorated) {
+      const key = regions.get(d.el) ?? null;
+      const bucket = buckets.get(key);
+      if (bucket) bucket.push(d);
+      else buckets.set(key, [d]);
+    }
     const bandBottom = (r) => r.top + (r.container ? 4 : heightOf(r.el));
     const sorted = [];
-    let rowStart = 0;
-    let rowBottom = order.length ? bandBottom(order[0]) : 0;
-    const flushRow = (end) => {
-      const row = order.slice(rowStart, end);
-      row.sort((p, q) => (rtl ? q.left - p.left : p.left - q.left) || p.i - q.i);
-      for (const r of row) sorted.push(r.el);
-    };
-    for (let k = 1; k < order.length; k++) {
-      if (order[k].top < rowBottom) {
-        rowBottom = Math.max(rowBottom, bandBottom(order[k]));
-      } else {
-        flushRow(k);
-        rowStart = k;
-        rowBottom = bandBottom(order[k]);
+    for (const order of buckets.values()) {
+      order.sort((p, q) => p.top - q.top || p.i - q.i);
+      let rowStart = 0;
+      let rowBottom = order.length ? bandBottom(order[0]) : 0;
+      const flushRow = (end) => {
+        const row = order.slice(rowStart, end);
+        row.sort((p, q) => (rtl ? q.left - p.left : p.left - q.left) || p.i - q.i);
+        for (const r of row) sorted.push(r.el);
+      };
+      for (let k = 1; k < order.length; k++) {
+        if (order[k].top < rowBottom) {
+          rowBottom = Math.max(rowBottom, bandBottom(order[k]));
+        } else {
+          flushRow(k);
+          rowStart = k;
+          rowBottom = bandBottom(order[k]);
+        }
       }
+      flushRow(order.length);
     }
-    flushRow(order.length);
     for (let i = 0; i < sorted.length; i++) els[i] = sorted[i];
   }
   /** Keep DOM/WebGL overlay layers aligned with the canvas's CSS box. */
@@ -5930,6 +6075,7 @@ var Scene = class _Scene {
     this.width = width;
     this.height = height;
     this.contentFontEpoch++;
+    this.contentViewportEpoch++;
     if (typeof this.renderer.resize === "function") {
       if ("maxDPR" in this.renderer) this.renderer.maxDPR = this.maxDPR;
       this.renderer.resize(width, height);

package/dist/tree/Scene.d.ts

@@ -623,6 +623,55 @@ export declare class Scene {
     private contentGridCalibrationStamp;
     /** Invalidates grid font calibration after browser font availability changes. */
     private contentFontEpoch;
+    /**
+     * Bumped whenever the viewport itself changes shape, which re-tiers blocks
+     * without moving any of them.
+     *
+     * The settled-walk fast path in {@link syncContentProjection} decides a block
+     * is unchanged from its own local transform plus its parent's world transform.
+     * Both are viewport-independent, so a resize alone would slip past it and leave
+     * every block holding DOM built for the old viewport — a block that should have
+     * been promoted to the fine tier keeping no carriers, or a demoted one keeping
+     * carriers it no longer needs. Scrolling needs no such epoch: it moves the root,
+     * so every block's parent world transform changes and the check fails honestly.
+     */
+    private contentViewportEpoch;
+    /**
+     * One-entry memo for a parent's world transform, held as scalars.
+     *
+     * The a11y walk visits all of one parent's children consecutively, so a
+     * one-entry memo hits for every child after the first — turning an
+     * O(children) sequence of `getWorldTransform()` calls, each of which
+     * allocates a fresh object on its cache-hit path
+     * ({@link Entity.getWorldTransform}), into one call per parent. Flattened to
+     * scalars rather than a cached object so the memo itself never allocates.
+     *
+     * Keyed on `(entity, syncSerial)`: the serial is bumped once per top-level
+     * sync, so a memo can never survive into a frame in which the parent has
+     * moved.
+     */
+    private _pwNode;
+    private _pwSerial;
+    private _pwa;
+    private _pwb;
+    private _pwc;
+    private _pwd;
+    private _pwe;
+    private _pwf;
+    /** Incremented once per top-level `syncA11y`, invalidating `_pwNode`. */
+    private _syncSerial;
+    /**
+     * Disables the settled-walk fast path in {@link syncContentProjection}.
+     *
+     * Exists so a benchmark can measure both arms in ONE run on ONE commit, rather
+     * than comparing two builds and inheriting every difference between them. Also
+     * lets a test assert that a behaviour is genuinely unchanged by the fast path
+     * rather than merely unobserved.
+     *
+     * Not part of the public API and not documented as an option: turning it on only
+     * makes a settled document slower, never more correct.
+     */
+    disableSettledFastPath: boolean;
     /** Cached Canvas-to-client scale for the current font/viewport epoch. */
     private contentMetricScaleEpoch;
     private contentMetricScaleX;
@@ -719,6 +768,16 @@ export declare class Scene {
      * see {@link sortNormalElementsVisually}.
      */
     private a11yOrderContainers;
+    /**
+     * Nearest `clipChildren` ancestor per ordered element — its *region* — reused
+     * per pass. Written by `enforceA11yDomOrder`'s collect walk, which already has
+     * the entity in hand, so a region costs one comparison per node rather than an
+     * ancestor walk per element.
+     *
+     * Absent means the element sits under no clipping ancestor and belongs to the
+     * implicit root region. See {@link sortNormalElementsVisually}.
+     */
+    private a11yOrderRegions;
     private activePortalsThisFrame;
     private activePortalsPrevFrame;
     private portalEntities;
@@ -1551,6 +1610,15 @@ export declare class Scene {
      * rejected by an ancestor clip box that itself overlaps the viewport would sit
      * transparently on top of whatever is really drawn there.
      */
+    /**
+     * Load `parent`'s world transform into the `_pw*` scalar memo.
+     *
+     * Exists so the settled-walk fast path costs no allocation. The walk visits a
+     * parent's children consecutively, so this recomputes at most once per parent
+     * per sync and is a serial + identity comparison for every child after the
+     * first. See the `_pwNode` field for why it is keyed the way it is.
+     */
+    private readParentWorld;
     private projectionBoxVisible;
     /**
      * The band of an entity's own y coordinates that is worth projecting, or
@@ -1609,6 +1677,18 @@ export declare class Scene {
      * parents, which no `insertBefore` ever acts on. Normalizing everything back
      * to world coordinates here would cost a transform per element per frame to
      * change nothing observable.
+     *
+     * Banding runs **per region** — per nearest `clipChildren` ancestor, recorded
+     * by {@link enforceA11yDomOrder}'s collect walk — rather than once over the
+     * whole scene. Purely visual banding is right for a screen reader but wrong
+     * for selection: a DOM `Selection` covers everything between anchor and focus
+     * in DOM order, so under one global banding a vertical drag through a
+     * transcript also swallowed a sidebar whose headings happened to fall in the
+     * same rows. Regions are laid out side by side, so ordering region-major keeps
+     * each one a contiguous DOM run and a drag stays inside it, while reading
+     * order *within* a region is unchanged. Regions are emitted in the order their
+     * clipper is first reached by the depth-first walk, so a screen reader still
+     * meets them in the author's declared order.
      */
     private sortNormalElementsVisually;
     /** Keep DOM/WebGL overlay layers aligned with the canvas's CSS box. */

package/package.json

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