nfx-ui 0.17.0 → 0.22.0

package/dist/animations/spotify-icon.js

@@ -0,0 +1,119 @@
+import { forwardRef as e, useImperativeHandle as t, useRef as n } from "react";
+import { motion as r, useAnimate as i } from "motion/react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/animations/spotify-icon.tsx
+var s = e(({ size: e = 24, color: s = "currentColor", strokeWidth: c = 2, className: l = "" }, u) => {
+	let [d, f] = i(), p = n([]), m = async () => {
+		p.current.forEach((e) => e.stop()), p.current = [], f(".circle", { scale: [
+			1,
+			1.05,
+			1
+		] }, {
+			duration: .5,
+			ease: "easeInOut"
+		}), p.current.push(f(".wave1", {
+			x: [
+				-2,
+				2,
+				-2
+			],
+			pathLength: [
+				1,
+				.8,
+				1
+			]
+		}, {
+			duration: .8,
+			ease: "easeInOut",
+			repeat: Infinity
+		})), p.current.push(f(".wave2", {
+			x: [
+				-1,
+				1,
+				-1
+			],
+			pathLength: [
+				1,
+				.9,
+				1
+			]
+		}, {
+			duration: .7,
+			ease: "easeInOut",
+			repeat: Infinity
+		})), p.current.push(f(".wave3", {
+			x: [
+				-2,
+				2,
+				-2
+			],
+			pathLength: [
+				1,
+				.85,
+				1
+			]
+		}, {
+			duration: .9,
+			ease: "easeInOut",
+			repeat: Infinity
+		}));
+	}, h = () => {
+		p.current.forEach((e) => e.stop()), p.current = [], f(".circle", { scale: 1 }, { duration: .2 }), f(".wave1", {
+			x: 0,
+			pathLength: 1
+		}, { duration: .2 }), f(".wave2", {
+			x: 0,
+			pathLength: 1
+		}, { duration: .2 }), f(".wave3", {
+			x: 0,
+			pathLength: 1
+		}, { duration: .2 });
+	};
+	return t(u, () => ({
+		startAnimation: m,
+		stopAnimation: h
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		onHoverStart: m,
+		onHoverEnd: h,
+		xmlns: "http://www.w3.org/2000/svg",
+		width: e,
+		height: e,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: s,
+		strokeWidth: c,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: `cursor-pointer ${l}`,
+		children: [
+			/* @__PURE__ */ a("path", {
+				stroke: "none",
+				d: "M0 0h24v24H0z",
+				fill: "none"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "circle",
+				style: { transformOrigin: "center" },
+				d: "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "wave2",
+				d: "M8 11.973c2.5 -1.473 5.5 -.973 7.5 .527"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "wave3",
+				d: "M9 15c1.5 -1 4 -1 5 .5"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "wave1",
+				d: "M7 9c2 -1 6 -2 10 .5"
+			})
+		]
+	});
+});
+s.displayName = "SpotifyIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=spotify-icon.js.map

package/dist/animations/spotify-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spotify-icon.js","names":[],"sources":["../../src/animations/spotify-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useRef } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst SpotifyIcon = forwardRef<AnimatedIconHandle, AnimatedIconProps>(\n  (\n    { size = 24, color = \"currentColor\", strokeWidth = 2, className = \"\" },\n    ref,\n  ) => {\n    const [scope, animate] = useAnimate();\n    const animationControls = useRef<Array<ReturnType<typeof animate>>>([]);\n\n    const start = async () => {\n      animationControls.current.forEach((control) => control.stop());\n      animationControls.current = [];\n\n      animate(\n        \".circle\",\n        { scale: [1, 1.05, 1] },\n        { duration: 0.5, ease: \"easeInOut\" },\n      );\n      animationControls.current.push(\n        animate(\n          \".wave1\",\n          { x: [-2, 2, -2], pathLength: [1, 0.8, 1] },\n          { duration: 0.8, ease: \"easeInOut\", repeat: Infinity },\n        ),\n      );\n      animationControls.current.push(\n        animate(\n          \".wave2\",\n          { x: [-1, 1, -1], pathLength: [1, 0.9, 1] },\n          { duration: 0.7, ease: \"easeInOut\", repeat: Infinity },\n        ),\n      );\n      animationControls.current.push(\n        animate(\n          \".wave3\",\n          { x: [-2, 2, -2], pathLength: [1, 0.85, 1] },\n          { duration: 0.9, ease: \"easeInOut\", repeat: Infinity },\n        ),\n      );\n    };\n\n    const stop = () => {\n      animationControls.current.forEach((control) => control.stop());\n      animationControls.current = [];\n\n      animate(\".circle\", { scale: 1 }, { duration: 0.2 });\n      animate(\".wave1\", { x: 0, pathLength: 1 }, { duration: 0.2 });\n      animate(\".wave2\", { x: 0, pathLength: 1 }, { duration: 0.2 });\n      animate(\".wave3\", { x: 0, pathLength: 1 }, { duration: 0.2 });\n    };\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.svg\n        ref={scope}\n        onHoverStart={start}\n        onHoverEnd={stop}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={size}\n        height={size}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={`cursor-pointer ${className}`}\n      >\n        <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n        <motion.path\n          className=\"circle\"\n          style={{ transformOrigin: \"center\" }}\n          d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\"\n        />\n        <motion.path\n          className=\"wave2\"\n          d=\"M8 11.973c2.5 -1.473 5.5 -.973 7.5 .527\"\n        />\n        <motion.path className=\"wave3\" d=\"M9 15c1.5 -1 4 -1 5 .5\" />\n        <motion.path className=\"wave1\" d=\"M7 9c2 -1 6 -2 10 .5\" />\n      </motion.svg>\n    );\n  },\n);\n\nSpotifyIcon.displayName = \"SpotifyIcon\";\nexport default SpotifyIcon;\n"],"mappings":";;;;AAIA,IAAM,IAAc,GAEhB,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAC9B,IAAoB,EAA0C,CAAC,CAAC,GAEhE,IAAQ,YAAY;EAuBxB,AAtBA,EAAkB,QAAQ,SAAS,MAAY,EAAQ,KAAK,CAAC,GAC7D,EAAkB,UAAU,CAAC,GAE7B,EACE,WACA,EAAE,OAAO;GAAC;GAAG;GAAM;EAAC,EAAE,GACtB;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC,GACA,EAAkB,QAAQ,KACxB,EACE,UACA;GAAE,GAAG;IAAC;IAAI;IAAG;GAAE;GAAG,YAAY;IAAC;IAAG;IAAK;GAAC;EAAE,GAC1C;GAAE,UAAU;GAAK,MAAM;GAAa,QAAQ;EAAS,CACvD,CACF,GACA,EAAkB,QAAQ,KACxB,EACE,UACA;GAAE,GAAG;IAAC;IAAI;IAAG;GAAE;GAAG,YAAY;IAAC;IAAG;IAAK;GAAC;EAAE,GAC1C;GAAE,UAAU;GAAK,MAAM;GAAa,QAAQ;EAAS,CACvD,CACF,GACA,EAAkB,QAAQ,KACxB,EACE,UACA;GAAE,GAAG;IAAC;IAAI;IAAG;GAAE;GAAG,YAAY;IAAC;IAAG;IAAM;GAAC;EAAE,GAC3C;GAAE,UAAU;GAAK,MAAM;GAAa,QAAQ;EAAS,CACvD,CACF;CACF,GAEM,UAAa;EAOjB,AANA,EAAkB,QAAQ,SAAS,MAAY,EAAQ,KAAK,CAAC,GAC7D,EAAkB,UAAU,CAAC,GAE7B,EAAQ,WAAW,EAAE,OAAO,EAAE,GAAG,EAAE,UAAU,GAAI,CAAC,GAClD,EAAQ,UAAU;GAAE,GAAG;GAAG,YAAY;EAAE,GAAG,EAAE,UAAU,GAAI,CAAC,GAC5D,EAAQ,UAAU;GAAE,GAAG;GAAG,YAAY;EAAE,GAAG,EAAE,UAAU,GAAI,CAAC,GAC5D,EAAQ,UAAU;GAAE,GAAG;GAAG,YAAY;EAAE,GAAG,EAAE,UAAU,GAAI,CAAC;CAC9D;CAOA,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,cAAc;EACd,YAAY;EACZ,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAb/B,UAAA;GAeE,kBAAC,QAAD;IAAM,QAAO;IAAO,GAAE;IAAgB,MAAK;GAAQ,CAAA;GACnD,kBAAC,EAAO,MAAR;IACE,WAAU;IACV,OAAO,EAAE,iBAAiB,SAAS;IACnC,GAAE;GACH,CAAA;GACD,kBAAC,EAAO,MAAR;IACE,WAAU;IACV,GAAE;GACH,CAAA;GACD,kBAAC,EAAO,MAAR;IAAa,WAAU;IAAQ,GAAE;GAA0B,CAAA;GAC3D,kBAAC,EAAO,MAAR;IAAa,WAAU;IAAQ,GAAE;GAAwB,CAAA;EAC/C;;AAEhB,CACF;AAEA,EAAY,cAAc"}

package/dist/animations/stack-3-icon.d.ts

@@ -0,0 +1,4 @@
+import { AnimatedIconHandle, AnimatedIconProps } from './types';
+declare const Stack3Icon: import('react').ForwardRefExoticComponent<AnimatedIconProps & import('react').RefAttributes<AnimatedIconHandle>>;
+export default Stack3Icon;
+//# sourceMappingURL=stack-3-icon.d.ts.map

package/dist/animations/stack-3-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-3-icon.d.ts","sourceRoot":"","sources":["../../src/animations/stack-3-icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGrE,QAAA,MAAM,UAAU,kHAsEf,CAAC;AAGF,eAAe,UAAU,CAAC"}

package/dist/animations/stack-3-icon.js

@@ -0,0 +1,82 @@
+import { forwardRef as e, useCallback as t, useImperativeHandle as n } from "react";
+import { motion as r, useAnimate as i } from "motion/react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/animations/stack-3-icon.tsx
+var s = e(({ size: e = 24, color: s = "currentColor", strokeWidth: c = 2, className: l = "" }, u) => {
+	let [d, f] = i(), p = t(async () => {
+		f(".layer-1", {
+			y: -3,
+			scale: 1.05
+		}, {
+			duration: .3,
+			ease: "easeOut"
+		}), f(".layer-2", {
+			y: -1,
+			opacity: .8
+		}, {
+			duration: .3,
+			delay: .05,
+			ease: "easeOut"
+		}), f(".layer-3", {
+			y: 1,
+			opacity: .6
+		}, {
+			duration: .3,
+			delay: .1,
+			ease: "easeOut"
+		});
+	}, [f]), m = t(() => {
+		f(".layer-1", {
+			y: 0,
+			scale: 1
+		}, { duration: .25 }), f(".layer-2", {
+			y: 0,
+			opacity: 1
+		}, { duration: .25 }), f(".layer-3", {
+			y: 0,
+			opacity: 1
+		}, { duration: .25 });
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		onHoverStart: p,
+		onHoverEnd: m,
+		xmlns: "http://www.w3.org/2000/svg",
+		width: e,
+		height: e,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: s,
+		strokeWidth: c,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: `cursor-pointer ${l}`,
+		style: { overflow: "visible" },
+		children: [
+			/* @__PURE__ */ a(r.path, {
+				className: "layer-1",
+				d: "M12 2l-8 4l8 4l8 -4l-8 -4"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "layer-2",
+				d: "M4 10l8 4l8 -4"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "layer-2",
+				d: "M4 14l8 4l8 -4"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "layer-3",
+				d: "M4 18l8 4l8 -4"
+			})
+		]
+	});
+});
+s.displayName = "Stack3Icon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=stack-3-icon.js.map

package/dist/animations/stack-3-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-3-icon.js","names":[],"sources":["../../src/animations/stack-3-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst Stack3Icon = forwardRef<AnimatedIconHandle, AnimatedIconProps>(\n  (\n    { size = 24, color = \"currentColor\", strokeWidth = 2, className = \"\" },\n    ref,\n  ) => {\n    const [scope, animate] = useAnimate();\n\n    const start = useCallback(async () => {\n      // top layer\n      animate(\n        \".layer-1\",\n        { y: -3, scale: 1.05 },\n        { duration: 0.3, ease: \"easeOut\" },\n      );\n\n      // middle layers\n      animate(\n        \".layer-2\",\n        { y: -1, opacity: 0.8 },\n        { duration: 0.3, delay: 0.05, ease: \"easeOut\" },\n      );\n\n      // bottom layer\n      animate(\n        \".layer-3\",\n        { y: 1, opacity: 0.6 },\n        { duration: 0.3, delay: 0.1, ease: \"easeOut\" },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\".layer-1\", { y: 0, scale: 1 }, { duration: 0.25 });\n      animate(\".layer-2\", { y: 0, opacity: 1 }, { duration: 0.25 });\n      animate(\".layer-3\", { y: 0, opacity: 1 }, { duration: 0.25 });\n    }, [animate]);\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.svg\n        ref={scope}\n        onHoverStart={start}\n        onHoverEnd={stop}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={size}\n        height={size}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={`cursor-pointer ${className}`}\n        style={{ overflow: \"visible\" }}\n      >\n        {/* top */}\n        <motion.path className=\"layer-1\" d=\"M12 2l-8 4l8 4l8 -4l-8 -4\" />\n\n        {/* middle */}\n        <motion.path className=\"layer-2\" d=\"M4 10l8 4l8 -4\" />\n        <motion.path className=\"layer-2\" d=\"M4 14l8 4l8 -4\" />\n\n        {/* bottom */}\n        <motion.path className=\"layer-3\" d=\"M4 18l8 4l8 -4\" />\n      </motion.svg>\n    );\n  },\n);\n\nStack3Icon.displayName = \"Stack3Icon\";\nexport default Stack3Icon;\n"],"mappings":";;;;AAIA,IAAM,IAAa,GAEf,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAE9B,IAAQ,EAAY,YAAY;EAgBpC,AAdA,EACE,YACA;GAAE,GAAG;GAAI,OAAO;EAAK,GACrB;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC,GAGA,EACE,YACA;GAAE,GAAG;GAAI,SAAS;EAAI,GACtB;GAAE,UAAU;GAAK,OAAO;GAAM,MAAM;EAAU,CAChD,GAGA,EACE,YACA;GAAE,GAAG;GAAG,SAAS;EAAI,GACrB;GAAE,UAAU;GAAK,OAAO;GAAK,MAAM;EAAU,CAC/C;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAG7B,AAFA,EAAQ,YAAY;GAAE,GAAG;GAAG,OAAO;EAAE,GAAG,EAAE,UAAU,IAAK,CAAC,GAC1D,EAAQ,YAAY;GAAE,GAAG;GAAG,SAAS;EAAE,GAAG,EAAE,UAAU,IAAK,CAAC,GAC5D,EAAQ,YAAY;GAAE,GAAG;GAAG,SAAS;EAAE,GAAG,EAAE,UAAU,IAAK,CAAC;CAC9D,GAAG,CAAC,CAAO,CAAC;CAOZ,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,cAAc;EACd,YAAY;EACZ,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAC7B,OAAO,EAAE,UAAU,UAAU;EAd/B,UAAA;GAiBE,kBAAC,EAAO,MAAR;IAAa,WAAU;IAAU,GAAE;GAA6B,CAAA;GAGhE,kBAAC,EAAO,MAAR;IAAa,WAAU;IAAU,GAAE;GAAkB,CAAA;GACrD,kBAAC,EAAO,MAAR;IAAa,WAAU;IAAU,GAAE;GAAkB,CAAA;GAGrD,kBAAC,EAAO,MAAR;IAAa,WAAU;IAAU,GAAE;GAAkB,CAAA;EAC3C;;AAEhB,CACF;AAEA,EAAW,cAAc"}

package/dist/animations/stack-icon.d.ts

@@ -0,0 +1,4 @@
+import { AnimatedIconHandle, AnimatedIconProps } from './types';
+declare const StackIcon: import('react').ForwardRefExoticComponent<AnimatedIconProps & import('react').RefAttributes<AnimatedIconHandle>>;
+export default StackIcon;
+//# sourceMappingURL=stack-icon.d.ts.map

package/dist/animations/stack-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-icon.d.ts","sourceRoot":"","sources":["../../src/animations/stack-icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGrE,QAAA,MAAM,SAAS,kHAiEd,CAAC;AAGF,eAAe,SAAS,CAAC"}

package/dist/animations/stack-icon.js

@@ -0,0 +1,66 @@
+import { forwardRef as e, useCallback as t, useImperativeHandle as n } from "react";
+import { motion as r, useAnimate as i } from "motion/react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/animations/stack-icon.tsx
+var s = e(({ size: e = 24, color: s = "currentColor", strokeWidth: c = 2, className: l = "" }, u) => {
+	let [d, f] = i(), p = t(() => {
+		f(".layer-top", {
+			y: -2,
+			scale: 1.05
+		}, {
+			duration: .3,
+			ease: "easeOut"
+		}), f(".layer-bottom", {
+			y: 1,
+			opacity: .7
+		}, {
+			duration: .3,
+			ease: "easeOut"
+		});
+	}, [f]), m = t(() => {
+		f(".layer-top", {
+			y: 0,
+			scale: 1
+		}, {
+			duration: .25,
+			ease: "easeInOut"
+		}), f(".layer-bottom", {
+			y: 0,
+			opacity: 1
+		}, {
+			duration: .25,
+			ease: "easeInOut"
+		});
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		onHoverStart: p,
+		onHoverEnd: m,
+		xmlns: "http://www.w3.org/2000/svg",
+		width: e,
+		height: e,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: s,
+		strokeWidth: c,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: `cursor-pointer ${l}`,
+		style: { overflow: "visible" },
+		children: [/* @__PURE__ */ a(r.path, {
+			className: "layer-top",
+			d: "M12 6l-8 4l8 4l8 -4l-8 -4"
+		}), /* @__PURE__ */ a(r.path, {
+			className: "layer-bottom",
+			d: "M4 14l8 4l8 -4"
+		})]
+	});
+});
+s.displayName = "StackIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=stack-icon.js.map

package/dist/animations/stack-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-icon.js","names":[],"sources":["../../src/animations/stack-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst StackIcon = forwardRef<AnimatedIconHandle, AnimatedIconProps>(\n  (\n    { size = 24, color = \"currentColor\", strokeWidth = 2, className = \"\" },\n    ref,\n  ) => {\n    const [scope, animate] = useAnimate();\n\n    const start = useCallback(() => {\n      animate(\n        \".layer-top\",\n        { y: -2, scale: 1.05 },\n        { duration: 0.3, ease: \"easeOut\" },\n      );\n\n      animate(\n        \".layer-bottom\",\n        { y: 1, opacity: 0.7 },\n        { duration: 0.3, ease: \"easeOut\" },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".layer-top\",\n        { y: 0, scale: 1 },\n        { duration: 0.25, ease: \"easeInOut\" },\n      );\n\n      animate(\n        \".layer-bottom\",\n        { y: 0, opacity: 1 },\n        { duration: 0.25, ease: \"easeInOut\" },\n      );\n    }, [animate]);\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.svg\n        ref={scope}\n        onHoverStart={start}\n        onHoverEnd={stop}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={size}\n        height={size}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={`cursor-pointer ${className}`}\n        style={{ overflow: \"visible\" }}\n      >\n        {/* Top layer */}\n        <motion.path className=\"layer-top\" d=\"M12 6l-8 4l8 4l8 -4l-8 -4\" />\n\n        {/* Bottom layer */}\n        <motion.path className=\"layer-bottom\" d=\"M4 14l8 4l8 -4\" />\n      </motion.svg>\n    );\n  },\n);\n\nStackIcon.displayName = \"StackIcon\";\nexport default StackIcon;\n"],"mappings":";;;;AAIA,IAAM,IAAY,GAEd,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAE9B,IAAQ,QAAkB;EAO9B,AANA,EACE,cACA;GAAE,GAAG;GAAI,OAAO;EAAK,GACrB;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC,GAEA,EACE,iBACA;GAAE,GAAG;GAAG,SAAS;EAAI,GACrB;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAO7B,AANA,EACE,cACA;GAAE,GAAG;GAAG,OAAO;EAAE,GACjB;GAAE,UAAU;GAAM,MAAM;EAAY,CACtC,GAEA,EACE,iBACA;GAAE,GAAG;GAAG,SAAS;EAAE,GACnB;GAAE,UAAU;GAAM,MAAM;EAAY,CACtC;CACF,GAAG,CAAC,CAAO,CAAC;CAOZ,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,cAAc;EACd,YAAY;EACZ,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAC7B,OAAO,EAAE,UAAU,UAAU;EAd/B,UAAA,CAiBE,kBAAC,EAAO,MAAR;GAAa,WAAU;GAAY,GAAE;EAA6B,CAAA,GAGlE,kBAAC,EAAO,MAAR;GAAa,WAAU;GAAe,GAAE;EAAkB,CAAA,CAChD;;AAEhB,CACF;AAEA,EAAU,cAAc"}

package/dist/animations/star-icon.d.ts

@@ -0,0 +1,4 @@
+import { AnimatedIconHandle, AnimatedIconProps } from './types';
+declare const StarIcon: import('react').ForwardRefExoticComponent<AnimatedIconProps & import('react').RefAttributes<AnimatedIconHandle>>;
+export default StarIcon;
+//# sourceMappingURL=star-icon.d.ts.map

package/dist/animations/star-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"star-icon.d.ts","sourceRoot":"","sources":["../../src/animations/star-icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGrE,QAAA,MAAM,QAAQ,kHAsEb,CAAC;AAGF,eAAe,QAAQ,CAAC"}

package/dist/animations/star-icon.js

@@ -0,0 +1,83 @@
+import { forwardRef as e, useCallback as t, useImperativeHandle as n } from "react";
+import { motion as r, useAnimate as i } from "motion/react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/animations/star-icon.tsx
+var s = e(({ size: e = 24, color: s = "currentColor", strokeWidth: c = 2, className: l = "" }, u) => {
+	let [d, f] = i(), p = t(async () => {
+		f(".star-fill", {
+			opacity: [0, 1],
+			scale: [.8, 1]
+		}, {
+			duration: .4,
+			ease: "easeOut"
+		}), f(".star-outline", {
+			scale: [
+				1,
+				1.1,
+				1
+			],
+			rotate: [
+				0,
+				-5,
+				5,
+				0
+			]
+		}, {
+			duration: .5,
+			ease: "easeInOut"
+		});
+	}, [f]), m = t(() => {
+		f(".star-fill", { opacity: [1, 0] }, {
+			duration: .3,
+			ease: "easeOut"
+		}), f(".star-outline", {
+			scale: 1,
+			rotate: 0
+		}, {
+			duration: .3,
+			ease: "easeInOut"
+		});
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		onHoverStart: p,
+		onHoverEnd: m,
+		xmlns: "http://www.w3.org/2000/svg",
+		width: e,
+		height: e,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: s,
+		strokeWidth: c,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: `cursor-pointer ${l}`,
+		children: [
+			/* @__PURE__ */ a("path", {
+				stroke: "none",
+				d: "M0 0h24v24H0z",
+				fill: "none"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "star-fill",
+				d: "M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z",
+				fill: s,
+				opacity: 0,
+				style: { transformOrigin: "center" }
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "star-outline",
+				d: "M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z",
+				style: { transformOrigin: "center" }
+			})
+		]
+	});
+});
+s.displayName = "StarIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=star-icon.js.map

package/dist/animations/star-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"star-icon.js","names":[],"sources":["../../src/animations/star-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst StarIcon = forwardRef<AnimatedIconHandle, AnimatedIconProps>(\n  (\n    { size = 24, color = \"currentColor\", strokeWidth = 2, className = \"\" },\n    ref,\n  ) => {\n    const [scope, animate] = useAnimate();\n\n    const start = useCallback(async () => {\n      animate(\n        \".star-fill\",\n        { opacity: [0, 1], scale: [0.8, 1] },\n        { duration: 0.4, ease: \"easeOut\" },\n      );\n      animate(\n        \".star-outline\",\n        { scale: [1, 1.1, 1], rotate: [0, -5, 5, 0] },\n        { duration: 0.5, ease: \"easeInOut\" },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".star-fill\",\n        { opacity: [1, 0] },\n        { duration: 0.3, ease: \"easeOut\" },\n      );\n      animate(\n        \".star-outline\",\n        { scale: 1, rotate: 0 },\n        { duration: 0.3, ease: \"easeInOut\" },\n      );\n    }, [animate]);\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.svg\n        ref={scope}\n        onHoverStart={start}\n        onHoverEnd={stop}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={size}\n        height={size}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={`cursor-pointer ${className}`}\n      >\n        <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n        <motion.path\n          className=\"star-fill\"\n          d=\"M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z\"\n          fill={color}\n          opacity={0}\n          style={{ transformOrigin: \"center\" }}\n        />\n        <motion.path\n          className=\"star-outline\"\n          d=\"M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z\"\n          style={{ transformOrigin: \"center\" }}\n        />\n      </motion.svg>\n    );\n  },\n);\n\nStarIcon.displayName = \"StarIcon\";\nexport default StarIcon;\n"],"mappings":";;;;AAIA,IAAM,IAAW,GAEb,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAE9B,IAAQ,EAAY,YAAY;EAMpC,AALA,EACE,cACA;GAAE,SAAS,CAAC,GAAG,CAAC;GAAG,OAAO,CAAC,IAAK,CAAC;EAAE,GACnC;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC,GACA,EACE,iBACA;GAAE,OAAO;IAAC;IAAG;IAAK;GAAC;GAAG,QAAQ;IAAC;IAAG;IAAI;IAAG;GAAC;EAAE,GAC5C;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAM7B,AALA,EACE,cACA,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE,GAClB;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC,GACA,EACE,iBACA;GAAE,OAAO;GAAG,QAAQ;EAAE,GACtB;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC;CACF,GAAG,CAAC,CAAO,CAAC;CAOZ,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,cAAc;EACd,YAAY;EACZ,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAb/B,UAAA;GAeE,kBAAC,QAAD;IAAM,QAAO;IAAO,GAAE;IAAgB,MAAK;GAAQ,CAAA;GACnD,kBAAC,EAAO,MAAR;IACE,WAAU;IACV,GAAE;IACF,MAAM;IACN,SAAS;IACT,OAAO,EAAE,iBAAiB,SAAS;GACpC,CAAA;GACD,kBAAC,EAAO,MAAR;IACE,WAAU;IACV,GAAE;IACF,OAAO,EAAE,iBAAiB,SAAS;GACpC,CAAA;EACS;;AAEhB,CACF;AAEA,EAAS,cAAc"}

package/dist/animations/subscript-icon.d.ts

@@ -0,0 +1,4 @@
+import { AnimatedIconHandle, AnimatedIconProps } from './types';
+declare const SubscriptIcon: import('react').ForwardRefExoticComponent<AnimatedIconProps & import('react').RefAttributes<AnimatedIconHandle>>;
+export default SubscriptIcon;
+//# sourceMappingURL=subscript-icon.d.ts.map

package/dist/animations/subscript-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"subscript-icon.d.ts","sourceRoot":"","sources":["../../src/animations/subscript-icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGrE,QAAA,MAAM,aAAa,kHAqElB,CAAC;AAGF,eAAe,aAAa,CAAC"}

package/dist/animations/subscript-icon.js

@@ -0,0 +1,74 @@
+import { forwardRef as e, useCallback as t, useImperativeHandle as n } from "react";
+import { motion as r, useAnimate as i } from "motion/react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/animations/subscript-icon.tsx
+var s = e(({ size: e = 24, color: s = "currentColor", strokeWidth: c = 2, className: l = "" }, u) => {
+	let [d, f] = i(), p = t(async () => {
+		await f(".x-mark", { scale: [
+			1,
+			1.06,
+			1
+		] }, {
+			duration: .25,
+			ease: "easeOut"
+		}), f(".subscript", {
+			y: [
+				0,
+				4,
+				3
+			],
+			scale: [
+				1,
+				.9,
+				.92
+			],
+			opacity: [
+				1,
+				.9,
+				1
+			]
+		}, {
+			duration: .45,
+			ease: "easeOut"
+		});
+	}, [f]), m = t(() => {
+		f(".x-mark, .subscript", {
+			scale: 1,
+			y: 0,
+			opacity: 1
+		}, {
+			duration: .2,
+			ease: "easeInOut"
+		});
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		onHoverStart: p,
+		onHoverEnd: m,
+		xmlns: "http://www.w3.org/2000/svg",
+		width: e,
+		height: e,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: s,
+		strokeWidth: c,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: `cursor-pointer ${l}`,
+		children: [/* @__PURE__ */ o(r.g, {
+			className: "x-mark",
+			children: [/* @__PURE__ */ a("path", { d: "m4 5 8 8" }), /* @__PURE__ */ a("path", { d: "m12 5-8 8" })]
+		}), /* @__PURE__ */ a(r.path, {
+			className: "subscript",
+			d: "M20 19h-4c0-1.5.44-2 1.5-2.5S20 15.33 20 14c0-.47-.17-.93-.48-1.29a2.11 2.11 0 0 0-2.62-.44c-.42.24-.74.62-.9 1.07"
+		})]
+	});
+});
+s.displayName = "SubscriptIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=subscript-icon.js.map

package/dist/animations/subscript-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"subscript-icon.js","names":[],"sources":["../../src/animations/subscript-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst SubscriptIcon = forwardRef<AnimatedIconHandle, AnimatedIconProps>(\n  (\n    { size = 24, color = \"currentColor\", strokeWidth = 2, className = \"\" },\n    ref,\n  ) => {\n    const [scope, animate] = useAnimate();\n\n    const start = useCallback(async () => {\n      await animate(\n        \".x-mark\",\n        { scale: [1, 1.06, 1] },\n        { duration: 0.25, ease: \"easeOut\" },\n      );\n\n      animate(\n        \".subscript\",\n        {\n          y: [0, 4, 3],\n          scale: [1, 0.9, 0.92],\n          opacity: [1, 0.9, 1],\n        },\n        {\n          duration: 0.45,\n          ease: \"easeOut\",\n        },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".x-mark, .subscript\",\n        { scale: 1, y: 0, opacity: 1 },\n        { duration: 0.2, ease: \"easeInOut\" },\n      );\n    }, [animate]);\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.svg\n        ref={scope}\n        onHoverStart={start}\n        onHoverEnd={stop}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={size}\n        height={size}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={`cursor-pointer ${className}`}\n      >\n        <motion.g className=\"x-mark\">\n          <path d=\"m4 5 8 8\" />\n          <path d=\"m12 5-8 8\" />\n        </motion.g>\n\n        <motion.path\n          className=\"subscript\"\n          d=\"M20 19h-4c0-1.5.44-2 1.5-2.5S20 15.33 20 14c0-.47-.17-.93-.48-1.29a2.11 2.11 0 0 0-2.62-.44c-.42.24-.74.62-.9 1.07\"\n        />\n      </motion.svg>\n    );\n  },\n);\n\nSubscriptIcon.displayName = \"SubscriptIcon\";\nexport default SubscriptIcon;\n"],"mappings":";;;;AAIA,IAAM,IAAgB,GAElB,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAE9B,IAAQ,EAAY,YAAY;EAOpC,AANA,MAAM,EACJ,WACA,EAAE,OAAO;GAAC;GAAG;GAAM;EAAC,EAAE,GACtB;GAAE,UAAU;GAAM,MAAM;EAAU,CACpC,GAEA,EACE,cACA;GACE,GAAG;IAAC;IAAG;IAAG;GAAC;GACX,OAAO;IAAC;IAAG;IAAK;GAAI;GACpB,SAAS;IAAC;IAAG;IAAK;GAAC;EACrB,GACA;GACE,UAAU;GACV,MAAM;EACR,CACF;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAC7B,EACE,uBACA;GAAE,OAAO;GAAG,GAAG;GAAG,SAAS;EAAE,GAC7B;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC;CACF,GAAG,CAAC,CAAO,CAAC;CAOZ,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,cAAc;EACd,YAAY;EACZ,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAb/B,UAAA,CAeE,kBAAC,EAAO,GAAR;GAAU,WAAU;GAApB,UAAA,CACE,kBAAC,QAAD,EAAM,GAAE,WAAY,CAAA,GACpB,kBAAC,QAAD,EAAM,GAAE,YAAa,CAAA,CACb;EAEV,CAAA,GAAA,kBAAC,EAAO,MAAR;GACE,WAAU;GACV,GAAE;EACH,CAAA,CACS;;AAEhB,CACF;AAEA,EAAc,cAAc"}

package/dist/animations/target-icon.d.ts

@@ -0,0 +1,4 @@
+import { AnimatedIconHandle, AnimatedIconProps } from './types';
+declare const TargetIcon: import('react').ForwardRefExoticComponent<AnimatedIconProps & import('react').RefAttributes<AnimatedIconHandle>>;
+export default TargetIcon;
+//# sourceMappingURL=target-icon.d.ts.map

package/dist/animations/target-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"target-icon.d.ts","sourceRoot":"","sources":["../../src/animations/target-icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGrE,QAAA,MAAM,UAAU,kHAuGf,CAAC;AAGF,eAAe,UAAU,CAAC"}

package/dist/animations/target-icon.js

@@ -0,0 +1,107 @@
+import { forwardRef as e, useCallback as t, useImperativeHandle as n } from "react";
+import { motion as r, useAnimate as i } from "motion/react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/animations/target-icon.tsx
+var s = e(({ size: e = 24, color: s = "currentColor", strokeWidth: c = 2, className: l = "" }, u) => {
+	let [d, f] = i(), p = t(async () => {
+		f(".circle-outer", {
+			scale: [
+				1,
+				1.1,
+				1
+			],
+			opacity: [
+				1,
+				.7,
+				1
+			]
+		}, {
+			duration: .6,
+			ease: "easeInOut"
+		}), f(".circle-middle", {
+			scale: [
+				1,
+				1.15,
+				1
+			],
+			opacity: [
+				1,
+				.6,
+				1
+			]
+		}, {
+			duration: .6,
+			ease: "easeInOut",
+			delay: .1
+		}), await f(".circle-inner", {
+			scale: [
+				1,
+				1.3,
+				1
+			],
+			opacity: [
+				1,
+				.5,
+				1
+			]
+		}, {
+			duration: .6,
+			ease: "easeInOut",
+			delay: .2
+		});
+	}, [f]), m = t(() => {
+		f(".circle-outer, .circle-middle, .circle-inner", {
+			scale: 1,
+			opacity: 1
+		}, {
+			duration: .2,
+			ease: "easeInOut"
+		});
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		onHoverStart: p,
+		onHoverEnd: m,
+		xmlns: "http://www.w3.org/2000/svg",
+		width: e,
+		height: e,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: s,
+		strokeWidth: c,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		className: `cursor-pointer ${l}`,
+		children: [
+			/* @__PURE__ */ a(r.circle, {
+				className: "circle-outer",
+				cx: "12",
+				cy: "12",
+				r: "10",
+				style: { transformOrigin: "12px 12px" }
+			}),
+			/* @__PURE__ */ a(r.circle, {
+				className: "circle-middle",
+				cx: "12",
+				cy: "12",
+				r: "6",
+				style: { transformOrigin: "12px 12px" }
+			}),
+			/* @__PURE__ */ a(r.circle, {
+				className: "circle-inner",
+				cx: "12",
+				cy: "12",
+				r: "2",
+				style: { transformOrigin: "12px 12px" }
+			})
+		]
+	});
+});
+s.displayName = "TargetIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=target-icon.js.map

package/dist/animations/target-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"target-icon.js","names":[],"sources":["../../src/animations/target-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst TargetIcon = forwardRef<AnimatedIconHandle, AnimatedIconProps>(\n  (\n    { size = 24, color = \"currentColor\", strokeWidth = 2, className = \"\" },\n    ref,\n  ) => {\n    const [scope, animate] = useAnimate();\n\n    const start = useCallback(async () => {\n      // Pulse all circles outward from center\n      animate(\n        \".circle-outer\",\n        {\n          scale: [1, 1.1, 1],\n          opacity: [1, 0.7, 1],\n        },\n        {\n          duration: 0.6,\n          ease: \"easeInOut\",\n        },\n      );\n\n      animate(\n        \".circle-middle\",\n        {\n          scale: [1, 1.15, 1],\n          opacity: [1, 0.6, 1],\n        },\n        {\n          duration: 0.6,\n          ease: \"easeInOut\",\n          delay: 0.1,\n        },\n      );\n\n      await animate(\n        \".circle-inner\",\n        {\n          scale: [1, 1.3, 1],\n          opacity: [1, 0.5, 1],\n        },\n        {\n          duration: 0.6,\n          ease: \"easeInOut\",\n          delay: 0.2,\n        },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".circle-outer, .circle-middle, .circle-inner\",\n        { scale: 1, opacity: 1 },\n        { duration: 0.2, ease: \"easeInOut\" },\n      );\n    }, [animate]);\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.svg\n        ref={scope}\n        onHoverStart={start}\n        onHoverEnd={stop}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={size}\n        height={size}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={`cursor-pointer ${className}`}\n      >\n        <motion.circle\n          className=\"circle-outer\"\n          cx=\"12\"\n          cy=\"12\"\n          r=\"10\"\n          style={{ transformOrigin: \"12px 12px\" }}\n        />\n\n        <motion.circle\n          className=\"circle-middle\"\n          cx=\"12\"\n          cy=\"12\"\n          r=\"6\"\n          style={{ transformOrigin: \"12px 12px\" }}\n        />\n\n        <motion.circle\n          className=\"circle-inner\"\n          cx=\"12\"\n          cy=\"12\"\n          r=\"2\"\n          style={{ transformOrigin: \"12px 12px\" }}\n        />\n      </motion.svg>\n    );\n  },\n);\n\nTargetIcon.displayName = \"TargetIcon\";\nexport default TargetIcon;\n"],"mappings":";;;;AAIA,IAAM,IAAa,GAEf,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAE9B,IAAQ,EAAY,YAAY;EA2BpC,AAzBA,EACE,iBACA;GACE,OAAO;IAAC;IAAG;IAAK;GAAC;GACjB,SAAS;IAAC;IAAG;IAAK;GAAC;EACrB,GACA;GACE,UAAU;GACV,MAAM;EACR,CACF,GAEA,EACE,kBACA;GACE,OAAO;IAAC;IAAG;IAAM;GAAC;GAClB,SAAS;IAAC;IAAG;IAAK;GAAC;EACrB,GACA;GACE,UAAU;GACV,MAAM;GACN,OAAO;EACT,CACF,GAEA,MAAM,EACJ,iBACA;GACE,OAAO;IAAC;IAAG;IAAK;GAAC;GACjB,SAAS;IAAC;IAAG;IAAK;GAAC;EACrB,GACA;GACE,UAAU;GACV,MAAM;GACN,OAAO;EACT,CACF;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAC7B,EACE,gDACA;GAAE,OAAO;GAAG,SAAS;EAAE,GACvB;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC;CACF,GAAG,CAAC,CAAO,CAAC;CAOZ,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,cAAc;EACd,YAAY;EACZ,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAb/B,UAAA;GAeE,kBAAC,EAAO,QAAR;IACE,WAAU;IACV,IAAG;IACH,IAAG;IACH,GAAE;IACF,OAAO,EAAE,iBAAiB,YAAY;GACvC,CAAA;GAED,kBAAC,EAAO,QAAR;IACE,WAAU;IACV,IAAG;IACH,IAAG;IACH,GAAE;IACF,OAAO,EAAE,iBAAiB,YAAY;GACvC,CAAA;GAED,kBAAC,EAAO,QAAR;IACE,WAAU;IACV,IAAG;IACH,IAAG;IACH,GAAE;IACF,OAAO,EAAE,iBAAiB,YAAY;GACvC,CAAA;EACS;;AAEhB,CACF;AAEA,EAAW,cAAc"}

package/dist/animations/telephone-icon.d.ts

@@ -0,0 +1,4 @@
+import { AnimatedIconHandle, AnimatedIconProps } from './types';
+declare const TelephoneIcon: import('react').ForwardRefExoticComponent<AnimatedIconProps & import('react').RefAttributes<AnimatedIconHandle>>;
+export default TelephoneIcon;
+//# sourceMappingURL=telephone-icon.d.ts.map

package/dist/animations/telephone-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"telephone-icon.d.ts","sourceRoot":"","sources":["../../src/animations/telephone-icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAIrE,QAAA,MAAM,aAAa,kHAiGlB,CAAC;AAGF,eAAe,aAAa,CAAC"}