aliveicon 1.6.0 → 1.7.0

package/README.md

@@ -6,11 +6,11 @@
   <a href="https://www.npmjs.com/package/aliveicon"><img src="https://img.shields.io/npm/v/aliveicon.svg?color=blue" alt="npm version" /></a>
   <a href="https://www.npmjs.com/package/aliveicon"><img src="https://img.shields.io/npm/dm/aliveicon.svg?color=blue" alt="npm downloads" /></a>
   <a href="https://github.com/Hemang-patel-9/aliveicon/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/aliveicon.svg?color=green" alt="license" /></a>
-  <img src="https://img.shields.io/badge/icons-1210-orange" alt="icon count" />
+  <img src="https://img.shields.io/badge/icons-1324-orange" alt="icon count" />
   <img src="https://img.shields.io/badge/types-included-blue" alt="typescript" />
 </p>
 
-`aliveicon` is a set of **1210 animated SVG icons** for React. Each icon is a component that animates its strokes with [Framer Motion](https://motion.dev). Drop one in and it comes alive on hover, on click, or as soon as it mounts.
+`aliveicon` is a set of **1324 animated SVG icons** for React. Each icon is a component that animates its strokes with [Framer Motion](https://motion.dev). Drop one in and it comes alive on hover, on click, or as soon as it mounts.
 
 ---
 
@@ -148,7 +148,7 @@ The SVG inside each icon has `aria-hidden="true"`, so screen readers skip decora
 
 ## 📚 Available icons
 
-`aliveicon` ships **1210 icons**, and more are being added. Import any icon by its PascalCase name:
+`aliveicon` ships **1324 icons**, and more are being added. Import any icon by its PascalCase name:
 
 ```tsx
 import { CircleCheck, ChartLine, Wifi } from 'aliveicon';
@@ -168,6 +168,7 @@ import { CircleCheck, ChartLine, Wifi } from 'aliveicon';
 | **K** | 9 | `Kanban`, `Kayak`, `Key`, `KeyRound`, `Keyboard`, `KeyboardMusic` |
 | **N** | 19 | `Navigation`, `Network`, `Newspaper`, `Notebook`, `NotebookDot`, `Nut` |
 | **O** | 10 | `Octagon`, `Omega`, `Option`, `Orbit`, `Origami` |
+| **P** | 114 | `Package`, `Paintbrush`, `Palette`, `PanelLeft`, `Paperclip`, `Pause`, `PawPrint`, `Pen`, `Phone`, `Plane`, `Play`, `Plus`, `Power`, `Printer`, `Puzzle` |
 | **Q** | 2 | `Quote`, `QrCode` |
 | **R** | 76 | `Rabbit`, `Radar`, `Radio`, `Receipt`, `RefreshCw`, `Rocket`, `RotateCcw` |
 | **S** | 1 | `SquareActivity` |

package/dist/cjs/icons/p/Package.js

@@ -0,0 +1,28 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const Package = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsx(framerMotion.motion.path, { d: "M11 21.73a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73z", variants: drawVariants, custom: [0, 0, 0.6], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M12 22V12", variants: drawVariants, custom: [0.3, 0, 0.3], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.polyline, { points: "3.29 7 12 12 20.71 7", variants: drawVariants, custom: [0.25, 0, 0.4], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.path, { d: "m7.5 4.27 9 5.15", variants: drawVariants, custom: [0.4, 0, 0.3], initial: "normal", animate: controls })] }) }));
+});
+Package.displayName = 'Package';
+
+exports.Package = Package;
+//# sourceMappingURL=Package.js.map

package/dist/cjs/icons/p/Package.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Package.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/Package2.js

@@ -0,0 +1,28 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const Package2 = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsx(framerMotion.motion.path, { d: "M12 3v6", variants: drawVariants, custom: [0.45, 0, 0.25], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M16.76 3a2 2 0 0 1 1.8 1.1l2.23 4.479a2 2 0 0 1 .21.891V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V9.472a2 2 0 0 1 .211-.894L5.45 4.1A2 2 0 0 1 7.24 3z", variants: drawVariants, custom: [0, 0, 0.6], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M3.054 9.013h17.893", variants: drawVariants, custom: [0.3, 0, 0.3], initial: "normal", animate: controls })] }) }));
+});
+Package2.displayName = 'Package2';
+
+exports.Package2 = Package2;
+//# sourceMappingURL=Package2.js.map

package/dist/cjs/icons/p/Package2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Package2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PackageCheck.js

@@ -0,0 +1,35 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const stampVariants = {
+    normal: { scale: 1, transition: { duration: 0.2 } },
+    animate: {
+        scale: [1, 0.94, 1],
+        transition: { duration: 0.4, ease: 'easeInOut' },
+    },
+};
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const PackageCheck = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsxs(framerMotion.motion.g, { variants: stampVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M12 22V12" }), jsxRuntime.jsx("path", { d: "M21 11.127V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.729l7 4a2 2 0 0 0 2 .001l1.32-.753" }), jsxRuntime.jsx("path", { d: "M3.29 7 12 12l8.71-5" }), jsxRuntime.jsx("path", { d: "m7.5 4.27 8.997 5.148" })] }), jsxRuntime.jsx(framerMotion.motion.path, { d: "m16 17 2 2 4-4", variants: drawVariants, custom: [0.15, 0, 0.4], initial: "normal", animate: controls })] }) }));
+});
+PackageCheck.displayName = 'PackageCheck';
+
+exports.PackageCheck = PackageCheck;
+//# sourceMappingURL=PackageCheck.js.map

package/dist/cjs/icons/p/PackageCheck.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PackageCheck.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PackageMinus.js

@@ -0,0 +1,35 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const stampVariants = {
+    normal: { scale: 1, transition: { duration: 0.2 } },
+    animate: {
+        scale: [1, 0.94, 1],
+        transition: { duration: 0.4, ease: 'easeInOut' },
+    },
+};
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const PackageMinus = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsxs(framerMotion.motion.g, { variants: stampVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M12 22V12" }), jsxRuntime.jsx("path", { d: "M21 13V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.729l7 4a2 2 0 0 0 2 .001l1.675-.955" }), jsxRuntime.jsx("path", { d: "M3.29 7 12 12l8.71-5" }), jsxRuntime.jsx("path", { d: "m7.5 4.27 8.997 5.148" })] }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M16 17h6", variants: drawVariants, custom: [0.15, 0, 0.3], initial: "normal", animate: controls })] }) }));
+});
+PackageMinus.displayName = 'PackageMinus';
+
+exports.PackageMinus = PackageMinus;
+//# sourceMappingURL=PackageMinus.js.map

package/dist/cjs/icons/p/PackageMinus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PackageMinus.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PackageOpen.js

@@ -0,0 +1,35 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const flapVariants = {
+    normal: { y: 0, transition: { duration: 0.2 } },
+    animate: {
+        y: [0, -1.5, 0],
+        transition: { duration: 0.5, ease: 'easeInOut' },
+    },
+};
+const PackageOpen = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", style: { overflow: 'visible' }, children: [jsxRuntime.jsx(framerMotion.motion.path, { d: "M12 22v-9", variants: drawVariants, custom: [0.2, 0, 0.3], initial: "normal", animate: controls }), jsxRuntime.jsxs(framerMotion.motion.g, { variants: flapVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M15.17 2.21a1.67 1.67 0 0 1 1.63 0L21 4.57a1.93 1.93 0 0 1 0 3.36L8.82 14.79a1.655 1.655 0 0 1-1.64 0L3 12.43a1.93 1.93 0 0 1 0-3.36z" }), jsxRuntime.jsx("path", { d: "M21 12.43a1.93 1.93 0 0 0 0-3.36L8.83 2.2a1.64 1.64 0 0 0-1.63 0L3 4.57a1.93 1.93 0 0 0 0 3.36l12.18 6.86a1.636 1.636 0 0 0 1.63 0z" })] }), jsxRuntime.jsx("path", { d: "M20 13v3.87a2.06 2.06 0 0 1-1.11 1.83l-6 3.08a1.93 1.93 0 0 1-1.78 0l-6-3.08A2.06 2.06 0 0 1 4 16.87V13" })] }) }));
+});
+PackageOpen.displayName = 'PackageOpen';
+
+exports.PackageOpen = PackageOpen;
+//# sourceMappingURL=PackageOpen.js.map

package/dist/cjs/icons/p/PackageOpen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PackageOpen.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PackagePlus.js

@@ -0,0 +1,35 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const stampVariants = {
+    normal: { scale: 1, transition: { duration: 0.2 } },
+    animate: {
+        scale: [1, 0.94, 1],
+        transition: { duration: 0.4, ease: 'easeInOut' },
+    },
+};
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const PackagePlus = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsxs(framerMotion.motion.g, { variants: stampVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M12 22V12" }), jsxRuntime.jsx("path", { d: "M21 10.535V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.729l7 4a2 2 0 0 0 2 .001l1.675-.955" }), jsxRuntime.jsx("path", { d: "M3.29 7 12 12l8.71-5" }), jsxRuntime.jsx("path", { d: "m7.5 4.27 8.997 5.148" })] }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M16 17h6", variants: drawVariants, custom: [0.15, 0, 0.3], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M19 14v6", variants: drawVariants, custom: [0.25, 0, 0.3], initial: "normal", animate: controls })] }) }));
+});
+PackagePlus.displayName = 'PackagePlus';
+
+exports.PackagePlus = PackagePlus;
+//# sourceMappingURL=PackagePlus.js.map

package/dist/cjs/icons/p/PackagePlus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PackagePlus.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PackageSearch.js

@@ -0,0 +1,33 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const stampVariants = {
+    normal: { scale: 1, transition: { duration: 0.2 } },
+    animate: {
+        scale: [1, 0.94, 1],
+        transition: { duration: 0.4, ease: 'easeInOut' },
+    },
+};
+const scanVariants = {
+    normal: { x: 0, transition: { duration: 0.2 } },
+    animate: {
+        x: [0, -1.2, 0.6, 0],
+        transition: { duration: 0.7, ease: 'easeInOut' },
+    },
+};
+const PackageSearch = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsxs(framerMotion.motion.g, { variants: stampVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M12 22V12" }), jsxRuntime.jsx("path", { d: "M21 10.498V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.729l7 4a2 2 0 0 0 2 .001l.98-.559" }), jsxRuntime.jsx("path", { d: "M3.29 7 12 12l8.71-5" }), jsxRuntime.jsx("path", { d: "m7.5 4.27 8.997 5.148" })] }), jsxRuntime.jsxs(framerMotion.motion.g, { variants: scanVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M20.27 18.27 22 20" }), jsxRuntime.jsx("circle", { cx: "18.5", cy: "16.5", r: "2.5" })] })] }) }));
+});
+PackageSearch.displayName = 'PackageSearch';
+
+exports.PackageSearch = PackageSearch;
+//# sourceMappingURL=PackageSearch.js.map

package/dist/cjs/icons/p/PackageSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PackageSearch.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PackageX.js

@@ -0,0 +1,35 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const stampVariants = {
+    normal: { scale: 1, transition: { duration: 0.2 } },
+    animate: {
+        scale: [1, 0.94, 1],
+        transition: { duration: 0.4, ease: 'easeInOut' },
+    },
+};
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const PackageX = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsxs(framerMotion.motion.g, { variants: stampVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M12 22V12" }), jsxRuntime.jsx("path", { d: "M21 10.5V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.729l7 4a2 2 0 0 0 2 .001l.13-.074" }), jsxRuntime.jsx("path", { d: "M3.29 7 12 12l8.71-5" }), jsxRuntime.jsx("path", { d: "m7.5 4.27 8.997 5.148" })] }), jsxRuntime.jsx(framerMotion.motion.path, { d: "m16.5 14.5 5 5", variants: drawVariants, custom: [0.15, 0, 0.3], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.path, { d: "m16.5 19.5 5-5", variants: drawVariants, custom: [0.25, 0, 0.3], initial: "normal", animate: controls })] }) }));
+});
+PackageX.displayName = 'PackageX';
+
+exports.PackageX = PackageX;
+//# sourceMappingURL=PackageX.js.map

package/dist/cjs/icons/p/PackageX.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PackageX.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PaintBucket.js

@@ -0,0 +1,34 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const tipVariants = {
+    normal: { rotate: 0, transition: { duration: 0.2 } },
+    animate: {
+        rotate: [0, 6, -2, 0],
+        transition: { duration: 0.6, ease: 'easeInOut' },
+    },
+};
+const dropVariants = {
+    normal: { y: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: (delay) => ({
+        y: [-3, 0],
+        opacity: [0, 1],
+        transition: { duration: 0.4, delay, ease: 'easeInOut' },
+    }),
+};
+const PaintBucket = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsxs(framerMotion.motion.g, { variants: tipVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M11 7 6 2" }), jsxRuntime.jsx("path", { d: "M18.992 12H2.041" }), jsxRuntime.jsx("path", { d: "m8.5 4.5 2.148-2.148a1.205 1.205 0 0 1 1.704 0l7.296 7.296a1.205 1.205 0 0 1 0 1.704l-7.592 7.592a3.615 3.615 0 0 1-5.112 0l-3.888-3.888a3.615 3.615 0 0 1 0-5.112L5.67 7.33" })] }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M21.145 18.38A3.34 3.34 0 0 1 20 16.5a3.3 3.3 0 0 1-1.145 1.88c-.575.46-.855 1.02-.855 1.595A2 2 0 0 0 20 22a2 2 0 0 0 2-2.025c0-.58-.285-1.13-.855-1.595", variants: dropVariants, custom: 0.3, initial: "normal", animate: controls })] }) }));
+});
+PaintBucket.displayName = 'PaintBucket';
+
+exports.PaintBucket = PaintBucket;
+//# sourceMappingURL=PaintBucket.js.map

package/dist/cjs/icons/p/PaintBucket.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaintBucket.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PaintRoller.js

@@ -0,0 +1,26 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const rollVariants = {
+    normal: { x: 0, transition: { duration: 0.2 } },
+    animate: {
+        x: [0, -1, 1, 0],
+        transition: { duration: 0.7, ease: 'easeInOut' },
+    },
+};
+const PaintRoller = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsx("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", style: { overflow: 'visible' }, children: jsxRuntime.jsxs(framerMotion.motion.g, { variants: rollVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("rect", { width: "16", height: "6", x: "2", y: "2", rx: "2" }), jsxRuntime.jsx("path", { d: "M10 16v-2a2 2 0 0 1 2-2h8a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2" }), jsxRuntime.jsx("rect", { width: "4", height: "6", x: "8", y: "16", rx: "1" })] }) }) }));
+});
+PaintRoller.displayName = 'PaintRoller';
+
+exports.PaintRoller = PaintRoller;
+//# sourceMappingURL=PaintRoller.js.map

package/dist/cjs/icons/p/PaintRoller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaintRoller.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/Paintbrush.js

@@ -0,0 +1,26 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const strokeVariants = {
+    normal: { rotate: 0, transition: { duration: 0.2 } },
+    animate: {
+        rotate: [0, -6, 5, -2, 0],
+        transition: { duration: 0.7, ease: 'easeInOut' },
+    },
+};
+const Paintbrush = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsx("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", style: { overflow: 'visible' }, children: jsxRuntime.jsxs(framerMotion.motion.g, { variants: strokeVariants, style: { originX: '90%', originY: '10%' }, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "m14.622 17.897-10.68-2.913" }), jsxRuntime.jsx("path", { d: "M18.376 2.622a1 1 0 1 1 3.002 3.002L17.36 9.643a.5.5 0 0 0 0 .707l.944.944a2.41 2.41 0 0 1 0 3.408l-.944.944a.5.5 0 0 1-.707 0L8.354 7.348a.5.5 0 0 1 0-.707l.944-.944a2.41 2.41 0 0 1 3.408 0l.944.944a.5.5 0 0 0 .707 0z" }), jsxRuntime.jsx("path", { d: "M9 8c-1.804 2.71-3.97 3.46-6.583 3.948a.507.507 0 0 0-.302.819l7.32 8.883a1 1 0 0 0 1.185.204C12.735 20.405 16 16.792 16 15" })] }) }) }));
+});
+Paintbrush.displayName = 'Paintbrush';
+
+exports.Paintbrush = Paintbrush;
+//# sourceMappingURL=Paintbrush.js.map

package/dist/cjs/icons/p/Paintbrush.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paintbrush.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PaintbrushVertical.js

@@ -0,0 +1,26 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const paintVariants = {
+    normal: { x: 0, transition: { duration: 0.2 } },
+    animate: {
+        x: [0, -1, 1, -0.5, 0],
+        transition: { duration: 0.6, ease: 'easeInOut' },
+    },
+};
+const PaintbrushVertical = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsx("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: jsxRuntime.jsxs(framerMotion.motion.g, { variants: paintVariants, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M10 2v2" }), jsxRuntime.jsx("path", { d: "M14 2v4" }), jsxRuntime.jsx("path", { d: "M17 2a1 1 0 0 1 1 1v9H6V3a1 1 0 0 1 1-1z" }), jsxRuntime.jsx("path", { d: "M6 12a1 1 0 0 0-1 1v1a2 2 0 0 0 2 2h2a1 1 0 0 1 1 1v2.9a2 2 0 1 0 4 0V17a1 1 0 0 1 1-1h2a2 2 0 0 0 2-2v-1a1 1 0 0 0-1-1" })] }) }) }));
+});
+PaintbrushVertical.displayName = 'PaintbrushVertical';
+
+exports.PaintbrushVertical = PaintbrushVertical;
+//# sourceMappingURL=PaintbrushVertical.js.map

package/dist/cjs/icons/p/PaintbrushVertical.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaintbrushVertical.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/Palette.js

@@ -0,0 +1,36 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const drawVariants = {
+    normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: ([delay, from, duration]) => ({
+        pathLength: [0, 1],
+        pathOffset: [from, 0],
+        opacity: [0, 1],
+        transition: { duration, delay, ease: 'easeInOut' },
+    }),
+};
+const popVariants = {
+    normal: { scale: 1, opacity: 1, transition: { duration: 0.2 } },
+    animate: (delay) => ({
+        scale: [0, 1.4, 1],
+        opacity: [0, 1, 1],
+        transition: { duration: 0.4, delay, ease: 'easeInOut' },
+    }),
+};
+const Palette = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsx(framerMotion.motion.path, { d: "M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z", variants: drawVariants, custom: [0, 0, 0.5], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.circle, { cx: "13.5", cy: "6.5", r: ".5", fill: "currentColor", variants: popVariants, custom: 0.41, initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.circle, { cx: "17.5", cy: "10.5", r: ".5", fill: "currentColor", variants: popVariants, custom: 0.49, initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.circle, { cx: "6.5", cy: "12.5", r: ".5", fill: "currentColor", variants: popVariants, custom: 0.25, initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.circle, { cx: "8.5", cy: "7.5", r: ".5", fill: "currentColor", variants: popVariants, custom: 0.33, initial: "normal", animate: controls })] }) }));
+});
+Palette.displayName = 'Palette';
+
+exports.Palette = Palette;
+//# sourceMappingURL=Palette.js.map

package/dist/cjs/icons/p/Palette.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Palette.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/Panda.js

@@ -0,0 +1,26 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const tiltVariants = {
+    normal: { rotate: 0, transition: { duration: 0.2 } },
+    animate: {
+        rotate: [0, -6, 5, -2, 0],
+        transition: { duration: 0.8, ease: 'easeInOut' },
+    },
+};
+const Panda = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsx("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", style: { overflow: 'visible' }, children: jsxRuntime.jsxs(framerMotion.motion.g, { variants: tiltVariants, style: { originX: '50%', originY: '100%' }, initial: "normal", animate: controls, children: [jsxRuntime.jsx("path", { d: "M11.25 17.25h1.5L12 18z" }), jsxRuntime.jsx("path", { d: "m15 12 2 2" }), jsxRuntime.jsx("path", { d: "M17.902 6.599a8 8 0 0 0-.5-.5" }), jsxRuntime.jsx("path", { d: "M2 14.5C2 19.47 6.48 22 12 22s10-2.53 10-7.5a10 10 0 0 0-1.3-4.83 4.5 4.5 0 1 0-7.05-5.5 8 8 0 0 0-3.3 0 4.5 4.5 0 1 0-7.04 5.5A10 10 0 0 0 2 14.5" }), jsxRuntime.jsx("path", { d: "M6.099 6.599a8 8 0 0 1 .5-.5" }), jsxRuntime.jsx("path", { d: "m9 12-2 2" })] }) }) }));
+});
+Panda.displayName = 'Panda';
+
+exports.Panda = Panda;
+//# sourceMappingURL=Panda.js.map

package/dist/cjs/icons/p/Panda.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Panda.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PanelBottom.js

@@ -0,0 +1,27 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const slideVariants = {
+    normal: { y: 0, opacity: 1, transition: { duration: 0.2 } },
+    animate: {
+        y: [4, 0],
+        opacity: [0, 1],
+        transition: { duration: 0.45, ease: 'easeOut' },
+    },
+};
+const PanelBottom = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsx("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M3 15h18", variants: slideVariants, initial: "normal", animate: controls })] }) }));
+});
+PanelBottom.displayName = 'PanelBottom';
+
+exports.PanelBottom = PanelBottom;
+//# sourceMappingURL=PanelBottom.js.map

package/dist/cjs/icons/p/PanelBottom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelBottom.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/icons/p/PanelBottomClose.js

@@ -0,0 +1,26 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var framerMotion = require('framer-motion');
+var react = require('react');
+var cn = require('../../lib/cn.js');
+var useAnimatedIcon = require('../../lib/use-animated-icon.js');
+
+const nudgeVariants = {
+    normal: { y: 0, transition: { duration: 0.2 } },
+    animate: {
+        y: [0, 1.5, 0],
+        transition: { duration: 0.5, ease: 'easeInOut' },
+    },
+};
+const PanelBottomClose = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
+    const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
+    return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsx("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }), jsxRuntime.jsx("path", { d: "M3 15h18" }), jsxRuntime.jsx(framerMotion.motion.path, { d: "m15 8-3 3-3-3", variants: nudgeVariants, initial: "normal", animate: controls })] }) }));
+});
+PanelBottomClose.displayName = 'PanelBottomClose';
+
+exports.PanelBottomClose = PanelBottomClose;
+//# sourceMappingURL=PanelBottomClose.js.map

package/dist/cjs/icons/p/PanelBottomClose.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelBottomClose.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}