@buoy-gg/shared-ui 7.0.41 → 7.0.42

package/lib/module/ui/backgrounds/primitives.js

@@ -1,365 +1 @@
-"use strict";
-
-/**
- * Drawing + animation primitives for the tool backgrounds.
- *
- * HARD CONSTRAINT: Buoy's packages peer-depend on nothing but `react` and
- * `react-native`. No Skia, no Reanimated, no SVG, no gradient library — a
- * devtool cannot force a native dependency into someone's app. So every
- * background here is built out of plain `View`s plus `Animated`, and the
- * gradients/glows below are *faked* by stacking translucent layers.
- *
- * That sounds expensive. It isn't, because of two rules every preset follows:
- *
- *  1. **Every animation is native-driven.** `useNativeDriver: true` on a
- *     looping `Animated.timing` means the whole loop is handed to the UI thread
- *     once and never touches JS again — no per-frame callback, no re-render, no
- *     bridge traffic while it runs. A preset animates a handful of *layers*
- *     (transform on one parent view), never per-particle. (On web there is no
- *     native driver and the JS driver must be requested explicitly — see
- *     NATIVE_DRIVER below for why the flag can't simply be left `true`.)
- *
- *  2. **Every static layer is rasterized.** `shouldRasterizeIOS` /
- *     `renderToHardwareTextureAndroid` turn a layer of 40 dots into a single
- *     cached GPU texture, so sliding it is one composite — the same cost as
- *     sliding one view. See `RasterLayer`.
- *
- * The result: a preset costs a one-time mount of static views and then ~0
- * JS-thread work per frame. See `packages/shared/src/ui/backgrounds/README.md`.
- */
-
-import { memo, useEffect, useRef } from "react";
-import { Animated, AppState, Easing, Platform, StyleSheet, View } from "react-native";
-import { absoluteFill } from "../../utils/absoluteFill.js";
-import { flattenOver, withAlpha } from "./rng.js";
-
-// ============================================================================
-// Animation
-// ============================================================================
-
-/**
- * Ask for the native driver ONLY where the native animated module exists.
- *
- * On react-native-web (the desktop dashboard) `useNativeDriver: true` is
- * demoted to the JS driver — but `Animated.loop` trusts the config flag, not
- * the demotion: for a bare `loop(timing(...))` it takes its native-loop
- * shortcut and starts ONE plain timing whose `iterations: -1` only the
- * (absent) native module would honor. The loop plays a single pass and
- * freezes — on desktop every background stopped seconds after opening.
- * Requesting the JS driver honestly keeps loop's JS restart path in charge,
- * which is the only driver web has anyway.
- */
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const NATIVE_DRIVER = Platform.OS !== "web";
-
-/**
- * A native-driven 0→1 loop (JS-driven on web — see NATIVE_DRIVER).
- *
- * The returned value is only ever consumed by `interpolate` inside an
- * `Animated.View` style, so React never re-renders while it runs. The loop is
- * stopped when the app backgrounds (a background animation is pure battery
- * burn) and restarted on foreground.
- */
-export function useLoop(durationMs, enabled = true) {
-  const value = useRef(new Animated.Value(0)).current;
-  useEffect(() => {
-    if (!enabled) return;
-    let anim = null;
-    const start = () => {
-      if (anim) return;
-      value.setValue(0);
-      anim = Animated.loop(Animated.timing(value, {
-        toValue: 1,
-        duration: durationMs,
-        easing: Easing.linear,
-        useNativeDriver: NATIVE_DRIVER,
-        // A decorative endless loop must never register as an interaction —
-        // the default (true) would block InteractionManager callbacks in the
-        // host app for as long as the background is mounted.
-        isInteraction: false
-      }));
-      anim.start();
-    };
-    const stop = () => {
-      anim?.stop();
-      anim = null;
-      value.setValue(0);
-    };
-    start();
-    const sub = AppState.addEventListener("change", state => {
-      if (state === "active") start();else stop();
-    });
-    return () => {
-      stop();
-      sub.remove();
-    };
-  }, [durationMs, enabled, value]);
-  return value;
-}
-
-/**
- * A native-driven 0→1→0 breathe, for glows that pulse rather than travel.
- * Same no-JS-per-frame guarantee as `useLoop`.
- */
-export function usePulse(durationMs, enabled = true) {
-  const value = useRef(new Animated.Value(0)).current;
-  useEffect(() => {
-    if (!enabled) return;
-    let anim = null;
-    const start = () => {
-      if (anim) return;
-      value.setValue(0);
-      anim = Animated.loop(Animated.sequence([Animated.timing(value, {
-        toValue: 1,
-        duration: durationMs / 2,
-        easing: Easing.inOut(Easing.quad),
-        useNativeDriver: NATIVE_DRIVER,
-        // See useLoop: endless decorative loops must not hold
-        // InteractionManager (isInteraction defaults to true).
-        isInteraction: false
-      }), Animated.timing(value, {
-        toValue: 0,
-        duration: durationMs / 2,
-        easing: Easing.inOut(Easing.quad),
-        useNativeDriver: NATIVE_DRIVER,
-        isInteraction: false
-      })]));
-      anim.start();
-    };
-    const stop = () => {
-      anim?.stop();
-      anim = null;
-    };
-    start();
-    const sub = AppState.addEventListener("change", state => {
-      if (state === "active") start();else stop();
-    });
-    return () => {
-      stop();
-      sub.remove();
-    };
-  }, [durationMs, enabled, value]);
-  return value;
-}
-
-// ============================================================================
-// Layers
-// ============================================================================
-
-/**
- * A layer whose children are static and should be flattened into one GPU
- * texture. Wrap anything that gets translated/scaled as a whole — this is what
- * makes a 40-dot star band cost the same to move as a single view.
- */
-export const RasterLayer = /*#__PURE__*/memo(function RasterLayer({
-  style,
-  raster = true,
-  children
-}) {
-  return /*#__PURE__*/_jsx(View, {
-    style: style,
-    pointerEvents: "none"
-    // Both are no-ops on the platform they don't belong to, and on web
-    // (react-native-web) neither exists — there the browser already
-    // composites a transformed subtree on the GPU.
-    ,
-    shouldRasterizeIOS: raster && Platform.OS === "ios",
-    renderToHardwareTextureAndroid: raster && Platform.OS === "android",
-    children: children
-  });
-});
-
-/**
- * Fake radial gradient: concentric rounded views, each a constant per-ring
- * alpha, with radii shrinking on a curve. Alpha compositing of N equal layers
- * gives `1 - (1-a)^N` at the centre, so `a` is solved from the requested peak
- * alpha and the falloff comes from the radius curve.
- *
- * 8 rings is the sweet spot on a dark surface — below that you can see banding,
- * above it you're paying for views nobody can distinguish.
- */
-export const RadialGlow = /*#__PURE__*/memo(function RadialGlow({
-  size,
-  color,
-  alpha = 0.35,
-  rings = 8,
-  falloff = 1.7,
-  style
-}) {
-  const per = 1 - Math.pow(1 - alpha, 1 / rings);
-  const layers = [];
-  for (let i = 0; i < rings; i++) {
-    const d = size * Math.pow((rings - i) / rings, falloff);
-    layers.push(/*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        left: (size - d) / 2,
-        top: (size - d) / 2,
-        width: d,
-        height: d,
-        borderRadius: d / 2,
-        backgroundColor: withAlpha(color, per)
-      }
-    }, i));
-  }
-  return /*#__PURE__*/_jsx(View, {
-    style: [{
-      width: size,
-      height: size
-    }, style],
-    pointerEvents: "none",
-    shouldRasterizeIOS: Platform.OS === "ios",
-    renderToHardwareTextureAndroid: Platform.OS === "android",
-    children: layers
-  });
-});
-
-/**
- * Fake linear gradient: `bands` stacked strips with linearly interpolated
- * alpha. Used for scrims (keep text readable over a busy field) and for
- * horizon glows.
- *
- * TRAP (found on the Abyss wash): translucent strips must NOT overlap. An
- * overlap composites the same colour twice, doubling the alpha in a stripe at
- * every band edge — on a dark surface that draws a visible line per band, and
- * because the strips are %-sized the whole ruled pattern rescales as the
- * modal resizes. Strips here butt exactly, with a 0.08% fudge (sub-pixel at
- * any real size) so layout rounding can't open a hairline gap.
- *
- * `flattenBase`: when the fade sits DIRECTLY on a known opaque colour, pass
- * that colour — each strip is then drawn opaque via `flattenOver`, which is
- * pixel-identical, immune to seams entirely, and cheaper to composite.
- */
-export const LinearFade = /*#__PURE__*/memo(function LinearFade({
-  color,
-  from = 0,
-  to = 1,
-  bands = 14,
-  direction = "down",
-  flattenBase,
-  style
-}) {
-  const vertical = direction === "down" || direction === "up";
-  const reversed = direction === "up" || direction === "left";
-  const pct = 100 / bands;
-  const strips = [];
-  for (let i = 0; i < bands; i++) {
-    const t = (i + 0.5) / bands;
-    const a = from + (to - from) * (reversed ? 1 - t : t);
-    const fill = flattenBase ? flattenOver(color, a, flattenBase) : withAlpha(color, a);
-    strips.push(/*#__PURE__*/_jsx(View, {
-      style: vertical ? {
-        position: "absolute",
-        left: 0,
-        right: 0,
-        top: `${i * pct}%`,
-        height: `${pct + 0.08}%`,
-        backgroundColor: fill
-      } : {
-        position: "absolute",
-        top: 0,
-        bottom: 0,
-        left: `${i * pct}%`,
-        width: `${pct + 0.08}%`,
-        backgroundColor: fill
-      }
-    }, i));
-  }
-  return /*#__PURE__*/_jsx(View, {
-    style: [absoluteFill, style],
-    pointerEvents: "none",
-    children: strips
-  });
-});
-
-/**
- * Edge darkening. Four `LinearFade`s rather than a real radial vignette —
- * cheaper, and at these alphas the corners read as round anyway.
- */
-export const Vignette = /*#__PURE__*/memo(function Vignette({
-  color = "#000000",
-  alpha = 0.55,
-  spread = 0.34
-}) {
-  // Each fade fills its own positioned band, rather than trying to unset
-  // `absoluteFill`'s edges through the style array.
-  const band = `${spread * 100}%`;
-  return /*#__PURE__*/_jsxs(View, {
-    style: absoluteFill,
-    pointerEvents: "none",
-    children: [/*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        left: 0,
-        right: 0,
-        top: 0,
-        height: band
-      },
-      children: /*#__PURE__*/_jsx(LinearFade, {
-        color: color,
-        from: alpha,
-        to: 0,
-        direction: "down",
-        bands: 14
-      })
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        left: 0,
-        right: 0,
-        bottom: 0,
-        height: band
-      },
-      children: /*#__PURE__*/_jsx(LinearFade, {
-        color: color,
-        from: 0,
-        to: alpha,
-        direction: "down",
-        bands: 14
-      })
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        top: 0,
-        bottom: 0,
-        left: 0,
-        width: band
-      },
-      children: /*#__PURE__*/_jsx(LinearFade, {
-        color: color,
-        from: alpha,
-        to: 0,
-        direction: "right",
-        bands: 10
-      })
-    }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: "absolute",
-        top: 0,
-        bottom: 0,
-        right: 0,
-        width: band
-      },
-      children: /*#__PURE__*/_jsx(LinearFade, {
-        color: color,
-        from: 0,
-        to: alpha,
-        direction: "right",
-        bands: 10
-      })
-    })]
-  });
-});
-
-/** Flat wash used as the base coat under every preset. */
-export const Base = /*#__PURE__*/memo(function Base({
-  color
-}) {
-  return /*#__PURE__*/_jsx(View, {
-    style: [absoluteFill, {
-      backgroundColor: color
-    }],
-    pointerEvents: "none"
-  });
-});
-export const hairline = StyleSheet.hairlineWidth;
+"use strict";import{memo as f,useEffect as O,useRef as R}from"react";import{Animated as c,AppState as S,Easing as m,Platform as g,StyleSheet as L,View as l}from"react-native";import{absoluteFill as b}from"../../utils/absoluteFill.js";import{flattenOver as A,withAlpha as I}from"./rng.js";import{jsx as r,jsxs as T}from"react/jsx-runtime";const w=g.OS!=="web";export function useLoop(s,e=true){const t=R(new c.Value(0)).current;O(()=>{if(!e)return;let o=null;const n=()=>{if(o)return;t.setValue(0);o=c.loop(c.timing(t,{toValue:1,duration:s,easing:m.linear,useNativeDriver:w,isInteraction:false}));o.start()};const i=()=>{o?.stop();o=null;t.setValue(0)};n();const u=S.addEventListener("change",d=>{if(d==="active")n();else i()});return()=>{i();u.remove()}},[s,e,t]);return t}export function usePulse(s,e=true){const t=R(new c.Value(0)).current;O(()=>{if(!e)return;let o=null;const n=()=>{if(o)return;t.setValue(0);o=c.loop(c.sequence([c.timing(t,{toValue:1,duration:s/2,easing:m.inOut(m.quad),useNativeDriver:w,isInteraction:false}),c.timing(t,{toValue:0,duration:s/2,easing:m.inOut(m.quad),useNativeDriver:w,isInteraction:false})]));o.start()};const i=()=>{o?.stop();o=null};n();const u=S.addEventListener("change",d=>{if(d==="active")n();else i()});return()=>{i();u.remove()}},[s,e,t]);return t}export const RasterLayer=f(function s({style:e,raster:t=true,children:o}){return r(l,{style:e,pointerEvents:"none",shouldRasterizeIOS:t&&g.OS==="ios",renderToHardwareTextureAndroid:t&&g.OS==="android",children:o})});export const RadialGlow=f(function s({size:e,color:t,alpha:o=.35,rings:n=8,falloff:i=1.7,style:u}){const d=1-Math.pow(1-o,1/n);const v=[];for(let p=0;p<n;p++){const a=e*Math.pow((n-p)/n,i);v.push(r(l,{style:{position:"absolute",left:(e-a)/2,top:(e-a)/2,width:a,height:a,borderRadius:a/2,backgroundColor:I(t,d)}},p))}return r(l,{style:[{width:e,height:e},u],pointerEvents:"none",shouldRasterizeIOS:g.OS==="ios",renderToHardwareTextureAndroid:g.OS==="android",children:v})});export const LinearFade=f(function s({color:e,from:t=0,to:o=1,bands:n=14,direction:i="down",flattenBase:u,style:d}){const v=i==="down"||i==="up";const p=i==="up"||i==="left";const a=100/n;const y=[];for(let h=0;h<n;h++){const x=(h+.5)/n;const V=t+(o-t)*(p?1-x:x);const E=u?A(e,V,u):I(e,V);y.push(r(l,{style:v?{position:"absolute",left:0,right:0,top:`${h*a}%`,height:`${a+.08}%`,backgroundColor:E}:{position:"absolute",top:0,bottom:0,left:`${h*a}%`,width:`${a+.08}%`,backgroundColor:E}},h))}return r(l,{style:[b,d],pointerEvents:"none",children:y})});export const Vignette=f(function s({color:e="#000000",alpha:t=.55,spread:o=.34}){const n=`${o*100}%`;return T(l,{style:b,pointerEvents:"none",children:[r(l,{style:{position:"absolute",left:0,right:0,top:0,height:n},children:r(LinearFade,{color:e,from:t,to:0,direction:"down",bands:14})}),r(l,{style:{position:"absolute",left:0,right:0,bottom:0,height:n},children:r(LinearFade,{color:e,from:0,to:t,direction:"down",bands:14})}),r(l,{style:{position:"absolute",top:0,bottom:0,left:0,width:n},children:r(LinearFade,{color:e,from:t,to:0,direction:"right",bands:10})}),r(l,{style:{position:"absolute",top:0,bottom:0,right:0,width:n},children:r(LinearFade,{color:e,from:0,to:t,direction:"right",bands:10})})]})});export const Base=f(function s({color:e}){return r(l,{style:[b,{backgroundColor:e}],pointerEvents:"none"})});export const hairline=L.hairlineWidth;

