@satinhq/kit 0.0.0-stage → 0.1.0-beta.1

package/dist/glass/lens/menuMotion.js

@@ -0,0 +1,323 @@
+import { evaluateTemporalSpline } from './liquidMotion.js';
+import closeFit from './menu-closing-close-fit.json';
+import nativeFits from './menu-opening-native-fits.json';
+export const MENU_ENVELOPE = Object.freeze({
+    // Screen-space target x=143...393, y=126...316 plus 20 pt for the
+    // measured opening overshoot and shadow. Runtime subtracts the physical
+    // top inset from frameY, as it does for the 7l reference envelopes.
+    frameHeight: 230,
+    frameWidth: 290,
+    frameX: 123,
+    frameY: 106,
+});
+export const MENU_BUTTON = Object.freeze({
+    centerX: nativeFits.button.centerX,
+    centerY: nativeFits.button.centerY,
+    diameter: nativeFits.button.diameter,
+});
+export const MENU_PANEL = Object.freeze({
+    centerX: 268,
+    // measured-reference exact framebuffer contour fit (provenance/menu-contour-fit.json).
+    centerY: 221,
+    cornerRadius: 43.15835260047611,
+    height: 188,
+    width: 250,
+});
+export const MENU_MOTION_DURATIONS = Object.freeze({
+    close: closeFit.geometry.width.durationSeconds,
+    open: nativeFits.open.geometry.width.durationSeconds,
+});
+export const MENU_CADENCE = Object.freeze({
+    // Fresh 7o2 footage shows a return after the threshold track disappears.
+    // Continue to the actual button instead of holding a 60 x 74 silhouette.
+    closeSettleSeconds: 0,
+    closedHoldSeconds: 0.24,
+    // Native reference closes by the mandated outside HID tap 1.5 s after open.
+    openHoldSeconds: 1.5,
+});
+function clamp(value, low, high) {
+    return Math.max(low, Math.min(high, value));
+}
+function smoothstep(progress) {
+    const clamped = clamp(progress, 0, 1);
+    return clamped * clamped * (3 - 2 * clamped);
+}
+/* How far a menu's material has gone from the button's glass (0) to the menu's frosted
+ * material (1), `seconds` after the morph's geometry onset. Native, light, toolbar Menu: a
+ * neutral-grey plate's intensity under the glass (menu-opening-native-fits.json `material`). It
+ * reaches the menu material 174 ms into an open and leaves it within 162 ms of a close, well
+ * before the outline settles. Linear between the measured samples. */
+export function menuMaterialProgress(direction, seconds) {
+    const samples = nativeFits.material[direction];
+    if (seconds <= samples[0][0])
+        return samples[0][1];
+    const right = samples.findIndex(([at]) => at >= seconds);
+    if (right < 0)
+        return samples.at(-1)[1];
+    const [startSeconds, startValue] = samples[right - 1];
+    const [endSeconds, endValue] = samples[right];
+    return (startValue + ((endValue - startValue) * (seconds - startSeconds)) / (endSeconds - startSeconds));
+}
+function fittedOpenProgress(direction, seconds) {
+    const spline = nativeFits[direction].geometry.width;
+    const measuredStart = spline.knots[0].value;
+    const measuredEnd = spline.knots.at(-1).value;
+    const progress = (evaluateTemporalSpline(spline, seconds) - measuredStart) / (measuredEnd - measuredStart);
+    return direction === 'open' ? progress : 1 - progress;
+}
+function localX(screenX) {
+    return screenX - MENU_ENVELOPE.frameX;
+}
+function localY(screenY) {
+    return screenY - MENU_ENVELOPE.frameY;
+}
+function rimAlpha(appearance) {
+    // Converted from the native row-127 lift after measuring the 1x filter
+    // target's subpixel coverage: 26 -> 49 RGB levels in light and 26 -> 33 in
+    // dark. Values above one are safe here because the final framebuffer clips
+    // the subpixel highlight while its row average remains below white.
+    return appearance === 'light' ? 1.39 : 0.2;
+}
+export function sampleMenuMotion(direction, seconds, appearance, reducedMotion) {
+    if (direction === 'close' && !reducedMotion)
+        return sampleMenuClose(seconds, appearance);
+    const duration = MENU_MOTION_DURATIONS[direction];
+    const localSeconds = reducedMotion ? duration : clamp(seconds, 0, duration);
+    const openEndpoint = direction === 'open';
+    const exactEndpoint = reducedMotion || localSeconds >= duration;
+    const tail = direction === 'close'
+        ? smoothstep((localSeconds - nativeFits.close.geometry.width.durationSeconds) / (2 / 60))
+        : 0;
+    const openProgress = reducedMotion
+        ? openEndpoint
+            ? 1
+            : 0
+        : clamp(fittedOpenProgress(direction, localSeconds), -0.08, 1.08);
+    const fittedWidth = evaluateTemporalSpline(nativeFits[direction].geometry.width, localSeconds);
+    const centerX = exactEndpoint
+        ? openEndpoint
+            ? MENU_PANEL.centerX
+            : MENU_BUTTON.centerX
+        : evaluateTemporalSpline(nativeFits[direction].geometry.centerX, localSeconds);
+    const centerY = exactEndpoint
+        ? openEndpoint
+            ? MENU_PANEL.centerY
+            : MENU_BUTTON.centerY
+        : evaluateTemporalSpline(nativeFits[direction].geometry.centerY, localSeconds);
+    const width = exactEndpoint
+        ? openEndpoint
+            ? MENU_PANEL.width
+            : MENU_BUTTON.diameter
+        : fittedWidth;
+    const height = exactEndpoint
+        ? openEndpoint
+            ? MENU_PANEL.height
+            : MENU_BUTTON.diameter
+        : evaluateTemporalSpline(nativeFits[direction].geometry.height, localSeconds);
+    const clampedOpen = clamp(openProgress, 0, 1);
+    const itemFit = nativeFits.open.items[0];
+    const itemTime = localSeconds;
+    const itemProgress = reducedMotion
+        ? clampedOpen
+        : direction === 'open'
+            ? clamp((itemTime - itemFit.onsetSeconds) / itemFit.durationSeconds, 0, 1)
+            : 1 - clamp(localSeconds / 0.14, 0, 1);
+    const easedItems = itemProgress * itemProgress * (3 - 2 * itemProgress);
+    const halfWidth = Math.max(MENU_BUTTON.diameter / 2, width / 2);
+    const halfHeight = Math.max(MENU_BUTTON.diameter / 2, height / 2);
+    const fittedRadius = evaluateTemporalSpline(nativeFits[direction].geometry.cornerRadius, localSeconds);
+    const endpointRadius = direction === 'open' ? MENU_PANEL.cornerRadius : MENU_BUTTON.diameter / 2;
+    const radius = Math.min(halfWidth, halfHeight, exactEndpoint
+        ? endpointRadius
+        : direction === 'close'
+            ? fittedRadius
+            : fittedRadius +
+                (MENU_PANEL.cornerRadius - fittedRadius) *
+                    smoothstep((localSeconds - 0.28) / (duration - 0.28)));
+    const panel = {
+        centerX: localX(centerX + (MENU_BUTTON.centerX - centerX) * tail),
+        centerY: localY(centerY + (MENU_BUTTON.centerY - centerY) * tail),
+        halfHeight: halfHeight + (MENU_BUTTON.diameter / 2 - halfHeight) * tail,
+        halfWidth: halfWidth + (MENU_BUTTON.diameter / 2 - halfWidth) * tail,
+        radius: radius + (MENU_BUTTON.diameter / 2 - radius) * tail,
+    };
+    // Neutral-plate samples measure tint progression independently of width.
+    // Width-weighting the material erased the frost twice during dismissal.
+    const plateMix = menuMaterialProgress(direction, localSeconds);
+    const materialMix = reducedMotion ? 1 : Math.max(tail, plateMix);
+    const menuTintMix = exactEndpoint ? (openEndpoint ? 1 : 0) : 1 - tail;
+    return {
+        materialMix,
+        menuTintMix,
+        itemBlur: reducedMotion
+            ? 0
+            : direction === 'open'
+                ? 4 * (1 - smoothstep((localSeconds - 0.1) / 0.07))
+                : 4 * smoothstep(localSeconds / 0.08),
+        itemOffsetX: itemFit.offsetXPt * (1 - easedItems),
+        itemOpacity: easedItems,
+        openProgress,
+        shape: {
+            // Fresh uncapped contours show one expanding lens. A permanently
+            // unioned trigger added a visible shoulder absent from the reference.
+            blendRadius: 0,
+            first: panel,
+            second: panel,
+            rimAlpha: rimAlpha(appearance),
+            rimBandCssPx: 1.5,
+            whiteMix: 0,
+        },
+        triggerOpacity: 1 - clamp(openProgress / 0.72, 0, 1),
+    };
+}
+// Close has a spatial handoff: the glyph and regular material return inside
+// the clear remnant. They do not wait for the remnant to become a circle.
+function sampleMenuClose(seconds, appearance) {
+    const t = clamp(seconds, 0, MENU_MOTION_DURATIONS.close);
+    if (t >= MENU_MOTION_DURATIONS.close)
+        return sampleMenuMotion('close', 0, appearance, true);
+    const fit = closeFit.geometry;
+    const panel = {
+        centerX: localX(evaluateTemporalSpline(fit.centerX, t)),
+        centerY: localY(evaluateTemporalSpline(fit.centerY, t)),
+        halfWidth: evaluateTemporalSpline(fit.width, t) / 2,
+        halfHeight: evaluateTemporalSpline(fit.height, t) / 2,
+        radius: evaluateTemporalSpline(fit.cornerRadius, t),
+    };
+    // Glyph centres from the fresh flat close: y142 at 200 ms, y147 at
+    // 283 ms, returning to y156. No new spring constants are introduced.
+    const recovery = smoothstep((t - 0.1) / 0.1);
+    const settle = smoothstep((t - 0.2) / 0.2);
+    const emerge = smoothstep((t - 0.05) / 0.13);
+    const trigger = {
+        centerX: panel.centerX + (localX(354 + 6 * recovery + 4 * settle) - panel.centerX) * emerge,
+        centerY: panel.centerY + (localY(156 - 14 * recovery + 14 * settle) - panel.centerY) * emerge,
+        radius: 16 + 10 * recovery + 3 * settle,
+        mix: recovery,
+    };
+    const joined = smoothstep((t - 0.18333333333333332) / (0.25 - 0.18333333333333332));
+    // Once the residual has joined, both shapes follow the same return. This
+    // also makes the final frame identical to the unchanged resting preset.
+    const join = (a, b) => a + (b - a) * joined;
+    const returningPanel = {
+        centerX: join(panel.centerX, trigger.centerX),
+        centerY: join(panel.centerY, trigger.centerY),
+        halfWidth: join(panel.halfWidth, trigger.radius),
+        halfHeight: join(panel.halfHeight, trigger.radius),
+        radius: join(panel.radius, trigger.radius),
+    };
+    const plate = 1 - smoothstep(t / 0.21);
+    const regular = smoothstep((t - 0.2) / 0.2);
+    return {
+        materialMix: plate + (1 - plate) * regular,
+        menuTintMix: 1 - regular,
+        itemBlur: 4 * smoothstep(t / 0.1),
+        itemOffsetX: 6 * smoothstep(t / 0.15),
+        itemOpacity: 1 - smoothstep(t / 0.15),
+        openProgress: (returningPanel.halfWidth * 2 - MENU_BUTTON.diameter) /
+            (MENU_PANEL.width - MENU_BUTTON.diameter),
+        triggerOpacity: smoothstep((t - 0.13) / 0.075),
+        returningTrigger: trigger,
+        shape: {
+            blendRadius: 28 * recovery * (1 - joined),
+            first: returningPanel,
+            second: {
+                centerX: trigger.centerX,
+                centerY: trigger.centerY,
+                halfWidth: trigger.radius,
+                halfHeight: trigger.radius,
+                radius: trigger.radius,
+            },
+            rimAlpha: rimAlpha(appearance),
+            rimBandCssPx: 1.5,
+            whiteMix: 0,
+        },
+    };
+}
+export function menuCadenceDuration() {
+    return (MENU_MOTION_DURATIONS.open +
+        MENU_CADENCE.openHoldSeconds +
+        MENU_MOTION_DURATIONS.close +
+        MENU_CADENCE.closeSettleSeconds +
+        MENU_CADENCE.closedHoldSeconds);
+}
+export function sampleMenuCadence(seconds, appearance, reducedMotion) {
+    if (seconds < MENU_MOTION_DURATIONS.open) {
+        return {
+            direction: 'open',
+            frame: sampleMenuMotion('open', seconds, appearance, reducedMotion),
+        };
+    }
+    const closeAt = MENU_MOTION_DURATIONS.open + MENU_CADENCE.openHoldSeconds;
+    if (seconds < closeAt) {
+        return {
+            direction: 'open',
+            frame: sampleMenuMotion('open', MENU_MOTION_DURATIONS.open, appearance, reducedMotion),
+        };
+    }
+    const closeFitAt = closeAt + MENU_MOTION_DURATIONS.close;
+    if (seconds < closeFitAt + MENU_CADENCE.closeSettleSeconds) {
+        return {
+            direction: 'close',
+            frame: sampleMenuMotion('close', seconds - closeAt, appearance, reducedMotion),
+        };
+    }
+    return { direction: 'close', frame: sampleMenuMotion('close', 0, appearance, true) };
+}
+/** Restart an interrupted transition near the current geometry, not at its
+ * opposite endpoint. This is an interruption policy, not a native timing fit. */
+export function menuRetargetTime(frame, direction, appearance) {
+    const from = frame.shape.first;
+    let best = 0, error = Infinity;
+    for (let i = 0; i <= 120; i++) {
+        const seconds = (MENU_MOTION_DURATIONS[direction] * i) / 120;
+        const sample = sampleMenuMotion(direction, seconds, appearance, false).shape.first;
+        const distance = (sample.centerX - from.centerX) ** 2 +
+            (sample.centerY - from.centerY) ** 2 +
+            (sample.halfWidth - from.halfWidth) ** 2 +
+            (sample.halfHeight - from.halfHeight) ** 2;
+        if (distance < error) {
+            error = distance;
+            best = seconds;
+        }
+    }
+    return Math.min(best, MENU_MOTION_DURATIONS[direction] - 1 / 60);
+}
+export function blendMenuFrames(from, to, progress) {
+    if (progress <= 0)
+        return from;
+    if (progress >= 1)
+        return to;
+    const t = smoothstep(progress);
+    const mix = (a, b) => a + (b - a) * t;
+    const capsule = (a, b) => ({
+        centerX: mix(a.centerX, b.centerX),
+        centerY: mix(a.centerY, b.centerY),
+        halfWidth: mix(a.halfWidth, b.halfWidth),
+        halfHeight: mix(a.halfHeight, b.halfHeight),
+        radius: mix(a.radius, b.radius),
+    });
+    return {
+        materialMix: mix(from.materialMix, to.materialMix),
+        menuTintMix: mix(from.menuTintMix, to.menuTintMix),
+        itemBlur: mix(from.itemBlur, to.itemBlur),
+        itemOffsetX: mix(from.itemOffsetX, to.itemOffsetX),
+        itemOpacity: mix(from.itemOpacity, to.itemOpacity),
+        openProgress: mix(from.openProgress, to.openProgress),
+        triggerOpacity: mix(from.triggerOpacity, to.triggerOpacity),
+        returningTrigger: from.returningTrigger || to.returningTrigger
+            ? {
+                centerX: mix(from.returningTrigger?.centerX ?? localX(MENU_BUTTON.centerX), to.returningTrigger?.centerX ?? localX(MENU_BUTTON.centerX)),
+                centerY: mix(from.returningTrigger?.centerY ?? localY(MENU_BUTTON.centerY), to.returningTrigger?.centerY ?? localY(MENU_BUTTON.centerY)),
+                radius: mix(from.returningTrigger?.radius ?? MENU_BUTTON.diameter / 2, to.returningTrigger?.radius ?? MENU_BUTTON.diameter / 2),
+                mix: mix(from.returningTrigger?.mix ?? 0, to.returningTrigger?.mix ?? 0),
+            }
+            : undefined,
+        shape: {
+            ...to.shape,
+            blendRadius: mix(from.shape.blendRadius, to.shape.blendRadius),
+            first: capsule(from.shape.first, to.shape.first),
+            second: capsule(from.shape.second ?? from.shape.first, to.shape.second ?? to.shape.first),
+        },
+    };
+}

