{"_id":"@achmadk/react-epic-spinner-css","_rev":"3-7928995eed3fac6e8e7c1516931011d7","name":"@achmadk/react-epic-spinner-css","dist-tags":{"latest":"1.0.0"},"versions":{"0.0.1":{"name":"@achmadk/react-epic-spinner-css","description":"Reusable react implementation of epic-spinners","version":"0.0.1","main":"./index.js","module":"dist/react-epic-spinner-css.esm.js","browser":"dist/react-epic-spinner-css.umd.min.js","exports":{".":{"import":"./dist/react-epic-spinner-css.esm.js","require":"./index.js"}},"repository":{"type":"git","url":"git+ssh://git@github.com/achmadk/react-epic-spinners.git"},"author":{"name":"Achmad Kurnianto","email":"achmad.kurnianto@gmail.com"},"typings":"./typings/index.d.ts","license":"MIT","keywords":["react","epic spinners","spinners"],"sideEffects":false,"devDependencies":{"@babel/core":"^7.17.9","@babel/plugin-external-helpers":"^7.16.7","@babel/plugin-transform-runtime":"^7.17.0","@babel/preset-env":"^7.16.11","@babel/preset-react":"^7.16.7","@linaria/babel-preset":"3.0.0-beta.15","@linaria/rollup":"3.0.0-beta.15","@linaria/webpack-loader":"3.0.0-beta.16","@rollup/plugin-babel":"5.3.1","@rollup/plugin-commonjs":"21.1.0","@rollup/plugin-node-resolve":"13.2.1","@rollup/plugin-replace":"4.0.0","@storybook/addon-actions":"^6.4.22","@storybook/addon-essentials":"^6.4.22","@storybook/addon-links":"^6.4.22","@storybook/addons":"6.4.22","@storybook/preset-typescript":"3.0.0","@storybook/react":"^6.4.22","@storybook/theming":"6.4.22","@types/react":"^16.9.51","babel-loader":"^8.2.5","babel-plugin-transform-react-remove-prop-types":"0.4.24","fork-ts-checker-webpack-plugin":"7.2.6","prop-types":"^15.8.1","react":"^16.13.1","react-dom":"^16.13.1","react-is":"^16.13.1","rollup":"^2.70.2","rollup-plugin-css-only":"3.1.0","rollup-plugin-size-snapshot":"^0.12.0","rollup-plugin-terser":"7.0.2","ts-loader":"9.2.8","typescript":"4.6.3"},"dependencies":{"@linaria/core":"3.0.0-beta.15","@linaria/react":"3.0.0-beta.15","@linaria/shaker":"3.0.0-beta.15"},"peerDependencies":{"react":">=0.14.x","react-dom":">=0.14.x"},"scripts":{"build":"rollup -c","dev":"rollup -c -w","test":"jest","prepublish":"yarn build","storybook":"start-storybook -p 6006","build-storybook":"build-storybook"},"packageManager":"yarn@3.2.0","gitHead":"ea13e3b38e86606b6b0c81a15888d1187029912a","bugs":{"url":"https://github.com/achmadk/react-epic-spinners/issues"},"homepage":"https://github.com/achmadk/react-epic-spinners#readme","_id":"@achmadk/react-epic-spinner-css@0.0.1","_nodeVersion":"16.14.2","_npmVersion":"8.7.0","dist":{"integrity":"sha512-RJ9b94DzX5MQfNtYtaQXF7dsvCS9F/0Bg0Ks+R3ac8aN0ipgIdnx3ZYNZjlpJfAKZneSw6tckltLEt8mAgNNBw==","shasum":"1fa7d48c258f0c6c8658136844f557b3911cf019","tarball":"https://registry.npmjs.org/@achmadk/react-epic-spinner-css/-/react-epic-spinner-css-0.0.1.tgz","fileCount":11,"unpackedSize":222352,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCOKW4kTtf3aCkv/cYAJjwHRhUIdoTPryuHwBsDDF0sHgIgJXPjlyH8gY94Yx4Y7boN9fXR767UB2cWPBcCPBPXIyI="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiYPB5ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmosag//dqg9hNnEhsa7OZioh6wxUbY4tK90tVCxWoi/HOJe2Ib6TKc6\r\nkMoLhBONXlXHz0AHWpKbrwo5nzSzFuW4duWv3QFZX8kveAJF5eYv3xI5Jjgw\r\nD4a8Mto1JdmNqtRS9jgrtYi9zZanikcr+PMFwv/IJQY85jtIJKBVNJRSu8gg\r\n1D/8nQq4KOuJa+i9unhThPGed5N59LMya5rkhWilDybclAoc6+Hv+LcLUo0r\r\nvtVsmz94bQS4NgFhcWI/K2AnlFgRyR8nAQsP/hf2QMlf8lVH8XFAkMAkiwUN\r\nPQ9nlryondzAnlAWYOxNIPKVmxpxZo08KXyqInzrRhb1tXAaky79cB96WHC4\r\n/+Wc0haao3mHSqMaj5B+8wBk7bRf5/9V09Fip8padKdxNu9K6lz/vwC2QvFm\r\ny+uS3pwd8hDxvwj4AGH8+/L7TQROO8acv7tMUBFBqsJDobAo3CDF8z4bDBlr\r\nojw4Vu4ceBOmLRSZg+8cBSsU1V/aGNjE2LrCHO+zWlY/nEU/OEj73jl6UgAM\r\nrRHxrPOMZFhzVhCWTz0BkIMrTjTUH9mmaCMv7tGkJhUWv4KOTuBwZ6rN+P7Z\r\nRdxxyMFKHuUxGf5jxwtFmibEhLpgpOslA+ngEh3qjhUowGVStiH4Y1JV55v1\r\nubc3PtvFNds6W4gD2V0aCgMphQ6Suvu2TW0=\r\n=27eg\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"},"directories":{},"maintainers":[{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-epic-spinner-css_0.0.1_1650520185405_0.6347723619801571"},"_hasShrinkwrap":false},"0.0.2":{"name":"@achmadk/react-epic-spinner-css","description":"Reusable react implementation of epic-spinners","version":"0.0.2","main":"./index.js","module":"dist/react-epic-spinner-css.esm.js","browser":"dist/react-epic-spinner-css.umd.min.js","exports":{".":{"import":"./dist/react-epic-spinner-css.esm.js","require":"./index.js"},"./dist/react-epic-spinner-css.css":"./dist/react-epic-spinner-css.css"},"repository":{"type":"git","url":"git+ssh://git@github.com/achmadk/react-epic-spinners.git"},"author":{"name":"Achmad Kurnianto","email":"achmad.kurnianto@gmail.com"},"typings":"./typings/index.d.ts","license":"MIT","keywords":["react","epic spinners","spinners"],"sideEffects":false,"devDependencies":{"@babel/core":"^7.17.9","@babel/plugin-external-helpers":"^7.16.7","@babel/plugin-transform-runtime":"^7.17.0","@babel/preset-env":"^7.16.11","@babel/preset-react":"^7.16.7","@linaria/babel-preset":"3.0.0-beta.15","@linaria/rollup":"3.0.0-beta.15","@linaria/webpack-loader":"3.0.0-beta.16","@rollup/plugin-babel":"5.3.1","@rollup/plugin-commonjs":"21.1.0","@rollup/plugin-node-resolve":"13.2.1","@rollup/plugin-replace":"4.0.0","@storybook/addon-actions":"^6.4.22","@storybook/addon-essentials":"^6.4.22","@storybook/addon-links":"^6.4.22","@storybook/addons":"6.4.22","@storybook/preset-typescript":"3.0.0","@storybook/react":"^6.4.22","@storybook/theming":"6.4.22","@types/react":"^16.9.51","babel-loader":"^8.2.5","babel-plugin-transform-react-remove-prop-types":"0.4.24","fork-ts-checker-webpack-plugin":"7.2.6","prop-types":"^15.8.1","react":"^16.13.1","react-dom":"^16.13.1","react-is":"^16.13.1","rollup":"^2.70.2","rollup-plugin-css-only":"3.1.0","rollup-plugin-size-snapshot":"^0.12.0","rollup-plugin-terser":"7.0.2","ts-loader":"9.2.8","typescript":"4.6.3"},"dependencies":{"@linaria/core":"3.0.0-beta.15","@linaria/react":"3.0.0-beta.15","@linaria/shaker":"3.0.0-beta.15"},"peerDependencies":{"react":">=0.14.x","react-dom":">=0.14.x"},"scripts":{"build":"rollup -c","dev":"rollup -c -w","test":"jest","prepublish":"yarn build","storybook":"start-storybook -p 6006","build-storybook":"build-storybook"},"packageManager":"yarn@3.2.0","gitHead":"39d3083a9bc26266b48820652797ffcbc0b1475a","bugs":{"url":"https://github.com/achmadk/react-epic-spinners/issues"},"homepage":"https://github.com/achmadk/react-epic-spinners#readme","_id":"@achmadk/react-epic-spinner-css@0.0.2","_nodeVersion":"16.14.2","_npmVersion":"8.7.0","dist":{"integrity":"sha512-qpZRYnD8OYgB5a42T2PyTxALf+PvcCHetofALOC1JhsFm55ZwLnMdEG3i591eMnLt2MKgOOYt0F9LdG5NA5syw==","shasum":"bdeadc242f61053b6331c51979daaa022f1d3ab7","tarball":"https://registry.npmjs.org/@achmadk/react-epic-spinner-css/-/react-epic-spinner-css-0.0.2.tgz","fileCount":11,"unpackedSize":222430,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBhcoyeFiyo+wMbVgGtKeX/yjVyod0/ztaflQ6KD3Rr0AiEA+1NjwgVIHgwCxA+rZa8U7GCZIBXMJOIyNOOsS4QGsNc="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiYPrUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqtNg//fWGmQ/jwhCZnuO/+ff+SEi7MSyhuP2P3Zh79gOvzR8VVW8fM\r\nTSH9Qne3Y75A/rIlnIZT2cSbu2PZkEoOQ3V4hNWHaNiPZzwZPrxO4gJ347PT\r\nXErhjiNFAwP0ugJ6QJhxu5vih9KmVtRWla4ev/W9mLo/L0J2uOaQaPdltwqC\r\nHGFAfZZewsKKYpaNeXZ+5/TdO+J1L39bVJy4F1cXCIUjiPOuKbJLscbYWnic\r\nCAovVlZgj635odIlEdAjEjbZPvxy4GvTM4H07jaxuM/b8ly4W2sQXE5Vbx8C\r\nQPQvRnRJpV5bZh32LH7SCYvM5miocd1j+eAdTJJBwtN73L+y5BaWj0p9cyxV\r\n1V1Zp/KlxrA+VQni7xnWiOgK2ivL+i6w2ExHVBiEAM7OVZB7ZSaljGIr8YrM\r\nKZneruwR5kAj0LVJL/fwYyJ+nhXj6h8SuHGcvyBkDPb3GYqIzuxZcPaN0eGF\r\nwVeo5OCD9NOwvCZUvvXy91IQtcC0bwpiU9A0xnqo9fVIl2Q6jChjEZJlBsGr\r\ntDoWIfSfrscuuAf3jFp6SltU+Jt5Dicl8yr11elbuvzOE2cGLfR4UTWKv29O\r\nfaQrqwdUTpDijtery7rx5dr24WJ1ogiZ2RiiVfsZBFNorVEuN6bYCcPZoGmh\r\nIOFRuFOsfmrqDiNlVcw1x1s7Six/I9NmVjs=\r\n=dMnH\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"},"directories":{},"maintainers":[{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-epic-spinner-css_0.0.2_1650522836453_0.4478557245873278"},"_hasShrinkwrap":false},"0.0.3":{"name":"@achmadk/react-epic-spinner-css","description":"Reusable react implementation of epic-spinners","version":"0.0.3","main":"./index.js","module":"dist/react-epic-spinner-css.esm.js","browser":"dist/react-epic-spinner-css.umd.min.js","exports":{".":{"import":"./dist/react-epic-spinner-css.esm.js","require":"./index.js"},"./dist/react-epic-spinner-css.css":"./dist/react-epic-spinner-css.css"},"repository":{"type":"git","url":"git+ssh://git@github.com/achmadk/react-epic-spinner-css.git"},"author":{"name":"Achmad Kurnianto","email":"achmad.kurnianto@gmail.com"},"typings":"./typings/index.d.ts","license":"MIT","keywords":["react","epic spinners","spinners"],"sideEffects":false,"devDependencies":{"@babel/core":"^7.17.9","@babel/plugin-external-helpers":"^7.16.7","@babel/plugin-transform-runtime":"^7.17.0","@babel/preset-env":"^7.16.11","@babel/preset-react":"^7.16.7","@linaria/babel-preset":"3.0.0-beta.18","@linaria/rollup":"3.0.0-beta.18","@linaria/webpack-loader":"3.0.0-beta.18","@rollup/plugin-babel":"5.3.1","@rollup/plugin-commonjs":"21.1.0","@rollup/plugin-node-resolve":"13.2.1","@rollup/plugin-replace":"4.0.0","@storybook/addon-actions":"^6.4.22","@storybook/addon-essentials":"^6.4.22","@storybook/addon-links":"^6.4.22","@storybook/addons":"6.4.22","@storybook/preset-typescript":"3.0.0","@storybook/react":"^6.4.22","@storybook/theming":"6.4.22","@types/react":"^16.9.51","babel-loader":"^8.2.5","babel-plugin-transform-react-remove-prop-types":"0.4.24","fork-ts-checker-webpack-plugin":"7.2.6","prop-types":"^15.8.1","react":"^16.13.1","react-dom":"^16.13.1","react-is":"^16.13.1","rollup":"^2.70.2","rollup-plugin-css-only":"3.1.0","rollup-plugin-size-snapshot":"^0.12.0","rollup-plugin-terser":"7.0.2","ts-loader":"9.2.8","typescript":"4.6.3"},"dependencies":{"@linaria/core":"3.0.0-beta.18","@linaria/react":"3.0.0-beta.18","@linaria/shaker":"3.0.0-beta.18"},"peerDependencies":{"react":">=0.14.x","react-dom":">=0.14.x"},"scripts":{"build":"rollup -c","dev":"rollup -c -w","test":"jest","prepublish":"yarn build","storybook":"start-storybook -p 6006","build-storybook":"build-storybook"},"packageManager":"yarn@3.2.0","gitHead":"77c8805a18b8c2ef6338ba4173eb5bf9698ad527","bugs":{"url":"https://github.com/achmadk/react-epic-spinner-css/issues"},"homepage":"https://github.com/achmadk/react-epic-spinner-css#readme","_id":"@achmadk/react-epic-spinner-css@0.0.3","_nodeVersion":"16.14.2","_npmVersion":"8.7.0","dist":{"integrity":"sha512-gtGIIm41zntiEMnk2+v9wYhAiDyoKArOJ0WXZa8JK7JwZ713vWmvHxmNl9MoGQidQc7yrSrif9LH9PSbhZSQKA==","shasum":"ebfc5311404f0e2834ee60dae22b54fb552fa946","tarball":"https://registry.npmjs.org/@achmadk/react-epic-spinner-css/-/react-epic-spinner-css-0.0.3.tgz","fileCount":11,"unpackedSize":222433,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCh6ObGDJk8XWwbPrad59YUMGoozXF+6kIFTma6CFUeVgIhANJp4lIPC2X1jkT7gtWyk4NMGNxflOXPCqGcZHD/DQCB"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiYh0lACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqbKxAAl8kh4is2CvX9Z4CfmbWzxvEZB0kIm094FcCnZYS/AKJ/Jhf4\r\nUme9V7rddluzLDMSL9jiTQu4QwWOuOP90ASshF6ZYx/ujmoIQApIaoi0JcdP\r\n7iFExAuhXAzccPAXdGXQn2wYenB9La7Tp/ZC+rB1IIVSy41OUagIW5aiQRzl\r\niSuugaYyMMN5fp0fcxX1WjmtibBjeCRRER6TBFYSrsvxacwjdWMziliKk7g0\r\nNLmuX67xvXLXiyDowAUw/FawE/yoRN51egJKT5G7d+Y9ITVOoB/S0LtKXk4m\r\nUoOqL2QQs1QXBV/QJK1sM3hFNSSCy6wWdH//WoV/z/K7RE5n4BU9a3UniGlK\r\nnr3h4pQcQ3wMU9+ShUkrGAtp0L1NSy9M0CaCSQGKxtHcnQ5NZJZT1D/kYQe4\r\ny2CclkHAUsPlYuqgvnY9LgYF+zOet9Z36Xe+YsLTepsygDiz21PW1UyTOKGU\r\ngxEGV8OwPIMTlATMf4DC63gZT9jN8ENqMFlB7jizQWWJhcs1Pa1VOPNSQLTW\r\nrRzHr15BFJ8ghKkEHbIm27ETGtbinpYaZaaCUQEnvOa90pq3U4yBzNR/HGzx\r\nciGiwhxaCtZP4B/6hbf1xy2QqNAEqotN/pEiogpGJF7pclPugem/SGQ5ifZs\r\nFal/UwMOHGyE/fnQkH36NtldCDdd/O7c21g=\r\n=sa9r\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"},"directories":{},"maintainers":[{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-epic-spinner-css_0.0.3_1650597157520_0.6881033968262276"},"_hasShrinkwrap":false},"1.0.0":{"name":"@achmadk/react-epic-spinner-css","description":"Reusable react implementation of epic-spinners","version":"1.0.0","type":"module","main":"./dist/index.umd.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","repository":{"type":"git","url":"git+ssh://git@github.com/achmadk/react-epic-spinner-css.git"},"author":{"name":"Achmad Kurnianto","email":"achmad.kurnianto@gmail.com"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.umd.cjs"},"./dist/style.css":"./dist/style.css"},"scripts":{"dev":"vite","build":"vite build","lint":"eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0","preview":"vite preview"},"peerDependencies":{"react":"^17.0.0"},"devDependencies":{"@babel/preset-env":"^7.22.4","@babel/preset-react":"^7.22.3","@linaria/core":"^4.2.10","@linaria/react":"^4.3.8","@linaria/vite":"^4.2.11","@types/node":"^20.2.5","@types/react":"^18.2.8","@types/react-dom":"^18.2.4","@typescript-eslint/eslint-plugin":"^5.59.9","@typescript-eslint/parser":"^5.59.9","@vitejs/plugin-react-swc":"^3.3.2","eslint":"^8.42.0","eslint-plugin-react-hooks":"^4.6.0","eslint-plugin-react-refresh":"^0.4.1","react":"^18.2.0","react-dom":"^18.2.0","typescript":"^5.1.3","vite":"^4.3.9","vite-plugin-dts":"^2.3.0","vite-plugin-externalize-deps":"^0.6.0","vite-tsconfig-paths":"^4.2.0"},"license":"MIT","keywords":["react","epic spinners","spinners"],"sideEffects":false,"gitHead":"7ec50cd77fda488efc06e7dd64872a804442c0b6","bugs":{"url":"https://github.com/achmadk/react-epic-spinner-css/issues"},"homepage":"https://github.com/achmadk/react-epic-spinner-css#readme","_id":"@achmadk/react-epic-spinner-css@1.0.0","_nodeVersion":"18.16.0","_npmVersion":"8.11.0","dist":{"integrity":"sha512-o4ehG0IEoRiiS0k/pOBFCilVym+3iXe67Io/5odOVKoMHKf4MF42bgByZPx6YHD/TGAQZCBE9IqDNIxEJDok3Q==","shasum":"24aa6231b4bcc2fb76bc7e8d1f984f4ef0fb2bb9","tarball":"https://registry.npmjs.org/@achmadk/react-epic-spinner-css/-/react-epic-spinner-css-1.0.0.tgz","fileCount":31,"unpackedSize":115818,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEy+pVJ8VEkjkUWUY/EYyxthJs628X81CFBhS7l8CT+oAiBaKLZOnQI9IXtsDAbUIXeHywgUnORV2NZhIZwSGJzgHQ=="}]},"_npmUser":{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"},"directories":{},"maintainers":[{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-epic-spinner-css_1.0.0_1686109387307_0.20237188358139013"},"_hasShrinkwrap":false}},"time":{"created":"2022-04-21T05:49:45.354Z","0.0.1":"2022-04-21T05:49:45.543Z","modified":"2023-06-07T03:43:07.638Z","0.0.2":"2022-04-21T06:33:56.651Z","0.0.3":"2022-04-22T03:12:37.702Z","1.0.0":"2023-06-07T03:43:07.530Z"},"maintainers":[{"name":"achmadkurnianto","email":"achmad.kurnianto@gmail.com"}],"description":"Reusable react implementation of epic-spinners","homepage":"https://github.com/achmadk/react-epic-spinner-css#readme","keywords":["react","epic spinners","spinners"],"repository":{"type":"git","url":"git+ssh://git@github.com/achmadk/react-epic-spinner-css.git"},"author":{"name":"Achmad Kurnianto","email":"achmad.kurnianto@gmail.com"},"bugs":{"url":"https://github.com/achmadk/react-epic-spinner-css/issues"},"license":"MIT","readme":"# React Epic Spinner CSS\r\n\r\nThis library represents the React adaptation of [EpicMax's](https://github.com/epicmaxco/epic-spinners) Vue [epic-spinners](http://epic-spinners.epicmax.co/)\r\n\r\nCompared to `react-epic-spinners`, this library offers several advantages for professional use:\r\n1. Eliminates the need for the `styled-components` dependency, which can potentially cause issues in your web application due to multiple versions of `styled-components`.\r\n1. Features a smaller size, as each component's style, originally written in the CSS-in-JS paradigm, has been generated into a separate CSS file. Additionally, you can obtain an optimized CSS file for exclusive use with the spinner component by utilizing `postcss` and `purgecss`.\r\n1. Supports ref forwarding, allowing you to access the DOM of our components if required.\r\n\r\n## Installation\r\n\r\nUsing NPM\r\n\r\n```bash\r\nnpm install @achmadk/react-epic-spinner-css\r\n```\r\n\r\nOr Yarn\r\n\r\n```bash\r\nyarn add @achmadk/react-epic-spinner-css\r\n```\r\n\r\n## The transition from version `0.0.3` to `1.0.0`\r\n1. Update `react` to version 17.0.0, which incorporates support for hooks and allows importing from `react/jsx-runtime`\r\n2. Adjust the CSS file import method accordingly\r\n\r\n```diff\r\n- import from '@achmadk/react-epic-spinner-css/dist/react-epic-spinner-css.css'\r\n+ import from '@achmadk/react-epic-spinner-css/dist/style.css'\r\n```\r\n\r\n## Demo\r\n\r\nAn online demo is available [here](https://bondz.github.io/react-epic-spinners/)\r\n\r\n## Usage\r\n\r\nimport `react-epic-spinner-css.css` first\r\n\r\n```ts\r\nimport '@achmadk/react-epic-spinner-css/dist/style.css'\r\n```\r\n\r\nAll components inherit properties from the `<div>` element, such as `style`, `className`, `onClick`, and so on. There are optional props provided to customize ones:\r\n\r\n* `size` `[number]`: Determines the rendering size of the spinner.\r\n* `color` `[string]`: defaults to `#fff`. Defines the spinner's color.\r\n* `animationDelay` `[number]`: Indicates the spinner animation's duration. Lower values result in quicker animation restarts.\r\n\r\n### Examples\r\n\r\n```jsx\r\nimport { AtomSpinner } from '@achmadk/react-epic-spinner-css'\r\n\r\n// In your render function or SFC return\r\n<AtomSpinner color=\"red\">\r\n```\r\n\r\n## Components\r\n\r\n> All components are named exports of the package.\r\n\r\n```jsx\r\nimport { ... } from '@achmadk/react-epic-spinner-css'\r\n```\r\n\r\n* [AtomSpinner](/src/components/AtomSpinner.tsx)\r\n* [BreedingRhombusSpinner](/src/components/BreedingRhombusSpinner.tsx)\r\n* [CirclesToRhombusesSpinner](/src/components/CirclesToRhombusesSpinner.tsx)\r\n* [FingerprintSpinner](/src/components/FingerprintSpinner.tsx)\r\n* [FlowerSpinner](/src/components/FlowerSpinner.tsx)\r\n* [FulfillingBouncingCircleSpinner](/src/components/FulfillingBouncingCircleSpinner.tsx)\r\n* [FulfillingSquareSpinner](/src/components/FulfillingSquareSpinner.tsx)\r\n* [HalfCircleSpinner](/src/components/HalfCircleSpinner.tsx)\r\n* [HollowDotsSpinner](/src/components/HollowDotsSpinner.tsx)\r\n* [IntersectingCirclesSpinner](/src/components/IntersectingCirclesSpinner.tsx)\r\n* [LoopingRhombusesSpinner](/src/components/LoopingRhombusesSpinner.tsx)\r\n* [OrbitSpinner](/src/components/OrbitSpinner.tsx)\r\n* [PixelSpinner](/src/components/PixelSpinner.tsx)\r\n* [RadarSpinner](/src/components/RadarSpinner.tsx)\r\n* [ScalingSquaresSpinner](/src/components/ScalingSquaresSpinner.tsx)\r\n* [SelfBuildingSquareSpinner](/src/components/SelfBuildingSquareSpinner.tsx)\r\n* [SemipolarSpinner](/src/components/SemipolarSpinner.tsx)\r\n* [SpringSpinner](/src/components/SpringSpinner.tsx)\r\n* [SwappingSquaresSpinner](/src/components/SwappingSquaresSpinner.tsx)\r\n* [TrinityRingsSpinner](/src/components/TrinityRingsSpinner.tsx)\r\n\r\n### CSS Optimization\r\n\r\n1. install `@fullhuman/postcss-purgecss` and `postcss`\r\n\r\n  ```sh\r\n  yarn add -D @fullhuman/postcss-purgecss postcss\r\n  ```\r\n\r\n2. add `postcss.config.js` into your app root project\r\n\r\n```js\r\nconst purgecss = require('@fullhuman/postcss-purgecss')\r\n\r\nmodule.exports = {\r\n  plugins: [\r\n    // only optimize CSS when process.env.NODE_ENV is production\r\n    ...(process.env.NODE_ENV === 'production' ? [purgecss({\r\n      content: [\r\n        './**/*.js',\r\n        './**/*.jsx',\r\n        // if you are using TypeScript, please add this.\r\n        './**/*.ts',\r\n        './**/*.tsx'\r\n      ],\r\n      // include `@achmadk/react-epic-spinner-css` css file to be processed.\r\n      css: ['./node_modules/@achmadk/react-epic-spinner-css/dist/*.css'],\r\n      // remove unused CSS keyframe definitions\r\n      keyframes: true,\r\n      safelist: {\r\n        greedy: [\r\n          // if you are using AtomSpinner, you can add /^atom-spinner/ .\r\n          // in this case, i am using SpringSpinner component\r\n          /^spring-spinner/\r\n        ]\r\n      }\r\n    })] : [])\r\n  ]\r\n}\r\n\r\n```\r\n\r\n### Known Issues\r\n\r\nBecause of some bugs with `flexbox` on Firefox, the following components may not render properly\r\n\r\n* ScalingSquaresSpinner\r\n* SwappingSquaresSpinner\r\n* TrinityRingsSpinner\r\n\r\nIf you know a fix for it, please send a PR :)\r\n\r\n### To-do List Improvements\r\n[x] Storybook (WIP)\r\n[ ] unit testing with `jest` and `@testing-library/*`\r\n\r\n## License\r\n\r\n[MIT](LICENSE).\r\n","readmeFilename":"README.md"}