@nice2dev/icons 1.3.16 → 1.3.17

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 (47) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/README.md +1 -1
  3. package/dist/cjs/animationSpeed.js +69 -0
  4. package/dist/cjs/createIcon.js +45 -21
  5. package/dist/cjs/iconStyles.js +1137 -1081
  6. package/dist/cjs/icons/actions.js +2 -2
  7. package/dist/cjs/icons/brand.js +4 -747
  8. package/dist/cjs/icons/business.js +59 -23
  9. package/dist/cjs/icons/files.js +54 -54
  10. package/dist/cjs/icons/food.js +75 -557
  11. package/dist/cjs/icons/fun.js +51 -33
  12. package/dist/cjs/icons/index.js +0 -7
  13. package/dist/cjs/icons/navigation.js +26 -7
  14. package/dist/cjs/icons/omniverk.js +17 -244
  15. package/dist/cjs/icons/science.js +63 -170
  16. package/dist/cjs/icons/sports.js +45 -137
  17. package/dist/cjs/index.js +0 -7
  18. package/dist/cjs/nicetodev-icons.css +1 -1
  19. package/dist/cjs/smilAnimations.js +11 -2
  20. package/dist/esm/animationSpeed.js +69 -0
  21. package/dist/esm/createIcon.js +45 -21
  22. package/dist/esm/iconStyles.js +1137 -1081
  23. package/dist/esm/icons/actions.js +2 -2
  24. package/dist/esm/icons/brand.js +5 -748
  25. package/dist/esm/icons/business.js +59 -23
  26. package/dist/esm/icons/files.js +54 -54
  27. package/dist/esm/icons/food.js +74 -556
  28. package/dist/esm/icons/fun.js +51 -33
  29. package/dist/esm/icons/index.js +3 -10
  30. package/dist/esm/icons/navigation.js +26 -7
  31. package/dist/esm/icons/omniverk.js +17 -244
  32. package/dist/esm/icons/science.js +63 -170
  33. package/dist/esm/icons/sports.js +45 -137
  34. package/dist/esm/index.js +3 -10
  35. package/dist/esm/nicetodev-icons.css +1 -1
  36. package/dist/esm/smilAnimations.js +11 -2
  37. package/dist/types/animationSpeed.d.ts +19 -0
  38. package/dist/types/createIcon.d.ts +6 -0
  39. package/dist/types/iconStyles.d.ts +6 -1
  40. package/dist/types/icons/brand.d.ts +0 -4
  41. package/dist/types/icons/food.d.ts +0 -3
  42. package/dist/types/icons/index.d.ts +3 -3
  43. package/dist/types/icons/omniverk.d.ts +0 -3
  44. package/dist/types/icons/science.d.ts +1 -1
  45. package/dist/types/smilAnimations.d.ts +4 -2
  46. package/dist/types/types.d.ts +7 -0
  47. package/package.json +2 -2
package/dist/cjs/iconStyles.js CHANGED
@@ -2,6 +2,7 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const jsxRuntime = require("react/jsx-runtime");
4
4
  const React = require("react");
5
+ const animationSpeed = require("./animationSpeed.js");
5
6
  const wrapperBase = {
6
7
  position: "relative",
7
8
  display: "inline-flex",
@@ -18,7 +19,8 @@ const NtdIconFloral = /* @__PURE__ */ Object.assign(
18
19
  ({
19
20
  children,
20
21
  animate = true,
21
- duration = 2,
22
+ duration: durationProp,
23
+ animationSpeed: animationSpeed$1,
22
24
  intensity = "normal",
23
25
  vineColor = "#22c55e",
24
26
  petalColor = "#f472b6",
@@ -26,6 +28,7 @@ const NtdIconFloral = /* @__PURE__ */ Object.assign(
26
28
  className,
27
29
  style
28
30
  }, ref) => {
31
+ const duration = durationProp ?? 2;
29
32
  const lc = leafColor ?? vineColor;
30
33
  const dur = `${duration}s`;
31
34
  const halfDur = `${duration * 0.5}s`;
@@ -66,137 +69,140 @@ const NtdIconFloral = /* @__PURE__ */ Object.assign(
66
69
  ] : []
67
70
  ];
68
71
  const dashLen = 250;
69
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
70
- children,
71
- /* @__PURE__ */ jsxRuntime.jsxs(
72
- "svg",
73
- {
74
- viewBox: "0 0 100 100",
75
- style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%" },
76
- "aria-hidden": true,
77
- children: [
78
- [vine1, vine2, ...showExtra ? [vine3, vine4] : []].map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
79
- "path",
80
- {
81
- d,
82
- fill: "none",
83
- stroke: vineColor,
84
- strokeWidth: i < 2 ? 1.5 : 1,
85
- strokeLinecap: "round",
86
- opacity: i < 2 ? 0.85 : 0.55,
87
- ...animate ? { strokeDasharray: dashLen, strokeDashoffset: dashLen } : {},
88
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
89
- "animate",
90
- {
91
- attributeName: "stroke-dashoffset",
92
- from: `${dashLen}`,
93
- to: "0",
94
- dur,
95
- fill: "freeze",
96
- begin: i < 2 ? "0s" : `${duration * 0.3}s`
97
- }
98
- )
99
- },
100
- `v${i}`
101
- )),
102
- allLeaves.map((l, i) => /* @__PURE__ */ jsxRuntime.jsx("g", { transform: `translate(${l.x},${l.y}) rotate(${l.a})`, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { opacity: animate ? 0 : 0.8, children: [
103
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: leafD, fill: lc }),
104
- /* @__PURE__ */ jsxRuntime.jsx(
105
- "line",
106
- {
107
- x1: 0,
108
- y1: -3,
109
- x2: 0,
110
- y2: 2.5,
111
- stroke: lc,
112
- strokeWidth: "0.4",
113
- opacity: 0.4
114
- }
115
- ),
116
- animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
117
- /* @__PURE__ */ jsxRuntime.jsx(
118
- "animate",
119
- {
120
- attributeName: "opacity",
121
- from: "0",
122
- to: "0.8",
123
- dur: halfDur,
124
- begin: bloomAt,
125
- fill: "freeze"
126
- }
127
- ),
128
- /* @__PURE__ */ jsxRuntime.jsx(
129
- "animateTransform",
130
- {
131
- attributeName: "transform",
132
- type: "scale",
133
- values: "0 0;1 1",
134
- keyTimes: "0;1",
135
- keySplines: "0.34 1 0.64 1",
136
- calcMode: "spline",
137
- dur: halfDur,
138
- begin: bloomAt,
139
- fill: "freeze"
140
- }
141
- )
142
- ] })
143
- ] }) }, `l${i}`)),
144
- flowerPositions.map((f, fi) => /* @__PURE__ */ jsxRuntime.jsxs("g", { opacity: animate ? 0 : 1, children: [
145
- petalOffsets.map(([ox, oy], pi) => /* @__PURE__ */ jsxRuntime.jsx(
146
- "circle",
72
+ return animationSpeed.retimeTree(
73
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
74
+ children,
75
+ /* @__PURE__ */ jsxRuntime.jsxs(
76
+ "svg",
77
+ {
78
+ viewBox: "0 0 100 100",
79
+ style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%" },
80
+ "aria-hidden": true,
81
+ children: [
82
+ [vine1, vine2, ...showExtra ? [vine3, vine4] : []].map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
83
+ "path",
147
84
  {
148
- cx: f.x + ox * f.r,
149
- cy: f.y + oy * f.r,
150
- r: f.r * 0.5,
151
- fill: petalColor,
152
- opacity: 0.85
85
+ d,
86
+ fill: "none",
87
+ stroke: vineColor,
88
+ strokeWidth: i < 2 ? 1.5 : 1,
89
+ strokeLinecap: "round",
90
+ opacity: i < 2 ? 0.85 : 0.55,
91
+ ...animate ? { strokeDasharray: dashLen, strokeDashoffset: dashLen } : {},
92
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
93
+ "animate",
94
+ {
95
+ attributeName: "stroke-dashoffset",
96
+ from: `${dashLen}`,
97
+ to: "0",
98
+ dur,
99
+ fill: "freeze",
100
+ begin: i < 2 ? "0s" : `${duration * 0.3}s`
101
+ }
102
+ )
153
103
  },
154
- pi
104
+ `v${i}`
155
105
  )),
156
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: f.x, cy: f.y, r: f.r * 0.3, fill: "#fde047" }),
157
- animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
106
+ allLeaves.map((l, i) => /* @__PURE__ */ jsxRuntime.jsx("g", { transform: `translate(${l.x},${l.y}) rotate(${l.a})`, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { opacity: animate ? 0 : 0.8, children: [
107
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: leafD, fill: lc }),
158
108
  /* @__PURE__ */ jsxRuntime.jsx(
159
- "animate",
109
+ "line",
160
110
  {
161
- attributeName: "opacity",
162
- from: "0",
163
- to: "1",
164
- dur: halfDur,
165
- begin: flowerAt,
166
- fill: "freeze"
111
+ x1: 0,
112
+ y1: -3,
113
+ x2: 0,
114
+ y2: 2.5,
115
+ stroke: lc,
116
+ strokeWidth: "0.4",
117
+ opacity: 0.4
167
118
  }
168
119
  ),
169
- /* @__PURE__ */ jsxRuntime.jsx(
170
- "animateTransform",
120
+ animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
121
+ /* @__PURE__ */ jsxRuntime.jsx(
122
+ "animate",
123
+ {
124
+ attributeName: "opacity",
125
+ from: "0",
126
+ to: "0.8",
127
+ dur: halfDur,
128
+ begin: bloomAt,
129
+ fill: "freeze"
130
+ }
131
+ ),
132
+ /* @__PURE__ */ jsxRuntime.jsx(
133
+ "animateTransform",
134
+ {
135
+ attributeName: "transform",
136
+ type: "scale",
137
+ values: "0 0;1 1",
138
+ keyTimes: "0;1",
139
+ keySplines: "0.34 1 0.64 1",
140
+ calcMode: "spline",
141
+ dur: halfDur,
142
+ begin: bloomAt,
143
+ fill: "freeze"
144
+ }
145
+ )
146
+ ] })
147
+ ] }) }, `l${i}`)),
148
+ flowerPositions.map((f, fi) => /* @__PURE__ */ jsxRuntime.jsxs("g", { opacity: animate ? 0 : 1, children: [
149
+ petalOffsets.map(([ox, oy], pi) => /* @__PURE__ */ jsxRuntime.jsx(
150
+ "circle",
171
151
  {
172
- attributeName: "transform",
173
- type: "scale",
174
- values: "0.3 0.3;1 1",
175
- keyTimes: "0;1",
176
- keySplines: "0.34 1 0.64 1",
177
- calcMode: "spline",
178
- dur: halfDur,
179
- begin: flowerAt,
180
- fill: "freeze"
181
- }
182
- )
183
- ] })
184
- ] }, `f${fi}`)),
185
- animate && /* @__PURE__ */ jsxRuntime.jsx(
186
- "animateTransform",
187
- {
188
- attributeName: "transform",
189
- type: "rotate",
190
- values: "0 50 50;1 50 50;-1 50 50;0 50 50",
191
- dur: "4s",
192
- repeatCount: "indefinite",
193
- begin: `${duration}s`
194
- }
195
- )
196
- ]
197
- }
198
- )
199
- ] });
152
+ cx: f.x + ox * f.r,
153
+ cy: f.y + oy * f.r,
154
+ r: f.r * 0.5,
155
+ fill: petalColor,
156
+ opacity: 0.85
157
+ },
158
+ pi
159
+ )),
160
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: f.x, cy: f.y, r: f.r * 0.3, fill: "#fde047" }),
161
+ animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
162
+ /* @__PURE__ */ jsxRuntime.jsx(
163
+ "animate",
164
+ {
165
+ attributeName: "opacity",
166
+ from: "0",
167
+ to: "1",
168
+ dur: halfDur,
169
+ begin: flowerAt,
170
+ fill: "freeze"
171
+ }
172
+ ),
173
+ /* @__PURE__ */ jsxRuntime.jsx(
174
+ "animateTransform",
175
+ {
176
+ attributeName: "transform",
177
+ type: "scale",
178
+ values: "0.3 0.3;1 1",
179
+ keyTimes: "0;1",
180
+ keySplines: "0.34 1 0.64 1",
181
+ calcMode: "spline",
182
+ dur: halfDur,
183
+ begin: flowerAt,
184
+ fill: "freeze"
185
+ }
186
+ )
187
+ ] })
188
+ ] }, `f${fi}`)),
189
+ animate && /* @__PURE__ */ jsxRuntime.jsx(
190
+ "animateTransform",
191
+ {
192
+ attributeName: "transform",
193
+ type: "rotate",
194
+ values: "0 50 50;1 50 50;-1 50 50;0 50 50",
195
+ dur: "4s",
196
+ repeatCount: "indefinite",
197
+ begin: `${duration}s`
198
+ }
199
+ )
200
+ ]
201
+ }
202
+ )
203
+ ] }),
204
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
205
+ );
200
206
  }
