@mkbabb/glass-ui 4.2.0 → 5.0.0

package/dist/components/handmark/constants.d.ts

@@ -0,0 +1,69 @@
+/**
+ * constants.ts — the marking-space geometry constants (the colocation home).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * The hand-mark family's named geometry constants live here (the AY.W-COLOCATE
+ * convention's `constants.ts` home). geometry.ts + the SFC re-read them by name.
+ */
+/** Marking-space width (the 0..100 × 0..40 viewBox; `preserveAspectRatio="none"`). */
+export declare const VB_W = 100;
+/** Marking-space height. */
+export declare const VB_H = 40;
+/**
+ * The hairline gap, as a fraction of the `.hm` box, between the MEASURED text
+ * baseline and the underline centerline. The underline rides just under the real
+ * glyph bottoms — a hand mark sits a few % of cap-height below the baseline, never
+ * through it (the E1 occlusion root: a constant `y=32` strikethroughs tight-leading
+ * display type because 80% of a `line-height:1.02` box IS the baseline).
+ */
+export declare const UNDERLINE_GAP = 0.06;
+/**
+ * The highlighter LOW-SEAT band (BA.W-HANDMARK C-1(a)). A real highlighter rides
+ * the low two-thirds of the line — the ink sits on the baseline and rises to
+ * ~x-height — NOT the box vertical center the fork shipped. The band centerline
+ * seats at `baselineFrac − HIGHLIGHT_RISE` (raised off the baseline by ~half a
+ * lowercase x-height) so the wide slab (weight 26) covers x-height down to the
+ * baseline. Expressed as a fraction of the `.hm` box, parallel to UNDERLINE_GAP.
+ */
+export declare const HIGHLIGHT_RISE = 0.22;
+/** Pre-measure fallback for the highlight band's low seat (null baselineFrac). */
+export declare const HIGHLIGHT_FALLBACK_FRAC = 0.66;
+/**
+ * The boil voice — φ-incommensurate fractal value-noise (the masthead morphology).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * The boil centerline is a 1-D fractal value-noise displacement off the HOUSE
+ * `mulberry32`, NOT a seeded sinusoid. A sinusoid (the prior body) self-correlates
+ * into a near-period — it reads as a spell-check squiggle and a clean sine fails any
+ * honest non-periodicity discriminator (a sine's extrema are near-uniformly spaced).
+ * The value-noise sums octaves at φ-stepped frequencies (mutually irrational → the
+ * sum NEVER closes into a period); each octave's amplitude decays by 1/φ. The result
+ * is a hump-to-hump-IRREGULAR hand line whose inter-extremum spacing-CV is the honest
+ * teeth (measured: ~0.41 at the paint's segment count, ~0.71 resampled at RES=64,
+ * over 400 seeds — vs the prior sinusoid's ~0.14; a clean separation either side of a
+ * 0.30 floor). The amplitude is SCALE-RELATIVE (a fraction of the rendered span), so
+ * a long word and a short word wobble in proportion. FILTER-FREE — the wander lives
+ * in the control points + the hull width, never a feTurbulence.
+ *
+ * Constants pinned against a 400-seed spacing-CV spike (NOT the seed-overfit autocorr
+ * peak the prior gate keyed — autocorr cannot separate smooth low-frequency value-
+ * noise from a sinusoid at any resolution).
+ */
+/** φ — the per-octave frequency step (mutually irrational → never periodic). */
+export declare const NOISE_PHI = 1.618033988749895;
+/** octave count of the fractal value-noise sum. */
+export declare const NOISE_OCTAVES = 4;
+/** base octave frequency (humps across the unit span); octave k rides F0·φ^k. */
+export declare const NOISE_F0 = 2.5;
+/** displacement amplitude as a fraction of the rendered span (scale-relative). */
+export declare const NOISE_AMP_FRAC = 0.05;
+/** endpoint-only cosine taper width (the ends settle to baseline; the BODY stays irregular). */
+export declare const NOISE_EDGE = 0.12;
+/**
+ * The AMPLITUDE-KNOB reference wobble (BG.W-HANDMARK-PERFECT (c)). The natural-underline
+ * excursion is `span × NOISE_AMP_FRAC × f(wobble)` where `f(wobble) = wobble / NOISE_WOBBLE_REF`
+ * — repurposing the existing Brush `wobble` scalar to drive the centerline amplitude,
+ * decoupling excursion from stroke `weight` (the atlas's published `amplitude` ask, no 13th
+ * scalar). Pinned to the shipped `boil` brush's wobble (1.4) so `f(1.4) = 1` ⇒ the default
+ * boil render is BYTE-IDENTICAL; a consumer lifts excursion by raising `wobble` (or the
+ * explicit `amplitude` prop, which wins). A lower-wobble brush wobbles proportionally less.
+ */
+export declare const NOISE_WOBBLE_REF = 1.4;

