@woosh/meep-engine 3.14.4 → 3.14.6

package/src/shade/renderer/scene/SkinnedMesh.js

@@ -31,6 +31,17 @@ import { Mesh } from "./Mesh.js";
  * see {@link chunk_skin_blend_mesh_local} for why it goes into each
  * matrix rather than onto the blended position.
  *
+ * **`transform_global` on a skinned mesh is the engine's, not the
+ * asset's.** It cancels out of the rendered position, so glTF declares
+ * it meaningless — and the one meaning it does have is the frame the
+ * clone's vertices are written in, which the fold above requires to be
+ * rigid against the skin. {@link GPUAnimationManager#register_skin}
+ * therefore overwrites it, by way of
+ * {@link skin_normalize_mesh_frame}, with the skin's own bind
+ * transform. Whatever the file put there is discarded, and anything
+ * reading this expecting the file's value is reading the wrong thing.
+ * See `renderer/animation/SKINNING_FRAME_PLAN.md`.
+ *
  * The mesh's **skin id** — a row in a GPU table — lives in
  * {@link GPUMeshSkinningContext} and nowhere else. The CPU-side
  * {@link Skin} it was registered with is a different thing, pure data

package/src/shade/renderer/shader/chunk/geometry/quaternion/dual/chunk_dual_quat_from_m4.d.ts

@@ -1,7 +1,37 @@
 /**
- * @see https://github.com/KosRud/DQ-skinning-for-Unity/blob/9d096e2db57677f0f67a823432f8b735ad622404/Code/DQ%20skinning/Shaders/Compute/DQ.cginc#L59
- * @see http://www.euclideanspace.com/maths/geometry/rotations/conversions/matrixToQuaternion/index.htm
- * Alternative Method by Christian
+ * A rigid transform as a dual quaternion: the rotation in the real part, the translation carried in
+ * the dual part as `0.5 · t · real`.
+ *
+ * The matrix's upper 3×3 is read as a rotation and its fourth column as a translation. Anything else
+ * in the matrix — a scale, a shear — has nowhere to go, and comes back as neither itself nor a
+ * warning: see {@link m4_rigidity_defect} for the number that says so and
+ * `renderer/animation/SKINNING_FRAME_PLAN.md` for the frame arrangement that keeps a skinning
+ * matrix rigid in the first place.
+ *
+ * ## Why the rotation goes through `quat_from_m3`
+ *
+ * This used to take all four quaternion components as `sqrt(max(0, 1 ± m00 ± m11 ± m22)) · 0.5` and
+ * recover their signs from the off-diagonal differences. That is exact in exact arithmetic and
+ * badly conditioned in floating point: near the identity three of those radicands are near zero, and
+ * a square root turns an input error of `e` into an output error of `sqrt(e)`. A matrix that is the
+ * identity to `1e-6` — which is what a skin's folded joint matrices are at bind pose — yielded
+ * quaternion components off by `9e-4`, an angular error of `1.8e-3` radians, and a millimetre and a
+ * half of vertex displacement on a 1.66 m character. Measured, on `Michelle.glb`.
+ *
+ * {@link chunk_quat_from_m3} is Shoemake's branch-picking form: it computes whichever component the
+ * matrix's diagonal says is largest, and derives the other three from it by division. Every branch
+ * divides by at least 2, so the components come out **linear** in the input error rather than as its
+ * square root — the same `1e-6` matrix now gives `2.5e-7`, three and a half orders better — and the
+ * near-180° case, where the trace form is ill-conditioned for the opposite reason, is a branch of its
+ * own. One `sqrt` and a reciprocal where there were four `sqrt`s.
+ *
+ * The normalize stays, on top of that. It is a no-op for the orthonormal input this is meant to be
+ * given; what it earns its rsqrt for is the input that is not — a degenerate 3×3 leaves
+ * `quat_from_m3` on a branch whose answer has length 0.5, and this is what keeps the documented
+ * postcondition, a unit real part, true anyway.
+ *
+ * @see https://gitlab.com/libeigen/eigen/-/blob/master/Eigen/src/Geometry/Quaternion.h#L813
+ * @type {CodeChunk}
  */
 export const chunk_dual_quat_from_m4: CodeChunk;
 import { CodeChunk } from "../../../../compiler/CodeChunk.js";

package/src/shade/renderer/shader/chunk/geometry/quaternion/dual/chunk_dual_quat_from_m4.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chunk_dual_quat_from_m4.d.ts","sourceRoot":"","sources":["../../../../../../../../../src/shade/renderer/shader/chunk/geometry/quaternion/dual/chunk_dual_quat_from_m4.js"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,gDA2BC;0BApCyB,mCAAmC"}
+{"version":3,"file":"chunk_dual_quat_from_m4.d.ts","sourceRoot":"","sources":["../../../../../../../../../src/shade/renderer/shader/chunk/geometry/quaternion/dual/chunk_dual_quat_from_m4.js"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,sCAFU,SAAS,CAoBlB;0BAzDyB,mCAAmC"}

package/src/shade/renderer/shader/chunk/geometry/quaternion/dual/chunk_dual_quat_from_m4.js

@@ -1,37 +1,58 @@
-import { CodeChunk } from "../../../../compiler/CodeChunk.js";
-import { chunk_sign_not_zero } from "../../../math/chunk_sign_not_zero.js";
-import { chunk_quat_multiply } from "../chunk_quat_multiply.js";
-
-/**
- * @see https://github.com/KosRud/DQ-skinning-for-Unity/blob/9d096e2db57677f0f67a823432f8b735ad622404/Code/DQ%20skinning/Shaders/Compute/DQ.cginc#L59
- * @see http://www.euclideanspace.com/maths/geometry/rotations/conversions/matrixToQuaternion/index.htm
- * Alternative Method by Christian
- */
-export const chunk_dual_quat_from_m4 = CodeChunk.from(
-    //language=WGSL
-    `
-fn dual_quat_from_m4(m: mat4x4<f32>) -> mat2x4<f32> {
-
-    var dq: mat2x4<f32>;
-
-    dq[0].w = sqrt(max(0, 1.0 + m[0][0] + m[1][1] + m[2][2])) * 0.5;
-	dq[0].x = sqrt(max(0, 1.0 + m[0][0] - m[1][1] - m[2][2])) * 0.5;
-	dq[0].y = sqrt(max(0, 1.0 - m[0][0] + m[1][1] - m[2][2])) * 0.5;
-	dq[0].z = sqrt(max(0, 1.0 - m[0][0] - m[1][1] + m[2][2])) * 0.5;
-	
-	dq[0].x *= sign_not_zero(m[1][2] - m[2][1]);
-	dq[0].y *= sign_not_zero(m[2][0] - m[0][2]);
-	dq[0].z *= sign_not_zero(m[0][1] - m[1][0]);
-
-	dq[0] = normalize(dq[0]);	// ensure unit quaternion
-
-	dq[1] = vec4(m[3][0], m[3][1], m[3][2], 0);
-	dq[1] = quat_multiply(dq[1], dq[0]) * 0.5;
-
-    return dq;
-}
-    `,[
-        chunk_quat_multiply,
-        chunk_sign_not_zero
-    ]
-)
+import { CodeChunk } from "../../../../compiler/CodeChunk.js";
+import { chunk_quat_from_m3 } from "../chunk_quat_from_m3.js";
+import { chunk_quat_multiply } from "../chunk_quat_multiply.js";
+
+/**
+ * A rigid transform as a dual quaternion: the rotation in the real part, the translation carried in
+ * the dual part as `0.5 · t · real`.
+ *
+ * The matrix's upper 3×3 is read as a rotation and its fourth column as a translation. Anything else
+ * in the matrix — a scale, a shear — has nowhere to go, and comes back as neither itself nor a
+ * warning: see {@link m4_rigidity_defect} for the number that says so and
+ * `renderer/animation/SKINNING_FRAME_PLAN.md` for the frame arrangement that keeps a skinning
+ * matrix rigid in the first place.
+ *
+ * ## Why the rotation goes through `quat_from_m3`
+ *
+ * This used to take all four quaternion components as `sqrt(max(0, 1 ± m00 ± m11 ± m22)) · 0.5` and
+ * recover their signs from the off-diagonal differences. That is exact in exact arithmetic and
+ * badly conditioned in floating point: near the identity three of those radicands are near zero, and
+ * a square root turns an input error of `e` into an output error of `sqrt(e)`. A matrix that is the
+ * identity to `1e-6` — which is what a skin's folded joint matrices are at bind pose — yielded
+ * quaternion components off by `9e-4`, an angular error of `1.8e-3` radians, and a millimetre and a
+ * half of vertex displacement on a 1.66 m character. Measured, on `Michelle.glb`.
+ *
+ * {@link chunk_quat_from_m3} is Shoemake's branch-picking form: it computes whichever component the
+ * matrix's diagonal says is largest, and derives the other three from it by division. Every branch
+ * divides by at least 2, so the components come out **linear** in the input error rather than as its
+ * square root — the same `1e-6` matrix now gives `2.5e-7`, three and a half orders better — and the
+ * near-180° case, where the trace form is ill-conditioned for the opposite reason, is a branch of its
+ * own. One `sqrt` and a reciprocal where there were four `sqrt`s.
+ *
+ * The normalize stays, on top of that. It is a no-op for the orthonormal input this is meant to be
+ * given; what it earns its rsqrt for is the input that is not — a degenerate 3×3 leaves
+ * `quat_from_m3` on a branch whose answer has length 0.5, and this is what keeps the documented
+ * postcondition, a unit real part, true anyway.
+ *
+ * @see https://gitlab.com/libeigen/eigen/-/blob/master/Eigen/src/Geometry/Quaternion.h#L813
+ * @type {CodeChunk}
+ */
+export const chunk_dual_quat_from_m4 = CodeChunk.from(
+    //language=WGSL
+    `
+fn dual_quat_from_m4(m: mat4x4<f32>) -> mat2x4<f32> {
+
+    var dq: mat2x4<f32>;
+
+    dq[0] = normalize(quat_from_m3(mat3x3<f32>(m[0].xyz, m[1].xyz, m[2].xyz)));
+
+	dq[1] = vec4(m[3][0], m[3][1], m[3][2], 0);
+	dq[1] = quat_multiply(dq[1], dq[0]) * 0.5;
+
+    return dq;
+}
+    `, [
+        chunk_quat_from_m3,
+        chunk_quat_multiply,
+    ]
+)

package/src/shade/wgsl/emulator/CPUBitmapData.d.ts

@@ -139,7 +139,7 @@ export class CPUBitmapData {
      * to decide what `textureDimensions` should return.
      * @returns {1 | 2 | 3}
      */
-    get dimensionality(): 2 | 1 | 3;
+    get dimensionality(): 1 | 2 | 3;
     /**
      * Linear element index of the first channel of pixel `(x, y, z)`.
      * Caller is responsible for bounds checking.

package/src/view/DOM.d.ts

@@ -0,0 +1,69 @@
+export default domify;
+export function DOM(argument: any, namespace: any): this;
+export class DOM {
+    constructor(argument: any, namespace: any);
+    /**
+     *
+     * @type {Element}
+     */
+    el: Element;
+    /**
+     *
+     * @param {string} [elName=div]
+     * @returns {DOM}
+     */
+    createChild(elName?: string): DOM;
+    append(child: any): this;
+    remove(child: any): this;
+    text(text: any): this;
+    /**
+     *
+     * @param {string} querySelector
+     * @returns {DOM|null}
+     */
+    select(querySelector: string): DOM | null;
+    /**
+     *
+     * @param {string} name
+     * @returns {DOM}
+     */
+    addClass(name: string): DOM;
+    removeClass(name: any): this;
+    /**
+     *
+     * @param {string} name
+     * @param {boolean} flag
+     * @returns {DOM}
+     */
+    setClass(name: string, flag: boolean): DOM;
+    css(hash: any): this;
+    attr(hash: any): this;
+    clone(): DOM;
+    /**
+     * removes all children
+     * @returns {DOM}
+     */
+    clear(): DOM;
+    /**
+     *
+     * @param eventName
+     * @param handler
+     * @returns {DOM}
+     */
+    on(eventName: any, handler: any): DOM;
+    /**
+     *
+     * @param eventName
+     * @param handler
+     * @returns {DOM}
+     */
+    off(eventName: any, handler: any): DOM;
+}
+/**
+ *
+ * @param {String|Element} [x=div]
+ * @param {String} [namespace]
+ * @returns {DOM}
+ */
+declare function domify(x?: string | Element, namespace?: string): DOM;
+//# sourceMappingURL=DOM.d.ts.map

package/src/view/DOM.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DOM.d.ts","sourceRoot":"","sources":["../../../src/view/DOM.js"],"names":[],"mappings":";AACA,yDAoBC;;IApBD,2CAoBC;IANG;;;OAGG;IACH,IAFU,OAAO,CAEL;IAIhB;;;;OAIG;IACH,qBAHW,MAAM,GACJ,GAAG,CAMf;IAaD,yBAIC;IACD,yBAIC;IAED,sBAGC;IAED;;;;OAIG;IACH,sBAHW,MAAM,GACJ,GAAG,GAAC,IAAI,CAUpB;IAED;;;;OAIG;IACH,eAHW,MAAM,GACJ,GAAG,CAKf;IAED,6BAGC;IAED;;;;;OAKG;IACH,eAJW,MAAM,QACN,OAAO,GACL,GAAG,CAMf;IAED,qBAOC;IAED,sBAQC;IAED,aAEC;IAED;;;OAGG;IACH,SAFa,GAAG,CAQf;IAED;;;;;OAKG;IACH,kCAFa,GAAG,CAMf;IACD;;;;;OAKG;IACH,mCAFa,GAAG,CAMf;;AAED;;;;;GAKG;AACH,4BAJW,SAAO,OAAO,uBAEZ,GAAG,CAIf"}

package/src/view/DOM.js

@@ -1,5 +1,5 @@
 
-const DOM = function (argument, namespace) {
+function DOM(argument, namespace) {
     let el;
     if (typeof argument === "string") {
         if (namespace === undefined) {
@@ -169,4 +169,5 @@ function domify(x, namespace) {
     return new DOM(x, namespace);
 }
 
+export { DOM };
 export default domify;

package/src/view/common/LocalizedLabelView.d.ts

@@ -0,0 +1,50 @@
+/**
+ * @extends View
+ */
+export class LocalizedLabelView extends View {
+    /**
+     *
+     * @param {string} id
+     * @param {object} [seed]
+     * @param {Localization} [localization]
+     * @param {string[]} [classList]
+     * @param {GMLEngine} [gml] if supplied, string will be compiled first
+     * @param {string} [tag=div] HTML element tag
+     */
+    constructor({ id, seed, localization, classList, gml, tag }: string);
+    /**
+     * @private
+     * @type {Localization}
+     */
+    private localization;
+    /**
+     *
+     * @type {GMLEngine}
+     */
+    gml: GMLEngine;
+    /**
+     *
+     * @type {Object}
+     */
+    seed: any;
+    /**
+     *
+     * @type {string}
+     */
+    key: string;
+    $el: import("../DOM.js").DOM;
+    el: Element;
+    needsUpdate: boolean;
+    /**
+     * Cached locale key
+     * @type {String}
+     * @private
+     */
+    private __localeKey;
+    updateLocale(): void;
+    setLocalization(localization: any): void;
+    setKey(key: any): void;
+    update(): void;
+}
+import View from "../View.js";
+//# sourceMappingURL=LocalizedLabelView.d.ts.map

package/src/view/common/LocalizedLabelView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LocalizedLabelView.d.ts","sourceRoot":"","sources":["../../../../src/view/common/LocalizedLabelView.js"],"names":[],"mappings":"AAIA;;GAEG;AACH;IACI;;;;;;;;OAQG;IACH,6DAPW,MAAM,EAoEhB;IAxDG;;;OAGG;IACH,qBAAwB;IAExB;;;OAGG;IACH,eAAc;IAEd;;;OAGG;IACH,UAAgB;IAEhB;;;OAGG;IACH,KAFU,MAAM,CAEH;IAKb,6BAAc;IAEd,YAAgB;IAKhB,qBAAuB;IAavB;;;;OAIG;IACH,oBAAuB;IAM3B,qBAOC;IAED,yCAeC;IAED,uBAaC;IAED,eAgCC;CACJ;iBAxJgB,YAAY"}

package/src/view/controller/controls/GuiControl.d.ts

@@ -0,0 +1,19 @@
+export default GuiControl;
+declare class GuiControl extends View {
+    dRoot: import("../../DOM.js").DOM;
+    el: Element;
+    model: ObservedValue;
+    /**
+     * @template {T}
+     * @param {string} text
+     * @param {T} control
+     * @returns {T}
+     */
+    addLabeledControlVertical(text: string, control: T): T;
+}
+declare namespace GuiControl {
+    let CSS_CLASS_NAME: string;
+}
+import View from '../../View.js';
+import ObservedValue from '../../../core/model/ObservedValue.js';
+//# sourceMappingURL=GuiControl.d.ts.map

package/src/view/controller/controls/GuiControl.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GuiControl.d.ts","sourceRoot":"","sources":["../../../../../src/view/controller/controls/GuiControl.js"],"names":[],"mappings":";AAKA;IAOQ,kCAAkB;IAClB,YAAkB;IAElB,qBAAoC;IAGxC;;;;;OAKG;IACH,gCAJW,MAAM,iBAahB;CACJ;;;;iBA/BgB,eAAe;0BAHN,sCAAsC"}

package/src/view/elements/FrameRateView.d.ts

@@ -0,0 +1,45 @@
+/**
+ * A frame-rate readout: one number, updated twice a second.
+ *
+ * This replaces `stats.js`, which the engine used to pull in for the same job.
+ * That package was declared `optional` in `peerDependenciesMeta` and imported
+ * unconditionally at the top of {@link EngineHarness}, so *evaluating* the
+ * module that is in practice this engine's entry point required an optional
+ * dependency whether or not a counter was ever asked for. Under Vite — where a
+ * consumer must exclude a ~6000-module package from dependency pre-bundling,
+ * which also stops the scanner discovering that package's own CommonJS
+ * dependencies — the result was a module-evaluation failure naming a package
+ * the application had never referenced, and a blank page. Reported from a port
+ * as GAP-003.
+ *
+ * A graph was never the point. The number is.
+ *
+ * The counter binds itself: pass the signal that fires once per rendered frame
+ * and the binding is linked and unlinked with the view, so removing it from the
+ * view stack stops the work.
+ *
+ * @author Alex Goldring
+ * @copyright Company Named Limited (c) 2026
+ */
+export class FrameRateView extends EmptyView {
+    /**
+     * @param {Object} [options]
+     * @param {Signal} [options.frame_signal] fires once per rendered frame;
+     * typically `engine.graphics.on.postRender`. Bound for the lifetime of the
+     * view's link, so it stops counting when the view leaves the stack.
+     */
+    constructor({ frame_signal }?: {
+        frame_signal?: Signal;
+    });
+    /**
+     * Count one frame, and refresh the readout if the window has closed.
+     *
+     * Safe to call directly — a caller driving its own loop can use this
+     * instead of handing a signal to the constructor.
+     */
+    sample(): void;
+    #private;
+}
+export type Signal = import("../../core/events/signal/Signal.js").default;
+import EmptyView from "./EmptyView.js";
+//# sourceMappingURL=FrameRateView.d.ts.map

package/src/view/elements/FrameRateView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FrameRateView.d.ts","sourceRoot":"","sources":["../../../../src/view/elements/FrameRateView.js"],"names":[],"mappings":"AAcA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH;IAiCI;;;;;OAKG;IACH;QAJ4B,YAAY,GAA7B,MAAM;OAuBhB;IAED;;;;;OAKG;IACH,eA0BC;;CACJ;qBA/HY,OAAO,oCAAoC,EAAE,OAAO;sBAH3C,gBAAgB"}

package/src/view/elements/FrameRateView.js

@@ -0,0 +1,131 @@
+import EmptyView from "./EmptyView.js";
+
+/**
+ * @typedef {import("../../core/events/signal/Signal.js").default} Signal
+ */
+
+/**
+ * How long a sample window is. Short enough to react to a stall, long enough
+ * that the number is readable rather than a blur — a per-frame readout is a
+ * counter nobody can actually read.
+ * @type {number}
+ */
+const WINDOW_MILLISECONDS = 500;
+
+/**
+ * A frame-rate readout: one number, updated twice a second.
+ *
+ * This replaces `stats.js`, which the engine used to pull in for the same job.
+ * That package was declared `optional` in `peerDependenciesMeta` and imported
+ * unconditionally at the top of {@link EngineHarness}, so *evaluating* the
+ * module that is in practice this engine's entry point required an optional
+ * dependency whether or not a counter was ever asked for. Under Vite — where a
+ * consumer must exclude a ~6000-module package from dependency pre-bundling,
+ * which also stops the scanner discovering that package's own CommonJS
+ * dependencies — the result was a module-evaluation failure naming a package
+ * the application had never referenced, and a blank page. Reported from a port
+ * as GAP-003.
+ *
+ * A graph was never the point. The number is.
+ *
+ * The counter binds itself: pass the signal that fires once per rendered frame
+ * and the binding is linked and unlinked with the view, so removing it from the
+ * view stack stops the work.
+ *
+ * @author Alex Goldring
+ * @copyright Company Named Limited (c) 2026
+ */
+export class FrameRateView extends EmptyView {
+    /**
+     * Frames counted since the window opened.
+     * @private
+     * @type {number}
+     */
+    #frames = 0;
+
+    /**
+     * When the current window opened, on the same clock the samples are taken
+     * against.
+     * @private
+     * @type {number}
+     */
+    #window_opened = 0;
+
+    /**
+     * Whether a window is open at all. A separate flag rather than a sentinel
+     * value in {@link #window_opened}, because `performance.now()` legitimately
+     * returns 0 on the first call in a fresh context and a zero sentinel would
+     * then re-open the window instead of counting the frame.
+     * @private
+     * @type {boolean}
+     */
+    #counting = false;
+
+    /**
+     * Last value written to the DOM, so an unchanged rate costs no write.
+     * @private
+     * @type {number}
+     */
+    #displayed = -1;
+
+    /**
+     * @param {Object} [options]
+     * @param {Signal} [options.frame_signal] fires once per rendered frame;
+     * typically `engine.graphics.on.postRender`. Bound for the lifetime of the
+     * view's link, so it stops counting when the view leaves the stack.
+     */
+    constructor({ frame_signal } = {}) {
+        super({ classList: ["frame-rate-view"] });
+
+        this.css({
+            position: "absolute",
+            left: 0,
+            top: 0,
+            padding: "2px 6px",
+            font: "12px monospace",
+            color: "#fff",
+            background: "rgba(0,0,0,0.5)",
+            pointerEvents: "none"
+        });
+
+        this.el.textContent = "--";
+
+        if (frame_signal !== undefined) {
+            this.bindSignal(frame_signal, this.sample, this);
+        }
+    }
+
+    /**
+     * Count one frame, and refresh the readout if the window has closed.
+     *
+     * Safe to call directly — a caller driving its own loop can use this
+     * instead of handing a signal to the constructor.
+     */
+    sample() {
+        const now = performance.now();
+
+        if (!this.#counting) {
+            this.#counting = true;
+            this.#window_opened = now;
+            return;
+        }
+
+        this.#frames++;
+
+        const elapsed = now - this.#window_opened;
+
+        if (elapsed < WINDOW_MILLISECONDS) {
+            return;
+        }
+
+        const rate = Math.round((this.#frames * 1000) / elapsed);
+
+        if (rate !== this.#displayed) {
+            this.el.textContent = `${rate} FPS`;
+            this.#displayed = rate;
+        }
+
+        this.#frames = 0;
+        this.#window_opened = now;
+    }
+}

package/src/view/elements/SliderView.d.ts

@@ -0,0 +1,37 @@
+/**
+ * A bounded numeric control, bound to a {@link Vector1}.
+ *
+ * The two most common controls on any graphics menu ever shipped are a field of view between 60 and
+ * 130 in steps of 1, and a render scale between 0.5 and 2 in steps of 0.05. The kit had
+ * `CheckboxView`, `DropDownSelectionView`, `ColorPickerView`, a progress bar and a radial menu, and
+ * no bounded numeric input of any kind — no range, no slider, no spinner, no stepper. The nearest
+ * thing in the package was `dat.GUI`, which is a peer dependency for exactly that reason.
+ *
+ * Reported from a port as GAP-025, where it was rebuilt in forty lines. This is the same forty
+ * lines, in the same shape as {@link CheckboxView} — which is thirty lines wrapping
+ * `<input type="checkbox">` and binding an `ObservedBoolean`. The observation the entry actually
+ * made is that the same thirty lines for the *other* input type were not in the package.
+ *
+ * @author Alex Goldring
+ * @copyright Company Named Limited (c) 2026
+ */
+export class SliderView extends View {
+    /**
+     * @param {Object} options
+     * @param {Vector1} options.value the model. Written on input, and followed while linked.
+     * @param {number} [options.min]
+     * @param {number} [options.max]
+     * @param {number} [options.step] the granularity. `0` means "any value the browser will give
+     * you", which is what `<input type="range">` calls `any`.
+     */
+    constructor({ value, min, max, step }: {
+        value: Vector1;
+        min?: number;
+        max?: number;
+        step?: number;
+    });
+    el: HTMLInputElement;
+    #private;
+}
+import View from "../View.js";
+//# sourceMappingURL=SliderView.d.ts.map

package/src/view/elements/SliderView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderView.d.ts","sourceRoot":"","sources":["../../../../src/view/elements/SliderView.js"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AACH;IAUI;;;;;;;OAOG;IACH;QAN4B,KAAK;QACL,GAAG,GAApB,MAAM;QACW,GAAG,GAApB,MAAM;QACW,IAAI,GAArB,MAAM;OAmChB;IA7BG,qBAAyC;;CA8BhD;iBAtEgB,YAAY"}

package/src/view/elements/SliderView.js

@@ -0,0 +1,71 @@
+import View from "../View.js";
+
+/**
+ * A bounded numeric control, bound to a {@link Vector1}.
+ *
+ * The two most common controls on any graphics menu ever shipped are a field of view between 60 and
+ * 130 in steps of 1, and a render scale between 0.5 and 2 in steps of 0.05. The kit had
+ * `CheckboxView`, `DropDownSelectionView`, `ColorPickerView`, a progress bar and a radial menu, and
+ * no bounded numeric input of any kind — no range, no slider, no spinner, no stepper. The nearest
+ * thing in the package was `dat.GUI`, which is a peer dependency for exactly that reason.
+ *
+ * Reported from a port as GAP-025, where it was rebuilt in forty lines. This is the same forty
+ * lines, in the same shape as {@link CheckboxView} — which is thirty lines wrapping
+ * `<input type="checkbox">` and binding an `ObservedBoolean`. The observation the entry actually
+ * made is that the same thirty lines for the *other* input type were not in the package.
+ *
+ * @author Alex Goldring
+ * @copyright Company Named Limited (c) 2026
+ */
+export class SliderView extends View {
+    /**
+     * Guards the round trip. Writing the model updates the element, which does NOT raise `input` --
+     * but a caller may well write the model from inside its own `onChanged` handler, and without
+     * this the two would chase each other through the rounding the step imposes.
+     * @private
+     * @type {boolean}
+     */
+    #writing = false;
+
+    /**
+     * @param {Object} options
+     * @param {Vector1} options.value the model. Written on input, and followed while linked.
+     * @param {number} [options.min]
+     * @param {number} [options.max]
+     * @param {number} [options.step] the granularity. `0` means "any value the browser will give
+     * you", which is what `<input type="range">` calls `any`.
+     */
+    constructor({ value, min = 0, max = 1, step = 0 }) {
+        super();
+
+        this.el = document.createElement("input");
+        this.el.setAttribute("type", "range");
+        this.el.setAttribute("min", String(min));
+        this.el.setAttribute("max", String(max));
+        this.el.setAttribute("step", step === 0 ? "any" : String(step));
+
+        this.addClass("slider-view");
+
+        this.el.addEventListener("input", () => {
+            if (this.#writing) {
+                return;
+            }
+
+            const v = this.el.valueAsNumber;
+
+            if (Number.isFinite(v)) {
+                value.set(v);
+            }
+        });
+
+        const display = (v) => {
+            this.#writing = true;
+            this.el.value = String(v);
+            this.#writing = false;
+        };
+
+        this.on.linked.add(() => display(value.getValue()));
+
+        this.bindSignal(value.onChanged, display);
+    }
+}

package/src/view/elements/navigation/ViewStack.d.ts

@@ -13,7 +13,7 @@ export class ViewStack extends View {
     private updateActiveFrameSize;
     /**
      * @private
-     * @param {int} index
+     * @param {number} index
      */
     private setActiveFrame;
     /**

package/src/view/elements/navigation/ViewStack.js

@@ -79,7 +79,7 @@ export class ViewStack extends View {
 
     /**
      * @private
-     * @param {int} index
+     * @param {number} index
      */
     setActiveFrame(index) {
         const stack = this.__stack;