201
207
  ),
202
208
  { displayName: "NtdIconFloral" }
@@ -206,13 +212,15 @@ const NtdIconFestive = /* @__PURE__ */ Object.assign(
206
212
  ({
207
213
  children,
208
214
  animate = true,
209
- duration = 1.5,
215
+ duration: durationProp,
216
+ animationSpeed: animationSpeed$1,
210
217
  intensity = "normal",
211
218
  colors,
212
219
  sparkleColor = "#fbbf24",
213
220
  className,
214
221
  style
215
222
  }, ref) => {
223
+ const duration = durationProp ?? 1.5;
216
224
  const cols = colors ?? ["#ef4444", "#f59e0b", "#22c55e", "#3b82f6", "#a855f7", "#ec4899"];
217
225
  const dur = `${duration * 0.6}s`;
218
226
  const baseConfetti = [
@@ -262,122 +270,125 @@ const NtdIconFestive = /* @__PURE__ */ Object.assign(
262
270
  { cx: 97, cy: 45, r: 1.1 }
263
271
  ] : []
264
272
  ];
265
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
266
- children,
267
- /* @__PURE__ */ jsxRuntime.jsxs(
268
- "svg",
269
- {
270
- viewBox: "0 0 100 100",
271
- style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%" },
272
- "aria-hidden": true,
273
- children: [
274
- allConfetti.map((c, i) => {
275
- const delay = `${(i * 0.07).toFixed(2)}s`;
276
- const col = cols[c.ci % cols.length];
277
- return /* @__PURE__ */ jsxRuntime.jsx("g", { transform: "translate(50,50)", children: /* @__PURE__ */ jsxRuntime.jsxs("g", { opacity: animate ? 0 : 0.85, children: [
278
- /* @__PURE__ */ jsxRuntime.jsx(
279
- "rect",
280
- {
281
- x: c.x - 50 - 1.5,
282
- y: c.y - 50 - 3,
283
- width: 3,
284
- height: 6,
285
- rx: 0.5,
286
- fill: col,
287
- transform: `rotate(${c.r} ${c.x - 50} ${c.y - 50})`
288
- }
289
- ),
290
- animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
273
+ return animationSpeed.retimeTree(
274
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
275
+ children,
276
+ /* @__PURE__ */ jsxRuntime.jsxs(
277
+ "svg",
278
+ {
279
+ viewBox: "0 0 100 100",
280
+ style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%" },
281
+ "aria-hidden": true,
282
+ children: [
283
+ allConfetti.map((c, i) => {
284
+ const delay = `${(i * 0.07).toFixed(2)}s`;
285
+ const col = cols[c.ci % cols.length];
286
+ return /* @__PURE__ */ jsxRuntime.jsx("g", { transform: "translate(50,50)", children: /* @__PURE__ */ jsxRuntime.jsxs("g", { opacity: animate ? 0 : 0.85, children: [
291
287
  /* @__PURE__ */ jsxRuntime.jsx(
292
- "animate",
288
+ "rect",
293
289
  {
294
- attributeName: "opacity",
295
- from: "0",
296
- to: "0.85",
297
- dur: "0.4s",
298
- begin: delay,
299
- fill: "freeze"
290
+ x: c.x - 50 - 1.5,
291
+ y: c.y - 50 - 3,
292
+ width: 3,
293
+ height: 6,
294
+ rx: 0.5,
295
+ fill: col,
296
+ transform: `rotate(${c.r} ${c.x - 50} ${c.y - 50})`
300
297
  }
301
298
  ),
302
- /* @__PURE__ */ jsxRuntime.jsx(
303
- "animateTransform",
304
- {
305
- attributeName: "transform",
306
- type: "scale",
307
- values: "0 0;1 1",
308
- keyTimes: "0;1",
309
- keySplines: "0.34 1 0.64 1",
310
- calcMode: "spline",
311
- dur,
312
- begin: delay,
313
- fill: "freeze"
314
- }
315
- )
316
- ] })
317
- ] }) }, `c${i}`);
318
- }),
319
- stars.map((s, i) => /* @__PURE__ */ jsxRuntime.jsxs("g", { transform: `translate(${s.x},${s.y}) scale(${s.s})`, children: [
320
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: starD, fill: sparkleColor, opacity: animate ? 0 : 0.9, children: animate && /* @__PURE__ */ jsxRuntime.jsx(
321
- "animate",
322
- {
323
- attributeName: "opacity",
324
- from: "0",
325
- to: "0.9",
326
- dur: "0.5s",
327
- begin: `${(i * 0.15 + 0.3).toFixed(2)}s`,
328
- fill: "freeze"
329
- }
330
- ) }),
331
- animate && /* @__PURE__ */ jsxRuntime.jsx(
332
- "animateTransform",
299
+ animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
300
+ /* @__PURE__ */ jsxRuntime.jsx(
301
+ "animate",
302
+ {
303
+ attributeName: "opacity",
304
+ from: "0",
305
+ to: "0.85",
306
+ dur: "0.4s",
307
+ begin: delay,
308
+ fill: "freeze"
309
+ }
310
+ ),
311
+ /* @__PURE__ */ jsxRuntime.jsx(
312
+ "animateTransform",
313
+ {
314
+ attributeName: "transform",
315
+ type: "scale",
316
+ values: "0 0;1 1",
317
+ keyTimes: "0;1",
318
+ keySplines: "0.34 1 0.64 1",
319
+ calcMode: "spline",
320
+ dur,
321
+ begin: delay,
322
+ fill: "freeze"
323
+ }
324
+ )
325
+ ] })
326
+ ] }) }, `c${i}`);
327
+ }),
328
+ stars.map((s, i) => /* @__PURE__ */ jsxRuntime.jsxs("g", { transform: `translate(${s.x},${s.y}) scale(${s.s})`, children: [
329
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: starD, fill: sparkleColor, opacity: animate ? 0 : 0.9, children: animate && /* @__PURE__ */ jsxRuntime.jsx(
330
+ "animate",
331
+ {
332
+ attributeName: "opacity",
333
+ from: "0",
334
+ to: "0.9",
335
+ dur: "0.5s",
336
+ begin: `${(i * 0.15 + 0.3).toFixed(2)}s`,
337
+ fill: "freeze"
338
+ }
339
+ ) }),
340
+ animate && /* @__PURE__ */ jsxRuntime.jsx(
341
+ "animateTransform",
342
+ {
343
+ attributeName: "transform",
344
+ type: "scale",
345
+ values: `${s.s};${s.s * 1.3};${s.s}`,
346
+ dur: "1.5s",
347
+ repeatCount: "indefinite",
348
+ begin: `${duration + 0.5}s`
349
+ }
350
+ )
351
+ ] }, `s${i}`)),
352
+ sparkles.map((sp, i) => /* @__PURE__ */ jsxRuntime.jsx(
353
+ "circle",
333
354
  {
334
- attributeName: "transform",
335
- type: "scale",
336
- values: `${s.s};${s.s * 1.3};${s.s}`,
337
- dur: "1.5s",
338
- repeatCount: "indefinite",
339
- begin: `${duration + 0.5}s`
340
- }
341
- )
342
- ] }, `s${i}`)),
343
- sparkles.map((sp, i) => /* @__PURE__ */ jsxRuntime.jsx(
344
- "circle",
345
- {
346
- cx: sp.cx,
347
- cy: sp.cy,
348
- r: sp.r,
349
- fill: sparkleColor,
350
- opacity: animate ? 0 : 0.7,
351
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
352
- /* @__PURE__ */ jsxRuntime.jsx(
353
- "animate",
354
- {
355
- attributeName: "opacity",
356
- from: "0",
357
- to: "0.7",
358
- dur: "0.3s",
359
- begin: `${(duration * 0.4 + i * 0.08).toFixed(2)}s`,
360
- fill: "freeze"
361
- }
362
- ),
363
- /* @__PURE__ */ jsxRuntime.jsx(
364
- "animate",
365
- {
366
- attributeName: "opacity",
367
- values: "0.3;0.9;0.3",
368
- dur: `${1 + i * 0.3}s`,
369
- repeatCount: "indefinite",
370
- begin: `${duration}s`
371
- }
372
- )
373
- ] })
374
- },
375
- `sp${i}`
376
- ))
377
- ]
378
- }
379
- )
380
- ] });
355
+ cx: sp.cx,
356
+ cy: sp.cy,
357
+ r: sp.r,
358
+ fill: sparkleColor,
359
+ opacity: animate ? 0 : 0.7,
360
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
361
+ /* @__PURE__ */ jsxRuntime.jsx(
362
+ "animate",
363
+ {
364
+ attributeName: "opacity",
365
+ from: "0",
366
+ to: "0.7",
367
+ dur: "0.3s",
368
+ begin: `${(duration * 0.4 + i * 0.08).toFixed(2)}s`,
369
+ fill: "freeze"
370
+ }
371
+ ),
372
+ /* @__PURE__ */ jsxRuntime.jsx(
373
+ "animate",
374
+ {
375
+ attributeName: "opacity",
376
+ values: "0.3;0.9;0.3",
377
+ dur: `${1 + i * 0.3}s`,
378
+ repeatCount: "indefinite",
379
+ begin: `${duration}s`
380
+ }
381
+ )
382
+ ] })
383
+ },
384
+ `sp${i}`
385
+ ))
386
+ ]
387
+ }
388
+ )
389
+ ] }),
390
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
391
+ );
381
392
  }
382
393
  ),
383
394
  { displayName: "NtdIconFestive" }