package/lib/module/ui/backgrounds/registry.js

@@ -1,91 +1 @@
-"use strict";
-
-/**
- * The catalogue. Adding a preset means adding one entry here — the switcher,
- * the persisted selection and every tool surface read from this list.
- *
- * `nodes` and `views` are not decoration: they are the number of native
- * animated nodes the preset runs and the rough count of static views it mounts,
- * so the switcher can show what each look costs while you compare them. Keep
- * them honest.
- */
-
-import { DeepField } from "./variants/deepField.js";
-import { Wormhole } from "./variants/wormhole.js";
-import { Hyperspace } from "./variants/hyperspace.js";
-import { LiveSky } from "./variants/liveSky.js";
-import { Abyss, Bubbles, Jellyfish } from "./variants/underwater.js";
-export const BACKGROUND_PRESETS = [{
-  id: "off",
-  label: "Off",
-  blurb: "Plain black — no backdrop at all",
-  nodes: 0,
-  views: 1,
-  Component: null
-}, {
-  id: "deepfield",
-  label: "Deep Field",
-  blurb: "The Everlights field — 160 stars, with meteors slamming the walls",
-  // The old standalone Meteors preset folded in: +2 meteor loops, ~55 views
-  // (streak + flash + the pop's 6 rays and ~3 embers per impact).
-  nodes: 24,
-  views: 515,
-  Component: DeepField
-}, {
-  id: "hyperspace",
-  label: "Hyperspace",
-  blurb: "Lightspeed — crisp points streaming from a centre vanishing point",
-  nodes: 1,
-  views: 570,
-  Component: Hyperspace
-}, {
-  id: "livesky",
-  label: "Live Sky",
-  blurb: "The cove on your clock — dawn to dusk, for real",
-  nodes: 5,
-  views: 290,
-  Component: LiveSky
-}, {
-  id: "abyss",
-  label: "Abyss",
-  blurb: "A surface light fanning into the deep",
-  nodes: 4,
-  views: 230,
-  Component: Abyss
-}, {
-  id: "bubbles",
-  label: "Bubbles",
-  blurb: "Bubbles wobbling up through the light",
-  nodes: 4,
-  views: 180,
-  Component: Bubbles
-}, {
-  id: "jellyfish",
-  label: "Jellyfish",
-  blurb: "A bloom of glowing jellies, big and small, pulsing past",
-  nodes: 15,
-  views: 250,
-  Component: Jellyfish
-}, {
-  id: "wormhole",
-  label: "Wormhole",
-  blurb: "Cobalt clouds and copper light — a native flight through the tunnel",
-  nodes: 1,
-  views: 7,
-  Component: Wormhole
-}];
-
-// Ships OFF: a backdrop is an opt-in, so first load is plain black and the
-// choice only persists once the user actually picks one in the switcher.
-export const DEFAULT_BACKGROUND = "off";
-export function presetIndex(id) {
-  const i = BACKGROUND_PRESETS.findIndex(p => p.id === id);
-  return i < 0 ? 0 : i;
-}
-export function presetAt(index) {
-  const n = BACKGROUND_PRESETS.length;
-  return BACKGROUND_PRESETS[(index % n + n) % n];
-}
-export function getPreset(id) {
-  return BACKGROUND_PRESETS[presetIndex(id)];
-}
+"use strict";import{DeepField as n}from"./variants/deepField.js";import{Wormhole as t}from"./variants/wormhole.js";import{Hyperspace as i}from"./variants/hyperspace.js";import{LiveSky as s}from"./variants/liveSky.js";import{Abyss as r,Bubbles as b,Jellyfish as p}from"./variants/underwater.js";export const BACKGROUND_PRESETS=[{id:"off",label:"Off",blurb:"Plain black \u2014 no backdrop at all",nodes:0,views:1,Component:null},{id:"deepfield",label:"Deep Field",blurb:"The Everlights field \u2014 160 stars, with meteors slamming the walls",nodes:24,views:515,Component:n},{id:"hyperspace",label:"Hyperspace",blurb:"Lightspeed \u2014 crisp points streaming from a centre vanishing point",nodes:1,views:570,Component:i},{id:"livesky",label:"Live Sky",blurb:"The cove on your clock \u2014 dawn to dusk, for real",nodes:5,views:290,Component:s},{id:"abyss",label:"Abyss",blurb:"A surface light fanning into the deep",nodes:4,views:230,Component:r},{id:"bubbles",label:"Bubbles",blurb:"Bubbles wobbling up through the light",nodes:4,views:180,Component:b},{id:"jellyfish",label:"Jellyfish",blurb:"A bloom of glowing jellies, big and small, pulsing past",nodes:15,views:250,Component:p},{id:"wormhole",label:"Wormhole",blurb:"Cobalt clouds and copper light \u2014 a native flight through the tunnel",nodes:1,views:7,Component:t}];export const DEFAULT_BACKGROUND="off";export function presetIndex(o){const e=BACKGROUND_PRESETS.findIndex(l=>l.id===o);return e<0?0:e}export function presetAt(o){const e=BACKGROUND_PRESETS.length;return BACKGROUND_PRESETS[(o%e+e)%e]}export function getPreset(o){return BACKGROUND_PRESETS[presetIndex(o)]}

