nfx-ui 0.17.0 → 0.22.0

package/dist/animations/index.js

@@ -0,0 +1,266 @@
+import e from "./accessibility-icon.js";
+import t from "./airplane-icon.js";
+import n from "./alarm-clock-plus-icon.js";
+import r from "./align-center-icon.js";
+import i from "./align-vertical-space-around-icon.js";
+import a from "./ambulance-icon.js";
+import o from "./ampersand-icon.js";
+import s from "./angry-icon.js";
+import c from "./annoyed-icon.js";
+import l from "./apple-brand-logo.js";
+import u from "./arrow-back-icon.js";
+import d from "./arrow-back-up-icon.js";
+import f from "./arrow-big-down-dash-icon.js";
+import p from "./arrow-big-down-icon.js";
+import m from "./arrow-big-left-dash-icon.js";
+import h from "./arrow-big-left-icon.js";
+import g from "./arrow-big-right-dash-icon.js";
+import _ from "./arrow-big-right-icon.js";
+import v from "./arrow-big-up-dash-icon.js";
+import y from "./arrow-big-up-icon.js";
+import b from "./arrow-down-0-1-icon.js";
+import x from "./arrow-down-1-0-icon.js";
+import S from "./arrow-down-a-z-icon.js";
+import C from "./arrow-narrow-down-dashed-icon.js";
+import w from "./arrow-narrow-down-icon.js";
+import T from "./arrow-narrow-left-dashed-icon.js";
+import E from "./arrow-narrow-left-icon.js";
+import D from "./arrow-narrow-right-dashed-icon.js";
+import O from "./arrow-narrow-right-icon.js";
+import k from "./arrow-narrow-up-dashed-icon.js";
+import A from "./arrow-narrow-up-icon.js";
+import j from "./at-sign-icon.js";
+import M from "./banana-icon.js";
+import N from "./battery-charging-icon.js";
+import P from "./battery-icon.js";
+import F from "./battery-pause-icon.js";
+import I from "./bell-off-icon.js";
+import L from "./bluetooth-connected-icon.js";
+import { DEFAULT_STROKE_WIDTH as R, scaledStrokeWidth as z } from "./types.js";
+import B from "./book-icon.js";
+import V from "./bookmark-icon.js";
+import H from "./brain-circuit-icon.js";
+import U from "./brand-aistudio-icon.js";
+import W from "./brand-anthropic-icon.js";
+import G from "./brand-aws-icon.js";
+import K from "./brand-bags-fm-icon.js";
+import q from "./brand-chrome-icon.js";
+import J from "./brand-cursor-icon.js";
+import Y from "./brand-gemini-icon.js";
+import X from "./brand-google-icon.js";
+import Z from "./brand-grok-icon.js";
+import Q from "./brand-lmstudio-icon.js";
+import $ from "./brand-midjourney-icon.js";
+import ee from "./brand-nextjs-icon.js";
+import te from "./brand-notion-icon.js";
+import ne from "./brand-ollama-icon.js";
+import re from "./brand-openai-icon.js";
+import ie from "./brand-paypal-icon.js";
+import ae from "./brand-qwen-icon.js";
+import oe from "./brand-railway-icon.js";
+import se from "./brand-react-icon.js";
+import ce from "./brand-react-native-icon.js";
+import le from "./brand-stripe-icon.js";
+import ue from "./brand-telegram-icon.js";
+import de from "./brand-threads-icon.js";
+import fe from "./brand-twitch-icon.js";
+import pe from "./brand-vercel-icon.js";
+import me from "./brand-windows-icon.js";
+import he from "./brand-wordpress-icon.js";
+import ge from "./brand-xai-icon.js";
+import _e from "./brand-zoom-icon.js";
+import ve from "./brightness-down-icon.js";
+import ye from "./bug-icon.js";
+import be from "./bulb-svg.js";
+import xe from "./camera-icon.js";
+import Se from "./camera-off-icon.js";
+import Ce from "./candy-cane-icon.js";
+import we from "./cart-icon.js";
+import Te from "./chart-bar-icon.js";
+import Ee from "./chart-covariate-icon.js";
+import De from "./chart-histogram-icon.js";
+import Oe from "./chart-line-icon.js";
+import ke from "./chart-pie-icon.js";
+import Ae from "./checked-icon.js";
+import je from "./clock-icon.js";
+import Me from "./cloud-1-icon.js";
+import Ne from "./cloud-2-icon.js";
+import Pe from "./cloud-3-icon.js";
+import Fe from "./code-icon.js";
+import Ie from "./code-xml-icon.js";
+import Le from "./coffee-icon.js";
+import Re from "./coin-bitcoin-icon.js";
+import ze from "./copy-icon.js";
+import Be from "./copy-off-icon.js";
+import Ve from "./copyright-icon.js";
+import He from "./cpu-icon.js";
+import Ue from "./credit-card.js";
+import We from "./currency-bitcoin-icon.js";
+import Ge from "./currency-dollar-icon.js";
+import Ke from "./currency-ethereum-icon.js";
+import qe from "./currency-euro-icon.js";
+import Je from "./currency-rupee-icon.js";
+import Ye from "./device-airpods-icon.js";
+import Xe from "./dialpad-icon.js";
+import Ze from "./dino-icon.js";
+import Qe from "./discord-icon.js";
+import $e from "./docker-icon.js";
+import et from "./dots-horizontal-icon.js";
+import tt from "./dots-vertical-icon.js";
+import nt from "./double-check-icon.js";
+import rt from "./down-chevron.js";
+import it from "./download-icon.js";
+import at from "./drum-icon.js";
+import ot from "./expand-icon.js";
+import st from "./external-link-icon.js";
+import ct from "./eye-icon.js";
+import lt from "./eye-off-icon.js";
+import ut from "./facebook-icon.js";
+import dt from "./figma-icon.js";
+import ft from "./file-description-icon.js";
+import pt from "./filled-bell-icon.js";
+import mt from "./filled-checked-icon.js";
+import ht from "./filter-icon.js";
+import gt from "./flame-icon.js";
+import _t from "./focus-icon.js";
+import vt from "./gamepad-icon.js";
+import yt from "./gauge-icon.js";
+import bt from "./gear-icon.js";
+import xt from "./ghost-icon.js";
+import St from "./github-copilot-icon.js";
+import Ct from "./github-icon.js";
+import wt from "./gitlab-icon.js";
+import Tt from "./globe-icon.js";
+import Et from "./gmail-icon.js";
+import Dt from "./golang-icon.js";
+import Ot from "./hand-heart-icon.js";
+import kt from "./hashtag-icon.js";
+import At from "./heart-icon.js";
+import jt from "./history-circle-icon.js";
+import Mt from "./home-icon.js";
+import Nt from "./hotel-icon.js";
+import { useAnimatedIconTrigger as Pt } from "./useAnimatedIconTrigger.js";
+import Ft from "./info-circle-icon.js";
+import It from "./instagram-icon.js";
+import Lt from "./javascript-icon.js";
+import Rt from "./keyframes-icon.js";
+import zt from "./layers-icon.js";
+import Bt from "./layout-bottombar-collapse-icon.js";
+import Vt from "./layout-dashboard-icon.js";
+import Ht from "./layout-sidebar-right-collapse-icon.js";
+import Ut from "./layout-sidebar-right-icon.js";
+import Wt from "./letter-a-icon.js";
+import Gt from "./letter-b-icon.js";
+import Kt from "./letter-c-icon.js";
+import qt from "./letter-d-icon.js";
+import Jt from "./letter-e-icon.js";
+import Yt from "./letter-f-icon.js";
+import Xt from "./letter-g-icon.js";
+import Zt from "./letter-h-icon.js";
+import Qt from "./letter-i-icon.js";
+import $t from "./letter-j-icon.js";
+import en from "./letter-k-icon.js";
+import tn from "./letter-l-icon.js";
+import nn from "./letter-m-icon.js";
+import rn from "./letter-n-icon.js";
+import an from "./letter-o-icon.js";
+import on from "./letter-p-icon.js";
+import sn from "./letter-q-icon.js";
+import cn from "./letter-r-icon.js";
+import ln from "./letter-s-icon.js";
+import un from "./letter-t-icon.js";
+import dn from "./letter-u-icon.js";
+import fn from "./letter-v-icon.js";
+import pn from "./letter-w-icon.js";
+import mn from "./letter-x-icon.js";
+import hn from "./letter-y-icon.js";
+import gn from "./letter-z-icon.js";
+import _n from "./library-icon.js";
+import vn from "./like-icon.js";
+import yn from "./link-icon.js";
+import bn from "./linkedin-icon.js";
+import xn from "./locate-icon.js";
+import Sn from "./lock-icon.js";
+import Cn from "./logout-icon.js";
+import wn from "./magnifier-icon.js";
+import Tn from "./mail-filled-icon.js";
+import En from "./map-pin-icon.js";
+import Dn from "./meh-icon.js";
+import On from "./message-circle-icon.js";
+import kn from "./moon-icon.js";
+import An from "./mouse-pointer-2-icon.js";
+import jn from "./mysql-icon.js";
+import Mn from "./nodejs-icon.js";
+import Nn from "./paint-icon.js";
+import Pn from "./party-popper-icon.js";
+import Fn from "./passport-icon.js";
+import In from "./paw-print-icon.js";
+import Ln from "./pen-icon.js";
+import Rn from "./phone-volume.js";
+import zn from "./pinterest-icon.js";
+import Bn from "./player-icon.js";
+import Vn from "./plug-connected-icon.js";
+import Hn from "./plug-connected-x-icon.js";
+import Un from "./python-icon.js";
+import Wn from "./qrcode-icon.js";
+import Gn from "./question-mark.js";
+import Kn from "./radio-icon.js";
+import qn from "./rainbow-icon.js";
+import Jn from "./refresh-icon.js";
+import Yn from "./right-chevron.js";
+import Xn from "./rocket-icon.js";
+import Zn from "./rosette-discount-check-icon.js";
+import Qn from "./rosette-discount-icon.js";
+import $n from "./router-icon.js";
+import er from "./satellite-dish-icon.js";
+import tr from "./save-icon.js";
+import nr from "./scan-barcode-icon.js";
+import rr from "./scan-heart-icon.js";
+import ir from "./send-horizontal-icon.js";
+import ar from "./send-icon.js";
+import or from "./shield-check.js";
+import sr from "./shopping-cart-icon.js";
+import cr from "./simple-checked-icon.js";
+import lr from "./skull-emoji.js";
+import ur from "./slack-icon.js";
+import dr from "./sliders-horizontal-icon.js";
+import fr from "./snapchat-icon.js";
+import pr from "./soup-icon.js";
+import mr from "./sparkles-icon.js";
+import hr from "./spotify-icon.js";
+import gr from "./stack-3-icon.js";
+import _r from "./stack-icon.js";
+import vr from "./star-icon.js";
+import yr from "./subscript-icon.js";
+import br from "./target-icon.js";
+import xr from "./telephone-icon.js";
+import Sr from "./terminal-icon.js";
+import Cr from "./toggle-icon.js";
+import wr from "./trash-icon.js";
+import Tr from "./travel-bag.js";
+import Er from "./triangle-alert-icon.js";
+import Dr from "./trophy-icon.js";
+import Or from "./truck-electric-icon.js";
+import kr from "./twitter-icon.js";
+import Ar from "./twitter-x-icon.js";
+import jr from "./typescript-icon.js";
+import Mr from "./unlink-icon.js";
+import Nr from "./unordered-list-icon.js";
+import Pr from "./upload-icon.js";
+import Fr from "./user-check-icon.js";
+import Ir from "./user-icon.js";
+import Lr from "./user-plus-icon.js";
+import Rr from "./users-group-icon.js";
+import zr from "./users-icon.js";
+import Br from "./vinyl-icon.js";
+import Vr from "./volume-2-icon.js";
+import Hr from "./volume-x-icon.js";
+import Ur from "./wallet-icon.js";
+import Wr from "./washing-machine-icon.js";
+import Gr from "./whatsapp-icon.js";
+import Kr from "./wifi-icon.js";
+import qr from "./wifi-off-icon.js";
+import Jr from "./world-icon.js";
+import Yr from "./x-icon.js";
+import Xr from "./youtube-icon.js";
+export { e as AccessibilityIcon, t as AirplaneIcon, n as AlarmClockPlusIcon, r as AlignCenterIcon, i as AlignVerticalSpaceAroundIcon, a as AmbulanceIcon, o as AmpersandIcon, s as AngryIcon, c as AnnoyedIcon, l as AppleBrandLogo, u as ArrowBackIcon, d as ArrowBackUpIcon, f as ArrowBigDownDashIcon, p as ArrowBigDownIcon, m as ArrowBigLeftDashIcon, h as ArrowBigLeftIcon, g as ArrowBigRightDashIcon, _ as ArrowBigRightIcon, v as ArrowBigUpDashIcon, y as ArrowBigUpIcon, b as ArrowDown01Icon, x as ArrowDown10Icon, S as ArrowDownAZIcon, C as ArrowNarrowDownDashedIcon, w as ArrowNarrowDownIcon, T as ArrowNarrowLeftDashedIcon, E as ArrowNarrowLeftIcon, D as ArrowNarrowRightDashedIcon, O as ArrowNarrowRightIcon, k as ArrowNarrowUpDashedIcon, A as ArrowNarrowUpIcon, j as AtSignIcon, M as BananaIcon, N as BatteryChargingIcon, P as BatteryIcon, F as BatteryPauseIcon, I as BellOffIcon, L as BluetoothConnectedIcon, B as BookIcon, V as BookmarkIcon, H as BrainCircuitIcon, U as BrandAiStudioIcon, W as BrandAnthropicIcon, G as BrandAwsIcon, K as BrandBagsFmIcon, q as BrandChromeIcon, J as BrandCursorIcon, Y as BrandGeminiIcon, X as BrandGoogleIcon, Z as BrandGrokIcon, Q as BrandLmStudioIcon, $ as BrandMidJourneyIcon, ee as BrandNextjsIcon, te as BrandNotionIcon, ne as BrandOllamaIcon, re as BrandOpenaiIcon, ie as BrandPaypalIcon, ae as BrandQwenIcon, oe as BrandRailwayIcon, se as BrandReactIcon, ce as BrandReactNativeIcon, le as BrandStripeIcon, ue as BrandTelegramIcon, de as BrandThreadsIcon, fe as BrandTwitchIcon, pe as BrandVercelIcon, me as BrandWindowsIcon, he as BrandWordPressIcon, ge as BrandXaiIcon, _e as BrandZoomIcon, ve as BrightnessDownIcon, ye as BugIcon, be as BulbSvg, xe as CameraIcon, Se as CameraOffIcon, Ce as CandyCaneIcon, we as CartIcon, Te as ChartBarIcon, Ee as ChartCovariateIcon, De as ChartHistogramIcon, Oe as ChartLineIcon, ke as ChartPieIcon, Ae as CheckedIcon, je as ClockIcon, Me as Cloud1Icon, Ne as Cloud2Icon, Pe as Cloud3Icon, Fe as CodeIcon, Ie as CodeXmlIcon, Le as CoffeeIcon, Re as CoinBitcoinIcon, ze as CopyIcon, Be as CopyOffIcon, Ve as CopyrightIcon, He as CpuIcon, Ue as CreditCard, We as CurrencyBitcoinIcon, Ge as CurrencyDollarIcon, Ke as CurrencyEthereumIcon, qe as CurrencyEuroIcon, Je as CurrencyRupeeIcon, R as DEFAULT_STROKE_WIDTH, Ye as DeviceAirpodsIcon, Xe as DialpadIcon, Ze as DinoIcon, Qe as DiscordIcon, $e as DockerIcon, et as DotsHorizontalIcon, tt as DotsVerticalIcon, nt as DoubleCheckIcon, rt as DownChevron, it as DownloadIcon, at as DrumIcon, ot as ExpandIcon, st as ExternalLinkIcon, ct as EyeIcon, lt as EyeOffIcon, ut as FacebookIcon, dt as FigmaIcon, ft as FileDescriptionIcon, pt as FilledBellIcon, mt as FilledCheckedIcon, ht as FilterIcon, gt as FlameIcon, _t as FocusIcon, vt as GamepadIcon, yt as GaugeIcon, bt as GearIcon, xt as GhostIcon, St as GithubCopilotIcon, Ct as GithubIcon, wt as GitlabIcon, Tt as GlobeIcon, Et as GmailIcon, Dt as GolangIcon, Ot as HandHeartIcon, kt as HashtagIcon, At as HeartIcon, jt as HistoryCircleIcon, Mt as HomeIcon, Nt as HotelIcon, Ft as InfoCircleIcon, It as InstagramIcon, Lt as JavascriptIcon, Rt as KeyframesIcon, zt as LayersIcon, Bt as LayoutBottombarCollapseIcon, Vt as LayoutDashboardIcon, Ht as LayoutSidebarRightCollapseIcon, Ut as LayoutSidebarRightIcon, Wt as LetterAIcon, Gt as LetterBIcon, Kt as LetterCIcon, qt as LetterDIcon, Jt as LetterEIcon, Yt as LetterFIcon, Xt as LetterGIcon, Zt as LetterHIcon, Qt as LetterIIcon, $t as LetterJIcon, en as LetterKIcon, tn as LetterLIcon, nn as LetterMIcon, rn as LetterNIcon, an as LetterOIcon, on as LetterPIcon, sn as LetterQIcon, cn as LetterRIcon, ln as LetterSIcon, un as LetterTIcon, dn as LetterUIcon, fn as LetterVIcon, pn as LetterWIcon, mn as LetterXIcon, hn as LetterYIcon, gn as LetterZIcon, _n as LibraryIcon, vn as LikeIcon, yn as LinkIcon, bn as LinkedinIcon, xn as LocateIcon, Sn as LockIcon, Cn as LogoutIcon, wn as MagnifierIcon, Tn as MailFilledIcon, En as MapPinIcon, Dn as MehIcon, On as MessageCircleIcon, kn as MoonIcon, An as MousePointer2Icon, jn as MysqlIcon, Mn as NodejsIcon, Nn as PaintIcon, Pn as PartyPopperIcon, Fn as PassportIcon, In as PawPrintIcon, Ln as PenIcon, Rn as PhoneVolume, zn as PinterestIcon, Bn as PlayerIcon, Vn as PlugConnectedIcon, Hn as PlugConnectedXIcon, Un as PythonIcon, Wn as QrcodeIcon, Gn as QuestionMark, Kn as RadioIcon, qn as RainbowIcon, Jn as RefreshIcon, Yn as RightChevron, Xn as RocketIcon, Zn as RosetteDiscountCheckIcon, Qn as RosetteDiscountIcon, $n as RouterIcon, er as SatelliteDishIcon, tr as SaveIcon, nr as ScanBarcodeIcon, rr as ScanHeartIcon, ir as SendHorizontalIcon, ar as SendIcon, or as ShieldCheck, sr as ShoppingCartIcon, cr as SimpleCheckedIcon, lr as SkullEmoji, ur as SlackIcon, dr as SlidersHorizontalIcon, fr as SnapchatIcon, pr as SoupIcon, mr as SparklesIcon, hr as SpotifyIcon, gr as Stack3Icon, _r as StackIcon, vr as StarIcon, yr as SubscriptIcon, br as TargetIcon, xr as TelephoneIcon, Sr as TerminalIcon, Cr as ToggleIcon, wr as TrashIcon, Tr as TravelBag, Er as TriangleAlertIcon, Dr as TrophyIcon, Or as TruckElectricIcon, kr as TwitterIcon, Ar as TwitterXIcon, jr as TypescriptIcon, Mr as UnlinkIcon, Nr as UnorderedListIcon, Pr as UploadIcon, Fr as UserCheckIcon, Ir as UserIcon, Lr as UserPlusIcon, Rr as UsersGroupIcon, zr as UsersIcon, Br as VinylIcon, Vr as Volume2Icon, Hr as VolumeXIcon, Ur as WalletIcon, Wr as WashingMachineIcon, Gr as WhatsappIcon, Kr as WifiIcon, qr as WifiOffIcon, Jr as WorldIcon, Yr as XIcon, Xr as YoutubeIcon, z as scaledStrokeWidth, Pt as useAnimatedIconTrigger };