package/dist/components/handmark/geometry.d.ts

@@ -0,0 +1,65 @@
+/**
+ * geometry.ts — SEMANTIC shape → pencil-boil centerlines (L1, pure; SPEC §3).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * A shape is a pure mapper: (semantic target) → L1 geometry. The renderer never
+ * knows what it drew — it sees only `Point[]`. Adding a shape = adding one switch
+ * arm; nothing downstream changes (texture + animation are shape-blind). This is
+ * the generality lever (Brush ⟂ Path).
+ *
+ * The marking coordinate space is 0..100 × 0..40, with `preserveAspectRatio="none"`
+ * so the <svg> stretches to the slotted word box (the SPEC §6.2 width-invariance
+ * contract). Two usage modes:
+ *   - text mode (box == null): use the full viewBox (single-line underline/strike)
+ *   - positioned mode (box = {x,y,w,h}): map an explicit rect (circle a datum)
+ *
+ * The circle arm rides pencil-boil 0.4.x's `ellipsePoints` (the hand-circle
+ * overshoot ring — the sole upstream geometry delta this component required).
+ *
+ * THE SEED RECONCILE (BA.W-HANDMARK [S2]): the wobble centerlines are seeded from
+ * the HOUSE prng leaf (`src/composables/glass/procedural/prng.ts` mulberry32 + hashString — the AV.W14
+ * single-source). The family FEEDS pencil-boil a house-derived integer seed; glass-
+ * ui code imports ZERO `mulberry32` from pencil-boil (its internal mulberry32 stays
+ * inside its OWN perturb math). ONE seed leaf, the house identity.
+ */
+import { type WobbleOptions } from "@mkbabb/pencil-boil";
+import { UNDERLINE_GAP, VB_H, VB_W } from "./constants";
+import type { HandShape, MarkBox } from "./types";
+export { naturalUnderlinePoints } from "./noise";
+export { VB_W, VB_H, UNDERLINE_GAP };
+/** A shape maps to one or more centerlines (open polylines) or one closed ring. */
+export interface ShapeGeom {
+    lines: [number, number][][];
+    closed: boolean;
+}
+/**
+ * Semantic shape → { lines, closed } in the marking space (or a positioned box).
+ *
+ * The text-mode underline anchors to a MEASURED baseline: `baselineFrac` is the
+ * slotted word's alphabetic baseline as a fraction of the `.hm` box height (the SFC
+ * measures it via ResizeObserver + `document.fonts.ready`). The underline y is then
+ * `H × (baselineFrac + UNDERLINE_GAP)` — never the old hardcoded `32` (80% of the
+ * box), which struck through tight-leading headings. `null` ⇒ not yet measured: fall
+ * back to the legacy `H − 8` constant so first paint (and jsdom/SSR) still renders a
+ * line, replaced the instant the measure lands.
+ *
+ * `natural` routes the underline through the φ-incommensurate value-noise
+ * `naturalUnderlinePoints` morphology instead of pencil-boil's `wobbleLinePoints`
+ * (the masthead `boil` voice); the default underline keeps the pencil-boil line.
+ *
+ * BG.W-HANDMARK-PERFECT (a) THE ASPECT-CORRECT viewBox — `vbH` is the SFC-measured
+ * marking-space HEIGHT (`VB_W / boxAspect`) for the TEXT-MODE underline/strikethrough/
+ * highlight, so `preserveAspectRatio="none"` scales the wobble SHAPE uniformly (the x
+ * and y scales EQUAL → the humps stop being x-stretched flat). It defaults to `VB_H`,
+ * and is used ONLY for the measured text-mode y — the positioned/box/circle/bracket
+ * path keeps `VB_H` byte-for-byte (it DEPENDS on the none-stretch to fill the datum
+ * rect; the text-mode fix must not touch it).
+ *
+ * BG.W-HANDMARK-PERFECT (c) THE AMPLITUDE KNOB — `ampScale` multiplies the natural-
+ * underline excursion (default 1 ⇒ byte-identical; the SFC derives it from the brush
+ * `wobble` scalar, decoupling excursion from stroke `weight`).
+ */
+export declare function shapeGeom(shape: HandShape, opts: WobbleOptions, box?: MarkBox | null, baselineFrac?: number | null, natural?: boolean, vbH?: number, ampScale?: number): ShapeGeom;
+/** Boil one geometry: re-perturb the CACHED centerlines (anchored → no draw-on pop). */
+export declare function boilLines({ lines, closed }: ShapeGeom, amount: number, seed: number): [number, number][][];
+/** Serialize centerlines → one SVG `d` (multi-line shapes concat with a space). */
+export declare function serialize(lines: [number, number][][], jagged?: boolean): string;

