@mentra/miniapp 3.2.1-beta.315 → 3.2.1-beta.354

package/dist/react/stream-preview/transport.js

@@ -0,0 +1,209 @@
+/**
+ * The two ways raw frames reach this WebView, behind one interface.
+ *
+ * iOS has no way to hand a WebView binary without a copy through JavaScriptCore, so it gets a
+ * loopback WebSocket. Android has `WebViewCompat.addWebMessageListener`, which delivers an
+ * ArrayBuffer to a JS object the native side installs on `window`. Which one is in use is decided
+ * by the host's config, never by the page.
+ *
+ * Reconnection is not here. Every failure is surfaced with its own reason and `PreviewConnection`
+ * decides whether to handshake again.
+ */
+import { previewTrace, previewTraceWarn } from "./trace";
+/** Carries the machine-readable reason so a caller does not have to match on message text. */
+export class PreviewTransportError extends Error {
+    constructor(reason) {
+        super(reason);
+        this.name = "PreviewTransportError";
+        this.reason = reason;
+    }
+}
+/** Used when an older host config omits `portName`. */
+export const DEFAULT_PREVIEW_PORT_NAME = "MentraFramePreviewPort";
+/** `{t:"ack",gen,seq}` — the one message the consumer sends per frame. */
+export function ackMessage(gen, seq) {
+    return JSON.stringify({ t: "ack", gen, seq });
+}
+function helloMessage(token) {
+    return JSON.stringify({ t: "hello", token });
+}
+/** iOS: a loopback WebSocket from the native host. */
+export class WebSocketTransport {
+    constructor(url, token) {
+        this.url = url;
+        this.token = token;
+        this.socket = null;
+        this.binaryHandler = null;
+        this.errorHandler = null;
+        this.opened = false;
+        this.closed = false;
+    }
+    connect() {
+        return new Promise((resolve, reject) => {
+            let socket;
+            try {
+                socket = new WebSocket(this.url);
+            }
+            catch (error) {
+                previewTraceWarn("transport_error", {
+                    transport: "websocket",
+                    reason: "websocket_unavailable",
+                    error: error instanceof Error ? error.message : String(error),
+                });
+                reject(new PreviewTransportError("websocket_unavailable"));
+                return;
+            }
+            socket.binaryType = "arraybuffer";
+            this.socket = socket;
+            socket.onopen = () => {
+                this.opened = true;
+                try {
+                    // `connect()` must not resolve before the host knows who we are, or the first frames
+                    // would race the hello and be dropped by the sender as unauthenticated.
+                    socket.send(helloMessage(this.token));
+                }
+                catch {
+                    this.fail("hello_send_failed");
+                    reject(new PreviewTransportError("hello_send_failed"));
+                    return;
+                }
+                previewTrace("transport_open", { transport: "websocket" });
+                resolve();
+            };
+            socket.onmessage = (event) => {
+                // Text frames are not this channel: control lives on the `_preview` UI channel.
+                if (event.data instanceof ArrayBuffer)
+                    this.binaryHandler?.(event.data);
+            };
+            socket.onerror = () => {
+                const reason = this.opened ? "websocket_error" : "websocket_connect_error";
+                this.fail(reason);
+                if (!this.opened)
+                    reject(new PreviewTransportError(reason));
+            };
+            socket.onclose = (event) => {
+                const reason = this.opened ? `websocket_closed:${event.code}` : `websocket_closed_before_open:${event.code}`;
+                this.fail(reason);
+                if (!this.opened)
+                    reject(new PreviewTransportError(reason));
+            };
+        });
+    }
+    onBinary(cb) {
+        this.binaryHandler = cb;
+    }
+    onError(cb) {
+        this.errorHandler = cb;
+    }
+    sendText(json) {
+        const socket = this.socket;
+        if (!socket || socket.readyState !== WebSocket.OPEN) {
+            this.fail("send_while_closed");
+            return;
+        }
+        try {
+            socket.send(json);
+        }
+        catch {
+            this.fail("send_failed");
+        }
+    }
+    close() {
+        this.closed = true;
+        const socket = this.socket;
+        this.socket = null;
+        if (!socket)
+            return;
+        socket.onopen = null;
+        socket.onmessage = null;
+        socket.onerror = null;
+        socket.onclose = null;
+        try {
+            socket.close();
+        }
+        catch {
+            // A socket that never opened throws here on some engines; the transport is gone either way.
+        }
+    }
+    fail(reason) {
+        // A close the caller asked for is not a failure.
+        if (this.closed)
+            return;
+        this.errorHandler?.(reason);
+    }
+}
+/** Android: the JS object native installs with `WebViewCompat.addWebMessageListener`. */
+export class WebMessagePortTransport {
+    constructor(token, portName = DEFAULT_PREVIEW_PORT_NAME) {
+        this.token = token;
+        this.portName = portName;
+        this.port = null;
+        this.binaryHandler = null;
+        this.errorHandler = null;
+        this.closed = false;
+        this.listener = (event) => {
+            if (event.data instanceof ArrayBuffer) {
+                this.binaryHandler?.(event.data);
+                return;
+            }
+            if (typeof event.data !== "string")
+                this.report("port_unexpected_payload");
+        };
+    }
+    connect() {
+        const port = typeof window === "undefined"
+            ? undefined
+            : window[this.portName];
+        if (!port)
+            return Promise.reject(new PreviewTransportError("port_missing"));
+        this.port = port;
+        port.addEventListener("message", this.listener);
+        try {
+            port.postMessage(helloMessage(this.token));
+        }
+        catch {
+            return Promise.reject(new PreviewTransportError("hello_send_failed"));
+        }
+        previewTrace("transport_open", { transport: "webmessage" });
+        return Promise.resolve();
+    }
+    onBinary(cb) {
+        this.binaryHandler = cb;
+    }
+    onError(cb) {
+        this.errorHandler = cb;
+    }
+    sendText(json) {
+        const port = this.port;
+        if (!port) {
+            this.report("send_while_closed");
+            return;
+        }
+        try {
+            port.postMessage(json);
+        }
+        catch {
+            this.report("send_failed");
+        }
+    }
+    close() {
+        this.closed = true;
+        this.port?.removeEventListener?.("message", this.listener);
+        this.port = null;
+    }
+    report(reason) {
+        if (this.closed)
+            return;
+        this.errorHandler?.(reason);
+    }
+}
+/** Build the transport the host asked for. The page never picks on its own. */
+export function createPreviewTransport(transport, options) {
+    if (transport === "websocket") {
+        if (!options.url)
+            throw new PreviewTransportError("missing_url");
+        return new WebSocketTransport(options.url, options.token);
+    }
+    return new WebMessagePortTransport(options.token, options.portName);
+}
+//# sourceMappingURL=transport.js.map

