react-native-webrtc-kaleidoscope 2.0.0 → 2.1.1

package/dist/src/kaleidoscope/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/kaleidoscope/types.ts"],"names":[],"mappings":";AAAA,iCAAiC;AACjC,EAAE;AACF,mEAAmE;AACnE,+EAA+E;AAC/E,+EAA+E;AAC/E,gFAAgF;AAChF,8EAA8E;AAC9E,kDAAkD;AAClD,kFAAkF;AAClF,kFAAkF;AAClF,EAAE;AACF,6EAA6E;AAC7E,uEAAuE;AACvE,+EAA+E;AAC/E,8EAA8E","sourcesContent":["// The three-verb surface: types.\n//\n// Bind a track and a preset book once; get three typed verbs back:\n//   - kaleidoscope(cmd, patches?)  the art axis: which composite (layer stack)\n//     fills the frame. cmd is a preset id from the book (narrowed), or null to\n//     clear. patches optionally merge per-layer uniform overrides (addressed by\n//     layer id); patching the currently-active preset routes through the live\n//     no-rebuild channel, so sliders stay smooth.\n//   - transform(t?)             the geometry axis: absolute flips + 90° rotation.\n//   - mask(m)                   the segmentation edge shared by every art effect.\n//\n// Shaders live in the library; consumers add presets (composites) over them,\n// never new shaders. Per shader-world convention, numeric uniforms are\n// normalized 0..1 where practical; ranges are documented in JSDoc as hints for\n// IntelliSense and tooling, not enforced at runtime (validation is userland).\n\nimport type { PatchableShaderName, ShaderUniformsMap } from '../../catalog/shaders';\nimport type { KaleidoscopePresetBook } from '../kaleidoscope.preset-book.types';\n\n/**\n * A live per-layer uniform override for ONE layer, derived from the layer's own\n * type: `id` is the layer's id, `uniforms` is `Partial` of the shader's uniform\n * type (re-indexed from `ShaderUniformsMap` by the layer's literal `shader`).\n * Non-tunable layers (`image`, `direct`) distribute to `never`, so they cannot be\n * patched. The runtime resolves by `id`; the shader is never sent on the wire.\n */\nexport type PatchFor<L> = L extends {\n  readonly id: infer I extends string;\n  readonly shader: infer S extends PatchableShaderName;\n}\n  ? { readonly id: I; readonly uniforms: Partial<ShaderUniformsMap[S]> }\n  : never;\n\n/**\n * The patches `kaleidoscope` accepts for preset `K` in book `P`: per-layer\n * overrides, each addressed by one of that preset's tunable layer ids and typed\n * by that layer's shader. At a literal `cmd` call site this narrows to the\n * preset's ids/uniforms; with a variable `cmd` it widens to the book-wide union\n * and is runtime-checked by id.\n */\nexport type PatchesFor<P extends KaleidoscopePresetBook, K extends keyof P> = ReadonlyArray<\n  PatchFor<P[K]['layers'][number]>\n>;\n\n/**\n * Absolute, stateless geometric transform. Every call is the full desired state\n * from the identity orientation: re-passing is the caller's responsibility, and\n * `transform()` (or `transform({})`) resets to identity. Rotation snaps to the\n * nearest 90°; arbitrary angles and offset are a later step.\n */\nexport type TransformInput = {\n  /** Mirror flips about each axis. */\n  readonly flip?: { readonly x?: boolean; readonly y?: boolean };\n  /** Clockwise rotation in degrees; snapped to the nearest 90 (0/90/180/270). */\n  readonly rotate?: number;\n};\n\n/** The segmentation mask edge, shared by every art effect (not transforms). */\nexport type MaskInput = {\n  /** Edge hardness, 0..1. 0 = soft halo, 1 = near-step. */\n  readonly hardness: number;\n  /** Edge threshold, 0..1. Higher rejects low-confidence (chair-edge) pixels. */\n  readonly threshold: number;\n};\n\nexport type KaleidoscopeBindOptions<P extends KaleidoscopePresetBook> = {\n  /** The consumer's preset book. Declare it `as const satisfies KaleidoscopePresetBook`. */\n  readonly presets: P;\n  /**\n   * Called with the live output track after every art/transform command. On web\n   * each command yields a NEW MediaStreamTrack (the pipeline is rebuilt); on\n   * native the same track is mutated in place and passed back.\n   */\n  readonly onTrack?: (track: MediaStreamTrack) => void;\n};\n\n/**\n * The art verb: select a composite by id (rebuilding the pipeline), or clear it\n * with `null`. When `cmd` is the currently-active preset id and `patches` is\n * given, the patches merge through the live no-rebuild uniform channel (keyed by\n * layer id) instead of rebuilding, so a slider drag stays smooth.\n */\ntype KaleidoscopeCommand<P extends KaleidoscopePresetBook> = <K extends keyof P>(\n  cmd: K | null,\n  patches?: PatchesFor<P, K>,\n) => void;\n\n/**\n * The three verbs for one bound track and book, plus the live track and a\n * teardown. `kaleidoscope` (preset switch) and `transform` rebuild the composite\n * (web yields a new track via onTrack); a `kaleidoscope` patch of the active\n * preset and `mask` both update what the running composite reads each frame, so\n * they need no rebuild.\n */\nexport interface KaleidoscopeBinding<P extends KaleidoscopePresetBook> {\n  readonly kaleidoscope: KaleidoscopeCommand<P>;\n  readonly transform: (t?: TransformInput) => void;\n  readonly mask: (m: MaskInput) => void;\n  readonly track: MediaStreamTrack;\n  readonly dispose: () => void;\n}\n"]}

package/dist/src/kaleidoscope.preset-book.types.d.ts

@@ -0,0 +1,86 @@
+import type { ComponentType } from 'react';
+import type { LayerShaderName, LayerShaderOptions } from '../catalog/shaders';
+/**
+ * A preset's place in the picker: an ordered path of group names, deepest last.
+ * One level (`['Backgrounds']`) is a flat group; two (`['Worlds', 'Wizard Tower']`)
+ * is group then subgroup. The list IS the depth, so a group can't be set without
+ * its parent. Extend to three levels by adding a member here when needed.
+ */
+export type KaleidoscopeTaxonomy = readonly [string] | readonly [string, string];
+/**
+ * What the Tuner passes a preset's `controls` component: the per-layer baked
+ * uniforms keyed by layer id, and the single shared `onPatch` every layer's
+ * `ControlForm` emits through (the `id` discriminates). Intentionally loose at
+ * this boundary (heterogeneous layers); per-shader typing is recovered inside
+ * each `<Shader>Controls` via `makeControls<U>()`.
+ */
+export type KaleidoscopeControls = {
+    readonly uniforms: Readonly<Record<string, Readonly<Record<string, number | readonly number[]>>>>;
+    readonly onPatch: (patch: {
+        readonly id: string;
+        readonly uniforms: Record<string, number | readonly number[]>;
+    }) => void;
+    readonly disabled?: boolean;
+};
+/** How a layer blends over the layers beneath it (painter's order). */
+export type KaleidoscopeBlendMode = 'normal' | 'additive';
+/**
+ * Which part of the frame a layer applies to. Omit for `'background'` (the
+ * accumulated stack so far); `'subject'` stencils the layer to the segmented
+ * person. The same shader can run on either target.
+ */
+export type KaleidoscopeLayerTarget = 'background' | 'subject';
+/**
+ * One layer in a preset: a `shader` (from the catalog) applied to a `target`,
+ * with optional `blend`. The `shader` is the discriminant and carries that
+ * shader's required fields (a discriminated union over the catalog's
+ * `LayerShaderOptions`). `id` is required and unique within one preset; it is the
+ * address a patch resolves against, and for an `image` layer it doubles as the
+ * bundled-WebP basename the native facade sends as the image `source`.
+ */
+export type KaleidoscopeLayer = {
+    readonly [S in LayerShaderName]: {
+        readonly id: string;
+        readonly shader: S;
+        readonly target?: KaleidoscopeLayerTarget;
+        readonly blend?: KaleidoscopeBlendMode;
+    } & LayerShaderOptions[S];
+}[LayerShaderName];
+/**
+ * One preset: an ordered painter's stack of layers under one book name, plus
+ * display metadata. `kaleidoscope(id)` runs the whole stack as one composite
+ * through the one compositor.
+ */
+export type KaleidoscopePreset = {
+    /** Human-readable label for the picker. */
+    readonly name: string;
+    /** Grouping path for the picker, root first (e.g. `['Worlds', 'Wizard Tower']`). */
+    readonly taxonomy: KaleidoscopeTaxonomy;
+    /**
+     * Optional thumbnail for the picker rail.
+     * - `string`: a resolved URL (web) or native preset name routed through the
+     *   image resolver.
+     * - `number`: a Metro asset module id (`require('./foo.webp')`), consumed
+     *   directly by `<Image source={number}>`.
+     */
+    readonly thumbnail?: string | number;
+    /** The painter's stack, back to front. Each layer's `id` is unique here. */
+    readonly layers: ReadonlyArray<KaleidoscopeLayer>;
+    /**
+     * Optional tuning component the Tuner renders, mounting a `ControlForm` +
+     * `ControlSection` per tunable layer. `undefined` renders nothing. The
+     * `import type` keeps presets runtime-React-free.
+     */
+    readonly controls?: ComponentType<KaleidoscopeControls>;
+};
+/** The consumer's book: a flat record of presets keyed by id. */
+export type KaleidoscopePresetBook = Readonly<Record<string, KaleidoscopePreset>>;
+/**
+ * A materialized book entry: a `KaleidoscopePreset` plus the `id` it was keyed
+ * by. What the picker and tuner iterate (the book is keyed; this carries the key
+ * inline so a flattened list keeps its identity).
+ */
+export type KaleidoscopePresetEntry = {
+    readonly id: string;
+} & KaleidoscopePreset;
+//# sourceMappingURL=kaleidoscope.preset-book.types.d.ts.map