package/lib/module/ui/backgrounds/rng.js

@@ -1,85 +1 @@
-"use strict";
-
-/**
- * Deterministic scatter tables for the tool backgrounds.
- *
- * Every preset needs a pile of "random" positions, sizes and phases. Those are
- * generated ONCE at module load from a fixed seed and frozen, so:
- *   - the same seed always paints the same field (screenshots are stable, and
- *     two tools showing the same background look identical),
- *   - no allocation happens on mount or on any re-render — the presets only
- *     read these arrays.
- *
- * Ported from the seeded field in the Everlights starfield (mulberry32).
- */
-
-export function mulberry32(seed) {
-  return () => {
-    seed = seed + 0x6d2b79f5 | 0;
-    let t = Math.imul(seed ^ seed >>> 15, 1 | seed);
-    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
-    return ((t ^ t >>> 14) >>> 0) / 4294967296;
-  };
-}
-
-/** `count` numbers in [0,1) from `seed`. */
-export function scatter(seed, count) {
-  const rnd = mulberry32(seed >>> 0);
-  const out = new Array(count);
-  for (let i = 0; i < count; i++) out[i] = rnd();
-  return out;
-}
-
-/** `#RRGGBB` (or `#RGB`) + alpha 0..1 → `rgba(...)`. */
-export function withAlpha(hex, alpha) {
-  let h = hex.replace("#", "");
-  if (h.length === 3) h = h[0] + h[0] + h[1] + h[1] + h[2] + h[2];
-  const n = parseInt(h, 16);
-  const r = n >> 16 & 255;
-  const g = n >> 8 & 255;
-  const b = n & 255;
-  const a = alpha < 0 ? 0 : alpha > 1 ? 1 : alpha;
-  return `rgba(${r},${g},${b},${a.toFixed(3)})`;
-}
-
-/**
- * RGB lerp between two `#RRGGBB` (or `#RGB`) colours, returned as `#RRGGBB`.
- * Used by Live Sky to blend palette keyframes; at minute-sized steps a plain
- * RGB lerp is indistinguishable from anything fancier.
- */
-export function lerpColor(a, b, t) {
-  const parse = h => {
-    let v = h.replace("#", "");
-    if (v.length === 3) v = v[0] + v[0] + v[1] + v[1] + v[2] + v[2];
-    const n = parseInt(v, 16);
-    return [n >> 16 & 255, n >> 8 & 255, n & 255];
-  };
-  const [ar, ag, ab] = parse(a);
-  const [br, bg, bb] = parse(b);
-  const c = t < 0 ? 0 : t > 1 ? 1 : t;
-  const mix = (x, y) => Math.round(x + (y - x) * c);
-  const hex = n => n.toString(16).padStart(2, "0");
-  return `#${hex(mix(ar, br))}${hex(mix(ag, bg))}${hex(mix(ab, bb))}`;
-}
-
-/**
- * `hex` at `alpha` composited over an opaque `base`, returned as an OPAQUE
- * colour.
- *
- * Over a known backdrop this is pixel-identical to drawing the translucent
- * colour — the GPU just doesn't have to blend it. Only valid where nothing
- * else sits between the layer and `base`.
- */
-export function flattenOver(hex, alpha, base) {
-  const parse = h => {
-    let v = h.replace("#", "");
-    if (v.length === 3) v = v[0] + v[0] + v[1] + v[1] + v[2] + v[2];
-    const n = parseInt(v, 16);
-    return [n >> 16 & 255, n >> 8 & 255, n & 255];
-  };
-  const [r, g, b] = parse(hex);
-  const [br, bg, bb] = parse(base);
-  const a = alpha < 0 ? 0 : alpha > 1 ? 1 : alpha;
-  const mix = (c, bc) => Math.round(c * a + bc * (1 - a));
-  return `rgb(${mix(r, br)},${mix(g, bg)},${mix(b, bb)})`;
-}
+"use strict";export function mulberry32(e){return()=>{e=e+1831565813|0;let t=Math.imul(e^e>>>15,1|e);t=t+Math.imul(t^t>>>7,61|t)^t;return((t^t>>>14)>>>0)/4294967296}}export function scatter(e,t){const r=mulberry32(e>>>0);const c=new Array(t);for(let s=0;s<t;s++)c[s]=r();return c}export function withAlpha(e,t){let r=e.replace("#","");if(r.length===3)r=r[0]+r[0]+r[1]+r[1]+r[2]+r[2];const c=parseInt(r,16);const s=c>>16&255;const a=c>>8&255;const b=c&255;const l=t<0?0:t>1?1:t;return`rgba(${s},${a},${b},${l.toFixed(3)})`}export function lerpColor(e,t,r){const c=n=>{let o=n.replace("#","");if(o.length===3)o=o[0]+o[0]+o[1]+o[1]+o[2]+o[2];const $=parseInt(o,16);return[$>>16&255,$>>8&255,$&255]};const[s,a,b]=c(e);const[l,f,g]=c(t);const p=r<0?0:r>1?1:r;const u=(n,o)=>Math.round(n+(o-n)*p);const i=n=>n.toString(16).padStart(2,"0");return`#${i(u(s,l))}${i(u(a,f))}${i(u(b,g))}`}export function flattenOver(e,t,r){const c=i=>{let n=i.replace("#","");if(n.length===3)n=n[0]+n[0]+n[1]+n[1]+n[2]+n[2];const o=parseInt(n,16);return[o>>16&255,o>>8&255,o&255]};const[s,a,b]=c(e);const[l,f,g]=c(r);const p=t<0?0:t>1?1:t;const u=(i,n)=>Math.round(i*p+n*(1-p));return`rgb(${u(s,l)},${u(a,f)},${u(b,g)})`}

