@nutui/nutui-react 2.0.19-beta.0 → 2.0.19
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/CHANGELOG.md +14 -0
- package/dist/esm/Button.js +84 -5
- package/dist/esm/Uploader.js +191 -191
- package/dist/esm/menuitem2.js +6 -4
- package/dist/esm/types/src/packages/uploader/demo.taro.d.ts +0 -15
- package/dist/esm/types/src/packages/uploader/file-item.d.ts +19 -0
- package/dist/esm/types/src/packages/uploader/index.d.ts +2 -1
- package/dist/esm/types/src/packages/uploader/index.taro.d.ts +2 -1
- package/dist/esm/types/src/packages/uploader/preview.d.ts +2 -0
- package/dist/esm/types/src/packages/uploader/preview.taro.d.ts +2 -0
- package/dist/esm/types/src/packages/uploader/upload.d.ts +3 -0
- package/dist/esm/types/src/packages/uploader/uploader.d.ts +5 -23
- package/dist/esm/types/src/packages/uploader/uploader.taro.d.ts +10 -26
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +1 -1
- package/dist/locales/id-ID.js +1 -1
- package/dist/locales/tr-TR.js +1 -1
- package/dist/locales/zh-CN.js +1 -1
- package/dist/locales/zh-TW.js +1 -1
- package/dist/locales/zh-UG.js +1 -1
- package/dist/nutui.react.es.js +263 -258
- package/dist/nutui.react.umd.js +263 -258
- package/dist/style.mjs +1 -1
- package/dist/types/packages/uploader/file-item.d.ts +19 -0
- package/dist/types/packages/uploader/index.d.ts +2 -1
- package/dist/types/packages/uploader/preview.d.ts +2 -0
- package/dist/types/packages/uploader/upload.d.ts +3 -0
- package/dist/types/packages/uploader/uploader.d.ts +5 -23
- package/package.json +1 -1
- package/dist/esm/button2.js +0 -87
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,17 @@
|
|
|
1
|
+
# v2.0.19
|
|
2
|
+
`2023-09-27`
|
|
3
|
+
|
|
4
|
+
* :sparkles: feat(menu): overlay onclick 事件中调用 hideMenuItem 实现关闭 (#1505) @oasis-cloud
|
|
5
|
+
* :sparkles: feat(menu): onClose 事件增加触发来源参数 (#1502) @oasis-cloud
|
|
6
|
+
* :sparkles: feat(swiper): swiperItem 支持设置 className (#1504) @oasis-cloud
|
|
7
|
+
* :bug: fix(uploader): 受控模式调整,props 类型调整,回调参数修正 (#1500) @oasis-cloud
|
|
8
|
+
* :bug: fix: imagepreview with control (#1480) @xiaoyatong
|
|
9
|
+
* :bug: fix: indicator 超长换行 (#1486) @oasis-cloud
|
|
10
|
+
* :bug: fix: menu 在 lockscroll 的时候不需要加滚动事件 (#1509) @oasis-cloud
|
|
11
|
+
* :bug: fix: ios和android下点击button时出现半透明灰色遮罩 (#1495) @Kurisu
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
1
15
|
# v2.0.18
|
|
2
16
|
`2023-09-20`
|
|
3
17
|
|
package/dist/esm/Button.js
CHANGED
|
@@ -1,8 +1,87 @@
|
|
|
1
|
-
import
|
|
2
|
-
import "
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
+
var _excluded = ["color", "shape", "fill", "loading", "disabled", "type", "size", "block", "icon", "children", "onClick", "className", "style", "nativeType"];
|
|
4
|
+
function ownKeys(object, enumerableOnly) {
|
|
5
|
+
var keys = Object.keys(object);
|
|
6
|
+
if (Object.getOwnPropertySymbols) {
|
|
7
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
8
|
+
enumerableOnly && (symbols = symbols.filter(function(sym) {
|
|
9
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
10
|
+
})), keys.push.apply(keys, symbols);
|
|
11
|
+
}
|
|
12
|
+
return keys;
|
|
13
|
+
}
|
|
14
|
+
function _objectSpread(target) {
|
|
15
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
16
|
+
var source = null != arguments[i] ? arguments[i] : {};
|
|
17
|
+
i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
|
|
18
|
+
_defineProperty(target, key, source[key]);
|
|
19
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
|
|
20
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
return target;
|
|
24
|
+
}
|
|
25
|
+
import React__default, { useCallback } from "react";
|
|
26
|
+
import classNames from "classnames";
|
|
27
|
+
import { Loading } from "@nutui/icons-react";
|
|
28
|
+
import { C as ComponentDefaults } from "./typings.js";
|
|
29
|
+
var prefixCls = "nut-button";
|
|
30
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
31
|
+
color: "",
|
|
32
|
+
type: "default",
|
|
33
|
+
size: "normal",
|
|
34
|
+
shape: "round",
|
|
35
|
+
fill: "solid",
|
|
36
|
+
loading: false,
|
|
37
|
+
disabled: false,
|
|
38
|
+
block: false,
|
|
39
|
+
icon: null,
|
|
40
|
+
nativeType: "button",
|
|
41
|
+
onClick: function onClick(e) {
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
var Button = React__default.forwardRef(function(props, ref) {
|
|
45
|
+
var _classNames;
|
|
46
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), color = _defaultProps$props.color, shape = _defaultProps$props.shape, fill = _defaultProps$props.fill, loading = _defaultProps$props.loading, disabled = _defaultProps$props.disabled, type = _defaultProps$props.type, size = _defaultProps$props.size, block = _defaultProps$props.block, icon = _defaultProps$props.icon, children = _defaultProps$props.children, onClick2 = _defaultProps$props.onClick, className = _defaultProps$props.className, style = _defaultProps$props.style, nativeType = _defaultProps$props.nativeType, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
47
|
+
var getStyle = useCallback(function() {
|
|
48
|
+
var style2 = {};
|
|
49
|
+
if (props.color) {
|
|
50
|
+
if (fill && fill === "outline") {
|
|
51
|
+
style2.color = color;
|
|
52
|
+
style2.background = "#fff";
|
|
53
|
+
if (!(color !== null && color !== void 0 && color.includes("gradient"))) {
|
|
54
|
+
style2.borderColor = color;
|
|
55
|
+
}
|
|
56
|
+
} else {
|
|
57
|
+
style2.color = "#fff";
|
|
58
|
+
style2.background = color;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
return style2;
|
|
62
|
+
}, [color]);
|
|
63
|
+
var handleClick = function handleClick2(e) {
|
|
64
|
+
if (!loading && !disabled && onClick2) {
|
|
65
|
+
onClick2(e);
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
return React__default.createElement("button", _objectSpread(_objectSpread({}, rest), {}, {
|
|
69
|
+
ref,
|
|
70
|
+
type: nativeType,
|
|
71
|
+
className: classNames(prefixCls, className, props.type ? "".concat(prefixCls, "--").concat(type) : null, props.fill ? "".concat(prefixCls, "--").concat(fill) : null, (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "--").concat(size), size), _defineProperty(_classNames, "".concat(prefixCls, "--").concat(shape), shape), _defineProperty(_classNames, "".concat(prefixCls, "--block"), block), _defineProperty(_classNames, "".concat(prefixCls, "--disabled"), disabled), _defineProperty(_classNames, "".concat(prefixCls, "--loading"), loading), _classNames)),
|
|
72
|
+
style: _objectSpread(_objectSpread({}, getStyle()), style),
|
|
73
|
+
onClick: function onClick3(e) {
|
|
74
|
+
return handleClick(e);
|
|
75
|
+
}
|
|
76
|
+
}), React__default.createElement("div", {
|
|
77
|
+
className: "nut-button__warp"
|
|
78
|
+
}, loading ? React__default.createElement(Loading, {
|
|
79
|
+
className: "nut-icon-loading"
|
|
80
|
+
}) : null, !loading && icon ? icon : null, children && React__default.createElement("div", {
|
|
81
|
+
className: icon || loading ? "nut-button-text" : ""
|
|
82
|
+
}, children)));
|
|
83
|
+
});
|
|
84
|
+
Button.displayName = "NutButton";
|
|
6
85
|
export {
|
|
7
86
|
Button as default
|
|
8
87
|
};
|
package/dist/esm/Uploader.js
CHANGED
|
@@ -26,14 +26,15 @@ function _objectSpread(target) {
|
|
|
26
26
|
}
|
|
27
27
|
return target;
|
|
28
28
|
}
|
|
29
|
-
import React__default, { useState,
|
|
29
|
+
import React__default, { useState, useImperativeHandle } from "react";
|
|
30
30
|
import classNames from "classnames";
|
|
31
|
-
import { Failure,
|
|
32
|
-
import Progress from "./Progress.js";
|
|
31
|
+
import { Failure, Link, Del, Loading, Photograph } from "@nutui/icons-react";
|
|
33
32
|
import { useConfig } from "./ConfigProvider.js";
|
|
34
33
|
import { a as isPromise } from "./index.js";
|
|
35
34
|
import { C as ComponentDefaults } from "./typings.js";
|
|
36
|
-
import
|
|
35
|
+
import Button from "./Button.js";
|
|
36
|
+
import { u as usePropsValue } from "./use-props-value.js";
|
|
37
|
+
import Progress from "./Progress.js";
|
|
37
38
|
var UploadOptions = /* @__PURE__ */ _createClass(function UploadOptions2() {
|
|
38
39
|
_classCallCheck(this, UploadOptions2);
|
|
39
40
|
_defineProperty(this, "url", "");
|
|
@@ -53,6 +54,9 @@ var UploadOptions = /* @__PURE__ */ _createClass(function UploadOptions2() {
|
|
|
53
54
|
_defineProperty(this, "onFailure", void 0);
|
|
54
55
|
_defineProperty(this, "beforeXhrUpload", void 0);
|
|
55
56
|
});
|
|
57
|
+
var UPLOADING = "uploading";
|
|
58
|
+
var SUCCESS = "success";
|
|
59
|
+
var ERROR = "error";
|
|
56
60
|
var Upload = /* @__PURE__ */ function() {
|
|
57
61
|
function Upload2(options) {
|
|
58
62
|
_classCallCheck(this, Upload2);
|
|
@@ -123,6 +127,103 @@ var funcInterceptor = function funcInterceptor2(interceptor, _ref) {
|
|
|
123
127
|
done();
|
|
124
128
|
}
|
|
125
129
|
};
|
|
130
|
+
var Preview = function Preview2(_ref2) {
|
|
131
|
+
var fileList = _ref2.fileList, previewType = _ref2.previewType, deletable = _ref2.deletable, onDeleteItem = _ref2.onDeleteItem, handleItemClick = _ref2.handleItemClick, previewUrl = _ref2.previewUrl, children = _ref2.children;
|
|
132
|
+
var renderIcon = function renderIcon2(item) {
|
|
133
|
+
if (item.status === ERROR) {
|
|
134
|
+
return item.failIcon || React__default.createElement(Failure, {
|
|
135
|
+
color: "#fff"
|
|
136
|
+
});
|
|
137
|
+
}
|
|
138
|
+
return item.loadingIcon || React__default.createElement(Loading, {
|
|
139
|
+
className: "nut-icon-loading",
|
|
140
|
+
color: "#fff"
|
|
141
|
+
});
|
|
142
|
+
};
|
|
143
|
+
return React__default.createElement(React__default.Fragment, null, fileList.length !== 0 && fileList.map(function(item, index) {
|
|
144
|
+
var _item$type;
|
|
145
|
+
return React__default.createElement("div", {
|
|
146
|
+
className: "nut-uploader__preview ".concat(previewType),
|
|
147
|
+
key: item.uid
|
|
148
|
+
}, previewType === "picture" && deletable && React__default.createElement(Failure, {
|
|
149
|
+
color: "rgba(0,0,0,0.6)",
|
|
150
|
+
className: "close",
|
|
151
|
+
onClick: function onClick() {
|
|
152
|
+
return onDeleteItem(item, index);
|
|
153
|
+
}
|
|
154
|
+
}), previewType === "picture" && !children && React__default.createElement("div", {
|
|
155
|
+
className: "nut-uploader__preview-img"
|
|
156
|
+
}, item.status === "ready" ? React__default.createElement("div", {
|
|
157
|
+
className: "nut-uploader__preview__progress"
|
|
158
|
+
}, React__default.createElement("div", {
|
|
159
|
+
className: "nut-uploader__preview__progress__msg"
|
|
160
|
+
}, item.message)) : item.status !== "success" && React__default.createElement("div", {
|
|
161
|
+
className: "nut-uploader__preview__progress"
|
|
162
|
+
}, renderIcon(item), React__default.createElement("div", {
|
|
163
|
+
className: "nut-uploader__preview__progress__msg"
|
|
164
|
+
}, item.message)), (_item$type = item.type) !== null && _item$type !== void 0 && _item$type.includes("image") ? React__default.createElement(React__default.Fragment, null, item.url && React__default.createElement("img", {
|
|
165
|
+
className: "nut-uploader__preview-img__c",
|
|
166
|
+
style: {
|
|
167
|
+
objectFit: "fill"
|
|
168
|
+
},
|
|
169
|
+
src: item.url,
|
|
170
|
+
alt: "",
|
|
171
|
+
onClick: function onClick() {
|
|
172
|
+
return handleItemClick(item);
|
|
173
|
+
}
|
|
174
|
+
})) : React__default.createElement(React__default.Fragment, null, previewUrl ? React__default.createElement("img", {
|
|
175
|
+
className: "nut-uploader__preview-img__c",
|
|
176
|
+
src: previewUrl,
|
|
177
|
+
alt: "",
|
|
178
|
+
onClick: function onClick() {
|
|
179
|
+
return handleItemClick(item);
|
|
180
|
+
}
|
|
181
|
+
}) : React__default.createElement("div", {
|
|
182
|
+
className: "nut-uploader__preview-img__file"
|
|
183
|
+
}, React__default.createElement("div", {
|
|
184
|
+
onClick: function onClick() {
|
|
185
|
+
return handleItemClick(item);
|
|
186
|
+
},
|
|
187
|
+
className: "nut-uploader__preview-img__file__name"
|
|
188
|
+
}, React__default.createElement(Link, {
|
|
189
|
+
color: "#808080"
|
|
190
|
+
}), React__default.createElement("span", null, " ", item.name)))), item.status === "success" ? React__default.createElement("div", {
|
|
191
|
+
className: "tips"
|
|
192
|
+
}, item.name) : null), previewType === "list" && React__default.createElement("div", {
|
|
193
|
+
className: "nut-uploader__preview-list"
|
|
194
|
+
}, React__default.createElement("div", {
|
|
195
|
+
className: "nut-uploader__preview-img__file__name ".concat(item.status),
|
|
196
|
+
onClick: function onClick() {
|
|
197
|
+
return handleItemClick(item);
|
|
198
|
+
}
|
|
199
|
+
}, React__default.createElement(Link, null), React__default.createElement("span", null, " ", item.name)), deletable && React__default.createElement(Del, {
|
|
200
|
+
color: "#808080",
|
|
201
|
+
className: "nut-uploader__preview-img__file__del",
|
|
202
|
+
onClick: function onClick() {
|
|
203
|
+
return onDeleteItem(item, index);
|
|
204
|
+
}
|
|
205
|
+
}), item.status === "uploading" && React__default.createElement(Progress, {
|
|
206
|
+
percent: item.percentage,
|
|
207
|
+
color: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
|
|
208
|
+
showText: false
|
|
209
|
+
})));
|
|
210
|
+
}));
|
|
211
|
+
};
|
|
212
|
+
var FileItem = /* @__PURE__ */ _createClass(function FileItem2() {
|
|
213
|
+
_classCallCheck(this, FileItem2);
|
|
214
|
+
_defineProperty(this, "status", "ready");
|
|
215
|
+
_defineProperty(this, "message", "准备中..");
|
|
216
|
+
_defineProperty(this, "uid", /* @__PURE__ */ (/* @__PURE__ */ new Date()).getTime().toString());
|
|
217
|
+
_defineProperty(this, "name", void 0);
|
|
218
|
+
_defineProperty(this, "url", void 0);
|
|
219
|
+
_defineProperty(this, "type", void 0);
|
|
220
|
+
_defineProperty(this, "path", void 0);
|
|
221
|
+
_defineProperty(this, "percentage", 0);
|
|
222
|
+
_defineProperty(this, "formData", {});
|
|
223
|
+
_defineProperty(this, "responseText", void 0);
|
|
224
|
+
_defineProperty(this, "loadingIcon", void 0);
|
|
225
|
+
_defineProperty(this, "failIcon", void 0);
|
|
226
|
+
});
|
|
126
227
|
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
127
228
|
url: "",
|
|
128
229
|
maxCount: 1,
|
|
@@ -144,33 +245,27 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
|
144
245
|
preview: true,
|
|
145
246
|
deletable: true,
|
|
146
247
|
capture: false,
|
|
248
|
+
uploadIcon: React__default.createElement(Photograph, {
|
|
249
|
+
width: "20px",
|
|
250
|
+
height: "20px",
|
|
251
|
+
color: "#808080"
|
|
252
|
+
}),
|
|
147
253
|
beforeDelete: function beforeDelete(file, files) {
|
|
148
254
|
return true;
|
|
149
255
|
}
|
|
150
256
|
});
|
|
151
|
-
var FileItem = /* @__PURE__ */ _createClass(function FileItem2() {
|
|
152
|
-
_classCallCheck(this, FileItem2);
|
|
153
|
-
_defineProperty(this, "status", "ready");
|
|
154
|
-
_defineProperty(this, "message", "准备中..");
|
|
155
|
-
_defineProperty(this, "uid", /* @__PURE__ */ (/* @__PURE__ */ new Date()).getTime().toString());
|
|
156
|
-
_defineProperty(this, "name", void 0);
|
|
157
|
-
_defineProperty(this, "url", void 0);
|
|
158
|
-
_defineProperty(this, "type", void 0);
|
|
159
|
-
_defineProperty(this, "path", void 0);
|
|
160
|
-
_defineProperty(this, "percentage", 0);
|
|
161
|
-
_defineProperty(this, "formData", new FormData());
|
|
162
|
-
_defineProperty(this, "responseText", void 0);
|
|
163
|
-
});
|
|
164
257
|
var InternalUploader = function InternalUploader2(props, ref) {
|
|
165
258
|
var _useConfig = useConfig(), locale = _useConfig.locale;
|
|
166
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, uploadIcon = _defaultProps$props.uploadIcon, uploadLabel = _defaultProps$props.uploadLabel, name = _defaultProps$props.name, accept = _defaultProps$props.accept, defaultValue = _defaultProps$props.defaultValue, value = _defaultProps$props.value, previewType = _defaultProps$props.previewType, fit = _defaultProps$props.fit, disabled = _defaultProps$props.disabled, multiple = _defaultProps$props.multiple, url = _defaultProps$props.url, previewUrl = _defaultProps$props.previewUrl, headers = _defaultProps$props.headers, timeout = _defaultProps$props.timeout, method = _defaultProps$props.method, xhrState = _defaultProps$props.xhrState, withCredentials = _defaultProps$props.withCredentials, data = _defaultProps$props.data, preview = _defaultProps$props.preview, deletable = _defaultProps$props.deletable, maxCount = _defaultProps$props.maxCount, capture = _defaultProps$props.capture, maxFileSize = _defaultProps$props.maxFileSize, className = _defaultProps$props.className, autoUpload = _defaultProps$props.autoUpload, clearInput = _defaultProps$props.clearInput, onStart = _defaultProps$props.onStart, onDelete = _defaultProps$props.onDelete,
|
|
167
|
-
var
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
259
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, uploadIcon = _defaultProps$props.uploadIcon, uploadLabel = _defaultProps$props.uploadLabel, name = _defaultProps$props.name, accept = _defaultProps$props.accept, defaultValue = _defaultProps$props.defaultValue, value = _defaultProps$props.value, previewType = _defaultProps$props.previewType, fit = _defaultProps$props.fit, disabled = _defaultProps$props.disabled, multiple = _defaultProps$props.multiple, url = _defaultProps$props.url, previewUrl = _defaultProps$props.previewUrl, headers = _defaultProps$props.headers, timeout = _defaultProps$props.timeout, method = _defaultProps$props.method, xhrState = _defaultProps$props.xhrState, withCredentials = _defaultProps$props.withCredentials, data = _defaultProps$props.data, preview = _defaultProps$props.preview, deletable = _defaultProps$props.deletable, maxCount = _defaultProps$props.maxCount, capture = _defaultProps$props.capture, maxFileSize = _defaultProps$props.maxFileSize, className = _defaultProps$props.className, autoUpload = _defaultProps$props.autoUpload, clearInput = _defaultProps$props.clearInput, onStart = _defaultProps$props.onStart, onDelete = _defaultProps$props.onDelete, _onChange = _defaultProps$props.onChange, onFileItemClick = _defaultProps$props.onFileItemClick, onProgress = _defaultProps$props.onProgress, onSuccess = _defaultProps$props.onSuccess, onUpdate = _defaultProps$props.onUpdate, onFailure = _defaultProps$props.onFailure, onOversize = _defaultProps$props.onOversize, beforeUpload = _defaultProps$props.beforeUpload, beforeXhrUpload = _defaultProps$props.beforeXhrUpload, beforeDelete2 = _defaultProps$props.beforeDelete, restProps = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
260
|
+
var _usePropsValue = usePropsValue({
|
|
261
|
+
value,
|
|
262
|
+
defaultValue,
|
|
263
|
+
finalValue: [],
|
|
264
|
+
onChange: function onChange(v) {
|
|
265
|
+
_onChange === null || _onChange === void 0 ? void 0 : _onChange(v);
|
|
172
266
|
}
|
|
173
|
-
}, [
|
|
267
|
+
}), _usePropsValue2 = _slicedToArray(_usePropsValue, 2), fileList = _usePropsValue2[0], setFileList = _usePropsValue2[1];
|
|
268
|
+
var _useState = useState([]), _useState2 = _slicedToArray(_useState, 2), uploadQueue = _useState2[0], setUploadQueue = _useState2[1];
|
|
174
269
|
var classes = classNames(className, "nut-uploader");
|
|
175
270
|
useImperativeHandle(ref, function() {
|
|
176
271
|
return {
|
|
@@ -204,8 +299,9 @@ var InternalUploader = function InternalUploader2(props, ref) {
|
|
|
204
299
|
var uploadOption = new UploadOptions();
|
|
205
300
|
uploadOption.url = url;
|
|
206
301
|
for (var _i2 = 0, _Object$entries2 = Object.entries(data); _i2 < _Object$entries2.length; _i2++) {
|
|
302
|
+
var _fileItem$formData;
|
|
207
303
|
var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2), key = _Object$entries2$_i[0], value2 = _Object$entries2$_i[1];
|
|
208
|
-
fileItem.formData.append(key, value2);
|
|
304
|
+
(_fileItem$formData = fileItem.formData) === null || _fileItem$formData === void 0 ? void 0 : _fileItem$formData.append(key, value2);
|
|
209
305
|
}
|
|
210
306
|
uploadOption.formData = fileItem.formData;
|
|
211
307
|
uploadOption.timeout = timeout * 1;
|
|
@@ -215,77 +311,68 @@ var InternalUploader = function InternalUploader2(props, ref) {
|
|
|
215
311
|
uploadOption.withCredentials = withCredentials;
|
|
216
312
|
uploadOption.beforeXhrUpload = beforeXhrUpload;
|
|
217
313
|
try {
|
|
218
|
-
|
|
314
|
+
var _fileItem$formData2;
|
|
315
|
+
uploadOption.sourceFile = (_fileItem$formData2 = fileItem.formData) === null || _fileItem$formData2 === void 0 ? void 0 : _fileItem$formData2.get(name);
|
|
219
316
|
} catch (error) {
|
|
220
317
|
console.warn(error);
|
|
221
318
|
}
|
|
222
319
|
uploadOption.onStart = function(option) {
|
|
223
320
|
clearUploadQueue(index);
|
|
224
|
-
setFileList(function(
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
});
|
|
232
|
-
return _toConsumableArray(fileList2);
|
|
233
|
-
});
|
|
321
|
+
setFileList(fileList.map(function(item) {
|
|
322
|
+
if (item.uid === fileItem.uid) {
|
|
323
|
+
item.status = "ready";
|
|
324
|
+
item.message = locale.uploader.readyUpload;
|
|
325
|
+
}
|
|
326
|
+
return item;
|
|
327
|
+
}));
|
|
234
328
|
onStart && onStart(option);
|
|
235
329
|
};
|
|
236
330
|
uploadOption.onProgress = function(e, option) {
|
|
237
|
-
setFileList(function(
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
});
|
|
251
|
-
return _toConsumableArray(fileList2);
|
|
252
|
-
});
|
|
331
|
+
setFileList(fileList.map(function(item) {
|
|
332
|
+
if (item.uid === fileItem.uid) {
|
|
333
|
+
item.status = UPLOADING;
|
|
334
|
+
item.message = locale.uploader.uploading;
|
|
335
|
+
item.percentage = (e.loaded / e.total * 100).toFixed(0);
|
|
336
|
+
onProgress && onProgress({
|
|
337
|
+
e,
|
|
338
|
+
option,
|
|
339
|
+
percentage: item.percentage
|
|
340
|
+
});
|
|
341
|
+
}
|
|
342
|
+
return item;
|
|
343
|
+
}));
|
|
253
344
|
};
|
|
254
345
|
uploadOption.onSuccess = function(responseText, option) {
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
}
|
|
263
|
-
return item;
|
|
264
|
-
});
|
|
265
|
-
return _toConsumableArray(fileList2);
|
|
346
|
+
var list = fileList.map(function(item) {
|
|
347
|
+
if (item.uid === fileItem.uid) {
|
|
348
|
+
item.status = SUCCESS;
|
|
349
|
+
item.message = locale.uploader.success;
|
|
350
|
+
item.responseText = responseText;
|
|
351
|
+
}
|
|
352
|
+
return item;
|
|
266
353
|
});
|
|
267
|
-
|
|
354
|
+
setFileList(list);
|
|
355
|
+
onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(list);
|
|
356
|
+
onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess({
|
|
268
357
|
responseText,
|
|
269
358
|
option,
|
|
270
|
-
fileList
|
|
359
|
+
fileList: list
|
|
271
360
|
});
|
|
272
361
|
};
|
|
273
362
|
uploadOption.onFailure = function(responseText, option) {
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
return item;
|
|
282
|
-
});
|
|
283
|
-
return _toConsumableArray(fileList2);
|
|
363
|
+
var list = fileList.map(function(item) {
|
|
364
|
+
if (item.uid === fileItem.uid) {
|
|
365
|
+
item.status = ERROR;
|
|
366
|
+
item.message = locale.uploader.error;
|
|
367
|
+
item.responseText = responseText;
|
|
368
|
+
}
|
|
369
|
+
return item;
|
|
284
370
|
});
|
|
285
|
-
|
|
371
|
+
setFileList(list);
|
|
372
|
+
onFailure === null || onFailure === void 0 ? void 0 : onFailure({
|
|
286
373
|
responseText,
|
|
287
374
|
option,
|
|
288
|
-
fileList
|
|
375
|
+
fileList: list
|
|
289
376
|
});
|
|
290
377
|
};
|
|
291
378
|
var task = new Upload(uploadOption);
|
|
@@ -308,11 +395,7 @@ var InternalUploader = function InternalUploader2(props, ref) {
|
|
|
308
395
|
fileItem.type = file.type;
|
|
309
396
|
fileItem.formData = formData;
|
|
310
397
|
fileItem.uid = file.lastModified + fileItem.uid;
|
|
311
|
-
|
|
312
|
-
fileItem.message = locale.uploader.readyUpload;
|
|
313
|
-
} else {
|
|
314
|
-
fileItem.message = locale.uploader.waitingUpload;
|
|
315
|
-
}
|
|
398
|
+
fileItem.message = autoUpload ? locale.uploader.readyUpload : locale.uploader.waitingUpload;
|
|
316
399
|
executeUpload(fileItem, index);
|
|
317
400
|
if (preview && file.type.includes("image")) {
|
|
318
401
|
var reader = new FileReader();
|
|
@@ -323,8 +406,7 @@ var InternalUploader = function InternalUploader2(props, ref) {
|
|
|
323
406
|
};
|
|
324
407
|
reader.readAsDataURL(file);
|
|
325
408
|
} else {
|
|
326
|
-
|
|
327
|
-
setFileList(_toConsumableArray(fileList));
|
|
409
|
+
setFileList([].concat(_toConsumableArray(fileList), [fileItem]));
|
|
328
410
|
}
|
|
329
411
|
});
|
|
330
412
|
};
|
|
@@ -351,9 +433,11 @@ var InternalUploader = function InternalUploader2(props, ref) {
|
|
|
351
433
|
return filterFile;
|
|
352
434
|
};
|
|
353
435
|
var deleted = function deleted2(file, index) {
|
|
354
|
-
fileList.
|
|
355
|
-
|
|
356
|
-
|
|
436
|
+
var deletedFileList = fileList.filter(function(file2, idx) {
|
|
437
|
+
return idx !== index;
|
|
438
|
+
});
|
|
439
|
+
onDelete === null || onDelete === void 0 ? void 0 : onDelete(file, deletedFileList);
|
|
440
|
+
setFileList(deletedFileList);
|
|
357
441
|
};
|
|
358
442
|
var onDeleteItem = function onDeleteItem2(file, index) {
|
|
359
443
|
clearUploadQueue(index);
|
|
@@ -379,134 +463,50 @@ var InternalUploader = function InternalUploader2(props, ref) {
|
|
|
379
463
|
var _files = filterFiles(new Array().slice.call(files));
|
|
380
464
|
readFile(_files);
|
|
381
465
|
}
|
|
382
|
-
|
|
383
|
-
fileList,
|
|
384
|
-
event
|
|
385
|
-
});
|
|
466
|
+
setFileList(fileList);
|
|
386
467
|
if (clearInput) {
|
|
387
468
|
clearInputValue($el);
|
|
388
469
|
}
|
|
389
470
|
};
|
|
390
471
|
var handleItemClick = function handleItemClick2(file) {
|
|
391
|
-
onFileItemClick
|
|
472
|
+
onFileItemClick === null || onFileItemClick === void 0 ? void 0 : onFileItemClick(file);
|
|
392
473
|
};
|
|
393
474
|
return React__default.createElement("div", _objectSpread({
|
|
394
475
|
className: classes
|
|
395
476
|
}, restProps), (children || previewType === "list") && React__default.createElement("div", {
|
|
396
477
|
className: "nut-uploader__slot"
|
|
397
|
-
},
|
|
478
|
+
}, children || React__default.createElement(Button, {
|
|
398
479
|
size: "small",
|
|
399
480
|
type: "primary"
|
|
400
|
-
}, "上传文件"), maxCount > fileList.length && React__default.createElement(
|
|
401
|
-
className: "nut-uploader__input",
|
|
402
|
-
type: "file",
|
|
403
|
-
capture: "user",
|
|
404
|
-
name,
|
|
405
|
-
accept,
|
|
406
|
-
disabled,
|
|
407
|
-
multiple,
|
|
408
|
-
onChange: fileChange
|
|
409
|
-
}) : React__default.createElement("input", {
|
|
481
|
+
}, "上传文件"), maxCount > fileList.length && React__default.createElement("input", {
|
|
410
482
|
className: "nut-uploader__input",
|
|
411
483
|
type: "file",
|
|
484
|
+
capture,
|
|
412
485
|
name,
|
|
413
486
|
accept,
|
|
414
487
|
disabled,
|
|
415
488
|
multiple,
|
|
416
489
|
onChange: fileChange
|
|
417
|
-
}))
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
}, item.status === "ready" ? React__default.createElement("div", {
|
|
430
|
-
className: "nut-uploader__preview__progress"
|
|
431
|
-
}, React__default.createElement("div", {
|
|
432
|
-
className: "nut-uploader__preview__progress__msg"
|
|
433
|
-
}, item.message)) : item.status !== "success" && React__default.createElement("div", {
|
|
434
|
-
className: "nut-uploader__preview__progress"
|
|
435
|
-
}, item.failIcon !== " " && item.loadingIcon !== " " && (item.status === "error" ? item.failIcon || React__default.createElement(Failure, {
|
|
436
|
-
color: "#fff"
|
|
437
|
-
}) : item.loadingIcon || React__default.createElement(Loading, {
|
|
438
|
-
className: "nut-icon-loading",
|
|
439
|
-
color: "#fff"
|
|
440
|
-
})), React__default.createElement("div", {
|
|
441
|
-
className: "nut-uploader__preview__progress__msg"
|
|
442
|
-
}, item.message)), item.type.includes("image") ? React__default.createElement(React__default.Fragment, null, item.url && React__default.createElement("img", {
|
|
443
|
-
className: "nut-uploader__preview-img__c",
|
|
444
|
-
style: {
|
|
445
|
-
objectFit: fit
|
|
446
|
-
},
|
|
447
|
-
src: item.url,
|
|
448
|
-
alt: "",
|
|
449
|
-
onClick: function onClick() {
|
|
450
|
-
return handleItemClick(item);
|
|
451
|
-
}
|
|
452
|
-
})) : React__default.createElement(React__default.Fragment, null, previewUrl ? React__default.createElement("img", {
|
|
453
|
-
className: "nut-uploader__preview-img__c",
|
|
454
|
-
src: previewUrl,
|
|
455
|
-
alt: "",
|
|
456
|
-
onClick: function onClick() {
|
|
457
|
-
return handleItemClick(item);
|
|
458
|
-
}
|
|
459
|
-
}) : React__default.createElement("div", {
|
|
460
|
-
className: "nut-uploader__preview-img__file"
|
|
461
|
-
}, React__default.createElement("div", {
|
|
462
|
-
onClick: function onClick() {
|
|
463
|
-
return handleItemClick(item);
|
|
464
|
-
},
|
|
465
|
-
className: "nut-uploader__preview-img__file__name"
|
|
466
|
-
}, React__default.createElement(Link, {
|
|
467
|
-
color: "#808080"
|
|
468
|
-
}), React__default.createElement("span", null, " ", item.name)))), item.status === "success" ? React__default.createElement("div", {
|
|
469
|
-
className: "tips"
|
|
470
|
-
}, item.name) : null), previewType === "list" && React__default.createElement("div", {
|
|
471
|
-
className: "nut-uploader__preview-list"
|
|
472
|
-
}, React__default.createElement("div", {
|
|
473
|
-
className: "nut-uploader__preview-img__file__name ".concat(item.status),
|
|
474
|
-
onClick: function onClick() {
|
|
475
|
-
return handleItemClick(item);
|
|
476
|
-
}
|
|
477
|
-
}, React__default.createElement(Link, null), React__default.createElement("span", null, " ", item.name)), deletable && React__default.createElement(Del, {
|
|
478
|
-
color: "#808080",
|
|
479
|
-
className: "nut-uploader__preview-img__file__del",
|
|
480
|
-
onClick: function onClick() {
|
|
481
|
-
return onDeleteItem(item, index);
|
|
482
|
-
}
|
|
483
|
-
}), item.status === "uploading" && React__default.createElement(Progress, {
|
|
484
|
-
percent: item.percentage,
|
|
485
|
-
color: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
|
|
486
|
-
showText: false
|
|
487
|
-
})));
|
|
488
|
-
}), maxCount > fileList.length && previewType === "picture" && !children && React__default.createElement("div", {
|
|
489
|
-
className: "nut-uploader__upload ".concat(previewType, " ").concat(disabled ? "nut-uploader__upload-disabled" : "")
|
|
490
|
+
})), React__default.createElement(Preview, _objectSpread({}, {
|
|
491
|
+
fileList,
|
|
492
|
+
previewType,
|
|
493
|
+
deletable,
|
|
494
|
+
onDeleteItem,
|
|
495
|
+
handleItemClick,
|
|
496
|
+
previewUrl,
|
|
497
|
+
children
|
|
498
|
+
})), maxCount > fileList.length && previewType === "picture" && !children && React__default.createElement("div", {
|
|
499
|
+
className: classNames("nut-uploader__upload", previewType, {
|
|
500
|
+
"nut-uploader__upload-disabled": disabled
|
|
501
|
+
})
|
|
490
502
|
}, React__default.createElement("div", {
|
|
491
503
|
className: "nut-uploader__icon"
|
|
492
|
-
}, uploadIcon
|
|
493
|
-
width: "20px",
|
|
494
|
-
height: "20px",
|
|
495
|
-
color: "#808080"
|
|
496
|
-
}), React__default.createElement("span", {
|
|
504
|
+
}, uploadIcon, React__default.createElement("span", {
|
|
497
505
|
className: "nut-uploader__icon-tip"
|
|
498
|
-
}, uploadLabel)),
|
|
499
|
-
className: "nut-uploader__input",
|
|
500
|
-
type: "file",
|
|
501
|
-
capture: "user",
|
|
502
|
-
name,
|
|
503
|
-
accept,
|
|
504
|
-
disabled,
|
|
505
|
-
multiple,
|
|
506
|
-
onChange: fileChange
|
|
507
|
-
}) : React__default.createElement("input", {
|
|
506
|
+
}, uploadLabel)), React__default.createElement("input", {
|
|
508
507
|
className: "nut-uploader__input",
|
|
509
508
|
type: "file",
|
|
509
|
+
capture,
|
|
510
510
|
name,
|
|
511
511
|
accept,
|
|
512
512
|
disabled,
|
package/dist/esm/menuitem2.js
CHANGED
|
@@ -108,10 +108,12 @@ var MenuItem = forwardRef(function(props, ref) {
|
|
|
108
108
|
});
|
|
109
109
|
};
|
|
110
110
|
useEffect(function() {
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
111
|
+
if (!parent.lockScroll) {
|
|
112
|
+
scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.addEventListener("scroll", getParentOffset, false);
|
|
113
|
+
return function() {
|
|
114
|
+
scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.removeEventListener("scroll", getParentOffset, false);
|
|
115
|
+
};
|
|
116
|
+
}
|
|
115
117
|
}, []);
|
|
116
118
|
var getPosition = function getPosition2() {
|
|
117
119
|
return direction === "down" ? {
|
|
@@ -1,19 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import '@/packages/uploader/demo.scss';
|
|
3
|
-
export type FileItemStatus = 'ready' | 'uploading' | 'success' | 'error' | 'removed';
|
|
4
|
-
export type FileType<T> = {
|
|
5
|
-
[key: string]: T;
|
|
6
|
-
};
|
|
7
|
-
export declare class FileItem {
|
|
8
|
-
status: FileItemStatus;
|
|
9
|
-
message: string;
|
|
10
|
-
uid: string;
|
|
11
|
-
name?: string;
|
|
12
|
-
url?: string;
|
|
13
|
-
path?: string;
|
|
14
|
-
type?: string;
|
|
15
|
-
percentage: string | number;
|
|
16
|
-
formData: FormData;
|
|
17
|
-
}
|
|
18
3
|
declare const UploaderDemo: () => JSX.Element;
|
|
19
4
|
export default UploaderDemo;
|