@principal-ai/logo-component 0.1.2 → 0.1.4

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 (13) hide show
  1. package/dist/ForksLogo.d.ts +10 -0
  2. package/dist/ForksLogo.js +92 -0
  3. package/dist/Logo.js +25 -25
  4. package/dist/LogoSmall.d.ts +10 -0
  5. package/dist/LogoSmall.js +29 -0
  6. package/dist/esm/ForksLogo.js +85 -0
  7. package/dist/esm/Logo.js +25 -25
  8. package/dist/esm/LogoSmall.js +22 -0
  9. package/dist/esm/index.js +2 -0
  10. package/dist/index.d.ts +2 -0
  11. package/dist/index.esm.js +2 -0
  12. package/dist/index.js +5 -1
  13. package/package.json +2 -1
package/dist/ForksLogo.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ import React from "react";
2
+ interface ForksLogoProps {
3
+ width?: number;
4
+ height?: number;
5
+ color?: string;
6
+ particleColor?: string;
7
+ opacity?: number;
8
+ }
9
+ export declare const ForksLogo: React.FC<ForksLogoProps>;
10
+ export {};
package/dist/ForksLogo.js ADDED
@@ -0,0 +1,92 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.ForksLogo = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const ForksLogo = ({ width = 150, height = 150, color = "currentColor", particleColor, opacity = 0.9, }) => {
9
+ const finalParticleColor = particleColor || color;
10
+ return (react_1.default.createElement("svg", { width: width, height: height, viewBox: "0 0 200 200", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
11
+ react_1.default.createElement("defs", null,
12
+ react_1.default.createElement("radialGradient", { id: "sphereGlowForks", cx: "50%", cy: "50%", r: "50%" },
13
+ react_1.default.createElement("stop", { offset: "0%", style: { stopColor: color, stopOpacity: 0.3 } }),
14
+ react_1.default.createElement("stop", { offset: "100%", style: { stopColor: color, stopOpacity: 0 } })),
15
+ react_1.default.createElement("radialGradient", { id: "centerPulseForks", cx: "50%", cy: "50%", r: "50%" },
16
+ react_1.default.createElement("stop", { offset: "0%", style: { stopColor: color, stopOpacity: 0.8 } },
17
+ react_1.default.createElement("animate", { attributeName: "stop-opacity", values: "0.8;0.3;0.8", dur: "2s", repeatCount: "indefinite" })),
18
+ react_1.default.createElement("stop", { offset: "100%", style: { stopColor: color, stopOpacity: 0 } }))),
19
+ react_1.default.createElement("circle", { cx: "100", cy: "100", r: "80", fill: "url(#sphereGlowForks)", opacity: "0.5" }),
20
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
21
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
22
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
23
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
24
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
25
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
26
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
27
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
28
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
29
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
30
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
31
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
32
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
33
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
34
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
35
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
36
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
37
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" })),
38
+ react_1.default.createElement("circle", { cx: "93", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
39
+ react_1.default.createElement("circle", { cx: "93", cy: "90", r: "2", fill: finalParticleColor, opacity: "0.9" }),
40
+ react_1.default.createElement("circle", { cx: "93", cy: "95", r: "2", fill: finalParticleColor, opacity: "0.9" }),
41
+ react_1.default.createElement("circle", { cx: "93", cy: "100", r: "2", fill: finalParticleColor, opacity: "0.9" }),
42
+ react_1.default.createElement("circle", { cx: "93", cy: "105", r: "2", fill: finalParticleColor, opacity: "0.9" }),
43
+ react_1.default.createElement("circle", { cx: "93", cy: "110", r: "2", fill: finalParticleColor, opacity: "0.9" }),
44
+ react_1.default.createElement("circle", { cx: "93", cy: "115", r: "2", fill: finalParticleColor, opacity: "0.9" }),
45
+ react_1.default.createElement("circle", { cx: "98", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
46
+ react_1.default.createElement("circle", { cx: "103", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
47
+ react_1.default.createElement("circle", { cx: "108", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
48
+ react_1.default.createElement("circle", { cx: "98", cy: "100", r: "2", fill: finalParticleColor, opacity: "0.9" }),
49
+ react_1.default.createElement("circle", { cx: "103", cy: "100", r: "2", fill: finalParticleColor, opacity: "0.9" }),
50
+ react_1.default.createElement("circle", { cx: "100", cy: "100", r: "67", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.9" }),
51
+ react_1.default.createElement("path", { d: "M 33,100 A 67,13 0 0,1 73,88.1", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
52
+ react_1.default.createElement("path", { d: "M 127,88.1 A 67,13 0 0,1 167,100", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
53
+ react_1.default.createElement("path", { d: "M 33,100 A 67,13 0 0,0 73,111.9", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
54
+ react_1.default.createElement("path", { d: "M 127,111.9 A 67,13 0 0,0 167,100", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
55
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "27", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
56
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
57
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "53", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
58
+ react_1.default.createElement("path", { d: "M 100,33 A 13,67 0 0,0 87,73", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
59
+ react_1.default.createElement("path", { d: "M 113,73 A 13,67 0 0,0 100,33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
60
+ react_1.default.createElement("path", { d: "M 100,167 A 13,67 0 0,1 87,127", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
61
+ react_1.default.createElement("path", { d: "M 113,127 A 13,67 0 0,1 100,167", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
62
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "27", ry: "67", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
63
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "40", ry: "67", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
64
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "53", ry: "67", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
65
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(30 100 100)" }),
66
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(60 100 100)" }),
67
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(120 100 100)" }),
68
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(150 100 100)" }),
69
+ react_1.default.createElement("line", { x1: "33", y1: "100", x2: "73", y2: "100", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
70
+ react_1.default.createElement("line", { x1: "127", y1: "100", x2: "167", y2: "100", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
71
+ react_1.default.createElement("line", { x1: "100", y1: "33", x2: "100", y2: "73", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
72
+ react_1.default.createElement("line", { x1: "100", y1: "127", x2: "100", y2: "167", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
73
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
74
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
75
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
76
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
77
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
78
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
79
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
80
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
81
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
82
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
83
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
84
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
85
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
86
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
87
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
88
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
89
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
90
+ react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" }))));
91
+ };
92
+ exports.ForksLogo = ForksLogo;
package/dist/Logo.js CHANGED
@@ -7,7 +7,7 @@ exports.Logo = void 0;
7
7
  const react_1 = __importDefault(require("react"));
8
8
  const Logo = ({ width = 150, height = 150, color = "currentColor", particleColor, opacity = 0.9, }) => {
9
9
  const finalParticleColor = particleColor || color;
10
- return (react_1.default.createElement("svg", { width: width, height: height, viewBox: "0 0 200 200", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
10
+ return (react_1.default.createElement("svg", { width: width, height: height, viewBox: "30 30 140 140", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
11
11
  react_1.default.createElement("defs", null,
12
12
  react_1.default.createElement("radialGradient", { id: "sphereGlow", cx: "50%", cy: "50%", r: "50%" },
13
13
  react_1.default.createElement("stop", { offset: "0%", style: { stopColor: color, stopOpacity: 0.3 } }),
@@ -17,23 +17,23 @@ const Logo = ({ width = 150, height = 150, color = "currentColor", particleColor
17
17
  react_1.default.createElement("animate", { attributeName: "stop-opacity", values: "0.8;0.3;0.8", dur: "2s", repeatCount: "indefinite" })),
18
18
  react_1.default.createElement("stop", { offset: "100%", style: { stopColor: color, stopOpacity: 0 } }))),
19
19
  react_1.default.createElement("circle", { cx: "100", cy: "100", r: "80", fill: "url(#sphereGlow)", opacity: "0.5" }),
20
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
21
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 33,100 A 67,27 0 0,0 167,100 A 67,27 0 0,0 33,100" }),
20
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
21
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
22
22
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
23
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
24
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 33,100 A 67,40 0 0,0 167,100 A 67,40 0 0,0 33,100" }),
23
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
24
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
25
25
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
26
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
27
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 33,100 A 67,53 0 0,0 167,100 A 67,53 0 0,0 33,100" }),
26
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
27
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
28
28
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
29
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
30
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 100,33 A 27,67 0 0,0 100,167 A 27,67 0 0,0 100,33" }),
29
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
30
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
31
31
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
32
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
33
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 100,33 A 40,67 0 0,0 100,167 A 40,67 0 0,0 100,33" }),
32
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
33
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
34
34
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
35
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
36
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 100,33 A 53,67 0 0,0 100,167 A 53,67 0 0,0 100,33" }),
35
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
36
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
37
37
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" })),
38
38
  react_1.default.createElement("circle", { cx: "93", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
39
39
  react_1.default.createElement("circle", { cx: "93", cy: "90", r: "2", fill: finalParticleColor, opacity: "0.9" }),
@@ -71,23 +71,23 @@ const Logo = ({ width = 150, height = 150, color = "currentColor", particleColor
71
71
  react_1.default.createElement("line", { x1: "127", y1: "100", x2: "167", y2: "100", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
72
72
  react_1.default.createElement("line", { x1: "100", y1: "33", x2: "100", y2: "73", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
73
73
  react_1.default.createElement("line", { x1: "100", y1: "127", x2: "100", y2: "167", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
74
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
75
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 33,100 A 67,27 0 0,0 167,100 A 67,27 0 0,0 33,100" }),
74
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
75
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
76
76
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
77
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
78
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 33,100 A 67,40 0 0,0 167,100 A 67,40 0 0,0 33,100" }),
77
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
78
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
79
79
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
80
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
81
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 33,100 A 67,53 0 0,0 167,100 A 67,53 0 0,0 33,100" }),
80
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
81
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
82
82
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
83
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
84
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 100,33 A 27,67 0 0,0 100,167 A 27,67 0 0,0 100,33" }),
83
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
84
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
85
85
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
86
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
87
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 100,33 A 40,67 0 0,0 100,167 A 40,67 0 0,0 100,33" }),
86
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
87
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
88
88
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
89
- react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
90
- react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 100,33 A 53,67 0 0,0 100,167 A 53,67 0 0,0 100,33" }),
89
+ react_1.default.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
90
+ react_1.default.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
91
91
  react_1.default.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" }))));
92
92
  };
93
93
  exports.Logo = Logo;
package/dist/LogoSmall.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ import React from "react";
2
+ interface LogoSmallProps {
3
+ width?: number;
4
+ height?: number;
5
+ color?: string;
6
+ particleColor?: string;
7
+ opacity?: number;
8
+ }
9
+ export declare const LogoSmall: React.FC<LogoSmallProps>;
10
+ export {};
package/dist/LogoSmall.js ADDED
@@ -0,0 +1,29 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.LogoSmall = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const LogoSmall = ({ width = 32, height = 32, color = "currentColor", particleColor, opacity = 0.9, }) => {
9
+ const finalParticleColor = particleColor || color;
10
+ return (react_1.default.createElement("svg", { width: width, height: height, viewBox: "30 30 140 140", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
11
+ react_1.default.createElement("circle", { cx: "100", cy: "100", r: "67", fill: "none", stroke: color, strokeWidth: "2", opacity: "0.9" }),
12
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6" }),
13
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "40", ry: "67", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6" }),
14
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6", transform: "rotate(45 100 100)" }),
15
+ react_1.default.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6", transform: "rotate(-45 100 100)" }),
16
+ react_1.default.createElement("circle", { cx: "90", cy: "80", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
17
+ react_1.default.createElement("circle", { cx: "90", cy: "88", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
18
+ react_1.default.createElement("circle", { cx: "90", cy: "96", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
19
+ react_1.default.createElement("circle", { cx: "90", cy: "104", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
20
+ react_1.default.createElement("circle", { cx: "90", cy: "112", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
21
+ react_1.default.createElement("circle", { cx: "90", cy: "120", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
22
+ react_1.default.createElement("circle", { cx: "98", cy: "80", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
23
+ react_1.default.createElement("circle", { cx: "106", cy: "80", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
24
+ react_1.default.createElement("circle", { cx: "114", cy: "88", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
25
+ react_1.default.createElement("circle", { cx: "114", cy: "96", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
26
+ react_1.default.createElement("circle", { cx: "106", cy: "104", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
27
+ react_1.default.createElement("circle", { cx: "98", cy: "104", r: "3.5", fill: finalParticleColor, opacity: "0.95" })));
28
+ };
29
+ exports.LogoSmall = LogoSmall;
package/dist/esm/ForksLogo.js ADDED
@@ -0,0 +1,85 @@
1
+ import React from "react";
2
+ export const ForksLogo = ({ width = 150, height = 150, color = "currentColor", particleColor, opacity = 0.9, }) => {
3
+ const finalParticleColor = particleColor || color;
4
+ return (React.createElement("svg", { width: width, height: height, viewBox: "0 0 200 200", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
5
+ React.createElement("defs", null,
6
+ React.createElement("radialGradient", { id: "sphereGlowForks", cx: "50%", cy: "50%", r: "50%" },
7
+ React.createElement("stop", { offset: "0%", style: { stopColor: color, stopOpacity: 0.3 } }),
8
+ React.createElement("stop", { offset: "100%", style: { stopColor: color, stopOpacity: 0 } })),
9
+ React.createElement("radialGradient", { id: "centerPulseForks", cx: "50%", cy: "50%", r: "50%" },
10
+ React.createElement("stop", { offset: "0%", style: { stopColor: color, stopOpacity: 0.8 } },
11
+ React.createElement("animate", { attributeName: "stop-opacity", values: "0.8;0.3;0.8", dur: "2s", repeatCount: "indefinite" })),
12
+ React.createElement("stop", { offset: "100%", style: { stopColor: color, stopOpacity: 0 } }))),
13
+ React.createElement("circle", { cx: "100", cy: "100", r: "80", fill: "url(#sphereGlowForks)", opacity: "0.5" }),
14
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
15
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
16
+ React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
17
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
18
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
19
+ React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
20
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
21
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
22
+ React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
23
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
24
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
25
+ React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
26
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
27
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
28
+ React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
29
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
30
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
31
+ React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" })),
32
+ React.createElement("circle", { cx: "93", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
33
+ React.createElement("circle", { cx: "93", cy: "90", r: "2", fill: finalParticleColor, opacity: "0.9" }),
34
+ React.createElement("circle", { cx: "93", cy: "95", r: "2", fill: finalParticleColor, opacity: "0.9" }),
35
+ React.createElement("circle", { cx: "93", cy: "100", r: "2", fill: finalParticleColor, opacity: "0.9" }),
36
+ React.createElement("circle", { cx: "93", cy: "105", r: "2", fill: finalParticleColor, opacity: "0.9" }),
37
+ React.createElement("circle", { cx: "93", cy: "110", r: "2", fill: finalParticleColor, opacity: "0.9" }),
38
+ React.createElement("circle", { cx: "93", cy: "115", r: "2", fill: finalParticleColor, opacity: "0.9" }),
39
+ React.createElement("circle", { cx: "98", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
40
+ React.createElement("circle", { cx: "103", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
41
+ React.createElement("circle", { cx: "108", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
42
+ React.createElement("circle", { cx: "98", cy: "100", r: "2", fill: finalParticleColor, opacity: "0.9" }),
43
+ React.createElement("circle", { cx: "103", cy: "100", r: "2", fill: finalParticleColor, opacity: "0.9" }),
44
+ React.createElement("circle", { cx: "100", cy: "100", r: "67", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.9" }),
45
+ React.createElement("path", { d: "M 33,100 A 67,13 0 0,1 73,88.1", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
46
+ React.createElement("path", { d: "M 127,88.1 A 67,13 0 0,1 167,100", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
47
+ React.createElement("path", { d: "M 33,100 A 67,13 0 0,0 73,111.9", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
48
+ React.createElement("path", { d: "M 127,111.9 A 67,13 0 0,0 167,100", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
49
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "27", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
50
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
51
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "53", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
52
+ React.createElement("path", { d: "M 100,33 A 13,67 0 0,0 87,73", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
53
+ React.createElement("path", { d: "M 113,73 A 13,67 0 0,0 100,33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
54
+ React.createElement("path", { d: "M 100,167 A 13,67 0 0,1 87,127", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
55
+ React.createElement("path", { d: "M 113,127 A 13,67 0 0,1 100,167", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
56
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "27", ry: "67", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
57
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "40", ry: "67", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
58
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "53", ry: "67", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.7" }),
59
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(30 100 100)" }),
60
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(60 100 100)" }),
61
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(120 100 100)" }),
62
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "33", fill: "none", stroke: color, strokeWidth: "1", opacity: "0.6", transform: "rotate(150 100 100)" }),
63
+ React.createElement("line", { x1: "33", y1: "100", x2: "73", y2: "100", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
64
+ React.createElement("line", { x1: "127", y1: "100", x2: "167", y2: "100", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
65
+ React.createElement("line", { x1: "100", y1: "33", x2: "100", y2: "73", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
66
+ React.createElement("line", { x1: "100", y1: "127", x2: "100", y2: "167", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
67
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
68
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
69
+ React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
70
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
71
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
72
+ React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
73
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
74
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
75
+ React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
76
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
77
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
78
+ React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
79
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
80
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
81
+ React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
82
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
83
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
84
+ React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" }))));
85
+ };
package/dist/esm/Logo.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  export const Logo = ({ width = 150, height = 150, color = "currentColor", particleColor, opacity = 0.9, }) => {
3
3
  const finalParticleColor = particleColor || color;
4
- return (React.createElement("svg", { width: width, height: height, viewBox: "0 0 200 200", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
4
+ return (React.createElement("svg", { width: width, height: height, viewBox: "30 30 140 140", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
5
5
  React.createElement("defs", null,
6
6
  React.createElement("radialGradient", { id: "sphereGlow", cx: "50%", cy: "50%", r: "50%" },
7
7
  React.createElement("stop", { offset: "0%", style: { stopColor: color, stopOpacity: 0.3 } }),
@@ -11,23 +11,23 @@ export const Logo = ({ width = 150, height = 150, color = "currentColor", partic
11
11
  React.createElement("animate", { attributeName: "stop-opacity", values: "0.8;0.3;0.8", dur: "2s", repeatCount: "indefinite" })),
12
12
  React.createElement("stop", { offset: "100%", style: { stopColor: color, stopOpacity: 0 } }))),
13
13
  React.createElement("circle", { cx: "100", cy: "100", r: "80", fill: "url(#sphereGlow)", opacity: "0.5" }),
14
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
15
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 33,100 A 67,27 0 0,0 167,100 A 67,27 0 0,0 33,100" }),
14
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
15
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
16
16
  React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
17
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
18
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 33,100 A 67,40 0 0,0 167,100 A 67,40 0 0,0 33,100" }),
17
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
18
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
19
19
  React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
20
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
21
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 33,100 A 67,53 0 0,0 167,100 A 67,53 0 0,0 33,100" }),
20
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
21
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
22
22
  React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
23
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
24
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 100,33 A 27,67 0 0,0 100,167 A 27,67 0 0,0 100,33" }),
23
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
24
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
25
25
  React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
26
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
27
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 100,33 A 40,67 0 0,0 100,167 A 40,67 0 0,0 100,33" }),
26
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
27
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
28
28
  React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
29
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
30
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 100,33 A 53,67 0 0,0 100,167 A 53,67 0 0,0 100,33" }),
29
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
30
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
31
31
  React.createElement("animate", { attributeName: "opacity", values: "0;1;0.5;0;0", keyTimes: "0;0.2;0.4;0.5;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" })),
32
32
  React.createElement("circle", { cx: "93", cy: "85", r: "2", fill: finalParticleColor, opacity: "0.9" }),
33
33
  React.createElement("circle", { cx: "93", cy: "90", r: "2", fill: finalParticleColor, opacity: "0.9" }),
@@ -65,22 +65,22 @@ export const Logo = ({ width = 150, height = 150, color = "currentColor", partic
65
65
  React.createElement("line", { x1: "127", y1: "100", x2: "167", y2: "100", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
66
66
  React.createElement("line", { x1: "100", y1: "33", x2: "100", y2: "73", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
67
67
  React.createElement("line", { x1: "100", y1: "127", x2: "100", y2: "167", stroke: color, strokeWidth: "1.5", opacity: "0.8" }),
68
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
69
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 33,100 A 67,27 0 0,0 167,100 A 67,27 0 0,0 33,100" }),
68
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
69
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1s", path: "M 0,0 A 67,27 0 1,0 -134,0 A 67,27 0 1,0 0,0" }),
70
70
  React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1s", repeatCount: "indefinite" })),
71
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
72
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 33,100 A 67,40 0 0,0 167,100 A 67,40 0 0,0 33,100" }),
71
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
72
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2s", path: "M 0,0 A 67,40 0 1,0 -134,0 A 67,40 0 1,0 0,0" }),
73
73
  React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2s", repeatCount: "indefinite" })),
74
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "33", cy: "100", opacity: "0" },
75
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 33,100 A 67,53 0 0,0 167,100 A 67,53 0 0,0 33,100" }),
74
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "167", cy: "100", opacity: "0" },
75
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3s", path: "M 0,0 A 67,53 0 1,0 -134,0 A 67,53 0 1,0 0,0" }),
76
76
  React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3s", repeatCount: "indefinite" })),
77
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
78
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 100,33 A 27,67 0 0,0 100,167 A 27,67 0 0,0 100,33" }),
77
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
78
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "1.5s", path: "M 0,0 A 27,67 0 1,0 0,-134 A 27,67 0 1,0 0,0" }),
79
79
  React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "1.5s", repeatCount: "indefinite" })),
80
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
81
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 100,33 A 40,67 0 0,0 100,167 A 40,67 0 0,0 100,33" }),
80
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
81
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "2.5s", path: "M 0,0 A 40,67 0 1,0 0,-134 A 40,67 0 1,0 0,0" }),
82
82
  React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "2.5s", repeatCount: "indefinite" })),
83
- React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "33", opacity: "0" },
84
- React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 100,33 A 53,67 0 0,0 100,167 A 53,67 0 0,0 100,33" }),
83
+ React.createElement("circle", { r: "2.5", fill: finalParticleColor, cx: "100", cy: "167", opacity: "0" },
84
+ React.createElement("animateMotion", { dur: "8s", repeatCount: "indefinite", begin: "3.5s", path: "M 0,0 A 53,67 0 1,0 0,-134 A 53,67 0 1,0 0,0" }),
85
85
  React.createElement("animate", { attributeName: "opacity", values: "0;0;0.5;1;1;0.5;0", keyTimes: "0;0.5;0.6;0.75;0.9;0.95;1", dur: "8s", begin: "3.5s", repeatCount: "indefinite" }))));
86
86
  };
package/dist/esm/LogoSmall.js ADDED
@@ -0,0 +1,22 @@
1
+ import React from "react";
2
+ export const LogoSmall = ({ width = 32, height = 32, color = "currentColor", particleColor, opacity = 0.9, }) => {
3
+ const finalParticleColor = particleColor || color;
4
+ return (React.createElement("svg", { width: width, height: height, viewBox: "30 30 140 140", xmlns: "http://www.w3.org/2000/svg", style: { opacity } },
5
+ React.createElement("circle", { cx: "100", cy: "100", r: "67", fill: "none", stroke: color, strokeWidth: "2", opacity: "0.9" }),
6
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6" }),
7
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "40", ry: "67", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6" }),
8
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6", transform: "rotate(45 100 100)" }),
9
+ React.createElement("ellipse", { cx: "100", cy: "100", rx: "67", ry: "40", fill: "none", stroke: color, strokeWidth: "1.5", opacity: "0.6", transform: "rotate(-45 100 100)" }),
10
+ React.createElement("circle", { cx: "90", cy: "80", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
11
+ React.createElement("circle", { cx: "90", cy: "88", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
12
+ React.createElement("circle", { cx: "90", cy: "96", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
13
+ React.createElement("circle", { cx: "90", cy: "104", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
14
+ React.createElement("circle", { cx: "90", cy: "112", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
15
+ React.createElement("circle", { cx: "90", cy: "120", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
16
+ React.createElement("circle", { cx: "98", cy: "80", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
17
+ React.createElement("circle", { cx: "106", cy: "80", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
18
+ React.createElement("circle", { cx: "114", cy: "88", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
19
+ React.createElement("circle", { cx: "114", cy: "96", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
20
+ React.createElement("circle", { cx: "106", cy: "104", r: "3.5", fill: finalParticleColor, opacity: "0.95" }),
21
+ React.createElement("circle", { cx: "98", cy: "104", r: "3.5", fill: finalParticleColor, opacity: "0.95" })));
22
+ };
package/dist/esm/index.js CHANGED
@@ -1 +1,3 @@
1
1
  export { Logo } from './Logo';
2
+ export { LogoSmall } from './LogoSmall';
3
+ export { ForksLogo } from './ForksLogo';
package/dist/index.d.ts CHANGED
@@ -1 +1,3 @@
1
1
  export { Logo } from './Logo';
2
+ export { LogoSmall } from './LogoSmall';
3
+ export { ForksLogo } from './ForksLogo';
package/dist/index.esm.js CHANGED
@@ -1 +1,3 @@
1
1
  export { Logo } from './Logo';
2
+ export { LogoSmall } from './LogoSmall';
3
+ export { ForksLogo } from './ForksLogo';
package/dist/index.js CHANGED
@@ -1,5 +1,9 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Logo = void 0;
3
+ exports.ForksLogo = exports.LogoSmall = exports.Logo = void 0;
4
4
  var Logo_1 = require("./Logo");
5
5
  Object.defineProperty(exports, "Logo", { enumerable: true, get: function () { return Logo_1.Logo; } });
6
+ var LogoSmall_1 = require("./LogoSmall");
7
+ Object.defineProperty(exports, "LogoSmall", { enumerable: true, get: function () { return LogoSmall_1.LogoSmall; } });
8
+ var ForksLogo_1 = require("./ForksLogo");
9
+ Object.defineProperty(exports, "ForksLogo", { enumerable: true, get: function () { return ForksLogo_1.ForksLogo; } });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@principal-ai/logo-component",
3
- "version": "0.1.2",
3
+ "version": "0.1.4",
4
4
  "description": "Animated wireframe sphere logo component",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",
@@ -33,6 +33,7 @@
33
33
  "@types/react": "^19.1.12",
34
34
  "@vitejs/plugin-react": "^4.7.0",
35
35
  "react": "^19.1.1",
36
+ "sharp": "^0.34.5",
36
37
  "storybook": "^8.6.14",
37
38
  "typescript": "^5",
38
39
  "vite": "^5.4.20"