package/dist/src/kaleidoscope.preset-book.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"kaleidoscope.preset-book.types.d.ts","sourceRoot":"","sources":["../../src/kaleidoscope.preset-book.types.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAE9E;;;;;GAKG;AACH,MAAM,MAAM,oBAAoB,GAAG,SAAS,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAEjF;;;;;;GAMG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;IAClG,QAAQ,CAAC,OAAO,EAAE,CAAC,KAAK,EAAE;QACxB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;QACpB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,CAAC,CAAC;KAC/D,KAAK,IAAI,CAAC;IACX,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAEF,uEAAuE;AACvE,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE1D;;;;GAIG;AACH,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAAG,SAAS,CAAC;AAE/D;;;;;;;GAOG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,EAAE,CAAC,IAAI,eAAe,GAAG;QAC/B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;QACpB,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;QACnB,QAAQ,CAAC,MAAM,CAAC,EAAE,uBAAuB,CAAC;QAC1C,QAAQ,CAAC,KAAK,CAAC,EAAE,qBAAqB,CAAC;KACxC,GAAG,kBAAkB,CAAC,CAAC,CAAC;CAC1B,CAAC,eAAe,CAAC,CAAC;AAEnB;;;;GAIG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B,2CAA2C;IAC3C,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,oFAAoF;IACpF,QAAQ,CAAC,QAAQ,EAAE,oBAAoB,CAAC;IACxC;;;;;;OAMG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACrC,4EAA4E;IAC5E,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAClD;;;;OAIG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;CACzD,CAAC;AAEF,iEAAiE;AACjE,MAAM,MAAM,sBAAsB,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC,CAAC;AAElF;;;;GAIG;AACH,MAAM,MAAM,uBAAuB,GAAG;IAAE,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAAG,kBAAkB,CAAC","sourcesContent":["// Point of entry #1: the preset-book vocabulary. The base of the pyramid.\n//\n// The complete, declarative lexicon a consumer writes in their\n// `kaleidoscope.preset-book.ts`, and the single source of truth for it: any file\n// that needs one of these types imports it from here. A preset book is a record\n// of named presets; a preset is a name + taxonomy + (optional) thumbnail +\n// (optional) controls + an ordered stack of layers; a layer names a `shader` from\n// the catalog and carries that shader's options.\n//\n// What is NOT here: the runtime effect contract (`CompositeSpec` etc. live in\n// `kaleidoscope/effect.types`; the consumer never writes those), the shader\n// option catalog (`LayerShaderOptions` lives with the shaders it describes), and\n// generic primitives (`RGB` in `lib/primitives.types`).\n\nimport type { ComponentType } from 'react';\nimport type { LayerShaderName, LayerShaderOptions } from '../catalog/shaders';\n\n/**\n * A preset's place in the picker: an ordered path of group names, deepest last.\n * One level (`['Backgrounds']`) is a flat group; two (`['Worlds', 'Wizard Tower']`)\n * is group then subgroup. The list IS the depth, so a group can't be set without\n * its parent. Extend to three levels by adding a member here when needed.\n */\nexport type KaleidoscopeTaxonomy = readonly [string] | readonly [string, string];\n\n/**\n * What the Tuner passes a preset's `controls` component: the per-layer baked\n * uniforms keyed by layer id, and the single shared `onPatch` every layer's\n * `ControlForm` emits through (the `id` discriminates). Intentionally loose at\n * this boundary (heterogeneous layers); per-shader typing is recovered inside\n * each `<Shader>Controls` via `makeControls<U>()`.\n */\nexport type KaleidoscopeControls = {\n  readonly uniforms: Readonly<Record<string, Readonly<Record<string, number | readonly number[]>>>>;\n  readonly onPatch: (patch: {\n    readonly id: string;\n    readonly uniforms: Record<string, number | readonly number[]>;\n  }) => void;\n  readonly disabled?: boolean;\n};\n\n/** How a layer blends over the layers beneath it (painter's order). */\nexport type KaleidoscopeBlendMode = 'normal' | 'additive';\n\n/**\n * Which part of the frame a layer applies to. Omit for `'background'` (the\n * accumulated stack so far); `'subject'` stencils the layer to the segmented\n * person. The same shader can run on either target.\n */\nexport type KaleidoscopeLayerTarget = 'background' | 'subject';\n\n/**\n * One layer in a preset: a `shader` (from the catalog) applied to a `target`,\n * with optional `blend`. The `shader` is the discriminant and carries that\n * shader's required fields (a discriminated union over the catalog's\n * `LayerShaderOptions`). `id` is required and unique within one preset; it is the\n * address a patch resolves against, and for an `image` layer it doubles as the\n * bundled-WebP basename the native facade sends as the image `source`.\n */\nexport type KaleidoscopeLayer = {\n  readonly [S in LayerShaderName]: {\n    readonly id: string;\n    readonly shader: S;\n    readonly target?: KaleidoscopeLayerTarget;\n    readonly blend?: KaleidoscopeBlendMode;\n  } & LayerShaderOptions[S];\n}[LayerShaderName];\n\n/**\n * One preset: an ordered painter's stack of layers under one book name, plus\n * display metadata. `kaleidoscope(id)` runs the whole stack as one composite\n * through the one compositor.\n */\nexport type KaleidoscopePreset = {\n  /** Human-readable label for the picker. */\n  readonly name: string;\n  /** Grouping path for the picker, root first (e.g. `['Worlds', 'Wizard Tower']`). */\n  readonly taxonomy: KaleidoscopeTaxonomy;\n  /**\n   * Optional thumbnail for the picker rail.\n   * - `string`: a resolved URL (web) or native preset name routed through the\n   *   image resolver.\n   * - `number`: a Metro asset module id (`require('./foo.webp')`), consumed\n   *   directly by `<Image source={number}>`.\n   */\n  readonly thumbnail?: string | number;\n  /** The painter's stack, back to front. Each layer's `id` is unique here. */\n  readonly layers: ReadonlyArray<KaleidoscopeLayer>;\n  /**\n   * Optional tuning component the Tuner renders, mounting a `ControlForm` +\n   * `ControlSection` per tunable layer. `undefined` renders nothing. The\n   * `import type` keeps presets runtime-React-free.\n   */\n  readonly controls?: ComponentType<KaleidoscopeControls>;\n};\n\n/** The consumer's book: a flat record of presets keyed by id. */\nexport type KaleidoscopePresetBook = Readonly<Record<string, KaleidoscopePreset>>;\n\n/**\n * A materialized book entry: a `KaleidoscopePreset` plus the `id` it was keyed\n * by. What the picker and tuner iterate (the book is keyed; this carries the key\n * inline so a flattened list keeps its identity).\n */\nexport type KaleidoscopePresetEntry = { readonly id: string } & KaleidoscopePreset;\n"]}

package/dist/src/kaleidoscope.preset-book.types.js

@@ -0,0 +1,16 @@
+"use strict";
+// Point of entry #1: the preset-book vocabulary. The base of the pyramid.
+//
+// The complete, declarative lexicon a consumer writes in their
+// `kaleidoscope.preset-book.ts`, and the single source of truth for it: any file
+// that needs one of these types imports it from here. A preset book is a record
+// of named presets; a preset is a name + taxonomy + (optional) thumbnail +
+// (optional) controls + an ordered stack of layers; a layer names a `shader` from
+// the catalog and carries that shader's options.
+//
+// What is NOT here: the runtime effect contract (`CompositeSpec` etc. live in
+// `kaleidoscope/effect.types`; the consumer never writes those), the shader
+// option catalog (`LayerShaderOptions` lives with the shaders it describes), and
+// generic primitives (`RGB` in `lib/primitives.types`).
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=kaleidoscope.preset-book.types.js.map

package/dist/src/kaleidoscope.preset-book.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kaleidoscope.preset-book.types.js","sourceRoot":"","sources":["../../src/kaleidoscope.preset-book.types.ts"],"names":[],"mappings":";AAAA,0EAA0E;AAC1E,EAAE;AACF,+DAA+D;AAC/D,iFAAiF;AACjF,gFAAgF;AAChF,2EAA2E;AAC3E,kFAAkF;AAClF,iDAAiD;AACjD,EAAE;AACF,8EAA8E;AAC9E,4EAA4E;AAC5E,iFAAiF;AACjF,wDAAwD","sourcesContent":["// Point of entry #1: the preset-book vocabulary. The base of the pyramid.\n//\n// The complete, declarative lexicon a consumer writes in their\n// `kaleidoscope.preset-book.ts`, and the single source of truth for it: any file\n// that needs one of these types imports it from here. A preset book is a record\n// of named presets; a preset is a name + taxonomy + (optional) thumbnail +\n// (optional) controls + an ordered stack of layers; a layer names a `shader` from\n// the catalog and carries that shader's options.\n//\n// What is NOT here: the runtime effect contract (`CompositeSpec` etc. live in\n// `kaleidoscope/effect.types`; the consumer never writes those), the shader\n// option catalog (`LayerShaderOptions` lives with the shaders it describes), and\n// generic primitives (`RGB` in `lib/primitives.types`).\n\nimport type { ComponentType } from 'react';\nimport type { LayerShaderName, LayerShaderOptions } from '../catalog/shaders';\n\n/**\n * A preset's place in the picker: an ordered path of group names, deepest last.\n * One level (`['Backgrounds']`) is a flat group; two (`['Worlds', 'Wizard Tower']`)\n * is group then subgroup. The list IS the depth, so a group can't be set without\n * its parent. Extend to three levels by adding a member here when needed.\n */\nexport type KaleidoscopeTaxonomy = readonly [string] | readonly [string, string];\n\n/**\n * What the Tuner passes a preset's `controls` component: the per-layer baked\n * uniforms keyed by layer id, and the single shared `onPatch` every layer's\n * `ControlForm` emits through (the `id` discriminates). Intentionally loose at\n * this boundary (heterogeneous layers); per-shader typing is recovered inside\n * each `<Shader>Controls` via `makeControls<U>()`.\n */\nexport type KaleidoscopeControls = {\n  readonly uniforms: Readonly<Record<string, Readonly<Record<string, number | readonly number[]>>>>;\n  readonly onPatch: (patch: {\n    readonly id: string;\n    readonly uniforms: Record<string, number | readonly number[]>;\n  }) => void;\n  readonly disabled?: boolean;\n};\n\n/** How a layer blends over the layers beneath it (painter's order). */\nexport type KaleidoscopeBlendMode = 'normal' | 'additive';\n\n/**\n * Which part of the frame a layer applies to. Omit for `'background'` (the\n * accumulated stack so far); `'subject'` stencils the layer to the segmented\n * person. The same shader can run on either target.\n */\nexport type KaleidoscopeLayerTarget = 'background' | 'subject';\n\n/**\n * One layer in a preset: a `shader` (from the catalog) applied to a `target`,\n * with optional `blend`. The `shader` is the discriminant and carries that\n * shader's required fields (a discriminated union over the catalog's\n * `LayerShaderOptions`). `id` is required and unique within one preset; it is the\n * address a patch resolves against, and for an `image` layer it doubles as the\n * bundled-WebP basename the native facade sends as the image `source`.\n */\nexport type KaleidoscopeLayer = {\n  readonly [S in LayerShaderName]: {\n    readonly id: string;\n    readonly shader: S;\n    readonly target?: KaleidoscopeLayerTarget;\n    readonly blend?: KaleidoscopeBlendMode;\n  } & LayerShaderOptions[S];\n}[LayerShaderName];\n\n/**\n * One preset: an ordered painter's stack of layers under one book name, plus\n * display metadata. `kaleidoscope(id)` runs the whole stack as one composite\n * through the one compositor.\n */\nexport type KaleidoscopePreset = {\n  /** Human-readable label for the picker. */\n  readonly name: string;\n  /** Grouping path for the picker, root first (e.g. `['Worlds', 'Wizard Tower']`). */\n  readonly taxonomy: KaleidoscopeTaxonomy;\n  /**\n   * Optional thumbnail for the picker rail.\n   * - `string`: a resolved URL (web) or native preset name routed through the\n   *   image resolver.\n   * - `number`: a Metro asset module id (`require('./foo.webp')`), consumed\n   *   directly by `<Image source={number}>`.\n   */\n  readonly thumbnail?: string | number;\n  /** The painter's stack, back to front. Each layer's `id` is unique here. */\n  readonly layers: ReadonlyArray<KaleidoscopeLayer>;\n  /**\n   * Optional tuning component the Tuner renders, mounting a `ControlForm` +\n   * `ControlSection` per tunable layer. `undefined` renders nothing. The\n   * `import type` keeps presets runtime-React-free.\n   */\n  readonly controls?: ComponentType<KaleidoscopeControls>;\n};\n\n/** The consumer's book: a flat record of presets keyed by id. */\nexport type KaleidoscopePresetBook = Readonly<Record<string, KaleidoscopePreset>>;\n\n/**\n * A materialized book entry: a `KaleidoscopePreset` plus the `id` it was keyed\n * by. What the picker and tuner iterate (the book is keyed; this carries the key\n * inline so a flattened list keeps its identity).\n */\nexport type KaleidoscopePresetEntry = { readonly id: string } & KaleidoscopePreset;\n"]}

package/dist/src/lib/primitives.types.d.ts

@@ -0,0 +1,3 @@
+/** RGB color, each channel in [0, 1]. */
+export type RGB = readonly [number, number, number];
+//# sourceMappingURL=primitives.types.d.ts.map

package/dist/src/lib/primitives.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"primitives.types.d.ts","sourceRoot":"","sources":["../../../src/lib/primitives.types.ts"],"names":[],"mappings":"AAGA,yCAAyC;AACzC,MAAM,MAAM,GAAG,GAAG,SAAS,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Generic, cross-everything primitives. No domain or platform coupling, so they\n// are safe in any flow (runtime, prebuild, components).\n\n/** RGB color, each channel in [0, 1]. */\nexport type RGB = readonly [number, number, number];\n"]}

package/dist/src/lib/primitives.types.js

@@ -0,0 +1,5 @@
+"use strict";
+// Generic, cross-everything primitives. No domain or platform coupling, so they
+// are safe in any flow (runtime, prebuild, components).
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=primitives.types.js.map

package/dist/src/lib/primitives.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"primitives.types.js","sourceRoot":"","sources":["../../../src/lib/primitives.types.ts"],"names":[],"mappings":";AAAA,gFAAgF;AAChF,wDAAwD","sourcesContent":["// Generic, cross-everything primitives. No domain or platform coupling, so they\n// are safe in any flow (runtime, prebuild, components).\n\n/** RGB color, each channel in [0, 1]. */\nexport type RGB = readonly [number, number, number];\n"]}

