{"_id":"@a24z/logo-component","_rev":"3-9804b26fde4ba529ad32211f109883ec","name":"@a24z/logo-component","dist-tags":{"latest":"0.1.2"},"versions":{"0.1.0":{"name":"@a24z/logo-component","version":"0.1.0","keywords":["react","logo","component","svg","animated"],"_id":"@a24z/logo-component@0.1.0","maintainers":[{"name":"fernando-ram-lugo","email":"principle@principlemd.com"}],"dist":{"shasum":"50bfe4611b3655f064c2992de236f7fb0b2bed59","tarball":"https://registry.npmjs.org/@a24z/logo-component/-/logo-component-0.1.0.tgz","fileCount":10,"integrity":"sha512-TdIeObSFy47skHy6ia45otP1BYlEW4lGkOBDkvwbVQct9gSMqzFutdTk3yuH7k4AY4la9CGCshlVSNYRLbKnlg==","signatures":[{"sig":"MEQCIEAZobPb6h3EHr/FC1BBCEhIJG7AVq94bs+lp9H8+a0yAiBGVTfHQUlARKwysnjts+PtYJPkh/ZOkO08DZk4AhhOTg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":18513},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"c83bbbc2745001d15305f7bf2bade3d1b2ea4b95","scripts":{"build":"tsc && tsc --module esnext --outDir dist/esm","prepublishOnly":"npm run build"},"_npmUser":{"name":"fernando-ram-lugo","email":"principle@principlemd.com"},"_npmVersion":"10.9.2","description":"Animated wireframe sphere logo component","directories":{},"_nodeVersion":"23.11.0","_hasShrinkwrap":false,"devDependencies":{"react":"^19.1.1","typescript":"^5","@types/react":"^19.1.12"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/logo-component_0.1.0_1759346733548_0.1311430740675541","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@a24z/logo-component","version":"0.1.1","keywords":["react","logo","component","svg","animated"],"_id":"@a24z/logo-component@0.1.1","maintainers":[{"name":"fernando-ram-lugo","email":"principle@principlemd.com"}],"dist":{"shasum":"1a1a09abde97ee7da7d5449dc87f44f6ef3d0184","tarball":"https://registry.npmjs.org/@a24z/logo-component/-/logo-component-0.1.1.tgz","fileCount":11,"integrity":"sha512-zKRkfvpVUprJoKPbu7RAzGAg72RrMgho6d9gnltBKboZ8sLaBrZobE+OpaY9QTsyCec3GMcW336UTTpW3WuERg==","signatures":[{"sig":"MEYCIQCJZbfhR8BtdSGUPyvQJHhjEKIEnFc0ET/U6HIizIPVMAIhAJOgLvsMfvbf8xP60Zl49B9eyHqRSAYEfn8TFcnRcIxv","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":28466},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"95d415fbb4bf7fdff8fb5062a32d8f902bd4929b","scripts":{"build":"tsc && tsc --module esnext --outDir dist/esm","storybook":"storybook dev -p 6006","prepublishOnly":"npm run build","build-storybook":"storybook build"},"_npmUser":{"name":"fernando-ram-lugo","email":"principle@principlemd.com"},"_npmVersion":"10.9.2","description":"Animated wireframe sphere logo component","directories":{},"_nodeVersion":"23.11.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.20","react":"^19.1.1","storybook":"^8.6.14","typescript":"^5","@types/react":"^19.1.12","@storybook/react":"^8.6.14","@storybook/blocks":"^8.6.14","@vitejs/plugin-react":"^4.7.0","@storybook/react-vite":"^8.6.14","@storybook/addon-essentials":"^8.6.14"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/logo-component_0.1.1_1759351035321_0.4493430977588897","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@a24z/logo-component","version":"0.1.2","description":"Animated wireframe sphere logo component","main":"dist/index.js","module":"dist/index.esm.js","types":"dist/index.d.ts","scripts":{"build":"tsc && tsc --module esnext --outDir dist/esm","prepublishOnly":"npm run build","storybook":"storybook dev -p 6006","build-storybook":"storybook build","export-icon":"node scripts/export-icon.js"},"keywords":["react","logo","component","svg","animated"],"peerDependencies":{"react":"^18.0.0 || ^19.0.0"},"devDependencies":{"@storybook/addon-essentials":"^8.6.14","@storybook/blocks":"^8.6.14","@storybook/react":"^8.6.14","@storybook/react-vite":"^8.6.14","@types/react":"^19.1.12","@vitejs/plugin-react":"^4.7.0","react":"^19.1.1","storybook":"^8.6.14","typescript":"^5","vite":"^5.4.20"},"dependencies":{"sharp":"^0.34.4"},"_id":"@a24z/logo-component@0.1.2","gitHead":"5970044ca404bf9e58c6fe72c4116f8ae7e7456e","_nodeVersion":"23.11.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-q/3Ss2Md0jy2gwV+1GXeLzmK46GNmzn7iTmmDMZeR1TYfqRGzS96sXld2VcIGfXAZR/CiTZC2SDzJyYGWwx3Lg==","shasum":"c59acc9562d1058d0f97d7a5cea8a870ba0a9262","tarball":"https://registry.npmjs.org/@a24z/logo-component/-/logo-component-0.1.2.tgz","fileCount":11,"unpackedSize":31983,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIBhsaBer5zhCRIzAIiXsSKPGD2VHaPSEtk6yoPVcL4Z6AiEAxMYBjsgYhsHlcr+o0t2YkY99qUxspcRXFKBwo3K76OU="}]},"_npmUser":{"name":"fernando-ram-lugo","email":"principle@principlemd.com"},"directories":{},"maintainers":[{"name":"fernando-ram-lugo","email":"principle@principlemd.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/logo-component_0.1.2_1759463680081_0.7664745978224534"},"_hasShrinkwrap":false}},"time":{"created":"2025-10-01T19:25:33.462Z","modified":"2025-10-03T03:54:40.490Z","0.1.0":"2025-10-01T19:25:33.751Z","0.1.1":"2025-10-01T20:37:15.520Z","0.1.2":"2025-10-03T03:54:40.265Z"},"keywords":["react","logo","component","svg","animated"],"description":"Animated wireframe sphere logo component","maintainers":[{"name":"fernando-ram-lugo","email":"principle@principlemd.com"}],"readme":"# Logo Component\n\nAn animated wireframe sphere logo component for React.\n\n## Installation\n\n```bash\nnpm install @a24z/logo-component\n```\n\n## Usage\n\n```tsx\nimport { Logo } from '@a24z/logo-component';\n\nfunction App() {\n  return (\n    <Logo\n      width={150}\n      height={150}\n      color=\"currentColor\"\n      particleColor=\"#00ff00\"\n      opacity={0.9}\n    />\n  );\n}\n```\n\n## Props\n\n- `width` (number, default: 150): Width of the logo in pixels\n- `height` (number, default: 150): Height of the logo in pixels\n- `color` (string, default: \"currentColor\"): Color of the wireframe lines\n- `particleColor` (string, optional): Color of the animated particles (defaults to `color`)\n- `opacity` (number, default: 0.9): Overall opacity of the logo\n\n## Exporting PNG icons\n\nUse the provided script to render the SVG at a high resolution and optionally convert it to a PNG. The script will always write an SVG, and if [`sharp`](https://sharp.pixelplumbing.com/) is installed it will also generate a PNG while keeping transparency intact.\n\n```bash\n# Install sharp once if you plan to generate PNGs\nnpm install sharp\n\n# Export a 1024x1024 icon (SVG + PNG) to the exports/ directory\nnpm run export-icon\n\n# Customize the export (e.g. different size, colors, or SVG only)\nnpm run export-icon -- --size=512 --color=#ff00ff --svg-only\n```\n\n### Available flags\n\n- `--size <number>` – Output width and height in pixels (default: `1024`).\n- `--color <hex>` – Stroke color for the wireframe (default: `#00ffff`).\n- `--particle-color <hex>` – Particle color (defaults to `--color`).\n- `--opacity <0-1>` – Overrides the root SVG opacity (default: `1`).\n- `--output <path>` – Destination directory (default: `exports`).\n- `--name <string>` – Base file name used for the exports (default: `logo`).\n- `--svg-only` – Skip PNG generation, useful if `sharp` is not installed.\n- `--background <hex|transparent>` – Fill color to apply behind the icon when rasterizing.\n- `--density-multiplier <number>` – Multiplies the rasterization density before resizing (default: `2`).\n\n## License\n\nMIT\n","readmeFilename":"README.md"}