package/dist/react/stream-preview/transport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transport.js","sourceRoot":"","sources":["../../../src/react/stream-preview/transport.ts"],"names":[],"mappings":"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"}

package/dist/react/stream-preview/yuvRenderer.d.ts

@@ -0,0 +1,31 @@
+/**
+ * WebGL1 YUV → RGB renderer for raw preview frames.
+ *
+ * WebGL1 only, on purpose: the Mentra App supports iOS 15.5 / Safari 15, where WebGL2, WebCodecs,
+ * `VideoFrame` and `OffscreenCanvas` are either absent or unreliable. Everything here is the
+ * 2013 feature set — `LUMINANCE` textures, one draw call, a fragment shader doing the colour
+ * conversion.
+ *
+ * Rules:
+ *   - JavaScript never touches a pixel. Planes go to `texImage2D`/`texSubImage2D` as views.
+ *   - `readPixels` is never called; it would stall the pipeline.
+ *   - `drawFrame` times the SUBMIT, not the paint. See the comment on that method.
+ */
+import type { ParsedFrame } from "./protocol";
+/** `contain` letterboxes; `cover` fills the canvas and crops the overflow. Never stretches. */
+export type PreviewFit = "contain" | "cover";
+export interface YuvRendererOptions {
+    /** Context loss, a failed compile, a failed upload: anything that makes the canvas stop. */
+    onError?: (reason: string) => void;
+    fit?: PreviewFit;
+}
+export interface YuvRenderer {
+    /** False once the GL context is lost, until it is restored. */
+    readonly alive: boolean;
+    setFit(fit: PreviewFit): void;
+    drawFrame(frame: ParsedFrame): number | null;
+    dispose(): void;
+}
+/** Create the renderer, or null when this WebView has no WebGL1 context to give. */
+export declare function createYuvRenderer(canvas: HTMLCanvasElement, options?: YuvRendererOptions): YuvRenderer | null;
+//# sourceMappingURL=yuvRenderer.d.ts.map