package/dist/src/lib/test-id.d.ts

@@ -0,0 +1,30 @@
+export declare const TESTID_ROOT = "kld";
+/** Default static prefixes for the two control families that have no preset scope. */
+export declare const TRANSFORM_TESTID_PREFIX = "kld.transform";
+export declare const MASK_TESTID_PREFIX = "kld.mask";
+/**
+ * Normalize a display string to a stable id segment: lowercase, spaces and
+ * underscores to `-`, drop anything outside `[a-z0-9-]`, collapse repeats, trim.
+ */
+export declare function slug(s: string): string;
+/**
+ * The scope a ControlForm's fields hang off: `kld.<preset>.<layer>`, or
+ * `kld.<layer>` when rendered standalone (no Tuner provides a preset).
+ */
+export declare function controlScope(presetId: string | null, layerId: string): string;
+/** One field's id within its form scope: `<scope>.<uniform>`. */
+export declare function fieldTestId(scope: string, uniform: string): string;
+/** A rotation button: `<prefix>.rotate-<deg>`. */
+export declare function rotateTestId(prefix: string, deg: number): string;
+/** A flip toggle: `<prefix>.flip-<axis>`. */
+export declare function flipTestId(prefix: string, axis: 'x' | 'y'): string;
+/** A family tab: `kld.family.<slug>`. */
+export declare function familyTestId(family: string): string;
+/**
+ * A category menu item, qualified by its family so the same label under two
+ * families does not collide: `kld.category.<slug-family>.<slug-category>`.
+ */
+export declare function categoryTestId(family: string, category: string): string;
+/** A preset tile: `kld.preset.<id>` (id is the book key, already a stable token). */
+export declare function presetTileTestId(id: string): string;
+//# sourceMappingURL=test-id.d.ts.map

package/dist/src/lib/test-id.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-id.d.ts","sourceRoot":"","sources":["../../../src/lib/test-id.ts"],"names":[],"mappings":"AAgBA,eAAO,MAAM,WAAW,QAAQ,CAAC;AAEjC,sFAAsF;AACtF,eAAO,MAAM,uBAAuB,kBAA6B,CAAC;AAClE,eAAO,MAAM,kBAAkB,aAAwB,CAAC;AAExD;;;GAGG;AACH,wBAAgB,IAAI,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAatC;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAE7E;AAED,iEAAiE;AACjE,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAElE;AAED,kDAAkD;AAClD,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAEhE;AAED,6CAA6C;AAC7C,wBAAgB,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,MAAM,CAElE;AAED,yCAAyC;AACzC,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAEnD;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEvE;AAED,qFAAqF;AACrF,wBAAgB,gBAAgB,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAEnD","sourcesContent":["// The test-id grammar: pure builders for the deterministic, semantic\n// `accessibilityIdentifier`s every interactive kit leaf carries. One source of\n// truth so a Maestro flow can address a control by a stable id instead of its\n// brittle visible text. No React/RN import; this is plain data.\n//\n// Shape (dot-delimited, rooted at `kld`):\n//   control field   kld.<preset>.<layer>.<uniform>      (+ .r/.g/.b per channel)\n//   transform       kld.transform.rotate-90 | flip-x\n//   mask            kld.mask.hardness\n//   family tab      kld.family.<slug>\n//   category item   kld.category.<slug-family>.<slug-category>\n//   preset tile     kld.preset.<id>\n//\n// preset/layer/uniform ids and book keys are already stable tokens and are used\n// verbatim; only display strings (family, category) are slugged.\n\nexport const TESTID_ROOT = 'kld';\n\n/** Default static prefixes for the two control families that have no preset scope. */\nexport const TRANSFORM_TESTID_PREFIX = `${TESTID_ROOT}.transform`;\nexport const MASK_TESTID_PREFIX = `${TESTID_ROOT}.mask`;\n\n/**\n * Normalize a display string to a stable id segment: lowercase, spaces and\n * underscores to `-`, drop anything outside `[a-z0-9-]`, collapse repeats, trim.\n */\nexport function slug(s: string): string {\n  return (\n    s\n      .trim()\n      .toLowerCase()\n      .replace(/[\\s_]+/g, '-')\n      .replace(/[^a-z0-9-]+/g, '')\n      .replace(/-+/g, '-')\n      // Runs are collapsed to a single '-' above, so each edge has at most one\n      // hyphen; trim one char (no quantifier) instead of '-+$', whose backtracking\n      // is polynomial on a long hyphen run (ReDoS, code-scanning alert #9).\n      .replace(/^-|-$/g, '')\n  );\n}\n\n/**\n * The scope a ControlForm's fields hang off: `kld.<preset>.<layer>`, or\n * `kld.<layer>` when rendered standalone (no Tuner provides a preset).\n */\nexport function controlScope(presetId: string | null, layerId: string): string {\n  return presetId ? `${TESTID_ROOT}.${presetId}.${layerId}` : `${TESTID_ROOT}.${layerId}`;\n}\n\n/** One field's id within its form scope: `<scope>.<uniform>`. */\nexport function fieldTestId(scope: string, uniform: string): string {\n  return `${scope}.${uniform}`;\n}\n\n/** A rotation button: `<prefix>.rotate-<deg>`. */\nexport function rotateTestId(prefix: string, deg: number): string {\n  return `${prefix}.rotate-${deg}`;\n}\n\n/** A flip toggle: `<prefix>.flip-<axis>`. */\nexport function flipTestId(prefix: string, axis: 'x' | 'y'): string {\n  return `${prefix}.flip-${axis}`;\n}\n\n/** A family tab: `kld.family.<slug>`. */\nexport function familyTestId(family: string): string {\n  return `${TESTID_ROOT}.family.${slug(family)}`;\n}\n\n/**\n * A category menu item, qualified by its family so the same label under two\n * families does not collide: `kld.category.<slug-family>.<slug-category>`.\n */\nexport function categoryTestId(family: string, category: string): string {\n  return `${TESTID_ROOT}.category.${slug(family)}.${slug(category)}`;\n}\n\n/** A preset tile: `kld.preset.<id>` (id is the book key, already a stable token). */\nexport function presetTileTestId(id: string): string {\n  return `${TESTID_ROOT}.preset.${id}`;\n}\n"]}

package/dist/src/lib/test-id.js

@@ -0,0 +1,81 @@
+"use strict";
+// The test-id grammar: pure builders for the deterministic, semantic
+// `accessibilityIdentifier`s every interactive kit leaf carries. One source of
+// truth so a Maestro flow can address a control by a stable id instead of its
+// brittle visible text. No React/RN import; this is plain data.
+//
+// Shape (dot-delimited, rooted at `kld`):
+//   control field   kld.<preset>.<layer>.<uniform>      (+ .r/.g/.b per channel)
+//   transform       kld.transform.rotate-90 | flip-x
+//   mask            kld.mask.hardness
+//   family tab      kld.family.<slug>
+//   category item   kld.category.<slug-family>.<slug-category>
+//   preset tile     kld.preset.<id>
+//
+// preset/layer/uniform ids and book keys are already stable tokens and are used
+// verbatim; only display strings (family, category) are slugged.
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MASK_TESTID_PREFIX = exports.TRANSFORM_TESTID_PREFIX = exports.TESTID_ROOT = void 0;
+exports.slug = slug;
+exports.controlScope = controlScope;
+exports.fieldTestId = fieldTestId;
+exports.rotateTestId = rotateTestId;
+exports.flipTestId = flipTestId;
+exports.familyTestId = familyTestId;
+exports.categoryTestId = categoryTestId;
+exports.presetTileTestId = presetTileTestId;
+exports.TESTID_ROOT = 'kld';
+/** Default static prefixes for the two control families that have no preset scope. */
+exports.TRANSFORM_TESTID_PREFIX = `${exports.TESTID_ROOT}.transform`;
+exports.MASK_TESTID_PREFIX = `${exports.TESTID_ROOT}.mask`;
+/**
+ * Normalize a display string to a stable id segment: lowercase, spaces and
+ * underscores to `-`, drop anything outside `[a-z0-9-]`, collapse repeats, trim.
+ */
+function slug(s) {
+    return (s
+        .trim()
+        .toLowerCase()
+        .replace(/[\s_]+/g, '-')
+        .replace(/[^a-z0-9-]+/g, '')
+        .replace(/-+/g, '-')
+        // Runs are collapsed to a single '-' above, so each edge has at most one
+        // hyphen; trim one char (no quantifier) instead of '-+$', whose backtracking
+        // is polynomial on a long hyphen run (ReDoS, code-scanning alert #9).
+        .replace(/^-|-$/g, ''));
+}
+/**
+ * The scope a ControlForm's fields hang off: `kld.<preset>.<layer>`, or
+ * `kld.<layer>` when rendered standalone (no Tuner provides a preset).
+ */
+function controlScope(presetId, layerId) {
+    return presetId ? `${exports.TESTID_ROOT}.${presetId}.${layerId}` : `${exports.TESTID_ROOT}.${layerId}`;
+}
+/** One field's id within its form scope: `<scope>.<uniform>`. */
+function fieldTestId(scope, uniform) {
+    return `${scope}.${uniform}`;
+}
+/** A rotation button: `<prefix>.rotate-<deg>`. */
+function rotateTestId(prefix, deg) {
+    return `${prefix}.rotate-${deg}`;
+}
+/** A flip toggle: `<prefix>.flip-<axis>`. */
+function flipTestId(prefix, axis) {
+    return `${prefix}.flip-${axis}`;
+}
+/** A family tab: `kld.family.<slug>`. */
+function familyTestId(family) {
+    return `${exports.TESTID_ROOT}.family.${slug(family)}`;
+}
+/**
+ * A category menu item, qualified by its family so the same label under two
+ * families does not collide: `kld.category.<slug-family>.<slug-category>`.
+ */
+function categoryTestId(family, category) {
+    return `${exports.TESTID_ROOT}.category.${slug(family)}.${slug(category)}`;
+}
+/** A preset tile: `kld.preset.<id>` (id is the book key, already a stable token). */
+function presetTileTestId(id) {
+    return `${exports.TESTID_ROOT}.preset.${id}`;
+}
+//# sourceMappingURL=test-id.js.map

