partycles 1.1.0 → 1.1.3

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 (150) hide show
  1. package/dist/animations/animations/aurora.d.ts.map +1 -1
  2. package/dist/animations/animations/balloons.d.ts.map +1 -1
  3. package/dist/animations/animations/bubbles.d.ts.map +1 -1
  4. package/dist/animations/animations/coins.d.ts.map +1 -1
  5. package/dist/animations/animations/confetti.d.ts.map +1 -1
  6. package/dist/animations/animations/crystals.d.ts.map +1 -1
  7. package/dist/animations/animations/fireflies.d.ts.map +1 -1
  8. package/dist/animations/animations/fireworks.d.ts.map +1 -1
  9. package/dist/animations/animations/galaxy.d.ts.map +1 -1
  10. package/dist/animations/animations/glitch.d.ts.map +1 -1
  11. package/dist/animations/animations/index.d.ts.map +1 -1
  12. package/dist/animations/animations/leaves.d.ts.map +1 -1
  13. package/dist/animations/animations/magicdust.d.ts.map +1 -1
  14. package/dist/animations/animations/paint.d.ts.map +1 -1
  15. package/dist/animations/animations/petals.d.ts.map +1 -1
  16. package/dist/animations/animations/snow.d.ts.map +1 -1
  17. package/dist/animations/animations/sparkles.d.ts.map +1 -1
  18. package/dist/animations/animations/stars.d.ts.map +1 -1
  19. package/dist/animations/aurora.d.ts.map +1 -1
  20. package/dist/animations/balloons.d.ts.map +1 -1
  21. package/dist/animations/bubbles.d.ts.map +1 -1
  22. package/dist/animations/bubbles.esm.js +10 -3
  23. package/dist/animations/bubbles.esm.js.map +1 -1
  24. package/dist/animations/bubbles.js +10 -3
  25. package/dist/animations/bubbles.js.map +1 -1
  26. package/dist/animations/coins.d.ts.map +1 -1
  27. package/dist/animations/confetti.d.ts.map +1 -1
  28. package/dist/animations/confetti.esm.js +20 -3
  29. package/dist/animations/confetti.esm.js.map +1 -1
  30. package/dist/animations/confetti.js +20 -3
  31. package/dist/animations/confetti.js.map +1 -1
  32. package/dist/animations/crystals.d.ts.map +1 -1
  33. package/dist/animations/emoji.esm.js +3 -3
  34. package/dist/animations/emoji.esm.js.map +1 -1
  35. package/dist/animations/emoji.js +3 -3
  36. package/dist/animations/emoji.js.map +1 -1
  37. package/dist/animations/fireflies.d.ts.map +1 -1
  38. package/dist/animations/fireworks.d.ts.map +1 -1
  39. package/dist/animations/fireworks.esm.js +11 -3
  40. package/dist/animations/fireworks.esm.js.map +1 -1
  41. package/dist/animations/fireworks.js +11 -3
  42. package/dist/animations/fireworks.js.map +1 -1
  43. package/dist/animations/galaxy.d.ts.map +1 -1
  44. package/dist/animations/glitch.d.ts.map +1 -1
  45. package/dist/animations/hearts.esm.js +2 -2
  46. package/dist/animations/hearts.esm.js.map +1 -1
  47. package/dist/animations/hearts.js +2 -2
  48. package/dist/animations/hearts.js.map +1 -1
  49. package/dist/animations/leaves.d.ts.map +1 -1
  50. package/dist/animations/magicdust.d.ts.map +1 -1
  51. package/dist/animations/mobileOptimizations.d.ts.map +1 -1
  52. package/dist/animations/paint.d.ts.map +1 -1
  53. package/dist/animations/petals.d.ts.map +1 -1
  54. package/dist/animations/snow.d.ts.map +1 -1
  55. package/dist/animations/snow.esm.js +4 -2
  56. package/dist/animations/snow.esm.js.map +1 -1
  57. package/dist/animations/snow.js +4 -2
  58. package/dist/animations/snow.js.map +1 -1
  59. package/dist/animations/sparkles.d.ts.map +1 -1
  60. package/dist/animations/sparkles.esm.js +4 -2
  61. package/dist/animations/sparkles.esm.js.map +1 -1
  62. package/dist/animations/sparkles.js +4 -2
  63. package/dist/animations/sparkles.js.map +1 -1
  64. package/dist/animations/stars.d.ts.map +1 -1
  65. package/dist/animations/stars.esm.js +4 -2
  66. package/dist/animations/stars.esm.js.map +1 -1
  67. package/dist/animations/stars.js +4 -2
  68. package/dist/animations/stars.js.map +1 -1
  69. package/dist/animations/useReward.d.ts.map +1 -1
  70. package/dist/animations/utils.d.ts.map +1 -1
  71. package/dist/index.esm.js +174 -56
  72. package/dist/index.esm.js.map +1 -1
  73. package/dist/index.js +174 -56
  74. package/dist/index.js.map +1 -1
  75. package/dist/mobileOptimizations.d.ts.map +1 -1
  76. package/dist/useReward.d.ts.map +1 -1
  77. package/dist/utils.d.ts.map +1 -1
  78. package/package.json +1 -1
  79. package/dist/animations/animations/bees.d.ts +0 -8
  80. package/dist/animations/animations/bees.d.ts.map +0 -1
  81. package/dist/animations/animations/butterflies.d.ts +0 -8
  82. package/dist/animations/animations/butterflies.d.ts.map +0 -1
  83. package/dist/animations/animations/candy.d.ts +0 -8
  84. package/dist/animations/animations/candy.d.ts.map +0 -1
  85. package/dist/animations/animations/champagne.d.ts +0 -8
  86. package/dist/animations/animations/champagne.d.ts.map +0 -1
  87. package/dist/animations/animations/dandelion.d.ts +0 -8
  88. package/dist/animations/animations/dandelion.d.ts.map +0 -1
  89. package/dist/animations/animations/dice.d.ts +0 -8
  90. package/dist/animations/animations/dice.d.ts.map +0 -1
  91. package/dist/animations/animations/donuts.d.ts +0 -8
  92. package/dist/animations/animations/donuts.d.ts.map +0 -1
  93. package/dist/animations/animations/dragons.d.ts +0 -8
  94. package/dist/animations/animations/dragons.d.ts.map +0 -1
  95. package/dist/animations/animations/ghosts.d.ts +0 -8
  96. package/dist/animations/animations/ghosts.d.ts.map +0 -1
  97. package/dist/animations/animations/levelup.d.ts +0 -8
  98. package/dist/animations/animations/levelup.d.ts.map +0 -1
  99. package/dist/animations/animations/lightning.d.ts +0 -8
  100. package/dist/animations/animations/lightning.d.ts.map +0 -1
  101. package/dist/animations/animations/matrix.d.ts +0 -8
  102. package/dist/animations/animations/matrix.d.ts.map +0 -1
  103. package/dist/animations/animations/music.d.ts +0 -8
  104. package/dist/animations/animations/music.d.ts.map +0 -1
  105. package/dist/animations/animations/pixels.d.ts +0 -8
  106. package/dist/animations/animations/pixels.d.ts.map +0 -1
  107. package/dist/animations/animations/pizza.d.ts +0 -8
  108. package/dist/animations/animations/pizza.d.ts.map +0 -1
  109. package/dist/animations/animations/popcorn.d.ts +0 -8
  110. package/dist/animations/animations/popcorn.d.ts.map +0 -1
  111. package/dist/animations/animations/rain.d.ts +0 -8
  112. package/dist/animations/animations/rain.d.ts.map +0 -1
  113. package/dist/animations/animations/runes.d.ts +0 -8
  114. package/dist/animations/animations/runes.d.ts.map +0 -1
  115. package/dist/animations/bees.d.ts +0 -8
  116. package/dist/animations/bees.d.ts.map +0 -1
  117. package/dist/animations/butterflies.d.ts +0 -8
  118. package/dist/animations/butterflies.d.ts.map +0 -1
  119. package/dist/animations/candy.d.ts +0 -8
  120. package/dist/animations/candy.d.ts.map +0 -1
  121. package/dist/animations/champagne.d.ts +0 -8
  122. package/dist/animations/champagne.d.ts.map +0 -1
  123. package/dist/animations/dandelion.d.ts +0 -8
  124. package/dist/animations/dandelion.d.ts.map +0 -1
  125. package/dist/animations/dice.d.ts +0 -8
  126. package/dist/animations/dice.d.ts.map +0 -1
  127. package/dist/animations/donuts.d.ts +0 -8
  128. package/dist/animations/donuts.d.ts.map +0 -1
  129. package/dist/animations/dragons.d.ts +0 -8
  130. package/dist/animations/dragons.d.ts.map +0 -1
  131. package/dist/animations/ghosts.d.ts +0 -8
  132. package/dist/animations/ghosts.d.ts.map +0 -1
  133. package/dist/animations/levelup.d.ts +0 -8
  134. package/dist/animations/levelup.d.ts.map +0 -1
  135. package/dist/animations/lightning.d.ts +0 -8
  136. package/dist/animations/lightning.d.ts.map +0 -1
  137. package/dist/animations/matrix.d.ts +0 -8
  138. package/dist/animations/matrix.d.ts.map +0 -1
  139. package/dist/animations/music.d.ts +0 -8
  140. package/dist/animations/music.d.ts.map +0 -1
  141. package/dist/animations/pixels.d.ts +0 -8
  142. package/dist/animations/pixels.d.ts.map +0 -1
  143. package/dist/animations/pizza.d.ts +0 -8
  144. package/dist/animations/pizza.d.ts.map +0 -1
  145. package/dist/animations/popcorn.d.ts +0 -8
  146. package/dist/animations/popcorn.d.ts.map +0 -1
  147. package/dist/animations/rain.d.ts +0 -8
  148. package/dist/animations/rain.d.ts.map +0 -1
  149. package/dist/animations/runes.d.ts +0 -8
  150. package/dist/animations/runes.d.ts.map +0 -1