@@ -387,7 +398,8 @@ const NtdIconNeon = /* @__PURE__ */ Object.assign(
387
398
  ({
388
399
  children,
389
400
  animate = true,
390
- duration = 4,
401
+ duration: durationProp,
402
+ animationSpeed: animationSpeed$1,
391
403
  intensity = "normal",
392
404
  glowColor = "#0ff",
393
405
  secondaryGlow,
@@ -395,6 +407,7 @@ const NtdIconNeon = /* @__PURE__ */ Object.assign(
395
407
  className,
396
408
  style
397
409
  }, ref) => {
410
+ const duration = durationProp ?? 4;
398
411
  const uid = React.useId().replace(/[^a-zA-Z0-9]/g, "_");
399
412
  const glow2 = secondaryGlow ?? glowColor;
400
413
  const blur = intensity === "dense" ? 8 : intensity === "subtle" ? 3 : 5;
@@ -407,25 +420,28 @@ const NtdIconNeon = /* @__PURE__ */ Object.assign(
407
420
  ].filter(Boolean).join(" ");
408
421
  const dimFilter = `drop-shadow(0 0 ${blur * 0.2}px ${glowColor})`;
409
422
  const animName = `ntd_neon_${uid}`;
410
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
411
- animate && flicker && /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
423
+ return animationSpeed.retimeTree(
424
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
425
+ animate && flicker && /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
412
426
  @keyframes ${animName} {
413
427
  0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% { opacity: 1; filter: ${filterValue}; }
414
428
  20%, 24%, 55% { opacity: 0.5; filter: ${dimFilter}; }
415
429
  }
416
430
  ` }),
417
- /* @__PURE__ */ jsxRuntime.jsx(
418
- "span",
419
- {
420
- style: {
421
- display: "inline-flex",
422
- filter: filterValue,
423
- ...animate && flicker ? { animation: `${animName} ${duration}s infinite` } : {}
424
- },
425
- children
426
- }
427
- )
428
- ] });
431
+ /* @__PURE__ */ jsxRuntime.jsx(
432
+ "span",
433
+ {
434
+ style: {
435
+ display: "inline-flex",
436
+ filter: filterValue,
437
+ ...animate && flicker ? { animation: `${animName} ${duration}s infinite` } : {}
438
+ },
439
+ children
440
+ }
441
+ )
442
+ ] }),
443
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
444
+ );
429
445
  }
430
446
  ),
431
447
  { displayName: "NtdIconNeon" }
@@ -435,13 +451,15 @@ const NtdIconSketch = /* @__PURE__ */ Object.assign(
435
451
  ({
436
452
  children,
437
453
  animate = true,
438
- duration = 1.5,
454
+ duration: durationProp,
455
+ animationSpeed: animationSpeed$1,
439
456
  intensity = "normal",
440
457
  strokeColor = "#374151",
441
458
  roughness = 2,
442
459
  className,
443
460
  style
444
461
  }, ref) => {
462
+ const duration = durationProp ?? 1.5;
445
463
  const uid = React.useId().replace(/[^a-zA-Z0-9]/g, "_");
446
464
  const filterId = `ntd_sketch_${uid}`;
447
465
  const dur = `${duration}s`;
@@ -457,112 +475,115 @@ const NtdIconSketch = /* @__PURE__ */ Object.assign(
457
475
  { x1: 10, y1: 12, x2: 16, y2: 10 },
458
476
  { x1: 84, y1: 12, x2: 90, y2: 10 }
459
477
  ];
460
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
461
- /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs("filter", { id: filterId, children: [
462
- /* @__PURE__ */ jsxRuntime.jsx(
463
- "feTurbulence",
464
- {
465
- type: "turbulence",
466
- baseFrequency: 0.02 + roughness * 8e-3,
467
- numOctaves: 3,
468
- seed: 2,
469
- result: "noise"
470
- }
471
- ),
472
- /* @__PURE__ */ jsxRuntime.jsx(
473
- "feDisplacementMap",
478
+ return animationSpeed.retimeTree(
479
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
480
+ /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs("filter", { id: filterId, children: [
481
+ /* @__PURE__ */ jsxRuntime.jsx(
482
+ "feTurbulence",
483
+ {
484
+ type: "turbulence",
485
+ baseFrequency: 0.02 + roughness * 8e-3,
486
+ numOctaves: 3,
487
+ seed: 2,
488
+ result: "noise"
489
+ }
490
+ ),
491
+ /* @__PURE__ */ jsxRuntime.jsx(
492
+ "feDisplacementMap",
493
+ {
494
+ in: "SourceGraphic",
495
+ in2: "noise",
496
+ scale: roughness,
497
+ xChannelSelector: "R",
498
+ yChannelSelector: "G"
499
+ }
500
+ )
501
+ ] }) }) }),
502
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", filter: `url(#${filterId})` }, children }),
503
+ /* @__PURE__ */ jsxRuntime.jsxs(
504
+ "svg",
474
505
  {
475
- in: "SourceGraphic",
476
- in2: "noise",
477
- scale: roughness,
478
- xChannelSelector: "R",
479
- yChannelSelector: "G"
506
+ viewBox: "0 0 100 100",
507
+ style: { ...overlayBase, inset: "-20%", width: "140%", height: "140%" },
508
+ "aria-hidden": true,
509
+ children: [
510
+ /* @__PURE__ */ jsxRuntime.jsx(
511
+ "path",
512
+ {
513
+ d: scribbleMain,
514
+ fill: "none",
515
+ stroke: strokeColor,
516
+ strokeWidth: "1",
517
+ strokeLinecap: "round",
518
+ opacity: 0.5,
519
+ ...animate ? { strokeDasharray: dashLen, strokeDashoffset: dashLen } : {},
520
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
521
+ "animate",
522
+ {
523
+ attributeName: "stroke-dashoffset",
524
+ from: `${dashLen}`,
525
+ to: "0",
526
+ dur,
527
+ fill: "freeze"
528
+ }
529
+ )
530
+ }
531
+ ),
532
+ intensity !== "subtle" && scribbleExtra.slice(0, intensity === "dense" ? 2 : 1).map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
533
+ "path",
534
+ {
535
+ d,
536
+ fill: "none",
537
+ stroke: strokeColor,
538
+ strokeWidth: "0.8",
539
+ strokeLinecap: "round",
540
+ opacity: 0.35,
541
+ ...animate ? { strokeDasharray: dashLen, strokeDashoffset: dashLen } : {},
542
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
543
+ "animate",
544
+ {
545
+ attributeName: "stroke-dashoffset",
546
+ from: `${dashLen}`,
547
+ to: "0",
548
+ dur,
549
+ fill: "freeze",
550
+ begin: `${0.3 + i * 0.2}s`
551
+ }
552
+ )
553
+ },
554
+ `se${i}`
555
+ )),
556
+ hatchPositions.slice(0, hatchCount).map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
557
+ "line",
558
+ {
559
+ x1: p.x1,
560
+ y1: p.y1,
561
+ x2: p.x2,
562
+ y2: p.y2,
563
+ stroke: strokeColor,
564
+ strokeWidth: "0.6",
565
+ strokeLinecap: "round",
566
+ opacity: animate ? 0 : 0.3,
567
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
568
+ "animate",
569
+ {
570
+ attributeName: "opacity",
571
+ from: "0",
572
+ to: "0.3",
573
+ dur: "0.3s",
574
+ begin: `${duration * 0.7 + i * 0.1}s`,
575
+ fill: "freeze"
576
+ }
577
+ )
578
+ },
579
+ `h${i}`
580
+ ))
581
+ ]
480
582
  }
481
583
  )
482
- ] }) }) }),
483
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", filter: `url(#${filterId})` }, children }),
484
- /* @__PURE__ */ jsxRuntime.jsxs(
485
- "svg",
486
- {
487
- viewBox: "0 0 100 100",
488
- style: { ...overlayBase, inset: "-20%", width: "140%", height: "140%" },
489
- "aria-hidden": true,
490
- children: [
491
- /* @__PURE__ */ jsxRuntime.jsx(
492
- "path",
493
- {
494
- d: scribbleMain,
495
- fill: "none",
496
- stroke: strokeColor,
497
- strokeWidth: "1",
498
- strokeLinecap: "round",
499
- opacity: 0.5,
500
- ...animate ? { strokeDasharray: dashLen, strokeDashoffset: dashLen } : {},
501
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
502
- "animate",
503
- {
504
- attributeName: "stroke-dashoffset",
505
- from: `${dashLen}`,
506
- to: "0",
507
- dur,
508
- fill: "freeze"
509
- }
510
- )
511
- }
512
- ),
513
- intensity !== "subtle" && scribbleExtra.slice(0, intensity === "dense" ? 2 : 1).map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
514
- "path",
515
- {
516
- d,
517
- fill: "none",
518
- stroke: strokeColor,
519
- strokeWidth: "0.8",
520
- strokeLinecap: "round",
521
- opacity: 0.35,
522
- ...animate ? { strokeDasharray: dashLen, strokeDashoffset: dashLen } : {},
523
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
524
- "animate",
525
- {
526
- attributeName: "stroke-dashoffset",
527
- from: `${dashLen}`,
528
- to: "0",
529
- dur,
530
- fill: "freeze",
531
- begin: `${0.3 + i * 0.2}s`
532
- }
533
- )
534
- },
535
- `se${i}`
536
- )),
537
- hatchPositions.slice(0, hatchCount).map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
538
- "line",
539
- {
540
- x1: p.x1,
541
- y1: p.y1,
542
- x2: p.x2,
543
- y2: p.y2,
544
- stroke: strokeColor,
545
- strokeWidth: "0.6",
546
- strokeLinecap: "round",
547
- opacity: animate ? 0 : 0.3,
548
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
549
- "animate",
550
- {
551
- attributeName: "opacity",
552
- from: "0",
553
- to: "0.3",
554
- dur: "0.3s",
555
- begin: `${duration * 0.7 + i * 0.1}s`,
556
- fill: "freeze"
557
- }
558
- )
559
- },
560
- `h${i}`
561
- ))
562
- ]
563
- }
564
- )
565
- ] });
584
+ ] }),
585
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
586
+ );
566
587
  }
567
588
  ),
568
589
  { displayName: "NtdIconSketch" }