package/dist/glass/lens/menuPlacement.d.ts

@@ -0,0 +1,5 @@
+import { type MenuMotionFrame } from './menuMotion.js';
+/** Toolbar endpoint projection of the retained 7o motion. Fit samples and time
+ * remain unchanged; the measured toolbar capsule replaces only the closed end.
+ * Idempotence lets the hybrid and ordinary presenter share the same boundary. */
+export declare function projectToolbarMenu(frame: MenuMotionFrame, toolbar?: boolean): MenuMotionFrame;

package/dist/glass/lens/menuPlacement.js

@@ -0,0 +1,29 @@
+import { settingsChromeTokens } from '../../settings/tokens.js';
+import { MENU_BUTTON } from './menuMotion.js';
+/** Toolbar endpoint projection of the retained 7o motion. Fit samples and time
+ * remain unchanged; the measured toolbar capsule replaces only the closed end.
+ * Idempotence lets the hybrid and ordinary presenter share the same boundary. */
+export function projectToolbarMenu(frame, toolbar = false) {
+    if (!toolbar || frame.toolbarProjected)
+        return frame;
+    const closed = 1 - Math.max(0, Math.min(1, frame.openProgress));
+    const dw = (settingsChromeTokens.menuToolbarWidthPx - MENU_BUTTON.diameter) / 2;
+    const dh = (settingsChromeTokens.menuToolbarHeightPx - MENU_BUTTON.diameter) / 2;
+    const part = (shape) => ({
+        ...shape,
+        centerY: shape.centerY + settingsChromeTokens.menuToolbarPanelOffsetYPx * (1 - closed),
+        halfWidth: shape.halfWidth + dw * closed,
+        halfHeight: shape.halfHeight + dh * closed,
+        radius: Math.min(shape.radius, shape.halfHeight + dh * closed),
+    });
+    return {
+        ...frame,
+        toolbarProjected: true,
+        itemOffsetY: settingsChromeTokens.menuToolbarPanelOffsetYPx,
+        shape: {
+            ...frame.shape,
+            first: part(frame.shape.first),
+            second: frame.shape.second ? part(frame.shape.second) : undefined,
+        },
+    };
+}

