react-native-webrtc-kaleidoscope 2.0.0 → 2.1.0

package/catalog/composites/nebula/nebula.web.ts

@@ -0,0 +1,30 @@
+// Web variant. Resolves the thumbnail URI via expo-asset at module-load time;
+// safe on web (react-native-web has no Image.resolveAssetSource and `.uri` is
+// set synchronously by fromModule). Native is nebula.ts (no thumbnail).
+// Mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+
+import { Asset } from 'expo-asset';
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+import nebulaThumb from './nebula.thumb.webp';
+
+export const nebula = {
+  name: 'Nebula',
+  taxonomy: ['Shaders', 'Nebula'],
+  thumbnail: Asset.fromModule(nebulaThumb).uri,
+  layers: [
+    {
+      id: 'nebula',
+      shader: 'nebula',
+      uniforms: {
+        uColor: [0.53, 0.55, 0.84],
+        uBrightness: 0.87,
+        uSpeed: 0.22,
+        uTwinkleSpeed: 1.94,
+        uScale: 0.88,
+        uStarGlow: 0.38,
+      },
+    },
+    // You, drifting in the field.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/observation-deck/observation-deck.controls.tsx

@@ -0,0 +1,28 @@
+// Turnkey controls for the observation-deck composite: a simianlights `field`
+// plus an anamorphic-lensflare `flare`, each its own ControlForm.
+
+import {
+  CompositeLayerControlPanel,
+  ControlForm,
+  ControlSection,
+  type KaleidoscopeControls,
+} from '../../../src/components/preset-control-panel';
+import { ANAMORPHIC_LENSFLARE_CONTROLS } from '../../shaders/anamorphic-lensflare/anamorphic-lensflare';
+import { SIMIANLIGHTS_CONTROLS } from '../../shaders/simianlights/simianlights';
+
+export function ObservationDeckControls({ uniforms, onPatch, disabled }: KaleidoscopeControls) {
+  return (
+    <>
+      <ControlForm id="field" uniforms={uniforms.field ?? {}} onPatch={onPatch} disabled={disabled}>
+        <ControlSection title="field">
+          <CompositeLayerControlPanel controls={SIMIANLIGHTS_CONTROLS} />
+        </ControlSection>
+      </ControlForm>
+      <ControlForm id="flare" uniforms={uniforms.flare ?? {}} onPatch={onPatch} disabled={disabled}>
+        <ControlSection title="flare">
+          <CompositeLayerControlPanel controls={ANAMORPHIC_LENSFLARE_CONTROLS} />
+        </ControlSection>
+      </ControlForm>
+    </>
+  );
+}

package/catalog/composites/observation-deck/observation-deck.ts

@@ -0,0 +1,59 @@
+// Space observation deck: a simianlights field seen through the deck's panoramic
+// window (a cut-out image), you standing in the room, an anamorphic lens flare
+// across the glass. Back-to-front: simianlights, deck image, you, flare. The
+// full observation-deck composite.
+//
+// A packaged composite: within the library it imports its image layers
+// relatively; a consumer would import from
+// `react-native-webrtc-kaleidoscope/images/<category>/<leaf>` instead.
+
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+// Native variant. The thumbnail is the string id the prebuild plugin bundles
+// `observation-deck.thumb.webp` as into the native app target;
+// `resolveImageUri` looks it up in Bundle.main. The `-thumb` suffix
+// disambiguates from the image of the same composite id. The web sibling
+// (observation-deck.web.ts) keeps the `Asset.fromModule(...).uri` pattern;
+// mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+import { observationDeck as observationDeckImage } from '../../images/spaceship/observation-deck';
+
+export const observationDeck = {
+  name: 'Observation Deck',
+  taxonomy: ['Worlds', 'Spaceship'],
+  thumbnail: 'observation-deck-thumb',
+  layers: [
+    {
+      id: 'field',
+      shader: 'simianlights',
+      uniforms: {
+        uColor: [0.27, 0.44, 0.17],
+        uBrightness: 1.7,
+        uSpeed: 2.66,
+        uTwinkleSpeed: 0.36,
+        uScale: 2.85,
+        uStarGlow: 1.56,
+      },
+    },
+    // The deck interior; the window is cut out so the field shows through.
+    { id: 'observation-deck', shader: 'image', source: observationDeckImage },
+    // You, standing at the window.
+    { id: 'you', shader: 'direct', target: 'subject' },
+    // Lens flare across the glass, on top of everything. Magenta/pink tint
+    // against the green field, ghosts cranked up. Additive.
+    {
+      id: 'flare',
+      shader: 'anamorphic-lensflare',
+      blend: 'additive',
+      uniforms: {
+        uFlareX: 0.33,
+        uFlareY: 0.64,
+        uIntensity: 0.44,
+        uStreakLength: 0.41,
+        uStreakWidth: 165,
+        uGhostStrength: 1.5,
+        uWarmColor: [0.88, 0.28, 0.52],
+        uBlueColor: [0.96, 0.37, 0.81],
+        uPinkColor: [0.91, 0.14, 0.63],
+      },
+    },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/observation-deck/observation-deck.web.ts

@@ -0,0 +1,50 @@
+// Web variant. Resolves the thumbnail URI via expo-asset at module-load time.
+// Native is observation-deck.ts (no thumbnail).
+// Mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+
+import { Asset } from 'expo-asset';
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+import { observationDeck as observationDeckImage } from '../../images/spaceship/observation-deck';
+import observationDeckThumb from './observation-deck.thumb.webp';
+
+export const observationDeck = {
+  name: 'Observation Deck',
+  taxonomy: ['Worlds', 'Spaceship'],
+  thumbnail: Asset.fromModule(observationDeckThumb).uri,
+  layers: [
+    {
+      id: 'field',
+      shader: 'simianlights',
+      uniforms: {
+        uColor: [0.27, 0.44, 0.17],
+        uBrightness: 1.7,
+        uSpeed: 2.66,
+        uTwinkleSpeed: 0.36,
+        uScale: 2.85,
+        uStarGlow: 1.56,
+      },
+    },
+    // The deck interior; the window is cut out so the field shows through.
+    { id: 'observation-deck', shader: 'image', source: observationDeckImage },
+    // You, standing at the window.
+    { id: 'you', shader: 'direct', target: 'subject' },
+    // Lens flare across the glass, on top of everything. Magenta/pink tint
+    // against the green field, ghosts cranked up. Additive.
+    {
+      id: 'flare',
+      shader: 'anamorphic-lensflare',
+      blend: 'additive',
+      uniforms: {
+        uFlareX: 0.33,
+        uFlareY: 0.64,
+        uIntensity: 0.44,
+        uStreakLength: 0.41,
+        uStreakWidth: 165,
+        uGhostStrength: 1.5,
+        uWarmColor: [0.88, 0.28, 0.52],
+        uBlueColor: [0.96, 0.37, 0.81],
+        uPinkColor: [0.91, 0.14, 0.63],
+      },
+    },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/simianlights/simianlights.controls.tsx

@@ -0,0 +1,19 @@
+// Turnkey controls for the simianlights composite (a single `field` layer).
+
+import {
+  CompositeLayerControlPanel,
+  ControlForm,
+  ControlSection,
+  type KaleidoscopeControls,
+} from '../../../src/components/preset-control-panel';
+import { SIMIANLIGHTS_CONTROLS } from '../../shaders/simianlights/simianlights';
+
+export function SimianlightsControls({ uniforms, onPatch, disabled }: KaleidoscopeControls) {
+  return (
+    <ControlForm id="field" uniforms={uniforms.field ?? {}} onPatch={onPatch} disabled={disabled}>
+      <ControlSection title="field">
+        <CompositeLayerControlPanel controls={SIMIANLIGHTS_CONTROLS} />
+      </ControlSection>
+    </ControlForm>
+  );
+}

package/catalog/composites/simianlights/simianlights.ts

@@ -0,0 +1,34 @@
+// Simianlights: the nebula's calmer sibling (sparser, larger glowing orbs) as a
+// standalone space backdrop, you composited over it. Fully procedural; no image
+// layer.
+//
+// A packaged composite consumers can list by importing this module.
+
+// Native variant. The thumbnail is the string id the prebuild plugin bundles
+// `simianlights.thumb.webp` as into the native app target;
+// `resolveImageUri` looks it up in Bundle.main. The web sibling
+// (simianlights.web.ts) keeps the `Asset.fromModule(...).uri` pattern;
+// mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+
+export const simianlights = {
+  name: 'Simianlights',
+  taxonomy: ['Shaders', 'Simianlights'],
+  thumbnail: 'simianlights-thumb',
+  layers: [
+    {
+      id: 'field',
+      shader: 'simianlights',
+      uniforms: {
+        uColor: [0.8, 0.56, 0.42],
+        uBrightness: 0.42,
+        uSpeed: 3,
+        uTwinkleSpeed: 3,
+        uScale: 0.98,
+        uStarGlow: 0.87,
+      },
+    },
+    // You, drifting in the field.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/simianlights/simianlights.web.ts

@@ -0,0 +1,29 @@
+// Web variant. Resolves the thumbnail URI via expo-asset at module-load time.
+// Native is simianlights.ts (no thumbnail).
+// Mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+
+import { Asset } from 'expo-asset';
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+import simianlightsThumb from './simianlights.thumb.webp';
+
+export const simianlights = {
+  name: 'Simianlights',
+  taxonomy: ['Shaders', 'Simianlights'],
+  thumbnail: Asset.fromModule(simianlightsThumb).uri,
+  layers: [
+    {
+      id: 'field',
+      shader: 'simianlights',
+      uniforms: {
+        uColor: [0.8, 0.56, 0.42],
+        uBrightness: 0.42,
+        uSpeed: 3,
+        uTwinkleSpeed: 3,
+        uScale: 0.98,
+        uStarGlow: 0.87,
+      },
+    },
+    // You, drifting in the field.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/underwater/underwater.controls.tsx

@@ -0,0 +1,19 @@
+// Turnkey controls for the underwater composite (a single godrays `rays` layer).
+
+import {
+  CompositeLayerControlPanel,
+  ControlForm,
+  ControlSection,
+  type KaleidoscopeControls,
+} from '../../../src/components/preset-control-panel';
+import { GODRAYS_CONTROLS } from '../../shaders/godrays/godrays';
+
+export function UnderwaterControls({ uniforms, onPatch, disabled }: KaleidoscopeControls) {
+  return (
+    <ControlForm id="rays" uniforms={uniforms.rays ?? {}} onPatch={onPatch} disabled={disabled}>
+      <ControlSection title="rays">
+        <CompositeLayerControlPanel controls={GODRAYS_CONTROLS} />
+      </ControlSection>
+    </ControlForm>
+  );
+}

package/catalog/composites/underwater/underwater.ts

@@ -0,0 +1,42 @@
+// Underwater: the underwater image with animated god rays additively on top, the
+// ray tint color-matched to the composite's cool light, the masked person on top.
+//
+// A packaged composite: within the library it imports its image layers
+// relatively; a consumer would import from
+// `react-native-webrtc-kaleidoscope/images/<category>/<leaf>` instead.
+
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+// Native variant. The thumbnail is the string id the prebuild plugin bundles
+// `underwater.thumb.webp` as into the native app target;
+// `resolveImageUri` looks it up in Bundle.main. The web sibling
+// (underwater.web.ts) keeps the `Asset.fromModule(...).uri` pattern;
+// mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+import { oceanscapeDark } from '../../images/underwater/oceanscape-dark';
+
+export const underwater = {
+  name: 'Underwater',
+  taxonomy: ['Worlds', 'Ocean'],
+  thumbnail: 'underwater-thumb',
+  layers: [
+    { id: 'oceanscape-dark', shader: 'image', source: oceanscapeDark },
+    {
+      id: 'rays',
+      shader: 'godrays',
+      blend: 'additive',
+      uniforms: {
+        uLightColor: [1, 1, 1],
+        uRayCount: 11,
+        uRaySpeed: 0.55,
+        uRayIntensity: 1.2,
+        uRaySoftness: 2.6,
+        uTopGlow: 0.5,
+        uFadeDistance: 0.75,
+        uWobbleAmount: 0.08,
+        uWobbleSpeed: 0.7,
+      },
+    },
+    // The masked camera person, on top (god rays behind them). 'direct' on the
+    // subject target = a passthrough of the segmented person.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/underwater/underwater.web.ts

@@ -0,0 +1,36 @@
+// Web variant. Resolves the thumbnail URI via expo-asset at module-load time.
+// Native is underwater.ts (no thumbnail).
+// Mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+
+import { Asset } from 'expo-asset';
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+import { oceanscapeDark } from '../../images/underwater/oceanscape-dark';
+import underwaterThumb from './underwater.thumb.webp';
+
+export const underwater = {
+  name: 'Underwater',
+  taxonomy: ['Worlds', 'Ocean'],
+  thumbnail: Asset.fromModule(underwaterThumb).uri,
+  layers: [
+    { id: 'oceanscape-dark', shader: 'image', source: oceanscapeDark },
+    {
+      id: 'rays',
+      shader: 'godrays',
+      blend: 'additive',
+      uniforms: {
+        uLightColor: [1, 1, 1],
+        uRayCount: 11,
+        uRaySpeed: 0.55,
+        uRayIntensity: 1.2,
+        uRaySoftness: 2.6,
+        uTopGlow: 0.5,
+        uFadeDistance: 0.75,
+        uWobbleAmount: 0.08,
+        uWobbleSpeed: 0.7,
+      },
+    },
+    // The masked camera person, on top (god rays behind them). 'direct' on the
+    // subject target = a passthrough of the segmented person.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/wizard-tower/wizard-tower.controls.tsx

@@ -0,0 +1,23 @@
+// Turnkey controls for the wizard-tower composite: one ControlForm per tunable
+// layer (here just the clouds `sky`), each wrapped in the shared ControlSection
+// chrome. Mounted by the Tuner; the host routes the shared onPatch into
+// kaleidoscope. Sibling of the data module (wizard-tower.ts), which stays
+// runtime-React-free; this is imported only through the `./controls` subpath.
+
+import {
+  CompositeLayerControlPanel,
+  ControlForm,
+  ControlSection,
+  type KaleidoscopeControls,
+} from '../../../src/components/preset-control-panel';
+import { CLOUDS_CONTROLS } from '../../shaders/clouds/clouds';
+
+export function WizardTowerControls({ uniforms, onPatch, disabled }: KaleidoscopeControls) {
+  return (
+    <ControlForm id="sky" uniforms={uniforms.sky ?? {}} onPatch={onPatch} disabled={disabled}>
+      <ControlSection title="sky">
+        <CompositeLayerControlPanel controls={CLOUDS_CONTROLS} />
+      </ControlSection>
+    </ControlForm>
+  );
+}

package/catalog/composites/wizard-tower/wizard-tower.ts

@@ -0,0 +1,44 @@
+// Wizard tower: sunset clouds visible through the chamber's cut-out sky, the
+// tower image composited on top, you standing in the chamber.
+//
+// A packaged composite: an ordered painter's stack of layers under one name,
+// with display metadata. The library ships it so a consuming book can list it by
+// importing this module; consumers copy this file's shape to author their own.
+// Within the library it imports its image layers relatively; a consumer would
+// import from `react-native-webrtc-kaleidoscope/images/<category>/<leaf>` instead.
+
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+// Native variant. The thumbnail is the string id the prebuild plugin
+// (app.plugin.js) bundles `wizard-tower.thumb.webp` as into the native app
+// target; `resolveImageUri` looks it up in Bundle.main. The web sibling
+// (wizard-tower.web.ts) keeps the `Asset.fromModule(...).uri` pattern;
+// mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+import { wizardTower1 } from '../../images/wizard-tower/wizard-tower-1';
+
+export const wizardTower = {
+  name: 'Wizard Tower',
+  taxonomy: ['Worlds', 'Wizard Tower'],
+  thumbnail: 'wizard-tower-thumb',
+  layers: [
+    {
+      id: 'sky',
+      shader: 'clouds',
+      uniforms: {
+        uSkyLowColor: [0.99, 0.62, 0.03],
+        uSkyHighColor: [0.13, 0.3, 0.84],
+        uCloudLightColor: [0.98, 0.87, 0.53],
+        uCloudDarkColor: [0.98, 0.57, 0.16],
+        uExposure: 1.26,
+        uStepSize: 0.32,
+        uCloudSpeed: 0.92,
+        uCloudScale: 0.77,
+        uDensity: 0.185,
+        uCoverage: 0.55,
+        uSoftness: 0.23,
+      },
+    },
+    { id: 'wizard-tower-1', shader: 'image', source: wizardTower1 },
+    // You, standing in the chamber.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/wizard-tower/wizard-tower.web.ts

@@ -0,0 +1,35 @@
+// Web variant. Resolves the thumbnail URI via expo-asset at module-load time.
+// Native is wizard-tower.ts (no thumbnail). Mirrors images/<id>/{<id>.ts,<id>.web.ts}.
+
+import { Asset } from 'expo-asset';
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+import { wizardTower1 } from '../../images/wizard-tower/wizard-tower-1';
+import wizardTowerThumb from './wizard-tower.thumb.webp';
+
+export const wizardTower = {
+  name: 'Wizard Tower',
+  taxonomy: ['Worlds', 'Wizard Tower'],
+  thumbnail: Asset.fromModule(wizardTowerThumb).uri,
+  layers: [
+    {
+      id: 'sky',
+      shader: 'clouds',
+      uniforms: {
+        uSkyLowColor: [0.99, 0.62, 0.03],
+        uSkyHighColor: [0.13, 0.3, 0.84],
+        uCloudLightColor: [0.98, 0.87, 0.53],
+        uCloudDarkColor: [0.98, 0.57, 0.16],
+        uExposure: 1.26,
+        uStepSize: 0.32,
+        uCloudSpeed: 0.92,
+        uCloudScale: 0.77,
+        uDensity: 0.185,
+        uCoverage: 0.55,
+        uSoftness: 0.23,
+      },
+    },
+    { id: 'wizard-tower-1', shader: 'image', source: wizardTower1 },
+    // You, standing in the chamber.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/wizard-tower-night/wizard-tower-night.controls.tsx

@@ -0,0 +1,22 @@
+// Turnkey controls for the wizard-tower-night composite: one ControlForm for the
+// tunable clouds `sky` layer, wrapped in the shared ControlSection chrome.
+// Sibling of the data module (wizard-tower-night.ts); imported only through the
+// `./controls` subpath.
+
+import {
+  CompositeLayerControlPanel,
+  ControlForm,
+  ControlSection,
+  type KaleidoscopeControls,
+} from '../../../src/components/preset-control-panel';
+import { CLOUDS_CONTROLS } from '../../shaders/clouds/clouds';
+
+export function WizardTowerNightControls({ uniforms, onPatch, disabled }: KaleidoscopeControls) {
+  return (
+    <ControlForm id="sky" uniforms={uniforms.sky ?? {}} onPatch={onPatch} disabled={disabled}>
+      <ControlSection title="sky">
+        <CompositeLayerControlPanel controls={CLOUDS_CONTROLS} />
+      </ControlSection>
+    </ControlForm>
+  );
+}

package/catalog/composites/wizard-tower-night/wizard-tower-night.ts

@@ -0,0 +1,43 @@
+// Wizard tower (night): the same chamber as wizard-tower, lit by torchlight with
+// a deep dusk sky through the cut-out, the night image on top, you in the
+// chamber. A variation of the wizard-tower composite with the clouds `sky`
+// retuned to a moody night and the night image swapped in.
+//
+// A packaged composite: within the library it imports its image layers
+// relatively; a consumer would import from
+// `react-native-webrtc-kaleidoscope/images/<category>/<leaf>` instead.
+
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+// Native variant. The thumbnail is the string id the prebuild plugin bundles
+// `wizard-tower-night.thumb.webp` as into the native app target;
+// `resolveImageUri` looks it up in Bundle.main. The web sibling
+// (wizard-tower-night.web.ts) keeps the `Asset.fromModule(...).uri` pattern.
+import { wizardTowerNight as wizardTowerNightImage } from '../../images/wizard-tower/wizard-tower-night';
+
+export const wizardTowerNight = {
+  name: 'Night',
+  taxonomy: ['Worlds', 'Wizard Tower'],
+  thumbnail: 'wizard-tower-night-thumb',
+  layers: [
+    {
+      id: 'sky',
+      shader: 'clouds',
+      uniforms: {
+        uSkyLowColor: [0.35, 0.12, 0.1],
+        uSkyHighColor: [0.04, 0.05, 0.14],
+        uCloudLightColor: [0.55, 0.45, 0.55],
+        uCloudDarkColor: [0.1, 0.08, 0.16],
+        uExposure: 0.9,
+        uStepSize: 0.32,
+        uCloudSpeed: 0.6,
+        uCloudScale: 0.77,
+        uDensity: 0.16,
+        uCoverage: 0.6,
+        uSoftness: 0.23,
+      },
+    },
+    { id: 'wizard-tower-night', shader: 'image', source: wizardTowerNightImage },
+    // You, standing in the chamber.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;

package/catalog/composites/wizard-tower-night/wizard-tower-night.web.ts

@@ -0,0 +1,35 @@
+// Web variant. Resolves the thumbnail URI via expo-asset at module-load time.
+// Native is wizard-tower-night.ts (no thumbnail).
+
+import { Asset } from 'expo-asset';
+import type { KaleidoscopePreset } from '../../../src/kaleidoscope.preset-book.types';
+import { wizardTowerNight as wizardTowerNightImage } from '../../images/wizard-tower/wizard-tower-night';
+import wizardTowerNightThumb from './wizard-tower-night.thumb.webp';
+
+export const wizardTowerNight = {
+  name: 'Night',
+  taxonomy: ['Worlds', 'Wizard Tower'],
+  thumbnail: Asset.fromModule(wizardTowerNightThumb).uri,
+  layers: [
+    {
+      id: 'sky',
+      shader: 'clouds',
+      uniforms: {
+        uSkyLowColor: [0.35, 0.12, 0.1],
+        uSkyHighColor: [0.04, 0.05, 0.14],
+        uCloudLightColor: [0.55, 0.45, 0.55],
+        uCloudDarkColor: [0.1, 0.08, 0.16],
+        uExposure: 0.9,
+        uStepSize: 0.32,
+        uCloudSpeed: 0.6,
+        uCloudScale: 0.77,
+        uDensity: 0.16,
+        uCoverage: 0.6,
+        uSoftness: 0.23,
+      },
+    },
+    { id: 'wizard-tower-night', shader: 'image', source: wizardTowerNightImage },
+    // You, standing in the chamber.
+    { id: 'you', shader: 'direct', target: 'subject' },
+  ],
+} as const satisfies KaleidoscopePreset;