package/dist/react/stream-preview/yuvRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"yuvRenderer.d.ts","sourceRoot":"","sources":["../../../src/react/stream-preview/yuvRenderer.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,WAAW,EAA4D,MAAM,YAAY,CAAA;AA6EtG,+FAA+F;AAC/F,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,CAAA;AAE5C,MAAM,WAAW,kBAAkB;IACjC,4FAA4F;IAC5F,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,GAAG,CAAC,EAAE,UAAU,CAAA;CACjB;AAED,MAAM,WAAW,WAAW;IAC1B,+DAA+D;IAC/D,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;IACvB,MAAM,CAAC,GAAG,EAAE,UAAU,GAAG,IAAI,CAAA;IAC7B,SAAS,CAAC,KAAK,EAAE,WAAW,GAAG,MAAM,GAAG,IAAI,CAAA;IAC5C,OAAO,IAAI,IAAI,CAAA;CAChB;AAwUD,oFAAoF;AACpF,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,iBAAiB,EAAE,OAAO,GAAE,kBAAuB,GAAG,WAAW,GAAG,IAAI,CAiBjH"}

package/dist/react/stream-preview/yuvRenderer.js

@@ -0,0 +1,398 @@
+/**
+ * WebGL1 YUV → RGB renderer for raw preview frames.
+ *
+ * WebGL1 only, on purpose: the Mentra App supports iOS 15.5 / Safari 15, where WebGL2, WebCodecs,
+ * `VideoFrame` and `OffscreenCanvas` are either absent or unreliable. Everything here is the
+ * 2013 feature set — `LUMINANCE` textures, one draw call, a fragment shader doing the colour
+ * conversion.
+ *
+ * Rules:
+ *   - JavaScript never touches a pixel. Planes go to `texImage2D`/`texSubImage2D` as views.
+ *   - `readPixels` is never called; it would stall the pipeline.
+ *   - `drawFrame` times the SUBMIT, not the paint. See the comment on that method.
+ */
+import { previewTrace, previewTraceWarn } from "./trace";
+const VERTEX_SHADER = `
+attribute vec2 aPosition;
+attribute vec2 aTexCoord;
+uniform mat2 uTransform;
+varying vec2 vTexCoord;
+void main() {
+  gl_Position = vec4(uTransform * aPosition, 0.0, 1.0);
+  vTexCoord = aTexCoord;
+}
+`;
+/**
+ * `uCoeff` is (Cr→R, Cb→G, Cr→G, Cb→B) for the frame's matrix; `uYOffset`/`uYScale`/`uCScale`
+ * carry the range. Both are uniforms rather than shader variants so a stream that switches
+ * colour metadata mid-run does not force a recompile.
+ */
+function fragmentShader(format) {
+    const chroma = format === "nv12"
+        ? `uniform sampler2D uUv;
+vec2 chromaSample() {
+  vec4 texel = texture2D(uUv, vTexCoord);
+  return vec2(texel.r, texel.a);
+}`
+        : `uniform sampler2D uU;
+uniform sampler2D uV;
+vec2 chromaSample() {
+  return vec2(texture2D(uU, vTexCoord).r, texture2D(uV, vTexCoord).r);
+}`;
+    return `
+#ifdef GL_FRAGMENT_PRECISION_HIGH
+precision highp float;
+#else
+precision mediump float;
+#endif
+varying vec2 vTexCoord;
+uniform sampler2D uY;
+uniform float uYOffset;
+uniform float uYScale;
+uniform float uCScale;
+uniform vec4 uCoeff;
+${chroma}
+void main() {
+  float y = (texture2D(uY, vTexCoord).r - uYOffset) * uYScale;
+  vec2 c = (chromaSample() - 0.5019608) * uCScale;
+  vec3 rgb = vec3(
+    y + uCoeff.x * c.y,
+    y + uCoeff.y * c.x + uCoeff.z * c.y,
+    y + uCoeff.w * c.x);
+  gl_FragColor = vec4(clamp(rgb, 0.0, 1.0), 1.0);
+}
+`;
+}
+/** Standard BT.601 and BT.709 conversion coefficients, as (Cr→R, Cb→G, Cr→G, Cb→B). */
+const MATRIX_COEFFICIENTS = {
+    bt601: [1.402, -0.344136, -0.714136, 1.772],
+    bt709: [1.5748, -0.187324, -0.468124, 1.8556],
+};
+/** Limited range is Y 16..235 and chroma 16..240; full range uses the whole byte. */
+const RANGE_SCALES = {
+    limited: { yOffset: 16 / 255, yScale: 255 / 219, cScale: 255 / 224 },
+    full: { yOffset: 0, yScale: 1, cScale: 1 },
+};
+/** Clockwise quarter turns, as exact cos/sin so 90° stays 90°. */
+const ROTATIONS = [
+    { cos: 1, sin: 0 },
+    { cos: 0, sin: 1 },
+    { cos: -1, sin: 0 },
+    { cos: 0, sin: -1 },
+];
+const POSITIONS = new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]);
+// v = 0 is the first uploaded row, which is the top of the image, so it maps to NDC y = +1.
+const TEX_COORDS = new Float32Array([0, 1, 1, 1, 0, 0, 1, 0]);
+class WebGlYuvRenderer {
+    constructor(canvas, gl, options) {
+        this.canvas = canvas;
+        this.gl = gl;
+        this.options = options;
+        this.programs = new Map();
+        this.textures = new Map();
+        this.positionBuffer = null;
+        this.texCoordBuffer = null;
+        this.layout = null;
+        this.lost = false;
+        this.onContextLost = (event) => {
+            // Without preventDefault the context is never restored, and the canvas would stay black for
+            // the rest of the document.
+            event.preventDefault();
+            this.lost = true;
+            this.programs.clear();
+            this.textures.clear();
+            this.positionBuffer = null;
+            this.texCoordBuffer = null;
+            this.layout = null;
+            previewTraceWarn("webgl_context_lost");
+            this.options.onError?.("webgl_context_lost");
+        };
+        this.onContextRestored = () => {
+            // Everything was invalidated by the loss; the next frame rebuilds it lazily.
+            this.lost = false;
+            previewTrace("webgl_context_restored");
+        };
+        this.fit = options.fit ?? "contain";
+        canvas.addEventListener("webglcontextlost", this.onContextLost);
+        canvas.addEventListener("webglcontextrestored", this.onContextRestored);
+    }
+    get alive() {
+        return !this.lost && !this.gl.isContextLost();
+    }
+    setFit(fit) {
+        this.fit = fit;
+    }
+    /**
+     * Upload the planes and submit one draw.
+     *
+     * The returned number is how long the SUBMIT took: uploads plus `drawArrays`, measured with
+     * `performance.now()`. It is NOT presentation latency and not a frame time — GL is asynchronous
+     * and the pixels reach the screen some unknown time later. Proving presentation would need
+     * `readPixels` or a fence, and both change what they measure.
+     *
+     * Returns null when there is no usable context.
+     */
+    drawFrame(frame) {
+        if (!this.alive)
+            return null;
+        const gl = this.gl;
+        const startedAt = performance.now();
+        const bundle = this.programFor(frame.pixelFormat);
+        if (!bundle)
+            return null;
+        this.syncDrawingBuffer();
+        gl.useProgram(bundle.program);
+        // Tight packing: every plane row starts on a byte boundary, which the default alignment of 4
+        // would get wrong for any odd width.
+        gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
+        const reallocate = !this.layout ||
+            this.layout.width !== frame.width ||
+            this.layout.height !== frame.height ||
+            this.layout.format !== frame.pixelFormat;
+        if (reallocate && this.layout && this.layout.format !== frame.pixelFormat)
+            this.dropChromaTextures();
+        if (frame.pixelFormat === "nv12") {
+            if (!this.upload("y", 0, gl.LUMINANCE, frame.width, frame.height, frame.y, reallocate))
+                return null;
+            if (!this.upload("uv", 1, gl.LUMINANCE_ALPHA, frame.chromaWidth, frame.chromaHeight, frame.uv, reallocate)) {
+                return null;
+            }
+        }
+        else {
+            if (!this.upload("y", 0, gl.LUMINANCE, frame.width, frame.height, frame.y, reallocate))
+                return null;
+            if (!this.upload("u", 1, gl.LUMINANCE, frame.chromaWidth, frame.chromaHeight, frame.u, reallocate))
+                return null;
+            if (!this.upload("v", 2, gl.LUMINANCE, frame.chromaWidth, frame.chromaHeight, frame.v, reallocate))
+                return null;
+        }
+        if (reallocate) {
+            this.layout = { width: frame.width, height: frame.height, format: frame.pixelFormat };
+            this.bindSamplers(bundle, frame.pixelFormat);
+        }
+        const coefficients = MATRIX_COEFFICIENTS[frame.colorMatrix];
+        const range = RANGE_SCALES[frame.colorRange];
+        gl.uniform1f(bundle.uYOffset, range.yOffset);
+        gl.uniform1f(bundle.uYScale, range.yScale);
+        gl.uniform1f(bundle.uCScale, range.cScale);
+        gl.uniform4f(bundle.uCoeff, coefficients[0], coefficients[1], coefficients[2], coefficients[3]);
+        gl.uniformMatrix2fv(bundle.uTransform, false, this.transformFor(frame));
+        gl.clearColor(0, 0, 0, 1);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+        gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+        return performance.now() - startedAt;
+    }
+    dispose() {
+        this.canvas.removeEventListener("webglcontextlost", this.onContextLost);
+        this.canvas.removeEventListener("webglcontextrestored", this.onContextRestored);
+        const gl = this.gl;
+        if (!gl.isContextLost()) {
+            for (const texture of this.textures.values())
+                gl.deleteTexture(texture);
+            for (const bundle of this.programs.values())
+                gl.deleteProgram(bundle.program);
+            if (this.positionBuffer)
+                gl.deleteBuffer(this.positionBuffer);
+            if (this.texCoordBuffer)
+                gl.deleteBuffer(this.texCoordBuffer);
+        }
+        this.textures.clear();
+        this.programs.clear();
+        this.positionBuffer = null;
+        this.texCoordBuffer = null;
+        this.layout = null;
+    }
+    /** Scale the rotated frame to contain or cover the canvas without ever stretching it. */
+    transformFor(frame) {
+        const { cos, sin } = ROTATIONS[frame.rotationQuarters] ?? ROTATIONS[0];
+        const quarterTurned = frame.rotationQuarters % 2 === 1;
+        const frameWidth = quarterTurned ? frame.height : frame.width;
+        const frameHeight = quarterTurned ? frame.width : frame.height;
+        const canvasAspect = this.canvas.width / Math.max(1, this.canvas.height);
+        const frameAspect = frameWidth / Math.max(1, frameHeight);
+        let scaleX = 1;
+        let scaleY = 1;
+        const frameIsWider = frameAspect > canvasAspect;
+        if (this.fit === "cover") {
+            if (frameIsWider)
+                scaleX = frameAspect / canvasAspect;
+            else
+                scaleY = canvasAspect / frameAspect;
+        }
+        else if (frameIsWider)
+            scaleY = canvasAspect / frameAspect;
+        else
+            scaleX = frameAspect / canvasAspect;
+        // Column-major for uniformMatrix2fv: scale ∘ clockwise rotation.
+        return new Float32Array([scaleX * cos, -scaleY * sin, scaleX * sin, scaleY * cos]);
+    }
+    syncDrawingBuffer() {
+        const canvas = this.canvas;
+        const ratio = Math.min(typeof window === "undefined" ? 1 : window.devicePixelRatio || 1, 2);
+        const width = Math.max(1, Math.round((canvas.clientWidth || canvas.width) * ratio));
+        const height = Math.max(1, Math.round((canvas.clientHeight || canvas.height) * ratio));
+        if (canvas.width !== width || canvas.height !== height) {
+            canvas.width = width;
+            canvas.height = height;
+        }
+        this.gl.viewport(0, 0, canvas.width, canvas.height);
+    }
+    upload(key, unit, format, width, height, pixels, reallocate) {
+        const gl = this.gl;
+        let texture = this.textures.get(key);
+        if (!texture) {
+            const created = gl.createTexture();
+            if (!created) {
+                this.options.onError?.("texture_allocation_failed");
+                return false;
+            }
+            texture = created;
+            this.textures.set(key, texture);
+            gl.activeTexture(gl.TEXTURE0 + unit);
+            gl.bindTexture(gl.TEXTURE_2D, texture);
+            // No mipmaps and CLAMP_TO_EDGE, which is what WebGL1 requires for non-power-of-two sizes.
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+            gl.texImage2D(gl.TEXTURE_2D, 0, format, width, height, 0, format, gl.UNSIGNED_BYTE, pixels);
+            return true;
+        }
+        gl.activeTexture(gl.TEXTURE0 + unit);
+        gl.bindTexture(gl.TEXTURE_2D, texture);
+        // Reallocating every frame is the classic way to make a renderer look slower than it is.
+        if (reallocate)
+            gl.texImage2D(gl.TEXTURE_2D, 0, format, width, height, 0, format, gl.UNSIGNED_BYTE, pixels);
+        else
+            gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, width, height, format, gl.UNSIGNED_BYTE, pixels);
+        return true;
+    }
+    /** A format switch leaves the other layout's chroma textures allocated; drop them. */
+    dropChromaTextures() {
+        for (const key of ["u", "v", "uv"]) {
+            const texture = this.textures.get(key);
+            if (!texture)
+                continue;
+            this.gl.deleteTexture(texture);
+            this.textures.delete(key);
+        }
+    }
+    bindSamplers(bundle, format) {
+        const gl = this.gl;
+        gl.uniform1i(gl.getUniformLocation(bundle.program, "uY"), 0);
+        if (format === "nv12") {
+            gl.uniform1i(gl.getUniformLocation(bundle.program, "uUv"), 1);
+            return;
+        }
+        gl.uniform1i(gl.getUniformLocation(bundle.program, "uU"), 1);
+        gl.uniform1i(gl.getUniformLocation(bundle.program, "uV"), 2);
+    }
+    programFor(format) {
+        const existing = this.programs.get(format);
+        if (existing) {
+            this.bindGeometry(existing);
+            return existing;
+        }
+        const gl = this.gl;
+        const program = this.link(VERTEX_SHADER, fragmentShader(format));
+        if (!program)
+            return null;
+        const bundle = {
+            program,
+            aPosition: gl.getAttribLocation(program, "aPosition"),
+            aTexCoord: gl.getAttribLocation(program, "aTexCoord"),
+            uTransform: gl.getUniformLocation(program, "uTransform"),
+            uYOffset: gl.getUniformLocation(program, "uYOffset"),
+            uYScale: gl.getUniformLocation(program, "uYScale"),
+            uCScale: gl.getUniformLocation(program, "uCScale"),
+            uCoeff: gl.getUniformLocation(program, "uCoeff"),
+        };
+        this.programs.set(format, bundle);
+        gl.useProgram(program);
+        this.bindSamplers(bundle, format);
+        this.bindGeometry(bundle);
+        return bundle;
+    }
+    bindGeometry(bundle) {
+        const gl = this.gl;
+        if (!this.positionBuffer) {
+            this.positionBuffer = gl.createBuffer();
+            gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer);
+            gl.bufferData(gl.ARRAY_BUFFER, POSITIONS, gl.STATIC_DRAW);
+        }
+        gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer);
+        gl.enableVertexAttribArray(bundle.aPosition);
+        gl.vertexAttribPointer(bundle.aPosition, 2, gl.FLOAT, false, 0, 0);
+        if (!this.texCoordBuffer) {
+            this.texCoordBuffer = gl.createBuffer();
+            gl.bindBuffer(gl.ARRAY_BUFFER, this.texCoordBuffer);
+            gl.bufferData(gl.ARRAY_BUFFER, TEX_COORDS, gl.STATIC_DRAW);
+        }
+        gl.bindBuffer(gl.ARRAY_BUFFER, this.texCoordBuffer);
+        gl.enableVertexAttribArray(bundle.aTexCoord);
+        gl.vertexAttribPointer(bundle.aTexCoord, 2, gl.FLOAT, false, 0, 0);
+    }
+    link(vertexSource, fragmentSource) {
+        const gl = this.gl;
+        const vertex = this.compile(gl.VERTEX_SHADER, vertexSource);
+        const fragment = this.compile(gl.FRAGMENT_SHADER, fragmentSource);
+        if (!vertex || !fragment)
+            return null;
+        const program = gl.createProgram();
+        if (!program) {
+            this.options.onError?.("program_allocation_failed");
+            return null;
+        }
+        gl.attachShader(program, vertex);
+        gl.attachShader(program, fragment);
+        gl.linkProgram(program);
+        // The shaders are owned by the program once linked; keeping them alive leaks on every restore.
+        gl.deleteShader(vertex);
+        gl.deleteShader(fragment);
+        if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+            const log = gl.getProgramInfoLog(program) ?? "";
+            gl.deleteProgram(program);
+            previewTraceWarn("webgl_program_link_failed", { log: log.slice(0, 120) });
+            this.options.onError?.(`program_link_failed: ${log.slice(0, 120)}`);
+            return null;
+        }
+        return program;
+    }
+    compile(type, source) {
+        const gl = this.gl;
+        const shader = gl.createShader(type);
+        if (!shader) {
+            this.options.onError?.("shader_allocation_failed");
+            return null;
+        }
+        gl.shaderSource(shader, source);
+        gl.compileShader(shader);
+        if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+            const log = gl.getShaderInfoLog(shader) ?? "";
+            gl.deleteShader(shader);
+            previewTraceWarn("webgl_shader_compile_failed", { log: log.slice(0, 120) });
+            this.options.onError?.(`shader_compile_failed: ${log.slice(0, 120)}`);
+            return null;
+        }
+        return shader;
+    }
+}
+/** Create the renderer, or null when this WebView has no WebGL1 context to give. */
+export function createYuvRenderer(canvas, options = {}) {
+    const attributes = {
+        alpha: false,
+        antialias: false,
+        depth: false,
+        stencil: false,
+        preserveDrawingBuffer: false,
+        powerPreference: "low-power",
+    };
+    const gl = canvas.getContext("webgl", attributes) ??
+        canvas.getContext("experimental-webgl", attributes);
+    if (!gl) {
+        options.onError?.("webgl_unavailable");
+        return null;
+    }
+    return new WebGlYuvRenderer(canvas, gl, options);
+}
+//# sourceMappingURL=yuvRenderer.js.map