@@ -572,13 +593,15 @@ const NtdIconWatercolor = /* @__PURE__ */ Object.assign(
572
593
  ({
573
594
  children,
574
595
  animate = true,
575
- duration = 2,
596
+ duration: durationProp,
597
+ animationSpeed: animationSpeed$1,
576
598
  intensity = "normal",
577
599
  tintColor = "#818cf8",
578
600
  bleedColor = "#f0abfc",
579
601
  className,
580
602
  style
581
603
  }, ref) => {
604
+ const duration = durationProp ?? 2;
582
605
  const uid = React.useId().replace(/[^a-zA-Z0-9]/g, "_");
583
606
  const filterId = `ntd_wc_${uid}`;
584
607
  const blobFilter = `${filterId}_blob`;
@@ -607,115 +630,118 @@ const NtdIconWatercolor = /* @__PURE__ */ Object.assign(
607
630
  { cx: 92, cy: 55, r: 1 }
608
631
  ] : []
609
632
  ];
610
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
611
- /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
612
- /* @__PURE__ */ jsxRuntime.jsxs("filter", { id: filterId, x: "-20%", y: "-20%", width: "140%", height: "140%", children: [
613
- /* @__PURE__ */ jsxRuntime.jsx(
614
- "feTurbulence",
615
- {
616
- type: "fractalNoise",
617
- baseFrequency: "0.04",
618
- numOctaves: 4,
619
- seed: 5,
620
- result: "noise"
621
- }
622
- ),
623
- /* @__PURE__ */ jsxRuntime.jsx(
624
- "feDisplacementMap",
625
- {
626
- in: "SourceGraphic",
627
- in2: "noise",
628
- scale: 3,
629
- xChannelSelector: "R",
630
- yChannelSelector: "G",
631
- result: "displaced"
632
- }
633
- ),
634
- /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { in: "displaced", stdDeviation: "0.5" })
635
- ] }),
636
- /* @__PURE__ */ jsxRuntime.jsx("filter", { id: blobFilter, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "3" }) })
637
- ] }) }),
638
- /* @__PURE__ */ jsxRuntime.jsxs(
639
- "svg",
640
- {
641
- viewBox: "0 0 100 100",
642
- style: { ...overlayBase, inset: "-25%", width: "150%", height: "150%", zIndex: 0 },
643
- "aria-hidden": true,
644
- children: [
645
- splotches.map((s, i) => /* @__PURE__ */ jsxRuntime.jsx(
646
- "circle",
633
+ return animationSpeed.retimeTree(
634
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
635
+ /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
636
+ /* @__PURE__ */ jsxRuntime.jsxs("filter", { id: filterId, x: "-20%", y: "-20%", width: "140%", height: "140%", children: [
637
+ /* @__PURE__ */ jsxRuntime.jsx(
638
+ "feTurbulence",
647
639
  {
648
- cx: s.cx,
649
- cy: s.cy,
650
- r: animate ? 0 : s.r,
651
- fill: s.color,
652
- opacity: s.op,
653
- filter: `url(#${blobFilter})`,
654
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
655
- /* @__PURE__ */ jsxRuntime.jsx(
640
+ type: "fractalNoise",
641
+ baseFrequency: "0.04",
642
+ numOctaves: 4,
643
+ seed: 5,
644
+ result: "noise"
645
+ }
646
+ ),
647
+ /* @__PURE__ */ jsxRuntime.jsx(
648
+ "feDisplacementMap",
649
+ {
650
+ in: "SourceGraphic",
651
+ in2: "noise",
652
+ scale: 3,
653
+ xChannelSelector: "R",
654
+ yChannelSelector: "G",
655
+ result: "displaced"
656
+ }
657
+ ),
658
+ /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { in: "displaced", stdDeviation: "0.5" })
659
+ ] }),
660
+ /* @__PURE__ */ jsxRuntime.jsx("filter", { id: blobFilter, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "3" }) })
661
+ ] }) }),
662
+ /* @__PURE__ */ jsxRuntime.jsxs(
663
+ "svg",
664
+ {
665
+ viewBox: "0 0 100 100",
666
+ style: { ...overlayBase, inset: "-25%", width: "150%", height: "150%", zIndex: 0 },
667
+ "aria-hidden": true,
668
+ children: [
669
+ splotches.map((s, i) => /* @__PURE__ */ jsxRuntime.jsx(
670
+ "circle",
671
+ {
672
+ cx: s.cx,
673
+ cy: s.cy,
674
+ r: animate ? 0 : s.r,
675
+ fill: s.color,
676
+ opacity: s.op,
677
+ filter: `url(#${blobFilter})`,
678
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
679
+ /* @__PURE__ */ jsxRuntime.jsx(
680
+ "animate",
681
+ {
682
+ attributeName: "r",
683
+ from: "0",
684
+ to: `${s.r}`,
685
+ dur: `${duration * 0.7}s`,
686
+ begin: `${(i * 0.15).toFixed(2)}s`,
687
+ fill: "freeze"
688
+ }
689
+ ),
690
+ /* @__PURE__ */ jsxRuntime.jsx(
691
+ "animate",
692
+ {
693
+ attributeName: "opacity",
694
+ values: `${s.op};${s.op * 1.3};${s.op}`,
695
+ dur: "3s",
696
+ begin: `${duration}s`,
697
+ repeatCount: "indefinite"
698
+ }
699
+ )
700
+ ] })
701
+ },
702
+ `sp${i}`
703
+ )),
704
+ splatters.map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
705
+ "circle",
706
+ {
707
+ cx: d.cx,
708
+ cy: d.cy,
709
+ r: d.r,
710
+ fill: i % 2 === 0 ? tintColor : bleedColor,
711
+ opacity: animate ? 0 : 0.3,
712
+ filter: `url(#${blobFilter})`,
713
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
656
714
  "animate",
657
715
  {
658
- attributeName: "r",
716
+ attributeName: "opacity",
659
717
  from: "0",
660
- to: `${s.r}`,
661
- dur: `${duration * 0.7}s`,
662
- begin: `${(i * 0.15).toFixed(2)}s`,
718
+ to: "0.3",
719
+ dur: "0.3s",
720
+ begin: `${(duration * 0.5 + i * 0.1).toFixed(2)}s`,
663
721
  fill: "freeze"
664
722
  }
665
- ),
666
- /* @__PURE__ */ jsxRuntime.jsx(
667
- "animate",
668
- {
669
- attributeName: "opacity",
670
- values: `${s.op};${s.op * 1.3};${s.op}`,
671
- dur: "3s",
672
- begin: `${duration}s`,
673
- repeatCount: "indefinite"
674
- }
675
723
  )
676
- ] })
677
- },
678
- `sp${i}`
679
- )),
680
- splatters.map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
681
- "circle",
682
- {
683
- cx: d.cx,
684
- cy: d.cy,
685
- r: d.r,
686
- fill: i % 2 === 0 ? tintColor : bleedColor,
687
- opacity: animate ? 0 : 0.3,
688
- filter: `url(#${blobFilter})`,
689
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
690
- "animate",
691
- {
692
- attributeName: "opacity",
693
- from: "0",
694
- to: "0.3",
695
- dur: "0.3s",
696
- begin: `${(duration * 0.5 + i * 0.1).toFixed(2)}s`,
697
- fill: "freeze"
698
- }
699
- )
700
- },
701
- `dot${i}`
702
- ))
703
- ]
704
- }
705
- ),
706
- /* @__PURE__ */ jsxRuntime.jsx(
707
- "span",
708
- {
709
- style: {
710
- display: "inline-flex",
711
- filter: `url(#${filterId})`,
712
- position: "relative",
713
- zIndex: 1
714
- },
715
- children
716
- }
717
- )
718
- ] });
724
+ },
725
+ `dot${i}`
726
+ ))
727
+ ]
728
+ }
729
+ ),
730
+ /* @__PURE__ */ jsxRuntime.jsx(
731
+ "span",
732
+ {
733
+ style: {
734
+ display: "inline-flex",
735
+ filter: `url(#${filterId})`,
736
+ position: "relative",
737
+ zIndex: 1
738
+ },
739
+ children
740
+ }
741
+ )
742
+ ] }),
743
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
744
+ );
719
745
  }
720
746
  ),
721
747
  { displayName: "NtdIconWatercolor" }
@@ -725,7 +751,8 @@ const NtdIconCosmic = /* @__PURE__ */ Object.assign(
725
751
  ({
726
752
  children,
727
753
  animate = true,
728
- duration = 2,
754
+ duration: durationProp,
755
+ animationSpeed: animationSpeed$1,
729
756
  intensity = "normal",
730
757
  starColor = "#e2e8f0",
731
758
  nebulaColor = "#7c3aed",
@@ -733,6 +760,7 @@ const NtdIconCosmic = /* @__PURE__ */ Object.assign(
733
760
  className,
734
761
  style
735
762
  }, ref) => {
763
+ const duration = durationProp ?? 2;
736
764
  const uid = React.useId().replace(/[^a-zA-Z0-9]/g, "_");
737
765
  const nebulaFilter = `ntd_cosm_${uid}`;
738
766
  const baseStars = [
@@ -783,154 +811,157 @@ const NtdIconCosmic = /* @__PURE__ */ Object.assign(
783
811
  ] : []
784
812
  ];
785
813
  const lineLen = 80;
786
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
787
- /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("filter", { id: nebulaFilter, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "4" }) }) }) }),
788
- /* @__PURE__ */ jsxRuntime.jsxs(
789
- "svg",
790
- {
791
- viewBox: "0 0 100 100",
792
- style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%", zIndex: 0 },
793
- "aria-hidden": true,
794
- children: [
795
- nebulae.map((n, i) => /* @__PURE__ */ jsxRuntime.jsx(
796
- "circle",
797
- {
798
- cx: n.cx,
799
- cy: n.cy,
800
- r: n.r,
801
- fill: n.color,
802
- opacity: animate ? 0 : n.op,
803
- filter: `url(#${nebulaFilter})`,
804
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
805
- /* @__PURE__ */ jsxRuntime.jsx(
806
- "animate",
807
- {
808
- attributeName: "opacity",
809
- from: "0",
810
- to: `${n.op}`,
811
- dur: `${duration}s`,
812
- fill: "freeze"
813
- }
814
- ),
815
- /* @__PURE__ */ jsxRuntime.jsx(
816
- "animate",
817
- {
818
- attributeName: "opacity",
819
- values: `${n.op};${n.op * 1.5};${n.op}`,
820
- dur: "5s",
821
- repeatCount: "indefinite",
822
- begin: `${duration}s`
823
- }
824
- ),
825
- /* @__PURE__ */ jsxRuntime.jsx(
826
- "animate",
827
- {
828
- attributeName: "r",
829
- values: `${n.r};${n.r * 1.1};${n.r}`,
830
- dur: "6s",
831
- repeatCount: "indefinite",
832
- begin: `${duration}s`
833
- }
834
- )
835
- ] })
836
- },
837
- `nb${i}`
838
- )),
839
- constellations.map((c, i) => /* @__PURE__ */ jsxRuntime.jsx(
840
- "line",
841
- {
842
- x1: c.from[0],
843
- y1: c.from[1],
844
- x2: c.to[0],
845
- y2: c.to[1],
846
- stroke: starColor,
847
- strokeWidth: "0.3",
848
- opacity: 0.25,
849
- ...animate ? { strokeDasharray: lineLen, strokeDashoffset: lineLen } : {},
850
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
851
- "animate",
852
- {
853
- attributeName: "stroke-dashoffset",
854
- from: `${lineLen}`,
855
- to: "0",
856
- dur: `${duration * 0.8}s`,
857
- begin: `${(i * 0.2).toFixed(1)}s`,
858
- fill: "freeze"
859
- }
860
- )
861
- },
862
- `cl${i}`
863
- ))
864
- ]
865
- }
866
- ),
867
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children }),
868
- /* @__PURE__ */ jsxRuntime.jsxs(
869
- "svg",
870
- {
871
- viewBox: "0 0 100 100",
872
- style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%", zIndex: 2 },
873
- "aria-hidden": true,
874
- children: [
875
- allStars.map((s, i) => /* @__PURE__ */ jsxRuntime.jsx(
876
- "circle",
877
- {
878
- cx: s.cx,
879
- cy: s.cy,
880
- r: s.r,
881
- fill: starColor,
882
- opacity: animate ? 0 : 0.8,
883
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
884
- /* @__PURE__ */ jsxRuntime.jsx(
814
+ return animationSpeed.retimeTree(
815
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
816
+ /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("filter", { id: nebulaFilter, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "4" }) }) }) }),
817
+ /* @__PURE__ */ jsxRuntime.jsxs(
818
+ "svg",
819
+ {
820
+ viewBox: "0 0 100 100",
821
+ style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%", zIndex: 0 },
822
+ "aria-hidden": true,
823
+ children: [
824
+ nebulae.map((n, i) => /* @__PURE__ */ jsxRuntime.jsx(
825
+ "circle",
826
+ {
827
+ cx: n.cx,
828
+ cy: n.cy,
829
+ r: n.r,
830
+ fill: n.color,
831
+ opacity: animate ? 0 : n.op,
832
+ filter: `url(#${nebulaFilter})`,
833
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
834
+ /* @__PURE__ */ jsxRuntime.jsx(
835
+ "animate",
836
+ {
837
+ attributeName: "opacity",
838
+ from: "0",
839
+ to: `${n.op}`,
840
+ dur: `${duration}s`,
841
+ fill: "freeze"
842
+ }
843
+ ),
844
+ /* @__PURE__ */ jsxRuntime.jsx(
845
+ "animate",
846
+ {
847
+ attributeName: "opacity",
848
+ values: `${n.op};${n.op * 1.5};${n.op}`,
849
+ dur: "5s",
850
+ repeatCount: "indefinite",
851
+ begin: `${duration}s`
852
+ }
853
+ ),
854
+ /* @__PURE__ */ jsxRuntime.jsx(
855
+ "animate",
856
+ {
857
+ attributeName: "r",
858
+ values: `${n.r};${n.r * 1.1};${n.r}`,
859
+ dur: "6s",
860
+ repeatCount: "indefinite",
861
+ begin: `${duration}s`
862
+ }
863
+ )
864
+ ] })
865
+ },
866
+ `nb${i}`
867
+ )),
868
+ constellations.map((c, i) => /* @__PURE__ */ jsxRuntime.jsx(
869
+ "line",
870
+ {
871
+ x1: c.from[0],
872
+ y1: c.from[1],
873
+ x2: c.to[0],
874
+ y2: c.to[1],
875
+ stroke: starColor,
876
+ strokeWidth: "0.3",
877
+ opacity: 0.25,
878
+ ...animate ? { strokeDasharray: lineLen, strokeDashoffset: lineLen } : {},
879
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
885
880
  "animate",
886
881
  {
887
- attributeName: "opacity",
888
- from: "0",
889
- to: "0.8",
890
- dur: `${duration * 0.5}s`,
891
- begin: `${(i * 0.1).toFixed(2)}s`,
882
+ attributeName: "stroke-dashoffset",
883
+ from: `${lineLen}`,
884
+ to: "0",
885
+ dur: `${duration * 0.8}s`,
886
+ begin: `${(i * 0.2).toFixed(1)}s`,
892
887
  fill: "freeze"
893
888
  }
894
- ),
895
- /* @__PURE__ */ jsxRuntime.jsx(
896
- "animate",
897
- {
898
- attributeName: "opacity",
899
- values: "0.4;1;0.4",
900
- dur: `${1.5 + i % 4 * 0.4}s`,
901
- repeatCount: "indefinite",
902
- begin: `${duration}s`
903
- }
904
- ),
905
- /* @__PURE__ */ jsxRuntime.jsx(
906
- "animate",
907
- {
908
- attributeName: "r",
909
- values: `${s.r};${s.r * 1.4};${s.r}`,
910
- dur: `${2 + i % 3 * 0.5}s`,
911
- repeatCount: "indefinite",
912
- begin: `${duration}s`
913
- }
914
889
  )
915
- ] })
916
- },
917
- `st${i}`
918
- )),
919
- animate && /* @__PURE__ */ jsxRuntime.jsx(
920
- "animateTransform",
921
- {
922
- attributeName: "transform",
923
- type: "rotate",
924
- from: "0 50 50",
925
- to: "360 50 50",
926
- dur: "120s",
927
- repeatCount: "indefinite"
928
- }
929
- )
930
- ]
931
- }
932
- )
933
- ] });
890
+ },
891
+ `cl${i}`
892
+ ))
893
+ ]
894
+ }
895
+ ),
896
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children }),
897
+ /* @__PURE__ */ jsxRuntime.jsxs(
898
+ "svg",
899
+ {
900
+ viewBox: "0 0 100 100",
901
+ style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%", zIndex: 2 },
902
+ "aria-hidden": true,
903
+ children: [
904
+ allStars.map((s, i) => /* @__PURE__ */ jsxRuntime.jsx(
905
+ "circle",
906
+ {
907
+ cx: s.cx,
908
+ cy: s.cy,
909
+ r: s.r,
910
+ fill: starColor,
911
+ opacity: animate ? 0 : 0.8,
912
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
913
+ /* @__PURE__ */ jsxRuntime.jsx(
914
+ "animate",
915
+ {
916
+ attributeName: "opacity",
917
+ from: "0",
918
+ to: "0.8",
919
+ dur: `${duration * 0.5}s`,
920
+ begin: `${(i * 0.1).toFixed(2)}s`,
921
+ fill: "freeze"
922
+ }
923
+ ),
924
+ /* @__PURE__ */ jsxRuntime.jsx(
925
+ "animate",
926
+ {
927
+ attributeName: "opacity",
928
+ values: "0.4;1;0.4",
929
+ dur: `${1.5 + i % 4 * 0.4}s`,
930
+ repeatCount: "indefinite",
931
+ begin: `${duration}s`
932
+ }
933
+ ),
934
+ /* @__PURE__ */ jsxRuntime.jsx(
935
+ "animate",
936
+ {
937
+ attributeName: "r",
938
+ values: `${s.r};${s.r * 1.4};${s.r}`,
939
+ dur: `${2 + i % 3 * 0.5}s`,
940
+ repeatCount: "indefinite",
941
+ begin: `${duration}s`
942
+ }
943
+ )
944
+ ] })
945
+ },
946
+ `st${i}`
947
+ )),
948
+ animate && /* @__PURE__ */ jsxRuntime.jsx(
949
+ "animateTransform",
950
+ {
951
+ attributeName: "transform",
952
+ type: "rotate",
953
+ from: "0 50 50",
954
+ to: "360 50 50",
955
+ dur: "120s",
956
+ repeatCount: "indefinite"
957
+ }
958
+ )
959
+ ]
960
+ }
961
+ )
962
+ ] }),
963
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
964
+ );
934
965
  }