package/dist/src/lib/test-id.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-id.js","sourceRoot":"","sources":["../../../src/lib/test-id.ts"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,+EAA+E;AAC/E,8EAA8E;AAC9E,gEAAgE;AAChE,EAAE;AACF,0CAA0C;AAC1C,iFAAiF;AACjF,qDAAqD;AACrD,sCAAsC;AACtC,sCAAsC;AACtC,+DAA+D;AAC/D,oCAAoC;AACpC,EAAE;AACF,gFAAgF;AAChF,iEAAiE;;;;;;;;;;;AAEpD,QAAA,WAAW,GAAG,KAAK,CAAC;AAEjC,sFAAsF;AACzE,QAAA,uBAAuB,GAAG,GAAG,QAAA,WAAW,YAAY,CAAC;AACrD,QAAA,kBAAkB,GAAG,GAAG,QAAA,WAAW,OAAO,CAAC;AAExD;;;GAGG;AACH,cAAqB,CAAS;IAC5B,OAAO,CACL,CAAC;SACE,IAAI,EAAE;SACN,WAAW,EAAE;SACb,OAAO,CAAC,SAAS,EAAE,GAAG,CAAC;SACvB,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC;SAC3B,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC;QACpB,yEAAyE;QACzE,6EAA6E;QAC7E,sEAAsE;SACrE,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CACzB,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,sBAA6B,QAAuB,EAAE,OAAe;IACnE,OAAO,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAA,WAAW,IAAI,QAAQ,IAAI,OAAO,EAAE,CAAC,CAAC,CAAC,GAAG,QAAA,WAAW,IAAI,OAAO,EAAE,CAAC;AAC1F,CAAC;AAED,iEAAiE;AACjE,qBAA4B,KAAa,EAAE,OAAe;IACxD,OAAO,GAAG,KAAK,IAAI,OAAO,EAAE,CAAC;AAC/B,CAAC;AAED,kDAAkD;AAClD,sBAA6B,MAAc,EAAE,GAAW;IACtD,OAAO,GAAG,MAAM,WAAW,GAAG,EAAE,CAAC;AACnC,CAAC;AAED,6CAA6C;AAC7C,oBAA2B,MAAc,EAAE,IAAe;IACxD,OAAO,GAAG,MAAM,SAAS,IAAI,EAAE,CAAC;AAClC,CAAC;AAED,yCAAyC;AACzC,sBAA6B,MAAc;IACzC,OAAO,GAAG,QAAA,WAAW,WAAW,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;AACjD,CAAC;AAED;;;GAGG;AACH,wBAA+B,MAAc,EAAE,QAAgB;IAC7D,OAAO,GAAG,QAAA,WAAW,aAAa,IAAI,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC;AACrE,CAAC;AAED,qFAAqF;AACrF,0BAAiC,EAAU;IACzC,OAAO,GAAG,QAAA,WAAW,WAAW,EAAE,EAAE,CAAC;AACvC,CAAC","sourcesContent":["// The test-id grammar: pure builders for the deterministic, semantic\n// `accessibilityIdentifier`s every interactive kit leaf carries. One source of\n// truth so a Maestro flow can address a control by a stable id instead of its\n// brittle visible text. No React/RN import; this is plain data.\n//\n// Shape (dot-delimited, rooted at `kld`):\n//   control field   kld.<preset>.<layer>.<uniform>      (+ .r/.g/.b per channel)\n//   transform       kld.transform.rotate-90 | flip-x\n//   mask            kld.mask.hardness\n//   family tab      kld.family.<slug>\n//   category item   kld.category.<slug-family>.<slug-category>\n//   preset tile     kld.preset.<id>\n//\n// preset/layer/uniform ids and book keys are already stable tokens and are used\n// verbatim; only display strings (family, category) are slugged.\n\nexport const TESTID_ROOT = 'kld';\n\n/** Default static prefixes for the two control families that have no preset scope. */\nexport const TRANSFORM_TESTID_PREFIX = `${TESTID_ROOT}.transform`;\nexport const MASK_TESTID_PREFIX = `${TESTID_ROOT}.mask`;\n\n/**\n * Normalize a display string to a stable id segment: lowercase, spaces and\n * underscores to `-`, drop anything outside `[a-z0-9-]`, collapse repeats, trim.\n */\nexport function slug(s: string): string {\n  return (\n    s\n      .trim()\n      .toLowerCase()\n      .replace(/[\\s_]+/g, '-')\n      .replace(/[^a-z0-9-]+/g, '')\n      .replace(/-+/g, '-')\n      // Runs are collapsed to a single '-' above, so each edge has at most one\n      // hyphen; trim one char (no quantifier) instead of '-+$', whose backtracking\n      // is polynomial on a long hyphen run (ReDoS, code-scanning alert #9).\n      .replace(/^-|-$/g, '')\n  );\n}\n\n/**\n * The scope a ControlForm's fields hang off: `kld.<preset>.<layer>`, or\n * `kld.<layer>` when rendered standalone (no Tuner provides a preset).\n */\nexport function controlScope(presetId: string | null, layerId: string): string {\n  return presetId ? `${TESTID_ROOT}.${presetId}.${layerId}` : `${TESTID_ROOT}.${layerId}`;\n}\n\n/** One field's id within its form scope: `<scope>.<uniform>`. */\nexport function fieldTestId(scope: string, uniform: string): string {\n  return `${scope}.${uniform}`;\n}\n\n/** A rotation button: `<prefix>.rotate-<deg>`. */\nexport function rotateTestId(prefix: string, deg: number): string {\n  return `${prefix}.rotate-${deg}`;\n}\n\n/** A flip toggle: `<prefix>.flip-<axis>`. */\nexport function flipTestId(prefix: string, axis: 'x' | 'y'): string {\n  return `${prefix}.flip-${axis}`;\n}\n\n/** A family tab: `kld.family.<slug>`. */\nexport function familyTestId(family: string): string {\n  return `${TESTID_ROOT}.family.${slug(family)}`;\n}\n\n/**\n * A category menu item, qualified by its family so the same label under two\n * families does not collide: `kld.category.<slug-family>.<slug-category>`.\n */\nexport function categoryTestId(family: string, category: string): string {\n  return `${TESTID_ROOT}.category.${slug(family)}.${slug(category)}`;\n}\n\n/** A preset tile: `kld.preset.<id>` (id is the book key, already a stable token). */\nexport function presetTileTestId(id: string): string {\n  return `${TESTID_ROOT}.preset.${id}`;\n}\n"]}

package/dist/src/livekit.d.ts

@@ -0,0 +1,24 @@
+import type { ProcessorOptions, Track, TrackProcessor } from 'livekit-client';
+import type { EffectInput } from './kaleidoscope/effect.types';
+/**
+ * A LiveKit `TrackProcessor` that applies Kaleidoscope video effects to a local
+ * camera track. Construct it with the same effect inputs `applyVideoEffects`
+ * accepts (bare transform names like `'flip-x'`, or full `EffectSpec` composite
+ * objects), then pass it to `localTrack.setProcessor(processor)`.
+ *
+ * `restart` (camera flip / source change) and `destroy` (unpublish) tear down
+ * the prior Insertable-Streams pipeline, so repeated flips do not leak
+ * generators. The page-shared segmenter and WebGL state are module singletons
+ * reused across pipelines, so they are intentionally retained.
+ */
+export declare class KaleidoscopeProcessor implements TrackProcessor<Track.Kind.Video> {
+    readonly name = "kaleidoscope";
+    processedTrack?: MediaStreamTrack;
+    private readonly effects;
+    private disposePipeline;
+    constructor(effects: ReadonlyArray<EffectInput>);
+    init(opts: ProcessorOptions<Track.Kind.Video>): Promise<void>;
+    restart(opts: ProcessorOptions<Track.Kind.Video>): Promise<void>;
+    destroy(): Promise<void>;
+}
+//# sourceMappingURL=livekit.d.ts.map

package/dist/src/livekit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"livekit.d.ts","sourceRoot":"","sources":["../../src/livekit.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAE9E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE/D;;;;;;;;;;GAUG;AACH,qBAAa,qBAAsB,YAAW,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;IAC5E,QAAQ,CAAC,IAAI,kBAAkB;IAC/B,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAElC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA6B;IACrD,OAAO,CAAC,eAAe,CAA6B;IAEpD,YAAY,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,EAE9C;IAEK,IAAI,CAAC,IAAI,EAAE,gBAAgB,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAIlE;IAEK,OAAO,CAAC,IAAI,EAAE,gBAAgB,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAGrE;IAEK,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC,CAI7B;CACF","sourcesContent":["// Opt-in LiveKit adapter, exported from the `react-native-webrtc-kaleidoscope/livekit`\n// subpath. It wraps the web Insertable-Streams pipeline in LiveKit's\n// TrackProcessor interface so consumers do not have to hand-write the glue.\n//\n// Why this exists: the core web API is `applyVideoEffects(track) -> newTrack`,\n// which assumes the caller owns the RTCRtpSender and calls replaceTrack itself.\n// LiveKit owns the sender, so consumers go through `track.setProcessor(...)`\n// instead. This adapter is that bridge:\n//\n//   import { KaleidoscopeProcessor } from 'react-native-webrtc-kaleidoscope/livekit';\n//   await localVideoTrack.setProcessor(\n//     new KaleidoscopeProcessor([{ name: 'composite', layers: [{ id: 'you', shader: 'direct', target: 'subject' }] }]),\n//   );\n//\n// `livekit-client` is an OPTIONAL peer dependency: the import below is type-only\n// (erased at build), so the published JS has no runtime dependency on LiveKit\n// and the agnostic core stays decoupled. Only consumers that import this subpath\n// need livekit-client installed (they already have it).\n//\n// This adapter is web-only: it builds on MediaStreamTrackProcessor /\n// MediaStreamTrackGenerator (Insertable Streams), which exist in Chromium-based\n// browsers. On unsupported environments the underlying pipeline throws a typed\n// error at init().\n\nimport type { ProcessorOptions, Track, TrackProcessor } from 'livekit-client';\nimport { applyVideoEffectsDisposable } from './index.web';\nimport type { EffectInput } from './kaleidoscope/effect.types';\n\n/**\n * A LiveKit `TrackProcessor` that applies Kaleidoscope video effects to a local\n * camera track. Construct it with the same effect inputs `applyVideoEffects`\n * accepts (bare transform names like `'flip-x'`, or full `EffectSpec` composite\n * objects), then pass it to `localTrack.setProcessor(processor)`.\n *\n * `restart` (camera flip / source change) and `destroy` (unpublish) tear down\n * the prior Insertable-Streams pipeline, so repeated flips do not leak\n * generators. The page-shared segmenter and WebGL state are module singletons\n * reused across pipelines, so they are intentionally retained.\n */\nexport class KaleidoscopeProcessor implements TrackProcessor<Track.Kind.Video> {\n  readonly name = 'kaleidoscope';\n  processedTrack?: MediaStreamTrack;\n\n  private readonly effects: ReadonlyArray<EffectInput>;\n  private disposePipeline: (() => void) | null = null;\n\n  constructor(effects: ReadonlyArray<EffectInput>) {\n    this.effects = effects;\n  }\n\n  async init(opts: ProcessorOptions<Track.Kind.Video>): Promise<void> {\n    const { track, dispose } = applyVideoEffectsDisposable(opts.track, this.effects);\n    this.processedTrack = track;\n    this.disposePipeline = dispose;\n  }\n\n  async restart(opts: ProcessorOptions<Track.Kind.Video>): Promise<void> {\n    await this.destroy();\n    await this.init(opts);\n  }\n\n  async destroy(): Promise<void> {\n    this.disposePipeline?.();\n    this.disposePipeline = null;\n    this.processedTrack = undefined;\n  }\n}\n"]}

package/dist/src/livekit.js

@@ -0,0 +1,63 @@
+"use strict";
+// Opt-in LiveKit adapter, exported from the `react-native-webrtc-kaleidoscope/livekit`
+// subpath. It wraps the web Insertable-Streams pipeline in LiveKit's
+// TrackProcessor interface so consumers do not have to hand-write the glue.
+//
+// Why this exists: the core web API is `applyVideoEffects(track) -> newTrack`,
+// which assumes the caller owns the RTCRtpSender and calls replaceTrack itself.
+// LiveKit owns the sender, so consumers go through `track.setProcessor(...)`
+// instead. This adapter is that bridge:
+//
+//   import { KaleidoscopeProcessor } from 'react-native-webrtc-kaleidoscope/livekit';
+//   await localVideoTrack.setProcessor(
+//     new KaleidoscopeProcessor([{ name: 'composite', layers: [{ id: 'you', shader: 'direct', target: 'subject' }] }]),
+//   );
+//
+// `livekit-client` is an OPTIONAL peer dependency: the import below is type-only
+// (erased at build), so the published JS has no runtime dependency on LiveKit
+// and the agnostic core stays decoupled. Only consumers that import this subpath
+// need livekit-client installed (they already have it).
+//
+// This adapter is web-only: it builds on MediaStreamTrackProcessor /
+// MediaStreamTrackGenerator (Insertable Streams), which exist in Chromium-based
+// browsers. On unsupported environments the underlying pipeline throws a typed
+// error at init().
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.KaleidoscopeProcessor = void 0;
+const index_web_1 = require("./index.web");
+/**
+ * A LiveKit `TrackProcessor` that applies Kaleidoscope video effects to a local
+ * camera track. Construct it with the same effect inputs `applyVideoEffects`
+ * accepts (bare transform names like `'flip-x'`, or full `EffectSpec` composite
+ * objects), then pass it to `localTrack.setProcessor(processor)`.
+ *
+ * `restart` (camera flip / source change) and `destroy` (unpublish) tear down
+ * the prior Insertable-Streams pipeline, so repeated flips do not leak
+ * generators. The page-shared segmenter and WebGL state are module singletons
+ * reused across pipelines, so they are intentionally retained.
+ */
+class KaleidoscopeProcessor {
+    name = 'kaleidoscope';
+    processedTrack;
+    effects;
+    disposePipeline = null;
+    constructor(effects) {
+        this.effects = effects;
+    }
+    async init(opts) {
+        const { track, dispose } = (0, index_web_1.applyVideoEffectsDisposable)(opts.track, this.effects);
+        this.processedTrack = track;
+        this.disposePipeline = dispose;
+    }
+    async restart(opts) {
+        await this.destroy();
+        await this.init(opts);
+    }
+    async destroy() {
+        this.disposePipeline?.();
+        this.disposePipeline = null;
+        this.processedTrack = undefined;
+    }
+}
+exports.KaleidoscopeProcessor = KaleidoscopeProcessor;
+//# sourceMappingURL=livekit.js.map

