shaders 3.1.462 → 3.1.463

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.
Files changed (58) hide show
  1. package/dist/cli.js +2 -2
  2. package/dist/core/{CursorRipples-DB-pXdOa.js → CursorRipples-CgDYeS56.js} +1 -1
  3. package/dist/core/CursorTrail-CR8Yzb95.js +1687 -0
  4. package/dist/core/{Fog-Df_ScuGu.js → Fog-BZE-8zd_.js} +1 -1
  5. package/dist/core/{InkFlow-Bm5pXn7t.js → InkFlow-C8TiHmkM.js} +1 -1
  6. package/dist/core/{ParticleFlow-D5LhGlwp.js → ParticleFlow-CEWBGUct.js} +1 -1
  7. package/dist/core/{ReactionDiffusion-C7YAM_2K.js → ReactionDiffusion-z37SYWSB.js} +1 -1
  8. package/dist/core/{Smoke-B7-Lg6sy.js → Smoke-CK_dPkpu.js} +1 -1
  9. package/dist/core/{SmokeFill-g6J2PhDW.js → SmokeFill-BSu4o6eH.js} +1 -1
  10. package/dist/core/{SmokeFlow-Cin8S6uq.js → SmokeFlow-wijbufSp.js} +1 -1
  11. package/dist/core/gpu/index.d.ts +6 -0
  12. package/dist/core/gpu/index.d.ts.map +1 -1
  13. package/dist/core/gpu/kit/host/pointer.d.ts +9 -0
  14. package/dist/core/gpu/kit/host/pointer.d.ts.map +1 -1
  15. package/dist/core/index.js +37 -14
  16. package/dist/core/{pointer-DKBz1Qcc.js → pointer-CdyEZBpL.js} +11 -2
  17. package/dist/core/presetRenderer.d.ts.map +1 -1
  18. package/dist/core/registry.js +11 -11
  19. package/dist/core/{shaderRegistry-CpApZw3f.js → shaderRegistry-ByB1HjcV.js} +9 -9
  20. package/dist/core/shaders/CursorRipples/index.js +2 -2
  21. package/dist/core/shaders/CursorTrail/index.d.ts +33 -16
  22. package/dist/core/shaders/CursorTrail/index.d.ts.map +1 -1
  23. package/dist/core/shaders/CursorTrail/index.js +3 -3
  24. package/dist/core/shaders/Fog/index.js +2 -2
  25. package/dist/core/shaders/InkFlow/index.js +2 -2
  26. package/dist/core/shaders/ParticleFlow/index.js +2 -2
  27. package/dist/core/shaders/ReactionDiffusion/index.js +2 -2
  28. package/dist/core/shaders/Smoke/index.js +2 -2
  29. package/dist/core/shaders/SmokeFill/index.js +2 -2
  30. package/dist/core/shaders/SmokeFlow/index.js +2 -2
  31. package/dist/js/bundle.js +149 -149
  32. package/dist/js/createShader.js +1 -1
  33. package/dist/js/utils/generatePresetCode.d.ts.map +1 -1
  34. package/dist/js/utils/generatePresetCode.js +1 -0
  35. package/dist/react/Shader.js +1 -1
  36. package/dist/react/bundle.js +158 -158
  37. package/dist/react/components/CursorTrail.d.ts +4 -2
  38. package/dist/react/components/CursorTrail.d.ts.map +1 -1
  39. package/dist/react/utils/generatePresetCode.d.ts.map +1 -1
  40. package/dist/react/utils/generatePresetCode.js +1 -0
  41. package/dist/registry.js +36 -6
  42. package/dist/solid/components/CursorTrail.d.ts +4 -2
  43. package/dist/solid/components/CursorTrail.d.ts.map +1 -1
  44. package/dist/solid/engine/Shader.js +1 -1
  45. package/dist/solid/utils/generatePresetCode.d.ts.map +1 -1
  46. package/dist/solid/utils/generatePresetCode.js +1 -0
  47. package/dist/svelte/components/CursorTrail.svelte.d.ts +2 -1
  48. package/dist/svelte/index.js +1 -1
  49. package/dist/svelte/source/components/CursorTrail.svelte +1 -0
  50. package/dist/svelte/utils/generatePresetCode.js +1 -0
  51. package/dist/vue/CursorTrail.vue_vue_type_script_setup_true_lang.js +1 -0
  52. package/dist/vue/Shader.vue_vue_type_script_setup_true_lang.js +1 -1
  53. package/dist/vue/components/CursorTrail.vue.d.ts +2 -1
  54. package/dist/vue/components/CursorTrail.vue.d.ts.map +1 -1
  55. package/dist/vue/utils/generatePresetCode.d.ts.map +1 -1
  56. package/dist/vue/utils/generatePresetCode.js +1 -0
  57. package/package.json +1 -1
  58. package/dist/core/CursorTrail-Dk3-1Y0B.js +0 -1224