package/dist/components/handmark/noise.d.ts

@@ -0,0 +1,30 @@
+/** smootherstep (6t⁵−15t⁴+10t³) — the C² fairing for the value-noise lerp. */
+export declare function smootherstep(t: number): number;
+/**
+ * The boil voice — φ-incommensurate fractal value-noise (the masthead morphology):
+ *
+ *   disp(t) = Σ_{k=0..OCT-1} aₖ · vnoiseₖ(t·fₖ + φₖ)   normalised by Σaₖ
+ *     fₖ = NOISE_F0 · φ^k   (φ mutually-irrational steps → the sum NEVER closes
+ *                            into a period — the non-periodicity mechanism)
+ *     aₖ = (1/φ)^k          (per-octave decay)
+ *     φₖ = seeded per-octave phase (house mulberry32)
+ *     vnoiseₖ = seeded lattice value-noise, smootherstep-faired
+ *
+ * The four atlas axes:
+ *   - amplitude SCALES with the rendered span (`(x2−x1) × NOISE_AMP_FRAC × ampScale`),
+ *     not a viewBox-stretched constant (a long word and a short word wobble in
+ *     proportion); `ampScale` is the BG.W-HANDMARK-PERFECT excursion knob (default 1
+ *     ⇒ byte-identical; the SFC derives it from the brush `wobble` scalar, decoupling
+ *     excursion from stroke `weight`);
+ *   - the hump-to-hump spacing is IRREGULAR (the φ-incommensurate octave sum — the
+ *     honest non-periodicity teeth, spacing-CV ~0.41 at the paint count vs the prior
+ *     sinusoid's ~0.14, over 400 seeds);
+ *   - the non-uniform body gives the pf hull a pressure-taper-friendly point stream;
+ *   - the seed is the HOUSE mulberry32.
+ *
+ * ENDPOINT anchor (NOT a body-wide envelope): a narrow cosine taper at the very ends
+ * only (`NOISE_EDGE`), so the ends settle to baseline (no draw-on pop) while the BODY
+ * amplitude stays irregular hump-to-hump. FILTER-FREE: the wander is in the control
+ * points + the hull width, never a feTurbulence.
+ */
+export declare function naturalUnderlinePoints(x1: number, y: number, x2: number, seed: number, segments: number, ampScale?: number): [number, number][];

package/dist/components/handmark/types.d.ts

