@microui-kit/circle-progress 0.0.2-dev-1 → 1.0.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/chunk-XXGA7ZNM.mjs +1 -0
- package/dist/index.js +1 -110
- package/dist/index.mjs +1 -38
- package/dist/styles.js +1 -71
- package/dist/styles.mjs +1 -7
- package/dist/types.d.ts +4 -4
- package/dist/types.js +1 -19
- package/dist/types.mjs +0 -1
- package/package.json +6 -19
- package/dist/chunk-KEFKFLY7.mjs +0 -50
@@ -0,0 +1 @@
|
|
1
|
+
var i=({theme:t,renderer:r,size:e=24,color:s})=>{let a=()=>({"100%":{transform:"rotate(360deg)"}}),o=()=>({"0%":{strokeDasharray:"1,200",strokeDashoffset:0},"50%":{strokeDasharray:"89,200",strokeDashoffset:-35},"100%":{strokeDasharray:"89,200",strokeDashoffset:-124}}),n=r.renderKeyframe(a),f=r.renderKeyframe(o);return{wrapper:{height:`${e}px`,transformOrigin:"center center",width:`${e}px`,animation:`${n} 2s linear infinite`},circle:{strokeDasharray:"150,200",strokeDashoffset:-10,strokeLinecap:"round",stroke:s||t.colors.base,animation:`${f} 1.5s ease-in-out infinite`}}};export{i as a};
|
package/dist/index.js
CHANGED
@@ -1,110 +1 @@
|
|
1
|
-
"use
|
2
|
-
"use strict";
|
3
|
-
var __create = Object.create;
|
4
|
-
var __defProp = Object.defineProperty;
|
5
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
6
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
7
|
-
var __getProtoOf = Object.getPrototypeOf;
|
8
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
9
|
-
var __export = (target, all) => {
|
10
|
-
for (var name in all)
|
11
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
12
|
-
};
|
13
|
-
var __copyProps = (to, from, except, desc) => {
|
14
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
15
|
-
for (let key of __getOwnPropNames(from))
|
16
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
17
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
18
|
-
}
|
19
|
-
return to;
|
20
|
-
};
|
21
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
22
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
23
|
-
mod
|
24
|
-
));
|
25
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
26
|
-
|
27
|
-
// src/index.tsx
|
28
|
-
var src_exports = {};
|
29
|
-
__export(src_exports, {
|
30
|
-
default: () => src_default
|
31
|
-
});
|
32
|
-
module.exports = __toCommonJS(src_exports);
|
33
|
-
var import_classnames = __toESM(require("classnames"));
|
34
|
-
var import_with_styles = require("@microui-kit/with-styles");
|
35
|
-
|
36
|
-
// src/styles.ts
|
37
|
-
var styles_default = ({
|
38
|
-
theme,
|
39
|
-
renderer,
|
40
|
-
size = 24,
|
41
|
-
color
|
42
|
-
}) => {
|
43
|
-
const rotateKeyframe = () => ({
|
44
|
-
"100%": {
|
45
|
-
transform: "rotate(360deg)"
|
46
|
-
}
|
47
|
-
});
|
48
|
-
const dashKeyframe = () => ({
|
49
|
-
"0%": {
|
50
|
-
strokeDasharray: "1,200",
|
51
|
-
strokeDashoffset: 0
|
52
|
-
},
|
53
|
-
"50%": {
|
54
|
-
strokeDasharray: "89,200",
|
55
|
-
strokeDashoffset: -35
|
56
|
-
},
|
57
|
-
"100%": {
|
58
|
-
strokeDasharray: "89,200",
|
59
|
-
strokeDashoffset: -124
|
60
|
-
}
|
61
|
-
});
|
62
|
-
const rotateEffect = renderer.renderKeyframe(rotateKeyframe);
|
63
|
-
const dashEffect = renderer.renderKeyframe(dashKeyframe);
|
64
|
-
return {
|
65
|
-
wrapper: {
|
66
|
-
height: `${size}px`,
|
67
|
-
transformOrigin: "center center",
|
68
|
-
width: `${size}px`,
|
69
|
-
animation: `${rotateEffect} 2s linear infinite`
|
70
|
-
},
|
71
|
-
circle: {
|
72
|
-
strokeDasharray: "150,200",
|
73
|
-
strokeDashoffset: -10,
|
74
|
-
strokeLinecap: "round",
|
75
|
-
stroke: color || theme.colors.base,
|
76
|
-
animation: `${dashEffect} 1.5s ease-in-out infinite`
|
77
|
-
}
|
78
|
-
};
|
79
|
-
};
|
80
|
-
|
81
|
-
// src/index.tsx
|
82
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
83
|
-
var CircleProgress = ({
|
84
|
-
prefixCls = "micro-circle-progress",
|
85
|
-
className,
|
86
|
-
classes = {},
|
87
|
-
thickness = 3.6
|
88
|
-
}) => {
|
89
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
90
|
-
"svg",
|
91
|
-
{
|
92
|
-
className: (0, import_classnames.default)(prefixCls, className, classes.wrapper),
|
93
|
-
viewBox: "25 25 50 50",
|
94
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
95
|
-
"circle",
|
96
|
-
{
|
97
|
-
className: (0, import_classnames.default)(classes.circle),
|
98
|
-
cx: "50",
|
99
|
-
cy: "50",
|
100
|
-
r: "20",
|
101
|
-
fill: "none",
|
102
|
-
"stroke-width": thickness
|
103
|
-
}
|
104
|
-
)
|
105
|
-
}
|
106
|
-
);
|
107
|
-
};
|
108
|
-
var src_default = (0, import_with_styles.withStyles)(styles_default)(CircleProgress);
|
109
|
-
// Annotate the CommonJS export names for ESM import in node:
|
110
|
-
0 && (module.exports = {});
|
1
|
+
"use strict";var y=Object.create;var a=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var P=Object.getPrototypeOf,d=Object.prototype.hasOwnProperty;var C=(r,e)=>{for(var s in e)a(r,s,{get:e[s],enumerable:!0})},f=(r,e,s,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of k(e))!d.call(r,o)&&o!==s&&a(r,o,{get:()=>e[o],enumerable:!(t=g(e,o))||t.enumerable});return r};var D=(r,e,s)=>(s=r!=null?y(P(r)):{},f(e||!r||!r.__esModule?a(s,"default",{value:r,enumerable:!0}):s,r)),w=r=>f(a({},"__esModule",{value:!0}),r);var K={};C(K,{default:()=>x});module.exports=w(K);var i=D(require("classnames")),m=require("@microui-kit/with-styles");var n=({theme:r,renderer:e,size:s=24,color:t})=>{let o=()=>({"100%":{transform:"rotate(360deg)"}}),l=()=>({"0%":{strokeDasharray:"1,200",strokeDashoffset:0},"50%":{strokeDasharray:"89,200",strokeDashoffset:-35},"100%":{strokeDasharray:"89,200",strokeDashoffset:-124}}),p=e.renderKeyframe(o),h=e.renderKeyframe(l);return{wrapper:{height:`${s}px`,transformOrigin:"center center",width:`${s}px`,animation:`${p} 2s linear infinite`},circle:{strokeDasharray:"150,200",strokeDashoffset:-10,strokeLinecap:"round",stroke:t||r.colors.base,animation:`${h} 1.5s ease-in-out infinite`}}};var c=require("react/jsx-runtime"),u=({prefixCls:r="micro-circle-progress",className:e,classes:s={},thickness:t=3.6})=>(0,c.jsx)("svg",{className:(0,i.default)(r,e,s.wrapper),viewBox:"25 25 50 50",children:(0,c.jsx)("circle",{className:(0,i.default)(s.circle),cx:"50",cy:"50",r:"20",fill:"none","stroke-width":t})}),x=(0,m.withStyles)(n)(u);0&&(module.exports={});
|
package/dist/index.mjs
CHANGED
@@ -1,38 +1 @@
|
|
1
|
-
"
|
2
|
-
import {
|
3
|
-
styles_default
|
4
|
-
} from "./chunk-KEFKFLY7.mjs";
|
5
|
-
|
6
|
-
// src/index.tsx
|
7
|
-
import classNames from "classnames";
|
8
|
-
import { withStyles } from "@microui-kit/with-styles";
|
9
|
-
import { jsx } from "react/jsx-runtime";
|
10
|
-
var CircleProgress = ({
|
11
|
-
prefixCls = "micro-circle-progress",
|
12
|
-
className,
|
13
|
-
classes = {},
|
14
|
-
thickness = 3.6
|
15
|
-
}) => {
|
16
|
-
return /* @__PURE__ */ jsx(
|
17
|
-
"svg",
|
18
|
-
{
|
19
|
-
className: classNames(prefixCls, className, classes.wrapper),
|
20
|
-
viewBox: "25 25 50 50",
|
21
|
-
children: /* @__PURE__ */ jsx(
|
22
|
-
"circle",
|
23
|
-
{
|
24
|
-
className: classNames(classes.circle),
|
25
|
-
cx: "50",
|
26
|
-
cy: "50",
|
27
|
-
r: "20",
|
28
|
-
fill: "none",
|
29
|
-
"stroke-width": thickness
|
30
|
-
}
|
31
|
-
)
|
32
|
-
}
|
33
|
-
);
|
34
|
-
};
|
35
|
-
var src_default = withStyles(styles_default)(CircleProgress);
|
36
|
-
export {
|
37
|
-
src_default as default
|
38
|
-
};
|
1
|
+
import{a as o}from"./chunk-XXGA7ZNM.mjs";import s from"classnames";import{withStyles as m}from"@microui-kit/with-styles";import{jsx as e}from"react/jsx-runtime";var t=({prefixCls:c="micro-circle-progress",className:i,classes:r={},thickness:l=3.6})=>e("svg",{className:s(c,i,r.wrapper),viewBox:"25 25 50 50",children:e("circle",{className:s(r.circle),cx:"50",cy:"50",r:"20",fill:"none","stroke-width":l})}),g=m(o)(t);export{g as default};
|
package/dist/styles.js
CHANGED
@@ -1,71 +1 @@
|
|
1
|
-
"use
|
2
|
-
"use strict";
|
3
|
-
var __defProp = Object.defineProperty;
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
7
|
-
var __export = (target, all) => {
|
8
|
-
for (var name in all)
|
9
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
10
|
-
};
|
11
|
-
var __copyProps = (to, from, except, desc) => {
|
12
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
13
|
-
for (let key of __getOwnPropNames(from))
|
14
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
15
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
16
|
-
}
|
17
|
-
return to;
|
18
|
-
};
|
19
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
20
|
-
|
21
|
-
// src/styles.ts
|
22
|
-
var styles_exports = {};
|
23
|
-
__export(styles_exports, {
|
24
|
-
default: () => styles_default
|
25
|
-
});
|
26
|
-
module.exports = __toCommonJS(styles_exports);
|
27
|
-
var styles_default = ({
|
28
|
-
theme,
|
29
|
-
renderer,
|
30
|
-
size = 24,
|
31
|
-
color
|
32
|
-
}) => {
|
33
|
-
const rotateKeyframe = () => ({
|
34
|
-
"100%": {
|
35
|
-
transform: "rotate(360deg)"
|
36
|
-
}
|
37
|
-
});
|
38
|
-
const dashKeyframe = () => ({
|
39
|
-
"0%": {
|
40
|
-
strokeDasharray: "1,200",
|
41
|
-
strokeDashoffset: 0
|
42
|
-
},
|
43
|
-
"50%": {
|
44
|
-
strokeDasharray: "89,200",
|
45
|
-
strokeDashoffset: -35
|
46
|
-
},
|
47
|
-
"100%": {
|
48
|
-
strokeDasharray: "89,200",
|
49
|
-
strokeDashoffset: -124
|
50
|
-
}
|
51
|
-
});
|
52
|
-
const rotateEffect = renderer.renderKeyframe(rotateKeyframe);
|
53
|
-
const dashEffect = renderer.renderKeyframe(dashKeyframe);
|
54
|
-
return {
|
55
|
-
wrapper: {
|
56
|
-
height: `${size}px`,
|
57
|
-
transformOrigin: "center center",
|
58
|
-
width: `${size}px`,
|
59
|
-
animation: `${rotateEffect} 2s linear infinite`
|
60
|
-
},
|
61
|
-
circle: {
|
62
|
-
strokeDasharray: "150,200",
|
63
|
-
strokeDashoffset: -10,
|
64
|
-
strokeLinecap: "round",
|
65
|
-
stroke: color || theme.colors.base,
|
66
|
-
animation: `${dashEffect} 1.5s ease-in-out infinite`
|
67
|
-
}
|
68
|
-
};
|
69
|
-
};
|
70
|
-
// Annotate the CommonJS export names for ESM import in node:
|
71
|
-
0 && (module.exports = {});
|
1
|
+
"use strict";var o=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var m=(e,r)=>{for(var t in r)o(e,t,{get:r[t],enumerable:!0})},y=(e,r,t,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let s of h(r))!k.call(e,s)&&s!==t&&o(e,s,{get:()=>r[s],enumerable:!(a=c(r,s))||a.enumerable});return e};var p=e=>y(o({},"__esModule",{value:!0}),e);var D={};m(D,{default:()=>l});module.exports=p(D);var l=({theme:e,renderer:r,size:t=24,color:a})=>{let s=()=>({"100%":{transform:"rotate(360deg)"}}),n=()=>({"0%":{strokeDasharray:"1,200",strokeDashoffset:0},"50%":{strokeDasharray:"89,200",strokeDashoffset:-35},"100%":{strokeDasharray:"89,200",strokeDashoffset:-124}}),f=r.renderKeyframe(s),i=r.renderKeyframe(n);return{wrapper:{height:`${t}px`,transformOrigin:"center center",width:`${t}px`,animation:`${f} 2s linear infinite`},circle:{strokeDasharray:"150,200",strokeDashoffset:-10,strokeLinecap:"round",stroke:a||e.colors.base,animation:`${i} 1.5s ease-in-out infinite`}}};0&&(module.exports={});
|
package/dist/styles.mjs
CHANGED
package/dist/types.d.ts
CHANGED
@@ -1,10 +1,10 @@
|
|
1
1
|
import { FCWithStylesProps } from '@microui-kit/types';
|
2
2
|
export { Style, Styles } from '@microui-kit/types';
|
3
3
|
|
4
|
-
interface CircleProgressProps extends FCWithStylesProps {
|
5
|
-
size?: number;
|
6
|
-
thickness?: number;
|
7
|
-
color?: string;
|
4
|
+
interface CircleProgressProps extends FCWithStylesProps {
|
5
|
+
size?: number;
|
6
|
+
thickness?: number;
|
7
|
+
color?: string;
|
8
8
|
}
|
9
9
|
|
10
10
|
export { CircleProgressProps };
|
package/dist/types.js
CHANGED
@@ -1,19 +1 @@
|
|
1
|
-
"use
|
2
|
-
"use strict";
|
3
|
-
var __defProp = Object.defineProperty;
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
7
|
-
var __copyProps = (to, from, except, desc) => {
|
8
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
9
|
-
for (let key of __getOwnPropNames(from))
|
10
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
11
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
12
|
-
}
|
13
|
-
return to;
|
14
|
-
};
|
15
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
16
|
-
|
17
|
-
// src/types.ts
|
18
|
-
var types_exports = {};
|
19
|
-
module.exports = __toCommonJS(types_exports);
|
1
|
+
"use strict";var i=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var n=(t,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of p(e))!y.call(t,r)&&r!==o&&i(t,r,{get:()=>e[r],enumerable:!(s=l(e,r))||s.enumerable});return t};var S=t=>n(i({},"__esModule",{value:!0}),t);var c={};module.exports=S(c);
|
package/dist/types.mjs
CHANGED
@@ -1 +0,0 @@
|
|
1
|
-
"use client";
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@microui-kit/circle-progress",
|
3
|
-
"version": "0.0
|
3
|
+
"version": "1.0.0",
|
4
4
|
"description": "",
|
5
5
|
"keywords": [],
|
6
6
|
"author": "",
|
@@ -32,28 +32,15 @@
|
|
32
32
|
"postpublish": "node ../../../scripts/postpublish.js"
|
33
33
|
},
|
34
34
|
"dependencies": {
|
35
|
-
"@microui-kit/types": "0.0.2-dev-
|
36
|
-
"@microui-kit/with-styles": "0.0.2-dev-3"
|
37
|
-
"classnames": "^2.5.1"
|
35
|
+
"@microui-kit/types": "0.0.2-dev-10",
|
36
|
+
"@microui-kit/with-styles": "0.0.2-dev-3"
|
38
37
|
},
|
39
38
|
"peerDependencies": {
|
40
|
-
"react": ">=18"
|
39
|
+
"react": ">=18",
|
40
|
+
"react-dom": ">=18",
|
41
|
+
"classnames": "2.5.1"
|
41
42
|
},
|
42
43
|
"clean-package": "../../../clean-package.config.json",
|
43
|
-
"tsup": {
|
44
|
-
"clean": true,
|
45
|
-
"target": "es2019",
|
46
|
-
"format": [
|
47
|
-
"cjs",
|
48
|
-
"esm"
|
49
|
-
],
|
50
|
-
"banner": {
|
51
|
-
"js": "\"use client\";"
|
52
|
-
},
|
53
|
-
"external": [
|
54
|
-
"classnames"
|
55
|
-
]
|
56
|
-
},
|
57
44
|
"module": "dist/index.mjs",
|
58
45
|
"types": "dist/index.d.ts",
|
59
46
|
"exports": {
|
package/dist/chunk-KEFKFLY7.mjs
DELETED
@@ -1,50 +0,0 @@
|
|
1
|
-
"use client";
|
2
|
-
|
3
|
-
// src/styles.ts
|
4
|
-
var styles_default = ({
|
5
|
-
theme,
|
6
|
-
renderer,
|
7
|
-
size = 24,
|
8
|
-
color
|
9
|
-
}) => {
|
10
|
-
const rotateKeyframe = () => ({
|
11
|
-
"100%": {
|
12
|
-
transform: "rotate(360deg)"
|
13
|
-
}
|
14
|
-
});
|
15
|
-
const dashKeyframe = () => ({
|
16
|
-
"0%": {
|
17
|
-
strokeDasharray: "1,200",
|
18
|
-
strokeDashoffset: 0
|
19
|
-
},
|
20
|
-
"50%": {
|
21
|
-
strokeDasharray: "89,200",
|
22
|
-
strokeDashoffset: -35
|
23
|
-
},
|
24
|
-
"100%": {
|
25
|
-
strokeDasharray: "89,200",
|
26
|
-
strokeDashoffset: -124
|
27
|
-
}
|
28
|
-
});
|
29
|
-
const rotateEffect = renderer.renderKeyframe(rotateKeyframe);
|
30
|
-
const dashEffect = renderer.renderKeyframe(dashKeyframe);
|
31
|
-
return {
|
32
|
-
wrapper: {
|
33
|
-
height: `${size}px`,
|
34
|
-
transformOrigin: "center center",
|
35
|
-
width: `${size}px`,
|
36
|
-
animation: `${rotateEffect} 2s linear infinite`
|
37
|
-
},
|
38
|
-
circle: {
|
39
|
-
strokeDasharray: "150,200",
|
40
|
-
strokeDashoffset: -10,
|
41
|
-
strokeLinecap: "round",
|
42
|
-
stroke: color || theme.colors.base,
|
43
|
-
animation: `${dashEffect} 1.5s ease-in-out infinite`
|
44
|
-
}
|
45
|
-
};
|
46
|
-
};
|
47
|
-
|
48
|
-
export {
|
49
|
-
styles_default
|
50
|
-
};
|