@lovo/matter 0.6.0 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +37 -6
- package/dist/index.cjs +46 -14
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +33 -15
- package/dist/index.d.ts +33 -15
- package/dist/index.js +46 -15
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,36 @@
|
|
|
1
1
|
# @lovo/matter
|
|
2
2
|
|
|
3
|
+
## 2.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- 945657f: Rework the `<Vignette>` component. Its props are renamed for clarity — `radius` is now `falloff` and `softness` is now `feather` — and the overlay blend gains `colorSpace` (default `oklab`) and `hueInterpolation` (default `shorter`), so the vignette can darken and tint in a chosen perceptual space rather than only in linear space. Defaults shift to `intensity` 0.3, `feather` 0.6, and a dark wide-gamut `oklch()` color.
|
|
8
|
+
|
|
9
|
+
This is a breaking change for anyone using `radius` or `softness`, or relying on the previous linear default blend.
|
|
10
|
+
|
|
11
|
+
## 1.0.0
|
|
12
|
+
|
|
13
|
+
### Major Changes
|
|
14
|
+
|
|
15
|
+
- 8d9d4ad: Rename the `filmGrain` primitive to `grain`.
|
|
16
|
+
|
|
17
|
+
The `filmGrain(intensity, timeOffset?)` primitive is now exported as `grain` with
|
|
18
|
+
an identical signature and behavior. The Tier 1 `<FilmGrain>` component (delivered
|
|
19
|
+
via the CLI) is likewise renamed to `<Grain>`, and its `film-grain` registry slug
|
|
20
|
+
is now `grain`.
|
|
21
|
+
|
|
22
|
+
**Migration:** one-pass find-and-replace.
|
|
23
|
+
|
|
24
|
+
```ts
|
|
25
|
+
// Before
|
|
26
|
+
import { filmGrain } from '@lovo/matter';
|
|
27
|
+
const g = filmGrain(0.08);
|
|
28
|
+
|
|
29
|
+
// After
|
|
30
|
+
import { grain } from '@lovo/matter';
|
|
31
|
+
const g = grain(0.08);
|
|
32
|
+
```
|
|
33
|
+
|
|
3
34
|
## 0.6.0
|
|
4
35
|
|
|
5
36
|
### Minor Changes
|
|
@@ -24,7 +55,7 @@
|
|
|
24
55
|
- `time` → `elapsedTime`
|
|
25
56
|
- `Vec2` → `Vector2`
|
|
26
57
|
|
|
27
|
-
`TSLNode`, `voronoi`, `colorRamp`, `quantize`, `displace`, `cursorRipple`, and `
|
|
58
|
+
`TSLNode`, `voronoi`, `colorRamp`, `quantize`, `displace`, `cursorRipple`, and `grain` are unchanged.
|
|
28
59
|
|
|
29
60
|
**Migration:** one-pass find-and-replace in your imports and call sites. No behavioral changes.
|
|
30
61
|
|
|
@@ -50,21 +81,21 @@
|
|
|
50
81
|
|
|
51
82
|
### Minor Changes
|
|
52
83
|
|
|
53
|
-
- 3856367: Add `
|
|
84
|
+
- 3856367: Add `grain` primitive — hash-based, centered film grain for shader compositions.
|
|
54
85
|
|
|
55
86
|
```ts
|
|
56
|
-
import {
|
|
87
|
+
import { grain, time } from "@lovo/matter";
|
|
57
88
|
import { uv } from "three/tsl";
|
|
58
89
|
|
|
59
90
|
// Static grain:
|
|
60
|
-
const
|
|
91
|
+
const grainValue = grain(uv(), 0.08);
|
|
61
92
|
|
|
62
93
|
// Twinkling grain — caller controls the shutter rate. floor() quantizes
|
|
63
94
|
// time to a discrete cadence; the hash is so sensitive that a continuous
|
|
64
95
|
// time input gives no perceptible speed control.
|
|
65
|
-
const
|
|
96
|
+
const grainValue = grain(uv(), 0.08, time.mul(speed).mul(60).floor());
|
|
66
97
|
|
|
67
|
-
material.colorNode = vec4(color.add(
|
|
98
|
+
material.colorNode = vec4(color.add(grainValue), 1);
|
|
68
99
|
```
|
|
69
100
|
|
|
70
101
|
Output is centered around zero (mean of `length(vec2(u, v))` for uniform
|
package/dist/index.cjs
CHANGED
|
@@ -31,15 +31,16 @@ __export(index_exports, {
|
|
|
31
31
|
displace: () => displace,
|
|
32
32
|
dither: () => dither,
|
|
33
33
|
elapsedTime: () => elapsedTime,
|
|
34
|
-
filmGrain: () => filmGrain,
|
|
35
34
|
fractalNoise: () => fractalNoise,
|
|
36
35
|
getReducedMotionPolicy: () => getReducedMotionPolicy,
|
|
37
36
|
getReducedMotionTimeScale: () => getReducedMotionTimeScale,
|
|
37
|
+
grain: () => grain,
|
|
38
38
|
mixColor: () => mixColor,
|
|
39
39
|
oklabToLinearSrgb: () => oklabToLinearSrgb,
|
|
40
40
|
oklchToLinearSrgb: () => oklchToLinearSrgb,
|
|
41
41
|
parseColorString: () => parseColorString,
|
|
42
42
|
quantize: () => quantize,
|
|
43
|
+
resetRendererClock: () => resetRendererClock,
|
|
43
44
|
setReducedMotionPolicy: () => setReducedMotionPolicy,
|
|
44
45
|
signedDistanceFieldCircle: () => signedDistanceFieldCircle,
|
|
45
46
|
simplexNoise: () => simplexNoise,
|
|
@@ -719,25 +720,55 @@ function cursorRipple(p, center, opts = {}) {
|
|
|
719
720
|
return wave.mul(amplitude).mul(decay);
|
|
720
721
|
}
|
|
721
722
|
|
|
722
|
-
// src/
|
|
723
|
+
// src/runtime/clock/reset-clock.ts
|
|
724
|
+
function getNodeFrame(renderer) {
|
|
725
|
+
const candidate = renderer;
|
|
726
|
+
if (!(typeof candidate === "object" && candidate !== null && "_nodes" in candidate)) {
|
|
727
|
+
return void 0;
|
|
728
|
+
}
|
|
729
|
+
const nodes = candidate._nodes;
|
|
730
|
+
if (!(typeof nodes === "object" && nodes !== null && "nodeFrame" in nodes)) {
|
|
731
|
+
return void 0;
|
|
732
|
+
}
|
|
733
|
+
const frame = nodes.nodeFrame;
|
|
734
|
+
if (typeof frame !== "object" || frame === null) return void 0;
|
|
735
|
+
return frame;
|
|
736
|
+
}
|
|
737
|
+
function resetRendererClock(renderer) {
|
|
738
|
+
const nodeFrame = getNodeFrame(renderer);
|
|
739
|
+
if (!nodeFrame) return;
|
|
740
|
+
nodeFrame.time = 0;
|
|
741
|
+
nodeFrame.deltaTime = 0;
|
|
742
|
+
nodeFrame.lastTime = void 0;
|
|
743
|
+
}
|
|
744
|
+
|
|
745
|
+
// src/primitives/grain/grain.ts
|
|
723
746
|
var import_tsl19 = require("three/tsl");
|
|
724
|
-
function
|
|
747
|
+
function grain(intensity, timeOffset = 0) {
|
|
725
748
|
const pixel = import_tsl19.screenCoordinate.xy.floor();
|
|
726
|
-
const
|
|
749
|
+
const column = pixel.x.toUint();
|
|
750
|
+
const row = pixel.y.toUint();
|
|
751
|
+
const frameHash = (0, import_tsl19.hash)((0, import_tsl19.float)(timeOffset)).mul(16777215).toUint();
|
|
752
|
+
const rowHash = (0, import_tsl19.hash)(row.add(frameHash)).mul(16777215).toUint();
|
|
753
|
+
const seed = column.add(rowHash);
|
|
727
754
|
return (0, import_tsl19.hash)(seed).sub(0.5).mul(intensity);
|
|
728
755
|
}
|
|
729
756
|
|
|
730
757
|
// src/primitives/dither/dither.ts
|
|
731
758
|
var import_tsl20 = require("three/tsl");
|
|
732
|
-
function
|
|
733
|
-
|
|
759
|
+
function bayer2(coord) {
|
|
760
|
+
const cell = (0, import_tsl20.floor)(coord);
|
|
761
|
+
return (0, import_tsl20.fract)(cell.x.mul(0.5).add(cell.y.mul(cell.y).mul(0.75)));
|
|
762
|
+
}
|
|
763
|
+
function bayer4(coord) {
|
|
764
|
+
return bayer2(coord.mul(0.5)).mul(0.25).add(bayer2(coord));
|
|
765
|
+
}
|
|
766
|
+
function bayer8(coord) {
|
|
767
|
+
return bayer4(coord.mul(0.5)).mul(0.25).add(bayer2(coord));
|
|
734
768
|
}
|
|
735
|
-
function dither(color,
|
|
736
|
-
const
|
|
737
|
-
|
|
738
|
-
const secondHash = hash21(pixelCoord.add((0, import_tsl20.vec2)(0.5, 0.5)));
|
|
739
|
-
const triangularNoise = firstHash.sub(secondHash).mul(0.5);
|
|
740
|
-
return (0, import_tsl20.vec3)(color).add(triangularNoise.mul(amount));
|
|
769
|
+
function dither(color, amount = 1 / 255) {
|
|
770
|
+
const threshold = bayer8((0, import_tsl20.vec2)(import_tsl20.screenCoordinate.xy)).sub(0.5);
|
|
771
|
+
return (0, import_tsl20.vec4)((0, import_tsl20.vec3)(color).add(threshold.mul(amount)), (0, import_tsl20.vec4)(color).a);
|
|
741
772
|
}
|
|
742
773
|
|
|
743
774
|
// src/runtime/visibility/visibility.ts
|
|
@@ -818,7 +849,7 @@ var FrameScheduler = class {
|
|
|
818
849
|
// Reference-counted idle voting. The scheduler is idle only when at least
|
|
819
850
|
// one component has voted idle AND no component has voted animated. This
|
|
820
851
|
// prevents a static component (e.g. LinearGradient speed=0) from halting
|
|
821
|
-
// the loop while an animated overlay (e.g.
|
|
852
|
+
// the loop while an animated overlay (e.g. Grain) is still running.
|
|
822
853
|
idleVotes = 0;
|
|
823
854
|
animatedVotes = 0;
|
|
824
855
|
/** True when all participating components prefer idle and none need animation. */
|
|
@@ -953,15 +984,16 @@ var FrameScheduler = class {
|
|
|
953
984
|
displace,
|
|
954
985
|
dither,
|
|
955
986
|
elapsedTime,
|
|
956
|
-
filmGrain,
|
|
957
987
|
fractalNoise,
|
|
958
988
|
getReducedMotionPolicy,
|
|
959
989
|
getReducedMotionTimeScale,
|
|
990
|
+
grain,
|
|
960
991
|
mixColor,
|
|
961
992
|
oklabToLinearSrgb,
|
|
962
993
|
oklchToLinearSrgb,
|
|
963
994
|
parseColorString,
|
|
964
995
|
quantize,
|
|
996
|
+
resetRendererClock,
|
|
965
997
|
setReducedMotionPolicy,
|
|
966
998
|
signedDistanceFieldCircle,
|
|
967
999
|
simplexNoise,
|