package/dist/animations/info-circle-icon.d.ts

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

package/dist/animations/info-circle-icon.d.ts.map

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

package/dist/animations/info-circle-icon.js

@@ -0,0 +1,62 @@
+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/info-circle-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(".info-circle-i", { pathLength: [0, 1] }, {
+			duration: .3,
+			ease: "easeOut"
+		}), f(".info-line-i", { pathLength: [0, 1] }, {
+			duration: .4,
+			ease: "easeOut"
+		});
+	}, [f]), m = t(() => {
+		f(".info-circle-i, .info-line-i", { pathLength: 1 }, {
+			duration: .2,
+			ease: "easeInOut"
+		});
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		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}`,
+		onHoverStart: p,
+		onHoverEnd: m,
+		children: [
+			/* @__PURE__ */ a(r.path, {
+				stroke: "none",
+				d: "M0 0h24v24H0z",
+				fill: "none"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				d: "M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0",
+				className: "info-circle"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				d: "M12 9h.01",
+				className: "info-circle-i"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				d: "M11 12h1v4h1",
+				className: "info-line-i"
+			})
+		]
+	});
+});
+s.displayName = "InfoCircleIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=info-circle-icon.js.map

package/dist/animations/info-circle-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"info-circle-icon.js","names":[],"sources":["../../src/animations/info-circle-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst InfoCircleIcon = 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        \".info-circle-i\",\n        {\n          pathLength: [0, 1],\n        },\n        {\n          duration: 0.3,\n          ease: \"easeOut\",\n        },\n      );\n\n      animate(\n        \".info-line-i\",\n        {\n          pathLength: [0, 1],\n        },\n        {\n          duration: 0.4,\n          ease: \"easeOut\",\n        },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".info-circle-i, .info-line-i\",\n        { pathLength: 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        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        onHoverStart={start}\n        onHoverEnd={stop}\n      >\n        <motion.path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n        <motion.path\n          d=\"M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0\"\n          className=\"info-circle\"\n        />\n        <motion.path d=\"M12 9h.01\" className=\"info-circle-i\" />\n        <motion.path d=\"M11 12h1v4h1\" className=\"info-line-i\" />\n      </motion.svg>\n    );\n  },\n);\n\nInfoCircleIcon.displayName = \"InfoCircleIcon\";\nexport default InfoCircleIcon;\n"],"mappings":";;;;AAIA,IAAM,IAAiB,GAEnB,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAE9B,IAAQ,EAAY,YAAY;EAYpC,AAXA,MAAM,EACJ,kBACA,EACE,YAAY,CAAC,GAAG,CAAC,EACnB,GACA;GACE,UAAU;GACV,MAAM;EACR,CACF,GAEA,EACE,gBACA,EACE,YAAY,CAAC,GAAG,CAAC,EACnB,GACA;GACE,UAAU;GACV,MAAM;EACR,CACF;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAC7B,EACE,gCACA,EAAE,YAAY,EAAE,GAChB;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,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAC7B,cAAc;EACd,YAAY;EAbd,UAAA;GAeE,kBAAC,EAAO,MAAR;IAAa,QAAO;IAAO,GAAE;IAAgB,MAAK;GAAQ,CAAA;GAC1D,kBAAC,EAAO,MAAR;IACE,GAAE;IACF,WAAU;GACX,CAAA;GACD,kBAAC,EAAO,MAAR;IAAa,GAAE;IAAY,WAAU;GAAiB,CAAA;GACtD,kBAAC,EAAO,MAAR;IAAa,GAAE;IAAe,WAAU;GAAe,CAAA;EAC7C;;AAEhB,CACF;AAEA,EAAe,cAAc"}

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

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

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

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

package/dist/animations/instagram-icon.js

@@ -0,0 +1,79 @@
+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/instagram-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(".ig-body", { scale: [
+			1,
+			1.05,
+			1
+		] }, {
+			duration: .3,
+			ease: "easeOut"
+		}), await f(".ig-lens", { scale: [
+			1,
+			1.2,
+			1
+		] }, {
+			duration: .25,
+			ease: "easeOut"
+		}), f(".ig-dot", { opacity: [
+			1,
+			0,
+			1
+		] }, {
+			duration: .2,
+			ease: "easeInOut"
+		});
+	}, [f]), m = t(() => {
+		f(".ig-body, .ig-lens, .ig-dot", {
+			scale: 1,
+			opacity: 1
+		}, {
+			duration: .2,
+			ease: "easeInOut"
+		});
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ a(r.div, {
+		ref: d,
+		className: `inline-flex cursor-pointer ${l}`,
+		onHoverStart: p,
+		onHoverEnd: m,
+		children: /* @__PURE__ */ o("svg", {
+			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",
+			children: [
+				/* @__PURE__ */ a(r.path, {
+					className: "ig-body",
+					style: { transformOrigin: "50% 50%" },
+					d: "M4 8a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z"
+				}),
+				/* @__PURE__ */ a(r.path, {
+					className: "ig-lens",
+					style: { transformOrigin: "50% 50%" },
+					d: "M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0"
+				}),
+				/* @__PURE__ */ a(r.path, {
+					className: "ig-dot",
+					d: "M16.5 7.5v.01"
+				})
+			]
+		})
+	});
+});
+s.displayName = "InstagramIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=instagram-icon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"instagram-icon.js","names":[],"sources":["../../src/animations/instagram-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst InstagramIcon = 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        \".ig-body\",\n        { scale: [1, 1.05, 1] },\n        { duration: 0.3, ease: \"easeOut\" },\n      );\n      await animate(\n        \".ig-lens\",\n        { scale: [1, 1.2, 1] },\n        { duration: 0.25, ease: \"easeOut\" },\n      );\n      animate(\n        \".ig-dot\",\n        { opacity: [1, 0, 1] },\n        { duration: 0.2, ease: \"easeInOut\" },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".ig-body, .ig-lens, .ig-dot\",\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.div\n        ref={scope}\n        className={`inline-flex cursor-pointer ${className}`}\n        onHoverStart={start}\n        onHoverEnd={stop}\n      >\n        <svg\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        >\n          <motion.path\n            className=\"ig-body\"\n            style={{ transformOrigin: \"50% 50%\" }}\n            d=\"M4 8a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z\"\n          />\n\n          <motion.path\n            className=\"ig-lens\"\n            style={{ transformOrigin: \"50% 50%\" }}\n            d=\"M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0\"\n          />\n\n          <motion.path className=\"ig-dot\" d=\"M16.5 7.5v.01\" />\n        </svg>\n      </motion.div>\n    );\n  },\n);\n\nInstagramIcon.displayName = \"InstagramIcon\";\nexport default InstagramIcon;\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;EAWpC,AAVA,EACE,YACA,EAAE,OAAO;GAAC;GAAG;GAAM;EAAC,EAAE,GACtB;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC,GACA,MAAM,EACJ,YACA,EAAE,OAAO;GAAC;GAAG;GAAK;EAAC,EAAE,GACrB;GAAE,UAAU;GAAM,MAAM;EAAU,CACpC,GACA,EACE,WACA,EAAE,SAAS;GAAC;GAAG;GAAG;EAAC,EAAE,GACrB;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAC7B,EACE,+BACA;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,WAAW,8BAA8B;EACzC,cAAc;EACd,YAAY;EAEZ,UAAA,kBAAC,OAAD;GACE,OAAM;GACN,OAAO;GACP,QAAQ;GACR,SAAQ;GACR,MAAK;GACL,QAAQ;GACK;GACb,eAAc;GACd,gBAAe;GATjB,UAAA;IAWE,kBAAC,EAAO,MAAR;KACE,WAAU;KACV,OAAO,EAAE,iBAAiB,UAAU;KACpC,GAAE;IACH,CAAA;IAED,kBAAC,EAAO,MAAR;KACE,WAAU;KACV,OAAO,EAAE,iBAAiB,UAAU;KACpC,GAAE;IACH,CAAA;IAED,kBAAC,EAAO,MAAR;KAAa,WAAU;KAAS,GAAE;IAAiB,CAAA;GAChD;;CACK,CAAA;AAEhB,CACF;AAEA,EAAc,cAAc"}

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

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

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

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

package/dist/animations/javascript-icon.js

@@ -0,0 +1,80 @@
+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/javascript-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(".js-text", {
+			pathLength: [0, 1],
+			opacity: [0, 1]
+		}, {
+			duration: .6,
+			ease: "easeOut"
+		}), await f(".border", { rotate: [
+			0,
+			5,
+			-5,
+			0
+		] }, {
+			duration: .5,
+			ease: "easeInOut"
+		});
+	}, [f]), m = t(() => {
+		f(".js-text, .border", {
+			pathLength: 1,
+			opacity: 1,
+			rotate: 0
+		}, { duration: .2 });
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ o(r.svg, {
+		ref: d,
+		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}`,
+		onHoverStart: p,
+		onHoverEnd: m,
+		children: [
+			/* @__PURE__ */ a("path", {
+				stroke: "none",
+				d: "M0 0h24v24H0z",
+				fill: "none"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "border",
+				style: { transformOrigin: "center" },
+				d: "M20 4l-2 14.5l-6 2l-6 -2l-2 -14.5z"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "js-text",
+				initial: {
+					pathLength: 1,
+					opacity: 1
+				},
+				d: "M7.5 8h3v8l-2 -1"
+			}),
+			/* @__PURE__ */ a(r.path, {
+				className: "js-text",
+				initial: {
+					pathLength: 1,
+					opacity: 1
+				},
+				d: "M16.5 8h-2.5a.5 .5 0 0 0 -.5 .5v3a.5 .5 0 0 0 .5 .5h1.423a.5 .5 0 0 1 .495 .57l-.418 2.93l-2 .5"
+			})
+		]
+	});
+});
+s.displayName = "JavascriptIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=javascript-icon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"javascript-icon.js","names":[],"sources":["../../src/animations/javascript-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst JavascriptIcon = 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        \".js-text\",\n        { pathLength: [0, 1], opacity: [0, 1] },\n        { duration: 0.6, ease: \"easeOut\" },\n      );\n      await animate(\n        \".border\",\n        { rotate: [0, 5, -5, 0] },\n        { duration: 0.5, ease: \"easeInOut\" },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".js-text, .border\",\n        { pathLength: 1, opacity: 1, rotate: 0 },\n        { duration: 0.2 },\n      );\n    }, [animate]);\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.svg\n        ref={scope}\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        onHoverStart={start}\n        onHoverEnd={stop}\n      >\n        <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n        <motion.path\n          className=\"border\"\n          style={{ transformOrigin: \"center\" }}\n          d=\"M20 4l-2 14.5l-6 2l-6 -2l-2 -14.5z\"\n        />\n        <motion.path\n          className=\"js-text\"\n          initial={{ pathLength: 1, opacity: 1 }}\n          d=\"M7.5 8h3v8l-2 -1\"\n        />\n        <motion.path\n          className=\"js-text\"\n          initial={{ pathLength: 1, opacity: 1 }}\n          d=\"M16.5 8h-2.5a.5 .5 0 0 0 -.5 .5v3a.5 .5 0 0 0 .5 .5h1.423a.5 .5 0 0 1 .495 .57l-.418 2.93l-2 .5\"\n        />\n      </motion.svg>\n    );\n  },\n);\n\nJavascriptIcon.displayName = \"JavascriptIcon\";\nexport default JavascriptIcon;\n"],"mappings":";;;;AAIA,IAAM,IAAiB,GAEnB,EAAE,UAAO,IAAI,WAAQ,gBAAgB,iBAAc,GAAG,eAAY,MAClE,MACG;CACH,IAAM,CAAC,GAAO,KAAW,EAAW,GAE9B,IAAQ,EAAY,YAAY;EAMpC,AALA,EACE,YACA;GAAE,YAAY,CAAC,GAAG,CAAC;GAAG,SAAS,CAAC,GAAG,CAAC;EAAE,GACtC;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC,GACA,MAAM,EACJ,WACA,EAAE,QAAQ;GAAC;GAAG;GAAG;GAAI;EAAC,EAAE,GACxB;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAC7B,EACE,qBACA;GAAE,YAAY;GAAG,SAAS;GAAG,QAAQ;EAAE,GACvC,EAAE,UAAU,GAAI,CAClB;CACF,GAAG,CAAC,CAAO,CAAC;CAOZ,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,QAAQ;EACK;EACb,eAAc;EACd,gBAAe;EACf,WAAW,kBAAkB;EAC7B,cAAc;EACd,YAAY;EAbd,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,SAAS;KAAE,YAAY;KAAG,SAAS;IAAE;IACrC,GAAE;GACH,CAAA;GACD,kBAAC,EAAO,MAAR;IACE,WAAU;IACV,SAAS;KAAE,YAAY;KAAG,SAAS;IAAE;IACrC,GAAE;GACH,CAAA;EACS;;AAEhB,CACF;AAEA,EAAe,cAAc"}

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

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

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

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

