{"_id":"lucide-animated","_rev":"6-386feb1ac41bf242ef1036a33fbae0ab","name":"lucide-animated","dist-tags":{"latest":"1.0.5"},"versions":{"1.0.0":{"name":"lucide-animated","version":"1.0.0","keywords":["react","icons","lucide","animated","motion","framer-motion"],"license":"MIT","_id":"lucide-animated@1.0.0","maintainers":[{"name":"marciomrb","email":"marciomrbcampos@gmail.com"}],"dist":{"shasum":"edbbb51631a581f177aff6eb1a9507b4f68b0021","tarball":"https://registry.npmjs.org/lucide-animated/-/lucide-animated-1.0.0.tgz","fileCount":8,"integrity":"sha512-7KP+/B/wGwVizVCKMOHDgYFhiwRFim+eE/TFBZg03ZbcB/kwgoJvGDz+0Ya32+Tt6rpt7S1enLIWC7ela256Eg==","signatures":[{"sig":"MEUCIEBnDzHHhy8PBoSvGfwemWgXBQT7eN8XPdzOUjiQHt7UAiEAoCRx2CTzwoTNrESnHpTcDUYfPuYpIshOPO2n9sC59WM=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":6683842},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"scripts":{"dev":"tsup --watch","build":"tsup"},"_npmUser":{"name":"marciomrb","email":"marciomrbcampos@gmail.com"},"_npmVersion":"10.9.2","description":"Ícones Lucide animados com React e Motion","directories":{},"_nodeVersion":"23.9.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.3.0","motion":"^11.0.0","typescript":"^5.0.0","@types/react":"^18.3.0"},"peerDependencies":{"react":">=18.0.0","motion":">=11.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lucide-animated_1.0.0_1771619778337_0.11318707284742113","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"lucide-animated","version":"1.0.1","keywords":["react","icons","lucide","animated","motion","framer-motion"],"license":"MIT","_id":"lucide-animated@1.0.1","maintainers":[{"name":"marciomrb","email":"marciomrbcampos@gmail.com"}],"dist":{"shasum":"2723f23973dfb659dd52d099d10c7a6df8adf2ee","tarball":"https://registry.npmjs.org/lucide-animated/-/lucide-animated-1.0.1.tgz","fileCount":8,"integrity":"sha512-rtlpMrLiJeeTaJLz6F/4Haa7V0OvMyMKPuuMdol2qL8S6aqoffp2GvG9p+zVQTM9CXvcHScw2ja22D7tAjwwBw==","signatures":[{"sig":"MEQCICNscYlTmVjNydfCQo/H556ppKYYs3wvCr+CPD/GJSEuAiBtyDtSNzYpa9lDt1boDon0NgLtnz//ibWcTzm/sJvgBQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":7865826},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"scripts":{"dev":"tsup --watch","build":"tsup"},"_npmUser":{"name":"marciomrb","email":"marciomrbcampos@gmail.com"},"_npmVersion":"11.1.0","description":"Animated Lucide icons with React and Motion","directories":{},"_nodeVersion":"23.9.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.3.0","motion":"^11.0.0","typescript":"^5.0.0","@types/react":"^18.3.0"},"peerDependencies":{"react":">=18.0.0","motion":">=11.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lucide-animated_1.0.1_1780404608184_0.27399076563319946","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"lucide-animated","version":"1.0.2","keywords":["react","icons","lucide","animated","motion","framer-motion"],"license":"MIT","_id":"lucide-animated@1.0.2","maintainers":[{"name":"marciomrb","email":"marciomrbcampos@gmail.com"}],"dist":{"shasum":"0829ada66801971a34cf397b3c1c322555ecf0a5","tarball":"https://registry.npmjs.org/lucide-animated/-/lucide-animated-1.0.2.tgz","fileCount":8,"integrity":"sha512-rdM+ImVT+lQ97vCcsBbp8DyGdqsJufHVA9h7QDv4pUOAgmiJCqCtyqQeQeOzHfMCq8qlpiI2fW0nXeiR99CvLQ==","signatures":[{"sig":"MEQCIDOPBEes3W0JcgGAvjooQ6xAmBh/Yg64/xez8M5xBsACAiBDaCmzHc6Jlm7CmXY6XalNLd0iYGTQDSfnTezNkTSwcQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":7867330},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"scripts":{"dev":"tsup --watch","test":"vitest run","build":"tsup","test:watch":"vitest"},"_npmUser":{"name":"marciomrb","email":"marciomrbcampos@gmail.com"},"_npmVersion":"11.1.0","description":"Animated Lucide icons with React and Motion","directories":{},"_nodeVersion":"23.9.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","jsdom":"^27.0.1","react":"^18.3.0","motion":"^11.0.0","vitest":"^3.2.6","react-dom":"^18.3.1","typescript":"^5.0.0","@types/react":"^18.3.0","@vitest/coverage-v8":"^3.2.6","@testing-library/dom":"^10.4.1","@testing-library/react":"^16.3.2","@testing-library/jest-dom":"^6.9.1"},"peerDependencies":{"react":">=18.0.0","motion":">=11.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lucide-animated_1.0.2_1780405889187_0.583926548900837","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"lucide-animated","version":"1.0.3","keywords":["react","icons","lucide","animated","motion","framer-motion"],"license":"MIT","_id":"lucide-animated@1.0.3","maintainers":[{"name":"marciomrb","email":"marciomrbcampos@gmail.com"}],"dist":{"shasum":"016fee5bd4afadf9204a89ac758b0af426e38d99","tarball":"https://registry.npmjs.org/lucide-animated/-/lucide-animated-1.0.3.tgz","fileCount":8,"integrity":"sha512-Da17kJ97cylzCURKbnZ6ONY3cjH9HDYChr0QtmJsJ6gjEiQp/3b1rKo6riTNYKTbc63NFH0DjMDEPwTfYp4jwQ==","signatures":[{"sig":"MEQCIGMJP2sVpnIAgv3RNWrM8pU8vBmpb+AWjmMRpVnykSXPAiBcBUCuKZbELBJvD3SErpgK8TC4yY1Hqv0N/U5NJHvjuA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":7867624},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"scripts":{"dev":"tsup --watch","test":"vitest run","build":"tsup","test:watch":"vitest"},"_npmUser":{"name":"marciomrb","email":"marciomrbcampos@gmail.com"},"_npmVersion":"11.1.0","description":"Animated Lucide icons with React and Motion","directories":{},"_nodeVersion":"23.9.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","jsdom":"^27.0.1","react":"^18.3.0","motion":"^11.0.0","vitest":"^3.2.6","react-dom":"^18.3.1","typescript":"^5.0.0","@types/react":"^18.3.0","@vitest/coverage-v8":"^3.2.6","@testing-library/dom":"^10.4.1","@testing-library/react":"^16.3.2","@testing-library/jest-dom":"^6.9.1"},"peerDependencies":{"react":">=18.0.0","motion":">=11.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lucide-animated_1.0.3_1780411610813_0.721513592215751","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"lucide-animated","version":"1.0.4","keywords":["react","icons","lucide","animated","motion","framer-motion"],"license":"MIT","_id":"lucide-animated@1.0.4","maintainers":[{"name":"marciomrb","email":"marciomrbcampos@gmail.com"}],"dist":{"shasum":"0ab5e914fb3718ba4b2585f22d6be8560989d73a","tarball":"https://registry.npmjs.org/lucide-animated/-/lucide-animated-1.0.4.tgz","fileCount":8,"integrity":"sha512-DObjjJI4/zUjNZdeqaSqJboPU5M9M9dB3zfH2IUpNksLIyYgV3x8uLjJn8WpvOZi04Kob19HzSqHay1oFg6UrA==","signatures":[{"sig":"MEYCIQCCkiX3ZLpU3nTv+TMCGRY7Ak/viqP1tvUGHedh7RxiNQIhAJqKDsv14CVLn89hpiyeCz7zXjsEZSAzDo7qOQ0xapAB","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":8036271},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"scripts":{"dev":"tsup --watch","test":"vitest run","build":"tsup","test:watch":"vitest"},"_npmUser":{"name":"marciomrb","email":"marciomrbcampos@gmail.com"},"_npmVersion":"11.1.0","description":"Animated Lucide icons with React and Motion","directories":{},"_nodeVersion":"23.9.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","jsdom":"^27.0.1","react":"^18.3.0","motion":"^11.0.0","vitest":"^3.2.6","react-dom":"^18.3.1","typescript":"^5.0.0","@types/react":"^18.3.0","@vitest/coverage-v8":"^3.2.6","@testing-library/dom":"^10.4.1","@testing-library/react":"^16.3.2","@testing-library/jest-dom":"^6.9.1"},"peerDependencies":{"react":">=18.0.0","motion":">=11.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lucide-animated_1.0.4_1780439335399_0.09005874601822939","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"lucide-animated","version":"1.0.5","description":"Animated Lucide icons with React and Motion","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"scripts":{"build":"tsup","dev":"tsup --watch","test":"vitest run","test:watch":"vitest"},"peerDependencies":{"motion":">=11.0.0","react":">=18.0.0"},"devDependencies":{"@testing-library/dom":"^10.4.1","@testing-library/jest-dom":"^6.9.1","@testing-library/react":"^16.3.2","@types/react":"^18.3.0","@vitest/coverage-v8":"^3.2.6","jsdom":"^27.0.1","motion":"^11.0.0","react":"^18.3.0","react-dom":"^18.3.1","tsup":"^8.0.0","typescript":"^5.0.0","vitest":"^3.2.6"},"keywords":["react","icons","lucide","animated","motion","framer-motion"],"license":"MIT","_id":"lucide-animated@1.0.5","_nodeVersion":"23.9.0","_npmVersion":"11.1.0","dist":{"integrity":"sha512-bNRQvgrZZ/rZTug5YET+qNvJLtVHGamEYQ0vCI/GWveBZTTKQAAIQc0M8U2MUJBYR1+kXtjzFhpZL7oOqnD2CA==","shasum":"d974ed17bd3c67b54d1997fbf60e5ea2637593aa","tarball":"https://registry.npmjs.org/lucide-animated/-/lucide-animated-1.0.5.tgz","fileCount":8,"unpackedSize":8035544,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQD1lRdx+uyvYuX8YiaoXvgJQ+xdybLXr4h4moGvI0cZyAIgM0XPrqmXmtEyEP0bXvQNbkdrh+AKH7GZ9f0wPrDX9S8="}]},"_npmUser":{"name":"marciomrb","email":"marciomrbcampos@gmail.com"},"directories":{},"maintainers":[{"name":"marciomrb","email":"marciomrbcampos@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/lucide-animated_1.0.5_1782582013889_0.024125547027527228"},"_hasShrinkwrap":false}},"time":{"created":"2026-02-20T20:36:18.335Z","modified":"2026-06-27T17:40:14.172Z","1.0.0":"2026-02-20T20:36:18.524Z","1.0.1":"2026-06-02T12:50:08.358Z","1.0.2":"2026-06-02T13:11:29.422Z","1.0.3":"2026-06-02T14:46:51.008Z","1.0.4":"2026-06-02T22:28:55.597Z","1.0.5":"2026-06-27T17:40:14.076Z"},"license":"MIT","keywords":["react","icons","lucide","animated","motion","framer-motion"],"description":"Animated Lucide icons with React and Motion","maintainers":[{"name":"marciomrb","email":"marciomrbcampos@gmail.com"}],"readme":"# lucide-animated\n\n![NPM Version](https://img.shields.io/npm/v/lucide-animated)\n![Tests](https://img.shields.io/badge/tests-885%20passed-success)\n![Coverage](https://img.shields.io/badge/coverage-100%25-success)\n\nReact library with Lucide-style icons and animations (hover/controlled) using [Motion](https://motion.dev/).\n\n**🔗 [Live Demo](https://lucide-animated.vercel.app/)**\n\n## Installation\n\nIn your React project:\n\n```bash\nnpm install lucide-animated react motion\n# or\npnpm add lucide-animated react motion\n# or\nyarn add lucide-animated react motion\n# or\nbun add lucided-animated react motion\n```\n\n**Peer dependencies:** `react` (>=18) and `motion` (>=11).\n\n## Usage\n\n### Import icons\n\n```tsx\nimport { CircleCheckIcon, TrendingUpIcon, ListIcon } from 'lucide-animated'\n```\n\n### Basic usage (hover animation)\n\nBy default, the animation triggers when hovering over the icon:\n\n```tsx\n<CircleCheckIcon className=\"text-blue-500\" size={32} />\n<TrendingUpIcon size={28} />\n```\n\n### Controlled by ref\n\nYou can control the animation programmatically using the ref. When using a ref, the hover will **not** trigger the animation automatically:\n\n```tsx\nimport { useRef } from 'react'\nimport { CircleCheckIcon, type CircleCheckIconHandle } from 'lucide-animated'\n\nfunction MyComponent() {\n  const iconRef = useRef<CircleCheckIconHandle>(null)\n\n  return (\n    <>\n      <CircleCheckIcon ref={iconRef} size={28} />\n      <button onClick={() => iconRef.current?.startAnimation()}>\n        Animate\n      </button>\n      <button onClick={() => iconRef.current?.stopAnimation()}>\n        Stop\n      </button>\n    </>\n  )\n}\n```\n\n### Common props\n\nAll icons accept:\n\n- **`size`** (number): size in pixels (default varies by icon, e.g.: 24 or 28).\n- **`animateOnHover`** (boolean): triggers animation on mouse enter (default: `true`).\n- **`className`**: CSS classes (e.g., Tailwind for color `text-current`, `text-blue-500`).\n- All `HTMLAttributes<HTMLDivElement>` props: `onMouseEnter`, `onMouseLeave`, `style`, etc.\n\nThe stroke color follows `currentColor`, so use `className=\"text-...\"` to set the color.\n\n## License\n\nMIT\n","readmeFilename":"README.md"}