935
966
  ),
936
967
  { displayName: "NtdIconCosmic" }
@@ -940,7 +971,8 @@ const NtdIconSteampunk = /* @__PURE__ */ Object.assign(
940
971
  ({
941
972
  children,
942
973
  animate = true,
943
- duration = 3,
974
+ duration: durationProp,
975
+ animationSpeed: animationSpeed$1,
944
976
  intensity = "normal",
945
977
  brassColor = "#b45309",
946
978
  pipeColor = "#78350f",
@@ -948,6 +980,7 @@ const NtdIconSteampunk = /* @__PURE__ */ Object.assign(
948
980
  className,
949
981
  style
950
982
  }, ref) => {
983
+ const duration = durationProp ?? 3;
951
984
  const makeGear = (cx, cy, r, teeth) => {
952
985
  const inner = r * 0.68;
953
986
  const step = Math.PI * 2 / teeth;
@@ -999,110 +1032,113 @@ const NtdIconSteampunk = /* @__PURE__ */ Object.assign(
999
1032
  { cx: 55, cy: -4, r: 2.2 },
1000
1033
  { cx: 47, cy: -10, r: 1.6 }
1001
1034
  ];
1002
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1003
- /* @__PURE__ */ jsxRuntime.jsxs(
1004
- "svg",
1005
- {
1006
- viewBox: "0 0 100 100",
1007
- style: { ...overlayBase, inset: "-20%", width: "140%", height: "140%", zIndex: 0 },
1008
- "aria-hidden": true,
1009
- children: [
1010
- pipes.map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
1011
- "path",
1012
- {
1013
- d: p.d,
1014
- stroke: pipeColor,
1015
- strokeWidth: p.w,
1016
- fill: "none",
1017
- strokeLinecap: "round",
1018
- opacity: 0.55
1019
- },
1020
- `pipe${i}`
1021
- )),
1022
- rivets.map((rv, i) => /* @__PURE__ */ jsxRuntime.jsx(
1023
- "circle",
1024
- {
1025
- cx: rv.cx,
1026
- cy: rv.cy,
1027
- r: 1.5,
1028
- fill: brassColor,
1029
- opacity: 0.7
1030
- },
1031
- `rv${i}`
1032
- ))
1033
- ]
1034
- }
1035
- ),
1036
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children }),
1037
- /* @__PURE__ */ jsxRuntime.jsxs(
1038
- "svg",
1039
- {
1040
- viewBox: "0 0 100 100",
1041
- style: { ...overlayBase, inset: "-20%", width: "140%", height: "140%", zIndex: 2 },
1042
- "aria-hidden": true,
1043
- children: [
1044
- gears.map((g, i) => /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
1045
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: makeGear(g.cx, g.cy, g.r, g.teeth), fill: brassColor, opacity: 0.78, children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1046
- "animateTransform",
1035
+ return animationSpeed.retimeTree(
1036
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1037
+ /* @__PURE__ */ jsxRuntime.jsxs(
1038
+ "svg",
1039
+ {
1040
+ viewBox: "0 0 100 100",
1041
+ style: { ...overlayBase, inset: "-20%", width: "140%", height: "140%", zIndex: 0 },
1042
+ "aria-hidden": true,
1043
+ children: [
1044
+ pipes.map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
1045
+ "path",
1047
1046
  {
1048
- attributeName: "transform",
1049
- type: "rotate",
1050
- from: `0 ${g.cx} ${g.cy}`,
1051
- to: `${g.dir * 360} ${g.cx} ${g.cy}`,
1052
- dur: `${duration * g.dm}s`,
1053
- repeatCount: "indefinite"
1054
- }
1055
- ) }),
1056
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: g.cx, cy: g.cy, r: g.r * 0.3, fill: pipeColor, opacity: 0.85 }),
1057
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: g.cx, cy: g.cy, r: g.r * 0.12, fill: brassColor, opacity: 0.6 })
1058
- ] }, `gear${i}`)),
1059
- animate && steamPuffs.map((sp, i) => /* @__PURE__ */ jsxRuntime.jsxs(
1060
- "circle",
1061
- {
1062
- cx: sp.cx,
1063
- cy: sp.cy,
1064
- r: sp.r,
1065
- fill: steamColor,
1066
- opacity: 0,
1067
- children: [
1068
- /* @__PURE__ */ jsxRuntime.jsx(
1069
- "animate",
1070
- {
1071
- attributeName: "opacity",
1072
- values: "0;0.45;0",
1073
- dur: "2.4s",
1074
- begin: `${i * 0.7}s`,
1075
- repeatCount: "indefinite"
1076
- }
1077
- ),
1078
- /* @__PURE__ */ jsxRuntime.jsx(
1079
- "animate",
1080
- {
1081
- attributeName: "cy",
1082
- values: `${sp.cy};${sp.cy - 12}`,
1083
- dur: "2.4s",
1084
- begin: `${i * 0.7}s`,
1085
- repeatCount: "indefinite"
1086
- }
1087
- ),
1088
- /* @__PURE__ */ jsxRuntime.jsx(
1089
- "animate",
1090
- {
1091
- attributeName: "r",
1092
- values: `${sp.r};${sp.r * 2.2}`,
1093
- dur: "2.4s",
1094
- begin: `${i * 0.7}s`,
1095
- repeatCount: "indefinite"
1096
- }
1097
- )
1098
- ]
1099
- },
1100
- `stm${i}`
1101
- ))
1102
- ]
1103
- }
1104
- )
1105
- ] });
1047
+ d: p.d,
1048
+ stroke: pipeColor,
1049
+ strokeWidth: p.w,
1050
+ fill: "none",
1051
+ strokeLinecap: "round",
1052
+ opacity: 0.55
1053
+ },
1054
+ `pipe${i}`
1055
+ )),
1056
+ rivets.map((rv, i) => /* @__PURE__ */ jsxRuntime.jsx(
1057
+ "circle",
1058
+ {
1059
+ cx: rv.cx,
1060
+ cy: rv.cy,
1061
+ r: 1.5,
1062
+ fill: brassColor,
1063
+ opacity: 0.7
1064
+ },
1065
+ `rv${i}`
1066
+ ))
1067
+ ]
1068
+ }
1069
+ ),
1070
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children }),
1071
+ /* @__PURE__ */ jsxRuntime.jsxs(
1072
+ "svg",
1073
+ {
1074
+ viewBox: "0 0 100 100",
1075
+ style: { ...overlayBase, inset: "-20%", width: "140%", height: "140%", zIndex: 2 },
1076
+ "aria-hidden": true,
1077
+ children: [
1078
+ gears.map((g, i) => /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
1079
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: makeGear(g.cx, g.cy, g.r, g.teeth), fill: brassColor, opacity: 0.78, children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1080
+ "animateTransform",
1081
+ {
1082
+ attributeName: "transform",
1083
+ type: "rotate",
1084
+ from: `0 ${g.cx} ${g.cy}`,
1085
+ to: `${g.dir * 360} ${g.cx} ${g.cy}`,
1086
+ dur: `${duration * g.dm}s`,
1087
+ repeatCount: "indefinite"
1088
+ }
1089
+ ) }),
1090
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: g.cx, cy: g.cy, r: g.r * 0.3, fill: pipeColor, opacity: 0.85 }),
1091
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: g.cx, cy: g.cy, r: g.r * 0.12, fill: brassColor, opacity: 0.6 })
1092
+ ] }, `gear${i}`)),
1093
+ animate && steamPuffs.map((sp, i) => /* @__PURE__ */ jsxRuntime.jsxs(
1094
+ "circle",
1095
+ {
1096
+ cx: sp.cx,
1097
+ cy: sp.cy,
1098
+ r: sp.r,
1099
+ fill: steamColor,
1100
+ opacity: 0,
1101
+ children: [
1102
+ /* @__PURE__ */ jsxRuntime.jsx(
1103
+ "animate",
1104
+ {
1105
+ attributeName: "opacity",
1106
+ values: "0;0.45;0",
1107
+ dur: "2.4s",
1108
+ begin: `${i * 0.7}s`,
1109
+ repeatCount: "indefinite"
1110
+ }
1111
+ ),
1112
+ /* @__PURE__ */ jsxRuntime.jsx(
1113
+ "animate",
1114
+ {
1115
+ attributeName: "cy",
1116
+ values: `${sp.cy};${sp.cy - 12}`,
1117
+ dur: "2.4s",
1118
+ begin: `${i * 0.7}s`,
1119
+ repeatCount: "indefinite"
1120
+ }
1121
+ ),
1122
+ /* @__PURE__ */ jsxRuntime.jsx(
1123
+ "animate",
1124
+ {
1125
+ attributeName: "r",
1126
+ values: `${sp.r};${sp.r * 2.2}`,
1127
+ dur: "2.4s",
1128
+ begin: `${i * 0.7}s`,
1129
+ repeatCount: "indefinite"
1130
+ }
1131
+ )
1132
+ ]
1133
+ },
1134
+ `stm${i}`
1135
+ ))
1136
+ ]
1137
+ }
1138
+ )
1139
+ ] }),
1140
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
1141
+ );
1106
1142
  }