package/dist/glass/lens/menuSpring.d.ts

@@ -0,0 +1,18 @@
+/** A damped spring released `delay` ms after its start, from displacement 1 toward 0, with
+ * initial `velocity` (units per second; negative moves toward 0), natural frequency `omega`
+ * (rad/s) and damping ratio `zeta`. The phone menu morph runs on these, one per axis
+ * (menuMorphPhoneFit.json): continuous position and velocity, overshoot only as the settle. */
+export type MenuSpring = Readonly<{
+    delay: number;
+    omega: number;
+    zeta: number;
+    velocity: number;
+}>;
+/** Displacement from the target and its velocity (per second) at `ms`. */
+export declare function menuSpring(spring: MenuSpring, ms: number): {
+    value: number;
+    velocity: number;
+};
+/** When the spring last leaves `tolerance` of its target (ms after start): 0.0015 of the travel
+ * is about 0.3 pt for a 200 pt morph, below what a final snap to rest can show. */
+export declare function menuSpringSettle(spring: MenuSpring, tolerance?: number): number;

package/dist/glass/lens/menuSpring.js

@@ -0,0 +1,29 @@
+/** Displacement from the target and its velocity (per second) at `ms`. */
+export function menuSpring(spring, ms) {
+    const { delay, omega, zeta, velocity } = spring;
+    const t = Math.max(0, ms - delay) / 1000;
+    if (zeta < 1) {
+        const damped = omega * Math.sqrt(1 - zeta * zeta);
+        const sine = (velocity + zeta * omega) / damped;
+        const decay = Math.exp(-zeta * omega * t), cos = Math.cos(damped * t), sin = Math.sin(damped * t);
+        const value = decay * (cos + sine * sin);
+        return {
+            value,
+            velocity: ms < delay ? 0 : -zeta * omega * value + decay * damped * (sine * cos - sin),
+        };
+    }
+    const decay = Math.exp(-omega * t), slope = velocity + omega;
+    return {
+        value: decay * (1 + slope * t),
+        velocity: ms < delay ? 0 : decay * (slope - omega * (1 + slope * t)),
+    };
+}
+/** When the spring last leaves `tolerance` of its target (ms after start): 0.0015 of the travel
+ * is about 0.3 pt for a 200 pt morph, below what a final snap to rest can show. */
+export function menuSpringSettle(spring, tolerance = 0.0015) {
+    let settled = spring.delay;
+    for (let ms = spring.delay; ms <= spring.delay + 3000; ms += 2)
+        if (Math.abs(menuSpring(spring, ms).value) > tolerance)
+            settled = ms + 2;
+    return settled;
+}