@@ -1,1224 +0,0 @@
1
- import { At as step, Gt as textureStorage2d, I as colorMixing_exports, Kt as arrayOf, Lt as vec4f, Mt as vec2f, Pt as vec2u, b as vec4, d as ZERO, et as typegpu_default, ft as exp, ln as u32, m as call, qt as struct, rt as select, sn as f32, v as floatE, vt as min } from "./edges-CV-BHMpI.js";
2
- import { M as createGuardedCompute, P as createStateBuffer, R as textureStore } from "./device-DKcu50_C.js";
3
- import { V as colorStopsPropConfig, q as mixColorStopsRuntime } from "./porters-j7yWJYy2.js";
4
- import { a as transformColor, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-u-UZrXjj.js";
5
- import { i as pathStampRibbon, n as createPointerVelocityTracker } from "./pointer-DKBz1Qcc.js";
6
- var GRID_SIZE = 128;
7
- var CELL_COUNT = GRID_SIZE * GRID_SIZE;
8
- var STATE_FORMAT = "rgba16float";
9
- var cm = colorMixing_exports;
10
- var BRUSH_EDGE = Math.exp(-9);
11
- var BRUSH_EDGE_GAIN = 1 / (1 - BRUSH_EDGE);
12
- var decayLayout = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(typegpu_default.bindGroupLayout({
13
- trailBuf: {
14
- storage: arrayOf(vec4f, CELL_COUNT),
15
- access: "mutable"
16
- },
17
- params: { uniform: /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(struct({
18
- fadeRate: f32,
19
- ageRate: f32,
20
- shrink: f32
21
- }), "uniform") }
22
- }), "decayLayout");
23
- var stampLayout = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(typegpu_default.bindGroupLayout({
24
- trailBuf: {
25
- storage: arrayOf(vec4f, CELL_COUNT),
26
- access: "mutable"
27
- },
28
- params: { uniform: /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(struct({
29
- cursorX: f32,
30
- cursorY: f32,
31
- radius: f32,
32
- amount: f32,
33
- aspect: f32
34
- }), "uniform") }
35
- }), "stampLayout");
36
- var outputLayout = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(typegpu_default.bindGroupLayout({
37
- trailBuf: {
38
- storage: arrayOf(vec4f, CELL_COUNT),
39
- access: "readonly"
40
- },
41
- trailTex: { storageTexture: textureStorage2d(STATE_FORMAT, "write-only") }
42
- }), "outputLayout");
43
- const decayKernel = typegpu_default.fn([u32, u32])(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((cx, cy) => {
44
- "use gpu";
45
- const p = decayLayout.$.params;
46
- const idx = __tsover_add(__tsover_mul(cy, u32(GRID_SIZE)), cx);
47
- const cell = decayLayout.$.trailBuf[idx];
48
- const intensity = __tsover_mul(cell.x, p.fadeRate);
49
- const size = __tsover_sub(1, __tsover_mul(__tsover_sub(1, intensity), p.shrink));
50
- const age = min(__tsover_add(cell.z, p.ageRate), 1);
51
- decayLayout.$.trailBuf[idx] = vec4f(intensity, size, age, 0);
52
- }), {
53
- v: 2,
54
- name: void 0,
55
- ast: {
56
- "params": [{
57
- "type": "i",
58
- "name": "cx"
59
- }, {
60
- "type": "i",
61
- "name": "cy"
62
- }],
63
- "body": [0, [
64
- [
65
- 13,
66
- "p",
67
- [
68
- 7,
69
- [
70
- 7,
71
- "decayLayout",
72
- "$"
73
- ],
74
- "params"
75
- ]
76
- ],
77
- [
78
- 13,
79
- "idx",
80
- [
81
- 1,
82
- [
83
- 1,
84
- "cy",
85
- "*",
86
- [
87
- 6,
88
- "d.u32",
89
- ["GRID_SIZE"]
90
- ]
91
- ],
92
- "+",
93
- "cx"
94
- ]
95
- ],
96
- [
97
- 13,
98
- "cell",
99
- [
100
- 8,
101
- [
102
- 7,
103
- [
104
- 7,
105
- "decayLayout",
106
- "$"
107
- ],
108
- "trailBuf"
109
- ],
110
- "idx"
111
- ]
112
- ],
113
- [
114
- 13,
115
- "intensity",
116
- [
117
- 1,
118
- [
119
- 7,
120
- "cell",
121
- "x"
122
- ],
123
- "*",
124
- [
125
- 7,
126
- "p",
127
- "fadeRate"
128
- ]
129
- ]
130
- ],
131
- [
132
- 13,
133
- "size",
134
- [
135
- 1,
136
- [5, "1"],
137
- "-",
138
- [
139
- 1,
140
- [
141
- 1,
142
- [5, "1"],
143
- "-",
144
- "intensity"
145
- ],
146
- "*",
147
- [
148
- 7,
149
- "p",
150
- "shrink"
151
- ]
152
- ]
153
- ]
154
- ],
155
- [
156
- 13,
157
- "age",
158
- [
159
- 6,
160
- "std.min",
161
- [[
162
- 1,
163
- [
164
- 7,
165
- "cell",
166
- "z"
167
- ],
168
- "+",
169
- [
170
- 7,
171
- "p",
172
- "ageRate"
173
- ]
174
- ], [5, "1"]]
175
- ]
176
- ],
177
- [
178
- 2,
179
- [
180
- 8,
181
- [
182
- 7,
183
- [
184
- 7,
185
- "decayLayout",
186
- "$"
187
- ],
188
- "trailBuf"
189
- ],
190
- "idx"
191
- ],
192
- "=",
193
- [
194
- 6,
195
- "d.vec4f",
196
- [
197
- "intensity",
198
- "size",
199
- "age",
200
- [5, "0"]
201
- ]
202
- ]
203
- ]
204
- ]]
205
- },
206
- externals: {
207
- "decayLayout": () => decayLayout,
208
- "d.u32": () => u32,
209
- "GRID_SIZE": () => GRID_SIZE,
210
- "std.min": () => min,
211
- "d.vec4f": () => vec4f
212
- }
213
- }) && $.f)({})).$name("cursorTrailDecay");
214
- const stampKernel = typegpu_default.fn([u32, u32])(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((cx, cy) => {
215
- "use gpu";
216
- const p = stampLayout.$.params;
217
- const cellX = __tsover_div(__tsover_add(f32(cx), .5), f32(GRID_SIZE));
218
- const cellY = __tsover_div(__tsover_add(f32(cy), .5), f32(GRID_SIZE));
219
- const ddx = select(__tsover_sub(cellX, p.cursorX), __tsover_mul(__tsover_sub(cellX, p.cursorX), p.aspect), p.aspect >= 1);
220
- const ddy = select(__tsover_div(__tsover_sub(cellY, p.cursorY), p.aspect), __tsover_sub(cellY, p.cursorY), p.aspect >= 1);
221
- const distSq = __tsover_add(__tsover_mul(ddx, ddx), __tsover_mul(ddy, ddy));
222
- const influenceRadius = __tsover_mul(p.radius, 3);
223
- if (distSq < __tsover_mul(influenceRadius, influenceRadius)) {
224
- const idx = __tsover_add(__tsover_mul(cy, u32(GRID_SIZE)), cx);
225
- const influence = __tsover_mul(__tsover_sub(exp(__tsover_mul(__tsover_div(distSq, __tsover_mul(p.radius, p.radius)), -1)), BRUSH_EDGE), BRUSH_EDGE_GAIN);
226
- const cell = stampLayout.$.trailBuf[idx];
227
- const newIntensity = min(__tsover_add(cell.x, __tsover_mul(influence, p.amount)), 1);
228
- stampLayout.$.trailBuf[idx] = vec4f(newIntensity, 1, 0, 0);
229
- }
230
- }), {
231
- v: 2,
232
- name: void 0,
233
- ast: {
234
- "params": [{
235
- "type": "i",
236
- "name": "cx"
237
- }, {
238
- "type": "i",
239
- "name": "cy"
240
- }],
241
- "body": [0, [
242
- [
243
- 13,
244
- "p",
245
- [
246
- 7,
247
- [
248
- 7,
249
- "stampLayout",
250
- "$"
251
- ],
252
- "params"
253
- ]
254
- ],
255
- [
256
- 13,
257
- "cellX",
258
- [
259
- 1,
260
- [
261
- 1,
262
- [
263
- 6,
264
- "d.f32",
265
- ["cx"]
266
- ],
267
- "+",
268
- [5, "0.5"]
269
- ],
270
- "/",
271
- [
272
- 6,
273
- "d.f32",
274
- ["GRID_SIZE"]
275
- ]
276
- ]
277
- ],
278
- [
279
- 13,
280
- "cellY",
281
- [
282
- 1,
283
- [
284
- 1,
285
- [
286
- 6,
287
- "d.f32",
288
- ["cy"]
289
- ],
290
- "+",
291
- [5, "0.5"]
292
- ],
293
- "/",
294
- [
295
- 6,
296
- "d.f32",
297
- ["GRID_SIZE"]
298
- ]
299
- ]
300
- ],
301
- [
302
- 13,
303
- "ddx",
304
- [
305
- 6,
306
- "std.select",
307
- [
308
- [
309
- 1,
310
- "cellX",
311
- "-",
312
- [
313
- 7,
314
- "p",
315
- "cursorX"
316
- ]
317
- ],
318
- [
319
- 1,
320
- [
321
- 1,
322
- "cellX",
323
- "-",
324
- [
325
- 7,
326
- "p",
327
- "cursorX"
328
- ]
329
- ],
330
- "*",
331
- [
332
- 7,
333
- "p",
334
- "aspect"
335
- ]
336
- ],
337
- [
338
- 1,
339
- [
340
- 7,
341
- "p",
342
- "aspect"
343
- ],
344
- ">=",
345
- [5, "1"]
346
- ]
347
- ]
348
- ]
349
- ],
350
- [
351
- 13,
352
- "ddy",
353
- [
354
- 6,
355
- "std.select",
356
- [
357
- [
358
- 1,
359
- [
360
- 1,
361
- "cellY",
362
- "-",
363
- [
364
- 7,
365
- "p",
366
- "cursorY"
367
- ]
368
- ],
369
- "/",
370
- [
371
- 7,
372
- "p",
373
- "aspect"
374
- ]
375
- ],
376
- [
377
- 1,
378
- "cellY",
379
- "-",
380
- [
381
- 7,
382
- "p",
383
- "cursorY"
384
- ]
385
- ],
386
- [
387
- 1,
388
- [
389
- 7,
390
- "p",
391
- "aspect"
392
- ],
393
- ">=",
394
- [5, "1"]
395
- ]
396
- ]
397
- ]
398
- ],
399
- [
400
- 13,
401
- "distSq",
402
- [
403
- 1,
404
- [
405
- 1,
406
- "ddx",
407
- "*",
408
- "ddx"
409
- ],
410
- "+",
411
- [
412
- 1,
413
- "ddy",
414
- "*",
415
- "ddy"
416
- ]
417
- ]
418
- ],
419
- [
420
- 13,
421
- "influenceRadius",
422
- [
423
- 1,
424
- [
425
- 7,
426
- "p",
427
- "radius"
428
- ],
429
- "*",
430
- [5, "3"]
431
- ]
432
- ],
433
- [
434
- 11,
435
- [
436
- 1,
437
- "distSq",
438
- "<",
439
- [
440
- 1,
441
- "influenceRadius",
442
- "*",
443
- "influenceRadius"
444
- ]
445
- ],
446
- [0, [
447
- [
448
- 13,
449
- "idx",
450
- [
451
- 1,
452
- [
453
- 1,
454
- "cy",
455
- "*",
456
- [
457
- 6,
458
- "d.u32",
459
- ["GRID_SIZE"]
460
- ]
461
- ],
462
- "+",
463
- "cx"
464
- ]
465
- ],
466
- [
467
- 13,
468
- "influence",
469
- [
470
- 1,
471
- [
472
- 1,
473
- [
474
- 6,
475
- "std.exp",
476
- [[
477
- 1,
478
- [
479
- 1,
480
- "distSq",
481
- "/",
482
- [
483
- 1,
484
- [
485
- 7,
486
- "p",
487
- "radius"
488
- ],
489
- "*",
490
- [
491
- 7,
492
- "p",
493
- "radius"
494
- ]
495
- ]
496
- ],
497
- "*",
498
- [
499
- 4,
500
- "-",
501
- [5, "1"]
502
- ]
503
- ]]
504
- ],
505
- "-",
506
- "BRUSH_EDGE"
507
- ],
508
- "*",
509
- "BRUSH_EDGE_GAIN"
510
- ]
511
- ],
512
- [
513
- 13,
514
- "cell",
515
- [
516
- 8,
517
- [
518
- 7,
519
- [
520
- 7,
521
- "stampLayout",
522
- "$"
523
- ],
524
- "trailBuf"
525
- ],
526
- "idx"
527
- ]
528
- ],
529
- [
530
- 13,
531
- "newIntensity",
532
- [
533
- 6,
534
- "std.min",
535
- [[
536
- 1,
537
- [
538
- 7,
539
- "cell",
540
- "x"
541
- ],
542
- "+",
543
- [
544
- 1,
545
- "influence",
546
- "*",
547
- [
548
- 7,
549
- "p",
550
- "amount"
551
- ]
552
- ]
553
- ], [5, "1"]]
554
- ]
555
- ],
556
- [
557
- 2,
558
- [
559
- 8,
560
- [
561
- 7,
562
- [
563
- 7,
564
- "stampLayout",
565
- "$"
566
- ],
567
- "trailBuf"
568
- ],
569
- "idx"
570
- ],
571
- "=",
572
- [
573
- 6,
574
- "d.vec4f",
575
- [
576
- "newIntensity",
577
- [5, "1"],
578
- [5, "0"],
579
- [5, "0"]
580
- ]
581
- ]
582
- ]
583
- ]]
584
- ]
585
- ]]
586
- },
587
- externals: {
588
- "stampLayout": () => stampLayout,
589
- "d.f32": () => f32,
590
- "GRID_SIZE": () => GRID_SIZE,
591
- "std.select": () => select,
592
- "d.u32": () => u32,
593
- "std.exp": () => exp,
594
- "BRUSH_EDGE": () => BRUSH_EDGE,
595
- "BRUSH_EDGE_GAIN": () => BRUSH_EDGE_GAIN,
596
- "std.min": () => min,
597
- "d.vec4f": () => vec4f
598
- }
599
- }) && $.f)({})).$name("cursorTrailStamp");
600
- const outputKernel = typegpu_default.fn([u32, u32])(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((cx, cy) => {
601
- "use gpu";
602
- const idx = __tsover_add(__tsover_mul(cy, u32(GRID_SIZE)), cx);
603
- const cell = outputLayout.$.trailBuf[idx];
604
- textureStore(outputLayout.$.trailTex, vec2u(cx, cy), cell);
605
- }), {
606
- v: 2,
607
- name: void 0,
608
- ast: {
609
- "params": [{
610
- "type": "i",
611
- "name": "cx"
612
- }, {
613
- "type": "i",
614
- "name": "cy"
615
- }],
616
- "body": [0, [
617
- [
618
- 13,
619
- "idx",
620
- [
621
- 1,
622
- [
623
- 1,
624
- "cy",
625
- "*",
626
- [
627
- 6,
628
- "d.u32",
629
- ["GRID_SIZE"]
630
- ]
631
- ],
632
- "+",
633
- "cx"
634
- ]
635
- ],
636
- [
637
- 13,
638
- "cell",
639
- [
640
- 8,
641
- [
642
- 7,
643
- [
644
- 7,
645
- "outputLayout",
646
- "$"
647
- ],
648
- "trailBuf"
649
- ],
650
- "idx"
651
- ]
652
- ],
653
- [
654
- 6,
655
- "std.textureStore",
656
- [
657
- [
658
- 7,
659
- [
660
- 7,
661
- "outputLayout",
662
- "$"
663
- ],
664
- "trailTex"
665
- ],
666
- [
667
- 6,
668
- "d.vec2u",
669
- ["cx", "cy"]
670
- ],
671
- "cell"
672
- ]
673
- ]
674
- ]]
675
- },
676
- externals: {
677
- "d.u32": () => u32,
678
- "GRID_SIZE": () => GRID_SIZE,
679
- "outputLayout": () => outputLayout,
680
- "std.textureStore": () => textureStore,
681
- "d.vec2u": () => vec2u
682
- }
683
- }) && $.f)({})).$name("cursorTrailOutput");
684
- const cursorTrailTapUV = typegpu_default.fn([
685
- vec2f,
686
- f32,
687
- f32
688
- ], vec2f)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((uv, ox, oy) => {
689
- "use gpu";
690
- return vec2f(__tsover_add(uv.x, ox), __tsover_add(uv.y, oy));
691
- }), {
692
- v: 2,
693
- name: void 0,
694
- ast: {
695
- "params": [
696
- {
697
- "type": "i",
698
- "name": "uv"
699
- },
700
- {
701
- "type": "i",
702
- "name": "ox"
703
- },
704
- {
705
- "type": "i",
706
- "name": "oy"
707
- }
708
- ],
709
- "body": [0, [[10, [
710
- 6,
711
- "d.vec2f",
712
- [[
713
- 1,
714
- [
715
- 7,
716
- "uv",
717
- "x"
718
- ],
719
- "+",
720
- "ox"
721
- ], [
722
- 1,
723
- [
724
- 7,
725
- "uv",
726
- "y"
727
- ],
728
- "+",
729
- "oy"
730
- ]]
731
- ]]]]
732
- },
733
- externals: { "d.vec2f": () => vec2f }
734
- }) && $.f)({}));
735
- var TrailField = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(struct({
736
- age: f32,
737
- mask: f32
738
- }), "TrailField");
739
- const cursorTrailField = typegpu_default.fn([
740
- vec4f,
741
- vec4f,
742
- vec4f,
743
- vec4f,
744
- vec4f
745
- ], TrailField)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((c, s1, s2, s3, s4) => {
746
- "use gpu";
747
- const intensity = __tsover_add(__tsover_add(__tsover_add(__tsover_add(__tsover_mul(c.x, .5), __tsover_mul(s1.x, .125)), __tsover_mul(s2.x, .125)), __tsover_mul(s3.x, .125)), __tsover_mul(s4.x, .125));
748
- return TrailField({
749
- age: __tsover_add(__tsover_add(__tsover_add(__tsover_add(__tsover_mul(c.z, .5), __tsover_mul(s1.z, .125)), __tsover_mul(s2.z, .125)), __tsover_mul(s3.z, .125)), __tsover_mul(s4.z, .125)),
750
- mask: step(.01, intensity)
751
- });
752
- }), {
753
- v: 2,
754
- name: void 0,
755
- ast: {
756
- "params": [
757
- {
758
- "type": "i",
759
- "name": "c"
760
- },
761
- {
762
- "type": "i",
763
- "name": "s1"
764
- },
765
- {
766
- "type": "i",
767
- "name": "s2"
768
- },
769
- {
770
- "type": "i",
771
- "name": "s3"
772
- },
773
- {
774
- "type": "i",
775
- "name": "s4"
776
- }
777
- ],
778
- "body": [0, [
779
- [
780
- 13,
781
- "intensity",
782
- [
783
- 1,
784
- [
785
- 1,
786
- [
787
- 1,
788
- [
789
- 1,
790
- [
791
- 1,
792
- [
793
- 7,
794
- "c",
795
- "x"
796
- ],
797
- "*",
798
- [5, "0.5"]
799
- ],
800
- "+",
801
- [
802
- 1,
803
- [
804
- 7,
805
- "s1",
806
- "x"
807
- ],
808
- "*",
809
- [5, "0.125"]
810
- ]
811
- ],
812
- "+",
813
- [
814
- 1,
815
- [
816
- 7,
817
- "s2",
818
- "x"
819
- ],
820
- "*",
821
- [5, "0.125"]
822
- ]
823
- ],
824
- "+",
825
- [
826
- 1,
827
- [
828
- 7,
829
- "s3",
830
- "x"
831
- ],
832
- "*",
833
- [5, "0.125"]
834
- ]
835
- ],
836
- "+",
837
- [
838
- 1,
839
- [
840
- 7,
841
- "s4",
842
- "x"
843
- ],
844
- "*",
845
- [5, "0.125"]
846
- ]
847
- ]
848
- ],
849
- [
850
- 13,
851
- "age",
852
- [
853
- 1,
854
- [
855
- 1,
856
- [
857
- 1,
858
- [
859
- 1,
860
- [
861
- 1,
862
- [
863
- 7,
864
- "c",
865
- "z"
866
- ],
867
- "*",
868
- [5, "0.5"]
869
- ],
870
- "+",
871
- [
872
- 1,
873
- [
874
- 7,
875
- "s1",
876
- "z"
877
- ],
878
- "*",
879
- [5, "0.125"]
880
- ]
881
- ],
882
- "+",
883
- [
884
- 1,
885
- [
886
- 7,
887
- "s2",
888
- "z"
889
- ],
890
- "*",
891
- [5, "0.125"]
892
- ]
893
- ],
894
- "+",
895
- [
896
- 1,
897
- [
898
- 7,
899
- "s3",
900
- "z"
901
- ],
902
- "*",
903
- [5, "0.125"]
904
- ]
905
- ],
906
- "+",
907
- [
908
- 1,
909
- [
910
- 7,
911
- "s4",
912
- "z"
913
- ],
914
- "*",
915
- [5, "0.125"]
916
- ]
917
- ]
918
- ],
919
- [
920
- 13,
921
- "mask",
922
- [
923
- 6,
924
- "std.step",
925
- [[5, "0.01"], "intensity"]
926
- ]
927
- ],
928
- [10, [
929
- 6,
930
- "TrailField",
931
- [[104, {
932
- "age": "age",
933
- "mask": "mask"
934
- }]]
935
- ]]
936
- ]]
937
- },
938
- externals: {
939
- "std.step": () => step,
940
- "TrailField": () => TrailField
941
- }
942
- }) && $.f)({}));
943
- const componentDefinition = {
944
- name: "CursorTrail",
945
- boundingBoxDeclaration: { aspectRatio: null },
946
- category: "Interactive",
947
- description: "Animated trail effect that tracks cursor movement",
948
- usesPointer: true,
949
- props: {
950
- colorA: {
951
- default: "#00aaff",
952
- transform: transformColor,
953
- description: "Color of fresh trails",
954
- ui: {
955
- type: "color",
956
- label: "Start Color",
957
- group: "Colors"
958
- }
959
- },
960
- colorB: {
961
- default: "#ff00aa",
962
- transform: transformColor,
963
- description: "Color trails transition to as they fade",
964
- ui: {
965
- type: "color",
966
- label: "End Color",
967
- group: "Colors"
968
- }
969
- },
970
- stops: colorStopsPropConfig(),
971
- radius: {
972
- default: .5,
973
- description: "Base radius of trail circles",
974
- ui: {
975
- type: "range",
976
- min: .5,
977
- max: 2,
978
- step: .1,
979
- label: "Radius",
980
- group: "Effect"
981
- }
982
- },
983
- length: {
984
- default: .5,
985
- description: "How long trail circles persist (in seconds)",
986
- ui: {
987
- type: "range",
988
- min: .1,
989
- max: 2,
990
- step: .1,
991
- label: "Trail Length",
992
- group: "Animation"
993
- }
994
- },
995
- shrink: {
996
- default: 1,
997
- description: "How much circles shrink as they fade out (0 = no shrink, 1 = full shrink)",
998
- ui: {
999
- type: "range",
1000
- min: 0,
1001
- max: 1,
1002
- step: .1,
1003
- label: "Shrink Amount",
1004
- group: "Effect"
1005
- }
1006
- },
1007
- colorSpace: {
1008
- default: "linear",
1009
- transform: transformColorSpace,
1010
- compileTime: true,
1011
- description: "Color space for color interpolation",
1012
- ui: {
1013
- type: "select",
1014
- options: colorSpaceOptions,
1015
- label: "Color Space",
1016
- group: "Colors"
1017
- }
1018
- }
1019
- },
1020
- compute: (params) => {
1021
- const { gpu, registerComputeTexture, getCpuValue, onCleanup, onResize, dimensions } = params;
1022
- const root = gpu?.root;
1023
- if (!root) return null;
1024
- const trailBuf = createStateBuffer(root, vec4f, CELL_COUNT);
1025
- const trailTex = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(root.createTexture({
1026
- size: [GRID_SIZE, GRID_SIZE],
1027
- format: STATE_FORMAT
1028
- }).$usage("storage", "sampled"), "trailTex");
1029
- onCleanup(() => trailTex.destroy());
1030
- const trailTexture = registerComputeTexture(trailTex);
1031
- const decayParams = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(root.createUniform(struct({
1032
- fadeRate: f32,
1033
- ageRate: f32,
1034
- shrink: f32
1035
- })), "decayParams");
1036
- const stampParams = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(root.createUniform(struct({
1037
- cursorX: f32,
1038
- cursorY: f32,
1039
- radius: f32,
1040
- amount: f32,
1041
- aspect: f32
1042
- })), "stampParams");
1043
- let curW = Math.max(1, Math.round(dimensions.width));
1044
- let curH = Math.max(1, Math.round(dimensions.height));
1045
- onResize(({ width, height }) => {
1046
- curW = Math.max(1, Math.round(width));
1047
- curH = Math.max(1, Math.round(height));
1048
- });
1049
- const size = [GRID_SIZE, GRID_SIZE];
1050
- const decayBg = root.createBindGroup(decayLayout, {
1051
- trailBuf,
1052
- params: decayParams.buffer
1053
- });
1054
- const stampBg = root.createBindGroup(stampLayout, {
1055
- trailBuf,
1056
- params: stampParams.buffer
1057
- });
1058
- const outputBg = root.createBindGroup(outputLayout, {
1059
- trailBuf,
1060
- trailTex
1061
- });
1062
- const decay = createGuardedCompute(root, /* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((cx, cy) => {
1063
- "use gpu";
1064
- decayKernel(cx, cy);
1065
- }), {
1066
- v: 2,
1067
- name: void 0,
1068
- ast: {
1069
- "params": [{
1070
- "type": "i",
1071
- "name": "cx"
1072
- }, {
1073
- "type": "i",
1074
- "name": "cy"
1075
- }],
1076
- "body": [0, [[
1077
- 6,
1078
- "decayKernel",
1079
- ["cx", "cy"]
1080
- ]]]
1081
- },
1082
- externals: { "decayKernel": () => decayKernel }
1083
- }) && $.f)({}), {
1084
- size,
1085
- bindGroup: decayBg
1086
- });
1087
- const stamp = createGuardedCompute(root, /* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((cx, cy) => {
1088
- "use gpu";
1089
- stampKernel(cx, cy);
1090
- }), {
1091
- v: 2,
1092
- name: void 0,
1093
- ast: {
1094
- "params": [{
1095
- "type": "i",
1096
- "name": "cx"
1097
- }, {
1098
- "type": "i",
1099
- "name": "cy"
1100
- }],
1101
- "body": [0, [[
1102
- 6,
1103
- "stampKernel",
1104
- ["cx", "cy"]
1105
- ]]]
1106
- },
1107
- externals: { "stampKernel": () => stampKernel }
1108
- }) && $.f)({}), {
1109
- size,
1110
- bindGroup: stampBg
1111
- });
1112
- const output = createGuardedCompute(root, /* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((cx, cy) => {
1113
- "use gpu";
1114
- outputKernel(cx, cy);
1115
- }), {
1116
- v: 2,
1117
- name: void 0,
1118
- ast: {
1119
- "params": [{
1120
- "type": "i",
1121
- "name": "cx"
1122
- }, {
1123
- "type": "i",
1124
- "name": "cy"
1125
- }],
1126
- "body": [0, [[
1127
- 6,
1128
- "outputKernel",
1129
- ["cx", "cy"]
1130
- ]]]
1131
- },
1132
- externals: { "outputKernel": () => outputKernel }
1133
- }) && $.f)({}), {
1134
- size,
1135
- bindGroup: outputBg
1136
- });
1137
- const pointer = createPointerVelocityTracker({
1138
- minDrag: .001,
1139
- teleportGuard: Number.POSITIVE_INFINITY
1140
- });
1141
- let lastActiveTime = Date.now();
1142
- return {
1143
- outputs: { trailTexture },
1144
- getComputeNodes: (frameParams) => {
1145
- const fp = frameParams;
1146
- const currentTime = Date.now();
1147
- const dt = Math.min(fp.deltaTime ?? 0, .016);
1148
- const aspect = Math.max(1, fp.dimensions?.width ?? curW) / Math.max(1, fp.dimensions?.height ?? curH);
1149
- const radius = (getCpuValue("radius") ?? .5) * .1;
1150
- const length = getCpuValue("length") ?? .5;
1151
- const shrink = getCpuValue("shrink") ?? 1;
1152
- const move = pointer.update(fp.pointer, dt);
1153
- const speed = Math.sqrt(move.dx * move.dx + move.dy * move.dy);
1154
- if (speed > .001) lastActiveTime = currentTime;
1155
- const settleMs = Math.min(3e4, Math.max(3e3, length * 5e3));
1156
- if (currentTime - lastActiveTime > settleMs) return null;
1157
- decayParams.write({
1158
- fadeRate: 1 - dt / Math.max(.1, length),
1159
- ageRate: dt / Math.max(.1, length),
1160
- shrink
1161
- });
1162
- const nodes = [decay];
1163
- if (speed > .001) {
1164
- let amountPerStep = 0;
1165
- amountPerStep = speed / pathStampRibbon(nodes, {
1166
- fromX: move.prevX,
1167
- fromY: move.prevY,
1168
- dx: move.dx,
1169
- dy: move.dy,
1170
- dragDist: speed,
1171
- stepSize: Math.max(.005, radius * .5),
1172
- maxSteps: 20,
1173
- write: (cursorX, cursorY) => stampParams.write({
1174
- cursorX,
1175
- cursorY,
1176
- radius,
1177
- amount: amountPerStep,
1178
- aspect
1179
- }),
1180
- pass: stamp
1181
- }) * 50 * dt;
1182
- }
1183
- nodes.push(output);
1184
- return nodes;
1185
- }
1186
- };
1187
- },
1188
- fragment: ({ ctx, computeOutputs, propValues, uniforms }) => {
1189
- const trailTex = computeOutputs?.trailTexture;
1190
- if (!trailTex) return ZERO;
1191
- const px = 1 / GRID_SIZE;
1192
- const tap = (ox, oy) => trailTex.sample(call(cursorTrailTapUV, "cursorTrailTapUV", [
1193
- ctx.uv,
1194
- floatE(ox),
1195
- floatE(oy)
1196
- ]), "linearClamp");
1197
- const field = call(cursorTrailField, "cursorTrailField", [
1198
- trailTex.sample(ctx.uv, "linearClamp"),
1199
- tap(px, 0),
1200
- tap(0, px),
1201
- tap(-px, 0),
1202
- tap(0, -px)
1203
- ]);
1204
- const trailAge = field.member("age");
1205
- const circleMask = field.member("mask");
1206
- const colorSpaceMode = propValues.colorSpace ?? 0;
1207
- const stopCount = propValues.stopCount ?? 0;
1208
- let trailColor;
1209
- if (stopCount > 1) trailColor = mixColorStopsRuntime(trailAge, {
1210
- colorsArray: uniforms.colorsArray,
1211
- positionsArray: uniforms.positionsArray,
1212
- convertedColorsArray: uniforms.convertedColorsArray,
1213
- stopCount: uniforms.stopCount
1214
- }, colorSpaceMode);
1215
- else trailColor = call(cm.mixColorsVariants[colorSpaceMode] ?? cm.mixColorsLinear, "mixColors", [
1216
- uniforms.colorA,
1217
- uniforms.colorB,
1218
- trailAge
1219
- ]);
1220
- return vec4(trailColor.member("rgb"), trailColor.member("a").mul(circleMask));
1221
- }
1222
- };
1223
- var CursorTrail_default = componentDefinition;
1224
- export { decayKernel as a, cursorTrailTapUV as i, componentDefinition as n, outputKernel as o, cursorTrailField as r, stampKernel as s, CursorTrail_default as t };