1107
1143
  ),
1108
1144
  { displayName: "NtdIconSteampunk" }
@@ -1112,13 +1148,15 @@ const NtdIconFrost = /* @__PURE__ */ Object.assign(
1112
1148
  ({
1113
1149
  children,
1114
1150
  animate = true,
1115
- duration = 2,
1151
+ duration: durationProp,
1152
+ animationSpeed: animationSpeed$1,
1116
1153
  intensity = "normal",
1117
1154
  crystalColor = "#bae6fd",
1118
1155
  glowColor = "#38bdf8",
1119
1156
  className,
1120
1157
  style
1121
1158
  }, ref) => {
1159
+ const duration = durationProp ?? 2;
1122
1160
  const uid = React.useId().replace(/[^a-zA-Z0-9]/g, "_");
1123
1161
  const glowFilterId = `ntd_frost_${uid}`;
1124
1162
  const crystalDefs = [
@@ -1175,124 +1213,127 @@ const NtdIconFrost = /* @__PURE__ */ Object.assign(
1175
1213
  { cx: 14, cy: 96, r: 1 },
1176
1214
  { cx: 86, cy: 96, r: 1.1 }
1177
1215
  ];
1178
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1179
- /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("filter", { id: glowFilterId, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "6" }) }) }) }),
1180
- /* @__PURE__ */ jsxRuntime.jsxs(
1181
- "svg",
1182
- {
1183
- viewBox: "0 0 100 100",
1184
- style: { ...overlayBase, inset: "-25%", width: "150%", height: "150%", zIndex: 0 },
1185
- "aria-hidden": true,
1186
- children: [
1187
- /* @__PURE__ */ jsxRuntime.jsx(
1188
- "circle",
1189
- {
1190
- cx: "50",
1191
- cy: "50",
1192
- r: "30",
1193
- fill: glowColor,
1194
- opacity: 0.07,
1195
- filter: `url(#${glowFilterId})`,
1196
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1197
- "animate",
1198
- {
1199
- attributeName: "opacity",
1200
- values: "0.04;0.11;0.04",
1201
- dur: "4s",
1202
- repeatCount: "indefinite"
1203
- }
1204
- )
1205
- }
1206
- ),
1207
- allArms.map((arm, i) => /* @__PURE__ */ jsxRuntime.jsx(
1208
- "line",
1209
- {
1210
- x1: arm.x1,
1211
- y1: arm.y1,
1212
- x2: arm.x2,
1213
- y2: arm.y2,
1214
- stroke: crystalColor,
1215
- strokeWidth: "0.9",
1216
- strokeLinecap: "round",
1217
- opacity: animate ? 0 : 0.7,
1218
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1219
- "animate",
1220
- {
1221
- attributeName: "opacity",
1222
- from: "0",
1223
- to: "0.7",
1224
- dur: `${duration * 0.4}s`,
1225
- begin: `${arm.delay.toFixed(2)}s`,
1226
- fill: "freeze"
1227
- }
1228
- )
1229
- },
1230
- `arm${i}`
1231
- )),
1232
- allTicks.map((tick, i) => /* @__PURE__ */ jsxRuntime.jsx(
1233
- "line",
1234
- {
1235
- x1: tick.x1,
1236
- y1: tick.y1,
1237
- x2: tick.x2,
1238
- y2: tick.y2,
1239
- stroke: crystalColor,
1240
- strokeWidth: "0.6",
1241
- strokeLinecap: "round",
1242
- opacity: animate ? 0 : 0.45,
1243
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1244
- "animate",
1245
- {
1246
- attributeName: "opacity",
1247
- from: "0",
1248
- to: "0.45",
1249
- dur: `${duration * 0.3}s`,
1250
- begin: `${tick.delay.toFixed(2)}s`,
1251
- fill: "freeze"
1252
- }
1253
- )
1254
- },
1255
- `tick${i}`
1256
- )),
1257
- sparkles.slice(0, intensity === "subtle" ? 4 : 8).map((sp, i) => /* @__PURE__ */ jsxRuntime.jsx(
1258
- "circle",
1259
- {
1260
- cx: sp.cx,
1261
- cy: sp.cy,
1262
- r: sp.r,
1263
- fill: glowColor,
1264
- opacity: animate ? 0 : 0.8,
1265
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1266
- /* @__PURE__ */ jsxRuntime.jsx(
1216
+ return animationSpeed.retimeTree(
1217
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1218
+ /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("filter", { id: glowFilterId, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "6" }) }) }) }),
1219
+ /* @__PURE__ */ jsxRuntime.jsxs(
1220
+ "svg",
1221
+ {
1222
+ viewBox: "0 0 100 100",
1223
+ style: { ...overlayBase, inset: "-25%", width: "150%", height: "150%", zIndex: 0 },
1224
+ "aria-hidden": true,
1225
+ children: [
1226
+ /* @__PURE__ */ jsxRuntime.jsx(
1227
+ "circle",
1228
+ {
1229
+ cx: "50",
1230
+ cy: "50",
1231
+ r: "30",
1232
+ fill: glowColor,
1233
+ opacity: 0.07,
1234
+ filter: `url(#${glowFilterId})`,
1235
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1236
+ "animate",
1237
+ {
1238
+ attributeName: "opacity",
1239
+ values: "0.04;0.11;0.04",
1240
+ dur: "4s",
1241
+ repeatCount: "indefinite"
1242
+ }
1243
+ )
1244
+ }
1245
+ ),
1246
+ allArms.map((arm, i) => /* @__PURE__ */ jsxRuntime.jsx(
1247
+ "line",
1248
+ {
1249
+ x1: arm.x1,
1250
+ y1: arm.y1,
1251
+ x2: arm.x2,
1252
+ y2: arm.y2,
1253
+ stroke: crystalColor,
1254
+ strokeWidth: "0.9",
1255
+ strokeLinecap: "round",
1256
+ opacity: animate ? 0 : 0.7,
1257
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1267
1258
  "animate",
1268
1259
  {
1269
1260
  attributeName: "opacity",
1270
1261
  from: "0",
1271
- to: "0.8",
1272
- dur: "0.35s",
1273
- begin: `${(duration * 0.65 + i * 0.08).toFixed(2)}s`,
1262
+ to: "0.7",
1263
+ dur: `${duration * 0.4}s`,
1264
+ begin: `${arm.delay.toFixed(2)}s`,
1274
1265
  fill: "freeze"
1275
1266
  }
1276
- ),
1277
- /* @__PURE__ */ jsxRuntime.jsx(
1267
+ )
1268
+ },
1269
+ `arm${i}`
1270
+ )),
1271
+ allTicks.map((tick, i) => /* @__PURE__ */ jsxRuntime.jsx(
1272
+ "line",
1273
+ {
1274
+ x1: tick.x1,
1275
+ y1: tick.y1,
1276
+ x2: tick.x2,
1277
+ y2: tick.y2,
1278
+ stroke: crystalColor,
1279
+ strokeWidth: "0.6",
1280
+ strokeLinecap: "round",
1281
+ opacity: animate ? 0 : 0.45,
1282
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1278
1283
  "animate",
1279
1284
  {
1280
1285
  attributeName: "opacity",
1281
- values: "0.3;1;0.3",
1282
- dur: `${1 + i * 0.2}s`,
1283
- repeatCount: "indefinite",
1284
- begin: `${duration}s`
1286
+ from: "0",
1287
+ to: "0.45",
1288
+ dur: `${duration * 0.3}s`,
1289
+ begin: `${tick.delay.toFixed(2)}s`,
1290
+ fill: "freeze"
1285
1291
  }
1286
1292
  )
1287
- ] })
1288
- },
1289
- `fsp${i}`
1290
- ))
1291
- ]
1292
- }
1293
- ),
1294
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children })
1295
- ] });
1293
+ },
1294
+ `tick${i}`
1295
+ )),
1296
+ sparkles.slice(0, intensity === "subtle" ? 4 : 8).map((sp, i) => /* @__PURE__ */ jsxRuntime.jsx(
1297
+ "circle",
1298
+ {
1299
+ cx: sp.cx,
1300
+ cy: sp.cy,
1301
+ r: sp.r,
1302
+ fill: glowColor,
1303
+ opacity: animate ? 0 : 0.8,
1304
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1305
+ /* @__PURE__ */ jsxRuntime.jsx(
1306
+ "animate",
1307
+ {
1308
+ attributeName: "opacity",
1309
+ from: "0",
1310
+ to: "0.8",
1311
+ dur: "0.35s",
1312
+ begin: `${(duration * 0.65 + i * 0.08).toFixed(2)}s`,
1313
+ fill: "freeze"
1314
+ }
1315
+ ),
1316
+ /* @__PURE__ */ jsxRuntime.jsx(
1317
+ "animate",
1318
+ {
1319
+ attributeName: "opacity",
1320
+ values: "0.3;1;0.3",
1321
+ dur: `${1 + i * 0.2}s`,
1322
+ repeatCount: "indefinite",
1323
+ begin: `${duration}s`
1324
+ }
1325
+ )
1326
+ ] })
1327
+ },
1328
+ `fsp${i}`
1329
+ ))
1330
+ ]
1331
+ }
1332
+ ),
1333
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children })
1334
+ ] }),
1335
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
1336
+ );
1296
1337
  }
1297
1338
  ),
1298
1339
  { displayName: "NtdIconFrost" }