package/dist/glass/lens/menuTouchLight.d.ts

@@ -0,0 +1,13 @@
+import type { GlassTouchLight } from '../renderSpecs.js';
+import type { GlassInteraction } from '../rendererContract.js';
+/** Input clock and field are independent of row selection and menu geometry. */
+export declare class MenuTouchLight {
+    private epoch;
+    private downAt?;
+    private upAt?;
+    private contact?;
+    private dirty;
+    input(input: GlassInteraction): void;
+    needsFrame(at: number): boolean;
+    sample(appearance: 'light' | 'dark', at: number): GlassTouchLight | undefined;
+}

package/dist/glass/lens/menuTouchLight.js

@@ -0,0 +1,147 @@
+import { sampleHighlightCurve } from './interactivePress.js';
+// Stock iOS 27 Menu over landscape.png, menu-light/native-fit.json, 2026-10-04.
+// Source times are aligned to the 700 ms scheduled contact; onset uncertainty is one frame.
+const RISE = {
+    light: [
+        [0, 220, 0],
+        [18, 222, 0.0802],
+        [35, 226, 0.1307],
+        [53, 228, 0.1529],
+        [70, 230, 0.1677],
+        [105, 232, 0.171],
+        [137, 230, 0.1754],
+    ],
+    dark: [
+        [0, 220, 0],
+        [15, 222, 0.1135],
+        [33, 224, 0.1498],
+        [48, 224, 0.1686],
+        [65, 224, 0.1755],
+        [100, 224, 0.1756],
+        [145, 224, 0.1822],
+    ],
+};
+// Stationary disabled-row release, iOS 27, menu-light2/release-fit.json, 2026-10-05.
+// Relative radius and white mix; the late, near-uniform field has a weakly identified radius.
+// Contact alignment is bracketed by the last resting and first changed source frames.
+const RELEASE = {
+    light: [
+        [0, 1, 1],
+        [10, 1.0261, 0.9974],
+        [27, 1.0957, 0.9777],
+        [43, 1.2174, 0.9321],
+        [60, 1.4435, 0.8693],
+        [80, 1.6174, 0.8115],
+        [95, 1.8261, 0.747],
+        [112, 1.8609, 0.7213],
+        [127, 2.3304, 0.6026],
+        [143, 2.6087, 0.5415],
+        [162, 2.4696, 0.4665],
+        [178, 3.3913, 0.4015],
+        [197, 3.8435, 0.3721],
+        [210, 2.3478, 0.3359],
+        [230, 4.3478, 0.2641],
+        [245, 4.0174, 0.2522],
+        [262, 1.8609, 0.2312],
+        [278, 2.0696, 0.1692],
+        [295, 4.3478, 0.1311],
+        [312, 3.9304, 0.1332],
+        [328, 4.3478, 0.1265],
+        [347, 4.2087, 0.1243],
+        [362, 1.1304, 0.0827],
+        [378, 0.9043, 0.0211],
+        [398, 0.9043, 0],
+    ],
+    dark: [
+        [0, 1, 1],
+        [5, 1.0, 0.999],
+        [17, 1.0, 0.9995],
+        [33, 1.1607, 0.9349],
+        [50, 1.1786, 0.9288],
+        [68, 1.5536, 0.8067],
+        [83, 1.8036, 0.7276],
+        [100, 1.7857, 0.7265],
+        [117, 2.1786, 0.5992],
+        [135, 2.4643, 0.5105],
+        [155, 2.4821, 0.4601],
+        [167, 2.5714, 0.4004],
+        [185, 2.6429, 0.3488],
+        [205, 3.5893, 0.2823],
+        [217, 3.6429, 0.251],
+        [235, 3.3929, 0.2189],
+        [252, 2.25, 0.2005],
+        [268, 2.8036, 0.1629],
+        [288, 2.9464, 0.1346],
+        [302, 2.7857, 0.1233],
+        [318, 3.0536, 0.0835],
+        [335, 3.3393, 0.0815],
+        [352, 1.3929, 0.0724],
+        [368, 3.4821, 0.0418],
+        [388, 3.5179, 0.0416],
+        [402, 3.8214, 0.0414],
+        [418, 4.4643, 0.0398],
+        [437, 4.4643, 0.0394],
+        [453, 0.875, 0.0226],
+        [472, 0.875, 0],
+    ],
+};
+const RELEASE_DURATION = Math.max(RELEASE.light.at(-1)[0], RELEASE.dark.at(-1)[0]);
+/** Input clock and field are independent of row selection and menu geometry. */
+export class MenuTouchLight {
+    epoch = -Infinity;
+    downAt;
+    upAt;
+    contact;
+    dirty = false;
+    input(input) {
+        if (!Number.isFinite(input.epoch))
+            throw Error('Invalid glass light epoch');
+        if (input.epoch < this.epoch)
+            return;
+        if (input.contact && ![input.contact.x, input.contact.y].every(Number.isFinite))
+            throw Error('Invalid glass light contact');
+        this.epoch = input.epoch;
+        if (input.phase === 'rest') {
+            this.downAt = undefined;
+            this.contact = undefined;
+        }
+        else if (input.phase === 'pressed') {
+            if (!input.contact)
+                return;
+            this.downAt = input.epoch;
+            this.upAt = undefined;
+            this.contact = input.contact;
+        }
+        else if (this.downAt !== undefined) {
+            if (input.contact)
+                this.contact = input.contact;
+            if (input.phase === 'releasing')
+                this.upAt = input.epoch;
+        }
+        this.dirty = true;
+    }
+    needsFrame(at) {
+        return (this.dirty ||
+            (this.downAt !== undefined &&
+                (this.upAt === undefined ? at < this.downAt + 160 : at < this.upAt + RELEASE_DURATION + 20)));
+    }
+    sample(appearance, at) {
+        this.dirty = false;
+        if (!this.contact || this.downAt === undefined)
+            return undefined;
+        const elapsed = Math.max(0, Math.min(this.upAt ?? at, at) - this.downAt);
+        const points = RISE[appearance];
+        let radius = sampleHighlightCurve(points, elapsed);
+        let intensity = sampleHighlightCurve(points, elapsed, 2);
+        if (this.upAt !== undefined && at > this.upAt) {
+            const age = at - this.upAt;
+            radius *= sampleHighlightCurve(RELEASE[appearance], age);
+            intensity *= sampleHighlightCurve(RELEASE[appearance], age, 2);
+        }
+        if (intensity <= 0 && this.upAt !== undefined) {
+            this.downAt = undefined;
+            return undefined;
+        }
+        return { ...this.contact, radius, intensity, colour: [1, 1, 1] };
+    }
+}