package/dist/src/livekit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"livekit.js","sourceRoot":"","sources":["../../src/livekit.ts"],"names":[],"mappings":";AAAA,uFAAuF;AACvF,qEAAqE;AACrE,4EAA4E;AAC5E,EAAE;AACF,+EAA+E;AAC/E,gFAAgF;AAChF,6EAA6E;AAC7E,wCAAwC;AACxC,EAAE;AACF,sFAAsF;AACtF,wCAAwC;AACxC,wHAAwH;AACxH,OAAO;AACP,EAAE;AACF,iFAAiF;AACjF,8EAA8E;AAC9E,iFAAiF;AACjF,wDAAwD;AACxD,EAAE;AACF,qEAAqE;AACrE,gFAAgF;AAChF,+EAA+E;AAC/E,mBAAmB;;;AAGnB,2CAA0D;AAG1D;;;;;;;;;;GAUG;AACH;IACW,IAAI,GAAG,cAAc,CAAC;IAC/B,cAAc,CAAoB;IAEjB,OAAO,CAA6B;IAC7C,eAAe,GAAwB,IAAI,CAAC;IAEpD,YAAY,OAAmC;QAC7C,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACzB,CAAC;IAED,KAAK,CAAC,IAAI,CAAC,IAAwC;QACjD,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,IAAA,uCAA2B,EAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QACjF,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC;IACjC,CAAC;IAED,KAAK,CAAC,OAAO,CAAC,IAAwC;QACpD,MAAM,IAAI,CAAC,OAAO,EAAE,CAAC;QACrB,MAAM,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC;IAED,KAAK,CAAC,OAAO;QACX,IAAI,CAAC,eAAe,EAAE,EAAE,CAAC;QACzB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;QAC5B,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;IAClC,CAAC;CACF","sourcesContent":["// Opt-in LiveKit adapter, exported from the `react-native-webrtc-kaleidoscope/livekit`\n// subpath. It wraps the web Insertable-Streams pipeline in LiveKit's\n// TrackProcessor interface so consumers do not have to hand-write the glue.\n//\n// Why this exists: the core web API is `applyVideoEffects(track) -> newTrack`,\n// which assumes the caller owns the RTCRtpSender and calls replaceTrack itself.\n// LiveKit owns the sender, so consumers go through `track.setProcessor(...)`\n// instead. This adapter is that bridge:\n//\n//   import { KaleidoscopeProcessor } from 'react-native-webrtc-kaleidoscope/livekit';\n//   await localVideoTrack.setProcessor(\n//     new KaleidoscopeProcessor([{ name: 'composite', layers: [{ id: 'you', shader: 'direct', target: 'subject' }] }]),\n//   );\n//\n// `livekit-client` is an OPTIONAL peer dependency: the import below is type-only\n// (erased at build), so the published JS has no runtime dependency on LiveKit\n// and the agnostic core stays decoupled. Only consumers that import this subpath\n// need livekit-client installed (they already have it).\n//\n// This adapter is web-only: it builds on MediaStreamTrackProcessor /\n// MediaStreamTrackGenerator (Insertable Streams), which exist in Chromium-based\n// browsers. On unsupported environments the underlying pipeline throws a typed\n// error at init().\n\nimport type { ProcessorOptions, Track, TrackProcessor } from 'livekit-client';\nimport { applyVideoEffectsDisposable } from './index.web';\nimport type { EffectInput } from './kaleidoscope/effect.types';\n\n/**\n * A LiveKit `TrackProcessor` that applies Kaleidoscope video effects to a local\n * camera track. Construct it with the same effect inputs `applyVideoEffects`\n * accepts (bare transform names like `'flip-x'`, or full `EffectSpec` composite\n * objects), then pass it to `localTrack.setProcessor(processor)`.\n *\n * `restart` (camera flip / source change) and `destroy` (unpublish) tear down\n * the prior Insertable-Streams pipeline, so repeated flips do not leak\n * generators. The page-shared segmenter and WebGL state are module singletons\n * reused across pipelines, so they are intentionally retained.\n */\nexport class KaleidoscopeProcessor implements TrackProcessor<Track.Kind.Video> {\n  readonly name = 'kaleidoscope';\n  processedTrack?: MediaStreamTrack;\n\n  private readonly effects: ReadonlyArray<EffectInput>;\n  private disposePipeline: (() => void) | null = null;\n\n  constructor(effects: ReadonlyArray<EffectInput>) {\n    this.effects = effects;\n  }\n\n  async init(opts: ProcessorOptions<Track.Kind.Video>): Promise<void> {\n    const { track, dispose } = applyVideoEffectsDisposable(opts.track, this.effects);\n    this.processedTrack = track;\n    this.disposePipeline = dispose;\n  }\n\n  async restart(opts: ProcessorOptions<Track.Kind.Video>): Promise<void> {\n    await this.destroy();\n    await this.init(opts);\n  }\n\n  async destroy(): Promise<void> {\n    this.disposePipeline?.();\n    this.disposePipeline = null;\n    this.processedTrack = undefined;\n  }\n}\n"]}

package/dist/src/nativewind.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Register the picker and control primitives with NativeWind so they accept
+ * `className`. Idempotent; call once at app/interop setup. Requires the optional
+ * `nativewind` peer dependency.
+ */
+export declare function registerKaleidoscopeNativeWind(): void;
+//# sourceMappingURL=nativewind.d.ts.map

package/dist/src/nativewind.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nativewind.d.ts","sourceRoot":"","sources":["../../src/nativewind.ts"],"names":[],"mappings":"AAwBA;;;;GAIG;AACH,wBAAgB,8BAA8B,IAAI,IAAI,CAWrD","sourcesContent":["// Opt-in NativeWind integration for the picker components (subpath\n// `./nativewind`). Import and call this once from your NativeWind interop setup\n// (the file where you register third-party components for `className`):\n//\n//   import { registerKaleidoscopeNativeWind } from 'react-native-webrtc-kaleidoscope/nativewind';\n//   registerKaleidoscopeNativeWind();\n//\n// This is the only module that imports `nativewind` (an optional peer); the\n// core `./ui` components stay style-agnostic. Without this call the components\n// still work via their defaults and the `style` prop; `className` is simply\n// inert. `cssInterop` maps each component's `className` onto its `style` target,\n// so the class string the consumer passes is resolved by their NativeWind setup.\n\nimport { cssInterop } from 'nativewind';\nimport { PresetBookMenu } from './components/preset-book-menu';\nimport { PresetBookMenuLayout } from './components/preset-book-menu/layout';\nimport { PresetGrid } from './components/preset-book-menu/preset-grid';\nimport { PresetTile } from './components/preset-tile';\nimport { Button } from './components/ui/button';\nimport { ColorPicker } from './components/ui/color-picker';\nimport { Label } from './components/ui/label';\nimport { Readout } from './components/ui/readout';\nimport { Slider } from './components/ui/slider';\n\n/**\n * Register the picker and control primitives with NativeWind so they accept\n * `className`. Idempotent; call once at app/interop setup. Requires the optional\n * `nativewind` peer dependency.\n */\nexport function registerKaleidoscopeNativeWind(): void {\n  const mapping = { className: 'style' } as const;\n  cssInterop(PresetBookMenu, mapping);\n  cssInterop(PresetBookMenuLayout, mapping);\n  cssInterop(PresetGrid, mapping);\n  cssInterop(PresetTile, mapping);\n  cssInterop(Label, mapping);\n  cssInterop(Readout, mapping);\n  cssInterop(Slider, mapping);\n  cssInterop(ColorPicker, mapping);\n  cssInterop(Button, mapping);\n}\n"]}

package/dist/src/nativewind.js

@@ -0,0 +1,43 @@
+"use strict";
+// Opt-in NativeWind integration for the picker components (subpath
+// `./nativewind`). Import and call this once from your NativeWind interop setup
+// (the file where you register third-party components for `className`):
+//
+//   import { registerKaleidoscopeNativeWind } from 'react-native-webrtc-kaleidoscope/nativewind';
+//   registerKaleidoscopeNativeWind();
+//
+// This is the only module that imports `nativewind` (an optional peer); the
+// core `./ui` components stay style-agnostic. Without this call the components
+// still work via their defaults and the `style` prop; `className` is simply
+// inert. `cssInterop` maps each component's `className` onto its `style` target,
+// so the class string the consumer passes is resolved by their NativeWind setup.
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.registerKaleidoscopeNativeWind = registerKaleidoscopeNativeWind;
+const nativewind_1 = require("nativewind");
+const preset_book_menu_1 = require("./components/preset-book-menu");
+const layout_1 = require("./components/preset-book-menu/layout");
+const preset_grid_1 = require("./components/preset-book-menu/preset-grid");
+const preset_tile_1 = require("./components/preset-tile");
+const button_1 = require("./components/ui/button");
+const color_picker_1 = require("./components/ui/color-picker");
+const label_1 = require("./components/ui/label");
+const readout_1 = require("./components/ui/readout");
+const slider_1 = require("./components/ui/slider");
+/**
+ * Register the picker and control primitives with NativeWind so they accept
+ * `className`. Idempotent; call once at app/interop setup. Requires the optional
+ * `nativewind` peer dependency.
+ */
+function registerKaleidoscopeNativeWind() {
+    const mapping = { className: 'style' };
+    (0, nativewind_1.cssInterop)(preset_book_menu_1.PresetBookMenu, mapping);
+    (0, nativewind_1.cssInterop)(layout_1.PresetBookMenuLayout, mapping);
+    (0, nativewind_1.cssInterop)(preset_grid_1.PresetGrid, mapping);
+    (0, nativewind_1.cssInterop)(preset_tile_1.PresetTile, mapping);
+    (0, nativewind_1.cssInterop)(label_1.Label, mapping);
+    (0, nativewind_1.cssInterop)(readout_1.Readout, mapping);
+    (0, nativewind_1.cssInterop)(slider_1.Slider, mapping);
+    (0, nativewind_1.cssInterop)(color_picker_1.ColorPicker, mapping);
+    (0, nativewind_1.cssInterop)(button_1.Button, mapping);
+}
+//# sourceMappingURL=nativewind.js.map