@@ -1302,7 +1343,8 @@ const NtdIconPixel = /* @__PURE__ */ Object.assign(
1302
1343
  ({
1303
1344
  children,
1304
1345
  animate = true,
1305
- duration = 0.5,
1346
+ duration: durationProp,
1347
+ animationSpeed: animationSpeed$1,
1306
1348
  intensity = "normal",
1307
1349
  pixelColor = "#22d3ee",
1308
1350
  scanlineColor = "#000000",
@@ -1310,6 +1352,7 @@ const NtdIconPixel = /* @__PURE__ */ Object.assign(
1310
1352
  className,
1311
1353
  style
1312
1354
  }, ref) => {
1355
+ const duration = durationProp ?? 0.5;
1313
1356
  const uid = React.useId().replace(/[^a-zA-Z0-9]/g, "_");
1314
1357
  const scanAnimName = `ntd_pixel_scan_${uid}`;
1315
1358
  const glitchAnimName = `ntd_pixel_glitch_${uid}`;
@@ -1347,8 +1390,9 @@ const NtdIconPixel = /* @__PURE__ */ Object.assign(
1347
1390
  { x: 48, y: 96 }
1348
1391
  ] : [];
1349
1392
  const allPixels = intensity === "subtle" ? basePixels.filter((_, i) => i % 2 === 0) : [...basePixels, ...extraPixels];
1350
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1351
- animate && /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
1393
+ return animationSpeed.retimeTree(
1394
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1395
+ animate && /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
1352
1396
  @keyframes ${scanAnimName} {
1353
1397
  from { transform: translateY(-100%); }
1354
1398
  to { transform: translateY(200%); }
@@ -1360,74 +1404,76 @@ const NtdIconPixel = /* @__PURE__ */ Object.assign(
1360
1404
  96% { transform: translate(-1px, 2px); clip-path: none; }
1361
1405
  }
1362
1406
  ` }),
1363
- /* @__PURE__ */ jsxRuntime.jsx(
1364
- "svg",
1365
- {
1366
- viewBox: "0 0 100 100",
1367
- style: { ...overlayBase, inset: "-5%", width: "110%", height: "110%", zIndex: 2 },
1368
- "aria-hidden": true,
1369
- children: allPixels.map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
1370
- "rect",
1371
- {
1372
- x: p.x,
1373
- y: p.y,
1374
- width: SZ - 0.5,
1375
- height: SZ - 0.5,
1376
- fill: pixelColor,
1377
- opacity: 0.75,
1378
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1379
- "animate",
1380
- {
1381
- attributeName: "opacity",
1382
- values: "0.3;1;0.3",
1383
- dur: `${0.7 + i % 5 * 0.17}s`,
1384
- repeatCount: "indefinite",
1385
- begin: `${(i * 0.06 % 1).toFixed(2)}s`
1386
- }
1387
- )
1407
+ /* @__PURE__ */ jsxRuntime.jsx(
1408
+ "svg",
1409
+ {
1410
+ viewBox: "0 0 100 100",
1411
+ style: { ...overlayBase, inset: "-5%", width: "110%", height: "110%", zIndex: 2 },
1412
+ "aria-hidden": true,
1413
+ children: allPixels.map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
1414
+ "rect",
1415
+ {
1416
+ x: p.x,
1417
+ y: p.y,
1418
+ width: SZ - 0.5,
1419
+ height: SZ - 0.5,
1420
+ fill: pixelColor,
1421
+ opacity: 0.75,
1422
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1423
+ "animate",
1424
+ {
1425
+ attributeName: "opacity",
1426
+ values: "0.3;1;0.3",
1427
+ dur: `${0.7 + i % 5 * 0.17}s`,
1428
+ repeatCount: "indefinite",
1429
+ begin: `${(i * 0.06 % 1).toFixed(2)}s`
1430
+ }
1431
+ )
1432
+ },
1433
+ `px${i}`
1434
+ ))
1435
+ }
1436
+ ),
1437
+ /* @__PURE__ */ jsxRuntime.jsx(
1438
+ "span",
1439
+ {
1440
+ style: {
1441
+ display: "inline-flex",
1442
+ position: "relative",
1443
+ zIndex: 1,
1444
+ ...animate && glitchEffect ? { animation: `${glitchAnimName} 4s infinite` } : {}
1388
1445
  },
1389
- `px${i}`
1390
- ))
1391
- }
1392
- ),
1393
- /* @__PURE__ */ jsxRuntime.jsx(
1394
- "span",
1395
- {
1396
- style: {
1397
- display: "inline-flex",
1398
- position: "relative",
1399
- zIndex: 1,
1400
- ...animate && glitchEffect ? { animation: `${glitchAnimName} 4s infinite` } : {}
1401
- },
1402
- children
1403
- }
1404
- ),
1405
- animate && /* @__PURE__ */ jsxRuntime.jsx(
1406
- "span",
1407
- {
1408
- style: {
1409
- position: "absolute",
1410
- inset: 0,
1411
- overflow: "hidden",
1412
- pointerEvents: "none",
1413
- zIndex: 3,
1414
- background: `repeating-linear-gradient(0deg, transparent, transparent 3px, ${scanlineColor}1a 3px, ${scanlineColor}1a 4px)`
1415
- },
1416
- children: /* @__PURE__ */ jsxRuntime.jsx(
1417
- "span",
1418
- {
1419
- style: {
1420
- display: "block",
1421
- width: "100%",
1422
- height: "30%",
1423
- background: `linear-gradient(transparent, ${pixelColor}20, transparent)`,
1424
- animation: `${scanAnimName} ${duration + 2}s linear infinite`
1446
+ children
1447
+ }
1448
+ ),
1449
+ animate && /* @__PURE__ */ jsxRuntime.jsx(
1450
+ "span",
1451
+ {
1452
+ style: {
1453
+ position: "absolute",
1454
+ inset: 0,
1455
+ overflow: "hidden",
1456
+ pointerEvents: "none",
1457
+ zIndex: 3,
1458
+ background: `repeating-linear-gradient(0deg, transparent, transparent 3px, ${scanlineColor}1a 3px, ${scanlineColor}1a 4px)`
1459
+ },
1460
+ children: /* @__PURE__ */ jsxRuntime.jsx(
1461
+ "span",
1462
+ {
1463
+ style: {
1464
+ display: "block",
1465
+ width: "100%",
1466
+ height: "30%",
1467
+ background: `linear-gradient(transparent, ${pixelColor}20, transparent)`,
1468
+ animation: `${scanAnimName} ${duration + 2}s linear infinite`
1469
+ }
1425
1470
  }
1426
- }
1427
- )
1428
- }
1429
- )
1430
- ] });
1471
+ )
1472
+ }
1473
+ )
1474
+ ] }),
1475
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
1476
+ );
1431
1477
  }
1432
1478
  ),
1433
1479
  { displayName: "NtdIconPixel" }
@@ -1437,7 +1483,8 @@ const NtdIconOrganic = /* @__PURE__ */ Object.assign(
1437
1483
  ({
1438
1484
  children,
1439
1485
  animate = true,
1440
- duration = 3,
1486
+ duration: durationProp,
1487
+ animationSpeed: animationSpeed$1,
1441
1488
  intensity = "normal",
1442
1489
  cellColor = "#86efac",
1443
1490
  membraneColor = "#4ade80",
@@ -1445,6 +1492,7 @@ const NtdIconOrganic = /* @__PURE__ */ Object.assign(
1445
1492
  className,
1446
1493
  style
1447
1494
  }, ref) => {
1495
+ const duration = durationProp ?? 3;
1448
1496
  const uid = React.useId().replace(/[^a-zA-Z0-9]/g, "_");
1449
1497
  const blobFilterId = `ntd_org_${uid}`;
1450
1498
  const cells = [
@@ -1474,125 +1522,128 @@ const NtdIconOrganic = /* @__PURE__ */ Object.assign(
1474
1522
  { cx: 60, cy: 95, r: 1.5 }
1475
1523
  ];
1476
1524
  const bubbleCount = intensity === "subtle" ? 2 : intensity === "dense" ? 6 : 4;
1477
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1478
- /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("filter", { id: blobFilterId, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "4" }) }) }) }),
1479
- /* @__PURE__ */ jsxRuntime.jsxs(
1480
- "svg",
1481
- {
1482
- viewBox: "0 0 100 100",
1483
- style: { ...overlayBase, inset: "-25%", width: "150%", height: "150%", zIndex: 0 },
1484
- "aria-hidden": true,
1485
- children: [
1486
- cells.map((c, i) => /* @__PURE__ */ jsxRuntime.jsx(
1487
- "circle",
1488
- {
1489
- cx: c.cx,
1490
- cy: c.cy,
1491
- r: c.r,
1492
- fill: c.color,
1493
- opacity: animate ? 0 : c.op,
1494
- filter: `url(#${blobFilterId})`,
1495
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1496
- /* @__PURE__ */ jsxRuntime.jsx(
1497
- "animate",
1498
- {
1499
- attributeName: "opacity",
1500
- from: "0",
1501
- to: `${c.op}`,
1502
- dur: `${duration * 0.55}s`,
1503
- begin: `${(i * 0.2).toFixed(2)}s`,
1504
- fill: "freeze"
1505
- }
1506
- ),
1507
- /* @__PURE__ */ jsxRuntime.jsx(
1508
- "animate",
1509
- {
1510
- attributeName: "r",
1511
- values: `${c.r};${c.r * 1.3};${c.r}`,
1512
- dur: c.pd,
1513
- repeatCount: "indefinite",
1514
- begin: `${duration}s`
1515
- }
1516
- ),
1517
- /* @__PURE__ */ jsxRuntime.jsx(
1518
- "animate",
1519
- {
1520
- attributeName: "opacity",
1521
- values: `${c.op};${c.op * 1.7};${c.op}`,
1522
- dur: c.pd,
1523
- repeatCount: "indefinite",
1524
- begin: `${duration}s`
1525
- }
1526
- )
1527
- ] })
1528
- },
1529
- `oc${i}`
1530
- )),
1531
- intensity !== "subtle" && [
1532
- { cx: 8, cy: 8, r: 10 },
1533
- { cx: 92, cy: 92, r: 10 }
1534
- ].map((ring, i) => /* @__PURE__ */ jsxRuntime.jsx(
1535
- "circle",
1536
- {
1537
- cx: ring.cx,
1538
- cy: ring.cy,
1539
- r: ring.r,
1540
- fill: "none",
1541
- stroke: membraneColor,
1542
- strokeWidth: "0.7",
1543
- opacity: animate ? 0 : 0.35,
1544
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1545
- "animate",
1546
- {
1547
- attributeName: "opacity",
1548
- from: "0",
1549
- to: "0.35",
1550
- dur: `${duration * 0.7}s`,
1551
- fill: "freeze"
1552
- }
1553
- )
1554
- },
1555
- `ring${i}`
1556
- )),
1557
- bubbles.slice(0, bubbleCount).map((b, i) => /* @__PURE__ */ jsxRuntime.jsx(
1558
- "circle",
1559
- {
1560
- cx: b.cx,
1561
- cy: b.cy,
1562
- r: b.r,
1563
- fill: nucleusColor,
1564
- opacity: animate ? 0 : 0.28,
1565
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1566
- /* @__PURE__ */ jsxRuntime.jsx(
1525
+ return animationSpeed.retimeTree(
1526
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1527
+ /* @__PURE__ */ jsxRuntime.jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("filter", { id: blobFilterId, children: /* @__PURE__ */ jsxRuntime.jsx("feGaussianBlur", { stdDeviation: "4" }) }) }) }),
1528
+ /* @__PURE__ */ jsxRuntime.jsxs(
1529
+ "svg",
1530
+ {
1531
+ viewBox: "0 0 100 100",
1532
+ style: { ...overlayBase, inset: "-25%", width: "150%", height: "150%", zIndex: 0 },
1533
+ "aria-hidden": true,
1534
+ children: [
1535
+ cells.map((c, i) => /* @__PURE__ */ jsxRuntime.jsx(
1536
+ "circle",
1537
+ {
1538
+ cx: c.cx,
1539
+ cy: c.cy,
1540
+ r: c.r,
1541
+ fill: c.color,
1542
+ opacity: animate ? 0 : c.op,
1543
+ filter: `url(#${blobFilterId})`,
1544
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1545
+ /* @__PURE__ */ jsxRuntime.jsx(
1546
+ "animate",
1547
+ {
1548
+ attributeName: "opacity",
1549
+ from: "0",
1550
+ to: `${c.op}`,
1551
+ dur: `${duration * 0.55}s`,
1552
+ begin: `${(i * 0.2).toFixed(2)}s`,
1553
+ fill: "freeze"
1554
+ }
1555
+ ),
1556
+ /* @__PURE__ */ jsxRuntime.jsx(
1557
+ "animate",
1558
+ {
1559
+ attributeName: "r",
1560
+ values: `${c.r};${c.r * 1.3};${c.r}`,
1561
+ dur: c.pd,
1562
+ repeatCount: "indefinite",
1563
+ begin: `${duration}s`
1564
+ }
1565
+ ),
1566
+ /* @__PURE__ */ jsxRuntime.jsx(
1567
+ "animate",
1568
+ {
1569
+ attributeName: "opacity",
1570
+ values: `${c.op};${c.op * 1.7};${c.op}`,
1571
+ dur: c.pd,
1572
+ repeatCount: "indefinite",
1573
+ begin: `${duration}s`
1574
+ }
1575
+ )
1576
+ ] })
1577
+ },
1578
+ `oc${i}`
1579
+ )),
1580
+ intensity !== "subtle" && [
1581
+ { cx: 8, cy: 8, r: 10 },
1582
+ { cx: 92, cy: 92, r: 10 }
1583
+ ].map((ring, i) => /* @__PURE__ */ jsxRuntime.jsx(
1584
+ "circle",
1585
+ {
1586
+ cx: ring.cx,
1587
+ cy: ring.cy,
1588
+ r: ring.r,
1589
+ fill: "none",
1590
+ stroke: membraneColor,
1591
+ strokeWidth: "0.7",
1592
+ opacity: animate ? 0 : 0.35,
1593
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1567
1594
  "animate",
1568
1595
  {
1569
1596
  attributeName: "opacity",
1570
1597
  from: "0",
1571
- to: "0.28",
1572
- dur: "0.5s",
1573
- begin: `${(duration * 0.65 + i * 0.18).toFixed(2)}s`,
1598
+ to: "0.35",
1599
+ dur: `${duration * 0.7}s`,
1574
1600
  fill: "freeze"
1575
1601
  }
1576
- ),
1577
- /* @__PURE__ */ jsxRuntime.jsx(
1578
- "animate",
1579
- {
1580
- attributeName: "cy",
1581
- values: `${b.cy};${b.cy - 5};${b.cy}`,
1582
- dur: `${2.2 + i * 0.45}s`,
1583
- repeatCount: "indefinite",
1584
- begin: `${duration}s`
1585
- }
1586
1602
  )
1587
- ] })
1588
- },
1589
- `ob${i}`
1590
- ))
1591
- ]
1592
- }
1593
- ),
1594
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children })
1595
- ] });
1603
+ },
1604
+ `ring${i}`
1605
+ )),
1606
+ bubbles.slice(0, bubbleCount).map((b, i) => /* @__PURE__ */ jsxRuntime.jsx(
1607
+ "circle",
1608
+ {
1609
+ cx: b.cx,
1610
+ cy: b.cy,
1611
+ r: b.r,
1612
+ fill: nucleusColor,
1613
+ opacity: animate ? 0 : 0.28,
1614
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1615
+ /* @__PURE__ */ jsxRuntime.jsx(
1616
+ "animate",
1617
+ {
1618
+ attributeName: "opacity",
1619
+ from: "0",
1620
+ to: "0.28",
1621
+ dur: "0.5s",
1622
+ begin: `${(duration * 0.65 + i * 0.18).toFixed(2)}s`,
1623
+ fill: "freeze"
1624
+ }
1625
+ ),
1626
+ /* @__PURE__ */ jsxRuntime.jsx(
1627
+ "animate",
1628
+ {
1629
+ attributeName: "cy",
1630
+ values: `${b.cy};${b.cy - 5};${b.cy}`,
1631
+ dur: `${2.2 + i * 0.45}s`,
1632
+ repeatCount: "indefinite",
1633
+ begin: `${duration}s`
1634
+ }
1635
+ )
1636
+ ] })
1637
+ },
1638
+ `ob${i}`
1639
+ ))
1640
+ ]
1641
+ }
1642
+ ),
1643
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children })
1644
+ ] }),
1645
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
1646
+ );
1596
1647
  }