package/dist/index.js CHANGED
@@ -13,7 +13,7 @@ const generateId = () => {
13
13
  return Math.random().toString(36).substring(2, 9);
14
14
  };
15
15
  const getRandomColor = (colors) => {
16
- return colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff';
16
+ return (colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff');
17
17
  };
18
18
  const createParticleStyle = (particle, containerRect) => {
19
19
  return {
@@ -28,9 +28,26 @@ const createParticleStyle = (particle, containerRect) => {
28
28
  };
29
29
  };
30
30
 
31
- const defaultColors$3 = ['#f44336', '#e91e63', '#9c27b0', '#673ab7', '#3f51b5', '#2196f3', '#03a9f4', '#00bcd4', '#009688', '#4caf50', '#8bc34a', '#cddc39', '#ffeb3b', '#ffc107', '#ff9800', '#ff5722'];
31
+ const defaultColors$3 = [
32
+ '#f44336',
33
+ '#e91e63',
34
+ '#9c27b0',
35
+ '#673ab7',
36
+ '#3f51b5',
37
+ '#2196f3',
38
+ '#03a9f4',
39
+ '#00bcd4',
40
+ '#009688',
41
+ '#4caf50',
42
+ '#8bc34a',
43
+ '#cddc39',
44
+ '#ffeb3b',
45
+ '#ffc107',
46
+ '#ff9800',
47
+ '#ff5722',
48
+ ];
32
49
  const createConfettiParticles = (origin, config) => {
33
- const { particleCount = 50, startVelocity = 20, colors = defaultColors$3, elementSize = 20 } = config;
50
+ const { particleCount = 50, startVelocity = 20, colors = defaultColors$3, elementSize = 20, } = config;
34
51
  const particles = [];
35
52
  for (let i = 0; i < particleCount; i++) {
36
53
  const angle = randomInRange(0, 360);
@@ -62,7 +79,7 @@ const renderConfettiParticle = (particle) => {
62
79
  };
63
80
 
64
81
  const createSparkleParticles = (origin, config) => {
65
- const { particleCount = 35, spread = 120, startVelocity = 15, elementSize = 25, colors = ['#FFD700', '#FFFFFF'] } = config;
82
+ const { particleCount = 35, spread = 120, startVelocity = 15, elementSize = 25, colors = ['#FFD700', '#FFFFFF'], } = config;
66
83
  const particles = [];
67
84
  for (let i = 0; i < particleCount; i++) {
68
85
  const velocityScale = startVelocity / 45; // Scale based on default
@@ -76,7 +93,9 @@ const createSparkleParticles = (origin, config) => {
76
93
  opacity: 0,
77
94
  size: randomInRange(elementSize * 0.4, elementSize * 1.2),
78
95
  rotation: randomInRange(0, 360),
79
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
96
+ color: colors[Math.floor(Math.random() * colors.length)] ||
97
+ colors[0] ||
98
+ '#ffffff',
80
99
  });
81
100
  }
82
101
  return particles;
@@ -92,7 +111,7 @@ const renderSparkleParticle = (particle) => {
92
111
 
93
112
  const heartColors = ['#ff1744', '#e91e63', '#ff4569', '#ff6b6b', '#ee5a70'];
94
113
  const createHeartParticles = (origin, config) => {
95
- const { particleCount = 25, startVelocity = 12, colors = heartColors, elementSize = 30 } = config;
114
+ const { particleCount = 25, startVelocity = 12, colors = heartColors, elementSize = 30, } = config;
96
115
  const particles = [];
97
116
  for (let i = 0; i < particleCount; i++) {
98
117
  const angle = randomInRange(-45, -135);
@@ -120,9 +139,17 @@ const renderHeartParticle = (particle) => {
120
139
  React.createElement("path", { d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" })));
121
140
  };
122
141
 
123
- const fireworkColors = ['#ff0000', '#00ff00', '#0000ff', '#ffff00', '#ff00ff', '#00ffff', '#ffffff'];
142
+ const fireworkColors = [
143
+ '#ff0000',
144
+ '#00ff00',
145
+ '#0000ff',
146
+ '#ffff00',
147
+ '#ff00ff',
148
+ '#00ffff',
149
+ '#ffffff',
150
+ ];
124
151
  const createFireworkParticles = (origin, config) => {
125
- const { particleCount = 60, startVelocity = 25, colors = fireworkColors, elementSize = 8 } = config;
152
+ const { particleCount = 60, startVelocity = 25, colors = fireworkColors, elementSize = 8, } = config;
126
153
  const particles = [];
127
154
  for (let i = 0; i < particleCount; i++) {
128
155
  const angle = (360 / particleCount) * i + randomInRange(-5, 5);
@@ -159,9 +186,14 @@ const renderFireworkParticle = (particle) => {
159
186
  } }));
160
187
  };
161
188
 
162
- const bubbleColors = ['rgba(66, 165, 245, 0.4)', 'rgba(41, 182, 246, 0.4)', 'rgba(38, 198, 218, 0.4)', 'rgba(129, 212, 250, 0.4)'];
189
+ const bubbleColors = [
190
+ 'rgba(66, 165, 245, 0.4)',
191
+ 'rgba(41, 182, 246, 0.4)',
192
+ 'rgba(38, 198, 218, 0.4)',
193
+ 'rgba(129, 212, 250, 0.4)',
194
+ ];
163
195
  const createBubbleParticles = (origin, config) => {
164
- const { particleCount = 30, spread = 80, startVelocity = 8, colors = bubbleColors, elementSize = 40 } = config;
196
+ const { particleCount = 30, spread = 80, startVelocity = 8, colors = bubbleColors, elementSize = 40, } = config;
165
197
  const particles = [];
166
198
  for (let i = 0; i < particleCount; i++) {
167
199
  particles.push({
@@ -174,7 +206,9 @@ const createBubbleParticles = (origin, config) => {
174
206
  opacity: 0.7,
175
207
  size: randomInRange(elementSize * 0.4, elementSize * 1.2),
176
208
  rotation: 0,
177
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
209
+ color: colors[Math.floor(Math.random() * colors.length)] ||
210
+ colors[0] ||
211
+ '#ffffff',
178
212
  });
179
213
  }
180
214
  return particles;
@@ -196,7 +230,7 @@ const renderBubbleParticle = (particle) => {
196
230
 
197
231
  const starColors = ['#FFD700', '#FFA500', '#FF6347', '#FFE4B5'];
198
232
  const createStarParticles = (origin, config) => {
199
- const { particleCount = 40, startVelocity = 18, colors = starColors, elementSize = 30 } = config;
233
+ const { particleCount = 40, startVelocity = 18, colors = starColors, elementSize = 30, } = config;
200
234
  const particles = [];
201
235
  for (let i = 0; i < particleCount; i++) {
202
236
  const angle = randomInRange(0, 360);
@@ -211,7 +245,9 @@ const createStarParticles = (origin, config) => {
211
245
  opacity: 1,
212
246
  size: randomInRange(elementSize * 0.5, elementSize * 1.3),
213
247
  rotation: randomInRange(0, 360),
214
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
248
+ color: colors[Math.floor(Math.random() * colors.length)] ||
249
+ colors[0] ||
250
+ '#ffffff',
215
251
  });
216
252
  }
217
253
  return particles;
@@ -225,7 +261,7 @@ const renderStarParticle = (particle) => {
225
261
 
226
262
  const snowColors = ['#FFFFFF', '#F0F8FF', '#F5F5F5', '#FAFAFA'];
227
263
  const createSnowParticles = (origin, config) => {
228
- const { particleCount = 50, spread = 200, startVelocity = 3, colors = snowColors, elementSize = 15 } = config;
264
+ const { particleCount = 50, spread = 200, startVelocity = 3, colors = snowColors, elementSize = 15, } = config;
229
265
  const particles = [];
230
266
  for (let i = 0; i < particleCount; i++) {
231
267
  // Spread particles across the width, starting from above viewport
@@ -241,7 +277,9 @@ const createSnowParticles = (origin, config) => {
241
277
  opacity: randomInRange(0.4, 0.9),
242
278
  size: randomInRange(elementSize * 0.3, elementSize),
243
279
  rotation: randomInRange(0, 360),
244
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
280
+ color: colors[Math.floor(Math.random() * colors.length)] ||
281
+ colors[0] ||
282
+ '#ffffff',
245
283
  });
246
284
  }
247
285
  return particles;
@@ -268,7 +306,7 @@ const happyEmojis = ['😊', '😄', '🥰', '😍', '🤗', '😘', '😁', '
268
306
  const natureEmojis = ['🌸', '🌺', '🌻', '🌹', '🌷', '🌼', '🍀', '🌿'];
269
307
  const foodEmojis = ['🍕', '🍔', '🍟', '🌮', '🍿', '🍩', '🍪', '🧁'];
270
308
  const createEmojiParticles = (origin, config) => {
271
- const { particleCount = 30, spread = 100, startVelocity = 15, elementSize = 35, emojis = defaultEmojis } = config;
309
+ const { particleCount = 30, spread = 100, startVelocity = 15, elementSize = 35, emojis = defaultEmojis, } = config;
272
310
  const particles = [];
273
311
  for (let i = 0; i < particleCount; i++) {
274
312
  const angle = randomInRange(-45, -135);
@@ -284,7 +322,7 @@ const createEmojiParticles = (origin, config) => {
284
322
  size: randomInRange(elementSize * 0.7, elementSize * 1.3),
285
323
  rotation: randomInRange(-45, 45),
286
324
  color: '', // Not used for emojis
287
- element: emojis[Math.floor(Math.random() * emojis.length)]
325
+ element: emojis[Math.floor(Math.random() * emojis.length)],
288
326
  });
289
327
  }
290
328
  return particles;
@@ -304,12 +342,12 @@ const emojiPresets = {
304
342
  happy: happyEmojis,
305
343
  nature: natureEmojis,
306
344
  food: foodEmojis,
307
- default: defaultEmojis
345
+ default: defaultEmojis,
308
346
  };
309
347
 
310
348
  const coinColors = ['#FFD700', '#FFA500', '#FFB300', '#FFC700'];
311
349
  const createCoinParticles = (origin, config) => {
312
- const { particleCount = 30, spread = 70, startVelocity = 25, colors = coinColors, elementSize = 25 } = config;
350
+ const { particleCount = 30, spread = 70, startVelocity = 25, colors = coinColors, elementSize = 25, } = config;
313
351
  const particles = [];
314
352
  for (let i = 0; i < particleCount; i++) {
315
353
  const angle = randomInRange(-spread / 2, spread / 2) * (Math.PI / 180);
@@ -324,7 +362,9 @@ const createCoinParticles = (origin, config) => {
324
362
  opacity: 1,
325
363
  size: randomInRange(elementSize * 0.8, elementSize * 1.2),
326
364
  rotation: randomInRange(0, 360),
327
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
365
+ color: colors[Math.floor(Math.random() * colors.length)] ||
366
+ colors[0] ||
367
+ '#ffffff',
328
368
  });
329
369
  }
330
370
  return particles;
@@ -363,7 +403,7 @@ const renderCoinParticle = (particle) => {
363
403
 
364
404
  const petalColors = ['#FFB6C1', '#FFC0CB', '#FF69B4', '#FF1493', '#FFF0F5'];
365
405
  const createPetalParticles = (origin, config) => {
366
- const { particleCount = 40, spread = 100, startVelocity = 8, colors = petalColors, elementSize = 20 } = config;
406
+ const { particleCount = 40, spread = 100, startVelocity = 8, colors = petalColors, elementSize = 20, } = config;
367
407
  const particles = [];
368
408
  for (let i = 0; i < particleCount; i++) {
369
409
  const angle = randomInRange(-spread / 2, spread / 2) * (Math.PI / 180);
@@ -378,7 +418,9 @@ const createPetalParticles = (origin, config) => {
378
418
  opacity: randomInRange(0.7, 1),
379
419
  size: randomInRange(elementSize * 0.7, elementSize * 1.3),
380
420
  rotation: randomInRange(0, 360),
381
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
421
+ color: colors[Math.floor(Math.random() * colors.length)] ||
422
+ colors[0] ||
423
+ '#ffffff',
382
424
  });
383
425
  }
384
426
  return particles;
@@ -419,9 +461,17 @@ const renderPetalParticle = (particle) => {
419
461
  } })));
420
462
  };
421
463
 
422
- const auroraColors = ['#00ff88', '#00ffaa', '#00ddff', '#0099ff', '#0066ff', '#9933ff', '#ff00ff'];
464
+ const auroraColors = [
465
+ '#00ff88',
466
+ '#00ffaa',
467
+ '#00ddff',
468
+ '#0099ff',
469
+ '#0066ff',
470
+ '#9933ff',
471
+ '#ff00ff',
472
+ ];
423
473
  const createAuroraParticles = (origin, config) => {
424
- const { particleCount = 15, spread = 200, startVelocity = 3, colors = auroraColors, elementSize = 100 } = config;
474
+ const { particleCount = 15, spread = 200, startVelocity = 3, colors = auroraColors, elementSize = 100, } = config;
425
475
  const particles = [];
426
476
  for (let i = 0; i < particleCount; i++) {
427
477
  const angle = (i / particleCount) * spread - spread / 2;
@@ -436,7 +486,9 @@ const createAuroraParticles = (origin, config) => {
436
486
  opacity: 0,
437
487
  size: randomInRange(elementSize * 0.8, elementSize * 1.2),
438
488
  rotation: randomInRange(-15, 15),
439
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
489
+ color: colors[Math.floor(Math.random() * colors.length)] ||
490
+ colors[0] ||
491
+ '#ffffff',
440
492
  });
441
493
  }
442
494
  return particles;
@@ -478,7 +530,7 @@ const renderAuroraParticle = (particle) => {
478
530
 
479
531
  const fireflyColors = ['#FFFF99', '#FFFFCC', '#FFFF66', '#FFFFAA'];
480
532
  const createFireflyParticles = (origin, config) => {
481
- const { particleCount = 20, spread = 150, startVelocity = 2, colors = fireflyColors, elementSize = 8 } = config;
533
+ const { particleCount = 20, spread = 150, startVelocity = 2, colors = fireflyColors, elementSize = 8, } = config;
482
534
  const particles = [];
483
535
  for (let i = 0; i < particleCount; i++) {
484
536
  const angle = randomInRange(0, 360) * (Math.PI / 180);
@@ -493,7 +545,9 @@ const createFireflyParticles = (origin, config) => {
493
545
  opacity: 0,
494
546
  size: randomInRange(elementSize * 0.6, elementSize),
495
547
  rotation: randomInRange(0, 360), // Used for blink timing
496
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
548
+ color: colors[Math.floor(Math.random() * colors.length)] ||
549
+ colors[0] ||
550
+ '#ffffff',
497
551
  });
498
552
  }
499
553
  return particles;
@@ -543,9 +597,16 @@ const renderFireflyParticle = (particle) => {
543
597
  } })));
544
598
  };
545
599
 
546
- const paintColors = ['#FF006E', '#FB5607', '#FFBE0B', '#8338EC', '#3A86FF', '#06FFB4'];
600
+ const paintColors = [
601
+ '#FF006E',
602
+ '#FB5607',
603
+ '#FFBE0B',
604
+ '#8338EC',
605
+ '#3A86FF',
606
+ '#06FFB4',
607
+ ];
547
608
  const createPaintParticles = (origin, config) => {
548
- const { particleCount = 25, spread = 120, startVelocity = 35, colors = paintColors, elementSize = 30 } = config;
609
+ const { particleCount = 25, spread = 120, startVelocity = 35, colors = paintColors, elementSize = 30, } = config;
549
610
  const particles = [];
550
611
  for (let i = 0; i < particleCount; i++) {
551
612
  const angle = randomInRange(-spread / 2, spread / 2) * (Math.PI / 180);
@@ -563,7 +624,9 @@ const createPaintParticles = (origin, config) => {
563
624
  ? randomInRange(elementSize * 1.5, elementSize * 2.5)
564
625
  : randomInRange(elementSize * 0.3, elementSize),
565
626
  rotation: randomInRange(0, 360),
566
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
627
+ color: colors[Math.floor(Math.random() * colors.length)] ||
628
+ colors[0] ||
629
+ '#ffffff',
567
630
  });
568
631
  }
569
632
  return particles;
@@ -582,7 +645,7 @@ const renderPaintParticle = (particle) => {
582
645
  transform: `
583
646
  scaleX(${stretch})
584
647
  scaleY(${squish})
585
- rotate(${Math.atan2(particle.vy, particle.vx) * 180 / Math.PI}deg)
648
+ rotate(${(Math.atan2(particle.vy, particle.vx) * 180) / Math.PI}deg)
586
649
  `,
587
650
  } },
588
651
  React.createElement("div", { style: {
@@ -626,9 +689,17 @@ const renderPaintParticle = (particle) => {
626
689
  } }))));
627
690
  };