package/dist/src/nativewind.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nativewind.js","sourceRoot":"","sources":["../../src/nativewind.ts"],"names":[],"mappings":";AAAA,mEAAmE;AACnE,gFAAgF;AAChF,wEAAwE;AACxE,EAAE;AACF,kGAAkG;AAClG,sCAAsC;AACtC,EAAE;AACF,4EAA4E;AAC5E,+EAA+E;AAC/E,4EAA4E;AAC5E,iFAAiF;AACjF,iFAAiF;;;AAEjF,2CAAwC;AACxC,oEAA+D;AAC/D,iEAA4E;AAC5E,2EAAuE;AACvE,0DAAsD;AACtD,mDAAgD;AAChD,+DAA2D;AAC3D,iDAA8C;AAC9C,qDAAkD;AAClD,mDAAgD;AAEhD;;;;GAIG;AACH;IACE,MAAM,OAAO,GAAG,EAAE,SAAS,EAAE,OAAO,EAAW,CAAC;IAChD,IAAA,uBAAU,EAAC,iCAAc,EAAE,OAAO,CAAC,CAAC;IACpC,IAAA,uBAAU,EAAC,6BAAoB,EAAE,OAAO,CAAC,CAAC;IAC1C,IAAA,uBAAU,EAAC,wBAAU,EAAE,OAAO,CAAC,CAAC;IAChC,IAAA,uBAAU,EAAC,wBAAU,EAAE,OAAO,CAAC,CAAC;IAChC,IAAA,uBAAU,EAAC,aAAK,EAAE,OAAO,CAAC,CAAC;IAC3B,IAAA,uBAAU,EAAC,iBAAO,EAAE,OAAO,CAAC,CAAC;IAC7B,IAAA,uBAAU,EAAC,eAAM,EAAE,OAAO,CAAC,CAAC;IAC5B,IAAA,uBAAU,EAAC,0BAAW,EAAE,OAAO,CAAC,CAAC;IACjC,IAAA,uBAAU,EAAC,eAAM,EAAE,OAAO,CAAC,CAAC;AAC9B,CAAC","sourcesContent":["// Opt-in NativeWind integration for the picker components (subpath\n// `./nativewind`). Import and call this once from your NativeWind interop setup\n// (the file where you register third-party components for `className`):\n//\n//   import { registerKaleidoscopeNativeWind } from 'react-native-webrtc-kaleidoscope/nativewind';\n//   registerKaleidoscopeNativeWind();\n//\n// This is the only module that imports `nativewind` (an optional peer); the\n// core `./ui` components stay style-agnostic. Without this call the components\n// still work via their defaults and the `style` prop; `className` is simply\n// inert. `cssInterop` maps each component's `className` onto its `style` target,\n// so the class string the consumer passes is resolved by their NativeWind setup.\n\nimport { cssInterop } from 'nativewind';\nimport { PresetBookMenu } from './components/preset-book-menu';\nimport { PresetBookMenuLayout } from './components/preset-book-menu/layout';\nimport { PresetGrid } from './components/preset-book-menu/preset-grid';\nimport { PresetTile } from './components/preset-tile';\nimport { Button } from './components/ui/button';\nimport { ColorPicker } from './components/ui/color-picker';\nimport { Label } from './components/ui/label';\nimport { Readout } from './components/ui/readout';\nimport { Slider } from './components/ui/slider';\n\n/**\n * Register the picker and control primitives with NativeWind so they accept\n * `className`. Idempotent; call once at app/interop setup. Requires the optional\n * `nativewind` peer dependency.\n */\nexport function registerKaleidoscopeNativeWind(): void {\n  const mapping = { className: 'style' } as const;\n  cssInterop(PresetBookMenu, mapping);\n  cssInterop(PresetBookMenuLayout, mapping);\n  cssInterop(PresetGrid, mapping);\n  cssInterop(PresetTile, mapping);\n  cssInterop(Label, mapping);\n  cssInterop(Readout, mapping);\n  cssInterop(Slider, mapping);\n  cssInterop(ColorPicker, mapping);\n  cssInterop(Button, mapping);\n}\n"]}

package/dist/web-driver/effects/composite.d.ts

@@ -0,0 +1,14 @@
+import type { KaleidoscopeLayer } from '../../src/kaleidoscope.preset-book.types';
+import type { FrameTransform } from '../insertable-streams';
+type UniformMap = Readonly<Record<string, number | readonly number[]>>;
+/** Override a layer's uniforms (by layer id) in the running composite; merges. */
+export declare const setLayerUniforms: (id: string, uniforms: UniformMap) => void;
+/**
+ * Drop EVERY layer override. A preset switch calls this so a reused layer id
+ * (e.g. 'blur', shared by the low/medium/high blur presets) reverts to the new
+ * preset's baked uniforms instead of carrying a stale slider override across.
+ */
+export declare const resetLayerUniforms: () => void;
+export declare const makeComposite: (layers: ReadonlyArray<KaleidoscopeLayer>) => FrameTransform;
+export {};
+//# sourceMappingURL=composite.d.ts.map

