{"_id":"@bendarte/bensbib","_rev":"1-2377b64d828e7d8af38866823c74fce1","name":"@bendarte/bensbib","dist-tags":{"latest":"2.0.0"},"versions":{"1.0.0":{"name":"@bendarte/bensbib","version":"1.0.0","_id":"@bendarte/bensbib@1.0.0","maintainers":[{"name":"bendarte","email":"Osman.stockholm@gmail.com"}],"dist":{"shasum":"077e20058b9b7bfb810eeaf17a3c1d865eeb341a","tarball":"https://registry.npmjs.org/@bendarte/bensbib/-/bensbib-1.0.0.tgz","fileCount":5,"integrity":"sha512-NLinCgm6UXJFYj/C2A8eisz7LsMJQ3zb/bdl9t5/grBfYQtwIcfV0jM+6YhHBXNvohD81GFsB0yUIodQJ+JrmA==","signatures":[{"sig":"MEYCIQDNz4uydiW3RwNqVjdCP+4ZiIGVVMkgonOicpLGvOG3wgIhAMyhje17AkR6nrjbpMOfEXOs1+Tkk4mz/4hGexyKbUKW","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":111845},"main":"dist/index.js","type":"module","module":"dist/index.js","exports":{".":{"import":"./dist/index.js","require":"./dist/index.cjs"}},"gitHead":"a0deec67141648a31e5acde233a470febf7989cf","private":false,"scripts":{"dev":"vite","lint":"eslint .","build":"vite build","prepare":"npm run build","preview":"vite preview","storybook":"storybook dev -p 6006","build-storybook":"storybook build"},"_npmUser":{"name":"bendarte","email":"Osman.stockholm@gmail.com"},"_npmVersion":"10.8.2","description":"A modern, customizable React component library featuring beautiful UI components. Built with Storybook and styled with CSS modules for maximum flexibility and maintainability.","directories":{},"_nodeVersion":"20.17.0","dependencies":{},"eslintConfig":{"extends":["plugin:storybook/recommended"]},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.10","react":"^18.3.1","eslint":"^9.13.0","globals":"^15.11.0","postcss":"^8.4.49","react-dom":"^18.3.1","storybook":"^8.4.5","@eslint/js":"^9.13.0","prop-types":"^15.8.1","@types/react":"^18.3.12","autoprefixer":"^10.4.20","@storybook/test":"^8.4.5","@storybook/react":"^8.4.5","@types/react-dom":"^18.3.1","@storybook/blocks":"^8.4.5","eslint-plugin-react":"^7.37.2","@vitejs/plugin-react":"^4.3.3","@storybook/react-vite":"^8.4.5","@storybook/manager-api":"^8.4.5","eslint-plugin-storybook":"^0.11.1","@chromatic-com/storybook":"^3.2.2","@storybook/addon-styling":"^2.0.0","eslint-plugin-react-hooks":"^5.0.0","@storybook/addon-essentials":"^8.4.5","@storybook/addon-onboarding":"^8.4.5","eslint-plugin-react-refresh":"^0.4.14","@storybook/addon-interactions":"^8.4.5"},"peerDependencies":{"react":"^18.0.0","react-dom":"^18.0.0"},"_npmOperationalInternal":{"tmp":"tmp/bensbib_1.0.0_1732573093083_0.1532726708938279","host":"s3://npm-registry-packages"}},"2.0.0":{"name":"@bendarte/bensbib","version":"2.0.0","private":false,"main":"dist/bensbib.umd.js","module":"dist/bensbib.es.js","style":"dist/style.css","exports":{".":{"import":"./dist/bensbib.es.js","require":"./dist/bensbib.umd.js"},"./dist/style.css":"./dist/style.css"},"scripts":{"dev":"vite","build":"vite build","lint":"eslint .","preview":"vite preview","storybook":"storybook dev -p 6006","build-storybook":"storybook build","prepare":"npm run build"},"peerDependencies":{"react":"^18.0.0","react-dom":"^18.0.0"},"dependencies":{},"devDependencies":{"react":"^18.3.1","react-dom":"^18.3.1","@chromatic-com/storybook":"^3.2.2","@eslint/js":"^9.13.0","@storybook/addon-essentials":"^8.4.5","@storybook/addon-interactions":"^8.4.5","@storybook/addon-onboarding":"^8.4.5","@storybook/addon-styling":"^2.0.0","@storybook/blocks":"^8.4.5","@storybook/manager-api":"^8.4.5","@storybook/react":"^8.4.5","@storybook/react-vite":"^8.4.5","@storybook/test":"^8.4.5","@types/react":"^18.3.12","@types/react-dom":"^18.3.1","@vitejs/plugin-react":"^4.3.3","autoprefixer":"^10.4.20","eslint":"^9.13.0","storybook":"^8.4.5","vite":"^5.2.6"},"_id":"@bendarte/bensbib@2.0.0","gitHead":"83ab488d01ff788d379b227475e85fd2643ceb00","description":"A modern, customizable React component library featuring beautiful UI components. Built with Storybook and styled with CSS modules for maximum flexibility and maintainability.","_nodeVersion":"20.17.0","_npmVersion":"10.8.2","dist":{"integrity":"sha512-1GBKBPmGdhwJIFNWoeUMdUTmeuxton6WOFSK+Gf7O0DOp/j9V00EwCg/aGh1C0xpI8KGrxi+xBncoQxm40JfrA==","shasum":"50a16d5eb1e9793d390ff24dd40669ae1e8b4699","tarball":"https://registry.npmjs.org/@bendarte/bensbib/-/bensbib-2.0.0.tgz","fileCount":5,"unpackedSize":111530,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG3w6gWDePzMujbh+ojqv2J2qdMFnZ/45/2TvMK55uE4AiBDkCZpiKBL/Yvb6x/KwN7iiOEhirxnLwZuBlAKL5UNnA=="}]},"_npmUser":{"name":"bendarte","email":"Osman.stockholm@gmail.com"},"directories":{},"maintainers":[{"name":"bendarte","email":"Osman.stockholm@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/bensbib_2.0.0_1732574806406_0.5398973971592884"},"_hasShrinkwrap":false}},"time":{"created":"2024-11-25T22:18:12.971Z","modified":"2024-11-25T22:46:46.771Z","1.0.0":"2024-11-25T22:18:13.261Z","2.0.0":"2024-11-25T22:46:46.590Z"},"description":"A modern, customizable React component library featuring beautiful UI components. Built with Storybook and styled with CSS modules for maximum flexibility and maintainability.","maintainers":[{"name":"bendarte","email":"Osman.stockholm@gmail.com"}],"readme":"# Ben Component Library\n\nA modern, customizable React component library featuring beautiful UI components. Built with Storybook and styled with CSS modules for maximum flexibility and maintainability.\n\n## 🎨 Features\n\n- **Themeable Components**: Light, Dark, and Primary themes for all components\n- **Responsive Design**: Mobile-first approach with responsive breakpoints\n- **Accessibility**: ARIA support and keyboard navigation\n- **Modern Styling**: CSS Modules with CSS Variables for easy customization\n- **Interactive Documentation**: Full Storybook integration with live examples\n\n## 📦 Components\n\n### Button\n- Multiple themes (light, dark, primary)\n- Size variants (small, medium, large)\n- States (hover, focus, disabled, loading)\n- Custom icons support\n- Hover animations\n\n### Card\n- Flexible layout system\n- Theme support\n- Customizable borders and shadows\n- Animation effects\n- Header and footer sections\n- Responsive behavior\n\n### Input\n- Theme variants\n- Icon support (left/right)\n- Validation states\n- Clear button option\n- Custom styling options\n- Accessibility features\n\n### SearchBar\n- Advanced search functionality\n- Loading states\n- Clear button\n- Custom themes\n- Keyboard navigation\n- Mobile optimization\n\n## 🛠 Tech Stack\n\n- React 18\n- Storybook 8\n- CSS Modules\n- PropTypes\n- Vite\n\n## 🚀 Getting Started\n\n1. Install the package:\n```bash\nnpm install @my-components/component-library-modules\n```\n\n2. Import components:\n```jsx\nimport { Button, Card, Input, SearchBar } from '@my-components/component-library-modules';\n```\n\n3. Use in your React app:\n```jsx\nfunction App() {\n  return (\n    <div>\n      <Card theme=\"primary\">\n        <h2>Welcome!</h2>\n        <Input placeholder=\"Enter your name\" />\n        <Button>Submit</Button>\n      </Card>\n    </div>\n  );\n}\n```\n\n## 💻 Development\n\n1. Clone the repository:\n```bash\ngit clone https://github.com/bendarte/ben-component-library.git\n```\n\n2. Install dependencies:\n```bash\nnpm install\n```\n\n3. Start Storybook:\n```bash\nnpm run storybook\n```\n\n## 📚 Documentation\n\nFull documentation and live examples available in Storybook. Run `npm run storybook` and visit:\n- Component API documentation\n- Interactive examples\n- Theme customization\n- Accessibility guidelines\n- Responsive demos\n\n## 🤝 Contributing\n\nContributions are welcome! Please read our contributing guidelines before submitting PRs.\n\n## 📄 License\n\nMIT © [Ben]\n","readmeFilename":"README.md"}