@mkbabb/glass-ui 4.0.0 → 4.1.0

package/dist/components/custom/easing/composables/useEasingPicker.d.ts

@@ -0,0 +1,80 @@
+import { type ComputedRef, type Ref } from "vue";
+import { jumpTerms } from "@mkbabb/value.js";
+/** The two curve-authoring modes — the two donor arms unified. */
+export type EasingPickerMode = "bezier" | "steps";
+/** A `(t: number) => number` easing callable — the value.js family shape. */
+export type EasingFn = (t: number) => number;
+/** The bezier control-point quad `[x1, y1, x2, y2]`. */
+export type BezierPoints = [number, number, number, number];
+/** A value.js step jump-term (`jump-start`/`end`/`both`/`none` + aliases). */
+export type JumpTerm = (typeof jumpTerms)[number];
+/** The picker's v-model payload — the live curve callable + its re-parseable
+ *  CSS literal + the mode, so a consumer can read back the authored curve. */
+export interface EasingPickerValue {
+    readonly mode: EasingPickerMode;
+    /** The complete re-parseable CSS literal (`cubic-bezier(…)` / `steps(…)`). */
+    readonly css: string;
+    /** The live value.js easing callable the literal evaluates to. */
+    readonly fn: EasingFn;
+    /** The bezier control points (bezier mode). */
+    readonly points: BezierPoints;
+    /** The step jump count (steps mode). */
+    readonly steps: number;
+    /** The step jump term (steps mode). */
+    readonly term: JumpTerm;
+}
+export interface UseEasingPickerOptions {
+    /** The initial mode (default `"bezier"`). */
+    initialMode?: EasingPickerMode;
+    /** The initial bezier preset key (default `"ease-out-back"`). */
+    initialPreset?: string;
+    /** The initial step count (default 4). */
+    initialSteps?: number;
+    /** The initial step term (default `"end"`). */
+    initialTerm?: JumpTerm;
+}
+export interface UseEasingPickerReturn {
+    mode: Ref<EasingPickerMode>;
+    preset: Ref<string>;
+    points: Ref<BezierPoints>;
+    presetNames: readonly string[];
+    selectPreset: (name: string) => void;
+    setHandle: (index: 0 | 1, x: number, y: number) => void;
+    steps: Ref<number>;
+    term: Ref<JumpTerm>;
+    terms: readonly JumpTerm[];
+    /** The live easing callable for the active mode — re-derived on every edit. */
+    easingFn: ComputedRef<EasingFn>;
+    /** The complete re-parseable readout literal for the active mode. */
+    readout: ComputedRef<string>;
+    /** Whether the steps-mode readout round-trips through value.js `parseSteps`
+     *  back to the live (n, term) — the boundary-law proof that the painted
+     *  staircase IS a re-parseable value.js literal, not a hand-rolled string
+     *  the catalogue cannot read back. `true` in bezier mode (no steps literal). */
+    reparseOk: ComputedRef<boolean>;
+    /** The full v-model payload (mode + css + fn + raw params). */
+    value: ComputedRef<EasingPickerValue>;
+    /** Two SVG-space handle coords `[{x,y},{x,y}]` (bezier mode). */
+    handlesSvg: ComputedRef<{
+        x: number;
+        y: number;
+    }[]>;
+    /** The bezier path `d` (`M 0 1 C …`). */
+    bezierPathD: ComputedRef<string>;
+    /** The sampled staircase path `d` (steps mode). */
+    stepPathD: ComputedRef<string>;
+    /** The bezier-canvas viewBox `{ minY, height }` clamping overshoot. */
+    viewBox: ComputedRef<{
+        minY: number;
+        height: number;
+    }>;
+    progress: Ref<number>;
+    playTravel: () => void;
+    stopTravel: () => void;
+}
+/**
+ * The <EasingPicker> shared editor state. Composes the value.js math; owns the
+ * chassis (control points, the literal, the rAF travel). Used by the EasingPicker
+ * SFC + (composed through it) the EasingConfigurator register — ONE source.
+ */
+export declare function useEasingPicker(options?: UseEasingPickerOptions): UseEasingPickerReturn;

package/dist/components/custom/easing/constants.d.ts

@@ -0,0 +1,28 @@
+/** The bezier-mode catalogue key used for the live-edited custom curve. */
+export declare const CUSTOM_PRESET: "custom";
+/** The default bezier-mode preset (a back-overshoot curve reads expressive). */
+export declare const DEFAULT_BEZIER_PRESET: "ease-out-back";
+/** The default steps-mode jump count + term. */
+export declare const DEFAULT_STEP_COUNT = 4;
+export declare const DEFAULT_STEP_TERM: "end";
+/** The steps-mode slider bounds. */
+export declare const STEP_COUNT_MIN = 1;
+export declare const STEP_COUNT_MAX = 12;
+/** Dense staircase sampling so the riser/tread reads crisp (a sampled staircase,
+ *  not a smoothed curve). */
+export declare const STEP_PLOT_SAMPLES = 240;
+/** bezier-Y (0 bottom, 1 top) → SVG-Y (0 top, grows down). */
+export declare const SVG_FLIP: (y: number) => number;
+/** The bezier-canvas viewBox overshoot clamp + pad (a back-curve must not blow up
+ *  the canvas). */
+export declare const VIEW_PAD = 0.1;
+export declare const MAX_OVERSHOOT = 0.6;
+/** The pointer hit-radius for grabbing a handle (touch is forgiving). */
+export declare const HANDLE_HIT_RADIUS = 0.1;
+export declare const HANDLE_HIT_RADIUS_TOUCH = 0.15;
+/** The number of curve samples the viewBox bounds-fit walks. */
+export declare const VIEWBOX_FIT_SAMPLES = 16;
+/** The one-shot rAF travel clock (ms) for the playback dot. */
+export declare const TRAVEL_DURATION_MS = 1200;
+/** The copy-feedback dwell (ms). */
+export declare const COPY_FEEDBACK_MS = 1400;

package/dist/components/custom/easing/index.d.ts

@@ -0,0 +1,3 @@
+export { default as EasingPicker } from "./EasingPicker.vue";
+export { default as EasingConfigurator } from "./EasingConfigurator.vue";
+export { useEasingPicker, type EasingPickerMode, type EasingPickerValue, type EasingFn, type BezierPoints, type JumpTerm, type UseEasingPickerOptions, type UseEasingPickerReturn, } from "./composables/useEasingPicker";

package/dist/components/custom/expandable-container/ExpandableContainer.vue.d.ts