package/dist/web-driver/effects/composite.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"composite.d.ts","sourceRoot":"","sources":["../../../web-driver/effects/composite.ts"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0CAA0C,CAAC;AAClF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAiZ5D,KAAK,UAAU,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,CAAC,CAAC,CAAC;AAGvE,kFAAkF;AAClF,eAAO,MAAM,gBAAgB,OAAQ,MAAM,YAAY,UAAU,KAAG,IAEnE,CAAC;AAOF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,QAAO,IAErC,CAAC;AASF,eAAO,MAAM,aAAa,WAAY,aAAa,CAAC,iBAAiB,CAAC,KAAG,cAgRxE,CAAC","sourcesContent":["// Web composite compositor: render a painter's stack of layers into one frame.\n//\n// This is the LAYERED path (distinct from the serial single-effect chain in\n// index.web.ts). A composite is one stage: layer 0 is the opaque base, later layers\n// blend over it in array order. Each layer is `{ shader, target?, blend? }`:\n//   - shader 'image'  : a still texture (cover-fit), premultiplied.\n//   - shader 'direct' : passthrough of its channel. On 'subject' that is the\n//     masked camera person; on 'background' it is the raw camera fullscreen.\n//   - shader 'blur'   : a camera-sampling separable gaussian (its `sigma` uniform).\n//   - a generative shader (e.g. 'godrays') : render its frag with `uniforms`.\n//   - target defaults to 'background' (fullscreen); 'subject' stencils to the mask.\n//\n// Two pixel sources: camera-sampling layers ('direct', 'blur') read the live\n// frame; content-generating layers ('image', generative) make their own pixels.\n// `target` decides the stencil for either: a 'background' layer draws fullscreen;\n// a 'subject' layer is multiplied by the mask alpha so it shows only over the\n// segmented person. Direct/subject takes a one-pass fast path (cam x mask); every\n// other subject layer renders to a scratch texture and a masked-composite pass\n// stencils it. The mask edge is the shared mask() tuning, so the demo sliders\n// drive composites.\n\nimport type { KaleidoscopeLayer } from '../../src/kaleidoscope.preset-book.types';\nimport type { FrameTransform } from '../insertable-streams';\nimport { getLatestMask, loadSegmenter, requestMaskIfIdle } from '../segmenter';\nimport {\n  COMPOSITE_BLUR_FRAG_SRC,\n  COMPOSITE_CAMERA_FRAG_SRC,\n  COMPOSITE_IMAGE_FRAG_SRC,\n  COMPOSITE_MASKED_FRAG_SRC,\n  COMPOSITE_SUBJECT_FRAG_SRC,\n  PASSTHROUGH_VERT_SRC,\n} from '../shaders';\nimport { maskSmoothstepRange, tuning } from '../tuning';\nimport { LAYER_SHADER_SOURCES } from './layer-shaders';\n\n// The compositor primitives are single-sourced from catalog/shaders/_shared via\n// build:shaders, imported above: COMPOSITE_IMAGE_FRAG_SRC (cover-fit; also reused\n// for scratch blits, at cover scale or 1,1 for a 1:1 blit), COMPOSITE_SUBJECT_FRAG_SRC (the masked camera\n// person), COMPOSITE_MASKED_FRAG_SRC (stencil any layer to the subject), plus\n// COMPOSITE_CAMERA_FRAG_SRC and COMPOSITE_BLUR_FRAG_SRC. iOS carries one extra\n// blit variant (composite-blit) for its texture-origin parity; web reuses the\n// image shader for its blit.\n\ntype Uniform = number | readonly number[];\n\nconst compileShader = (gl: WebGL2RenderingContext, type: number, source: string): WebGLShader => {\n  const shader = gl.createShader(type);\n  if (!shader) throw new Error('kaleidoscope: gl.createShader returned null');\n  gl.shaderSource(shader, source);\n  gl.compileShader(shader);\n  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n    const log = gl.getShaderInfoLog(shader) ?? '(no info log)';\n    gl.deleteShader(shader);\n    throw new Error(`kaleidoscope: composite shader compile failed: ${log}\\n---\\n${source}`);\n  }\n  return shader;\n};\n\nconst linkProgram = (\n  gl: WebGL2RenderingContext,\n  vertSrc: string,\n  fragSrc: string,\n): WebGLProgram => {\n  const vs = compileShader(gl, gl.VERTEX_SHADER, vertSrc);\n  const fs = compileShader(gl, gl.FRAGMENT_SHADER, fragSrc);\n  const prog = gl.createProgram();\n  if (!prog) throw new Error('kaleidoscope: gl.createProgram returned null');\n  gl.attachShader(prog, vs);\n  gl.attachShader(prog, fs);\n  gl.linkProgram(prog);\n  gl.deleteShader(vs);\n  gl.deleteShader(fs);\n  if (!gl.getProgramParameter(prog, gl.LINK_STATUS)) {\n    const log = gl.getProgramInfoLog(prog) ?? '(no info log)';\n    gl.deleteProgram(prog);\n    throw new Error(`kaleidoscope: composite program link failed: ${log}`);\n  }\n  return prog;\n};\n\nconst bindUniform = (\n  gl: WebGL2RenderingContext,\n  loc: WebGLUniformLocation | null,\n  value: Uniform,\n): void => {\n  if (loc == null) return;\n  if (typeof value === 'number') gl.uniform1f(loc, value);\n  else if (value.length === 2) gl.uniform2fv(loc, new Float32Array(value));\n  else if (value.length === 3) gl.uniform3fv(loc, new Float32Array(value));\n  else if (value.length === 4) gl.uniform4fv(loc, new Float32Array(value));\n  // An even length > 4 is a vec2 array (a polygon: flat [x0,y0, ...]).\n  else if (value.length % 2 === 0) gl.uniform2fv(loc, new Float32Array(value));\n};\n\nconst createTexture = (gl: WebGL2RenderingContext): WebGLTexture => {\n  const tex = gl.createTexture();\n  if (!tex) throw new Error('kaleidoscope: gl.createTexture returned null');\n  gl.bindTexture(gl.TEXTURE_2D, tex);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);\n  return tex;\n};\n\ntype Fbo = { tex: WebGLTexture; fbo: WebGLFramebuffer };\n\n// A render target sized to the frame: an RGBA texture with a framebuffer bound to\n// it, for the blur ping-pong and the subject-stencil scratch.\nconst createFbo = (gl: WebGL2RenderingContext, width: number, height: number): Fbo => {\n  const tex = createTexture(gl);\n  gl.bindTexture(gl.TEXTURE_2D, tex);\n  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);\n  const fbo = gl.createFramebuffer();\n  if (!fbo) throw new Error('kaleidoscope: gl.createFramebuffer returned null');\n  gl.bindFramebuffer(gl.FRAMEBUFFER, fbo);\n  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex, 0);\n  gl.bindFramebuffer(gl.FRAMEBUFFER, null);\n  return { tex, fbo };\n};\n\nconst uploadTexture = (\n  gl: WebGL2RenderingContext,\n  tex: WebGLTexture,\n  source: TexImageSource,\n  flipY: boolean,\n): void => {\n  gl.bindTexture(gl.TEXTURE_2D, tex);\n  gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipY);\n  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);\n  gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);\n};\n\n// --- image loading (cached per source URL) ---------------------------------\n\ntype LoadedImage = { canvas: OffscreenCanvas; width: number; height: number };\n\nconst imageCache = new Map<string, Promise<LoadedImage>>();\n\nconst loadImage = (source: string): Promise<LoadedImage> => {\n  const cached = imageCache.get(source);\n  if (cached) return cached;\n  const promise = (async (): Promise<LoadedImage> => {\n    const res = await fetch(source);\n    if (!res.ok) {\n      throw new Error(`kaleidoscope: composite image fetch failed (${res.status}) for ${source}`);\n    }\n    const blob = await res.blob();\n    const bitmap = await createImageBitmap(blob);\n    // Capture dimensions BEFORE close(): closing an ImageBitmap zeroes its\n    // width/height, and reading them after produced a 0x0 size that made the\n    // cover-fit UV scale NaN and smeared the texture.\n    const width = bitmap.width;\n    const height = bitmap.height;\n    // Stage onto a 2D canvas so UNPACK_FLIP_Y_WEBGL applies on upload (it is a\n    // no-op on ImageBitmap sources).\n    const canvas = new OffscreenCanvas(width, height);\n    const ctx = canvas.getContext('2d');\n    if (!ctx) throw new Error('kaleidoscope: composite image 2D context unavailable');\n    ctx.drawImage(bitmap, 0, 0);\n    bitmap.close();\n    return { canvas, width, height };\n  })();\n  imageCache.set(source, promise);\n  return promise;\n};\n\n// --- per-composite GL state (one composite active at a time) -----------------------\n\ntype ShaderLayerGpu = {\n  prog: WebGLProgram;\n  uTime: WebGLUniformLocation | null;\n  uResolution: WebGLUniformLocation | null;\n  uniforms: Map<string, WebGLUniformLocation | null>;\n};\n\ntype CameraGpu = {\n  prog: WebGLProgram;\n  uCamera: WebGLUniformLocation | null;\n  tex: WebGLTexture;\n};\n\ntype DirectSubjectGpu = {\n  prog: WebGLProgram;\n  uCamera: WebGLUniformLocation | null;\n  uMask: WebGLUniformLocation | null;\n  uMaskUvScale: WebGLUniformLocation | null;\n  uMaskUvOffset: WebGLUniformLocation | null;\n  uMaskLo: WebGLUniformLocation | null;\n  uMaskHi: WebGLUniformLocation | null;\n};\n\ntype BlurGpu = {\n  prog: WebGLProgram;\n  uTex: WebGLUniformLocation | null;\n  uDir: WebGLUniformLocation | null;\n  uSigma: WebGLUniformLocation | null;\n};\n\ntype MaskedGpu = {\n  prog: WebGLProgram;\n  uTex: WebGLUniformLocation | null;\n  uMask: WebGLUniformLocation | null;\n  uMaskUvScale: WebGLUniformLocation | null;\n  uMaskUvOffset: WebGLUniformLocation | null;\n  uMaskLo: WebGLUniformLocation | null;\n  uMaskHi: WebGLUniformLocation | null;\n};\n\ntype GpuState = {\n  gl: WebGL2RenderingContext;\n  canvas: OffscreenCanvas;\n  width: number;\n  height: number;\n  blit: {\n    prog: WebGLProgram;\n    uTex: WebGLUniformLocation | null;\n    uCoverScale: WebGLUniformLocation | null;\n  };\n  imageTextures: Map<string, { tex: WebGLTexture; width: number; height: number }>;\n  shaderPrograms: Map<string, ShaderLayerGpu>;\n  // Camera-sampling support: staged camera + its passthrough program. Present\n  // when any 'direct' or 'blur' layer is in the stack.\n  camera: CameraGpu | null;\n  // The segmentation mask texture. Present when any layer targets the subject.\n  maskTex: WebGLTexture | null;\n  // direct/subject one-pass fast path (cam x mask).\n  directSubject: DirectSubjectGpu | null;\n  // Separable blur program. Present when any 'blur' layer is in the stack.\n  blur: BlurGpu | null;\n  // Masked-composite (stencil any rendered layer to the subject). Present when a\n  // non-direct subject layer is in the stack.\n  masked: MaskedGpu | null;\n  // Scratch render targets: scratchA holds a layer's rendered content (and the\n  // blur's horizontal pass); scratchB holds the blur's vertical pass.\n  scratchA: Fbo | null;\n  scratchB: Fbo | null;\n  // Identity of the layer set this state was built for. Switching composites at the\n  // same resolution must rebuild (different shaders/targets, different programs).\n  layersSig: string;\n};\n\nlet state: GpuState | null = null;\n\nconst layersSignature = (layers: ReadonlyArray<KaleidoscopeLayer>): string =>\n  layers.map((l) => `${l.id}:${l.shader}:${l.target ?? 'background'}`).join('|');\n\nconst disposeState = (s: GpuState): void => {\n  const { gl } = s;\n  gl.deleteProgram(s.blit.prog);\n  for (const p of s.shaderPrograms.values()) gl.deleteProgram(p.prog);\n  for (const t of s.imageTextures.values()) gl.deleteTexture(t.tex);\n  if (s.camera) {\n    gl.deleteProgram(s.camera.prog);\n    gl.deleteTexture(s.camera.tex);\n  }\n  if (s.maskTex) gl.deleteTexture(s.maskTex);\n  if (s.directSubject) gl.deleteProgram(s.directSubject.prog);\n  if (s.blur) gl.deleteProgram(s.blur.prog);\n  if (s.masked) gl.deleteProgram(s.masked.prog);\n  for (const f of [s.scratchA, s.scratchB]) {\n    if (f) {\n      gl.deleteFramebuffer(f.fbo);\n      gl.deleteTexture(f.tex);\n    }\n  }\n};\n\n// Camera frame staged here for both texture upload (flipY actually applies on a\n// canvas source) and as the segmenter input.\nlet inputCanvas2D: OffscreenCanvas | null = null;\nlet inputCtx2D: OffscreenCanvasRenderingContext2D | null = null;\n\nconst ensureInputCanvas = (width: number, height: number): OffscreenCanvasRenderingContext2D => {\n  if (!inputCanvas2D || inputCanvas2D.width !== width || inputCanvas2D.height !== height) {\n    inputCanvas2D = new OffscreenCanvas(width, height);\n    inputCtx2D = inputCanvas2D.getContext('2d');\n    if (!inputCtx2D) throw new Error('kaleidoscope: composite input 2D context unavailable');\n  }\n  return inputCtx2D as OffscreenCanvasRenderingContext2D;\n};\n\nconst isCameraSampler = (shader: string): boolean => shader === 'direct' || shader === 'blur';\n\nconst ensureState = (\n  width: number,\n  height: number,\n  layers: ReadonlyArray<KaleidoscopeLayer>,\n): GpuState => {\n  const sig = layersSignature(layers);\n  if (state && state.width === width && state.height === height && state.layersSig === sig) {\n    return state;\n  }\n  const prevCanvas = state?.canvas;\n  if (state) disposeState(state);\n  const canvas = prevCanvas ?? new OffscreenCanvas(width, height);\n  canvas.width = width;\n  canvas.height = height;\n  const gl = canvas.getContext('webgl2');\n  if (!gl)\n    throw new Error('kaleidoscope: WebGL2 not available; composites require a WebGL2 browser');\n\n  const needsCamera = layers.some((l) => isCameraSampler(l.shader));\n  const needsMask = layers.some((l) => l.target === 'subject');\n  const hasDirectSubject = layers.some((l) => l.shader === 'direct' && l.target === 'subject');\n  const hasGenericSubject = layers.some((l) => l.shader !== 'direct' && l.target === 'subject');\n  const hasBlur = layers.some((l) => l.shader === 'blur');\n\n  const blitProg = linkProgram(gl, PASSTHROUGH_VERT_SRC, COMPOSITE_IMAGE_FRAG_SRC);\n\n  const shaderPrograms = new Map<string, ShaderLayerGpu>();\n  for (const layer of layers) {\n    // Generative layers only: 'image'/'direct' carry no uniforms, and 'blur' has\n    // a sigma uniform but is not a generative frag (it runs the blur program).\n    if (!(layer.shader in LAYER_SHADER_SOURCES) || shaderPrograms.has(layer.shader)) continue;\n    if (!('uniforms' in layer)) continue;\n    const src = LAYER_SHADER_SOURCES[layer.shader];\n    if (!src) throw new Error(`kaleidoscope: unknown composite layer shader '${layer.shader}'`);\n    const prog = linkProgram(gl, PASSTHROUGH_VERT_SRC, src);\n    const uniforms = new Map<string, WebGLUniformLocation | null>();\n    for (const name of Object.keys(layer.uniforms)) {\n      uniforms.set(name, gl.getUniformLocation(prog, name));\n    }\n    shaderPrograms.set(layer.shader, {\n      prog,\n      uTime: gl.getUniformLocation(prog, 'uTime'),\n      uResolution: gl.getUniformLocation(prog, 'uResolution'),\n      uniforms,\n    });\n  }\n\n  let camera: CameraGpu | null = null;\n  if (needsCamera) {\n    const prog = linkProgram(gl, PASSTHROUGH_VERT_SRC, COMPOSITE_CAMERA_FRAG_SRC);\n    camera = { prog, uCamera: gl.getUniformLocation(prog, 'uCamera'), tex: createTexture(gl) };\n  }\n\n  const maskTex = needsMask ? createTexture(gl) : null;\n\n  let directSubject: DirectSubjectGpu | null = null;\n  if (hasDirectSubject) {\n    const prog = linkProgram(gl, PASSTHROUGH_VERT_SRC, COMPOSITE_SUBJECT_FRAG_SRC);\n    directSubject = {\n      prog,\n      uCamera: gl.getUniformLocation(prog, 'uCamera'),\n      uMask: gl.getUniformLocation(prog, 'uMask'),\n      uMaskUvScale: gl.getUniformLocation(prog, 'uMaskUvScale'),\n      uMaskUvOffset: gl.getUniformLocation(prog, 'uMaskUvOffset'),\n      uMaskLo: gl.getUniformLocation(prog, 'uMaskLo'),\n      uMaskHi: gl.getUniformLocation(prog, 'uMaskHi'),\n    };\n  }\n\n  let blur: BlurGpu | null = null;\n  if (hasBlur) {\n    const prog = linkProgram(gl, PASSTHROUGH_VERT_SRC, COMPOSITE_BLUR_FRAG_SRC);\n    blur = {\n      prog,\n      uTex: gl.getUniformLocation(prog, 'uTex'),\n      uDir: gl.getUniformLocation(prog, 'uDir'),\n      uSigma: gl.getUniformLocation(prog, 'uSigma'),\n    };\n  }\n\n  let masked: MaskedGpu | null = null;\n  if (hasGenericSubject) {\n    const prog = linkProgram(gl, PASSTHROUGH_VERT_SRC, COMPOSITE_MASKED_FRAG_SRC);\n    masked = {\n      prog,\n      uTex: gl.getUniformLocation(prog, 'uTex'),\n      uMask: gl.getUniformLocation(prog, 'uMask'),\n      uMaskUvScale: gl.getUniformLocation(prog, 'uMaskUvScale'),\n      uMaskUvOffset: gl.getUniformLocation(prog, 'uMaskUvOffset'),\n      uMaskLo: gl.getUniformLocation(prog, 'uMaskLo'),\n      uMaskHi: gl.getUniformLocation(prog, 'uMaskHi'),\n    };\n  }\n\n  // scratchA: any subject layer that renders content, or the blur horizontal\n  // pass. scratchB: the blur vertical pass result.\n  const scratchA = hasGenericSubject || hasBlur ? createFbo(gl, width, height) : null;\n  const scratchB = hasBlur ? createFbo(gl, width, height) : null;\n\n  state = {\n    gl,\n    canvas,\n    width,\n    height,\n    blit: {\n      prog: blitProg,\n      uTex: gl.getUniformLocation(blitProg, 'uTex'),\n      uCoverScale: gl.getUniformLocation(blitProg, 'uCoverScale'),\n    },\n    imageTextures: new Map(),\n    shaderPrograms,\n    camera,\n    maskTex,\n    directSubject,\n    blur,\n    masked,\n    scratchA,\n    scratchB,\n    layersSig: sig,\n  };\n  return state;\n};\n\nconst coverScale = (outW: number, outH: number, imgW: number, imgH: number): [number, number] => {\n  const outAspect = outW / outH;\n  const imgAspect = imgW / imgH;\n  // Zoom in on the dimension that would otherwise letterbox (cover/center-crop).\n  return outAspect > imgAspect ? [1, imgAspect / outAspect] : [outAspect / imgAspect, 1];\n};\n\n// Live tuning channel: per-layer-id uniform overrides the running compositor\n// merges over a layer's baked uniforms each frame, with no pipeline rebuild\n// (mirrors the mask() tuning). The kaleidoscope verb pushes here so a slider drag\n// updates the composite smoothly. Keyed by layer id (unique within a composite), so a\n// patch addresses exactly one layer even when two layers share a shader.\n//\n// These are INTERNAL: the kaleidoscope verb absorbs them (controls.ts injects\n// setLayerUniforms via the web facade). They are not part of the public surface,\n// but stay exported so the facade and controls can drive them.\ntype UniformMap = Readonly<Record<string, number | readonly number[]>>;\nconst layerUniformOverrides: Record<string, UniformMap> = {};\n\n/** Override a layer's uniforms (by layer id) in the running composite; merges. */\nexport const setLayerUniforms = (id: string, uniforms: UniformMap): void => {\n  layerUniformOverrides[id] = { ...layerUniformOverrides[id], ...uniforms };\n};\n\n/** Drop a layer's override (by layer id), reverting to its baked uniforms. */\nconst clearLayerUniforms = (id: string): void => {\n  delete layerUniformOverrides[id];\n};\n\n/**\n * Drop EVERY layer override. A preset switch calls this so a reused layer id\n * (e.g. 'blur', shared by the low/medium/high blur presets) reverts to the new\n * preset's baked uniforms instead of carrying a stale slider override across.\n */\nexport const resetLayerUniforms = (): void => {\n  for (const id of Object.keys(layerUniformOverrides)) delete layerUniformOverrides[id];\n};\n\nconst mergedUniforms = (\n  layer: Extract<KaleidoscopeLayer, { uniforms: UniformMap }>,\n): UniformMap => {\n  const override = layerUniformOverrides[layer.id];\n  return override ? { ...layer.uniforms, ...override } : layer.uniforms;\n};\n\nexport const makeComposite = (layers: ReadonlyArray<KaleidoscopeLayer>): FrameTransform => {\n  // A preset switch builds a fresh composite; drop any live overrides whose layer id\n  // is not in this stack so a reused id (e.g. 'you') can't carry a stale override\n  // from the previous preset into this one.\n  const ids = new Set(layers.map((l) => l.id));\n  for (const id of Object.keys(layerUniformOverrides)) {\n    if (!ids.has(id)) clearLayerUniforms(id);\n  }\n  const imageSources = layers.filter(\n    (l): l is Extract<KaleidoscopeLayer, { shader: 'image' }> => l.shader === 'image',\n  );\n  const needsSegmentation = layers.some((l) => l.target === 'subject');\n  const needsCamera = layers.some((l) => isCameraSampler(l.shader));\n\n  return async (frame) => {\n    const w = frame.displayWidth;\n    const h = frame.displayHeight;\n\n    // Ensure all image layers are decoded before the first composite.\n    const loaded = await Promise.all(imageSources.map((l) => loadImage(l.source)));\n    if (needsSegmentation) await loadSegmenter();\n\n    const s = ensureState(w, h, layers);\n    const { gl, canvas, blit, imageTextures, shaderPrograms } = s;\n\n    // Upload any image textures not yet on the GPU for this state.\n    for (let i = 0; i < imageSources.length; i++) {\n      const layer = imageSources[i];\n      const img = loaded[i];\n      if (!layer || !img) continue;\n      const src = layer.source;\n      if (imageTextures.has(src)) continue;\n      const tex = createTexture(gl);\n      uploadTexture(gl, tex, img.canvas as unknown as TexImageSource, true);\n      imageTextures.set(src, { tex, width: img.width, height: img.height });\n    }\n\n    // Stage the camera frame: needed for any camera-sampling layer and as the\n    // segmenter input. Upload to the shared camera texture; kick segmentation and\n    // upload the mask when a subject layer is present.\n    let subjectReady = false;\n    if (needsCamera || needsSegmentation) {\n      const inputCtx = ensureInputCanvas(w, h);\n      inputCtx.drawImage(frame, 0, 0, w, h);\n      const inputSource = inputCanvas2D as unknown as CanvasImageSource;\n      if (needsCamera && s.camera) {\n        uploadTexture(gl, s.camera.tex, inputSource as unknown as TexImageSource, true);\n      }\n      if (needsSegmentation && s.maskTex) {\n        requestMaskIfIdle(inputSource);\n        const results = getLatestMask();\n        if (results) {\n          uploadTexture(\n            gl,\n            s.maskTex,\n            results.segmentationMask as unknown as TexImageSource,\n            false,\n          );\n          subjectReady = true;\n        }\n      }\n    }\n\n    const now = performance.now() / 1000;\n    const [maskLo, maskHi] = maskSmoothstepRange(tuning.maskHardness, tuning.maskThreshold);\n\n    // Bind a mask sampler on texture unit 1 for the subject programs (V-flipped in\n    // the sampler, matching the single-effect composite path).\n    const bindMask = (\n      uMask: WebGLUniformLocation | null,\n      uScale: WebGLUniformLocation | null,\n      uOffset: WebGLUniformLocation | null,\n      uLo: WebGLUniformLocation | null,\n      uHi: WebGLUniformLocation | null,\n    ): void => {\n      gl.activeTexture(gl.TEXTURE1);\n      gl.bindTexture(gl.TEXTURE_2D, s.maskTex);\n      gl.uniform1i(uMask, 1);\n      gl.uniform2f(uScale, 1, -1);\n      gl.uniform2f(uOffset, 0, 1);\n      gl.uniform1f(uLo, maskLo);\n      gl.uniform1f(uHi, maskHi);\n    };\n\n    const drawQuad = (): void => gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);\n\n    // Render a layer's content into scratchA (blend off, cleared), returning the\n    // texture that holds it. Blur is special: it runs the separable passes\n    // (camera -> scratchA -> scratchB) and returns scratchB.\n    const renderContentToScratch = (layer: KaleidoscopeLayer): WebGLTexture | null => {\n      gl.disable(gl.BLEND);\n      if (layer.shader === 'blur') {\n        if (!s.blur || !s.camera || !s.scratchA || !s.scratchB) return null;\n        // Read through mergedUniforms so a live slider edit (setLayerUniforms)\n        // reaches the blur pass, exactly like the generative layers below.\n        const sigmaVal = mergedUniforms(layer).sigma;\n        const sigma = typeof sigmaVal === 'number' ? sigmaVal : 4;\n        // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n        gl.useProgram(s.blur.prog);\n        gl.uniform1f(s.blur.uSigma, sigma);\n        // Horizontal pass: camera -> scratchA.\n        gl.bindFramebuffer(gl.FRAMEBUFFER, s.scratchA.fbo);\n        gl.viewport(0, 0, w, h);\n        gl.activeTexture(gl.TEXTURE0);\n        gl.bindTexture(gl.TEXTURE_2D, s.camera.tex);\n        gl.uniform1i(s.blur.uTex, 0);\n        gl.uniform2f(s.blur.uDir, 1 / w, 0);\n        drawQuad();\n        // Vertical pass: scratchA -> scratchB.\n        gl.bindFramebuffer(gl.FRAMEBUFFER, s.scratchB.fbo);\n        gl.viewport(0, 0, w, h);\n        gl.activeTexture(gl.TEXTURE0);\n        gl.bindTexture(gl.TEXTURE_2D, s.scratchA.tex);\n        gl.uniform1i(s.blur.uTex, 0);\n        gl.uniform2f(s.blur.uDir, 0, 1 / h);\n        drawQuad();\n        return s.scratchB.tex;\n      }\n      if (!s.scratchA) return null;\n      gl.bindFramebuffer(gl.FRAMEBUFFER, s.scratchA.fbo);\n      gl.viewport(0, 0, w, h);\n      gl.clearColor(0, 0, 0, 0);\n      gl.clear(gl.COLOR_BUFFER_BIT);\n      if (layer.shader === 'image') {\n        const img = imageTextures.get(layer.source);\n        if (!img) return null;\n        // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n        gl.useProgram(blit.prog);\n        gl.activeTexture(gl.TEXTURE0);\n        gl.bindTexture(gl.TEXTURE_2D, img.tex);\n        gl.uniform1i(blit.uTex, 0);\n        const [sx, sy] = coverScale(w, h, img.width, img.height);\n        gl.uniform2f(blit.uCoverScale, sx, sy);\n        drawQuad();\n        return s.scratchA.tex;\n      }\n      // Generative.\n      const prog = shaderPrograms.get(layer.shader);\n      if (!prog || !('uniforms' in layer)) return null;\n      // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n      gl.useProgram(prog.prog);\n      gl.uniform1f(prog.uTime, now);\n      gl.uniform2f(prog.uResolution, w, h);\n      for (const [name, value] of Object.entries(mergedUniforms(layer))) {\n        bindUniform(gl, prog.uniforms.get(name) ?? null, value);\n      }\n      drawQuad();\n      return s.scratchA.tex;\n    };\n\n    gl.disable(gl.DEPTH_TEST);\n\n    for (let i = 0; i < layers.length; i++) {\n      const layer = layers[i];\n      if (!layer) continue;\n      const target = layer.target ?? 'background';\n      const isBase = i === 0;\n\n      const setOutputBlend = (): void => {\n        gl.bindFramebuffer(gl.FRAMEBUFFER, null);\n        gl.viewport(0, 0, w, h);\n        if (isBase) {\n          gl.disable(gl.BLEND);\n        } else if (layer.blend === 'additive') {\n          gl.enable(gl.BLEND);\n          gl.blendFunc(gl.ONE, gl.ONE); // premultiplied additive\n        } else {\n          gl.enable(gl.BLEND);\n          gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA); // premultiplied \"over\"\n        }\n      };\n\n      if (target === 'subject') {\n        // Subject layers need the mask; skip until it warms up.\n        if (!s.maskTex || !subjectReady) continue;\n        if (layer.shader === 'direct') {\n          // One-pass fast path: cam x mask.\n          if (!s.directSubject || !s.camera) continue;\n          setOutputBlend();\n          // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n          gl.useProgram(s.directSubject.prog);\n          gl.activeTexture(gl.TEXTURE0);\n          gl.bindTexture(gl.TEXTURE_2D, s.camera.tex);\n          gl.uniform1i(s.directSubject.uCamera, 0);\n          bindMask(\n            s.directSubject.uMask,\n            s.directSubject.uMaskUvScale,\n            s.directSubject.uMaskUvOffset,\n            s.directSubject.uMaskLo,\n            s.directSubject.uMaskHi,\n          );\n          drawQuad();\n        } else {\n          // Render the layer content to a scratch, then stencil it through the mask.\n          if (!s.masked) continue;\n          const contentTex = renderContentToScratch(layer);\n          if (!contentTex) continue;\n          setOutputBlend();\n          // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n          gl.useProgram(s.masked.prog);\n          gl.activeTexture(gl.TEXTURE0);\n          gl.bindTexture(gl.TEXTURE_2D, contentTex);\n          gl.uniform1i(s.masked.uTex, 0);\n          bindMask(\n            s.masked.uMask,\n            s.masked.uMaskUvScale,\n            s.masked.uMaskUvOffset,\n            s.masked.uMaskLo,\n            s.masked.uMaskHi,\n          );\n          drawQuad();\n        }\n        continue;\n      }\n\n      // Background layers draw fullscreen.\n      if (layer.shader === 'image') {\n        const img = imageTextures.get(layer.source);\n        if (!img) continue;\n        setOutputBlend();\n        // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n        gl.useProgram(blit.prog);\n        gl.activeTexture(gl.TEXTURE0);\n        gl.bindTexture(gl.TEXTURE_2D, img.tex);\n        gl.uniform1i(blit.uTex, 0);\n        const [sx, sy] = coverScale(w, h, img.width, img.height);\n        gl.uniform2f(blit.uCoverScale, sx, sy);\n        drawQuad();\n      } else if (layer.shader === 'direct') {\n        // Raw camera fullscreen.\n        if (!s.camera) continue;\n        setOutputBlend();\n        // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n        gl.useProgram(s.camera.prog);\n        gl.activeTexture(gl.TEXTURE0);\n        gl.bindTexture(gl.TEXTURE_2D, s.camera.tex);\n        gl.uniform1i(s.camera.uCamera, 0);\n        drawQuad();\n      } else if (layer.shader === 'blur') {\n        const contentTex = renderContentToScratch(layer);\n        if (!contentTex) continue;\n        setOutputBlend();\n        // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n        gl.useProgram(blit.prog);\n        gl.activeTexture(gl.TEXTURE0);\n        gl.bindTexture(gl.TEXTURE_2D, contentTex);\n        gl.uniform1i(blit.uTex, 0);\n        gl.uniform2f(blit.uCoverScale, 1, 1);\n        drawQuad();\n      } else {\n        // Generative background.\n        const prog = shaderPrograms.get(layer.shader);\n        if (!prog || !('uniforms' in layer)) continue;\n        setOutputBlend();\n        // biome-ignore lint/correctness/useHookAtTopLevel: gl.useProgram is a WebGL call, not a React hook.\n        gl.useProgram(prog.prog);\n        gl.uniform1f(prog.uTime, now);\n        gl.uniform2f(prog.uResolution, w, h);\n        for (const [name, value] of Object.entries(mergedUniforms(layer))) {\n          bindUniform(gl, prog.uniforms.get(name) ?? null, value);\n        }\n        drawQuad();\n      }\n    }\n\n    const out = new VideoFrame(canvas as unknown as CanvasImageSource, {\n      timestamp: frame.timestamp,\n      ...(frame.duration != null ? { duration: frame.duration } : {}),\n    });\n    frame.close();\n    return out;\n  };\n};\n"]}