package/lib/module/ui/backgrounds/skyClock.js

@@ -1,39 +1 @@
-"use strict";
-
-/**
- * The Live Sky scrub clock.
- *
- * `null` means "live" — the Live Sky preset follows the real local clock. A
- * number (minutes since midnight, quantized by the slider) freezes the scene
- * at that time of day so the whole cycle can be scrubbed through by hand.
- *
- * Deliberately NOT part of `backgroundStore`: the variant itself has to read
- * this, and a variant importing the store would close an import cycle through
- * the registry (store → registry → variant → store). It is also deliberately
- * not persisted — a scrub is a preview gesture, not a setting.
- */
-
-import { useEffect, useState } from "react";
-let scrub = null;
-const listeners = new Set();
-export function getSkyScrub() {
-  return scrub;
-}
-export function setSkyScrub(value) {
-  if (value === scrub) return;
-  scrub = value;
-  for (const listener of listeners) listener();
-}
-
-/** Subscribe a component to the scrub value. */
-export function useSkyScrub() {
-  const [value, setValue] = useState(scrub);
-  useEffect(() => {
-    const listener = () => setValue(scrub);
-    listeners.add(listener);
-    return () => {
-      listeners.delete(listener);
-    };
-  }, []);
-  return value;
-}
+"use strict";import{useEffect as s,useState as o}from"react";let e=null;const n=new Set;export function getSkyScrub(){return e}export function setSkyScrub(t){if(t===e)return;e=t;for(const r of n)r()}export function useSkyScrub(){const[t,r]=o(e);s(()=>{const u=()=>r(e);n.add(u);return()=>{n.delete(u)}},[]);return t}

package/lib/module/ui/backgrounds/types.js

@@ -1 +1 @@
-"use strict";
+"use strict";