package/dist/animations/keyframes-icon.js

@@ -0,0 +1,81 @@
+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/keyframes-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(".frame-1", { x: [
+			0,
+			-2,
+			0
+		] }, {
+			duration: .4,
+			ease: "easeInOut"
+		}), f(".frame-2", { x: [
+			0,
+			2,
+			0
+		] }, {
+			duration: .4,
+			ease: "easeInOut",
+			delay: .1
+		}), f(".frame-3", { x: [
+			0,
+			4,
+			0
+		] }, {
+			duration: .4,
+			ease: "easeInOut",
+			delay: .2
+		});
+	}, [f]), m = t(() => {
+		f(".frame-1, .frame-2, .frame-3", { x: 0 }, {
+			duration: .2,
+			ease: "easeOut"
+		});
+	}, [f]);
+	return n(u, () => ({
+		startAnimation: p,
+		stopAnimation: m
+	})), /* @__PURE__ */ a(r.div, {
+		ref: d,
+		className: `inline-flex cursor-pointer items-center justify-center ${l}`,
+		onHoverStart: p,
+		onHoverEnd: m,
+		children: /* @__PURE__ */ o("svg", {
+			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",
+			children: [
+				/* @__PURE__ */ a("path", {
+					stroke: "none",
+					d: "M0 0h24v24H0z",
+					fill: "none"
+				}),
+				/* @__PURE__ */ a(r.path, {
+					className: "frame-1",
+					d: "M9.225 18.412a1.595 1.595 0 0 1 -1.225 .588c-.468 0 -.914 -.214 -1.225 -.588l-4.361 -5.248a1.844 1.844 0 0 1 0 -2.328l4.361 -5.248a1.595 1.595 0 0 1 1.225 -.588c.468 0 .914 .214 1.225 .588l4.361 5.248a1.844 1.844 0 0 1 0 2.328l-4.361 5.248z"
+				}),
+				/* @__PURE__ */ a(r.path, {
+					className: "frame-2",
+					d: "M17 5l4.586 5.836a1.844 1.844 0 0 1 0 2.328l-4.586 5.836"
+				}),
+				/* @__PURE__ */ a(r.path, {
+					className: "frame-3",
+					d: "M13 5l4.586 5.836a1.844 1.844 0 0 1 0 2.328l-4.586 5.836"
+				})
+			]
+		})
+	});
+});
+s.displayName = "KeyframesIcon";
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=keyframes-icon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"keyframes-icon.js","names":[],"sources":["../../src/animations/keyframes-icon.tsx"],"sourcesContent":["import { forwardRef, useImperativeHandle, useCallback } from \"react\";\nimport type { AnimatedIconHandle, AnimatedIconProps } from \"./types\";\nimport { motion, useAnimate } from \"motion/react\";\n\nconst KeyframesIcon = 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        \".frame-1\",\n        { x: [0, -2, 0] },\n        { duration: 0.4, ease: \"easeInOut\" },\n      );\n      animate(\n        \".frame-2\",\n        { x: [0, 2, 0] },\n        { duration: 0.4, ease: \"easeInOut\", delay: 0.1 },\n      );\n      animate(\n        \".frame-3\",\n        { x: [0, 4, 0] },\n        { duration: 0.4, ease: \"easeInOut\", delay: 0.2 },\n      );\n    }, [animate]);\n\n    const stop = useCallback(() => {\n      animate(\n        \".frame-1, .frame-2, .frame-3\",\n        { x: 0 },\n        { duration: 0.2, ease: \"easeOut\" },\n      );\n    }, [animate]);\n\n    useImperativeHandle(ref, () => ({\n      startAnimation: start,\n      stopAnimation: stop,\n    }));\n\n    return (\n      <motion.div\n        ref={scope}\n        className={`inline-flex cursor-pointer items-center justify-center ${className}`}\n        onHoverStart={start}\n        onHoverEnd={stop}\n      >\n        <svg\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        >\n          <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n          <motion.path\n            className=\"frame-1\"\n            d=\"M9.225 18.412a1.595 1.595 0 0 1 -1.225 .588c-.468 0 -.914 -.214 -1.225 -.588l-4.361 -5.248a1.844 1.844 0 0 1 0 -2.328l4.361 -5.248a1.595 1.595 0 0 1 1.225 -.588c.468 0 .914 .214 1.225 .588l4.361 5.248a1.844 1.844 0 0 1 0 2.328l-4.361 5.248z\"\n          />\n          <motion.path\n            className=\"frame-2\"\n            d=\"M17 5l4.586 5.836a1.844 1.844 0 0 1 0 2.328l-4.586 5.836\"\n          />\n          <motion.path\n            className=\"frame-3\"\n            d=\"M13 5l4.586 5.836a1.844 1.844 0 0 1 0 2.328l-4.586 5.836\"\n          />\n        </svg>\n      </motion.div>\n    );\n  },\n);\n\nKeyframesIcon.displayName = \"KeyframesIcon\";\nexport default KeyframesIcon;\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;EAWpC,AAVA,EACE,YACA,EAAE,GAAG;GAAC;GAAG;GAAI;EAAC,EAAE,GAChB;GAAE,UAAU;GAAK,MAAM;EAAY,CACrC,GACA,EACE,YACA,EAAE,GAAG;GAAC;GAAG;GAAG;EAAC,EAAE,GACf;GAAE,UAAU;GAAK,MAAM;GAAa,OAAO;EAAI,CACjD,GACA,EACE,YACA,EAAE,GAAG;GAAC;GAAG;GAAG;EAAC,EAAE,GACf;GAAE,UAAU;GAAK,MAAM;GAAa,OAAO;EAAI,CACjD;CACF,GAAG,CAAC,CAAO,CAAC,GAEN,IAAO,QAAkB;EAC7B,EACE,gCACA,EAAE,GAAG,EAAE,GACP;GAAE,UAAU;GAAK,MAAM;EAAU,CACnC;CACF,GAAG,CAAC,CAAO,CAAC;CAOZ,OALA,EAAoB,UAAY;EAC9B,gBAAgB;EAChB,eAAe;CACjB,EAAE,GAGA,kBAAC,EAAO,KAAR;EACE,KAAK;EACL,WAAW,0DAA0D;EACrE,cAAc;EACd,YAAY;EAEZ,UAAA,kBAAC,OAAD;GACE,OAAM;GACN,OAAO;GACP,QAAQ;GACR,SAAQ;GACR,MAAK;GACL,QAAQ;GACK;GACb,eAAc;GACd,gBAAe;GATjB,UAAA;IAWE,kBAAC,QAAD;KAAM,QAAO;KAAO,GAAE;KAAgB,MAAK;IAAQ,CAAA;IACnD,kBAAC,EAAO,MAAR;KACE,WAAU;KACV,GAAE;IACH,CAAA;IACD,kBAAC,EAAO,MAAR;KACE,WAAU;KACV,GAAE;IACH,CAAA;IACD,kBAAC,EAAO,MAAR;KACE,WAAU;KACV,GAAE;IACH,CAAA;GACE;;CACK,CAAA;AAEhB,CACF;AAEA,EAAc,cAAc"}