628
691
 
629
- const balloonColors = ['#FF006E', '#FB5607', '#FFBE0B', '#8338EC', '#3A86FF', '#06FFB4', '#FF4081'];
692
+ const balloonColors = [
693
+ '#FF006E',
694
+ '#FB5607',
695
+ '#FFBE0B',
696
+ '#8338EC',
697
+ '#3A86FF',
698
+ '#06FFB4',
699
+ '#FF4081',
700
+ ];
630
701
  const createBalloonParticles = (origin, config) => {
631
- const { particleCount = 15, spread = 80, startVelocity = 10, colors = balloonColors, elementSize = 35 } = config;
702
+ const { particleCount = 15, spread = 80, startVelocity = 10, colors = balloonColors, elementSize = 35, } = config;
632
703
  const particles = [];
633
704
  for (let i = 0; i < particleCount; i++) {
634
705
  const angle = randomInRange(-spread / 2, spread / 2) * (Math.PI / 180);
@@ -643,7 +714,9 @@ const createBalloonParticles = (origin, config) => {
643
714
  opacity: 0.9,
644
715
  size: randomInRange(elementSize * 0.8, elementSize * 1.2),
645
716
  rotation: randomInRange(-10, 10),
646
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
717
+ color: colors[Math.floor(Math.random() * colors.length)] ||
718
+ colors[0] ||
719
+ '#ffffff',
647
720
  });
648
721
  }