@@ -0,0 +1,70 @@
+/**
+ * types.ts — the public API surface (SPEC §6). Pure types, 0 runtime.
+ * ─────────────────────────────────────────────────────────────────────────────
+ * The L5 surface steals rough-notation's *vocabulary* (annotate-style props +
+ * ordered groups), not its code. Every prop has a per-brush default, so the
+ * common call is one tag: <HandMark>who pays in</HandMark>.
+ */
+import type { Brush, BrushName } from "./brush";
+/** A target rect in the 0..100 × 0..40 marking space (positioned mode). */
+export interface MarkBox {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+export type HandShape = "underline" | "strikethrough" | "highlight" | "circle" | "box" | "bracket" | "path";
+export type HandAnimation = "none" | "draw-on" | "boil" | "draw-then-boil";
+export interface HandMarkProps {
+    /** 'pen'(default) | preset name | full/partial Brush object. */
+    brush?: BrushName | Partial<Brush>;
+    /** default 'underline'. */
+    shape?: HandShape;
+    /** ANY CSS color. default 'currentColor'. */
+    color?: string;
+    /** procedural variant — deterministic. default 1. */
+    seed?: number;
+    /** spread over the resolved brush (3rd resolution level). */
+    overrides?: Partial<Brush>;
+    /** default 'none' (the static-masthead default). */
+    animation?: HandAnimation;
+    /** draw-on duration. default 800. */
+    drawMs?: number;
+    /** draw-on start delay. default 0. */
+    drawDelayMs?: number;
+    /** draw-on trigger. default 'visible' (IntersectionObserver). */
+    appear?: "mount" | "visible" | "manual";
+    /** boil frame rate. default 8 (≈125ms). */
+    boilFps?: number;
+    /** distinct boil frames. default 3. */
+    boilFrames?: number;
+    /** override brush.roughness. */
+    roughness?: number;
+    /** wobble resolution. default per-brush. */
+    segments?: number;
+    /** angular kinks vs smooth bezier. default false. */
+    jagged?: boolean;
+    /**
+     * NATURAL-underline excursion knob (BG.W-HANDMARK-PERFECT (c)). Multiplies the
+     * scale-relative wobble amplitude (`span × NOISE_AMP_FRAC × amplitude`). Default is
+     * unset ⇒ the amplitude is derived from the brush `wobble` scalar (byte-identical at
+     * the shipped default); an explicit value WINS (e.g. `1.4` for a bolder hand line,
+     * font-proportional). Only the natural/boil underline reads it.
+     */
+    amplitude?: number;
+    /**
+     * NATURAL underline morphology (BA.W-HANDMARK C-2). When true (the masthead
+     * `boil` voice), the underline geometry goes PROCEDURAL — scale-relative
+     * amplitude, an IRREGULAR seeded period count, off the house prng leaf feeding
+     * pencil-boil — instead of pencil-boil's single `wobbleLinePoints` line. The
+     * `boil` brush auto-engages it; the default underline keeps the pencil-boil line.
+     * Ignored on non-underline shapes.
+     */
+    natural?: boolean;
+    /** POSITIONED mode (circle a datum): explicit target rect. */
+    box?: MarkBox;
+    /** shape:'path' escape hatch — arbitrary SVG `d` (wins over shape). */
+    path?: string;
+    /** arbitrary point stream → brush ink. */
+    points?: [number, number][];
+}

package/dist/components/header-ribbon/HeaderRibbon.vue.d.ts

@@ -0,0 +1,31 @@
+import type { HeaderRibbonProps } from "./types";
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {
+    pinned: boolean;
+    toggled: boolean;
+}, __VLS_7: {};
+type __VLS_Slots = {} & {
+    left?: (props: typeof __VLS_1) => any;
+} & {
+    items?: (props: typeof __VLS_3) => any;
+} & {
+    anchor?: (props: typeof __VLS_5) => any;
+} & {
+    items?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<HeaderRibbonProps, {
+    isPinned: import("vue").Ref<boolean, boolean>;
+    isExpanded: import("vue").Ref<boolean, boolean>;
+    isVisible: import("vue").ComputedRef<boolean>;
+    isToggled: import("vue").Ref<boolean, boolean>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<HeaderRibbonProps> & Readonly<{}>, {
+    placement: import("./types").HeaderRibbonPlacement;
+    hideTimeoutMs: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/header-ribbon/index.d.ts

@@ -0,0 +1,2 @@
+export { default as HeaderRibbon } from "./HeaderRibbon.vue";
+export type { HeaderRibbonPlacement, HeaderRibbonProps } from "./types";

package/dist/components/header-ribbon/types.d.ts

@@ -0,0 +1,7 @@
+export type HeaderRibbonPlacement = "left" | "right";
+export interface HeaderRibbonProps {
+    /** Side of the viewport the ribbon anchors against. Defaults to `"left"`. */
+    placement?: HeaderRibbonPlacement;
+    /** Milliseconds after the pointer leaves the ribbon before items collapse. Defaults to `2000`. */
+    hideTimeoutMs?: number;
+}

package/dist/components/index.d.ts

@@ -0,0 +1,36 @@
+export * from "./accordion";
+export * from "./alert";
+export * from "./avatar";
+export * from "./badge";
+export * from "./button";
+export * from "./card";
+export * from "./carousel";
+export * from "./checkbox";
+export * from "./collapsible";
+export * from "./combobox";
+export * from "./command";
+export * from "./data-table";
+export * from "./dialog";
+export * from "./drawer";
+export * from "./dropdown-menu";
+export * from "./focus-scope";
+export * from "./input";
+export * from "./label";
+export * from "./notification";
+export * from "./number-field";
+export * from "./popover";
+export * from "./progress";
+export * from "./radio-group";
+export * from "./section";
+export * from "./select";
+export * from "./separator";
+export * from "./skeleton";
+export * from "./slider";
+export * from "./switch";
+export * from "./table";
+export * from "./tags-input";
+export * from "./textarea";
+export * from "./toast";
+export * from "./toggle";
+export * from "./toggle-group";
+export * from "./tooltip";

package/dist/components/liquid-grid/LiquidGrid.vue.d.ts

@@ -0,0 +1,42 @@
+import type { LiquidGridConfig } from "./constants";
+/**
+ * LiquidGrid — a liquid AA-grid: evenly-spaced LARGER lines on a slowly breathing
+ * curl-flow sheet.
+ *
+ * A calm engineering-graph-liquid grid (evenly-spaced, LARGE cells, a crisp fine rule with
+ * a bolder major rule every 5 cells) drawn on a slowly breathing liquid sheet — adjacent
+ * lines bow and flow TOGETHER as if the grid is ruled on a gently rippling pond, never a
+ * per-line jitter. WebGPU-FIRST: a pure fullscreen fragment pass (the aurora/concentric
+ * shape-class) computes the grid at a curl-warped coordinate per pixel via the Ben Golus
+ * derivative-AA distance function (constant device-pixel-crisp lines, the CSS-blur kill),
+ * the Iñigo Quílez domain warp (the "liquid"), and the Bridson divergence-free curl flow
+ * (WHY it's liquid not noise). It composes `useLiquidGrid` → the `createGpuSubstrate` picker
+ * over the ONE canvas lifecycle leaf (offscreen-pause, live-PRM freeze, consumer-owned DPR)
+ * — it never bootstraps its own context.
+ *
+ * The DEFAULT line ink is the warm-cream `--foreground` library identity (resolved live at
+ * mount); the demo themes it through a PRESET (presets-in-consumers — never a library
+ * token). The grid suffuses over the page (transparent ground) — teal-on-navy is gone.
+ */
+type __VLS_Props = {
+    /** The full author schema (the studio's `useConfiguratorState` model). */
+    config?: LiquidGridConfig;
+    /**
+     * The declarative WCAG-2.2.2 pause seam. `v-model:paused` parks the render loop
+     * (the substrate's `manual` suspend) when `true`. Wire `<DockBackgroundToggle>`'s
+     * `@update:paused` to this `v-model`.
+     */
+    paused?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    pause: () => void;
+    resume: () => void;
+    wake: () => void;
+    renderAt: (timeSec: number) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:paused": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:paused"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/liquid-grid/composables/liquidGrid.d.ts

@@ -0,0 +1,113 @@
+/** A 2-vector. */
+export interface Vec2 {
+    x: number;
+    y: number;
+}
+/** The curl central-difference epsilon (matches `flow.glsl.ts` / `flow.wgsl.ts`). */
+export declare const CURL_EPS = 0.012;
+/**
+ * BG.W-GRID-AFFINE — the liquid-grid curl-sampling spatial frequency (in CELL units).
+ * `g0 = uv · gridScale` is CELL-scale (span ~14–40 cells), so the warp must sample the curl
+ * potential at a frequency an ORDER OF MAGNITUDE below the grid frequency for the warp to be
+ * locally affine at the cell scale — the sheet bows as ONE smooth curve (base wavelength 1/0.03 ≈
+ * 33 cells), never the sub-cell crackle a cell-scale `~1` frequency produced. Concentric's own
+ * `waveFlow` call passes the unit-scale `0.6` (its `p` is unit-scale). The shaders carry the same
+ * `0.03` literal (the round-trip fence). NOT a config tunable — the affine-frequency FLOOR.
+ */
+export declare const LIQUID_GRID_WARP_FREQ = 0.03;
+/** A 3-octave scalar fbm potential (the host noise basis the curl operator wraps). */
+export declare function potentialFBM(p: Vec2): number;
+/** The 2D curl of the scalar fbm potential (the JS twin of `curlFBM`). */
+export declare function curlFBM(p: Vec2): Vec2;
+/**
+ * The Ben Golus derivative-AA grid line coverage at `g` (grid space). `targetWidth` is the
+ * desired line half-width in GRID UNITS (the caller passes `lineWidthPx / minorPitchPx` so
+ * the line is N device-pixels wide); `uvDeriv` is the per-axis screen-space derivative of
+ * `g` (in the shaders `length(vec2(dFdx(g), dFdy(g)))`; in JS the caller passes it
+ * analytically so the path is reproducible). Returns line coverage [0..1].
+ *
+ * The Golus pipeline (transcribed by the WGSL/GLSL EXACTLY):
+ *   gridUV   = 1 − |fract(g)·2 − 1|                 (triangle wave: 0 at line, 1 at center)
+ *   drawW    = clamp(targetWidth, uvDeriv, 0.5)
+ *   lineAA   = uvDeriv·1.5
+ *   grid2    = smoothstep(drawW+lineAA, drawW−lineAA, gridUV)
+ *   grid2   *= clamp(targetWidth/drawW, 0, 1)        (preserve thin-line intensity)
+ *   grid2    = mix(grid2, targetWidth, clamp(uvDeriv·2−1, 0, 1))   (Moiré suppression)
+ *   line     = max(grid2.x, grid2.y)
+ */
+export declare function gridCoverage(g: Vec2, targetWidth: number, uvDeriv: Vec2): number;
+/**
+ * The complete liquid-grid sample at a domain `uv` (the round-trip anchor). Composes the
+ * warp + the bulge + the two-tier Golus coverage EXACTLY as the WGSL/GLSL `fs_main` does,
+ * returning the premultiplied-alpha (the page reads through the troughs). `uvDeriv` is the
+ * FIXED analytic per-axis derivative (JS has no fragment derivatives); the shaders compute
+ * it from `dpdx`/`dpdy`. Returns `{ line, alpha }` — the line coverage + the global alpha.
+ */
+export interface LiquidGridSampleParams {
+    /** The grid scale (view / minorPitch → LARGER cells = smaller scale). */
+    gridScale: number;
+    /** The traveling-wave front direction. */
+    waveDir: Vec2;
+    /** The crest-band spatial frequency. */
+    waveK: number;
+    /** The front speed (ω). */
+    waveOmega: number;
+    /** The crest-band width. */
+    waveSigma: number;
+    /** The affine sheet-warp displacement magnitude at the crest (grid units). */
+    twistMax: number;
+    /** The spring-eased envelope amplitude (0..1; PRM snaps to 0). */
+    amp: number;
+    /** The cursor in GRID space. */
+    cursor: Vec2;
+    /** The cursor-swirl peak twist (rad). */
+    bulgeStrength: number;
+    bulgeRadius: number;
+    /** +1 repel, −1 attract (signs the swirl). */
+    bulgeMode: number;
+    /** 1 = cursor swirl on. */
+    interactive: number;
+    /** Golus target half-widths in grid units (minor + major). */
+    targetWidth: number;
+    targetWidthMajor: number;
+    /** How many minor cells per major rule. */
+    majorEvery: number;
+    minorAlpha: number;
+    majorAlpha: number;
+    /** The GLOBAL subtlety knob (suffusion → tiny). */
+    fieldAlpha: number;
+    /** The FIXED per-axis derivative (the JS round-trip; shaders use dpdx/dpdy). */
+    uvDeriv: Vec2;
+    /** The filled-FACE opacity (0 → the face evaporates → byte-identical to HEAD). */
+    faceAlpha?: number;
+    /** The slope-shade ∇H Lambert gain. */
+    faceReliefGain?: number;
+    /** The volume-preserving squash (the inset retreats at the crest). */
+    squashK?: number;
+    /** The base inset-square coverage. */
+    baseInset?: number;
+    /** The fixed cel key-light direction. */
+    lightDir?: Vec2;
+}
+/** The face-shade scalars the FACE composite reads (the numeric-parity witness — FOLD B/C/D). */
+export interface LiquidGridFace {
+    /** The crest envelope at the pre-twist driver cc (FOLD A). */
+    env: number;
+    /** The sheet height at the driver cc (= env; the named leaf scalar). */
+    h: number;
+    /** The Lambert slope-shade [0,1] against the fixed key-light. */
+    shade: number;
+    /** The squashed inset-square face coverage [0,1]. */
+    faceCov: number;
+    /** The composited face alpha (FOLD D — face·faceAlpha·fieldAlpha, NO h-term). */
+    faceA: number;
+    /** The ramp parameter mix(shade, h) keying the multi-stop warm-divergent ink (FOLD B). */
+    rampT: number;
+}
+export declare function sampleLiquidGrid(uv: Vec2, t: number, p: LiquidGridSampleParams): {
+    line: number;
+    alpha: number;
+    face: LiquidGridFace;
+};
+/** The grid scale from the view + minor pitch (LARGER cells = smaller scale). */
+export declare function gridScaleFor(viewExtentPx: number, minorPitchPx: number): number;

package/dist/components/liquid-grid/composables/liquidGridGLSetup.d.ts

@@ -0,0 +1,18 @@
+import type { WebGLCanvasFrame } from "../../../composables/glass/webgl/useWebGLCanvas";
+import type { LiquidGridConfig } from "../constants";
+import { type Vec2 } from "./liquidGrid";
+export interface LiquidGridGLSetupDeps {
+    canvas: HTMLCanvasElement;
+    config: LiquidGridConfig;
+    getCursor: () => Vec2;
+    /** The spring-eased traveling-wave envelope amplitude (0..1; PRM → 0). */
+    getAmp: () => number;
+    shouldContinue: () => boolean;
+    /**
+     * The per-frame pointer hook — useLiquidGrid advances the shared pointer field + derives
+     * the transient cursor here (the no-own-rAF discipline). ZERO own rAF.
+     */
+    onFrame?: (timeSec: number) => void;
+}
+/** Build the `setupGL(gl)` callback the `createGpuSubstrate` WebGL2 path invokes. */
+export declare function createLiquidGridGLSetup(deps: LiquidGridGLSetupDeps): (gl: WebGL2RenderingContext) => WebGLCanvasFrame;

package/dist/components/liquid-grid/composables/liquidGridWGPUSetup.d.ts

@@ -0,0 +1,21 @@
+import type { WebGPUCanvasFrame } from "../../../composables/glass/webgpu/useWebGPUCanvas";
+import type { LiquidGridConfig } from "../constants";
+import type { Vec2 } from "./liquidGrid";
+export interface LiquidGridWGPUSetupDeps {
+    canvas: HTMLCanvasElement;
+    config: LiquidGridConfig;
+    /** The transient pointer cursor in GRID space — re-read each frame (the cursor swirl). */
+    getCursor: () => Vec2;
+    /** The spring-eased traveling-wave envelope amplitude (0..1; PRM → 0). */
+    getAmp: () => number;
+    /** Demand-gate (the renderer's quiescence layer — substrate-agnostic). */
+    shouldContinue: () => boolean;
+    /**
+     * The per-frame pointer hook — useLiquidGrid advances the shared `usePointerVelocityField`
+     * here (the no-own-rAF discipline: the renderer's frame loop FEEDS `tick(delta)`) and
+     * derives the transient cursor. ZERO own rAF.
+     */
+    onFrame?: (timeSec: number) => void;
+}
+/** Build the liquid-grid `setupWGPU(device, context, format)` callback. */
+export declare function createLiquidGridWGPUSetup(deps: LiquidGridWGPUSetupDeps): (device: GPUDevice, context: GPUCanvasContext, format: GPUTextureFormat) => WebGPUCanvasFrame;

package/dist/components/liquid-grid/composables/uniformBridgeWGPU.d.ts

@@ -0,0 +1,16 @@
+import type { LiquidGridConfig } from "../constants";
+import type { Vec2 } from "./liquidGrid";
+export declare const LIQUID_GRID_UNIFORM_BYTES = 224;
+export interface LiquidGridUniformScratch {
+    buffer: ArrayBuffer;
+    f32: Float32Array;
+}
+export declare function createLiquidGridScratch(): LiquidGridUniformScratch;
+/**
+ * Pack the liquid-grid uniforms in place. `viewExtentPx` is the canvas backing-store extent
+ * the grid scale derives from (so the cell pitch is honest in device px); `cursor` is the
+ * transient pointer in GRID space (the renderer derives it from `usePointerVelocityField`);
+ * `aspect` corrects the domain x. The line ink resolves the warm `--foreground` identity
+ * (the demo themes it via a preset, never a token edit).
+ */
+export declare function packLiquidGridUniforms(scratch: LiquidGridUniformScratch, config: LiquidGridConfig, timeSec: number, aspect: number, viewExtentPx: number, cursor: Vec2, amp: number): LiquidGridUniformScratch;

package/dist/components/liquid-grid/composables/useLiquidGrid.d.ts

@@ -0,0 +1,31 @@
+import { type Ref } from "vue";
+import { type GpuBackend } from "../../../composables/glass/webgpu/useGpuSubstrate";
+import type { LiquidGridConfig } from "../constants";
+export interface UseLiquidGridOptions {
+    config: LiquidGridConfig;
+    /** `"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 LiquidGridHandle {
+    /** 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 (a pointer that re-introduced motion). */
+    wake: () => void;
+    /** Draw one frame out-of-loop (capture / thumbnail). */
+    renderAt: (timeSec: number) => void;
+    /** The live `prefers-reduced-motion: reduce` state. */
+    readonly reducedMotion: boolean;
+    /** Tear down the renderer + release GPU/GL resources. */
+    dispose: () => void;
+}
+/**
+ * Mount the liquid-grid renderer on `canvasRef`. The WebGPU primary + the WebGL2 fallback are
+ * BOTH pure fullscreen fragment passes evaluating the SAME liquid grid (the ONE math source
+ * `liquidGrid.ts`), so the picker is the only seam. Returns the uniform lifecycle handle.
+ */
+export declare function useLiquidGrid(canvasRef: Ref<HTMLCanvasElement | null>, options: UseLiquidGridOptions): LiquidGridHandle;