{"_id":"@akshay-bhalala/loaders","_rev":"5-ab2cd32792a13836e7ce9fac1002676f","name":"@akshay-bhalala/loaders","dist-tags":{"latest":"1.0.6"},"versions":{"1.0.1":{"name":"@akshay-bhalala/loaders","version":"1.0.1","keywords":[],"author":{"name":"Akshay Bhalala"},"license":"ISC","_id":"@akshay-bhalala/loaders@1.0.1","maintainers":[{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"}],"dist":{"shasum":"9d5af3e5a83086553a43778bdf0694a3cb18c928","tarball":"https://registry.npmjs.org/@akshay-bhalala/loaders/-/loaders-1.0.1.tgz","fileCount":31,"integrity":"sha512-7pc/xtD0jnh8aIQtmrC5VuMnKOXFi7zaNOToNbVzT1QPd57VhvbffrcpGsyHaIZKbHvH4DSkW8jxTHVtBuVecw==","signatures":[{"sig":"MEUCIE1c1mWM1KGvrUtioil2LPnFwj2QzAZ9y74wFaUpAZnUAiEA5DpizNJcaEeFO4yuQfShzFK6qvqOJNj0+36MOlDQuK4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":98042},"main":"dist/index.js","types":"dist/types/index.d.ts","module":"dist/index.esm.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c"},"_npmUser":{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"},"_npmVersion":"10.9.2","description":"A high-quality, customizable collection of React loader components for your UI: skeletons, spinners, bars, dots, rings, waves, and more. Perfect for modern web apps!","directories":{},"_nodeVersion":"22.14.0","dependencies":{"react":">=17.0.0","tslib":"^2.8.1","react-dom":">=17.0.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.45.1","typescript":"^5.8.3","@types/react":"^19.1.8","@types/react-dom":"^19.1.6","rollup-plugin-dts":"^6.2.1","@rollup/plugin-commonjs":"^28.0.6","@rollup/plugin-typescript":"^12.1.4","@rollup/plugin-node-resolve":"^16.0.1","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/loaders_1.0.1_1753083704066_0.6509962936358853","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@akshay-bhalala/loaders","version":"1.0.2","keywords":["react","loader","loaders","spinner","skeleton","progress","bar","dots","ring","wave","pulse","bounce","circular","component","ui","typescript","indicator","loading","animation"],"author":{"name":"Akshay Bhalala"},"license":"ISC","_id":"@akshay-bhalala/loaders@1.0.2","maintainers":[{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"}],"dist":{"shasum":"46b71d3eebde0d188bf13c0d0871811e14b92a01","tarball":"https://registry.npmjs.org/@akshay-bhalala/loaders/-/loaders-1.0.2.tgz","fileCount":31,"integrity":"sha512-LttIAlntUaygtsFB3wJgaQl8fT4G+fuis+pNCE+Gqbdz1ex9hBLTYJPCSgliu3bKtjnvwYY++V+2X7QaIA9HSw==","signatures":[{"sig":"MEUCIQCzw5NU4VD4qZdRFS/G467n457rKogyeYpK593B5ri0QgIgKpWm0Z8KZfylOR6JlCiPSjAWlgESzWLg3/RMPURJt04=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":98317},"main":"dist/index.js","types":"dist/types/index.d.ts","module":"dist/index.esm.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c"},"_npmUser":{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"},"_npmVersion":"10.9.2","description":"A high-quality, customizable collection of React loader components for your UI: skeletons, spinners, bars, dots, rings, waves, and more. Perfect for modern web apps!","directories":{},"_nodeVersion":"22.14.0","dependencies":{"react":">=17.0.0","tslib":"^2.8.1","react-dom":">=17.0.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.45.1","typescript":"^5.8.3","@types/react":"^19.1.8","@types/react-dom":"^19.1.6","rollup-plugin-dts":"^6.2.1","@rollup/plugin-commonjs":"^28.0.6","@rollup/plugin-typescript":"^12.1.4","@rollup/plugin-node-resolve":"^16.0.1","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/loaders_1.0.2_1753083817620_0.772552860410529","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@akshay-bhalala/loaders","version":"1.0.3","keywords":["react","loader","loaders","spinner","skeleton","progress","bar","dots","ring","wave","pulse","bounce","circular","component","ui","typescript","indicator","loading","animation"],"author":{"name":"Akshay Bhalala"},"license":"ISC","_id":"@akshay-bhalala/loaders@1.0.3","maintainers":[{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"}],"dist":{"shasum":"a6431d50c99798bf59f20277a794f647095dfa98","tarball":"https://registry.npmjs.org/@akshay-bhalala/loaders/-/loaders-1.0.3.tgz","fileCount":31,"integrity":"sha512-PBCoWMAW1GesDP1B+GAIRi9TKEiXpFFcwsSW7bawqhd9Am/5ByZuIT1yFqYCN0d37rNCWzaHrmz//vH9HSOeCg==","signatures":[{"sig":"MEQCH1LOsamI2jVa5dfJ8Xmn/0S1jnAhlfg+IrIjr1ECukUCIQCnyOqUaPlDyXd1hMZlPvnZR4vDDZG4fYGTifv50pGUfA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":98894},"main":"dist/index.js","types":"dist/types/index.d.ts","module":"dist/index.esm.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c"},"_npmUser":{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"},"_npmVersion":"10.9.2","description":"A high-quality, customizable collection of React loader components for your UI: skeletons, spinners, bars, dots, rings, waves, and more. Perfect for modern web apps!","directories":{},"_nodeVersion":"22.14.0","dependencies":{"react":">=17.0.0","tslib":"^2.8.1","react-dom":">=17.0.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.45.1","typescript":"^5.8.3","@types/react":"^19.1.8","@types/react-dom":"^19.1.6","rollup-plugin-dts":"^6.2.1","@rollup/plugin-commonjs":"^28.0.6","@rollup/plugin-typescript":"^12.1.4","@rollup/plugin-node-resolve":"^16.0.1","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/loaders_1.0.3_1753084946475_0.5667495302307197","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@akshay-bhalala/loaders","version":"1.0.4","keywords":["react","loader","loaders","spinner","skeleton","progress","bar","dots","ring","wave","pulse","bounce","circular","component","ui","typescript","indicator","loading","animation"],"author":{"name":"Akshay Bhalala"},"license":"MIT","_id":"@akshay-bhalala/loaders@1.0.4","maintainers":[{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"}],"dist":{"shasum":"9bd8fb5036f079e90ec9a908f8272f7657b813a6","tarball":"https://registry.npmjs.org/@akshay-bhalala/loaders/-/loaders-1.0.4.tgz","fileCount":31,"integrity":"sha512-GY/LNMKWRFVATIH7zF2hnRB1/ndZPC3RbIyFOJlAwVIslcyeip+S8QflFQxIvMV4V6LxdhgOI2U7s8iu5euVfA==","signatures":[{"sig":"MEYCIQC8xR/h+hCFP34TMyFb+iNdYRBf56QKuwhqQgRzuA1fKAIhAMkKPc/buItKmcuN2gyjqVvVVE1G9hkMS3zBVz0MYUpn","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":98894},"main":"dist/index.js","types":"dist/types/index.d.ts","module":"dist/index.esm.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c"},"_npmUser":{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"},"_npmVersion":"10.9.2","description":"A high-quality, customizable collection of React loader components for your UI: skeletons, spinners, bars, dots, rings, waves, and more. Perfect for modern web apps!","directories":{},"_nodeVersion":"22.14.0","dependencies":{"react":">=17.0.0","tslib":"^2.8.1","react-dom":">=17.0.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.45.1","typescript":"^5.8.3","@types/react":"^19.1.8","@types/react-dom":"^19.1.6","rollup-plugin-dts":"^6.2.1","@rollup/plugin-commonjs":"^28.0.6","@rollup/plugin-typescript":"^12.1.4","@rollup/plugin-node-resolve":"^16.0.1","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/loaders_1.0.4_1753085120164_0.1371070726058552","host":"s3://npm-registry-packages-npm-production"}},"1.0.6":{"name":"@akshay-bhalala/loaders","version":"1.0.6","main":"dist/index.js","module":"dist/index.esm.js","types":"dist/types/index.d.ts","scripts":{"build":"rollup -c","test":"echo \"Error: no test specified\" && exit 1"},"keywords":["react","loader","loaders","spinner","skeleton","progress","bar","dots","ring","wave","pulse","bounce","circular","component","ui","typescript","indicator","loading","animation"],"author":{"name":"Akshay Bhalala"},"license":"MIT","description":"A high-quality, customizable collection of React loader components for your UI: skeletons, spinners, bars, dots, rings, waves, and more. Perfect for modern web apps!","dependencies":{"react":">=17.0.0","react-dom":">=17.0.0","tslib":"^2.8.1"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"devDependencies":{"@rollup/plugin-commonjs":"^28.0.6","@rollup/plugin-node-resolve":"^16.0.1","@rollup/plugin-typescript":"^12.1.4","@types/react":"^19.1.8","@types/react-dom":"^19.1.6","rollup":"^4.45.1","rollup-plugin-dts":"^6.2.1","rollup-plugin-peer-deps-external":"^2.2.4","typescript":"^5.8.3"},"_id":"@akshay-bhalala/loaders@1.0.6","_nodeVersion":"22.14.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-y3uHkyEIf0Gf6ewFKxZQLQDddmfEyTFU8C5yGLGH6Tr8YlTlKUMDLDg96vyheeoFEekSMSFNM8EIE/KQzHlrmQ==","shasum":"74f480598fba66cfaf3fddd838734b7419325550","tarball":"https://registry.npmjs.org/@akshay-bhalala/loaders/-/loaders-1.0.6.tgz","fileCount":32,"unpackedSize":100525,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIFS5GTe24AVlh8dSewVqIm9p6TWlrDkzxgAr/4Nkl+FtAiEAhvKJeYVRJOF4bS1sSf/ozsdcu0Xu60xL2HE2fAqt2LY="}]},"_npmUser":{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"},"directories":{},"maintainers":[{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/loaders_1.0.6_1753086751418_0.6716016162206624"},"_hasShrinkwrap":false}},"time":{"created":"2025-07-21T07:41:43.943Z","modified":"2025-07-21T08:32:31.762Z","1.0.1":"2025-07-21T07:41:44.232Z","1.0.2":"2025-07-21T07:43:37.862Z","1.0.3":"2025-07-21T08:02:26.668Z","1.0.4":"2025-07-21T08:05:20.339Z","1.0.6":"2025-07-21T08:32:31.581Z"},"author":{"name":"Akshay Bhalala"},"license":"MIT","keywords":["react","loader","loaders","spinner","skeleton","progress","bar","dots","ring","wave","pulse","bounce","circular","component","ui","typescript","indicator","loading","animation"],"description":"A high-quality, customizable collection of React loader components for your UI: skeletons, spinners, bars, dots, rings, waves, and more. Perfect for modern web apps!","maintainers":[{"name":"akshay_bhalala","email":"akshaybhalala.93@gmail.com"}],"readme":"# React Loaders Library <br> <img src=\"https://img.shields.io/npm/v/@akshay-bhalala/loaders?color=blue\" alt=\"npm version\" /> <img src=\"https://img.shields.io/bundlephobia/minzip/@akshay-bhalala/loaders\" alt=\"bundle size\" />\r\n\r\nA high-quality, customizable collection of React loader components for your UI: skeletons, spinners, bars, dots, rings, waves, and more. Perfect for modern web apps!\r\n\r\n---\r\n\r\n## ✨ Features\r\n\r\n- ⚡ 10+ unique loader components (spinners, skeletons, bars, dots, rings, and more)\r\n- 🎨 Fully customizable via props\r\n- 🪶 Lightweight & tree-shakable\r\n- 🛡️  100% TypeScript & type-safe\r\n- 🧩 Easy integration with any React project\r\n- 📦 Ready for production\r\n\r\n---\r\n\r\n## 📦 Installation\r\n\r\n```bash\r\nnpm install @akshay-bhalala/loaders\r\n```\r\n\r\n---\r\n\r\n## 🚀 Quick Usage\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport {\r\n  SkeletonLoader,\r\n  SpinnerLoader,\r\n  DotsLoader,\r\n  BarLoader,\r\n  PulseLoader,\r\n  RingLoader,\r\n  WaveLoader,\r\n  DualRingLoader,\r\n  BounceLoader,\r\n  CircularProgressLoader,\r\n} from '@akshay-bhalala/loaders';\r\n\r\nconst Example = () => (\r\n  <div style={{ display: 'grid', gap: 24 }}>\r\n    <SkeletonLoader width={200} height={24} borderRadius={8} />\r\n    <SpinnerLoader size={48} color=\"#1976d2\" thickness={5} />\r\n    <DotsLoader size={16} color=\"#1976d2\" dotSpacing={10} />\r\n    <BarLoader width={300} height={8} color=\"#1976d2\" backgroundColor=\"#e0e0e0\" borderRadius={4} />\r\n    <PulseLoader size={24} color=\"#1976d2\" />\r\n    <RingLoader size={40} color=\"#1976d2\" thickness={4} />\r\n    <WaveLoader barCount={5} barWidth={4} barHeight={20} color=\"#1976d2\" gap={4} />\r\n    <DualRingLoader size={40} color=\"#1976d2\" thickness={4} />\r\n    <BounceLoader ballCount={3} size={14} color=\"#1976d2\" gap={8} />\r\n    <CircularProgressLoader size={40} color=\"#1976d2\" thickness={4} />\r\n  </div>\r\n);\r\n```\r\n\r\n---\r\n\r\n## 🧩 Components & Props\r\n\r\n### 🟦 SkeletonLoader\r\n- `width`, `height`, `borderRadius`, `style`, `className`\r\n\r\n### 🌀 SpinnerLoader\r\n- `size`, `color`, `thickness`, `style`, `className`\r\n\r\n### 🔵 DotsLoader\r\n- `size`, `color`, `dotSpacing`, `style`, `className`\r\n\r\n### ▓ BarLoader\r\n- `width`, `height`, `color`, `backgroundColor`, `borderRadius`, `style`, `className`\r\n\r\n### 🟣 PulseLoader\r\n- `size`, `color`, `style`, `className`\r\n\r\n### 🏵️ RingLoader\r\n- `size`, `color`, `thickness`, `style`, `className`\r\n\r\n### 🌊 WaveLoader\r\n- `barCount`, `barWidth`, `barHeight`, `color`, `gap`, `style`, `className`\r\n\r\n### 🏵️ DualRingLoader\r\n- `size`, `color`, `thickness`, `style`, `className`\r\n\r\n### 🟠 BounceLoader\r\n- `ballCount`, `size`, `color`, `gap`, `style`, `className`\r\n\r\n### 🟢 CircularProgressLoader\r\n- `size`, `color`, `thickness`, `style`, `className`\r\n\r\n---\r\n\r\n## 📚 Example: Customizing a Loader\r\n\r\n```tsx\r\n<SpinnerLoader size={60} color=\"#ff5722\" thickness={6} style={{ margin: 16 }} />\r\n```\r\n\r\n---\r\n\r\n## 🛠️ Contributing\r\n\r\nPull requests and issues are welcome! Please open an issue to discuss your idea or bug before submitting a PR.\r\n\r\n---\r\n\r\n## 📄 License\r\n\r\nMIT\r\n\r\n---\r\n\r\n## 👤 Author\r\n\r\n**Akshay Bhalala**\r\n\r\n- [NPM Profile](https://www.npmjs.com/~akshay-bhalala)\r\n- [GitHub](https://github.com/Akshay-Bhalala)\r\n\r\n---\r\n\r\n> Happy loading! 🎉 \r\n\r\n---\r\n\r\n## 🏷️ Keywords\r\n\r\nreact, loader, loaders, spinner, skeleton, progress, bar, dots, ring, wave, pulse, bounce, circular, component, ui, typescript, indicator, loading, animation\r\n\r\n--- ","readmeFilename":"README.md"}