649
722
  return particles;
@@ -709,9 +782,17 @@ const renderBalloonParticle = (particle) => {
709
782
  React.createElement("path", { d: `M1 0 Q ${1 + Math.sin(particle.life * 0.1) * 3} ${particle.size} 1 ${particle.size * 2}`, stroke: particle.color, strokeWidth: "1.5", fill: "none", opacity: "0.4" }))));
710
783
  };
711
784
 
712
- const galaxyColors = ['#FFFFFF', '#FFF9C4', '#BBDEFB', '#C5CAE9', '#D1C4E9', '#FFE082', '#FFCCBC'];
785
+ const galaxyColors = [
786
+ '#FFFFFF',
787
+ '#FFF9C4',
788
+ '#BBDEFB',
789
+ '#C5CAE9',
790
+ '#D1C4E9',
791
+ '#FFE082',
792
+ '#FFCCBC',
793
+ ];
713
794
  const createGalaxyParticles = (origin, config) => {
714
- const { particleCount = 60, spread = 200, startVelocity = 15, colors = galaxyColors, elementSize = 8 } = config;
795
+ const { particleCount = 60, spread = 200, startVelocity = 15, colors = galaxyColors, elementSize = 8, } = config;
715
796
  const particles = [];
716
797
  for (let i = 0; i < particleCount; i++) {
717
798
  // Create spiral distribution
@@ -739,7 +820,9 @@ const createGalaxyParticles = (origin, config) => {
739
820
  opacity: 0,
740
821
  size: randomInRange(elementSize * 0.3, elementSize) * (1 - progress * 0.5), // Smaller at edges
741
822
  rotation: randomInRange(0, 360),
742
- color: colors[Math.floor(Math.random() * colors.length)] || colors[0] || '#ffffff',
823
+ color: colors[Math.floor(Math.random() * colors.length)] ||
824
+ colors[0] ||
825
+ '#ffffff',
743
826
  });
744
827
  }
