{"_id":"@allem-ui/pricing","_rev":"3-01c99a15a42fbcc6f1ad61bc0d7b5105","name":"@allem-ui/pricing","dist-tags":{"latest":"0.0.3"},"versions":{"0.0.1":{"name":"@allem-ui/pricing","version":"0.0.1","keywords":["allem-ui","pricing","pricing-table","saas","react","components"],"author":{"url":"https://kingallem.com","name":"Ahmed Allem"},"license":"MIT","_id":"@allem-ui/pricing@0.0.1","maintainers":[{"name":"kingofmit","email":"allem.ahmed@gmail.com"}],"homepage":"https://github.com/kingofmit/allem-ui#readme","bugs":{"url":"https://github.com/kingofmit/allem-ui/issues"},"dist":{"shasum":"c75e9c14268e2e04d56c9c3068f988bb5267ee0f","tarball":"https://registry.npmjs.org/@allem-ui/pricing/-/pricing-0.0.1.tgz","fileCount":7,"integrity":"sha512-pnlQwF181Z1IpCeCV4VY77D9EY+3J2LxzOLgHupbsixeM/JuFpMbm27cBZPmjp7yZr/7D3Gd1+mUqQ2OZkQhXg==","signatures":[{"sig":"MEYCIQDFAYhvpAwdHNkd+YCLzlDxTpQv4JjpBzpjR3V5CUrtTAIhAPyfU5Xn26ed6J1MuHtiooCf3CcLl2FvVTWu9i1Lw+A6","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":52542},"main":"./dist/index.js","_from":"file:allem-ui-pricing-0.0.1.tgz","types":"./dist/index.d.ts","module":"./dist/index.mjs","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"scripts":{"dev":"tsup --watch","build":"tsup","clean":"rm -rf dist"},"_npmUser":{"name":"kingofmit","email":"allem.ahmed@gmail.com"},"_resolved":"/private/var/folders/4v/rph2hgm54rqf12vzbjxpn5kc0000gn/T/00afdb66307b2865a75fadaf3b9780f5/allem-ui-pricing-0.0.1.tgz","_integrity":"sha512-pnlQwF181Z1IpCeCV4VY77D9EY+3J2LxzOLgHupbsixeM/JuFpMbm27cBZPmjp7yZr/7D3Gd1+mUqQ2OZkQhXg==","repository":{"url":"git+https://github.com/kingofmit/allem-ui.git","type":"git","directory":"packages/pricing"},"_npmVersion":"11.12.1","description":"Pricing table and comparison components for Allem UI","directories":{},"sideEffects":false,"_nodeVersion":"26.0.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.4.0","react":"^19.0.0","react-dom":"^19.0.0","typescript":"^5.8.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0","tailwindcss":">=4.0.0","@allem-ui/react":">=0.0.1","@allem-ui/theme":">=0.0.1"},"_npmOperationalInternal":{"tmp":"tmp/pricing_0.0.1_1779396105150_0.45081516366067165","host":"s3://npm-registry-packages-npm-production"}},"0.0.2":{"name":"@allem-ui/pricing","version":"0.0.2","keywords":["allem-ui","pricing","pricing-table","saas","react","components"],"author":{"url":"https://kingallem.com","name":"Ahmed Allem"},"license":"MIT","_id":"@allem-ui/pricing@0.0.2","maintainers":[{"name":"kingofmit","email":"allem.ahmed@gmail.com"}],"homepage":"https://github.com/kingofmit/allem-ui#readme","bugs":{"url":"https://github.com/kingofmit/allem-ui/issues"},"dist":{"shasum":"961c4a7a31fc3b95961f05a670a8e76414a792b5","tarball":"https://registry.npmjs.org/@allem-ui/pricing/-/pricing-0.0.2.tgz","fileCount":8,"integrity":"sha512-uL7KoZDWwj0dlix1pgGZIh27vyoYJtHWWrhuU3g8d4IbddgzxaVRJuEKANBgKycHikzLgvdVOwHbrwxh+fRdLQ==","signatures":[{"sig":"MEYCIQC36jxvZdb+uGvEh7ROuDjTzYkgqL28WgKENQtYmCy3WgIhAOYlB10Vxm2Tdocmy8XwpjEV7s/9JXj2XQg1TbD+QZU4","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":55772},"main":"./dist/index.js","_from":"file:allem-ui-pricing-0.0.2.tgz","types":"./dist/index.d.ts","module":"./dist/index.mjs","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"scripts":{"dev":"tsup --watch","build":"tsup","clean":"rm -rf dist"},"_npmUser":{"name":"kingofmit","email":"allem.ahmed@gmail.com"},"_resolved":"/private/var/folders/4v/rph2hgm54rqf12vzbjxpn5kc0000gn/T/966bd3fe94149c246eeba606c8faa3c4/allem-ui-pricing-0.0.2.tgz","_integrity":"sha512-uL7KoZDWwj0dlix1pgGZIh27vyoYJtHWWrhuU3g8d4IbddgzxaVRJuEKANBgKycHikzLgvdVOwHbrwxh+fRdLQ==","repository":{"url":"git+https://github.com/kingofmit/allem-ui.git","type":"git","directory":"packages/pricing"},"_npmVersion":"11.12.1","description":"Pricing table and comparison components for Allem UI","directories":{},"sideEffects":false,"_nodeVersion":"26.0.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","react":"^19.2.0","react-dom":"^19.2.0","typescript":"^5.9.0","@types/react":"^19.2.0","@types/react-dom":"^19.2.0"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0","tailwindcss":">=4.0.0","@allem-ui/react":">=0.0.1","@allem-ui/theme":">=0.0.1"},"_npmOperationalInternal":{"tmp":"tmp/pricing_0.0.2_1779493526923_0.9597227074621635","host":"s3://npm-registry-packages-npm-production"}},"0.0.3":{"name":"@allem-ui/pricing","version":"0.0.3","description":"Pricing table and comparison components for Allem UI","license":"MIT","author":{"name":"Ahmed Allem","url":"https://kingallem.com"},"main":"./dist/index.js","module":"./dist/index.mjs","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"sideEffects":false,"devDependencies":{"@types/react":"^19.2.0","@types/react-dom":"^19.2.0","react":"^19.2.0","react-dom":"^19.2.0","tsup":"^8.5.0","typescript":"^5.9.0"},"peerDependencies":{"@allem-ui/react":">=0.0.4","@allem-ui/theme":">=0.0.3","react":">=18.0.0","react-dom":">=18.0.0","tailwindcss":">=4.0.0"},"repository":{"type":"git","url":"git+https://github.com/kingofmit/allem-ui.git","directory":"packages/pricing"},"keywords":["allem-ui","pricing","pricing-table","saas","react","components"],"publishConfig":{"access":"public"},"scripts":{"build":"tsup","dev":"tsup --watch","clean":"rm -rf dist"},"_id":"@allem-ui/pricing@0.0.3","bugs":{"url":"https://github.com/kingofmit/allem-ui/issues"},"homepage":"https://github.com/kingofmit/allem-ui#readme","_integrity":"sha512-PF6Y8z0MmZu+cMbuuK332uZY3Cff/0vfvN8nr0e1RIKwpK4iFvDtfYSJ8kVohkAQIokKK26qx3WySjf62/rVew==","_resolved":"/private/var/folders/4v/rph2hgm54rqf12vzbjxpn5kc0000gn/T/567c066130736bc507fb94d9e1a7893e/allem-ui-pricing-0.0.3.tgz","_from":"file:allem-ui-pricing-0.0.3.tgz","_nodeVersion":"26.0.0","_npmVersion":"11.12.1","dist":{"integrity":"sha512-PF6Y8z0MmZu+cMbuuK332uZY3Cff/0vfvN8nr0e1RIKwpK4iFvDtfYSJ8kVohkAQIokKK26qx3WySjf62/rVew==","shasum":"a5311944ae5277008263855b18bfd31f6543ddaf","tarball":"https://registry.npmjs.org/@allem-ui/pricing/-/pricing-0.0.3.tgz","fileCount":8,"unpackedSize":56220,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIHUMcwBTbQj3RI9iylXiSZysMQmEJuwv4l/QlQEHbqrCAiBiXIEyQgzPpSnAQLqz/qLAcE0swO8JNWOxtOdFRvPxYw=="}]},"_npmUser":{"name":"kingofmit","email":"allem.ahmed@gmail.com"},"directories":{},"maintainers":[{"name":"kingofmit","email":"allem.ahmed@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/pricing_0.0.3_1779581028348_0.9100613769818375"},"_hasShrinkwrap":false}},"time":{"created":"2026-05-21T20:41:45.057Z","modified":"2026-05-24T00:03:48.715Z","0.0.1":"2026-05-21T20:41:45.316Z","0.0.2":"2026-05-22T23:45:27.062Z","0.0.3":"2026-05-24T00:03:48.606Z"},"bugs":{"url":"https://github.com/kingofmit/allem-ui/issues"},"author":{"name":"Ahmed Allem","url":"https://kingallem.com"},"license":"MIT","homepage":"https://github.com/kingofmit/allem-ui#readme","keywords":["allem-ui","pricing","pricing-table","saas","react","components"],"repository":{"type":"git","url":"git+https://github.com/kingofmit/allem-ui.git","directory":"packages/pricing"},"description":"Pricing table and comparison components for Allem UI","maintainers":[{"name":"kingofmit","email":"allem.ahmed@gmail.com"}],"readme":"

\n \"Allem\n

\n\n

\n \"npm\n \"License\"\n \"React\n \"Tailwind\n \"TypeScript\"\n

\n\n# @allem-ui/pricing\n\nPricing table and comparison components for Allem UI -- pricing cards, billing toggles, feature lists, and side-by-side plan comparisons.\n\n## Installation\n\n```bash\nnpm install @allem-ui/pricing @allem-ui/react @allem-ui/theme\n```\n\n## Tailwind CSS Setup\n\nAdd the following to your main CSS file (e.g. `globals.css`) so Tailwind generates the utility classes used by the components:\n\n```css\n@import \"tailwindcss\";\n@source \"@allem-ui/react\";\n@source \"@allem-ui/pricing\";\n@source \"@allem-ui/theme\";\n```\n\n> **Note:** The `@source` directive tells Tailwind CSS v4 to scan the package for class names. Without it, component styles like padding, borders, and colors won't be generated.\n\n## Quick Start\n\n```tsx\nimport {\n PricingCard,\n PricingToggle,\n FeatureList,\n} from \"@allem-ui/pricing\";\n\nexport function PricingPage() {\n const [billing, setBilling] = useState<\"monthly\" | \"yearly\">(\"monthly\");\n\n return (\n
\n \n \n \n \n
\n );\n}\n```\n\n## Components\n\n| Component | Description |\n|-----------|-------------|\n| `PricingCard` | Individual pricing tier card with price, features, and CTA |\n| `PricingToggle` | Monthly/yearly billing toggle switch |\n| `PricingTable` | Layout container for multiple pricing cards |\n| `FeatureList` | Checklist of included/excluded features |\n| `PricingComparisonTable` | Side-by-side feature comparison across plans |\n\n## Features\n\n- **SaaS-ready** -- Drop-in pricing page components for subscription products\n- **Billing toggle** -- Monthly/yearly toggle with price switching\n- **Comparison tables** -- Feature-by-feature plan comparison with categories\n- **Highlighted plans** -- Visually emphasize recommended pricing tiers\n- **Dark mode** -- First-class dark mode with `dark:` Tailwind prefix\n- **TypeScript strict** -- Full type safety with exported prop types\n- **Tree-shakeable** -- ESM + CJS builds, import only what you use\n\n## Part of Allem UI\n\nThis is a standalone package in the [Allem UI](https://github.com/kingofmit/allem-ui) monorepo. For core components, see [`@allem-ui/react`](https://www.npmjs.com/package/@allem-ui/react).\n\n## Support\n\nIf you find Allem UI useful, consider supporting its development:\n\n\"Buy\n\n## License\n\n[MIT](https://github.com/kingofmit/allem-ui/blob/main/LICENSE) - [Ahmed Allem](https://kingallem.com)\n","readmeFilename":"README.md"}