feat: boxloading和CircleLoading新增speed

.gitignore

@@ -11,7 +11,7 @@
 # production
 /dist
 /storybook-static
-
+/lib
 # misc
 .DS_Store
 .env.local

README.md

@@ -27,9 +27,9 @@ import { BoxLoading } from 'react-loadingg'
 | 组件   | color| speed | style | 
 |  ----  | ----  | ---- |---- |
 | BlockLoading  | ✅ | ✅  | ✅ |
-| BoxLoading  | ✅ | 🚧  | ✅ |
+| BoxLoading  | ✅ | ✅  | ✅ |
 | BlockReserveLoading  | ✅ | ✅  | ✅ |
-| CircleLoading  | ✅ | 🚧  | ✅ |
+| CircleLoading  | ✅ | ✅  | ✅ |
 | CircleToBlockLoading  | ✅ | 🚧 | ✅ |
 | CommonLoading  | ✅ |  🚧 | ✅ |
 | DisappearedLoading  | ✅ | ✅  | ✅ |

src/components/BoxLoading/index.js

@@ -14,24 +14,24 @@ const LoadContainer = styled.div`
       top: 59px;
       left: 0;
       border-radius: 50%;
-      animation: ${animate} 0.5s linear infinite;
+      animation: ${animate} ${props => props.speed || 0.5}s linear infinite;
     }
     &:after {
       content: '';
       width: 50px;
       height: 50px;
       background: ${props => props.color || '#00adb5'};
-      animation: ${shadow} 0.5s linear infinite;
+      animation: ${shadow} ${props => props.speed || 0.5}s linear infinite;
       position: absolute;
       top: 0;
       left: 0;
       border-radius: 3px;
     }
 `;
 
-const BoxLoading = ({ style, color }) => {
+const BoxLoading = ({ style, color, speed }) => {
   return (
-    <LoadContainer style={style} color={color}></LoadContainer>
+    <LoadContainer style={style} color={color} speed={speed}></LoadContainer>
   );
 };
 

src/components/CircleLoading/index.js

@@ -36,7 +36,7 @@ const LoadingContainer = styled.div`
     bottom: 50%;
     z-index: 1;
     transform-origin: left bottom;
-    animation: ${animate} 1.5s infinite linear;
+    animation: ${animate} ${props => props.speed || 1}s infinite linear;
   }
   &::after {
     content: '';
@@ -54,9 +54,9 @@ const LoadingContainer = styled.div`
   }
 `;
 
-const CircleLoading = ({ style, color, inColor }) => {
+const CircleLoading = ({ style, color, inColor, speed }) => {
   return (
-    <LoadingContainer style={style} color={color} inColor={inColor} />
+    <LoadingContainer style={style} color={color} inColor={inColor} speed={speed} />
   );
 };
 

webpack.config.js

@@ -85,7 +85,7 @@ module.exports = function(webpackEnv) {
     // dist is a common output folder, and it should be gitignored. The build can
     // be run after publishing so you don't wind up with it in source control
     output: {
-      path: path.resolve(__dirname, 'dist/'),
+      path: path.resolve(__dirname, 'lib/'),
       publicPath: '',
       // You can do fun things here like use the [hash] keyword to generate unique
       // filenames, but for this purpose hui.js is fine. This file and path will