{"_id":"@dominic_n/react-dominic-logo-animation","_rev":"5-fbd3f20fd0231a6f738034fdefcea2ba","name":"@dominic_n/react-dominic-logo-animation","dist-tags":{"latest":"1.0.5"},"versions":{"1.0.0":{"name":"@dominic_n/react-dominic-logo-animation","version":"1.0.0","keywords":["react","animejs","logo","animation"],"author":{"name":"dominic_n"},"license":"ISC","_id":"@dominic_n/react-dominic-logo-animation@1.0.0","maintainers":[{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"}],"dist":{"shasum":"ec214686b97e696b956f5bb55ddd0c5567b1ba51","tarball":"https://registry.npmjs.org/@dominic_n/react-dominic-logo-animation/-/react-dominic-logo-animation-1.0.0.tgz","fileCount":5,"integrity":"sha512-H6SfOX82fdXWYxXbqlQl2YsKSQgkcgfi15lqzLup+vfEO3JylLYzip9Z16PHtvpVVF9HimwQiPYozQBdZPR0bQ==","signatures":[{"sig":"MEQCIHKbZvWYba7Tkh1OC6g22i1BxpL225we4bXKeNp95gg2AiBn9CUdMRGqW1HCuZBnJ9IuiNWv1dXy4A3lfJveK7yisw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":113870},"main":"dist/DominicLogo.js","types":"dist/DominicLogo.d.ts","module":"dist/DominicLogo.esm.js","gitHead":"596c4a7f13adb3880717a7c4312f344aa72613dc","scripts":{"build":"babel src --out-dir dist --extensions \".jsx,.js\" --copy-files --source-maps inline"},"_npmUser":{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"},"_npmVersion":"8.11.0","description":"An animated logo component built with React and Anime.js.","directories":{},"_nodeVersion":"16.16.0","dependencies":{"animejs":"^3.2.2"},"_hasShrinkwrap":false,"devDependencies":{"@babel/cli":"^7.28.3","@babel/core":"^7.28.5","@babel/preset-env":"^7.28.5","@babel/preset-react":"^7.28.5"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/react-dominic-logo-animation_1.0.0_1762269254719_0.6341470882105824","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@dominic_n/react-dominic-logo-animation","version":"1.0.1","keywords":["react","animejs","logo","animation"],"author":{"name":"dominic_n"},"license":"ISC","_id":"@dominic_n/react-dominic-logo-animation@1.0.1","maintainers":[{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"}],"dist":{"shasum":"ee69d76b20885b311c6421165a7ee8910a34d6ec","tarball":"https://registry.npmjs.org/@dominic_n/react-dominic-logo-animation/-/react-dominic-logo-animation-1.0.1.tgz","fileCount":7,"integrity":"sha512-yYuUrUBEhxSOT0i5N29YS19cjNMj7xFjsHJoieng9xR6nsrfeUTVWSuFBKVkNxvkFhJ6g5mwI7ljBefJ02lXMQ==","signatures":[{"sig":"MEUCIQCieKeIaXt0F/D20PIV7H2NOsqonh/PyhsaVqabK19VCwIgdfhabL4e0hzjm6NCbUUAxuBLZxnlOJPtMTcruUUvWv0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":74293},"main":"dist/DominicLogo.js","types":"dist/DominicLogo.d.ts","module":"dist/DominicLogo.esm.js","gitHead":"326af64af75e9a327b2e9b708da28c907d6385e2","scripts":{"build":"npm run build:js && npm run build:ts","build:js":"babel src --out-dir dist --extensions \".jsx,.js\" --copy-files --source-maps inline","build:ts":"tsc"},"_npmUser":{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"},"_npmVersion":"10.9.0","description":"An animated logo component built with React and Anime.js.","directories":{},"_nodeVersion":"22.12.0","dependencies":{"animejs":"^3.2.2"},"_hasShrinkwrap":false,"devDependencies":{"@babel/cli":"^7.28.3","typescript":"^5.9.3","@babel/core":"^7.28.5","@types/node":"^24.10.0","@types/react":"^19.2.2","@types/animejs":"^3.1.13","@types/react-dom":"^19.2.2","@babel/preset-env":"^7.28.5","@babel/preset-react":"^7.28.5"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/react-dominic-logo-animation_1.0.1_1762297312439_0.5130272446223523","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@dominic_n/react-dominic-logo-animation","version":"1.0.2","keywords":["react","animejs","logo","animation"],"author":{"name":"dominic_n"},"license":"ISC","_id":"@dominic_n/react-dominic-logo-animation@1.0.2","maintainers":[{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"}],"dist":{"shasum":"197e9f6119b66d5396115f33662db87ab84b3f3e","tarball":"https://registry.npmjs.org/@dominic_n/react-dominic-logo-animation/-/react-dominic-logo-animation-1.0.2.tgz","fileCount":7,"integrity":"sha512-5ehkw3FAM2+Vaf9mKuIJIYLVa//YPwiUp4b6lWsTncIRbrGOIq3NfFT1plXp/EaIwaAscX4vTmc+YvGfTCWgBg==","signatures":[{"sig":"MEYCIQCPnoeoTFYHke9nzAgyaF5jXHxYhhLzhHR7xp8lTsmo+QIhAMBZk3noMwkacjdTDZ3ibOuM+5lQI/Y3SZq+A45mqACd","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":62522},"main":"dist/DominicLogo.js","types":"dist/DominicLogo.d.ts","module":"dist/DominicLogo.js","gitHead":"4d2776413e3620730af6c0cbae03e041474a1fd7","scripts":{"build":"npm run clean && npm run build:js && npm run build:ts","clean":"rm -rf dist","build:js":"babel src --out-dir dist --extensions \".tsx\" --copy-files --source-maps inline --config-file ./babel.esm.config.json","build:ts":"tsc","build:img":"cp src/dominic-logo.css dist/dominic-logo.css"},"_npmUser":{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"},"_npmVersion":"10.9.0","description":"An animated logo component built with React and Anime.js.","directories":{},"_nodeVersion":"22.12.0","dependencies":{"animejs":"^3.2.2"},"_hasShrinkwrap":false,"devDependencies":{"@babel/cli":"^7.28.3","typescript":"^5.9.3","@babel/core":"^7.28.5","@types/node":"^24.10.0","@types/react":"^19.2.2","@types/animejs":"^3.1.13","@types/react-dom":"^19.2.2","@babel/preset-env":"^7.28.5","@babel/preset-react":"^7.28.5","@babel/preset-typescript":"^7.28.5"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/react-dominic-logo-animation_1.0.2_1762301778258_0.10355549233490069","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@dominic_n/react-dominic-logo-animation","version":"1.0.4","keywords":["react","animejs","logo","animation"],"author":{"name":"dominic_n"},"license":"ISC","_id":"@dominic_n/react-dominic-logo-animation@1.0.4","maintainers":[{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"}],"dist":{"shasum":"f9ccbc923c25ccf457870faf50749e80fae12ff9","tarball":"https://registry.npmjs.org/@dominic_n/react-dominic-logo-animation/-/react-dominic-logo-animation-1.0.4.tgz","fileCount":7,"integrity":"sha512-U7L3rCJ8GrQYyBAsFCkwK/faBKcWWgXPfcemi2Fqxr8H6jzt7K3AArD8N5P8zjt6QcZplGTNGC/6MdC9rheTBQ==","signatures":[{"sig":"MEUCIQDMuLbGN/f0lkquVpBiOo/nitDrmWfXjgA65plxflOiAQIgMowC7Asqzll9F1ct+/ql0afQ3blTdKU/pQuGako/DCU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":62532},"main":"dist/DominicLogo.js","types":"dist/DominicLogo.d.ts","module":"dist/DominicLogo.js","gitHead":"1f3c8077129dd6c3476a8bbdf28d1bd324593aa2","scripts":{"build":"npm run clean && npm run build:js && npm run build:ts","clean":"rm -rf dist","build:js":"babel src --out-dir dist --extensions \".tsx\" --copy-files --source-maps inline --config-file ./babel.esm.config.json","build:ts":"tsc","build:img":"cp src/dominic-logo.css dist/dominic-logo.css"},"_npmUser":{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"},"_npmVersion":"8.11.0","description":"An animated logo component built with React and Anime.js.","directories":{},"_nodeVersion":"16.16.0","dependencies":{"animejs":"^3.2.2"},"_hasShrinkwrap":false,"devDependencies":{"@babel/cli":"^7.28.3","typescript":"^5.9.3","@babel/core":"^7.28.5","@types/node":"^24.10.0","@types/react":"^19.2.2","@types/animejs":"^3.1.13","@types/react-dom":"^19.2.2","@babel/preset-env":"^7.28.5","@babel/preset-react":"^7.28.5","@babel/preset-typescript":"^7.28.5"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/react-dominic-logo-animation_1.0.4_1764396962473_0.007575202946835002","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"@dominic_n/react-dominic-logo-animation","version":"1.0.5","description":"An animated logo component built with React and Anime.js.","main":"dist/DominicLogo.js","module":"dist/DominicLogo.js","types":"dist/DominicLogo.d.ts","scripts":{"clean":"rm -rf dist","build:js":"babel src --out-dir dist --extensions \".tsx\" --copy-files --source-maps inline --config-file ./babel.esm.config.json","build:img":"cp src/dominic-logo.css dist/dominic-logo.css","build:ts":"tsc","build":"npm run clean && npm run build:js && npm run build:ts"},"keywords":["react","animejs","logo","animation"],"author":{"name":"dominic_n"},"license":"ISC","peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"dependencies":{"animejs":"^3.2.2"},"devDependencies":{"@babel/cli":"^7.28.3","@babel/core":"^7.28.5","@babel/preset-env":"^7.28.5","@babel/preset-react":"^7.28.5","@babel/preset-typescript":"^7.28.5","@types/animejs":"^3.1.13","@types/node":"^24.10.0","@types/react":"^19.2.2","@types/react-dom":"^19.2.2","typescript":"^5.9.3"},"gitHead":"35b8d9c197d3c9b36e7face168712bcda1043b09","_id":"@dominic_n/react-dominic-logo-animation@1.0.5","_nodeVersion":"16.16.0","_npmVersion":"8.11.0","dist":{"integrity":"sha512-PHXwgsNPuvWxDdp+gjsN8RZ0Rhg9pPqZojpSD7BquQhI/XUUfGcukd4S0xvv/auume02RLIbSXB7VLhfHX+p8g==","shasum":"08574c31968a06577df7b5a4fa0012259cf9e675","tarball":"https://registry.npmjs.org/@dominic_n/react-dominic-logo-animation/-/react-dominic-logo-animation-1.0.5.tgz","fileCount":7,"unpackedSize":62532,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIECuOOMcgB590EdGYbjXpOoxQOKoD6N6n9aXB78qag+wAiEAy+F5dPacrCB7JN3uvPLq+pMUvrlRlnR5tVxx+kVbqAU="}]},"_npmUser":{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"},"directories":{},"maintainers":[{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-dominic-logo-animation_1.0.5_1764397032961_0.9859408761896138"},"_hasShrinkwrap":false}},"time":{"created":"2025-11-04T15:14:14.641Z","modified":"2025-11-29T06:17:13.353Z","1.0.0":"2025-11-04T15:14:14.929Z","1.0.1":"2025-11-04T23:01:52.655Z","1.0.2":"2025-11-05T00:16:18.454Z","1.0.4":"2025-11-29T06:16:02.698Z","1.0.5":"2025-11-29T06:17:13.151Z"},"author":{"name":"dominic_n"},"license":"ISC","keywords":["react","animejs","logo","animation"],"description":"An animated logo component built with React and Anime.js.","maintainers":[{"name":"dominic_n","email":"dominicnjoroge@tutamail.com"}],"readme":"# @dominic_n/react-dominic-logo-animation\n\n![Dominic Logo Animation](img/logo.png)\n\n## ✨ Animated Dominic Logo Component\n\n\nReact component wrapping the complex Dominic logo animation built with **Anime.js**. It is fully responsive and safe for multiple instances on the same page.\n\n### 📦 Installation\n\nTo use this component in your existing React project:\n\n```\n# Install the component from NPM\nnpm install @dominic_n/react-dominic-logo-animation\n\n# Install the peer dependency, Anime.js\nnpm install animejs\n```\n \n\n### 💻 Usage\n\nThe component is exported as `DominicLogo`.\n```Tsx\n\n \nimport DominicLogo from '@dominic_n/react-dominic-logo-animation'\n\nfunction App() {\n return (\n // The logo will scale to the width of this container.\n
\n \n
\n );\n}\n```\n\n \n\n### ⚙️ Props\n\n| Prop Name | Type | Default Value | Description |\n| :--- | :--- | :--- | :--- |\n| `color` | `string` | `#607b96` (or `--primary-color`) | Sets the stroke color of the letters (D, O, M, I, N, I, C). Accepts hex, RGB, or color names. |\n| `dotColor` | `string` | `rgb(54, 196, 191)` (or `--secondary-color`) | Sets the fill color of the bouncing dots. |\n\n***Note on Styling:*** If `color` and `dotColor` are not provided via props, the component will attempt to use the CSS variables `--primary-color` and `--secondary-color` from your global stylesheets before falling back to the hardcoded defaults.\n\n### 🎨 Styling & Responsiveness\n\nThis component's full functionality and appearance depend on the included dominic-logo.css file.\n```\n CSS Dependency: Ensure your build process is correctly loading the CSS file (this is handled automatically by the import inside the component in most modern React setups).\n\n Responsiveness: The component contains built-in logic (fitElementToParent) to automatically calculate its scale ratio and adjust its height to fit the current width of its immediate parent container.\n```\n\n### 🛠 Local Development & Building\n\nFor contributors or users who want to modify the source code:\n```Bash\n\n## Local Setup (Assuming you have a test environment set up)\nnpm install\nnpm run dev\n\n## Build (Compiles JSX into the distributable 'dist' folder)\nnpm run build\n```\n","readmeFilename":"README.md"}