wssf-kage-ui 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +75 -0
- package/dist/cjs/Button/index.d.ts +24 -0
- package/dist/cjs/Button/index.js +48 -0
- package/dist/cjs/Button/style.less +138 -0
- package/dist/cjs/index.d.ts +2 -0
- package/dist/cjs/index.js +12 -0
- package/dist/esm/Button/index.d.ts +24 -0
- package/dist/esm/Button/index.js +42 -0
- package/dist/esm/Button/style.less +138 -0
- package/dist/esm/index.d.ts +2 -0
- package/dist/esm/index.js +4 -0
- package/package.json +69 -0
package/README.md
ADDED
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
# Kage UI
|
|
2
|
+
|
|
3
|
+
🎨 一个现代化的 React 组件库，优雅且高效。
|
|
4
|
+
|
|
5
|
+
## ✨ 特性
|
|
6
|
+
|
|
7
|
+
- 📦 开箱即用的高质量 React 组件
|
|
8
|
+
- 💎 使用 TypeScript 开发，提供完整的类型定义
|
|
9
|
+
- 🎨 支持主题定制
|
|
10
|
+
- 🚀 支持 Tree Shaking，按需加载
|
|
11
|
+
|
|
12
|
+
## 📦 安装
|
|
13
|
+
|
|
14
|
+
```bash
|
|
15
|
+
npm install kage-ui
|
|
16
|
+
# 或
|
|
17
|
+
yarn add kage-ui
|
|
18
|
+
# 或
|
|
19
|
+
pnpm add kage-ui
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## 🔨 使用
|
|
23
|
+
|
|
24
|
+
```tsx
|
|
25
|
+
import { Button } from 'kage-ui';
|
|
26
|
+
|
|
27
|
+
function App() {
|
|
28
|
+
return <Button type="primary">Hello Kage UI</Button>;
|
|
29
|
+
}
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
## 🛠️ 开发
|
|
33
|
+
|
|
34
|
+
```bash
|
|
35
|
+
# 安装依赖
|
|
36
|
+
npm install
|
|
37
|
+
|
|
38
|
+
# 启动文档开发服务器
|
|
39
|
+
npm start
|
|
40
|
+
|
|
41
|
+
# 构建组件库
|
|
42
|
+
npm run build
|
|
43
|
+
|
|
44
|
+
# 构建文档站点
|
|
45
|
+
npm run docs:build
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
## 📁 目录结构
|
|
49
|
+
|
|
50
|
+
```
|
|
51
|
+
kage-ui/
|
|
52
|
+
├── docs/ # 文档目录
|
|
53
|
+
│ ├── index.md # 首页
|
|
54
|
+
│ └── guide.md # 指南
|
|
55
|
+
├── src/ # 组件源码
|
|
56
|
+
│ ├── Button/ # Button 组件
|
|
57
|
+
│ │ ├── index.tsx # 组件实现
|
|
58
|
+
│ │ ├── index.less # 组件样式
|
|
59
|
+
│ │ ├── index.ts # 组件导出
|
|
60
|
+
│ │ └── index.md # 组件文档
|
|
61
|
+
│ └── index.ts # 入口文件
|
|
62
|
+
├── .dumirc.ts # dumi 配置
|
|
63
|
+
├── .fatherrc.ts # father 打包配置
|
|
64
|
+
├── package.json
|
|
65
|
+
└── tsconfig.json
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
## 🤝 贡献
|
|
69
|
+
|
|
70
|
+
欢迎贡献代码，请先阅读贡献指南。
|
|
71
|
+
|
|
72
|
+
## 📄 License
|
|
73
|
+
|
|
74
|
+
MIT © Kage UI
|
|
75
|
+
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './style.less';
|
|
3
|
+
export interface ButtonProps {
|
|
4
|
+
/** 按钮类型 */
|
|
5
|
+
type?: 'primary' | 'default' | 'dashed' | 'text' | 'link';
|
|
6
|
+
/** 按钮尺寸 */
|
|
7
|
+
size?: 'large' | 'middle' | 'small';
|
|
8
|
+
/** 是否禁用 */
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
/** 是否加载中 */
|
|
11
|
+
loading?: boolean;
|
|
12
|
+
/** 是否块级按钮 */
|
|
13
|
+
block?: boolean;
|
|
14
|
+
/** 点击事件 */
|
|
15
|
+
onClick?: React.MouseEventHandler<HTMLButtonElement>;
|
|
16
|
+
/** 子元素 */
|
|
17
|
+
children?: React.ReactNode;
|
|
18
|
+
/** 自定义类名 */
|
|
19
|
+
className?: string;
|
|
20
|
+
/** 自定义样式 */
|
|
21
|
+
style?: React.CSSProperties;
|
|
22
|
+
}
|
|
23
|
+
export declare const Button: React.FC<ButtonProps>;
|
|
24
|
+
export default Button;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = exports.Button = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
require("./style.less");
|
|
9
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
var Button = exports.Button = function Button(_ref) {
|
|
12
|
+
var _ref$type = _ref.type,
|
|
13
|
+
type = _ref$type === void 0 ? 'default' : _ref$type,
|
|
14
|
+
_ref$size = _ref.size,
|
|
15
|
+
size = _ref$size === void 0 ? 'middle' : _ref$size,
|
|
16
|
+
_ref$disabled = _ref.disabled,
|
|
17
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
18
|
+
_ref$loading = _ref.loading,
|
|
19
|
+
loading = _ref$loading === void 0 ? false : _ref$loading,
|
|
20
|
+
_ref$block = _ref.block,
|
|
21
|
+
block = _ref$block === void 0 ? false : _ref$block,
|
|
22
|
+
onClick = _ref.onClick,
|
|
23
|
+
children = _ref.children,
|
|
24
|
+
_ref$className = _ref.className,
|
|
25
|
+
className = _ref$className === void 0 ? '' : _ref$className,
|
|
26
|
+
style = _ref.style;
|
|
27
|
+
var classNames = ['kage-btn', "kage-btn-".concat(type), "kage-btn-".concat(size), block && 'kage-btn-block', disabled && 'kage-btn-disabled', loading && 'kage-btn-loading', className].filter(Boolean).join(' ');
|
|
28
|
+
var handleClick = function handleClick(e) {
|
|
29
|
+
if (disabled || loading) {
|
|
30
|
+
e.preventDefault();
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
onClick === null || onClick === void 0 || onClick(e);
|
|
34
|
+
};
|
|
35
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
|
|
36
|
+
className: classNames,
|
|
37
|
+
style: style,
|
|
38
|
+
disabled: disabled || loading,
|
|
39
|
+
onClick: handleClick,
|
|
40
|
+
children: [loading && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
41
|
+
className: "kage-btn-loading-icon",
|
|
42
|
+
children: "\u23F3"
|
|
43
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
44
|
+
children: children
|
|
45
|
+
})]
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
var _default = exports.default = Button;
|
|
@@ -0,0 +1,138 @@
|
|
|
1
|
+
// Button 组件样式
|
|
2
|
+
|
|
3
|
+
@prefix: kage-btn;
|
|
4
|
+
|
|
5
|
+
.@{prefix} {
|
|
6
|
+
display: inline-flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
justify-content: center;
|
|
9
|
+
gap: 8px;
|
|
10
|
+
padding: 8px 16px;
|
|
11
|
+
font-size: 14px;
|
|
12
|
+
font-weight: 500;
|
|
13
|
+
line-height: 1.5;
|
|
14
|
+
border-radius: 8px;
|
|
15
|
+
border: 1px solid transparent;
|
|
16
|
+
cursor: pointer;
|
|
17
|
+
transition: all 0.2s ease-in-out;
|
|
18
|
+
user-select: none;
|
|
19
|
+
outline: none;
|
|
20
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
21
|
+
|
|
22
|
+
// 默认样式
|
|
23
|
+
&-default {
|
|
24
|
+
background: #ffffff;
|
|
25
|
+
border-color: #d9d9d9;
|
|
26
|
+
color: #1f1f1f;
|
|
27
|
+
|
|
28
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
29
|
+
border-color: #6366f1;
|
|
30
|
+
color: #6366f1;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
&:active:not(.@{prefix}-disabled) {
|
|
34
|
+
border-color: #4f46e5;
|
|
35
|
+
color: #4f46e5;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
// 主按钮
|
|
40
|
+
&-primary {
|
|
41
|
+
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
|
|
42
|
+
border-color: transparent;
|
|
43
|
+
color: #ffffff;
|
|
44
|
+
box-shadow: 0 2px 8px rgba(99, 102, 241, 0.35);
|
|
45
|
+
|
|
46
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
47
|
+
background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
|
|
48
|
+
box-shadow: 0 4px 12px rgba(99, 102, 241, 0.45);
|
|
49
|
+
transform: translateY(-1px);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
&:active:not(.@{prefix}-disabled) {
|
|
53
|
+
background: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%);
|
|
54
|
+
transform: translateY(0);
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
// 虚线按钮
|
|
59
|
+
&-dashed {
|
|
60
|
+
background: #ffffff;
|
|
61
|
+
border-color: #d9d9d9;
|
|
62
|
+
border-style: dashed;
|
|
63
|
+
color: #1f1f1f;
|
|
64
|
+
|
|
65
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
66
|
+
border-color: #6366f1;
|
|
67
|
+
color: #6366f1;
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
// 文本按钮
|
|
72
|
+
&-text {
|
|
73
|
+
background: transparent;
|
|
74
|
+
border-color: transparent;
|
|
75
|
+
color: #1f1f1f;
|
|
76
|
+
|
|
77
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
78
|
+
background: rgba(0, 0, 0, 0.04);
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
// 链接按钮
|
|
83
|
+
&-link {
|
|
84
|
+
background: transparent;
|
|
85
|
+
border-color: transparent;
|
|
86
|
+
color: #6366f1;
|
|
87
|
+
|
|
88
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
89
|
+
color: #4f46e5;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
// 尺寸
|
|
94
|
+
&-large {
|
|
95
|
+
padding: 12px 24px;
|
|
96
|
+
font-size: 16px;
|
|
97
|
+
border-radius: 10px;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
&-small {
|
|
101
|
+
padding: 4px 12px;
|
|
102
|
+
font-size: 12px;
|
|
103
|
+
border-radius: 6px;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
// 块级按钮
|
|
107
|
+
&-block {
|
|
108
|
+
display: flex;
|
|
109
|
+
width: 100%;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
// 禁用状态
|
|
113
|
+
&-disabled {
|
|
114
|
+
opacity: 0.5;
|
|
115
|
+
cursor: not-allowed;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
// 加载状态
|
|
119
|
+
&-loading {
|
|
120
|
+
cursor: wait;
|
|
121
|
+
opacity: 0.8;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
&-loading-icon {
|
|
125
|
+
display: inline-flex;
|
|
126
|
+
animation: kage-btn-spin 1s linear infinite;
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
@keyframes kage-btn-spin {
|
|
131
|
+
from {
|
|
132
|
+
transform: rotate(0deg);
|
|
133
|
+
}
|
|
134
|
+
to {
|
|
135
|
+
transform: rotate(360deg);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './style.less';
|
|
3
|
+
export interface ButtonProps {
|
|
4
|
+
/** 按钮类型 */
|
|
5
|
+
type?: 'primary' | 'default' | 'dashed' | 'text' | 'link';
|
|
6
|
+
/** 按钮尺寸 */
|
|
7
|
+
size?: 'large' | 'middle' | 'small';
|
|
8
|
+
/** 是否禁用 */
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
/** 是否加载中 */
|
|
11
|
+
loading?: boolean;
|
|
12
|
+
/** 是否块级按钮 */
|
|
13
|
+
block?: boolean;
|
|
14
|
+
/** 点击事件 */
|
|
15
|
+
onClick?: React.MouseEventHandler<HTMLButtonElement>;
|
|
16
|
+
/** 子元素 */
|
|
17
|
+
children?: React.ReactNode;
|
|
18
|
+
/** 自定义类名 */
|
|
19
|
+
className?: string;
|
|
20
|
+
/** 自定义样式 */
|
|
21
|
+
style?: React.CSSProperties;
|
|
22
|
+
}
|
|
23
|
+
export declare const Button: React.FC<ButtonProps>;
|
|
24
|
+
export default Button;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import "./style.less";
|
|
3
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
+
export var Button = function Button(_ref) {
|
|
6
|
+
var _ref$type = _ref.type,
|
|
7
|
+
type = _ref$type === void 0 ? 'default' : _ref$type,
|
|
8
|
+
_ref$size = _ref.size,
|
|
9
|
+
size = _ref$size === void 0 ? 'middle' : _ref$size,
|
|
10
|
+
_ref$disabled = _ref.disabled,
|
|
11
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
12
|
+
_ref$loading = _ref.loading,
|
|
13
|
+
loading = _ref$loading === void 0 ? false : _ref$loading,
|
|
14
|
+
_ref$block = _ref.block,
|
|
15
|
+
block = _ref$block === void 0 ? false : _ref$block,
|
|
16
|
+
onClick = _ref.onClick,
|
|
17
|
+
children = _ref.children,
|
|
18
|
+
_ref$className = _ref.className,
|
|
19
|
+
className = _ref$className === void 0 ? '' : _ref$className,
|
|
20
|
+
style = _ref.style;
|
|
21
|
+
var classNames = ['kage-btn', "kage-btn-".concat(type), "kage-btn-".concat(size), block && 'kage-btn-block', disabled && 'kage-btn-disabled', loading && 'kage-btn-loading', className].filter(Boolean).join(' ');
|
|
22
|
+
var handleClick = function handleClick(e) {
|
|
23
|
+
if (disabled || loading) {
|
|
24
|
+
e.preventDefault();
|
|
25
|
+
return;
|
|
26
|
+
}
|
|
27
|
+
onClick === null || onClick === void 0 || onClick(e);
|
|
28
|
+
};
|
|
29
|
+
return /*#__PURE__*/_jsxs("button", {
|
|
30
|
+
className: classNames,
|
|
31
|
+
style: style,
|
|
32
|
+
disabled: disabled || loading,
|
|
33
|
+
onClick: handleClick,
|
|
34
|
+
children: [loading && /*#__PURE__*/_jsx("span", {
|
|
35
|
+
className: "kage-btn-loading-icon",
|
|
36
|
+
children: "\u23F3"
|
|
37
|
+
}), /*#__PURE__*/_jsx("span", {
|
|
38
|
+
children: children
|
|
39
|
+
})]
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
export default Button;
|
|
@@ -0,0 +1,138 @@
|
|
|
1
|
+
// Button 组件样式
|
|
2
|
+
|
|
3
|
+
@prefix: kage-btn;
|
|
4
|
+
|
|
5
|
+
.@{prefix} {
|
|
6
|
+
display: inline-flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
justify-content: center;
|
|
9
|
+
gap: 8px;
|
|
10
|
+
padding: 8px 16px;
|
|
11
|
+
font-size: 14px;
|
|
12
|
+
font-weight: 500;
|
|
13
|
+
line-height: 1.5;
|
|
14
|
+
border-radius: 8px;
|
|
15
|
+
border: 1px solid transparent;
|
|
16
|
+
cursor: pointer;
|
|
17
|
+
transition: all 0.2s ease-in-out;
|
|
18
|
+
user-select: none;
|
|
19
|
+
outline: none;
|
|
20
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
21
|
+
|
|
22
|
+
// 默认样式
|
|
23
|
+
&-default {
|
|
24
|
+
background: #ffffff;
|
|
25
|
+
border-color: #d9d9d9;
|
|
26
|
+
color: #1f1f1f;
|
|
27
|
+
|
|
28
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
29
|
+
border-color: #6366f1;
|
|
30
|
+
color: #6366f1;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
&:active:not(.@{prefix}-disabled) {
|
|
34
|
+
border-color: #4f46e5;
|
|
35
|
+
color: #4f46e5;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
// 主按钮
|
|
40
|
+
&-primary {
|
|
41
|
+
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
|
|
42
|
+
border-color: transparent;
|
|
43
|
+
color: #ffffff;
|
|
44
|
+
box-shadow: 0 2px 8px rgba(99, 102, 241, 0.35);
|
|
45
|
+
|
|
46
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
47
|
+
background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
|
|
48
|
+
box-shadow: 0 4px 12px rgba(99, 102, 241, 0.45);
|
|
49
|
+
transform: translateY(-1px);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
&:active:not(.@{prefix}-disabled) {
|
|
53
|
+
background: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%);
|
|
54
|
+
transform: translateY(0);
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
// 虚线按钮
|
|
59
|
+
&-dashed {
|
|
60
|
+
background: #ffffff;
|
|
61
|
+
border-color: #d9d9d9;
|
|
62
|
+
border-style: dashed;
|
|
63
|
+
color: #1f1f1f;
|
|
64
|
+
|
|
65
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
66
|
+
border-color: #6366f1;
|
|
67
|
+
color: #6366f1;
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
// 文本按钮
|
|
72
|
+
&-text {
|
|
73
|
+
background: transparent;
|
|
74
|
+
border-color: transparent;
|
|
75
|
+
color: #1f1f1f;
|
|
76
|
+
|
|
77
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
78
|
+
background: rgba(0, 0, 0, 0.04);
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
// 链接按钮
|
|
83
|
+
&-link {
|
|
84
|
+
background: transparent;
|
|
85
|
+
border-color: transparent;
|
|
86
|
+
color: #6366f1;
|
|
87
|
+
|
|
88
|
+
&:hover:not(.@{prefix}-disabled) {
|
|
89
|
+
color: #4f46e5;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
// 尺寸
|
|
94
|
+
&-large {
|
|
95
|
+
padding: 12px 24px;
|
|
96
|
+
font-size: 16px;
|
|
97
|
+
border-radius: 10px;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
&-small {
|
|
101
|
+
padding: 4px 12px;
|
|
102
|
+
font-size: 12px;
|
|
103
|
+
border-radius: 6px;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
// 块级按钮
|
|
107
|
+
&-block {
|
|
108
|
+
display: flex;
|
|
109
|
+
width: 100%;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
// 禁用状态
|
|
113
|
+
&-disabled {
|
|
114
|
+
opacity: 0.5;
|
|
115
|
+
cursor: not-allowed;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
// 加载状态
|
|
119
|
+
&-loading {
|
|
120
|
+
cursor: wait;
|
|
121
|
+
opacity: 0.8;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
&-loading-icon {
|
|
125
|
+
display: inline-flex;
|
|
126
|
+
animation: kage-btn-spin 1s linear infinite;
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
@keyframes kage-btn-spin {
|
|
131
|
+
from {
|
|
132
|
+
transform: rotate(0deg);
|
|
133
|
+
}
|
|
134
|
+
to {
|
|
135
|
+
transform: rotate(360deg);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
package/package.json
ADDED
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "wssf-kage-ui",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "Kage UI - A modern React component library",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"react",
|
|
7
|
+
"component",
|
|
8
|
+
"ui",
|
|
9
|
+
"kage"
|
|
10
|
+
],
|
|
11
|
+
"license": "MIT",
|
|
12
|
+
"main": "dist/cjs/index.js",
|
|
13
|
+
"module": "dist/esm/index.js",
|
|
14
|
+
"types": "dist/esm/index.d.ts",
|
|
15
|
+
"files": [
|
|
16
|
+
"dist"
|
|
17
|
+
],
|
|
18
|
+
"publishConfig": {
|
|
19
|
+
"access": "public",
|
|
20
|
+
"registry": "https://registry.npmjs.org"
|
|
21
|
+
},
|
|
22
|
+
"peerDependencies": {
|
|
23
|
+
"react": ">=16.9.0",
|
|
24
|
+
"react-dom": ">=16.9.0"
|
|
25
|
+
},
|
|
26
|
+
"devDependencies": {
|
|
27
|
+
"@types/react": "^18.2.0",
|
|
28
|
+
"@types/react-dom": "^18.2.0",
|
|
29
|
+
"@umijs/lint": "^4.0.0",
|
|
30
|
+
"dumi": "^2.4.0",
|
|
31
|
+
"eslint": "^8.0.0",
|
|
32
|
+
"father": "^4.4.0",
|
|
33
|
+
"husky": "^8.0.0",
|
|
34
|
+
"lint-staged": "^15.0.0",
|
|
35
|
+
"prettier": "^3.0.0",
|
|
36
|
+
"react": "^18.2.0",
|
|
37
|
+
"react-dom": "^18.2.0",
|
|
38
|
+
"stylelint": "^15.0.0",
|
|
39
|
+
"typescript": "^5.0.0"
|
|
40
|
+
},
|
|
41
|
+
"lint-staged": {
|
|
42
|
+
"*.{md,json}": [
|
|
43
|
+
"prettier --write --no-error-on-unmatched-pattern"
|
|
44
|
+
],
|
|
45
|
+
"*.{css,less}": [
|
|
46
|
+
"stylelint --fix",
|
|
47
|
+
"prettier --write"
|
|
48
|
+
],
|
|
49
|
+
"*.{js,jsx}": [
|
|
50
|
+
"eslint --fix",
|
|
51
|
+
"prettier --write"
|
|
52
|
+
],
|
|
53
|
+
"*.{ts,tsx}": [
|
|
54
|
+
"eslint --fix",
|
|
55
|
+
"prettier --write"
|
|
56
|
+
]
|
|
57
|
+
},
|
|
58
|
+
"sideEffects": [
|
|
59
|
+
"**/*.css",
|
|
60
|
+
"**/*.less"
|
|
61
|
+
],
|
|
62
|
+
"scripts": {
|
|
63
|
+
"start": "dumi dev",
|
|
64
|
+
"docs:build": "dumi build",
|
|
65
|
+
"build": "father build",
|
|
66
|
+
"build:watch": "father dev",
|
|
67
|
+
"lint": "eslint src --ext .ts,.tsx"
|
|
68
|
+
}
|
|
69
|
+
}
|