Added more loaders

Author: amareshsm

.eslintrc.json

@@ -1,32 +1,29 @@
 {
-    "env": {
-        "browser": true,
-        "es2020": true
+  "env": {
+    "browser": true,
+    "es2020": true
+  },
+  "extends": [
+    "plugin:react/recommended",
+    "plugin:jest/recommended",
+    "standard",
+    "prettier"
+  ],
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true
     },
-    "extends": [
-        "plugin:react/recommended",
-        "plugin:jest/recommended",
-        "standard",
-        "prettier"
-    ],
-    "parserOptions": {
-        "ecmaFeatures": {
-            "jsx": true
-        },
-        "ecmaVersion": 11,
-        "sourceType": "module"
-    },
-    "plugins": [
-        "react",
-        "prettier"
-    ],
-    "rules": {
-        "prettier/prettier": "error",
-        "no-console": 1
-    },
-    "settings": {
-        "react": {
-            "version": "detect"
-        }
+    "ecmaVersion": 11,
+    "sourceType": "module"
+  },
+  "plugins": ["react", "prettier"],
+  "rules": {
+    "prettier/prettier": "error",
+    "no-console": 1
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
     }
-}
+  }
+}

package-lock.json

@@ -5,11 +5,14 @@
   "main": "dist/bundle.cjs.js",
   "module": "dist/bundle.esm.js",
   "sideEffects": false,
+  "files": [
+    "dist"
+  ],
   "scripts": {
     "prebuild": "rimraf dist",
     "build": "rollup -c",
-    "format": "eslint **/*.js  && prettier **/*.js",
-    "format:fix": "eslint **/*.js --fix && prettier **/*.js --write",
+    "format": "eslint \"**/*.{js,jsx}\"  && prettier \"**/*.js\"",
+    "format:fix": "eslint \"**/*.js\" --fix && prettier \"**/*.js\" --write",
     "storybook": "start-storybook -p 9001 -c storybook",
     "storybook:build": "build-storybook  -c storybook",
     "test": "jest",
@@ -18,7 +21,8 @@
     "test:coveralls": "jest --coverage && coveralls < coverage/lcov.info",
     "test:staged": "jest --findRelatedTests",
     "predeploy": "npm run storybook:build",
-    "deploy": "gh-pages -d storybook-static"
+    "deploy": "gh-pages -d storybook-static",
+    "prepublishOnly": "npm run build"
   },
   "husky": {
     "hooks": {
@@ -46,7 +50,7 @@
   "bugs": {
     "url": "https://github.com/amareshsm/react-spinner-css/issues"
   },
-  "homepage": "https://github.com/amareshsm/react-spinner-css#readme",
+  "homepage": "https://amareshsm.github.io/react-spinner-css/",
   "devDependencies": {
     "@babel/core": "^7.10.5",
     "@babel/preset-env": "^7.10.4",
@@ -57,6 +61,7 @@
     "babel-core": "^7.0.0-bridge.0",
     "babel-jest": "^26.1.0",
     "babel-loader": "^8.1.0",
+    "coveralls": "^3.1.0",
     "eslint": "^7.5.0",
     "eslint-config-prettier": "^6.11.0",
     "eslint-config-standard": "^14.1.1",

package.json

@@ -1,29 +1,10 @@
-* {
-    padding: 0px;
-    margin: 0px;
-    box-sizing: border-box;
-}
-
-.loader-div {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    height: 300px;
-    width: 380px;
-    margin: 8px;
-    border-radius: 4px;
-}
-.loader-div.one {
-    background-color: lightyellow;
-}
-
 .loader1 {
-    width: 90px;
-    height: 90px;
-    border-top: 4px solid blue;
+    width: 60px;
+    height: 60px;
+    border-top: 4px solid black;
     border-radius: 100%;
     animation: spin 2s linear infinite;
+    box-sizing: border-box;
 }
 
 @keyframes spin {

src/Components/Loader1/style.css

@@ -0,0 +1,15 @@
+import React from 'react'
+import styles from './style.css'
+const Loader10 = (props) => (
+  <>
+    <style>{`${styles}`}</style>
+    <div className="loader-div ten">
+      <div className="loader10">
+        <div className="circle-1"></div>
+        <div className="circle-2"></div>
+      </div>
+    </div>
+  </>
+)
+
+export default Loader10

src/Components/Loader10/Loader.js

@@ -0,0 +1,7 @@
+import React from 'react'
+import renderer from 'react-test-renderer'
+import { Loader10 } from '.'
+it('renders correctly', () => {
+  const tree = renderer.create(<Loader10 />).toJSON()
+  expect(tree).toMatchSnapshot()
+})