{"_id":"@allem-ui/react","_rev":"4-b56156957622e407dcb941750b1d2882","name":"@allem-ui/react","dist-tags":{"latest":"0.0.4"},"versions":{"0.0.1":{"name":"@allem-ui/react","version":"0.0.1","keywords":["allem-ui","react","ui","components","tailwind","accessible","design-system"],"author":{"url":"https://kingallem.com","name":"Ahmed Allem"},"license":"MIT","_id":"@allem-ui/react@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":"b87466715143909ef04f775ae5297cfb66d41382","tarball":"https://registry.npmjs.org/@allem-ui/react/-/react-0.0.1.tgz","fileCount":7,"integrity":"sha512-IaChGqz2gCSjrUiqGtaDAoxbd9FPkwX8nO9M108N8JnEJIAQHCY4FPjACXfcyIXWu5E9zs3FhuGBZbCxaMDAKw==","signatures":[{"sig":"MEQCIExoLq5Y72dcZdGJ94sgSZKY+8ZNe/LswULXOBCNHTKTAiAb66RrpaSucVYoP2byYtYigTlJuOlj1gul52HlJOcDZQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":229302},"main":"./dist/index.js","_from":"file:allem-ui-react-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","test":"vitest run","build":"tsup","clean":"rm -rf dist","test:watch":"vitest"},"_npmUser":{"name":"kingofmit","email":"allem.ahmed@gmail.com"},"_resolved":"/private/var/folders/4v/rph2hgm54rqf12vzbjxpn5kc0000gn/T/d267b967bc48f7d0b25bcdab77739268/allem-ui-react-0.0.1.tgz","_integrity":"sha512-IaChGqz2gCSjrUiqGtaDAoxbd9FPkwX8nO9M108N8JnEJIAQHCY4FPjACXfcyIXWu5E9zs3FhuGBZbCxaMDAKw==","repository":{"url":"git+https://github.com/kingofmit/allem-ui.git","type":"git","directory":"packages/react"},"_npmVersion":"11.12.1","description":"The most complete React UI library — web & native. Beautiful, accessible, customizable.","directories":{},"sideEffects":false,"_nodeVersion":"26.0.0","dependencies":{"@allem-ui/theme":"0.0.1","react-aria-components":"^1.7.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.4.0","jsdom":"^25.0.0","react":"^19.0.0","vitest":"^3.0.0","react-dom":"^19.0.0","typescript":"^5.8.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0","@testing-library/react":"^16.0.0","@testing-library/jest-dom":"^6.9.1","@testing-library/user-event":"^14.6.1"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0","tailwindcss":">=4.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react_0.0.1_1779396105352_0.7668231437485518","host":"s3://npm-registry-packages-npm-production"}},"0.0.2":{"name":"@allem-ui/react","version":"0.0.2","keywords":["allem-ui","react","ui","components","tailwind","accessible","design-system"],"author":{"url":"https://kingallem.com","name":"Ahmed Allem"},"license":"MIT","_id":"@allem-ui/react@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":"f7a91ea67d0c23e85c8df4e63403f96f0dcc36f7","tarball":"https://registry.npmjs.org/@allem-ui/react/-/react-0.0.2.tgz","fileCount":7,"integrity":"sha512-2Aib+lV+T9yfbnmGoEMv0wOYS+mSy0t9iLYtr3K423ly/6vn9Abvg9KvNRBvdD9F2aYkXh2Hs5BA3Q5dF+FywA==","signatures":[{"sig":"MEQCIE7F+11zyWL3Cm0baZBjE56nL3l0Gm9dyivg2w6UNDBpAiAnvnDCe+I3dEXfk4zoaFDpDP6pqKGeT6tdLKgfw5wDlA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":229843},"main":"./dist/index.js","_from":"file:allem-ui-react-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","test":"vitest run","build":"tsup","clean":"rm -rf dist","test:watch":"vitest"},"_npmUser":{"name":"kingofmit","email":"allem.ahmed@gmail.com"},"_resolved":"/private/var/folders/4v/rph2hgm54rqf12vzbjxpn5kc0000gn/T/5f55474fe609ac775b2a77b38e8059b5/allem-ui-react-0.0.2.tgz","_integrity":"sha512-2Aib+lV+T9yfbnmGoEMv0wOYS+mSy0t9iLYtr3K423ly/6vn9Abvg9KvNRBvdD9F2aYkXh2Hs5BA3Q5dF+FywA==","repository":{"url":"git+https://github.com/kingofmit/allem-ui.git","type":"git","directory":"packages/react"},"_npmVersion":"11.12.1","description":"The most complete React UI library — web & native. Beautiful, accessible, customizable.","directories":{},"sideEffects":false,"_nodeVersion":"26.0.0","dependencies":{"@allem-ui/theme":"0.0.1","react-aria-components":"^1.17.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","jsdom":"^25.0.0","react":"^19.2.0","vitest":"^3.2.0","react-dom":"^19.2.0","typescript":"^5.9.0","@types/react":"^19.2.0","@types/react-dom":"^19.2.0","@testing-library/react":"^16.3.0","@testing-library/jest-dom":"^6.9.1","@testing-library/user-event":"^14.6.1"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0","tailwindcss":">=4.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react_0.0.2_1779491571759_0.7623536733645049","host":"s3://npm-registry-packages-npm-production"}},"0.0.3":{"name":"@allem-ui/react","version":"0.0.3","keywords":["allem-ui","react","ui","components","tailwind","accessible","design-system"],"author":{"url":"https://kingallem.com","name":"Ahmed Allem"},"license":"MIT","_id":"@allem-ui/react@0.0.3","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":"9ad14eb76be3912ad00cbc623274d34e0e796472","tarball":"https://registry.npmjs.org/@allem-ui/react/-/react-0.0.3.tgz","fileCount":8,"integrity":"sha512-okDeHbj47mKlqdQz5/wYy5+aqPkRDXHY7umQ9WrVDu4ZWZm5/3u/qfUy7wSB61kcxSlVbq3P7aLkEJQtgSqKYw==","signatures":[{"sig":"MEQCIAZi3W4eRv5+5q2bkNVwSBOf9hXHSbUZYkYfz8AGog5RAiB+w7R7Q1J4oH1hnAlLFAHj1BRwEHV4hJ9aojV+s/HJHg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":233826},"main":"./dist/index.js","_from":"file:allem-ui-react-0.0.3.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","test":"vitest run","build":"tsup","clean":"rm -rf dist","test:watch":"vitest"},"_npmUser":{"name":"kingofmit","email":"allem.ahmed@gmail.com"},"_resolved":"/private/var/folders/4v/rph2hgm54rqf12vzbjxpn5kc0000gn/T/a2a88aeefe61e2ea9528f53297c352fd/allem-ui-react-0.0.3.tgz","_integrity":"sha512-okDeHbj47mKlqdQz5/wYy5+aqPkRDXHY7umQ9WrVDu4ZWZm5/3u/qfUy7wSB61kcxSlVbq3P7aLkEJQtgSqKYw==","repository":{"url":"git+https://github.com/kingofmit/allem-ui.git","type":"git","directory":"packages/react"},"_npmVersion":"11.12.1","description":"The most complete React UI library — web & native. Beautiful, accessible, customizable.","directories":{},"sideEffects":false,"_nodeVersion":"26.0.0","dependencies":{"@allem-ui/theme":"0.0.2","react-aria-components":"^1.17.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","jsdom":"^25.0.0","react":"^19.2.0","vitest":"^3.2.0","react-dom":"^19.2.0","typescript":"^5.9.0","@types/react":"^19.2.0","@types/react-dom":"^19.2.0","@testing-library/react":"^16.3.0","@testing-library/jest-dom":"^6.9.1","@testing-library/user-event":"^14.6.1"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0","tailwindcss":">=4.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react_0.0.3_1779493502836_0.5083107789788774","host":"s3://npm-registry-packages-npm-production"}},"0.0.4":{"name":"@allem-ui/react","version":"0.0.4","description":"The most complete React UI library — web & native. Beautiful, accessible, customizable.","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,"dependencies":{"react-aria-components":"^1.17.0","@allem-ui/theme":"0.0.3"},"devDependencies":{"@testing-library/jest-dom":"^6.9.1","@testing-library/react":"^16.3.0","@testing-library/user-event":"^14.6.1","@types/react":"^19.2.0","@types/react-dom":"^19.2.0","jsdom":"^25.0.0","react":"^19.2.0","react-dom":"^19.2.0","tsup":"^8.5.0","typescript":"^5.9.0","vitest":"^3.2.0"},"peerDependencies":{"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/react"},"keywords":["allem-ui","react","ui","components","tailwind","accessible","design-system"],"publishConfig":{"access":"public"},"scripts":{"build":"tsup","dev":"tsup --watch","clean":"rm -rf dist","test":"vitest run","test:watch":"vitest"},"_id":"@allem-ui/react@0.0.4","bugs":{"url":"https://github.com/kingofmit/allem-ui/issues"},"homepage":"https://github.com/kingofmit/allem-ui#readme","_integrity":"sha512-HqvaLW52LkC0zhLFv8iVdGaNhhOOSKwzKRo8L6S6c/ATSz0VoNbFSRyrubFdIlwEXeeev50+E4x3Q6AdNaLOqQ==","_resolved":"/private/var/folders/4v/rph2hgm54rqf12vzbjxpn5kc0000gn/T/4d0d79162c7b0101597319812a57cbd0/allem-ui-react-0.0.4.tgz","_from":"file:allem-ui-react-0.0.4.tgz","_nodeVersion":"26.0.0","_npmVersion":"11.12.1","dist":{"integrity":"sha512-HqvaLW52LkC0zhLFv8iVdGaNhhOOSKwzKRo8L6S6c/ATSz0VoNbFSRyrubFdIlwEXeeev50+E4x3Q6AdNaLOqQ==","shasum":"3c6396ed0e6ce22be6bc4dc275088b9428bf0622","tarball":"https://registry.npmjs.org/@allem-ui/react/-/react-0.0.4.tgz","fileCount":8,"unpackedSize":234245,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIGFYvim0dSVr6MGrwwK+wnth6fAqlUUbwqDKuWkWcSW/AiBzR75D+nCIMIrxswb9zCKSR4TajX0Jbyv5U0o4GzvpuQ=="}]},"_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/react_0.0.4_1779581031364_0.7619329434005582"},"_hasShrinkwrap":false}},"time":{"created":"2026-05-21T20:41:45.018Z","modified":"2026-05-24T00:03:51.778Z","0.0.1":"2026-05-21T20:41:45.524Z","0.0.2":"2026-05-22T23:12:51.917Z","0.0.3":"2026-05-22T23:45:02.974Z","0.0.4":"2026-05-24T00:03:51.636Z"},"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","react","ui","components","tailwind","accessible","design-system"],"repository":{"type":"git","url":"git+https://github.com/kingofmit/allem-ui.git","directory":"packages/react"},"description":"The most complete React UI library — web & native. Beautiful, accessible, customizable.","maintainers":[{"name":"kingofmit","email":"allem.ahmed@gmail.com"}],"readme":"

\n \"Allem\n

\n\n

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

\n\n# @allem-ui/react\n\n30+ beautiful, accessible React components built on React Aria and Tailwind CSS v4.\n\n## Installation\n\n```bash\nnpm install @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/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 { Button, Input, Badge, Modal, Toast } from \"@allem-ui/react\";\n\nexport function App() {\n return (\n
\n \n \n Active\n
\n );\n}\n```\n\n## Components\n\n### Foundation\n\n`Box` `Text` `Heading` `Divider` `Badge` `Spinner` `Skeleton` `Avatar`\n\n### Forms\n\n`Button` `Input` `Textarea` `Checkbox` `Switch` `RadioGroup` `Radio` `Slider` `Select` `SelectItem`\n\n### Layout & Data\n\n`Flex` `Grid` `Container` `Code` `Link` `Card` `Table` `Breadcrumbs`\n\n### Overlay & Navigation\n\n`Modal` `Drawer` `Accordion` `Tabs` `Tooltip` `Popover` `Dropdown` `ContextMenu` `Toast` `Pagination`\n\n## Features\n\n- **Accessible** — Built on [React Aria](https://react-spectrum.adobe.com/react-aria/) for WCAG compliance\n- **Tailwind CSS v4** — Styled with utility classes, fully customizable via `className`\n- **Dark mode** — First-class dark mode with `dark:` Tailwind prefix\n- **TypeScript strict** — Full type safety and autocomplete\n- **Tree-shakeable** — ESM + CJS builds, import only what you use\n- **SSR-safe** — Works with Next.js, Vite, and Remix\n\n## Props API\n\nAll components follow a consistent prop pattern:\n\n| Prop | Values | Description |\n|------|--------|-------------|\n| `variant` | `solid`, `outline`, `ghost`, `subtle`, `link` | Visual style |\n| `size` | `sm`, `md`, `lg` | Component size |\n| `color` | `primary`, `neutral`, `danger`, `success`, `warning` | Color scheme |\n| `className` | string | Tailwind class overrides |\n\n## Standalone Packages\n\nFor specialized use cases, install these separately:\n\n| Package | Description |\n|---------|-------------|\n| [`@allem-ui/date-picker`](https://www.npmjs.com/package/@allem-ui/date-picker) | Calendar, DatePicker, DateRangePicker, TimeField |\n| [`@allem-ui/data-grid`](https://www.npmjs.com/package/@allem-ui/data-grid) | Data table with sorting, filtering, pagination |\n| [`@allem-ui/chat`](https://www.npmjs.com/package/@allem-ui/chat) | Chat bubbles, typing indicator, code blocks |\n| [`@allem-ui/kanban`](https://www.npmjs.com/package/@allem-ui/kanban) | Drag-and-drop kanban board |\n| [`@allem-ui/pricing`](https://www.npmjs.com/package/@allem-ui/pricing) | Pricing cards, toggles, comparison tables |\n| [`@allem-ui/changelog`](https://www.npmjs.com/package/@allem-ui/changelog) | Changelog timeline & version badges |\n\n## Part of Allem UI\n\nThis is the web package for the [Allem UI](https://github.com/kingofmit/allem-ui) monorepo. For React Native components, see [`@allem-ui/native`](https://www.npmjs.com/package/@allem-ui/native).\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"}