package/dist/glass/lens/mirrorConstants.d.ts

@@ -0,0 +1 @@
+export declare const MARKER_INTERVAL_PX = 64;

package/dist/glass/lens/mirrorConstants.js

@@ -0,0 +1,2 @@
+// Shared by DOM capture and the DOM-free renderer.
+export const MARKER_INTERVAL_PX = 64;

package/dist/glass/lens/mirrorExtents.d.ts

@@ -0,0 +1,52 @@
+/** Bounded mirror scans.
+ *
+ * A windowed capture (a long list) keeps only elements whose own box reaches its window, but a
+ * whole-tree scan still read one rectangle per element: on a 1,200-message thread (~22,000
+ * elements) that read was half of the main thread while a reply streamed. A subtree can be skipped
+ * when no element in it reaches the window. Whether that holds is known from the last scan: each
+ * element records how far its subtree's boxes reach beyond its own box ("extent", relative to the
+ * element, so it survives the element moving). A later scan reads the element's box once and
+ * skips the subtree when box plus extent misses the window.
+ *
+ * Skipping is a superset filter: every visited element is still judged by its own box exactly as
+ * before, so a bounded scan returns the same nodes as a whole-tree scan whenever the recorded
+ * extents are current. They are dropped when they may not be:
+ * - a DOM change inside the subtree (children, text, attributes) drops the extents of its target
+ *   and every ancestor;
+ * - an attribute change can restyle descendants (selectors, inheritance), so it also drops every
+ *   extent recorded inside its target before the change (a generation stamp);
+ * - a nested scroller's scroll, an image load, and a running animation or transition do the same
+ *   for their element;
+ * - an element whose own size changed, or a host whose width changed, is measured again.
+ *
+ * Layout that moves without any of these (`position: fixed` content inside a scroller, `:hover`
+ * styles) is not tracked; MIRROR_EXTENT_SLACK keeps small movements in the window. The audit hook
+ * (`globalThis.__SATIN_MIRROR_AUDIT__`) compares every bounded scan with a whole-tree scan. */
+/** Extra reach (points) a recorded extent is given before its subtree is skipped. */
+export declare const MIRROR_EXTENT_SLACK = 32;
+/** Attribute records of a batch whose attribute ends the batch with the value it had before it: a
+ * value written again, or React's radio-group detach on every controlled input update (`name` set
+ * to '' and back). */
+export declare function rewrittenAttributes(records: readonly MutationRecord[]): Set<MutationRecord>;
+export declare const isUnstyledFlag: (record: Pick<MutationRecord, 'type' | 'attributeName'>) => boolean;
+/** Bounded scans need DOM change records (a browser document). */
+export declare const canTrackMirrorExtents: () => boolean;
+/** A counter of every change `host`'s mirror could show since the last call: DOM changes in its
+ * subtree (unstyled framework flags aside), a nested scroll, an image load, source damage, a running
+ * animation or transition inside it, a new host width. Equal counters mean no such change; a
+ * reading taken while something inside animates can be outdated as soon as it ends. */
+export declare function mirrorRevision(host: HTMLElement): {
+    revision: number;
+    animating: boolean;
+    lastChange: string;
+};
+/** Forget every recorded extent of `host` (text size or appearance changed). */
+export declare function dropMirrorExtents(host: HTMLElement): void;
+/** Visit `host` and its descendants in document order, reading each visited element's box once.
+ * `visit` returns whether the element's own box reaches the window. A subtree whose recorded
+ * extent misses `[top, bottom]` (viewport points, the window's paint margin included) is skipped
+ * when `bounded`; otherwise every element is visited, and the extents are recorded either way. */
+export declare function scanMirrorTree(host: HTMLElement, window: {
+    top: number;
+    bottom: number;
+}, bounded: boolean, visit: (element: HTMLElement, rect: DOMRect) => void): void;