1597
1648
  ),
1598
1649
  { displayName: "NtdIconOrganic" }
@@ -1602,7 +1653,8 @@ const NtdIconGeometric = /* @__PURE__ */ Object.assign(
1602
1653
  ({
1603
1654
  children,
1604
1655
  animate = true,
1605
- duration = 8,
1656
+ duration: durationProp,
1657
+ animationSpeed: animationSpeed$1,
1606
1658
  intensity = "normal",
1607
1659
  primaryColor = "#6366f1",
1608
1660
  secondaryColor = "#8b5cf6",
@@ -1610,6 +1662,7 @@ const NtdIconGeometric = /* @__PURE__ */ Object.assign(
1610
1662
  className,
1611
1663
  style
1612
1664
  }, ref) => {
1665
+ const duration = durationProp ?? 8;
1613
1666
  const makeTriangle = (cx, cy, r, rotDeg) => Array.from({ length: 3 }, (_, i) => {
1614
1667
  const a = (i * 120 - 90 + rotDeg) * Math.PI / 180;
1615
1668
  return `${(cx + r * Math.cos(a)).toFixed(2)},${(cy + r * Math.sin(a)).toFixed(2)}`;
@@ -1641,99 +1694,102 @@ const NtdIconGeometric = /* @__PURE__ */ Object.assign(
1641
1694
  ] : []
1642
1695
  ];
1643
1696
  const diamondPath = (cx, cy, s = 3) => `M${cx},${cy - s} L${cx + s},${cy} L${cx},${cy + s} L${cx - s},${cy}Z`;
1644
- return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1645
- /* @__PURE__ */ jsxRuntime.jsxs(
1646
- "svg",
1647
- {
1648
- viewBox: "0 0 100 100",
1649
- style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%", zIndex: 0 },
1650
- "aria-hidden": true,
1651
- children: [
1652
- rings.map((ring, i) => /* @__PURE__ */ jsxRuntime.jsx(
1653
- "circle",
1654
- {
1655
- cx: "50",
1656
- cy: "50",
1657
- r: ring.r,
1658
- fill: "none",
1659
- stroke: ring.color,
1660
- strokeWidth: "0.6",
1661
- strokeDasharray: ring.dash,
1662
- opacity: ring.op,
1663
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1664
- "animateTransform",
1665
- {
1666
- attributeName: "transform",
1667
- type: "rotate",
1668
- from: "0 50 50",
1669
- to: `${ring.dir * 360} 50 50`,
1670
- dur: `${ring.dur}s`,
1671
- repeatCount: "indefinite"
1672
- }
1673
- )
1674
- },
1675
- `rng${i}`
1676
- )),
1677
- triangles.map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
1678
- "polygon",
1679
- {
1680
- points: makeTriangle(50, 50, t.r, t.rot),
1681
- fill: "none",
1682
- stroke: t.color,
1683
- strokeWidth: "0.5",
1684
- opacity: t.op,
1685
- children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1686
- "animateTransform",
1687
- {
1688
- attributeName: "transform",
1689
- type: "rotate",
1690
- from: "0 50 50",
1691
- to: `${t.dir * 360} 50 50`,
1692
- dur: `${t.dur}s`,
1693
- repeatCount: "indefinite"
1694
- }
1695
- )
1696
- },
1697
- `tri${i}`
1698
- )),
1699
- diamonds.map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
1700
- "path",
1701
- {
1702
- d: diamondPath(d.cx, d.cy),
1703
- fill: accentColor,
1704
- opacity: animate ? 0 : 0.5,
1705
- children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1706
- /* @__PURE__ */ jsxRuntime.jsx(
1707
- "animate",
1697
+ return animationSpeed.retimeTree(
1698
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className, style: { ...wrapperBase, ...style }, children: [
1699
+ /* @__PURE__ */ jsxRuntime.jsxs(
1700
+ "svg",
1701
+ {
1702
+ viewBox: "0 0 100 100",
1703
+ style: { ...overlayBase, inset: "-30%", width: "160%", height: "160%", zIndex: 0 },
1704
+ "aria-hidden": true,
1705
+ children: [
1706
+ rings.map((ring, i) => /* @__PURE__ */ jsxRuntime.jsx(
1707
+ "circle",
1708
+ {
1709
+ cx: "50",
1710
+ cy: "50",
1711
+ r: ring.r,
1712
+ fill: "none",
1713
+ stroke: ring.color,
1714
+ strokeWidth: "0.6",
1715
+ strokeDasharray: ring.dash,
1716
+ opacity: ring.op,
1717
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1718
+ "animateTransform",
1708
1719
  {
1709
- attributeName: "opacity",
1710
- from: "0",
1711
- to: "0.5",
1712
- dur: `${duration * 0.25}s`,
1713
- begin: `${(i * 0.09).toFixed(2)}s`,
1714
- fill: "freeze"
1720
+ attributeName: "transform",
1721
+ type: "rotate",
1722
+ from: "0 50 50",
1723
+ to: `${ring.dir * 360} 50 50`,
1724
+ dur: `${ring.dur}s`,
1725
+ repeatCount: "indefinite"
1715
1726
  }
1716
- ),
1717
- /* @__PURE__ */ jsxRuntime.jsx(
1727
+ )
1728
+ },
1729
+ `rng${i}`
1730
+ )),
1731
+ triangles.map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
1732
+ "polygon",
1733
+ {
1734
+ points: makeTriangle(50, 50, t.r, t.rot),
1735
+ fill: "none",
1736
+ stroke: t.color,
1737
+ strokeWidth: "0.5",
1738
+ opacity: t.op,
1739
+ children: animate && /* @__PURE__ */ jsxRuntime.jsx(
1718
1740
  "animateTransform",
1719
1741
  {
1720
1742
  attributeName: "transform",
1721
1743
  type: "rotate",
1722
- from: `0 ${d.cx} ${d.cy}`,
1723
- to: `360 ${d.cx} ${d.cy}`,
1724
- dur: `${3 + i * 0.6}s`,
1744
+ from: "0 50 50",
1745
+ to: `${t.dir * 360} 50 50`,
1746
+ dur: `${t.dur}s`,
1725
1747
  repeatCount: "indefinite"
1726
1748
  }
1727
1749
  )
1728
- ] })
1729
- },
1730
- `dm${i}`
1731
- ))
1732
- ]
1733
- }
1734
- ),
1735
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children })
1736
- ] });
1750
+ },
1751
+ `tri${i}`
1752
+ )),
1753
+ diamonds.map((d, i) => /* @__PURE__ */ jsxRuntime.jsx(
1754
+ "path",
1755
+ {
1756
+ d: diamondPath(d.cx, d.cy),
1757
+ fill: accentColor,
1758
+ opacity: animate ? 0 : 0.5,
1759
+ children: animate && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1760
+ /* @__PURE__ */ jsxRuntime.jsx(
1761
+ "animate",
1762
+ {
1763
+ attributeName: "opacity",
1764
+ from: "0",
1765
+ to: "0.5",
1766
+ dur: `${duration * 0.25}s`,
1767
+ begin: `${(i * 0.09).toFixed(2)}s`,
1768
+ fill: "freeze"
1769
+ }
1770
+ ),
1771
+ /* @__PURE__ */ jsxRuntime.jsx(
1772
+ "animateTransform",
1773
+ {
1774
+ attributeName: "transform",
1775
+ type: "rotate",
1776
+ from: `0 ${d.cx} ${d.cy}`,
1777
+ to: `360 ${d.cx} ${d.cy}`,
1778
+ dur: `${3 + i * 0.6}s`,
1779
+ repeatCount: "indefinite"
1780
+ }
1781
+ )
1782
+ ] })
1783
+ },
1784
+ `dm${i}`
1785
+ ))
1786
+ ]
1787
+ }
1788
+ ),
1789
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-flex", position: "relative", zIndex: 1 }, children })
1790
+ ] }),
1791
+ animationSpeed.durationScale(durationProp !== void 0, animationSpeed$1)
1792
+ );
1737
1793
  }
1738
1794
  ),
1739
1795
  { displayName: "NtdIconGeometric" }