@animicons/react-native 0.1.1 → 0.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.
- package/dist/index.esm.js +277 -47
- package/dist/index.js +323 -93
- package/package.json +15 -6
package/dist/index.esm.js
CHANGED
|
@@ -1,11 +1,216 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React15, { useEffect, useCallback } from 'react';
|
|
2
2
|
import { Circle, Path, Svg } from 'react-native-svg';
|
|
3
3
|
import Animated4, { useAnimatedProps, useSharedValue, withRepeat, withTiming, Easing, withDelay, runOnJS, cancelAnimation, useAnimatedStyle, withSequence } from 'react-native-reanimated';
|
|
4
|
-
import { DURATION, PulsePaths, CheckPaths, LoaderPaths, UploadPaths, WifiPaths, BellPaths, StarPaths, HeartPaths, ECGPaths, HeartRatePaths, LungsPaths, PillPaths, ThermometerPaths, DNAPaths, SyringePaths, BrainPaths, BloodDropPaths, StepsPaths, SleepPaths, OxygenPaths, MedkitPaths } from '@animicons/shared';
|
|
5
4
|
import { Pressable } from 'react-native';
|
|
6
5
|
|
|
7
6
|
// src/icons/ui/Pulse.tsx
|
|
8
7
|
|
|
8
|
+
// ../shared/src/tokens/timing.ts
|
|
9
|
+
var DURATION = {
|
|
10
|
+
slow: { short: 800, medium: 2e3, long: 4e3, stagger: 600 },
|
|
11
|
+
normal: { short: 400, medium: 1e3, long: 2e3, stagger: 300 },
|
|
12
|
+
fast: { short: 200, medium: 500, long: 1e3, stagger: 150 }
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
// ../shared/src/paths/ui/Pulse.ts
|
|
16
|
+
var PulsePaths = {
|
|
17
|
+
viewBox: "0 0 48 48",
|
|
18
|
+
defaultColor: "#ef4444",
|
|
19
|
+
defaultStrokeWidth: 2};
|
|
20
|
+
|
|
21
|
+
// ../shared/src/paths/ui/Check.ts
|
|
22
|
+
var CheckPaths = {
|
|
23
|
+
viewBox: "0 0 48 48",
|
|
24
|
+
defaultColor: "#22c55e",
|
|
25
|
+
defaultStrokeWidth: 2.5,
|
|
26
|
+
circle: "M24 4 a20 20 0 1 1 0 40 a20 20 0 1 1 0 -40",
|
|
27
|
+
check: "M14 24 l7 7 l13 -13"
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
// ../shared/src/paths/ui/Loader.ts
|
|
31
|
+
var LoaderPaths = {
|
|
32
|
+
viewBox: "0 0 48 48",
|
|
33
|
+
defaultColor: "#6366f1",
|
|
34
|
+
defaultStrokeWidth: 3,
|
|
35
|
+
arc: "M24 6 a18 18 0 0 1 18 18"
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
// ../shared/src/paths/ui/Upload.ts
|
|
39
|
+
var UploadPaths = {
|
|
40
|
+
viewBox: "0 0 48 48",
|
|
41
|
+
defaultColor: "#3b82f6",
|
|
42
|
+
defaultStrokeWidth: 2.5,
|
|
43
|
+
arrow: "M24 32 L24 10 M14 20 L24 10 L34 20",
|
|
44
|
+
bar: "M10 38 L38 38"};
|
|
45
|
+
|
|
46
|
+
// ../shared/src/paths/ui/Wifi.ts
|
|
47
|
+
var WifiPaths = {
|
|
48
|
+
viewBox: "0 0 48 48",
|
|
49
|
+
defaultColor: "#0ea5e9",
|
|
50
|
+
defaultStrokeWidth: 2.5,
|
|
51
|
+
arc1: "M8 22 Q24 8 40 22",
|
|
52
|
+
arc2: "M13 28 Q24 17 35 28",
|
|
53
|
+
arc3: "M18 34 Q24 27 30 34"};
|
|
54
|
+
|
|
55
|
+
// ../shared/src/paths/ui/Bell.ts
|
|
56
|
+
var BellPaths = {
|
|
57
|
+
viewBox: "0 0 48 48",
|
|
58
|
+
defaultColor: "#f59e0b",
|
|
59
|
+
defaultStrokeWidth: 2,
|
|
60
|
+
bell: "M12 32 C12 20 18 12 24 12 C30 12 36 20 36 32 Z",
|
|
61
|
+
clapper: "M20 36 Q24 40 28 36",
|
|
62
|
+
handle: "M24 8 L24 12"};
|
|
63
|
+
|
|
64
|
+
// ../shared/src/paths/ui/Star.ts
|
|
65
|
+
var StarPaths = {
|
|
66
|
+
viewBox: "0 0 48 48",
|
|
67
|
+
defaultColor: "#f59e0b",
|
|
68
|
+
defaultStrokeWidth: 2,
|
|
69
|
+
star: "M24 6 L28.5 18 L42 18 L31.5 26 L35.5 38 L24 30 L12.5 38 L16.5 26 L6 18 L19.5 18 Z",
|
|
70
|
+
sparkle1: "M8 8 L10 6 L12 8 L10 10 Z",
|
|
71
|
+
sparkle2: "M36 6 L38 4 L40 6 L38 8 Z",
|
|
72
|
+
sparkle3: "M40 28 L42 26 L44 28 L42 30 Z"
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
// ../shared/src/paths/ui/Heart.ts
|
|
76
|
+
var HeartPaths = {
|
|
77
|
+
viewBox: "0 0 48 48",
|
|
78
|
+
defaultColor: "#ef4444",
|
|
79
|
+
defaultStrokeWidth: 2,
|
|
80
|
+
heart: "M24 38 C24 38 6 26 6 16 C6 10 11 6 16 6 C19.5 6 22.5 8 24 11 C25.5 8 28.5 6 32 6 C37 6 42 10 42 16 C42 26 24 38 24 38 Z",
|
|
81
|
+
glow: "M24 40 C24 40 4 27 4 15 C4 8 9 4 15 4 C19 4 22 6 24 10 C26 6 29 4 33 4 C39 4 44 8 44 15 C44 27 24 40 24 40 Z"
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
// ../shared/src/paths/healthcare/ECG.ts
|
|
85
|
+
var ECGPaths = {
|
|
86
|
+
viewBox: "0 0 48 48",
|
|
87
|
+
defaultColor: "#ef4444",
|
|
88
|
+
defaultStrokeWidth: 2,
|
|
89
|
+
line: "M4 24 L12 24 L16 12 L20 36 L24 18 L28 30 L32 24 L44 24"
|
|
90
|
+
};
|
|
91
|
+
|
|
92
|
+
// ../shared/src/paths/healthcare/HeartRate.ts
|
|
93
|
+
var HeartRatePaths = {
|
|
94
|
+
viewBox: "0 0 48 48",
|
|
95
|
+
defaultColor: "#ef4444",
|
|
96
|
+
defaultStrokeWidth: 2,
|
|
97
|
+
heart: "M24 38 C24 38 6 26 6 16 C6 10 11 6 16 6 C19.5 6 22.5 8 24 11 C25.5 8 28.5 6 32 6 C37 6 42 10 42 16 C42 26 24 38 24 38 Z"};
|
|
98
|
+
|
|
99
|
+
// ../shared/src/paths/healthcare/Lungs.ts
|
|
100
|
+
var LungsPaths = {
|
|
101
|
+
viewBox: "0 0 48 48",
|
|
102
|
+
defaultColor: "#ec4899",
|
|
103
|
+
defaultStrokeWidth: 2,
|
|
104
|
+
leftLobe: "M24 10 C24 10 10 14 8 26 C6 36 12 42 18 40 C22 38 24 34 24 34",
|
|
105
|
+
rightLobe: "M24 10 C24 10 38 14 40 26 C42 36 36 42 30 40 C26 38 24 34 24 34",
|
|
106
|
+
trunk: "M24 6 L24 18"
|
|
107
|
+
};
|
|
108
|
+
|
|
109
|
+
// ../shared/src/paths/healthcare/Pill.ts
|
|
110
|
+
var PillPaths = {
|
|
111
|
+
viewBox: "0 0 48 48",
|
|
112
|
+
defaultColor: "#8b5cf6",
|
|
113
|
+
defaultStrokeWidth: 2,
|
|
114
|
+
capsule: "M14 20 Q14 10 24 10 Q34 10 34 20 L34 28 Q34 38 24 38 Q14 38 14 28 Z",
|
|
115
|
+
divider: "M14 24 L34 24",
|
|
116
|
+
shine: "M18 14 Q20 12 24 13"
|
|
117
|
+
};
|
|
118
|
+
|
|
119
|
+
// ../shared/src/paths/healthcare/Thermometer.ts
|
|
120
|
+
var ThermometerPaths = {
|
|
121
|
+
viewBox: "0 0 48 48",
|
|
122
|
+
defaultColor: "#ef4444",
|
|
123
|
+
defaultStrokeWidth: 2,
|
|
124
|
+
tube: "M20 8 L20 30 Q20 38 24 38 Q28 38 28 30 L28 8 Q28 6 24 6 Q20 6 20 8 Z",
|
|
125
|
+
mercury: "M22 30 L22 22 L26 22 L26 30"};
|
|
126
|
+
|
|
127
|
+
// ../shared/src/paths/healthcare/DNA.ts
|
|
128
|
+
var DNAPaths = {
|
|
129
|
+
viewBox: "0 0 48 48",
|
|
130
|
+
defaultColor: "#6366f1",
|
|
131
|
+
defaultStrokeWidth: 2,
|
|
132
|
+
strand1: "M16 6 Q32 14 16 22 Q32 30 16 38 Q32 46 16 48",
|
|
133
|
+
strand2: "M32 6 Q16 14 32 22 Q16 30 32 38 Q16 46 32 48",
|
|
134
|
+
rung1: "M19 12 L29 12",
|
|
135
|
+
rung2: "M19 24 L29 24",
|
|
136
|
+
rung3: "M19 36 L29 36"
|
|
137
|
+
};
|
|
138
|
+
|
|
139
|
+
// ../shared/src/paths/healthcare/Syringe.ts
|
|
140
|
+
var SyringePaths = {
|
|
141
|
+
viewBox: "0 0 48 48",
|
|
142
|
+
defaultColor: "#3b82f6",
|
|
143
|
+
defaultStrokeWidth: 2,
|
|
144
|
+
barrel: "M12 16 L36 16 L36 34 L12 34 Z",
|
|
145
|
+
plunger: "M12 22 L6 22 L6 28 L12 28",
|
|
146
|
+
needle: "M36 24 L44 24",
|
|
147
|
+
liquid: "M14 18 L30 18 L30 32 L14 32 Z",
|
|
148
|
+
drop: "M44 26 Q46 28 44 30 Q42 28 44 26 Z"
|
|
149
|
+
};
|
|
150
|
+
|
|
151
|
+
// ../shared/src/paths/healthcare/Brain.ts
|
|
152
|
+
var BrainPaths = {
|
|
153
|
+
viewBox: "0 0 48 48",
|
|
154
|
+
defaultColor: "#ec4899",
|
|
155
|
+
defaultStrokeWidth: 2,
|
|
156
|
+
left: "M24 36 C24 36 8 34 8 22 C8 14 14 8 20 10 C22 10 24 12 24 12",
|
|
157
|
+
right: "M24 36 C24 36 40 34 40 22 C40 14 34 8 28 10 C26 10 24 12 24 12",
|
|
158
|
+
synapse1: "M19 20 L21 16",
|
|
159
|
+
synapse2: "M27 16 L29 20"
|
|
160
|
+
};
|
|
161
|
+
|
|
162
|
+
// ../shared/src/paths/healthcare/BloodDrop.ts
|
|
163
|
+
var BloodDropPaths = {
|
|
164
|
+
viewBox: "0 0 48 48",
|
|
165
|
+
defaultColor: "#ef4444",
|
|
166
|
+
defaultStrokeWidth: 2,
|
|
167
|
+
drop: "M24 8 Q36 20 36 28 Q36 38 24 38 Q12 38 12 28 Q12 20 24 8 Z"};
|
|
168
|
+
|
|
169
|
+
// ../shared/src/paths/healthcare/Steps.ts
|
|
170
|
+
var StepsPaths = {
|
|
171
|
+
viewBox: "0 0 48 48",
|
|
172
|
+
defaultColor: "#10b981",
|
|
173
|
+
defaultStrokeWidth: 2,
|
|
174
|
+
foot1: "M14 28 Q12 24 14 20 Q18 18 20 22 Q22 26 20 30 Q16 32 14 28 Z",
|
|
175
|
+
foot2: "M28 20 Q26 16 28 12 Q32 10 34 14 Q36 18 34 22 Q30 24 28 20 Z",
|
|
176
|
+
toe1a: "M12 20 Q10 18 12 17",
|
|
177
|
+
toe1b: "M14 19 Q13 17 15 16",
|
|
178
|
+
toe2a: "M26 12 Q24 10 26 9",
|
|
179
|
+
toe2b: "M28 11 Q27 9 29 8"
|
|
180
|
+
};
|
|
181
|
+
|
|
182
|
+
// ../shared/src/paths/healthcare/Sleep.ts
|
|
183
|
+
var SleepPaths = {
|
|
184
|
+
viewBox: "0 0 48 48",
|
|
185
|
+
defaultColor: "#6366f1",
|
|
186
|
+
defaultStrokeWidth: 2,
|
|
187
|
+
moon: "M28 8 Q20 12 20 24 Q20 36 28 40 Q16 40 10 30 Q4 20 10 12 Q16 4 28 8 Z",
|
|
188
|
+
star1: "M36 10 L37 8 L38 10 L40 11 L38 12 L37 14 L36 12 L34 11 Z",
|
|
189
|
+
star2: "M40 22 L41 20 L42 22 L44 23 L42 24 L41 26 L40 24 L38 23 Z",
|
|
190
|
+
z1: "M32 26 L38 26 L32 32 L38 32",
|
|
191
|
+
z2: "M36 20 L40 20 L36 24 L40 24"
|
|
192
|
+
};
|
|
193
|
+
|
|
194
|
+
// ../shared/src/paths/healthcare/Oxygen.ts
|
|
195
|
+
var OxygenPaths = {
|
|
196
|
+
viewBox: "0 0 48 48",
|
|
197
|
+
defaultColor: "#3b82f6",
|
|
198
|
+
defaultStrokeWidth: 2,
|
|
199
|
+
orbit: "M24 24 m-16 0 a16 16 0 1 0 32 0 a16 16 0 1 0 -32 0",
|
|
200
|
+
bond: "M22 20 L26 20"
|
|
201
|
+
};
|
|
202
|
+
|
|
203
|
+
// ../shared/src/paths/healthcare/Medkit.ts
|
|
204
|
+
var MedkitPaths = {
|
|
205
|
+
viewBox: "0 0 48 48",
|
|
206
|
+
defaultColor: "#ef4444",
|
|
207
|
+
defaultStrokeWidth: 2,
|
|
208
|
+
box: "M8 16 Q8 12 12 12 L36 12 Q40 12 40 16 L40 38 Q40 42 36 42 L12 42 Q8 42 8 38 Z",
|
|
209
|
+
handle: "M18 12 L18 8 Q18 6 20 6 L28 6 Q30 6 30 8 L30 12",
|
|
210
|
+
crossV: "M24 20 L24 34",
|
|
211
|
+
crossH: "M17 27 L31 27"
|
|
212
|
+
};
|
|
213
|
+
|
|
9
214
|
// src/utils/resolveStyle.ts
|
|
10
215
|
function resolveStyle(props, defaults) {
|
|
11
216
|
const base = props.color ?? defaults.defaultColor;
|
|
@@ -17,6 +222,8 @@ function resolveStyle(props, defaults) {
|
|
|
17
222
|
strokeWidth: props.strokeWidth ?? defaults.defaultStrokeWidth
|
|
18
223
|
};
|
|
19
224
|
}
|
|
225
|
+
|
|
226
|
+
// src/utils/animDuration.ts
|
|
20
227
|
function getAnimDuration(speed = "normal") {
|
|
21
228
|
return DURATION[speed];
|
|
22
229
|
}
|
|
@@ -57,7 +264,7 @@ var Pulse = ({
|
|
|
57
264
|
const ap1 = useAnimatedProps(() => ({ r: ring1.r.value, opacity: ring1.opacity.value }));
|
|
58
265
|
const ap2 = useAnimatedProps(() => ({ r: ring2.r.value, opacity: ring2.opacity.value }));
|
|
59
266
|
const ap3 = useAnimatedProps(() => ({ r: ring3.r.value, opacity: ring3.opacity.value }));
|
|
60
|
-
return /* @__PURE__ */
|
|
267
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: PulsePaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedCircle, { animatedProps: ap1, cx: "24", cy: "24", stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none" }), /* @__PURE__ */ React15.createElement(AnimatedCircle, { animatedProps: ap2, cx: "24", cy: "24", stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none" }), /* @__PURE__ */ React15.createElement(AnimatedCircle, { animatedProps: ap3, cx: "24", cy: "24", stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none" }), /* @__PURE__ */ React15.createElement(Circle, { cx: "24", cy: "24", r: 3, fill: s.stroke, opacity: s.opacity }));
|
|
61
268
|
};
|
|
62
269
|
var AnimatedPath = Animated4.createAnimatedComponent(Path);
|
|
63
270
|
var Check = ({
|
|
@@ -91,7 +298,7 @@ var Check = ({
|
|
|
91
298
|
}, [autoPlay, loop, speed]);
|
|
92
299
|
const circleProps = useAnimatedProps(() => ({ strokeDashoffset: circleProgress.value }));
|
|
93
300
|
const checkProps = useAnimatedProps(() => ({ strokeDashoffset: checkProgress.value }));
|
|
94
|
-
return /* @__PURE__ */
|
|
301
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: CheckPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath, { animatedProps: circleProps, d: CheckPaths.circle, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeDasharray: 126, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath, { animatedProps: checkProps, d: CheckPaths.check, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeDasharray: 30, strokeLinecap: "round", opacity: s.opacity }));
|
|
95
302
|
};
|
|
96
303
|
var AnimatedPath2 = Animated4.createAnimatedComponent(Path);
|
|
97
304
|
var Loader = ({
|
|
@@ -128,7 +335,7 @@ var Loader = ({
|
|
|
128
335
|
originX: 24,
|
|
129
336
|
originY: 24
|
|
130
337
|
}));
|
|
131
|
-
return /* @__PURE__ */
|
|
338
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: LoaderPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(
|
|
132
339
|
AnimatedPath2,
|
|
133
340
|
{
|
|
134
341
|
animatedProps,
|
|
@@ -173,7 +380,7 @@ var Upload = ({
|
|
|
173
380
|
}, [autoPlay, loop, speed]);
|
|
174
381
|
const arrowStyle = useAnimatedStyle(() => ({ transform: [{ translateY: translateY.value }] }));
|
|
175
382
|
const barProps = useAnimatedProps(() => ({ strokeDashoffset: barDash.value }));
|
|
176
|
-
return /* @__PURE__ */
|
|
383
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: UploadPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Animated4.View, { style: arrowStyle }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: UploadPaths.viewBox, style: { position: "absolute" } }, /* @__PURE__ */ React15.createElement(Path, { d: UploadPaths.arrow, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round", strokeLinejoin: "round", opacity: s.opacity }))), /* @__PURE__ */ React15.createElement(AnimatedPath3, { animatedProps: barProps, d: UploadPaths.bar, stroke: s.stroke, strokeWidth: s.strokeWidth, strokeLinecap: "round", fill: "none", strokeDasharray: 28, opacity: s.opacity }));
|
|
177
384
|
};
|
|
178
385
|
var AnimatedPath4 = Animated4.createAnimatedComponent(Path);
|
|
179
386
|
var Wifi = ({
|
|
@@ -215,8 +422,10 @@ var Wifi = ({
|
|
|
215
422
|
const ap1 = useAnimatedProps(() => ({ opacity: op1.value }));
|
|
216
423
|
const ap2 = useAnimatedProps(() => ({ opacity: op2.value }));
|
|
217
424
|
const ap3 = useAnimatedProps(() => ({ opacity: op3.value }));
|
|
218
|
-
return /* @__PURE__ */
|
|
425
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: WifiPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath4, { animatedProps: ap1, d: WifiPaths.arc1, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round" }), /* @__PURE__ */ React15.createElement(AnimatedPath4, { animatedProps: ap2, d: WifiPaths.arc2, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round" }), /* @__PURE__ */ React15.createElement(AnimatedPath4, { animatedProps: ap3, d: WifiPaths.arc3, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round" }), /* @__PURE__ */ React15.createElement(Circle, { cx: "24", cy: "40", r: 2, fill: s.stroke, opacity: s.opacity }));
|
|
219
426
|
};
|
|
427
|
+
var AnimatedPath5 = Animated4.createAnimatedComponent(Path);
|
|
428
|
+
var AnimatedCircle2 = Animated4.createAnimatedComponent(Circle);
|
|
220
429
|
var Bell = ({
|
|
221
430
|
size = 48,
|
|
222
431
|
autoPlay = true,
|
|
@@ -233,11 +442,12 @@ var Bell = ({
|
|
|
233
442
|
if (autoPlay) {
|
|
234
443
|
rotation.value = withRepeat(
|
|
235
444
|
withSequence(
|
|
236
|
-
withTiming(
|
|
237
|
-
withTiming(
|
|
238
|
-
withTiming(
|
|
239
|
-
withTiming(
|
|
240
|
-
withTiming(
|
|
445
|
+
withTiming(0, { duration: 0 }),
|
|
446
|
+
withTiming(15, { duration: d.long * 0.2, easing: Easing.inOut(Easing.ease) }),
|
|
447
|
+
withTiming(-15, { duration: d.long * 0.2, easing: Easing.inOut(Easing.ease) }),
|
|
448
|
+
withTiming(8, { duration: d.long * 0.2, easing: Easing.inOut(Easing.ease) }),
|
|
449
|
+
withTiming(-8, { duration: d.long * 0.2, easing: Easing.inOut(Easing.ease) }),
|
|
450
|
+
withTiming(0, { duration: d.long * 0.2, easing: Easing.inOut(Easing.ease) })
|
|
241
451
|
),
|
|
242
452
|
loop ? -1 : 1
|
|
243
453
|
);
|
|
@@ -248,13 +458,33 @@ var Bell = ({
|
|
|
248
458
|
} else {
|
|
249
459
|
cancelAnimation(rotation);
|
|
250
460
|
cancelAnimation(badgeScale);
|
|
461
|
+
rotation.value = withTiming(0, { duration: 150 });
|
|
462
|
+
badgeScale.value = withTiming(1, { duration: 150 });
|
|
251
463
|
}
|
|
252
464
|
}, [autoPlay, loop, speed]);
|
|
253
|
-
const
|
|
254
|
-
|
|
255
|
-
|
|
465
|
+
const bellProps = useAnimatedProps(() => ({
|
|
466
|
+
transform: [{ rotate: `${rotation.value}deg` }],
|
|
467
|
+
originX: 24,
|
|
468
|
+
originY: 12
|
|
469
|
+
}));
|
|
470
|
+
const clapperProps = useAnimatedProps(() => ({
|
|
471
|
+
transform: [{ rotate: `${rotation.value}deg` }],
|
|
472
|
+
originX: 24,
|
|
473
|
+
originY: 12
|
|
474
|
+
}));
|
|
475
|
+
const handleProps = useAnimatedProps(() => ({
|
|
476
|
+
transform: [{ rotate: `${rotation.value}deg` }],
|
|
477
|
+
originX: 24,
|
|
478
|
+
originY: 12
|
|
479
|
+
}));
|
|
480
|
+
const badgeProps = useAnimatedProps(() => ({
|
|
481
|
+
transform: [{ scale: badgeScale.value }],
|
|
482
|
+
originX: 34,
|
|
483
|
+
originY: 12
|
|
484
|
+
}));
|
|
485
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: BellPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath5, { animatedProps: bellProps, d: BellPaths.bell, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath5, { animatedProps: clapperProps, d: BellPaths.clapper, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath5, { animatedProps: handleProps, d: BellPaths.handle, stroke: s.stroke, strokeWidth: s.strokeWidth, strokeLinecap: "round", fill: "none", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedCircle2, { animatedProps: badgeProps, cx: 34, cy: 12, r: 5, fill: s.stroke, opacity: s.opacity }));
|
|
256
486
|
};
|
|
257
|
-
var
|
|
487
|
+
var AnimatedPath6 = Animated4.createAnimatedComponent(Path);
|
|
258
488
|
var Star = ({
|
|
259
489
|
size = 48,
|
|
260
490
|
autoPlay = true,
|
|
@@ -286,9 +516,9 @@ var Star = ({
|
|
|
286
516
|
}, [autoPlay, trigger]);
|
|
287
517
|
const starProps = useAnimatedProps(() => ({ transform: [{ scale: scaleVal.value }], originX: 24, originY: 24 }));
|
|
288
518
|
const sparkleProps = useAnimatedProps(() => ({ opacity: sparkleOp.value }));
|
|
289
|
-
return /* @__PURE__ */
|
|
519
|
+
return /* @__PURE__ */ React15.createElement(Pressable, { onPress: trigger, style }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: StarPaths.viewBox }, /* @__PURE__ */ React15.createElement(AnimatedPath6, { animatedProps: starProps, d: StarPaths.star, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath6, { animatedProps: sparkleProps, d: StarPaths.sparkle1, fill: s.stroke, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath6, { animatedProps: sparkleProps, d: StarPaths.sparkle2, fill: s.stroke, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath6, { animatedProps: sparkleProps, d: StarPaths.sparkle3, fill: s.stroke, opacity: s.opacity })));
|
|
290
520
|
};
|
|
291
|
-
var
|
|
521
|
+
var AnimatedPath7 = Animated4.createAnimatedComponent(Path);
|
|
292
522
|
var Heart = ({
|
|
293
523
|
size = 48,
|
|
294
524
|
autoPlay = true,
|
|
@@ -324,9 +554,9 @@ var Heart = ({
|
|
|
324
554
|
}, [autoPlay, loop, speed]);
|
|
325
555
|
const heartStyle = useAnimatedStyle(() => ({ transform: [{ scale: scaleVal.value }] }));
|
|
326
556
|
const glowProps = useAnimatedProps(() => ({ opacity: glowOp.value }));
|
|
327
|
-
return /* @__PURE__ */
|
|
557
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: HeartPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath7, { animatedProps: glowProps, d: HeartPaths.glow, fill: s.secondaryColor, stroke: "none" }), /* @__PURE__ */ React15.createElement(Animated4.View, { style: [{ position: "absolute" }, heartStyle] }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: HeartPaths.viewBox, style: { position: "absolute" } }, /* @__PURE__ */ React15.createElement(Path, { d: HeartPaths.heart, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.fill, opacity: s.opacity }))));
|
|
328
558
|
};
|
|
329
|
-
var
|
|
559
|
+
var AnimatedPath8 = Animated4.createAnimatedComponent(Path);
|
|
330
560
|
var ECG = ({
|
|
331
561
|
size = 48,
|
|
332
562
|
autoPlay = true,
|
|
@@ -357,10 +587,10 @@ var ECG = ({
|
|
|
357
587
|
}
|
|
358
588
|
}, [autoPlay, loop, speed, onAnimationEnd]);
|
|
359
589
|
const animProps = useAnimatedProps(() => ({ strokeDashoffset: dashOffset.value, opacity: opacity.value }));
|
|
360
|
-
return /* @__PURE__ */
|
|
590
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: ECGPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath8, { animatedProps: animProps, d: ECGPaths.line, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round", strokeLinejoin: "round", strokeDasharray: 100 }));
|
|
361
591
|
};
|
|
362
|
-
var
|
|
363
|
-
var
|
|
592
|
+
var AnimatedPath9 = Animated4.createAnimatedComponent(Path);
|
|
593
|
+
var AnimatedCircle3 = Animated4.createAnimatedComponent(Circle);
|
|
364
594
|
var HeartRate = ({
|
|
365
595
|
size = 48,
|
|
366
596
|
autoPlay = true,
|
|
@@ -401,9 +631,9 @@ var HeartRate = ({
|
|
|
401
631
|
}, [autoPlay, loop, speed, onAnimationEnd]);
|
|
402
632
|
const heartProps = useAnimatedProps(() => ({ transform: [{ scale: scaleVal.value }], originX: 24, originY: 24 }));
|
|
403
633
|
const glowProps = useAnimatedProps(() => ({ r: glowR.value, opacity: glowOp.value }));
|
|
404
|
-
return /* @__PURE__ */
|
|
634
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: HeartRatePaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedCircle3, { animatedProps: glowProps, cx: "24", cy: "24", fill: s.secondaryColor }), /* @__PURE__ */ React15.createElement(AnimatedPath9, { animatedProps: heartProps, d: HeartRatePaths.heart, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.fill, opacity: s.opacity }));
|
|
405
635
|
};
|
|
406
|
-
var
|
|
636
|
+
var AnimatedPath10 = Animated4.createAnimatedComponent(Path);
|
|
407
637
|
var Lungs = ({
|
|
408
638
|
size = 48,
|
|
409
639
|
autoPlay = true,
|
|
@@ -427,9 +657,9 @@ var Lungs = ({
|
|
|
427
657
|
}, [autoPlay, loop, speed]);
|
|
428
658
|
const leftProps = useAnimatedProps(() => ({ transform: [{ scaleX: scaleL.value }, { scaleY: scaleL.value }], originX: 16, originY: 26 }));
|
|
429
659
|
const rightProps = useAnimatedProps(() => ({ transform: [{ scaleX: scaleR.value }, { scaleY: scaleR.value }], originX: 32, originY: 26 }));
|
|
430
|
-
return /* @__PURE__ */
|
|
660
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: LungsPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath10, { animatedProps: leftProps, d: LungsPaths.leftLobe, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, strokeLinecap: "round", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath10, { animatedProps: rightProps, d: LungsPaths.rightLobe, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, strokeLinecap: "round", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Path, { d: LungsPaths.trunk, stroke: s.stroke, strokeWidth: s.strokeWidth, strokeLinecap: "round", fill: "none", opacity: s.opacity }));
|
|
431
661
|
};
|
|
432
|
-
var
|
|
662
|
+
var AnimatedPath11 = Animated4.createAnimatedComponent(Path);
|
|
433
663
|
var Pill = ({
|
|
434
664
|
size = 48,
|
|
435
665
|
autoPlay = true,
|
|
@@ -453,9 +683,9 @@ var Pill = ({
|
|
|
453
683
|
}, [autoPlay, loop, speed]);
|
|
454
684
|
const bodyStyle = useAnimatedStyle(() => ({ transform: [{ translateY: translateY.value }] }));
|
|
455
685
|
const shineProps = useAnimatedProps(() => ({ opacity: shineOp.value }));
|
|
456
|
-
return /* @__PURE__ */
|
|
686
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: PillPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Animated4.View, { style: [{ position: "absolute" }, bodyStyle] }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: PillPaths.viewBox, style: { position: "absolute" } }, /* @__PURE__ */ React15.createElement(Path, { d: PillPaths.capsule, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Path, { d: PillPaths.divider, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", opacity: s.opacity }))), /* @__PURE__ */ React15.createElement(AnimatedPath11, { animatedProps: shineProps, d: PillPaths.shine, stroke: "white", strokeWidth: 2, fill: "none", strokeLinecap: "round" }));
|
|
457
687
|
};
|
|
458
|
-
var
|
|
688
|
+
var AnimatedPath12 = Animated4.createAnimatedComponent(Path);
|
|
459
689
|
var Thermometer = ({
|
|
460
690
|
size = 48,
|
|
461
691
|
autoPlay = true,
|
|
@@ -488,9 +718,9 @@ var Thermometer = ({
|
|
|
488
718
|
}, [autoPlay, loop, speed]);
|
|
489
719
|
const mercuryProps = useAnimatedProps(() => ({ transform: [{ scaleY: mercuryScale.value }], originY: 34 }));
|
|
490
720
|
const tubeStyle = useAnimatedStyle(() => ({ transform: [{ rotate: `${tubeRotation.value}deg` }] }));
|
|
491
|
-
return /* @__PURE__ */
|
|
721
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: ThermometerPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Animated4.View, { style: [{ position: "absolute" }, tubeStyle] }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: ThermometerPaths.viewBox, style: { position: "absolute" } }, /* @__PURE__ */ React15.createElement(Path, { d: ThermometerPaths.tube, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }))), /* @__PURE__ */ React15.createElement(AnimatedPath12, { animatedProps: mercuryProps, d: ThermometerPaths.mercury, fill: s.fill, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Circle, { cx: "24", cy: "40", r: 5, fill: s.fill, opacity: s.opacity }));
|
|
492
722
|
};
|
|
493
|
-
var
|
|
723
|
+
var AnimatedPath13 = Animated4.createAnimatedComponent(Path);
|
|
494
724
|
var DNA = ({
|
|
495
725
|
size = 48,
|
|
496
726
|
autoPlay = true,
|
|
@@ -510,9 +740,9 @@ var DNA = ({
|
|
|
510
740
|
}
|
|
511
741
|
}, [autoPlay, loop, speed]);
|
|
512
742
|
const animProps = useAnimatedProps(() => ({ transform: [{ translateY: translateY.value }] }));
|
|
513
|
-
return /* @__PURE__ */
|
|
743
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: DNAPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath13, { animatedProps: animProps, d: DNAPaths.strand1, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath13, { animatedProps: animProps, d: DNAPaths.strand2, stroke: s.secondaryColor, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath13, { animatedProps: animProps, d: `${DNAPaths.rung1} ${DNAPaths.rung2} ${DNAPaths.rung3}`, stroke: s.stroke, strokeWidth: 1.5, fill: "none", strokeLinecap: "round", opacity: s.opacity * 0.6 }));
|
|
514
744
|
};
|
|
515
|
-
var
|
|
745
|
+
var AnimatedPath14 = Animated4.createAnimatedComponent(Path);
|
|
516
746
|
var Syringe = ({
|
|
517
747
|
size = 48,
|
|
518
748
|
autoPlay = true,
|
|
@@ -543,9 +773,9 @@ var Syringe = ({
|
|
|
543
773
|
const plungerStyle = useAnimatedStyle(() => ({ transform: [{ translateX: plungerX.value }] }));
|
|
544
774
|
const liquidProps = useAnimatedProps(() => ({ transform: [{ scaleX: liquidScale.value }], originX: 14 }));
|
|
545
775
|
const dropProps = useAnimatedProps(() => ({ opacity: dropOp.value, transform: [{ translateY: dropY.value }] }));
|
|
546
|
-
return /* @__PURE__ */
|
|
776
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: SyringePaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Path, { d: SyringePaths.barrel, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath14, { animatedProps: liquidProps, d: SyringePaths.liquid, fill: s.fill, opacity: s.opacity * 0.7 }), /* @__PURE__ */ React15.createElement(Animated4.View, { style: [{ position: "absolute" }, plungerStyle] }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: SyringePaths.viewBox, style: { position: "absolute" } }, /* @__PURE__ */ React15.createElement(Path, { d: SyringePaths.plunger, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round", opacity: s.opacity }))), /* @__PURE__ */ React15.createElement(Path, { d: SyringePaths.needle, stroke: s.stroke, strokeWidth: s.strokeWidth, strokeLinecap: "round", fill: "none", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath14, { animatedProps: dropProps, d: SyringePaths.drop, fill: s.fill }));
|
|
547
777
|
};
|
|
548
|
-
var
|
|
778
|
+
var AnimatedCircle4 = Animated4.createAnimatedComponent(Circle);
|
|
549
779
|
var Brain = ({
|
|
550
780
|
size = 48,
|
|
551
781
|
autoPlay = true,
|
|
@@ -581,10 +811,10 @@ var Brain = ({
|
|
|
581
811
|
const ap1 = useAnimatedProps(() => ({ r: n1r.value, opacity: n1op.value }));
|
|
582
812
|
const ap2 = useAnimatedProps(() => ({ r: n2r.value, opacity: n2op.value }));
|
|
583
813
|
const ap3 = useAnimatedProps(() => ({ r: n3r.value, opacity: n3op.value }));
|
|
584
|
-
return /* @__PURE__ */
|
|
814
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: BrainPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Path, { d: BrainPaths.left, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, strokeLinecap: "round", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Path, { d: BrainPaths.right, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, strokeLinecap: "round", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Path, { d: `${BrainPaths.synapse1} ${BrainPaths.synapse2}`, stroke: s.stroke, strokeWidth: 1, fill: "none", opacity: s.opacity * 0.5 }), /* @__PURE__ */ React15.createElement(AnimatedCircle4, { animatedProps: ap1, cx: "16", cy: "20", fill: s.fill }), /* @__PURE__ */ React15.createElement(AnimatedCircle4, { animatedProps: ap2, cx: "24", cy: "16", fill: s.fill }), /* @__PURE__ */ React15.createElement(AnimatedCircle4, { animatedProps: ap3, cx: "32", cy: "20", fill: s.fill }));
|
|
585
815
|
};
|
|
586
|
-
var
|
|
587
|
-
var
|
|
816
|
+
var AnimatedPath15 = Animated4.createAnimatedComponent(Path);
|
|
817
|
+
var AnimatedCircle5 = Animated4.createAnimatedComponent(Circle);
|
|
588
818
|
var BloodDrop = ({
|
|
589
819
|
size = 48,
|
|
590
820
|
autoPlay = true,
|
|
@@ -614,9 +844,9 @@ var BloodDrop = ({
|
|
|
614
844
|
const dropProps = useAnimatedProps(() => ({ transform: [{ scaleY: scaleY.value }], originY: 28 }));
|
|
615
845
|
const rip1Props = useAnimatedProps(() => ({ r: r1.value, opacity: op1.value }));
|
|
616
846
|
const rip2Props = useAnimatedProps(() => ({ r: r2.value, opacity: op2.value }));
|
|
617
|
-
return /* @__PURE__ */
|
|
847
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: BloodDropPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath15, { animatedProps: dropProps, d: BloodDropPaths.drop, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.fill, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedCircle5, { animatedProps: rip1Props, cx: "24", cy: "42", stroke: s.stroke, strokeWidth: 1.5, fill: "none" }), /* @__PURE__ */ React15.createElement(AnimatedCircle5, { animatedProps: rip2Props, cx: "24", cy: "42", stroke: s.stroke, strokeWidth: 1.5, fill: "none" }));
|
|
618
848
|
};
|
|
619
|
-
var
|
|
849
|
+
var AnimatedPath16 = Animated4.createAnimatedComponent(Path);
|
|
620
850
|
var Steps = ({
|
|
621
851
|
size = 48,
|
|
622
852
|
autoPlay = true,
|
|
@@ -640,9 +870,9 @@ var Steps = ({
|
|
|
640
870
|
}, [autoPlay, loop, speed]);
|
|
641
871
|
const f1Props = useAnimatedProps(() => ({ opacity: op1.value }));
|
|
642
872
|
const f2Props = useAnimatedProps(() => ({ opacity: op2.value }));
|
|
643
|
-
return /* @__PURE__ */
|
|
873
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: StepsPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(AnimatedPath16, { animatedProps: f1Props, d: `${StepsPaths.foot1} ${StepsPaths.toe1a} ${StepsPaths.toe1b}`, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.fill, strokeLinecap: "round" }), /* @__PURE__ */ React15.createElement(AnimatedPath16, { animatedProps: f2Props, d: `${StepsPaths.foot2} ${StepsPaths.toe2a} ${StepsPaths.toe2b}`, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.fill, strokeLinecap: "round" }));
|
|
644
874
|
};
|
|
645
|
-
var
|
|
875
|
+
var AnimatedPath17 = Animated4.createAnimatedComponent(Path);
|
|
646
876
|
var Sleep = ({
|
|
647
877
|
size = 48,
|
|
648
878
|
autoPlay = true,
|
|
@@ -678,9 +908,9 @@ var Sleep = ({
|
|
|
678
908
|
const star2Props = useAnimatedProps(() => ({ opacity: star2Op.value }));
|
|
679
909
|
const z1Props = useAnimatedProps(() => ({ opacity: z1Op.value, transform: [{ translateY: z1Y.value }] }));
|
|
680
910
|
const z2Props = useAnimatedProps(() => ({ opacity: z2Op.value, transform: [{ translateY: z2Y.value }] }));
|
|
681
|
-
return /* @__PURE__ */
|
|
911
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: SleepPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Animated4.View, { style: [{ position: "absolute" }, moonStyle] }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: SleepPaths.viewBox, style: { position: "absolute" } }, /* @__PURE__ */ React15.createElement(Path, { d: SleepPaths.moon, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }))), /* @__PURE__ */ React15.createElement(AnimatedPath17, { animatedProps: star1Props, d: SleepPaths.star1, fill: s.fill, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath17, { animatedProps: star2Props, d: SleepPaths.star2, fill: s.fill, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedPath17, { animatedProps: z1Props, d: SleepPaths.z1, stroke: s.stroke, strokeWidth: 2, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React15.createElement(AnimatedPath17, { animatedProps: z2Props, d: SleepPaths.z2, stroke: s.stroke, strokeWidth: 1.5, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
682
912
|
};
|
|
683
|
-
var
|
|
913
|
+
var AnimatedCircle6 = Animated4.createAnimatedComponent(Circle);
|
|
684
914
|
var Oxygen = ({
|
|
685
915
|
size = 48,
|
|
686
916
|
autoPlay = true,
|
|
@@ -707,9 +937,9 @@ var Oxygen = ({
|
|
|
707
937
|
originX: 24,
|
|
708
938
|
originY: 24
|
|
709
939
|
}));
|
|
710
|
-
return /* @__PURE__ */
|
|
940
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: OxygenPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Path, { d: OxygenPaths.orbit, stroke: s.secondaryColor, strokeWidth: 1, fill: "none", strokeDasharray: "3 3", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Circle, { cx: "18", cy: "20", r: 4, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Circle, { cx: "26", cy: "20", r: 4, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Path, { d: OxygenPaths.bond, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", opacity: s.opacity }), /* @__PURE__ */ React15.createElement(AnimatedCircle6, { animatedProps: electronProps, cx: "40", cy: "24", r: 2.5, fill: s.fill, opacity: s.opacity }));
|
|
711
941
|
};
|
|
712
|
-
var
|
|
942
|
+
var AnimatedPath18 = Animated4.createAnimatedComponent(Path);
|
|
713
943
|
var Medkit = ({
|
|
714
944
|
size = 48,
|
|
715
945
|
autoPlay = true,
|
|
@@ -733,7 +963,7 @@ var Medkit = ({
|
|
|
733
963
|
}, [autoPlay, loop, speed]);
|
|
734
964
|
const bodyStyle = useAnimatedStyle(() => ({ transform: [{ translateY: bodyY.value }] }));
|
|
735
965
|
const crossProps = useAnimatedProps(() => ({ transform: [{ scale: crossScale.value }], originX: 24, originY: 27 }));
|
|
736
|
-
return /* @__PURE__ */
|
|
966
|
+
return /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: MedkitPaths.viewBox, style }, /* @__PURE__ */ React15.createElement(Animated4.View, { style: [{ position: "absolute" }, bodyStyle] }, /* @__PURE__ */ React15.createElement(Svg, { width: size, height: size, viewBox: MedkitPaths.viewBox, style: { position: "absolute" } }, /* @__PURE__ */ React15.createElement(Path, { d: MedkitPaths.box, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: s.secondaryColor, opacity: s.opacity }), /* @__PURE__ */ React15.createElement(Path, { d: MedkitPaths.handle, stroke: s.stroke, strokeWidth: s.strokeWidth, fill: "none", strokeLinecap: "round", opacity: s.opacity }))), /* @__PURE__ */ React15.createElement(AnimatedPath18, { animatedProps: crossProps, d: `${MedkitPaths.crossV} ${MedkitPaths.crossH}`, stroke: s.fill, strokeWidth: 3, strokeLinecap: "round", fill: "none", opacity: s.opacity }));
|
|
737
967
|
};
|
|
738
968
|
|
|
739
969
|
export { Bell, BloodDrop, Brain, Check, DNA, ECG, Heart, HeartRate, Loader, Lungs, Medkit, Oxygen, Pill, Pulse, Sleep, Star, Steps, Syringe, Thermometer, Upload, Wifi, getAnimDuration, resolveStyle };
|