@pointcloud/pcloud-components 0.1.37 → 1.0.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 +157 -153
- package/dist/esm/AdvancedFilter/index.js +15 -13
- package/dist/esm/AdvancedFilter/interface.d.ts +2 -9
- package/dist/esm/DCascader/index.d.ts +1 -1
- package/dist/esm/DSelect/index.d.ts +1 -1
- package/dist/esm/LabelValue/index.d.ts +1 -11
- package/dist/esm/LabelValue/index.js +12 -17
- package/dist/esm/Loading/loading.js +14 -7
- package/dist/esm/LoginForm/index.js +7 -2
- package/dist/umd/pcloud-components.min.js +1 -1
- package/package.json +133 -133
package/README.md
CHANGED
|
@@ -1,153 +1,157 @@
|
|
|
1
|
-
# @pointcloud/pcloud-components
|
|
2
|
-
|
|
3
|
-
[](https://npmjs.org/package/@pointcloud/pcloud-components)
|
|
4
|
-
[](https://npmjs.org/package/@pointcloud/pcloud-components)
|
|
5
|
-

|
|
6
|
-
[](https://npmjs.org/package/@pointcloud/pcloud-components)
|
|
7
|
-
|
|
8
|
-
一套基于 Ant Design v4.24.16 和 React
|
|
9
|
-
|
|
10
|
-
## 🎁 组件列表
|
|
11
|
-
|
|
12
|
-
### 表单组件
|
|
13
|
-
|
|
14
|
-
| 组件名称
|
|
15
|
-
|
|
|
16
|
-
| DForm
|
|
17
|
-
| DInput
|
|
18
|
-
| DSelect
|
|
19
|
-
| DCascader
|
|
20
|
-
| DTreeSelect
|
|
21
|
-
| DUpload
|
|
22
|
-
| DRangePicker
|
|
23
|
-
|
|
|
24
|
-
|
|
25
|
-
###
|
|
26
|
-
|
|
27
|
-
| 组件名称 | 描述 |
|
|
28
|
-
| ------------------ | ---------------- |
|
|
29
|
-
| DTable | 增强版表格组件 |
|
|
30
|
-
| LabelValue | 标签值展示组件 |
|
|
31
|
-
| WordCloud | 词云组件 |
|
|
32
|
-
| ScrollNumber | 数字滚动动画组件 |
|
|
33
|
-
| AspectRatio | 宽高比容器组件 |
|
|
34
|
-
| NoData | 无数据展示组件 |
|
|
35
|
-
| IPAddress | IP 地址输入组件 |
|
|
36
|
-
| AnimatedScrollList | 动画滚动列表组件 |
|
|
37
|
-
| OrgTree | 组织树组件 |
|
|
38
|
-
| TypewriterText | 打字机组件 |
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
|
45
|
-
|
|
|
46
|
-
|
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
|
53
|
-
|
|
|
54
|
-
|
|
|
55
|
-
|
|
|
56
|
-
|
|
|
57
|
-
|
|
|
58
|
-
|
|
|
59
|
-
|
|
|
60
|
-
|
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
```
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
```
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
##
|
|
149
|
-
|
|
150
|
-
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
1
|
+
# @pointcloud/pcloud-components
|
|
2
|
+
|
|
3
|
+
[](https://npmjs.org/package/@pointcloud/pcloud-components)
|
|
4
|
+
[](https://npmjs.org/package/@pointcloud/pcloud-components)
|
|
5
|
+

|
|
6
|
+
[](https://npmjs.org/package/@pointcloud/pcloud-components)
|
|
7
|
+
|
|
8
|
+
一套基于 Ant Design v4.24.16 和 React v18 开发的业务组件库,包含 30+ 个高质量组件,可帮助您快速构建企业级中后台产品原型。
|
|
9
|
+
|
|
10
|
+
## 🎁 组件列表
|
|
11
|
+
|
|
12
|
+
### 表单组件
|
|
13
|
+
|
|
14
|
+
| 组件名称 | 描述 |
|
|
15
|
+
| --------------- | ----------------------------------- |
|
|
16
|
+
| DForm | 基于 Ant Design Form 的增强表单组件 |
|
|
17
|
+
| DInput | 增强版输入框组件 |
|
|
18
|
+
| DSelect | 支持异步加载的下拉选择组件 |
|
|
19
|
+
| DCascader | 支持异步加载的级联选择组件 |
|
|
20
|
+
| DTreeSelect | 支持异步加载的树选择组件 |
|
|
21
|
+
| DUpload | 文件上传组件 |
|
|
22
|
+
| DRangePicker | 日期选择组件 |
|
|
23
|
+
| DynamicFormItem | 动态表单组件 |
|
|
24
|
+
|
|
25
|
+
### 数据展示类
|
|
26
|
+
|
|
27
|
+
| 组件名称 | 描述 |
|
|
28
|
+
| ------------------ | ---------------- |
|
|
29
|
+
| DTable | 增强版表格组件 |
|
|
30
|
+
| LabelValue | 标签值展示组件 |
|
|
31
|
+
| WordCloud | 词云组件 |
|
|
32
|
+
| ScrollNumber | 数字滚动动画组件 |
|
|
33
|
+
| AspectRatio | 宽高比容器组件 |
|
|
34
|
+
| NoData | 无数据展示组件 |
|
|
35
|
+
| IPAddress | IP 地址输入组件 |
|
|
36
|
+
| AnimatedScrollList | 动画滚动列表组件 |
|
|
37
|
+
| OrgTree | 组织树组件 |
|
|
38
|
+
| TypewriterText | 打字机组件 |
|
|
39
|
+
| ErrorBoundary | 错误边界组件 |
|
|
40
|
+
| IconFont | 自定义图标组件 |
|
|
41
|
+
|
|
42
|
+
### 模态框
|
|
43
|
+
|
|
44
|
+
| 组件名称 | 描述 |
|
|
45
|
+
| --------- | ---------------- |
|
|
46
|
+
| DModal | 增强版模态框组件 |
|
|
47
|
+
| ModalForm | 表单模态框组件 |
|
|
48
|
+
| LoginForm | 登录表单组件 |
|
|
49
|
+
|
|
50
|
+
### 其他
|
|
51
|
+
|
|
52
|
+
| 组件名称 | 描述 |
|
|
53
|
+
| ------------------ | ------------------ |
|
|
54
|
+
| Loading | 全局加载组件 |
|
|
55
|
+
| ContextMenu | 右键菜单组件 |
|
|
56
|
+
| AdvancedFilter | 高级筛选组件 |
|
|
57
|
+
| InfiniteScrollList | 无限滚动列表组件 |
|
|
58
|
+
| PictureCard | 图片卡片组件 |
|
|
59
|
+
| SignaturePad | 签名板组件 |
|
|
60
|
+
| RndDrag | 可拖拽调整大小组件 |
|
|
61
|
+
| RCropper | 图片裁剪组件 |
|
|
62
|
+
| CRUD | CRUD 组件 |
|
|
63
|
+
| AuthComponent | 权限组件 |
|
|
64
|
+
| ColorPicker | 颜色选择器组件 |
|
|
65
|
+
|
|
66
|
+
## 🚀 安装
|
|
67
|
+
|
|
68
|
+
```bash
|
|
69
|
+
# 使用 npm
|
|
70
|
+
npm install @pointcloud/pcloud-components
|
|
71
|
+
|
|
72
|
+
# 使用 yarn
|
|
73
|
+
yarn add @pointcloud/pcloud-components
|
|
74
|
+
|
|
75
|
+
# 使用 pnpm
|
|
76
|
+
pnpm add @pointcloud/pcloud-components
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
## 🔨 快速开始
|
|
80
|
+
|
|
81
|
+
通过 umd 引入时,需要先引入`react`和`react-dom`, 示例:
|
|
82
|
+
|
|
83
|
+
```html
|
|
84
|
+
<link rel="stylesheet" href="https://unpkg.com/@pointcloud/pcloud-components@1.0.0/dist/umd/pcloud-components.min.css" />
|
|
85
|
+
<script src="https://unpkg.com/react@18.3.1/umd/react.production.min.js"></script>
|
|
86
|
+
<script src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.production.min.js"></script>
|
|
87
|
+
<script src="https://unpkg.com/@pointcloud/pcloud-components@1.0.0/dist/umd/pcloud-components.min.js"></script>
|
|
88
|
+
```
|
|
89
|
+
|
|
90
|
+
### 1. 基础使用
|
|
91
|
+
|
|
92
|
+
```jsx
|
|
93
|
+
import React from 'react';
|
|
94
|
+
import { DCascader } from '@pointcloud/pcloud-components';
|
|
95
|
+
|
|
96
|
+
const App = () => {
|
|
97
|
+
const handleChange = (value, selectedOptions) => {
|
|
98
|
+
console.log(value, selectedOptions);
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
return <DCascader showSearch placeholder="请选择" onChange={handleChange} />;
|
|
102
|
+
};
|
|
103
|
+
|
|
104
|
+
export default App;
|
|
105
|
+
```
|
|
106
|
+
|
|
107
|
+
### 2. 使用表单组件
|
|
108
|
+
|
|
109
|
+
```jsx
|
|
110
|
+
import React from 'react';
|
|
111
|
+
import { DForm } from '@pointcloud/pcloud-components';
|
|
112
|
+
|
|
113
|
+
const App = () => {
|
|
114
|
+
const onFinish = (values) => {
|
|
115
|
+
console.log('表单值:', values);
|
|
116
|
+
};
|
|
117
|
+
const items = [
|
|
118
|
+
{
|
|
119
|
+
label: '用户名',
|
|
120
|
+
name: 'username',
|
|
121
|
+
rules: [{ required: true, message: '请输入用户名' }],
|
|
122
|
+
renderType: 'input',
|
|
123
|
+
},
|
|
124
|
+
{
|
|
125
|
+
label: '状态',
|
|
126
|
+
name: 'status',
|
|
127
|
+
rules: [{ required: true, message: '请选择状态' }],
|
|
128
|
+
renderType: 'select',
|
|
129
|
+
options: [
|
|
130
|
+
{ label: '启用', value: 1 },
|
|
131
|
+
{ label: '禁用', value: 0 },
|
|
132
|
+
],
|
|
133
|
+
},
|
|
134
|
+
{
|
|
135
|
+
label: '提交',
|
|
136
|
+
renderType: 'button',
|
|
137
|
+
type: 'primary',
|
|
138
|
+
htmlType: 'submit',
|
|
139
|
+
},
|
|
140
|
+
];
|
|
141
|
+
|
|
142
|
+
return <DForm onFinish={onFinish} items={items}></DForm>;
|
|
143
|
+
};
|
|
144
|
+
|
|
145
|
+
export default App;
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
## 📖 详细文档
|
|
149
|
+
|
|
150
|
+
访问我们的[在线文档](https://frank17008.github.io/pcloud-components)查看完整的组件列表和使用示例。
|
|
151
|
+
|
|
152
|
+
## ⚙️ 环境支持
|
|
153
|
+
|
|
154
|
+
- React >= 18
|
|
155
|
+
- Ant Design <= 4.24.16
|
|
156
|
+
- Node >= 16.20.0
|
|
157
|
+
- Modern browsers
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
2
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
|
+
var _excluded = ["inputSearch"];
|
|
4
6
|
import React, { useState, useRef, useImperativeHandle, useContext } from 'react';
|
|
5
7
|
import { Input, Button, Collapse } from 'antd';
|
|
6
8
|
import classNames from 'classnames';
|
|
@@ -12,13 +14,16 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
12
14
|
var AdvancedFilter = function AdvancedFilter(props) {
|
|
13
15
|
var left = props.left,
|
|
14
16
|
right = props.right,
|
|
15
|
-
inputProps = props.inputProps,
|
|
17
|
+
_props$inputProps = props.inputProps,
|
|
18
|
+
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
16
19
|
formItemConfig = props.formItemConfig,
|
|
17
20
|
fRef = props.fRef,
|
|
18
21
|
icon = props.icon,
|
|
19
22
|
onValuesChange = props.onValuesChange,
|
|
20
23
|
onSearch = props.onSearch,
|
|
21
24
|
onReset = props.onReset;
|
|
25
|
+
var inputSearch = inputProps.inputSearch,
|
|
26
|
+
otherInputProps = _objectWithoutProperties(inputProps, _excluded);
|
|
22
27
|
var _useContext = useContext(ConfigContext),
|
|
23
28
|
prefixCls = _useContext.prefixCls,
|
|
24
29
|
getPrefixCls = _useContext.getPrefixCls;
|
|
@@ -49,12 +54,12 @@ var AdvancedFilter = function AdvancedFilter(props) {
|
|
|
49
54
|
var handleSearch = function handleSearch(values) {
|
|
50
55
|
var _inputRef$current;
|
|
51
56
|
var value = inputRef === null || inputRef === void 0 || (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || (_inputRef$current = _inputRef$current.input) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value;
|
|
52
|
-
|
|
53
|
-
onSearch && onSearch(_objectSpread(_objectSpread({}, values), _defineProperty({}, inputProps.name, value)));
|
|
57
|
+
onSearch === null || onSearch === void 0 || onSearch(_objectSpread(_objectSpread({}, values), _defineProperty({}, inputProps.name, value)));
|
|
54
58
|
};
|
|
55
|
-
var
|
|
56
|
-
|
|
57
|
-
|
|
59
|
+
var _inputSearch = function _inputSearch(v) {
|
|
60
|
+
if (typeof inputSearch === 'function') {
|
|
61
|
+
inputSearch(_defineProperty({}, inputProps.name, v));
|
|
62
|
+
}
|
|
58
63
|
};
|
|
59
64
|
return /*#__PURE__*/_jsx(Collapse, {
|
|
60
65
|
className: wrapperClass,
|
|
@@ -78,20 +83,17 @@ var AdvancedFilter = function AdvancedFilter(props) {
|
|
|
78
83
|
children: left
|
|
79
84
|
}), /*#__PURE__*/_jsxs("div", {
|
|
80
85
|
className: "right right-content",
|
|
81
|
-
children: [/*#__PURE__*/_jsx(Input.Search, {
|
|
86
|
+
children: [/*#__PURE__*/_jsx(Input.Search, _objectSpread({
|
|
82
87
|
className: "input",
|
|
83
88
|
ref: inputRef,
|
|
84
89
|
allowClear: true,
|
|
85
|
-
placeholder: inputProps === null || inputProps === void 0 ? void 0 : inputProps.placeholder,
|
|
86
90
|
onChange: function onChange(e) {
|
|
87
91
|
setInputValue(e.target.value);
|
|
88
|
-
|
|
89
|
-
onValuesChange && onValuesChange(e.target.value);
|
|
92
|
+
onValuesChange === null || onValuesChange === void 0 || onValuesChange(e.target.value);
|
|
90
93
|
},
|
|
91
|
-
onSearch:
|
|
92
|
-
name: inputProps === null || inputProps === void 0 ? void 0 : inputProps.name,
|
|
94
|
+
onSearch: _inputSearch,
|
|
93
95
|
value: inputValue
|
|
94
|
-
}), /*#__PURE__*/_jsxs(Button, {
|
|
96
|
+
}, otherInputProps)), /*#__PURE__*/_jsxs(Button, {
|
|
95
97
|
className: "button",
|
|
96
98
|
onClick: function onClick() {
|
|
97
99
|
return setPanelVisible(!panelVisible);
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import type { InputProps as AntdInputProps } from 'antd';
|
|
2
3
|
export type FormItemType = 'input' | 'inputNumber' | 'radio' | 'select' | 'checkbox' | 'datePicker' | 'rangePicker' | 'switch' | 'treeSelect';
|
|
3
4
|
export interface FormItem {
|
|
4
5
|
/**
|
|
@@ -55,15 +56,7 @@ export interface FProps extends FormProps {
|
|
|
55
56
|
*/
|
|
56
57
|
formRef?: any;
|
|
57
58
|
}
|
|
58
|
-
export interface InputProps {
|
|
59
|
-
/**
|
|
60
|
-
* @description input检索框placeholder
|
|
61
|
-
*/
|
|
62
|
-
placeholder?: string;
|
|
63
|
-
/**
|
|
64
|
-
* @description input检索框字段名
|
|
65
|
-
*/
|
|
66
|
-
name: string;
|
|
59
|
+
export interface InputProps extends AntdInputProps {
|
|
67
60
|
/**
|
|
68
61
|
* @description input检索框回车时或点击检索图标时触发
|
|
69
62
|
*/
|
|
@@ -11,7 +11,7 @@ export type DCascaderProps = Omit<CascaderProps<any>, 'options' | 'loadData' | '
|
|
|
11
11
|
/** antd的loading属性,是否显示加载中:传入数字表示延迟加载,单位毫秒,0等同于false */
|
|
12
12
|
loading?: boolean | number;
|
|
13
13
|
};
|
|
14
|
-
declare const DCascader: React.ForwardRefExoticComponent<Omit<CascaderProps<any>, "
|
|
14
|
+
declare const DCascader: React.ForwardRefExoticComponent<Omit<CascaderProps<any>, "loading" | "options" | "loadData"> & {
|
|
15
15
|
/** antd的options属性,同onSearch属性,可以是一个options数组,或一个返回等价options数组的promise */
|
|
16
16
|
options?: DefaultOptionType[] | ((value?: string, option?: DefaultOptionType, options?: DefaultOptionType[]) => Promise<DefaultOptionType[]>) | undefined;
|
|
17
17
|
/** antd的loadData属性,动态加载子级列表数据,默认使用options所提供的方法,如果传入null,则表示不进行动态加载,该方法要求返回一个options数组或与其等价的Promise */
|
|
@@ -11,7 +11,7 @@ export type DSelectProps = Omit<SelectProps, 'options' | 'onSearch' | 'loading'>
|
|
|
11
11
|
/** 是否开启防抖: true表示800毫秒,true表示默认值,false或0表示不开启 */
|
|
12
12
|
debounce?: boolean | number;
|
|
13
13
|
};
|
|
14
|
-
declare const DSelect: React.ForwardRefExoticComponent<Omit<SelectProps<any, DefaultOptionType>, "
|
|
14
|
+
declare const DSelect: React.ForwardRefExoticComponent<Omit<SelectProps<any, DefaultOptionType>, "loading" | "options" | "onSearch"> & {
|
|
15
15
|
/** antd的onSearch属性,onSearch有效时showSearch自动为true */
|
|
16
16
|
onSearch?: ((params?: any) => Promise<DefaultOptionType[] | any[]>) | undefined;
|
|
17
17
|
/** antd的options属性,可以是一个options数组,或一个返回等价options数组的promise */
|
|
@@ -1,16 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ILabelValueProps } from './interface';
|
|
3
3
|
import './styles/index.less';
|
|
4
|
-
declare function LabelValue(
|
|
5
|
-
declare namespace LabelValue {
|
|
6
|
-
var defaultProps: {
|
|
7
|
-
className: string;
|
|
8
|
-
label: string;
|
|
9
|
-
value: string;
|
|
10
|
-
emptyValue: string;
|
|
11
|
-
noWrap: boolean;
|
|
12
|
-
noColon: boolean;
|
|
13
|
-
};
|
|
14
|
-
}
|
|
4
|
+
declare function LabelValue(props: ILabelValueProps): import("react/jsx-runtime").JSX.Element;
|
|
15
5
|
declare const _default: React.MemoExoticComponent<typeof LabelValue>;
|
|
16
6
|
export default _default;
|
|
@@ -5,15 +5,18 @@ import { ConfigContext, defaultPrefixCls } from "../ConfigProvider";
|
|
|
5
5
|
import "./styles/index.less";
|
|
6
6
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
-
function LabelValue(
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
8
|
+
function LabelValue(props) {
|
|
9
|
+
var className = props.className,
|
|
10
|
+
style = props.style,
|
|
11
|
+
label = props.label,
|
|
12
|
+
value = props.value,
|
|
13
|
+
formatter = props.formatter,
|
|
14
|
+
_props$emptyValue = props.emptyValue,
|
|
15
|
+
emptyValue = _props$emptyValue === void 0 ? '-' : _props$emptyValue,
|
|
16
|
+
_props$noWrap = props.noWrap,
|
|
17
|
+
noWrap = _props$noWrap === void 0 ? false : _props$noWrap,
|
|
18
|
+
_props$noColon = props.noColon,
|
|
19
|
+
noColon = _props$noColon === void 0 ? false : _props$noColon;
|
|
17
20
|
var _useContext = useContext(ConfigContext),
|
|
18
21
|
prefixCls = _useContext.prefixCls,
|
|
19
22
|
getPrefixCls = _useContext.getPrefixCls;
|
|
@@ -33,12 +36,4 @@ function LabelValue(_ref) {
|
|
|
33
36
|
})]
|
|
34
37
|
});
|
|
35
38
|
}
|
|
36
|
-
LabelValue.defaultProps = {
|
|
37
|
-
className: '',
|
|
38
|
-
label: '',
|
|
39
|
-
value: '',
|
|
40
|
-
emptyValue: '-',
|
|
41
|
-
noWrap: false,
|
|
42
|
-
noColon: false
|
|
43
|
-
};
|
|
44
39
|
export default /*#__PURE__*/React.memo(LabelValue);
|
|
@@ -7,7 +7,7 @@ var _excluded = ["delay", "isBodyContainer"],
|
|
|
7
7
|
import { Spin } from 'antd';
|
|
8
8
|
import classNames from 'classnames';
|
|
9
9
|
import { useContext, useEffect, useRef, useState } from 'react';
|
|
10
|
-
import
|
|
10
|
+
import { createRoot } from 'react-dom/client';
|
|
11
11
|
import { ConfigContext } from "../ConfigProvider";
|
|
12
12
|
import "./styles/index.less";
|
|
13
13
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -77,9 +77,15 @@ Loading.newInstance = function newNotificationInstance(args) {
|
|
|
77
77
|
document.body.appendChild(createdDiv);
|
|
78
78
|
element = createdDiv;
|
|
79
79
|
} else {
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
80
|
+
var _current;
|
|
81
|
+
if (container instanceof HTMLElement) {
|
|
82
|
+
element = container;
|
|
83
|
+
} else if (container !== null && container !== void 0 && (_current = container.current) !== null && _current !== void 0 && _current.nodeType) {
|
|
84
|
+
// 如果是 ref 对象
|
|
85
|
+
element = container.current;
|
|
86
|
+
} else {
|
|
87
|
+
element = container.current;
|
|
88
|
+
}
|
|
83
89
|
|
|
84
90
|
// 确保容器有相对定位
|
|
85
91
|
if (element) {
|
|
@@ -92,12 +98,13 @@ Loading.newInstance = function newNotificationInstance(args) {
|
|
|
92
98
|
}
|
|
93
99
|
|
|
94
100
|
// 在新创建的div元素上渲染Loading组件,避免替换原有内容
|
|
95
|
-
|
|
101
|
+
var root = createRoot(createdDiv);
|
|
102
|
+
root.render( /*#__PURE__*/_jsx(Loading, _objectSpread(_objectSpread({}, otherProps), {}, {
|
|
96
103
|
isBodyContainer: isBodyContainer
|
|
97
|
-
}))
|
|
104
|
+
})));
|
|
98
105
|
return {
|
|
99
106
|
destroy: function destroy() {
|
|
100
|
-
|
|
107
|
+
root.unmount();
|
|
101
108
|
// 如果是我们创建的div,则从DOM中移除
|
|
102
109
|
if (createdDiv && createdDiv.parentNode) {
|
|
103
110
|
createdDiv.parentNode.removeChild(createdDiv);
|
|
@@ -5,7 +5,8 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
|
5
5
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
6
6
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
7
7
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
8
|
-
var _excluded = ["extraItems", "onFinish", "loginText", "loginButtonDisabled", "usernameItem", "passwordItem", "loginButtonItem", "className"]
|
|
8
|
+
var _excluded = ["extraItems", "onFinish", "loginText", "loginButtonDisabled", "usernameItem", "passwordItem", "loginButtonItem", "className"],
|
|
9
|
+
_excluded2 = ["children"];
|
|
9
10
|
import React, { useState, useEffect, forwardRef, useContext, useMemo } from 'react';
|
|
10
11
|
import classNames from 'classnames';
|
|
11
12
|
import { DForm } from "./..";
|
|
@@ -112,11 +113,15 @@ var LoginForm = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
112
113
|
return _ref.apply(this, arguments);
|
|
113
114
|
};
|
|
114
115
|
}();
|
|
116
|
+
|
|
117
|
+
// 将 restProps 中可能与 items 冲突的属性排除
|
|
118
|
+
var children = restProps.children,
|
|
119
|
+
formPropsWithoutChildren = _objectWithoutProperties(restProps, _excluded2);
|
|
115
120
|
return /*#__PURE__*/_jsx(DForm, _objectSpread({
|
|
116
121
|
form: form,
|
|
117
122
|
items: items,
|
|
118
123
|
onFinish: handleFinish,
|
|
119
124
|
className: wrapperClass
|
|
120
|
-
},
|
|
125
|
+
}, formPropsWithoutChildren));
|
|
121
126
|
});
|
|
122
127
|
export default LoginForm;
|