@@ -45,9 +45,20 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     expandLabel: string;
     collapseLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    'expand-trigger'?: (props: {
+        expand: () => void;
+        label: string;
+    }) => any;
+} & {
     default?: (props: {
         fullscreen: boolean;
     }) => any;
+} & {
+    'fullscreen-chrome'?: (props: {
+        collapse: () => void;
+        label: string;
+        fullscreen: boolean;
+    }) => any;
 } & {
     default?: (props: {
         fullscreen: boolean;

package/dist/components/custom/fourier-field/FourierField.vue.d.ts

@@ -1,51 +1,54 @@
-import { type ColorResolver } from "../../../composables/color";
+import type { ColorResolver, OklchStop } from "../../../composables/color";
+import { type BasisComponent } from "./math";
+import type { FourierFieldConfig } from "./constants";
 /**
- * FourierField — a Fourier epicycle field on a Canvas2D surface, a sibling
- * primitive to Aurora and GooBlob. A seeded elliptic spectrum reconstructs a
- * slow, never-ending closed curve via the inverse DFT; a fading comet trail
- * chases the curve's head, and (in the `hero` preset) the nested epicycle
- * circles and arms draw underneath in a harmonious second hue. It composes the
- * `useCanvas2D` substrate, so it inherits the offscreen / tab-hidden /
- * reduced-motion freeze for free — no hand-rolled RAF-park.
+ * FourierField — a Fourier epicycle field on the GPU substrate (BC.W-VIZ-FOURIER), a
+ * sibling primitive to Aurora, GooBlob, and DotFlowField. A chain of rotating circles
+ * stacked tip-to-tail draws the reconstructing partial-sum curve; a glowing comet head
+ * leads the fading trail. WebGPU-FIRST: the compute pass writes the partial-sum curve +
+ * the epicycle chain tips, the fullscreen-fragment render pass composites the SDF field; a
+ * WebGL2 GLSL twin is the genuinely-absent-tail fallback (the §E "WebGPU everywhere"
+ * mandate — the Canvas2D renderer is RETIRED). It composes `useFourierField` → the
+ * `createGpuSubstrate` picker over the ONE canvas lifecycle leaf (offscreen-pause, live-PRM
+ * freeze, consumer-owned DPR) and the SHARED `usePointerVelocityField` (the pointer SCRUBS
+ * the reconstruction).
  *
- * Color resolves through the same INJECTED `colorResolver` seam as GooBlob: the
- * field paints the gamma-sRGB triple it returns. The prop is REQUIRED — pass
- * `defaultBlobColorResolver` from `@mkbabb/glass-ui/color` so a `var()` /
- * `light-dark()` token, an `oklch()` / `hsl()` / hex string all resolve. A
- * `var()` token is first resolved to a concrete `rgb()` against the host's
- * inherited color-scheme, then re-resolved on a color change AND on a dark-mode
- * toggle so the field retints with the theme.
+ * The DEFAULT palette is the warm-cream library identity (`--viz-fourier` warm-amber); a
+ * demo Teal/cool preset stays demo-LOCAL (presets-in-consumers — never a library token).
  *
- * `variant` is the configuration BUNDLE, not a recolour of one curve: `hero`
- * draws a few big phasors with the epicycles ON and a warm trail feel; `final`
- * draws a denser elliptic spectrum with the epicycles OFF. One engine, two
- * presets. The hue itself always comes from the consumer's `color`.
+ * The `variant: "hero"|"final"` prop is RETIRED (BC.W-VIZ-FOURIER — the bundles fold into
+ * config presets, MIGRATION row). An ambient-background consumer passes `color` (+ the
+ * `colorResolver`) for a thin warm default preserving the recessive look; the studio passes
+ * the full `config` + `spectrum` + `getPalette`.
  */
 type __VLS_Props = {
-    /** Configuration bundle. `hero` = epicycles on, fewer harmonics; `final` = epicycles off, denser. Default `hero`. */
-    variant?: "hero" | "final";
-    /** Base CSS color (any form the resolver understands; a `var()`/`light-dark()` token resolves against the host). */
-    color: string;
-    /** REQUIRED color seam — resolves a concrete color to a gamma-sRGB [r,g,b] triple in [0,1]. */
-    colorResolver: ColorResolver;
-    /** Extra seed mixed into the spectrum PRNG for a unique-but-reproducible curve. Default "". */
+    /** The full author config (the studio's `useConfiguratorState` model). Defaults to the warm identity. */
+    config?: FourierFieldConfig;
+    /** An explicit CPU-minted spectrum (a curated shape's DFT). When absent, a seeded elliptic spectrum is generated. */
+    spectrum?: readonly BasisComponent[];
+    /** Resolve the curve palette as OKLCh (the studio themes it). When absent, `color`/`config.palette` is used. */
+    getPalette?: () => OklchStop[];
+    /** Ambient-consumer color seam — a `var()`/`light-dark()` token or a literal; derives a warm 2-stop palette. */
+    color?: string;
+    /** The color resolver (the GooBlob/Aurora seam) — required when `color` is a `var()` token. */
+    colorResolver?: ColorResolver;
+    /** Extra seed mixed into the generated elliptic spectrum PRNG. Default "". */
     seed?: string;
-    /** When true, paint ONE static deterministic best-frame and never animate (the capture/export lever). Default false. */
+    /** Paint ONE static deterministic best-frame and never animate (the capture lever). Default false. */
     freeze?: boolean;
-    /** Outer loudness envelope (the Aurora `opacityCeiling` shape). Scales the
-     *  resolved `peakAlpha`/`headGlowAlpha` at the PAINT layer (a per-LAYER
-     *  multiply, not a uniform CSS opacity). Default 1 (the bundle's resting
-     *  loudness); clamped [0, 2] — the field's ~2 upper bound lets a hero push
-     *  brighter than the recessed default without runaway. */
+    /** Outer loudness envelope (scales the per-layer alpha). When set, overrides `config.intensity`; clamped [0,2]. */
     intensity?: number;
-    /** OPTIONAL injected clock — a getter returning the loop parameter `t ∈ [0,1)`.
-     *  When BOUND, the render reads `clock()` (a controllable studio clock: pause,
-     *  scrub, speed); when ABSENT (the ambient face), the autonomous
-     *  `(now / durationMs) % 1` frame-time loop is the DEFAULT. `freeze` /
-     *  `prefers-reduced-motion` still short-circuit to `frozenT` regardless — the
-     *  ambient bundle is unchanged. The SOLE additive seam (BA.W-FOURIER-STUDIO). */
-    clock?: () => number;
 };
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    backend: () => import("../../../composables/glass/webgpu").GpuBackend;
+    pause: () => void;
+    resume: () => void;
+    wake: () => void;
+    renderAt: (timeSec: number) => void;
+    setHeadT: (t: number) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    seed: string;
+    freeze: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/custom/fourier-field/composables/fourierFieldGLSetup.d.ts

@@ -0,0 +1,15 @@
+import type { WebGLCanvasFrame } from "../../../../composables/glass/webgl/useWebGLCanvas";
+import type { OklchStop } from "../../../../composables/color";
+import { type FourierFieldConfig } from "../constants";
+import { type BasisComponent } from "../math";
+export interface FourierGLSetupDeps {
+    canvas: HTMLCanvasElement;
+    config: FourierFieldConfig;
+    getSpectrum: () => readonly BasisComponent[];
+    getPalette: () => OklchStop[];
+    getHeadT: () => number;
+    shouldContinue: () => boolean;
+    onFrame?: (timeSec: number) => void;
+}
+/** Build the `setupGL(gl)` callback the `createGpuSubstrate` WebGL2 path invokes. */
+export declare function createFourierGLSetup(deps: FourierGLSetupDeps): (gl: WebGL2RenderingContext) => WebGLCanvasFrame;

package/dist/components/custom/fourier-field/composables/fourierFieldWGPUSetup.d.ts

@@ -0,0 +1,20 @@
+import type { WebGPUCanvasFrame } from "../../../../composables/glass/webgpu/useWebGPUCanvas";
+import type { OklchStop } from "../../../../composables/color";
+import { type FourierFieldConfig } from "../constants";
+import type { BasisComponent } from "../math";
+export interface FourierWGPUSetupDeps {
+    canvas: HTMLCanvasElement;
+    config: FourierFieldConfig;
+    /** The CPU-minted spectrum (re-read each frame so a source-swap reaches the buffer). */
+    getSpectrum: () => readonly BasisComponent[];
+    /** The resolved (ColorResolver) palette stops as OKLCh — re-read each frame so a live edit reaches the buffer. */
+    getPalette: () => OklchStop[];
+    /** The single loop parameter `head_t ∈ [0,1)` (the ONE keyframes.js clock). */
+    getHeadT: () => number;
+    /** Demand-gate (the renderer's quiescence layer — substrate-agnostic). */
+    shouldContinue: () => boolean;
+    /** The per-frame pointer hook — useFourierField advances the shared pointer field here. */
+    onFrame?: (timeSec: number) => void;
+}
+/** Build the fourier-field `setupWGPU(device, context, format)` callback. */
+export declare function createFourierWGPUSetup(deps: FourierWGPUSetupDeps): (device: GPUDevice, context: GPUCanvasContext, format: GPUTextureFormat) => WebGPUCanvasFrame;

package/dist/components/custom/fourier-field/composables/uniformBridgeWGPU.d.ts

@@ -0,0 +1,41 @@
+import type { OklchStop } from "../../../../composables/color";
+import { type BasisComponent } from "../math";
+/** One phasor lane in the storage buffer: (re, im, index, _pad). */
+export declare const FOURIER_PHASOR_BYTES = 16;
+export declare const FOURIER_COMPUTE_UNIFORM_BYTES = 32;
+export interface FourierUniformScratch {
+    buffer: ArrayBuffer;
+    f32: Float32Array;
+    i32: Int32Array;
+}
+export declare function createFourierComputeScratch(): FourierUniformScratch;
+/** Pack the compute uniforms in place. */
+export declare function packFourierComputeUniforms(scratch: FourierUniformScratch, headT: number, trailArc: number, harmonicN: number, epicycleArmN: number, sampleCount: number, phasorCount: number): FourierUniformScratch;
+export declare const FOURIER_RENDER_UNIFORM_BYTES: number;
+export declare function createFourierRenderScratch(): FourierUniformScratch;
+/** The model→clip fit transform (center + uniform scale) — computed once per spectrum. */
+export interface FourierFit {
+    centerX: number;
+    centerY: number;
+    /** The uniform scale s such that (model − center)·s maps the curve into clip [-1,1] with margin. */
+    scale: number;
+}
+/**
+ * Stable view-fit: sample the FULL reconstruction once over the period, bound its bbox,
+ * and derive the center + a margin-padded uniform scale. The render's fullscreen pass
+ * inverts this transform per fragment so the curve never clips and the scale is fixed.
+ */
+export declare function computeFourierFit(spectrum: readonly BasisComponent[]): FourierFit;
+/**
+ * Convert a CSS-px stroke width to MODEL units (the shader's space). The fit `scale` maps
+ * model → clip; clip spans [-1,1] over the min CSS dimension → cssPx-per-clip = canvasCssMin/2.
+ * model-per-cssPx = (1/scale)·(2/canvasCssMin).
+ */
+export declare function trailWidthToModel(trailWidthPx: number, scale: number, canvasCssMin: number): number;
+/** Pack the render uniforms in place. */
+export declare function packFourierRenderUniforms(scratch: FourierUniformScratch, fit: FourierFit, aspect: number, trailWidthModel: number, peakAlpha: number, headGlowAlpha: number, trailFadeExp: number, trailFloor: number, intensity: number, showEpicycles: boolean, rainbowChain: boolean, sampleCount: number, armCount: number, palette: OklchStop[]): FourierUniformScratch;
+/**
+ * Pack the phasor storage table (re, im, index, _pad) from the CPU-minted spectrum. The
+ * WGSL SUMS this per frame — it is the ONLY spectrum upload (no WGSL-side mint).
+ */
+export declare function packPhasorTable(spectrum: readonly BasisComponent[]): Float32Array;

package/dist/components/custom/fourier-field/composables/useFourierField.d.ts

@@ -0,0 +1,42 @@
+import { type Ref } from "vue";
+import { type GpuBackend } from "../../../../composables/glass/webgpu/useGpuSubstrate";
+import type { OklchStop } from "../../../../composables/color";
+import type { FourierFieldConfig } from "../constants";
+import type { BasisComponent } from "../math";
+export interface UseFourierFieldOptions {
+    config: FourierFieldConfig;
+    /** The active phasor spectrum (CPU-minted; re-read each frame so a source-swap reaches the buffer). */
+    getSpectrum: () => readonly BasisComponent[];
+    /** Resolve the curve-color palette as OKLCh (the demo themes it; default warm-identity). */
+    getPalette: () => OklchStop[];
+    /** When true, hold the deterministic best-frame and never advance (the capture / freeze lever). */
+    freeze?: () => boolean;
+    /** The static deterministic best-frame parameter under `freeze`/PRM. Default 0.34. */
+    frozenT?: number;
+    /** Base forward period for one full traversal at 1× speed, in seconds. Default 16. */
+    periodS?: number;
+    /** `"capture"` → renderAt-only (the deterministic π capture path). Default `"live"`. */
+    mode?: "live" | "capture";
+}
+/** The uniform handle a consumer wires its lifecycle against (backend-agnostic). */
+export interface FourierFieldHandle {
+    /** The resolved backend (`"webgpu"` where supported, else the WebGL2 GLSL fallback). */
+    readonly backend: GpuBackend;
+    /** Park the loop (the WCAG-2.2.2 pause seam — `DockBackgroundToggle` wires this). */
+    pause: () => void;
+    /** Re-arm the loop. */
+    resume: () => void;
+    /** Re-arm a parked loop on demand. */
+    wake: () => void;
+    /** Draw one frame out-of-loop (capture / thumbnail). */
+    renderAt: (timeSec: number) => void;
+    /** The live `prefers-reduced-motion: reduce` state. */
+    readonly reducedMotion: boolean;
+    /** The current loop parameter `head_t ∈ [0,1)` (the scrubber reads/writes it). */
+    readonly headT: number;
+    /** Scrub the clock directly (the transport scrubber / a pointer drag). */
+    setHeadT: (t: number) => void;
+    /** Tear down the renderer + release GPU/GL resources. */
+    dispose: () => void;
+}
+export declare function useFourierField(canvasRef: Ref<HTMLCanvasElement | null>, options: UseFourierFieldOptions): FourierFieldHandle;

package/dist/components/custom/fourier-field/constants.d.ts

@@ -0,0 +1,64 @@
+import type { OklchStop } from "../../../composables/color";
+/**
+ * Curve-sampling resolution for the stable view-fit bbox pass — the renderer samples the
+ * epicycle curve this many times once at mount to size it to the canvas with a fixed
+ * margin (so the curve never clips and the scale is constant across the run). 720 = one
+ * sample per half-degree of the unit period.
+ */
+export declare const FOURIER_FIT_SAMPLES = 720;
+/**
+ * The phasor-table uniform ceiling — the WGSL `MAX_PHASORS` #define. The configurator's
+ * harmonic count maxes here; a >64-term custom trace books a storage-buffer widen (cheap —
+ * the flow-field already uses a storage buffer). The curated ℱ/heart/star set + the
+ * generated elliptic spectrum all sit under it.
+ */
+export declare const MAX_PHASORS = 64;
+/**
+ * The comet-curve sample ceiling — the storage-buffer array bound. The compute pass
+ * writes the partial-sum curve point at `M` samples back along the period from the head;
+ * the render pass reads them as the comet polyline. 384 gives a smooth bold stroke.
+ */
+export declare const MAX_CURVE_SAMPLES = 384;
+/** The palette-stop ceiling — the WGSL `MAX_FOURIER_STOPS` #define. */
+export declare const MAX_FOURIER_STOPS = 4;
+/**
+ * The full author schema — the studio's `useConfiguratorState` model. Every field is a
+ * tunable the demo configurator drives; the composable resolves it into the uniform table.
+ */
+export interface FourierFieldConfig {
+    /** The active phasor spectrum source key — `"elliptic"` (generated) or a curated shape key. */
+    source: string;
+    /** TRUNCATE the partial sum — the harmonic count N (1..min(spectrum.length, MAX_PHASORS)). */
+    harmonics: number;
+    /** Draw the rotating epicycle chain (orthogonal to N). */
+    showEpicycles: boolean;
+    /** How many chain arms to draw (1..N; ≤ the harmonic count). */
+    epicycleArms: number;
+    /** Paint the chain as a warm-anchored hue sweep vs one analogous hue. */
+    rainbowChain: boolean;
+    /** Comet-body length as a fraction of the period (0.15..1.0). */
+    trailArc: number;
+    /** Comet stroke weight in CSS px (1..6). */
+    trailWidth: number;
+    /** Outer loudness envelope (per-layer alpha multiply, 0..2). */
+    intensity: number;
+    /** Character of the generated elliptic spectrum (0.05..0.4 — smooth ellipse → crinkled). */
+    harmonicScale: number;
+    /** Clock speed multiplier (0.25/0.5/1/2). */
+    speed: number;
+    /** The curve-color ramp (the library viz palette; warm default). Resolved via the ColorResolver. */
+    palette: OklchStop[];
+    /** ONE static frame then park under `prefers-reduced-motion: reduce`. */
+    respectReducedMotion: boolean;
+    /** Pointer scrubs `head_t` + a flick injects clock momentum (the W-VIZ-INTERACTION consume). */
+    interactive: boolean;
+}
+/**
+ * The warm-cream identity palette (the library default — NOT teal). A two-stop warm-amber
+ * ramp over the warm-cream foreground family, resolved via the ColorResolver. The chain's
+ * rainbow sweep is warm-anchored over THIS base; a consumer (the demo) themes it through a
+ * preset, never a token edit.
+ */
+export declare const WARM_IDENTITY_PALETTE: OklchStop[];
+/** The shipped warm-identity default config. */
+export declare const DEFAULT_FOURIER_CONFIG: FourierFieldConfig;

package/dist/components/custom/fourier-field/index.d.ts

@@ -1,26 +1,31 @@
-import type { ColorResolver } from "../../../composables/color";
+import type { ColorResolver, OklchStop } from "../../../composables/color";
+import type { FourierFieldConfig } from "./constants";
+import type { BasisComponent } from "./math";
 export { default as FourierField } from "./FourierField.vue";
 export { comp, positionsAt, partialSumAt, dftFromPoints, makeEllipticSpectrum, type BasisComponent, type EllipticSpectrumOptions, } from "./math";
-/** The configuration-BUNDLE axis — `hero` (epicycles on, fewer harmonics) vs
- *  `final` (epicycles off, denser). Not a recolour of one curve; one engine,
- *  two presets. */
-export type FourierFieldVariant = "hero" | "final";
-/** The props a consumer forwards when wrapping `<FourierField>` (the seeded
- *  inverse-DFT epicycle background; ships via `/fourier-field`). Mirrors the
- *  component's inline `defineProps` shape (an SFC cannot export its inline
- *  props type). */
+export { DEFAULT_FOURIER_CONFIG, WARM_IDENTITY_PALETTE, MAX_PHASORS, MAX_CURVE_SAMPLES, type FourierFieldConfig, } from "./constants";
+export { useFourierField, type FourierFieldHandle, type UseFourierFieldOptions, } from "./composables/useFourierField";
+/**
+ * The props a consumer forwards when wrapping `<FourierField>` (the GPU-substrate epicycle
+ * field; ships via `/fourier-field`). Mirrors the component's inline `defineProps` shape (an
+ * SFC cannot export its inline props type). BC.W-VIZ-FOURIER — the `variant: "hero"|"final"`
+ * enum is RETIRED (folds into config presets); the renderer is the WGSL-primary GPU substrate.
+ */
 export interface FourierFieldProps {
-    /** Configuration bundle. Default `hero`. */
-    variant?: FourierFieldVariant;
-    /** Base CSS color (a `var()`/`light-dark()` token resolves against the host). */
-    color: string;
-    /** REQUIRED color seam — resolves a concrete color to a gamma-sRGB [r,g,b] triple in [0,1]. */
-    colorResolver: ColorResolver;
-    /** Extra seed mixed into the spectrum PRNG for a unique-but-reproducible curve. Default "". */
+    /** The full author config (the studio's `useConfiguratorState` model). Defaults to the warm identity. */
+    config?: FourierFieldConfig;
+    /** An explicit CPU-minted spectrum (a curated shape's DFT). When absent, a seeded elliptic spectrum is generated. */
+    spectrum?: readonly BasisComponent[];
+    /** Resolve the curve palette as OKLCh (the studio themes it). */
+    getPalette?: () => OklchStop[];
+    /** Ambient-consumer color seam — a `var()`/`light-dark()` token or a literal; derives a warm palette. */
+    color?: string;
+    /** The color resolver (the GooBlob/Aurora seam) — required when `color` is a `var()` token. */
+    colorResolver?: ColorResolver;
+    /** Extra seed mixed into the generated elliptic spectrum PRNG. Default "". */
     seed?: string;
     /** Paint ONE static deterministic best-frame and never animate (the capture lever). Default false. */
     freeze?: boolean;
-    /** Outer loudness envelope (the Aurora `opacityCeiling` shape). Scales the
-     *  resolved `peakAlpha`/`headGlowAlpha` at the paint layer. Default 1; clamped [0, 2]. */
+    /** Outer loudness envelope (scales the per-layer alpha). Overrides `config.intensity` when set; clamped [0, 2]. */
     intensity?: number;
 }

package/dist/components/custom/fourier-field/shaders/fourier-field.compute.wgsl.d.ts

@@ -0,0 +1 @@
+export declare const FOURIER_FIELD_COMPUTE_WGSL = "\nconst MAX_PHASORS: i32 = 64;\nconst TAU: f32 = 6.283185307179586;\n\nstruct Phasor {\n  // (re, im, index, _pad)\n  data: vec4<f32>,\n};\n\n// \u2500\u2500 Compute uniforms (the typed-struct source-of-truth \u2014 see uniformBridgeWGPU.ts) \u2500\u2500\nstruct ComputeUniforms {\n  // c0: (headT, trailArc, _pad, _pad)\n  c0: vec4<f32>,\n  // ints: (harmonicN, epicycleArmN, sampleCount, phasorCount)\n  ints: vec4<i32>,\n};\n\n@group(0) @binding(0) var<uniform> u: ComputeUniforms;\n@group(0) @binding(1) var<storage, read> phasors: array<Phasor>;\n// curveSamples[i] = (x, y, age, _pad)\n@group(0) @binding(2) var<storage, read_write> curveSamples: array<vec4<f32>>;\n// chainTips[k] = (x, y, _pad, _pad) \u2014 the running tip after stacking phasor k\n@group(0) @binding(3) var<storage, read_write> chainTips: array<vec4<f32>>;\n\n// The PARTIAL-SUM curve point at parameter t over the first n phasors \u2014 the WGSL\n// transcription of math.ts:78-95 (partialSumAt). EXACTLY:\n//   c += vec2(re\u00B7cos \u2212 im\u00B7sin, re\u00B7sin + im\u00B7cos)  with angle = TAU\u00B7index\u00B7t.\nfn partialSumAt(t: f32, n: i32) -> vec2<f32> {\n  var c = vec2<f32>(0.0, 0.0);\n  let phasorCount = u.ints.w;\n  let lim = min(n, phasorCount);\n  for (var i = 0; i < MAX_PHASORS; i = i + 1) {\n    if (i >= lim) { break; }\n    let p = phasors[i].data;\n    let re = p.x;\n    let im = p.y;\n    let index = p.z;\n    let angle = TAU * index * t;\n    let cs = cos(angle);\n    let sn = sin(angle);\n    c = c + vec2<f32>(re * cs - im * sn, re * sn + im * cs);\n  }\n  return c;\n}\n\n// The epicycle chain tip after stacking the first k phasors at head_t \u2014 the WGSL\n// transcription of math.ts:41-60 (positionsAt, read at the running tip). The running tip\n// after phasor (k\u22121) is exactly the partial sum over the first k terms.\nfn epicycleChainTip(t: f32, k: i32) -> vec2<f32> {\n  return partialSumAt(t, k);\n}\n\n@compute @workgroup_size(64)\nfn cs_main(@builtin(global_invocation_id) gid: vec3<u32>) {\n  let i = i32(gid.x);\n  let headT = u.c0.x;\n  let trailArc = u.c0.y;\n  let harmonicN = u.ints.x;\n  let armN = u.ints.y;\n  let sampleCount = u.ints.z;\n\n  // \u2500\u2500 The comet body samples \u2500\u2500\n  if (i < sampleCount) {\n    // age: 0 at the oldest tail (i = sampleCount\u22121), 1 at the head (i = 0).\n    let denom = max(f32(sampleCount - 1), 1.0);\n    let frac = f32(i) / denom;                 // 0 = head, 1 = tail\n    let age = 1.0 - frac;                       // 1 = head, 0 = tail\n    // sample back along the period from the head by trailArc.\n    var t = headT - trailArc * frac;\n    t = t - floor(t);                           // fract \u2192 [0,1)\n    let pt = partialSumAt(t, harmonicN);\n    curveSamples[i] = vec4<f32>(pt.x, pt.y, age, 0.0);\n  }\n\n  // \u2500\u2500 The epicycle chain tips (k = 0..armN, capped to harmonicN) \u2500\u2500\n  // chainTips[0] is the origin; chainTips[k] is the tip after phasor (k\u22121).\n  let armLim = min(armN, harmonicN);\n  if (i <= armLim && i <= MAX_PHASORS) {\n    let tip = epicycleChainTip(headT, i);\n    chainTips[i] = vec4<f32>(tip.x, tip.y, 0.0, 0.0);\n  }\n}\n";

package/dist/components/custom/fourier-field/shaders/fourier-field.glsl.d.ts

@@ -0,0 +1,4 @@
+/** The full-screen-triangle vertex shader (the aurora/concentric pattern). */
+export declare const FOURIER_FIELD_VERT_GLSL = "#version 300 es\nin vec2 aPosition;\nout vec2 vClip;\nvoid main() {\n  vClip = aPosition;\n  gl_Position = vec4(aPosition, 0.0, 1.0);\n}\n";
+/** The fragment SDF — the GLSL twin of fourier-field.render.wgsl.ts's fs_main. */
+export declare const FOURIER_FIELD_FRAG_GLSL = "#version 300 es\nprecision highp float;\n\n#define MAX_CURVE_SAMPLES 256\n#define MAX_PHASORS 64\n\nin vec2 vClip;\nout vec4 fragColor;\n\nuniform vec4 uFit;          // (centerX, centerY, scale, aspect)\nuniform vec4 uTrail;        // (trailWidth, peakAlpha, headGlowAlpha, trailFadeExp)\nuniform vec4 uEnv;          // (trailFloor, intensity, showEpicycles, rainbowChain)\nuniform int  uSampleCount;\nuniform int  uArmCount;\nuniform int  uStopCount;\nuniform vec3 uPalette[4];   // linear-sRGB stops\n// curveSamples[i] = (x, y, age) in MODEL space; chainTips[k] = (x, y) in MODEL space.\nuniform vec3 uCurve[MAX_CURVE_SAMPLES];\nuniform vec2 uChain[MAX_PHASORS];\n\nconst float PI = 3.141592653589793;\n\n\nfloat srgbToLinearCh(float c) {\n    return c <= 0.04045 ? c / 12.92 : pow((c + 0.055) / 1.055, 2.4);\n}\nvec3 srgbToLinear(vec3 c) {\n    return vec3(srgbToLinearCh(c.r), srgbToLinearCh(c.g), srgbToLinearCh(c.b));\n}\n\nfloat linearToSrgbCh(float c) {\n    return c <= 0.0031308 ? c * 12.92 : 1.055 * pow(c, 1.0 / 2.4) - 0.055;\n}\nvec3 linearToSrgb(vec3 c) {\n    return vec3(linearToSrgbCh(c.r), linearToSrgbCh(c.g), linearToSrgbCh(c.b));\n}\n\n// value.js LINEAR_SRGB_TO_LMS (constants.ts), row-major; written here as GLSL\n// columns (= the transpose) so mat3 * vec3 evaluates the row-major M\u00B7v.\nconst mat3 LINEAR_SRGB_TO_LMS = mat3(\n    0.4122214708, 0.2119034982, 0.0883024619,\n    0.5363325363, 0.6806995451, 0.2817188376,\n    0.0514459929, 0.1073969566, 0.6299787005\n);\n\n// value.js srgbToOKLab's INLINE LMS\u2192OKLab coefficients (gamut.ts lines 295-297 \u2014\n// these differ at the ~1e-9 digit from LMS_TO_OKLAB_MATRIX; use the inline ones to\n// mirror the exact value.js path), row-major \u2192 GLSL columns.\nconst mat3 LMS_TO_OKLAB = mat3(\n    0.2104542553, 1.9779984951, 0.0259040371,\n    0.7936177850, -2.4285922050, 0.7827717662,\n    -0.0040720468, 0.4505937099, -0.8086757660\n);\n\n// value.js OKLAB_TO_LMS_COEFF (constants.ts), row-major \u2192 GLSL columns. Rows:\n// l = [1, 0.3963377774, 0.2158037573], m = [1, -0.1055613458, -0.0638541728],\n// s = [1, -0.0894841775, -1.2914855480].\nconst mat3 OKLAB_TO_LMS = mat3(\n    1.0, 1.0, 1.0,\n    0.3963377774, -0.1055613458, -0.0894841775,\n    0.2158037573, -0.0638541728, -1.2914855480\n);\n\n// value.js LMS_TO_LINEAR_SRGB (constants.ts), row-major \u2192 GLSL columns.\nconst mat3 LMS_TO_LINEAR_SRGB = mat3(\n    4.0767416621, -1.2684380046, -0.0041960863,\n    -3.3077115913, 2.6097574011, -0.7034186147,\n    0.2309699292, -0.3413193965, 1.7076147010\n);\n\n// Gamma sRGB \u2192 raw OKLab (L, a, b). Mirrors value.js srgbToOKLab.\nvec3 srgbToOklab(vec3 c) {\n    vec3 lin = srgbToLinear(c);\n    vec3 lms = LINEAR_SRGB_TO_LMS * lin;\n    vec3 lmsCbrt = sign(lms) * pow(abs(lms), vec3(1.0 / 3.0));\n    return LMS_TO_OKLAB * lmsCbrt;\n}\n\n// Raw OKLab (L, a, b) \u2192 linear sRGB. Mirrors value.js oklabToLinearSRGB.\nvec3 oklabToLinearSrgb(vec3 lab) {\n    vec3 lms_ = OKLAB_TO_LMS * lab;\n    vec3 lms = lms_ * lms_ * lms_;\n    return LMS_TO_LINEAR_SRGB * lms;\n}\n\n// OKLab \u2192 OKLCh: H in RADIANS. Mirrors value.js rawOklabToOklch (which returns\n// degrees; we stay in radians and only fold to [0, 2pi)).\nvec3 oklabToOklch(vec3 lab) {\n    float C = length(lab.yz);\n    float H = atan(lab.z, lab.y);\n    if (H < 0.0) H += 2.0 * PI;\n    return vec3(lab.x, C, H);\n}\n\n// OKLCh (H radians) \u2192 OKLab. Mirrors value.js rawOklchToOklab.\nvec3 oklchToOklab(vec3 lch) {\n    return vec3(lch.x, lch.y * cos(lch.z), lch.y * sin(lch.z));\n}\n\n// Negative-safe cube root (the WGSL chunk's cbrt3 twin; the GLSL chunk inlines it).\nvec3 cbrt3(vec3 v) { return sign(v) * pow(abs(v), vec3(1.0 / 3.0)); }\n\nvec3 samplePaletteLin(float t) {\n  if (uStopCount <= 1) return uPalette[0];\n  float n = float(uStopCount);\n  float ft = clamp(t, 0.0, 1.0) * (n - 1.0);\n  int i0 = int(floor(ft));\n  int i1 = min(i0 + 1, uStopCount - 1);\n  float f = ft - float(i0);\n  vec3 labA = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * uPalette[i0]);\n  vec3 labB = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * uPalette[i1]);\n  return oklabToLinearSrgb(mix(labA, labB, f));\n}\n\nvec3 chainColorLin(float seg, bool rainbow) {\n  vec3 baseLin = uPalette[0];\n  if (!rainbow) return baseLin;\n  vec3 lab = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * baseLin);\n  vec3 lch = oklabToOklch(lab);\n  float hueShift = mix(-0.45, 1.15, clamp(seg, 0.0, 1.0));\n  vec3 lifted = vec3(0.66, max(lch.y, 0.14), lch.z + hueShift);\n  return oklabToLinearSrgb(oklchToOklab(lifted));\n}\n\nfloat segDist(vec2 p, vec2 a, vec2 b) {\n  vec2 pa = p - a;\n  vec2 ba = b - a;\n  float h = clamp(dot(pa, ba) / max(dot(ba, ba), 1e-8), 0.0, 1.0);\n  return length(pa - ba * h);\n}\n\nvoid main() {\n  vec2 center = uFit.xy;\n  float scale = max(uFit.z, 1e-6);\n  float aspect = max(uFit.w, 1e-4);\n  // clip \u2192 model (the inverse of model\u2192clip fit).\n  vec2 p = center + vec2(vClip.x * aspect, vClip.y) / scale;\n\n  float aa = max(fwidth(p.x) + fwidth(p.y), 1e-5) * 0.75;\n  float trailWidth = uTrail.x;            // already in model units (packed CPU-side)\n  float peak = uTrail.y * uEnv.y;\n  float headGlow = uTrail.z * uEnv.y;\n  float fadeExp = uTrail.w;\n  float trailFloor = uEnv.x;\n  bool showEpicycles = uEnv.z > 0.5;\n  bool rainbow = uEnv.w > 0.5;\n  float halfW = trailWidth * 0.5;\n\n  vec4 accum = vec4(0.0);\n\n  if (showEpicycles && uArmCount >= 1) {\n    for (int k = 0; k < MAX_PHASORS; k++) {\n      if (k >= uArmCount) break;\n      vec2 a = uChain[k];\n      vec2 b = uChain[k + 1];\n      float seg = float(k) / max(float(uArmCount - 1), 1.0);\n      vec3 lin = chainColorLin(seg, rainbow);\n      float radius = length(b - a);\n      float dRing = abs(length(p - a) - radius);\n      float ringW = max(halfW * 0.45, aa);\n      float ringMask = (1.0 - smoothstep(ringW, ringW + aa, dRing)) * 0.5;\n      float dArm = segDist(p, a, b);\n      float armMask = 1.0 - smoothstep(halfW * 0.55, halfW * 0.55 + aa, dArm);\n      float dotR = max(halfW * 0.7, aa * 2.0);\n      float dDot = length(p - a);\n      float dotMask = 1.0 - smoothstep(dotR, dotR + aa, dDot);\n      float m = clamp(max(max(ringMask, armMask), dotMask), 0.0, 1.0) * peak * 0.7;\n      vec3 rgb = clamp(linearToSrgb(lin), vec3(0.0), vec3(1.0));\n      accum = vec4(rgb * m, m) + accum * (1.0 - m);\n    }\n  }\n\n  for (int i = 0; i < MAX_CURVE_SAMPLES; i++) {\n    if (i >= uSampleCount - 1) break;\n    vec3 sa = uCurve[i];\n    vec3 sb = uCurve[i + 1];\n    float d = segDist(p, sa.xy, sb.xy);\n    float cover = 1.0 - smoothstep(halfW, halfW + aa, d);\n    if (cover < 0.002) continue;\n    float age = max(sa.z, sb.z);\n    float a = peak * pow(age, fadeExp);\n    a = max(a, peak * trailFloor) * cover;\n    vec3 lin = samplePaletteLin(1.0 - age * 0.4);\n    vec3 rgb = clamp(linearToSrgb(lin), vec3(0.0), vec3(1.0));\n    accum = vec4(rgb * a, a) + accum * (1.0 - a);\n  }\n\n  if (uSampleCount >= 1) {\n    vec2 head = uCurve[0].xy;\n    float dHead = length(p - head);\n    float coreR = halfW * 1.5;\n    float haloR = coreR * 3.0;\n    vec3 headRgb = clamp(linearToSrgb(samplePaletteLin(0.0)), vec3(0.0), vec3(1.0));\n    float halo = (1.0 - smoothstep(0.0, haloR, dHead)) * headGlow * 0.35;\n    accum = vec4(headRgb * halo, halo) + accum * (1.0 - halo);\n    float core = (1.0 - smoothstep(coreR, coreR + aa, dHead)) * headGlow;\n    accum = vec4(headRgb * core, core) + accum * (1.0 - core);\n    float spec = (1.0 - smoothstep(coreR * 0.4, coreR * 0.4 + aa, dHead)) * headGlow * 0.9;\n    accum = vec4(vec3(1.0) * spec, spec) + accum * (1.0 - spec);\n  }\n\n  fragColor = accum;\n}\n";

package/dist/components/custom/fourier-field/shaders/fourier-field.render.wgsl.d.ts

@@ -0,0 +1 @@
+export declare const FOURIER_FIELD_RENDER_WGSL = "\nconst PI: f32 = 3.141592653589793;\nconst TAU: f32 = 6.283185307179586;\nconst MAX_CURVE_SAMPLES: i32 = 384;\nconst MAX_PHASORS: i32 = 64;\nconst MAX_FOURIER_STOPS: i32 = 4;\n\n// \u2500\u2500 Render uniforms (the typed-struct source-of-truth \u2014 see uniformBridgeWGPU.ts) \u2500\u2500\nstruct RenderUniforms {\n  // r0: (centerX, centerY, scale, aspect)  \u2014 model\u2192clip fit transform\n  r0: vec4<f32>,\n  // r1: (trailWidth, peakAlpha, headGlowAlpha, trailFadeExp)\n  r1: vec4<f32>,\n  // r2: (trailFloor, intensity, showEpicycles, rainbowChain)\n  r2: vec4<f32>,\n  // ints: (sampleCount, armCount, stopCount, _pad)\n  ints: vec4<i32>,\n  // palette stops: linear-sRGB rgb + _pad\n  palette: array<vec4<f32>, 4>,\n};\n\n@group(0) @binding(0) var<uniform> u: RenderUniforms;\n// curveSamples[i] = (x, y, age, _pad) in MODEL space\n@group(0) @binding(1) var<storage, read> curveSamples: array<vec4<f32>>;\n// chainTips[k] = (x, y, _pad, _pad) in MODEL space\n@group(0) @binding(2) var<storage, read> chainTips: array<vec4<f32>>;\n\n\nfn srgbToLinearCh(c: f32) -> f32 {\n  if (c <= 0.04045) { return c / 12.92; }\n  return pow((c + 0.055) / 1.055, 2.4);\n}\nfn srgbToLinear(c: vec3<f32>) -> vec3<f32> {\n  return vec3<f32>(srgbToLinearCh(c.r), srgbToLinearCh(c.g), srgbToLinearCh(c.b));\n}\n\nfn linearToSrgbCh(c: f32) -> f32 {\n  if (c <= 0.0031308) { return c * 12.92; }\n  return 1.055 * pow(c, 1.0 / 2.4) - 0.055;\n}\nfn linearToSrgb(c: vec3<f32>) -> vec3<f32> {\n  return vec3<f32>(linearToSrgbCh(c.r), linearToSrgbCh(c.g), linearToSrgbCh(c.b));\n}\n\n// value.js LINEAR_SRGB_TO_LMS, row-major \u2192 WGSL columns (= the transpose).\nconst LINEAR_SRGB_TO_LMS: mat3x3<f32> = mat3x3<f32>(\n  0.4122214708, 0.2119034982, 0.0883024619,\n  0.5363325363, 0.6806995451, 0.2817188376,\n  0.0514459929, 0.1073969566, 0.6299787005\n);\n\n// value.js srgbToOKLab's INLINE LMS\u2192OKLab coefficients, row-major \u2192 WGSL columns.\nconst LMS_TO_OKLAB: mat3x3<f32> = mat3x3<f32>(\n  0.2104542553, 1.9779984951, 0.0259040371,\n  0.7936177850, -2.4285922050, 0.7827717662,\n  -0.0040720468, 0.4505937099, -0.8086757660\n);\n\n// value.js OKLAB_TO_LMS_COEFF, row-major \u2192 WGSL columns.\nconst OKLAB_TO_LMS: mat3x3<f32> = mat3x3<f32>(\n  1.0, 1.0, 1.0,\n  0.3963377774, -0.1055613458, -0.0894841775,\n  0.2158037573, -0.0638541728, -1.2914855480\n);\n\n// value.js LMS_TO_LINEAR_SRGB, row-major \u2192 WGSL columns.\nconst LMS_TO_LINEAR_SRGB: mat3x3<f32> = mat3x3<f32>(\n  4.0767416621, -1.2684380046, -0.0041960863,\n  -3.3077115913, 2.6097574011, -0.7034186147,\n  0.2309699292, -0.3413193965, 1.7076147010\n);\n\nfn cbrt3(v: vec3<f32>) -> vec3<f32> {\n  return sign(v) * pow(abs(v), vec3<f32>(1.0 / 3.0));\n}\n\n// Gamma sRGB \u2192 raw OKLab (L, a, b). Mirrors value.js srgbToOKLab.\nfn srgbToOklab(c: vec3<f32>) -> vec3<f32> {\n  let lin = srgbToLinear(c);\n  let lms = LINEAR_SRGB_TO_LMS * lin;\n  return LMS_TO_OKLAB * cbrt3(lms);\n}\n\n// Raw OKLab (L, a, b) \u2192 linear sRGB. Mirrors value.js oklabToLinearSRGB.\nfn oklabToLinearSrgb(lab: vec3<f32>) -> vec3<f32> {\n  let lms_ = OKLAB_TO_LMS * lab;\n  let lms = lms_ * lms_ * lms_;\n  return LMS_TO_LINEAR_SRGB * lms;\n}\n\n// OKLab \u2192 OKLCh: H in RADIANS, folded to [0, 2pi). Mirrors value.js rawOklabToOklch.\nfn oklabToOklch(lab: vec3<f32>) -> vec3<f32> {\n  let C = length(lab.yz);\n  var H = atan2(lab.z, lab.y);\n  if (H < 0.0) { H = H + 2.0 * PI; }\n  return vec3<f32>(lab.x, C, H);\n}\n\n// OKLCh (H radians) \u2192 OKLab. Mirrors value.js rawOklchToOklab.\nfn oklchToOklab(lch: vec3<f32>) -> vec3<f32> {\n  return vec3<f32>(lch.x, lch.y * cos(lch.z), lch.y * sin(lch.z));\n}\n\n// Sample the multi-stop palette (linear-sRGB stops, OKLab mix). t in [0,1].\nfn samplePaletteLin(t: f32) -> vec3<f32> {\n  let stopCount = u.ints.z;\n  if (stopCount <= 1) { return u.palette[0].rgb; }\n  let n = f32(stopCount);\n  let ft = clamp(t, 0.0, 1.0) * (n - 1.0);\n  let i0 = i32(floor(ft));\n  let i1 = min(i0 + 1, stopCount - 1);\n  let f = ft - f32(i0);\n  let labA = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * u.palette[i0].rgb);\n  let labB = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * u.palette[i1].rgb);\n  return oklabToLinearSrgb(mix(labA, labB, f));\n}\n\n// A warm-anchored chain hue sweep over the palette base \u2014 the rainbow chain register.\n// Tilts the base hue by a tight warm-ward band so the chain stays colourful but warm.\nfn chainColorLin(seg: f32, rainbow: bool) -> vec3<f32> {\n  let baseLin = u.palette[0].rgb;\n  if (!rainbow) { return baseLin; }\n  let lab = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * baseLin);\n  let lch = oklabToOklch(lab);\n  // warm-anchored: a touch cool at the root climbing warm toward the tips.\n  let hueShift = mix(-0.45, 1.15, clamp(seg, 0.0, 1.0)); // radians (~ -26\u00B0..+66\u00B0)\n  let h = lch.z + hueShift;\n  let lifted = vec3<f32>(0.66, max(lch.y, 0.14), h);\n  return oklabToLinearSrgb(oklchToOklab(lifted));\n}\n\n// Distance from point p to segment ab (model space).\nfn segDist(p: vec2<f32>, a: vec2<f32>, b: vec2<f32>) -> f32 {\n  let pa = p - a;\n  let ba = b - a;\n  let h = clamp(dot(pa, ba) / max(dot(ba, ba), 1e-8), 0.0, 1.0);\n  return length(pa - ba * h);\n}\n\nstruct VSOut {\n  @builtin(position) pos: vec4<f32>,\n  @location(0) model: vec2<f32>,   // model-space coordinate of this fragment\n};\n\n@vertex\nfn vs_main(@builtin(vertex_index) vi: u32) -> VSOut {\n  // Full-screen triangle (covers the viewport with 3 verts).\n  var p = array<vec2<f32>, 3>(\n    vec2<f32>(-1.0, -3.0), vec2<f32>(-1.0, 1.0), vec2<f32>(3.0, 1.0),\n  );\n  let clip = p[vi];\n  // Inverse of the model\u2192clip fit: clip = (model \u2212 center)\u00B7scale, aspect-corrected x.\n  // \u2192 model = center + clip\u00B7(1/scale), x un-aspect-corrected.\n  let center = u.r0.xy;\n  let scale = max(u.r0.z, 1e-6);\n  let aspect = max(u.r0.w, 1e-4);\n  let model = center + vec2<f32>(clip.x * aspect, clip.y) / scale;\n\n  var out: VSOut;\n  out.pos = vec4<f32>(clip, 0.0, 1.0);\n  out.model = model;\n  return out;\n}\n\n@fragment\nfn fs_main(in: VSOut) -> @location(0) vec4<f32> {\n  let p = in.model;\n  // AA feather: one device pixel in model units (fwidth of the model coord).\n  let aa = max(fwidth(p.x) + fwidth(p.y), 1e-5) * 0.75;\n\n  let trailWidth = u.r1.x;                // already in model units (packed CPU-side)\n  let peak = u.r1.y * u.r2.y;             // peakAlpha \u00B7 intensity\n  let headGlow = u.r1.z * u.r2.y;\n  let fadeExp = u.r1.w;\n  let trailFloor = u.r2.x;\n  let sampleCount = u.ints.x;\n  let armCount = u.ints.y;\n  let showEpicycles = u.r2.z > 0.5;\n  let rainbow = u.r2.w > 0.5;\n  let halfW = trailWidth * 0.5;\n\n  var accum = vec4<f32>(0.0);              // premultiplied accumulation\n\n  // \u2500\u2500 Epicycle scaffolding (orbit rings + arms + joint dots) UNDER the curve \u2500\u2500\n  if (showEpicycles && armCount >= 1) {\n    for (var k = 0; k < MAX_PHASORS; k = k + 1) {\n      if (k >= armCount) { break; }\n      let a = chainTips[k].xy;\n      let b = chainTips[k + 1].xy;\n      let seg = f32(k) / max(f32(armCount - 1), 1.0);\n      let lin = chainColorLin(seg, rainbow);\n      // orbit RING around a (radius = arm length).\n      let radius = length(b - a);\n      let dRing = abs(length(p - a) - radius);\n      let ringW = max(halfW * 0.45, aa);\n      let ringMask = (1.0 - smoothstep(ringW, ringW + aa, dRing)) * 0.5;\n      // ARM segment a\u2192b.\n      let dArm = segDist(p, a, b);\n      let armMask = 1.0 - smoothstep(halfW * 0.55, halfW * 0.55 + aa, dArm);\n      // joint DOT at a.\n      let dotR = max(halfW * 0.7, aa * 2.0);\n      let dDot = length(p - a);\n      let dotMask = 1.0 - smoothstep(dotR, dotR + aa, dDot);\n      let m = clamp(max(max(ringMask, armMask), dotMask), 0.0, 1.0) * peak * 0.7;\n      let rgb = clamp(linearToSrgb(lin), vec3<f32>(0.0), vec3<f32>(1.0));\n      // over-composite (premultiplied).\n      accum = vec4<f32>(rgb * m, m) + accum * (1.0 - m);\n    }\n  }\n\n  // \u2500\u2500 The comet TRAIL \u2014 min-distance to the curve polyline, per-segment age fade \u2500\u2500\n  for (var i = 0; i < MAX_CURVE_SAMPLES; i = i + 1) {\n    if (i >= sampleCount - 1) { break; }\n    let sa = curveSamples[i];\n    let sb = curveSamples[i + 1];\n    let d = segDist(p, sa.xy, sb.xy);\n    let cover = 1.0 - smoothstep(halfW, halfW + aa, d);\n    if (cover < 0.002) { continue; }\n    let age = max(sa.z, sb.z);            // 1 at head, 0 at tail\n    var a = peak * pow(age, fadeExp);\n    a = max(a, peak * trailFloor);\n    a = a * cover;\n    let lin = samplePaletteLin(1.0 - age * 0.4); // warm core, lighter tail\n    let rgb = clamp(linearToSrgb(lin), vec3<f32>(0.0), vec3<f32>(1.0));\n    accum = vec4<f32>(rgb * a, a) + accum * (1.0 - a);\n  }\n\n  // \u2500\u2500 The comet HEAD \u2014 halo + saturated core + white specular at curveSamples[0] \u2500\u2500\n  if (sampleCount >= 1) {\n    let head = curveSamples[0].xy;\n    let dHead = length(p - head);\n    let coreR = halfW * 1.5;\n    let haloR = coreR * 3.0;\n    let headLin = samplePaletteLin(0.0);\n    let headRgb = clamp(linearToSrgb(headLin), vec3<f32>(0.0), vec3<f32>(1.0));\n    // soft halo\n    let halo = (1.0 - smoothstep(0.0, haloR, dHead)) * headGlow * 0.35;\n    accum = vec4<f32>(headRgb * halo, halo) + accum * (1.0 - halo);\n    // saturated core\n    let core = (1.0 - smoothstep(coreR, coreR + aa, dHead)) * headGlow;\n    accum = vec4<f32>(headRgb * core, core) + accum * (1.0 - core);\n    // white specular\n    let spec = (1.0 - smoothstep(coreR * 0.4, coreR * 0.4 + aa, dHead)) * headGlow * 0.9;\n    accum = vec4<f32>(vec3<f32>(1.0) * spec, spec) + accum * (1.0 - spec);\n  }\n\n  return accum;\n}\n";

package/dist/components/custom/glass-panel/GlassPanel.vue.d.ts

@@ -33,9 +33,9 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<GlassPanelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<GlassPanelProps> & Readonly<{}>, {
+    blur: number;
     variant: GlassPanelVariant;
     surface: Surface;
-    blur: number;
     refraction: number;
     chromaticAberration: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/custom/goo-blob/GooBlob.vue.d.ts

@@ -1,11 +1,13 @@
-import type { BlobMood, BlobConfig } from "./types";
+import type { BlobMood, BlobConfig, BlobVariant } from "./types";
 /**
  * GooBlob — a gooey metaball creature on a WebGL2 canvas.
  *
  * Renders a pulsing SDF body with orbiting satellites that periodically merge in,
  * get absorbed, then re-emerge. Mood, pointer-attraction and a deterministic
- * satellite system drive the motion. The renderer composes the `useWebGLCanvas`
- * substrate — it never bootstraps its own context.
+ * satellite system drive the motion. The renderer composes the `createGpuSubstrate`
+ * picker — the WebGPU-first `metaball.wgsl` primary OR the WebGL2 `metaball.frag`
+ * fallback (BB.W-VIZ-SUITE / W-GOOBLOB-WGPU), selected once by `navigator.gpu`
+ * feature-detect; it never bootstraps its own context.
  *
  * Color is resolved INTERNALLY through the `/color` leaf (`cssToOklch →
  * oklchToGammaRgb`): the blob paints the GAMMA-sRGB triple of the `color` prop. A
@@ -28,6 +30,14 @@ type __VLS_Props = {
      * The metaball tuning. Pass `BLOB_CONFIG_DEFAULTS` for the stock look.
      */
     config?: BlobConfig;
+    /**
+     * BC.W-GOOBLOB-PLAIN — the render-variant axis. `"blob"` is the STAGE-1
+     * shadowless lightless fill-only floor; `"meatball"` (default) is the full lit
+     * register. When set it WINS the resolved config's `variant` (the per-instance
+     * override); unset, the config's own `variant` rules. STAGE 1's `uStage` gate
+     * strips the lit/shadow blocks for the `"blob"` register.
+     */
+    variant?: BlobVariant;
     /** Extra seed string mixed into the satellite PRNG for a unique-but-reproducible system. */
     seed?: string;
     /**

package/dist/components/custom/goo-blob/composables/uniformBridgeWGPU.d.ts

@@ -0,0 +1,24 @@
+import type { BlobConfig } from "../types";
+import type { BlobPointer } from "./useBlobPointer";
+import type { BlobSatelliteSystem } from "./useBlobSatellites";
+import type { BlobFrameState } from "./uploadBlobUniforms";
+/** The total uniform-buffer byte size (16-aligned). */
+export declare const BLOB_WGPU_UNIFORM_BYTES: number;
+/**
+ * The packed scratch buffer + the dual ArrayBuffer views. A frame refills this in place
+ * (no per-frame allocation) — mirroring the GLSL bridge's per-frame `gl.uniformNf` writes.
+ */
+export interface BlobWGPUUniformScratch {
+    buffer: ArrayBuffer;
+    f32: Float32Array;
+    i32: Int32Array;
+}
+export declare function createBlobWGPUUniformScratch(): BlobWGPUUniformScratch;
+/**
+ * Pack the resolved blob frame state into the uniform scratch buffer. The byte layout
+ * mirrors the WGSL `Uniforms` struct EXACTLY, and the resolved-value math is the
+ * BYTE-IDENTICAL twin of `uploadBlobUniforms.ts` (the same `* 0.5 * POS_SCALE` mapping,
+ * the same `reachFactor`/`orbitWiden`/`maxReach` derivations). Returns the same scratch
+ * (the caller `queue.writeBuffer`s `scratch.buffer`).
+ */
+export declare function packBlobWGPUUniforms(scratch: BlobWGPUUniformScratch, canvas: HTMLCanvasElement, config: BlobConfig, pointer: BlobPointer, satellites: BlobSatelliteSystem, frame: BlobFrameState): BlobWGPUUniformScratch;