@lovo/matter 0.4.0 → 0.5.0

package/dist/index.js

@@ -1,4 +1,4 @@
-// src/runtime/createRenderer.ts
+// src/runtime/create-renderer/create-renderer.ts
 import { Color } from "three";
 import { WebGPURenderer } from "three/webgpu";
 async function createRenderer(canvas, opts = {}) {
@@ -19,10 +19,10 @@ async function createRenderer(canvas, opts = {}) {
   const resolvedClearColor = clearColor instanceof Color ? clearColor : new Color(clearColor);
   three.setClearColor(resolvedClearColor, clearAlpha);
   const resize = () => {
-    const w = canvas.clientWidth;
-    const h = canvas.clientHeight;
-    if (canvas.width !== w * three.getPixelRatio() || canvas.height !== h * three.getPixelRatio()) {
-      three.setSize(w, h, false);
+    const canvasWidth = canvas.clientWidth;
+    const canvasHeight = canvas.clientHeight;
+    if (canvas.width !== canvasWidth * three.getPixelRatio() || canvas.height !== canvasHeight * three.getPixelRatio()) {
+      three.setSize(canvasWidth, canvasHeight, false);
     }
   };
   resize();
@@ -36,7 +36,7 @@ async function createRenderer(canvas, opts = {}) {
   };
 }
 
-// src/inputs/CursorInput.ts
+// src/inputs/cursor-input/cursor-input.ts
 var CursorInput = class {
   value;
   target;
@@ -56,16 +56,19 @@ var CursorInput = class {
     this.element = element;
     this.handleMouseMove = (e) => {
       if (!(e instanceof MouseEvent)) return;
-      const me = e;
+      const mouseEvent = e;
       if (this.element) {
-        const r = this.element.getBoundingClientRect();
-        const w = r.width || 1;
-        const h = r.height || 1;
-        this.target = [(me.clientX - r.left) / w, (me.clientY - r.top) / h];
+        const elementRect = this.element.getBoundingClientRect();
+        const elementWidth = elementRect.width || 1;
+        const elementHeight = elementRect.height || 1;
+        this.target = [
+          (mouseEvent.clientX - elementRect.left) / elementWidth,
+          (mouseEvent.clientY - elementRect.top) / elementHeight
+        ];
       } else {
-        const w = typeof window !== "undefined" && window.innerWidth || 1;
-        const h = typeof window !== "undefined" && window.innerHeight || 1;
-        this.target = [me.clientX / w, me.clientY / h];
+        const viewportWidth = typeof window !== "undefined" && window.innerWidth || 1;
+        const viewportHeight = typeof window !== "undefined" && window.innerHeight || 1;
+        this.target = [mouseEvent.clientX / viewportWidth, mouseEvent.clientY / viewportHeight];
       }
       this.targetDirty = true;
     };
@@ -76,9 +79,9 @@ var CursorInput = class {
     return this.value;
   }
   /** Subscribe to change events. Returns an unsubscribe function. */
-  on(_event, cb) {
-    this.listeners.add(cb);
-    return () => this.listeners.delete(cb);
+  on(_eventType, changeListener) {
+    this.listeners.add(changeListener);
+    return () => this.listeners.delete(changeListener);
   }
   /**
    * Advance the smoothing one tick. Called by the host scheduler; not
@@ -107,10 +110,10 @@ var CursorInput = class {
     this.listeners.clear();
   }
 };
-var clamp01 = (n) => Math.max(0, Math.min(1, n));
-var lerp = (a, b, t) => a + (b - a) * t;
+var clamp01 = (value) => Math.max(0, Math.min(1, value));
+var lerp = (startValue, endValue, blendFactor) => startValue + (endValue - startValue) * blendFactor;
 
-// src/primitives/colorRamp.ts
+// src/primitives/color-ramp/color-ramp.ts
 import { mix, vec3 } from "three/tsl";
 import { clamp, div, sub } from "three/tsl";
 function colorRamp(t, stops) {
@@ -119,78 +122,78 @@ function colorRamp(t, stops) {
   if (stops.length === 1) return mix(first.color, first.color, 0);
   let result = mix(first.color, first.color, 0);
   for (let i = 1; i < stops.length; i += 1) {
-    const prev = stops[i - 1];
+    const previousStop = stops[i - 1];
     const next = stops[i];
-    if (prev === void 0 || next === void 0) continue;
-    const span = next.position - prev.position;
-    if (span <= 0) continue;
-    const localT = clamp(div(sub(t, prev.position), span), 0, 1);
+    if (previousStop === void 0 || next === void 0) continue;
+    const positionSpan = next.position - previousStop.position;
+    if (positionSpan <= 0) continue;
+    const localT = clamp(div(sub(t, previousStop.position), positionSpan), 0, 1);
     result = mix(result, next.color, localT);
   }
   return result;
 }
 
-// src/primitives/noise.ts
+// src/primitives/noise/noise.ts
 import { mx_noise_float } from "three/tsl";
-function noise(p) {
+function simplexNoise(p) {
   return mx_noise_float(p);
 }
 
-// src/primitives/fbm.ts
+// src/primitives/fbm/fbm.ts
 import { add, mul } from "three/tsl";
-function fbm(p, opts = {}) {
+function fractalNoise(p, opts = {}) {
   const octaves = opts.octaves ?? 4;
   const lacunarity = opts.lacunarity ?? 2;
   const gain = opts.gain ?? 0.5;
-  let sum = noise(p);
-  let amp = 1;
-  let freq = 1;
-  let total = amp;
+  let sum = simplexNoise(p);
+  let amplitude = 1;
+  let frequency = 1;
+  let total = amplitude;
   for (let i = 1; i < octaves; i += 1) {
-    freq *= lacunarity;
-    amp *= gain;
-    total += amp;
-    const pAtFreq = add(mul(p, freq), i * 100);
-    const layer = noise(pAtFreq).mul(amp);
+    frequency *= lacunarity;
+    amplitude *= gain;
+    total += amplitude;
+    const pAtFreq = add(mul(p, frequency), i * 100);
+    const layer = simplexNoise(pAtFreq).mul(amplitude);
     sum = sum.add(layer);
   }
   return sum.div(total);
 }
 
-// src/primitives/voronoi.ts
+// src/primitives/voronoi/voronoi.ts
 import { mx_worley_noise_float } from "three/tsl";
 function voronoi(p) {
   return mx_worley_noise_float(p);
 }
 
-// src/primitives/quantize.ts
+// src/primitives/quantize/quantize.ts
 function quantize(t, steps) {
   if (steps <= 1) {
     return t.mul(0);
   }
-  const denom = steps - 1;
-  return t.mul(denom).add(0.5).floor().div(denom);
+  const denominator = steps - 1;
+  return t.mul(denominator).add(0.5).floor().div(denominator);
 }
 
-// src/primitives/sdfCircle.ts
+// src/primitives/sdf-circle/sdf-circle.ts
 import { length } from "three/tsl";
-function sdfCircle(p, radius) {
+function signedDistanceFieldCircle(p, radius) {
   return length(p).sub(radius);
 }
 
-// src/primitives/displace.ts
+// src/primitives/displace/displace.ts
 import { add as add2 } from "three/tsl";
 function displace(p, by) {
   return add2(p, by);
 }
 
-// src/primitives/cursorRipple.ts
+// src/primitives/cursor-ripple/cursor-ripple.ts
 import { length as length2, sin, smoothstep, sub as sub2 } from "three/tsl";
 
-// src/primitives/time.ts
+// src/primitives/time/time.ts
 import { time as _builtinTime } from "three/tsl";
 
-// src/runtime/reducedMotion.ts
+// src/runtime/reduced-motion/reduced-motion.ts
 import { uniform } from "three/tsl";
 var state = {
   policy: "auto",
@@ -199,7 +202,7 @@ var state = {
 function setReducedMotionPolicy(policy) {
   if (state.policy === policy) return;
   state.policy = policy;
-  for (const w of state.watchers) w.recompute();
+  for (const watcher of state.watchers) watcher.recompute();
 }
 function getReducedMotionPolicy() {
   return state.policy;
@@ -220,8 +223,8 @@ function createReducedMotionWatcher() {
   if (typeof matchMedia !== "function") {
     return {
       scale: () => computeScale(false),
-      subscribe: (cb) => {
-        void cb;
+      subscribe: (listener) => {
+        void listener;
         return () => {
         };
       },
@@ -230,33 +233,33 @@ function createReducedMotionWatcher() {
       }
     };
   }
-  const mql = matchMedia("(prefers-reduced-motion: reduce)");
-  const subs = /* @__PURE__ */ new Set();
-  let last = computeScale(mql.matches);
+  const mediaQueryList = matchMedia("(prefers-reduced-motion: reduce)");
+  const subscriptions = /* @__PURE__ */ new Set();
+  let lastComputedScale = computeScale(mediaQueryList.matches);
   const onChange = () => {
-    const next = computeScale(mql.matches);
-    if (next !== last) {
-      last = next;
-      for (const cb of subs) cb(next);
+    const next = computeScale(mediaQueryList.matches);
+    if (next !== lastComputedScale) {
+      lastComputedScale = next;
+      for (const listener of subscriptions) listener(next);
     }
   };
-  mql.addEventListener("change", onChange);
+  mediaQueryList.addEventListener("change", onChange);
   const watcher = {
-    scale: () => last,
-    subscribe(cb) {
-      subs.add(cb);
-      return () => subs.delete(cb);
+    scale: () => lastComputedScale,
+    subscribe(listener) {
+      subscriptions.add(listener);
+      return () => subscriptions.delete(listener);
     },
     recompute() {
-      const next = computeScale(mql.matches);
-      if (next !== last) {
-        last = next;
-        for (const cb of subs) cb(next);
+      const next = computeScale(mediaQueryList.matches);
+      if (next !== lastComputedScale) {
+        lastComputedScale = next;
+        for (const listener of subscriptions) listener(next);
       }
     },
     dispose() {
-      mql.removeEventListener("change", onChange);
-      subs.clear();
+      mediaQueryList.removeEventListener("change", onChange);
+      subscriptions.clear();
       state.watchers.delete(watcher);
     }
   };
@@ -277,32 +280,30 @@ function getReducedMotionTimeScale() {
   return globalScaleUniform;
 }
 
-// src/primitives/time.ts
-var time = _builtinTime.mul(getReducedMotionTimeScale());
+// src/primitives/time/time.ts
+var elapsedTime = _builtinTime.mul(getReducedMotionTimeScale());
 
-// src/primitives/cursorRipple.ts
+// src/primitives/cursor-ripple/cursor-ripple.ts
 function cursorRipple(p, center, opts = {}) {
   const reach = opts.reach ?? 0.4;
   const frequency = opts.frequency ?? 30;
   const speed = opts.speed ?? 6;
   const amplitude = opts.amplitude ?? 0.5;
   const d = length2(sub2(p, center));
-  const wave = sin(d.mul(frequency).sub(time.mul(speed)));
+  const wave = sin(d.mul(frequency).sub(elapsedTime.mul(speed)));
   const decay = smoothstep(reach, 0, d);
   return wave.mul(amplitude).mul(decay);
 }
 
-// src/primitives/filmGrain.ts
-import { fract, length as length3, sin as sin2, vec2 } from "three/tsl";
-function filmGrain(uvNode, intensity, timeOffset = 0) {
-  const HASH_C1 = vec2(2127.1, 81.17);
-  const HASH_C2 = vec2(1269.5, 283.37);
-  const base = vec2(uvNode.dot(HASH_C1).add(timeOffset), uvNode.dot(HASH_C2).add(timeOffset));
-  const hash = fract(sin2(base).mul(43758.5453));
-  return length3(hash).sub(0.765).mul(intensity);
+// src/primitives/film-grain/film-grain.ts
+import { hash, mul as mul2, screenCoordinate } from "three/tsl";
+function filmGrain(intensity, timeOffset = 0) {
+  const pixel = screenCoordinate.xy.floor();
+  const seed = pixel.x.toUint().mul(1973).add(pixel.y.toUint().mul(9277)).add(mul2(timeOffset, 26699).toUint());
+  return hash(seed).sub(0.5).mul(intensity);
 }
 
-// src/runtime/visibility.ts
+// src/runtime/visibility/visibility.ts
 function createVisibilityWatcher() {
   if (typeof document === "undefined") {
     return {
@@ -313,26 +314,26 @@ function createVisibilityWatcher() {
       }
     };
   }
-  const subs = /* @__PURE__ */ new Set();
+  const subscriptions = /* @__PURE__ */ new Set();
   const onChange = () => {
-    const v = document.visibilityState === "visible";
-    for (const cb of subs) cb(v);
+    const isVisible = document.visibilityState === "visible";
+    for (const listener of subscriptions) listener(isVisible);
   };
   document.addEventListener("visibilitychange", onChange);
   return {
     isVisible: () => document.visibilityState === "visible",
-    subscribe(cb) {
-      subs.add(cb);
-      return () => subs.delete(cb);
+    subscribe(listener) {
+      subscriptions.add(listener);
+      return () => subscriptions.delete(listener);
     },
     dispose() {
       document.removeEventListener("visibilitychange", onChange);
-      subs.clear();
+      subscriptions.clear();
     }
   };
 }
 
-// src/runtime/intersection.ts
+// src/runtime/intersection/intersection.ts
 function createIntersectionWatcher(canvas) {
   if (typeof IntersectionObserver === "undefined") {
     return {
@@ -343,41 +344,50 @@ function createIntersectionWatcher(canvas) {
       }
     };
   }
-  const subs = /* @__PURE__ */ new Set();
+  const subscriptions = /* @__PURE__ */ new Set();
   let inView = true;
-  const obs = new IntersectionObserver(
+  const observer = new IntersectionObserver(
     (entries) => {
-      const next = entries.some((e) => e.isIntersecting);
+      const next = entries.some((entry) => entry.isIntersecting);
       if (next === inView) return;
       inView = next;
-      for (const cb of subs) cb(inView);
+      for (const listener of subscriptions) listener(inView);
     },
     { threshold: 0 }
   );
-  obs.observe(canvas);
+  observer.observe(canvas);
   return {
     isInView: () => inView,
-    subscribe(cb) {
-      subs.add(cb);
-      return () => subs.delete(cb);
+    subscribe(listener) {
+      subscriptions.add(listener);
+      return () => subscriptions.delete(listener);
     },
     dispose() {
-      obs.disconnect();
-      subs.clear();
+      observer.disconnect();
+      subscriptions.clear();
     }
   };
 }
 
-// src/runtime/frame-scheduler.ts
+// src/runtime/frame-scheduler/frame-scheduler.ts
 var FrameScheduler = class {
   clients = /* @__PURE__ */ new Set();
   rafId = null;
   running = false;
   paused = false;
-  idle = false;
   flushPending = false;
   startedAt = 0;
   lastTickAt = 0;
+  // Reference-counted idle voting. The scheduler is idle only when at least
+  // one component has voted idle AND no component has voted animated. This
+  // prevents a static component (e.g. LinearGradient speed=0) from halting
+  // the loop while an animated overlay (e.g. FilmGrain) is still running.
+  idleVotes = 0;
+  animatedVotes = 0;
+  /** True when all participating components prefer idle and none need animation. */
+  get idle() {
+    return this.idleVotes > 0 && this.animatedVotes === 0;
+  }
   /** Activate the scheduler. The rAF loop starts on the first client added. */
   start() {
     this.running = true;
@@ -413,19 +423,39 @@ var FrameScheduler = class {
     this.clients.clear();
   }
   /**
-   * Mark the scheduler idle. The next tick still fires (a final flush so
-   * uniform changes that triggered the idle state are rendered), then the
-   * rAF loop halts. Use `requestRender()` or `setIdle(false)` to wake.
+   * Cast a vote on whether the scheduler should be idle.
+   *
+   * `setIdle(true)` increments the idle-vote count; the returned cleanup
+   * decrements it. `setIdle(false)` increments the animated-vote count;
+   * its cleanup decrements that. The scheduler halts (after one flush tick)
+   * only when `idleVotes > 0 && animatedVotes === 0`.
+   *
+   * Callers are responsible for calling the returned cleanup on unmount.
+   * Use `requestRender()` or cast a `setIdle(false)` vote to wake the loop
+   * without permanently registering an animated preference.
    */
   setIdle(idle) {
-    if (this.idle === idle) return;
-    this.idle = idle;
     if (idle) {
-      this.flushPending = true;
-      this.maybeQueue();
+      const wasIdle = this.idle;
+      this.idleVotes += 1;
+      const nowIdle = this.idle;
+      if (!wasIdle && nowIdle) this.onBecameIdle();
+      return () => {
+        const prevIdle = this.idle;
+        this.idleVotes = Math.max(0, this.idleVotes - 1);
+        const afterIdle = this.idle;
+        if (prevIdle && !afterIdle) this.onBecameAnimated();
+      };
     } else {
-      this.flushPending = false;
-      this.maybeQueue();
+      const wasIdle = this.idle;
+      this.animatedVotes += 1;
+      if (wasIdle) this.onBecameAnimated();
+      return () => {
+        const prevIdle = this.idle;
+        this.animatedVotes = Math.max(0, this.animatedVotes - 1);
+        const nowIdle = this.idle;
+        if (!prevIdle && nowIdle) this.onBecameIdle();
+      };
     }
   }
   /** Force a single tick while idle. Useful for prop-change invalidation. */
@@ -434,6 +464,14 @@ var FrameScheduler = class {
     this.flushPending = true;
     this.maybeQueue();
   }
+  onBecameIdle() {
+    this.flushPending = true;
+    this.maybeQueue();
+  }
+  onBecameAnimated() {
+    this.flushPending = false;
+    this.maybeQueue();
+  }
   maybeQueue() {
     if (this.rafId !== null) return;
     if (!this.running) return;
@@ -475,15 +513,15 @@ export {
   createVisibilityWatcher,
   cursorRipple,
   displace,
-  fbm,
+  elapsedTime,
   filmGrain,
+  fractalNoise,
   getReducedMotionPolicy,
   getReducedMotionTimeScale,
-  noise,
   quantize,
-  sdfCircle,
   setReducedMotionPolicy,
-  time,
+  signedDistanceFieldCircle,
+  simplexNoise,
   voronoi
 };
 //# sourceMappingURL=index.js.map