v1.0

Author: bplok20010

.gitignore

@@ -0,0 +1,5 @@
+/node_modules
+/lib
+/cjs
+/esm
+/dist

.prettierignore

@@ -0,0 +1 @@
+*.md

.prettierrc

@@ -0,0 +1,18 @@
+{
+	"arrowParens": "always",
+	"bracketSpacing": true,
+	"endOfLine": "auto",
+	"htmlWhitespaceSensitivity": "css",
+	"insertPragma": false,
+	"jsxBracketSameLine": false,
+	"jsxSingleQuote": false,
+	"printWidth": 100,
+	"proseWrap": "preserve",
+	"quoteProps": "as-needed",
+	"requirePragma": false,
+	"semi": true,
+	"singleQuote": false,
+	"tabWidth": 4,
+	"trailingComma": "es5",
+	"useTabs": true
+}

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 nobo react-widget-spinner
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1 +1,128 @@
-# react-widget-spinner
+# react-widget-spinner
+
+
+## 安装
+
+```
+npm install --save react-widget-spinner
+```
+
+## 使用
+
+[![Edit react-widget-spinner](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/white-fog-smdx6?fontsize=14&hidenavigation=1&theme=dark)
+
+```js
+import Spinner from 'react-widget-spinner';
+import 'react-widget-spinner/style';
+
+<Spinner />;
+
+```
+
+### Interfaces
+
+```ts
+declare const sizeMap: {
+    small: number;
+    default: number;
+    medium: number;
+    large: number;
+};
+export interface SpinnerProps extends React.HTMLAttributes<any> {
+    /** 样式前缀 */
+    prefixCls?: string;
+    /** 组件大小 */
+    size?: keyof typeof sizeMap | number;
+    /** TODO: 延迟显示加载效果的时间 ms */
+    delay?: number;
+    /** 圈圈周长：0-1 */
+    value?: number;
+    /** 风格，默认：primary */
+    type?: "none" | "primary" | "success" | "warning" | "danger";
+    /** 边框大小 */
+    strokeWidth?: number;
+    /** 是否为加载中状态 */
+    spinning?: boolean;
+    tagName?: React.ElementType;
+}
+export declare const Spinner: React.FC<SpinnerProps>;
+export default Spinner;
+
+```
+
+### defaultProps
+
+```js
+{
+	prefixCls: "rw-spinner",
+	size: "default",
+	type: "primary",
+	spinning: true,
+	tagName: "div",
+	value: 0.25,
+}
+```
+
+### 基础样式
+
+```css
+@keyframes rw-spinner-animation {
+    from {
+        transform: rotate(0deg);
+    }
+    to {
+        transform: rotate(360deg);
+    }
+}
+
+.rw-spinner {
+    display: none;
+    align-items: center;
+    justify-content: center;
+
+    overflow: visible;
+    vertical-align: middle;
+
+    transition: color 500ms linear;
+}
+
+.rw-spinner-spinning {
+    display: inline-flex;
+}
+
+.rw-spinner-primary {
+    color: #1890ff;
+}
+.rw-spinner-success {
+    color: #52c41a;
+}
+.rw-spinner-warning {
+    color: #faad14;
+}
+.rw-spinner-danger {
+    color: #ff4d4f;
+}
+
+.rw-spinner svg {
+    display: block;
+}
+
+.rw-spinner path {
+    fill-opacity: 0;
+}
+
+.rw-spinner-head {
+    transform-origin: center;
+    transition: stroke-dashoffset 200ms cubic-bezier(0.4, 1, 0.75, 0.9);
+    stroke-linecap: round;
+}
+
+.rw-spinner-track {
+    stroke: rgba(92, 112, 128, 0.2);
+}
+
+.rw-spinner .rw-spinner-animation {
+    animation: rw-spinner-animation 500ms linear infinite;
+}
+
+```

babel.config.js

@@ -0,0 +1,15 @@
+module.exports = api => {
+	const isTest = api.env("test");
+	if (!isTest) return {};
+
+	return {
+		presets: [
+			[
+				"babel-preset-packez",
+				{
+					modules: "cjs",
+				},
+			],
+		],
+	};
+};

docs/asset-manifest.json

@@ -0,0 +1,7 @@
+{
+  "index.css": "static/css/index.a48f4805.chunk.css",
+  "index.js": "static/js/index.a48f4805.chunk.js",
+  "runtime-index.js": "static/js/runtime-index.92eae014.js",
+  "static/js/2.fde574d2.chunk.js": "static/js/2.fde574d2.chunk.js",
+  "index.html": "index.html"
+}

docs/index.html

@@ -0,0 +1 @@
+<!doctype html><html><head><meta charset="utf-8"/><title>Spinner</title><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1"/><style>.demo{width:80%;margin:100px auto;background:#fff;font-size:12px;overflow:auto}</style><link href="static/css/index.a48f4805.chunk.css" rel="stylesheet"></head><body style="background:#f5f5f5"><div class="demo" id="demo"></div><script src="static/js/runtime-index.92eae014.js"></script><script src="static/js/2.fde574d2.chunk.js"></script><script src="static/js/index.a48f4805.chunk.js"></script></body></html>