745
828
  return particles;
@@ -857,8 +940,7 @@ const renderGlitchParticle = (particle) => {
857
940
  g: channel === 'g' ? 255 : 0,
858
941
  b: channel === 'b' ? 255 : 0,
859
942
  };
860
- const mixBlendMode = channel === 'r' ? 'screen' :
861
- channel === 'g' ? 'multiply' : 'difference';
943
+ const mixBlendMode = channel === 'r' ? 'screen' : channel === 'g' ? 'multiply' : 'difference';
862
944
  return (React.createElement("div", { key: particle.id, style: {
863
945
  width: `${width}px`,
864
946
  height: `${height}px`,
@@ -869,9 +951,18 @@ const renderGlitchParticle = (particle) => {
869
951
  } }));
870
952
  };
871
953
 
872
- const defaultColors$2 = ['#9C27B0', '#E91E63', '#FF00FF', '#00FFFF', '#FFD700', '#FF69B4', '#DA70D6', '#9370DB'];
954
+ const defaultColors$2 = [
955
+ '#9C27B0',
956
+ '#E91E63',
957
+ '#FF00FF',
958
+ '#00FFFF',
959
+ '#FFD700',
960
+ '#FF69B4',
961
+ '#DA70D6',
962
+ '#9370DB',
963
+ ];
873
964
  const createMagicDustParticles = (origin, config) => {
874
- const { particleCount = 40, startVelocity = 8, colors = defaultColors$2, elementSize = 12 } = config;
965
+ const { particleCount = 40, startVelocity = 8, colors = defaultColors$2, elementSize = 12, } = config;
875
966
  const particles = [];
876
967
  for (let i = 0; i < particleCount; i++) {
877
968
  // Create particles in a circular pattern with some randomness
@@ -942,9 +1033,18 @@ const renderMagicDustParticle = (particle) => {
942
1033
  } }))));
943
1034
  };
944
1035
 
945
- const defaultColors$1 = ['#FF1493', '#00CED1', '#FFD700', '#FF69B4', '#7B68EE', '#00FA9A', '#FF6347', '#4169E1'];
1036
+ const defaultColors$1 = [
1037
+ '#FF1493',
1038
+ '#00CED1',
1039
+ '#FFD700',
1040
+ '#FF69B4',
1041
+ '#7B68EE',
1042
+ '#00FA9A',
1043
+ '#FF6347',
1044
+ '#4169E1',
1045
+ ];
946
1046
  const createCrystalParticles = (origin, config) => {
947
- const { particleCount = 15, startVelocity = 15, colors = defaultColors$1, elementSize = 25 } = config;
1047
+ const { particleCount = 15, startVelocity = 15, colors = defaultColors$1, elementSize = 25, } = config;
948
1048
  const particles = [];
949
1049
  for (let i = 0; i < particleCount; i++) {
950
1050
  // Crystals explode outward and fall with gravity
@@ -1016,9 +1116,16 @@ const renderCrystalParticle = (particle) => {
1016
1116
  } })));
1017
1117
  };
1018
1118
 
1019
- const defaultColors = ['#D2691E', '#CD853F', '#8B4513', '#A0522D', '#FF8C00', '#FF6347'];
1119
+ const defaultColors = [
1120
+ '#D2691E',
1121
+ '#CD853F',
1122
+ '#8B4513',
1123
+ '#A0522D',
1124
+ '#FF8C00',
1125
+ '#FF6347',
1126
+ ];
1020
1127
  const createLeafParticles = (origin, config) => {
1021
- const { particleCount = 10, colors = defaultColors, elementSize = 25 } = config;
1128
+ const { particleCount = 10, colors = defaultColors, elementSize = 25, } = config;
1022
1129
  const particles = [];
1023
1130
  for (let i = 0; i < particleCount; i++) {
1024
1131
  particles.push({
@@ -1032,9 +1139,9 @@ const createLeafParticles = (origin, config) => {
1032
1139
  size: randomInRange(elementSize * 0.6, elementSize),
1033
1140
  // Encode tumble phase (0-360), sway phase (0-360), and sway amount (20-40) + rotation speed (-3 to 3)
1034
1141
  rotation: Math.floor(randomInRange(0, 360)) +
1035
- (Math.floor(randomInRange(0, 360)) * 1000) +
1036
- (Math.floor(randomInRange(20, 40)) * 1000000) +
1037
- ((Math.floor(randomInRange(-3, 3)) + 3) * 100000000),
1142
+ Math.floor(randomInRange(0, 360)) * 1000 +
1143
+ Math.floor(randomInRange(20, 40)) * 1000000 +
1144
+ (Math.floor(randomInRange(-3, 3)) + 3) * 100000000,
1038
1145
  color: getRandomColor(colors),
1039
1146
  });
1040
1147
  }
@@ -1045,10 +1152,10 @@ const renderLeafParticle = (particle) => {
1045
1152
  const tumblePhase = particle.rotation % 1000;
1046
1153
  const swayPhase = Math.floor((particle.rotation % 1000000) / 1000);
1047
1154
  const swayAmount = Math.floor((particle.rotation % 100000000) / 1000000);
1048
- const rotationSpeed = (Math.floor(particle.rotation / 100000000) - 3);
1155
+ const rotationSpeed = Math.floor(particle.rotation / 100000000) - 3;
1049
1156
  // Calculate tumbling and swaying
1050
- const tumble = Math.sin((Date.now() * 0.002 + tumblePhase) * Math.PI / 180) * 30;
1051
- const swayX = Math.sin((Date.now() * 0.001 + swayPhase) * Math.PI / 180) * swayAmount;
1157
+ const tumble = Math.sin(((Date.now() * 0.002 + tumblePhase) * Math.PI) / 180) * 30;
1158
+ const swayX = Math.sin(((Date.now() * 0.001 + swayPhase) * Math.PI) / 180) * swayAmount;
1052
1159
  const rotation = (Date.now() * rotationSpeed * 0.01 + tumble) % 360;
1053
1160
  return (React.createElement("div", { key: particle.id, style: {
1054
1161
  width: `${particle.size}px`,
@@ -1156,7 +1263,10 @@ const isMobileDevice = () => {
1156
1263
  if (typeof window === 'undefined')
1157
1264
  return false;
1158
1265
  // Check user agent
1159
- const userAgent = navigator.userAgent || navigator.vendor || window.opera;
1266
+ const userAgent = navigator.userAgent ||
1267
+ navigator.vendor ||
1268
+ window.opera ||
1269
+ '';
1160
1270
  const isMobileUA = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent);
1161
1271
  // Check viewport width
1162
1272
  const isMobileWidth = window.innerWidth <= 768;
@@ -1219,7 +1329,9 @@ const useReward = (elementId, animationType, config) => {
1219
1329
  return;
1220
1330
  }
1221
1331
  // Apply mobile performance optimizations
1222
- const optimizedConfig = config ? optimizeConfigForMobile(config) : undefined;
1332
+ const optimizedConfig = config
1333
+ ? optimizeConfigForMobile(config)
1334
+ : undefined;
1223
1335
  // Create particles
1224
1336
  particlesRef.current = animationHandler.createParticles(origin, optimizedConfig || {});
1225
1337
  // Create container
@@ -1238,7 +1350,11 @@ const useReward = (elementId, animationType, config) => {
1238
1350
  rootRef.current = root;
1239
1351
  const containerRect = container.getBoundingClientRect();
1240
1352
  // Default gravity varies by animation type
1241
- const defaultGravity = animationType === 'bubbles' ? -0.1 : animationType === 'snow' ? 0.05 : 0.35;
1353
+ const defaultGravity = animationType === 'bubbles'
1354
+ ? -0.1
1355
+ : animationType === 'snow'
1356
+ ? 0.05
1357
+ : 0.35;
1242
1358
  const gravity = (_b = (_a = config === null || config === void 0 ? void 0 : config.physics) === null || _a === void 0 ? void 0 : _a.gravity) !== null && _b !== void 0 ? _b : defaultGravity;
1243
1359
  const friction = (_d = (_c = config === null || config === void 0 ? void 0 : config.physics) === null || _c === void 0 ? void 0 : _c.friction) !== null && _d !== void 0 ? _d : 0.98;
1244
1360
  const wind = (_f = (_e = config === null || config === void 0 ? void 0 : config.physics) === null || _e === void 0 ? void 0 : _e.wind) !== null && _f !== void 0 ? _f : 0;
@@ -1294,7 +1410,8 @@ const useReward = (elementId, animationType, config) => {
1294
1410
  rootRef.current.unmount();
1295
1411
  rootRef.current = null;
1296
1412
  }
1297
- if (containerRef.current && document.body.contains(containerRef.current)) {
1413
+ if (containerRef.current &&
1414
+ document.body.contains(containerRef.current)) {
1298
1415
  document.body.removeChild(containerRef.current);
1299
1416
  containerRef.current = null;
1300
1417
  }
@@ -1319,7 +1436,8 @@ const useReward = (elementId, animationType, config) => {
1319
1436
  rootRef.current.unmount();
1320
1437
  rootRef.current = null;
1321
1438
  }
1322
- if (containerRef.current && document.body.contains(containerRef.current)) {
1439
+ if (containerRef.current &&
1440
+ document.body.contains(containerRef.current)) {
1323
1441
  document.body.removeChild(containerRef.current);
1324
1442
  containerRef.current = null;
1325
1443
  }