@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.
@@ -6,7 +6,7 @@ var __publicField = (obj, key, value) => {
6
6
  };
7
7
  var _a;
8
8
  /*!
9
- * @nutui/nutui-react v2.0.19-beta.0 Mon Sep 25 2023 18:01:43 GMT+0800 (China Standard Time)
9
+ * @nutui/nutui-react v2.0.19 Wed Sep 27 2023 18:11:25 GMT+0800 (China Standard Time)
10
10
  * (c) 2023 @jdf2e.
11
11
  * Released under the MIT License.
12
12
  */
@@ -17414,10 +17414,12 @@ const MenuItem = forwardRef((props, ref) => {
17414
17414
  });
17415
17415
  };
17416
17416
  useEffect(() => {
17417
- scrollParent == null ? void 0 : scrollParent.addEventListener("scroll", getParentOffset, false);
17418
- return () => {
17419
- scrollParent == null ? void 0 : scrollParent.removeEventListener("scroll", getParentOffset, false);
17420
- };
17417
+ if (!parent.lockScroll) {
17418
+ scrollParent == null ? void 0 : scrollParent.addEventListener("scroll", getParentOffset, false);
17419
+ return () => {
17420
+ scrollParent == null ? void 0 : scrollParent.removeEventListener("scroll", getParentOffset, false);
17421
+ };
17422
+ }
17421
17423
  }, []);
17422
17424
  const getPosition = () => {
17423
17425
  return direction === "down" ? {
@@ -18984,6 +18986,99 @@ const TextArea = (props) => {
18984
18986
  };
18985
18987
  TextArea.defaultProps = defaultProps$H;
18986
18988
  TextArea.displayName = "NutTextArea";
18989
+ class UploadOptions {
18990
+ constructor() {
18991
+ __publicField(this, "url", "");
18992
+ __publicField(this, "name", "file");
18993
+ __publicField(this, "fileType", "image");
18994
+ __publicField(this, "formData");
18995
+ __publicField(this, "sourceFile");
18996
+ __publicField(this, "method", "post");
18997
+ __publicField(this, "xhrState", 200);
18998
+ __publicField(this, "timeout", 30 * 1e3);
18999
+ __publicField(this, "headers", {});
19000
+ __publicField(this, "withCredentials", false);
19001
+ __publicField(this, "onStart");
19002
+ __publicField(this, "taroFilePath");
19003
+ __publicField(this, "onProgress");
19004
+ __publicField(this, "onSuccess");
19005
+ __publicField(this, "onFailure");
19006
+ __publicField(this, "beforeXhrUpload");
19007
+ }
19008
+ }
19009
+ const UPLOADING = "uploading";
19010
+ const SUCCESS = "success";
19011
+ const ERROR = "error";
19012
+ class Upload {
19013
+ constructor(options2) {
19014
+ __publicField(this, "options");
19015
+ this.options = options2;
19016
+ }
19017
+ upload() {
19018
+ var _a2;
19019
+ const { options: options2 } = this;
19020
+ const xhr = new XMLHttpRequest();
19021
+ xhr.timeout = options2.timeout;
19022
+ if (xhr.upload) {
19023
+ xhr.upload.addEventListener(
19024
+ "progress",
19025
+ (e) => {
19026
+ var _a3;
19027
+ (_a3 = options2.onProgress) == null ? void 0 : _a3.call(options2, e, options2);
19028
+ },
19029
+ false
19030
+ );
19031
+ xhr.onreadystatechange = () => {
19032
+ var _a3, _b;
19033
+ if (xhr.readyState === 4) {
19034
+ if (xhr.status === options2.xhrState) {
19035
+ (_a3 = options2.onSuccess) == null ? void 0 : _a3.call(options2, xhr.responseText, options2);
19036
+ } else {
19037
+ (_b = options2.onFailure) == null ? void 0 : _b.call(options2, xhr.responseText, options2);
19038
+ }
19039
+ }
19040
+ };
19041
+ xhr.withCredentials = options2.withCredentials;
19042
+ xhr.open(options2.method, options2.url, true);
19043
+ for (const [key, value] of Object.entries(options2.headers)) {
19044
+ xhr.setRequestHeader(key, value);
19045
+ }
19046
+ (_a2 = options2.onStart) == null ? void 0 : _a2.call(options2, options2);
19047
+ if (options2.beforeXhrUpload) {
19048
+ options2.beforeXhrUpload(xhr, options2);
19049
+ } else {
19050
+ xhr.send(options2.formData);
19051
+ }
19052
+ } else {
19053
+ console.warn("浏览器不支持 XMLHttpRequest");
19054
+ }
19055
+ }
19056
+ }
19057
+ const funcInterceptor = (interceptor, {
19058
+ args = [],
19059
+ done,
19060
+ canceled
19061
+ }) => {
19062
+ if (interceptor) {
19063
+ const returnVal = interceptor.apply(null, args);
19064
+ if (isPromise(returnVal)) {
19065
+ returnVal.then((value) => {
19066
+ if (value) {
19067
+ done(value);
19068
+ } else if (canceled) {
19069
+ canceled();
19070
+ }
19071
+ }).catch(() => {
19072
+ });
19073
+ } else if (returnVal) {
19074
+ done();
19075
+ } else if (canceled) {
19076
+ canceled();
19077
+ }
19078
+ } else {
19079
+ done();
19080
+ }
19081
+ };
18987
19082
  const defaultProps$G = {
18988
19083
  ...ComponentDefaults,
18989
19084
  percent: 0,
@@ -19104,96 +19199,105 @@ const Progress = (props) => {
19104
19199
  };
19105
19200
  Progress.defaultProps = defaultProps$G;
19106
19201
  Progress.displayName = "NutProgress";
19107
- class UploadOptions {
19108
- constructor() {
19109
- __publicField(this, "url", "");
19110
- __publicField(this, "name", "file");
19111
- __publicField(this, "fileType", "image");
19112
- __publicField(this, "formData");
19113
- __publicField(this, "sourceFile");
19114
- __publicField(this, "method", "post");
19115
- __publicField(this, "xhrState", 200);
19116
- __publicField(this, "timeout", 30 * 1e3);
19117
- __publicField(this, "headers", {});
19118
- __publicField(this, "withCredentials", false);
19119
- __publicField(this, "onStart");
19120
- __publicField(this, "taroFilePath");
19121
- __publicField(this, "onProgress");
19122
- __publicField(this, "onSuccess");
19123
- __publicField(this, "onFailure");
19124
- __publicField(this, "beforeXhrUpload");
19125
- }
19126
- }
19127
- class Upload {
19128
- constructor(options2) {
19129
- __publicField(this, "options");
19130
- this.options = options2;
19131
- }
19132
- upload() {
19202
+ const Preview = ({
19203
+ fileList,
19204
+ previewType,
19205
+ deletable,
19206
+ onDeleteItem,
19207
+ handleItemClick,
19208
+ previewUrl,
19209
+ children
19210
+ }) => {
19211
+ const renderIcon = (item) => {
19212
+ if (item.status === ERROR) {
19213
+ return item.failIcon || /* @__PURE__ */ React__default.createElement(x$9, { color: "#fff" });
19214
+ }
19215
+ return item.loadingIcon || /* @__PURE__ */ React__default.createElement(k$3, { className: "nut-icon-loading", color: "#fff" });
19216
+ };
19217
+ return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, fileList.length !== 0 && fileList.map((item, index) => {
19133
19218
  var _a2;
19134
- const { options: options2 } = this;
19135
- const xhr = new XMLHttpRequest();
19136
- xhr.timeout = options2.timeout;
19137
- if (xhr.upload) {
19138
- xhr.upload.addEventListener(
19139
- "progress",
19140
- (e) => {
19141
- var _a3;
19142
- (_a3 = options2.onProgress) == null ? void 0 : _a3.call(options2, e, options2);
19219
+ return /* @__PURE__ */ React__default.createElement(
19220
+ "div",
19221
+ {
19222
+ className: `nut-uploader__preview ${previewType}`,
19223
+ key: item.uid
19224
+ },
19225
+ previewType === "picture" && deletable && /* @__PURE__ */ React__default.createElement(
19226
+ x$9,
19227
+ {
19228
+ color: "rgba(0,0,0,0.6)",
19229
+ className: "close",
19230
+ onClick: () => onDeleteItem(item, index)
19231
+ }
19232
+ ),
19233
+ previewType === "picture" && !children && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview-img" }, item.status === "ready" ? /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress__msg" }, item.message)) : item.status !== "success" && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress" }, renderIcon(item), /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress__msg" }, item.message)), ((_a2 = item.type) == null ? void 0 : _a2.includes("image")) ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, item.url && /* @__PURE__ */ React__default.createElement(
19234
+ "img",
19235
+ {
19236
+ className: "nut-uploader__preview-img__c",
19237
+ style: { objectFit: "fill" },
19238
+ src: item.url,
19239
+ alt: "",
19240
+ onClick: () => handleItemClick(item)
19241
+ }
19242
+ )) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, previewUrl ? /* @__PURE__ */ React__default.createElement(
19243
+ "img",
19244
+ {
19245
+ className: "nut-uploader__preview-img__c",
19246
+ src: previewUrl,
19247
+ alt: "",
19248
+ onClick: () => handleItemClick(item)
19249
+ }
19250
+ ) : /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview-img__file" }, /* @__PURE__ */ React__default.createElement(
19251
+ "div",
19252
+ {
19253
+ onClick: () => handleItemClick(item),
19254
+ className: "nut-uploader__preview-img__file__name"
19143
19255
  },
19144
- false
19145
- );
19146
- xhr.onreadystatechange = () => {
19147
- var _a3, _b;
19148
- if (xhr.readyState === 4) {
19149
- if (xhr.status === options2.xhrState) {
19150
- (_a3 = options2.onSuccess) == null ? void 0 : _a3.call(options2, xhr.responseText, options2);
19151
- } else {
19152
- (_b = options2.onFailure) == null ? void 0 : _b.call(options2, xhr.responseText, options2);
19153
- }
19256
+ /* @__PURE__ */ React__default.createElement(x$6, { color: "#808080" }),
19257
+ /* @__PURE__ */ React__default.createElement("span", null, " ", item.name)
19258
+ ))), item.status === "success" ? /* @__PURE__ */ React__default.createElement("div", { className: "tips" }, item.name) : null),
19259
+ previewType === "list" && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview-list" }, /* @__PURE__ */ React__default.createElement(
19260
+ "div",
19261
+ {
19262
+ className: `nut-uploader__preview-img__file__name ${item.status}`,
19263
+ onClick: () => handleItemClick(item)
19264
+ },
19265
+ /* @__PURE__ */ React__default.createElement(x$6, null),
19266
+ /* @__PURE__ */ React__default.createElement("span", null, " ", item.name)
19267
+ ), deletable && /* @__PURE__ */ React__default.createElement(
19268
+ y$8,
19269
+ {
19270
+ color: "#808080",
19271
+ className: "nut-uploader__preview-img__file__del",
19272
+ onClick: () => onDeleteItem(item, index)
19154
19273
  }
19155
- };
19156
- xhr.withCredentials = options2.withCredentials;
19157
- xhr.open(options2.method, options2.url, true);
19158
- for (const [key, value] of Object.entries(options2.headers)) {
19159
- xhr.setRequestHeader(key, value);
19160
- }
19161
- (_a2 = options2.onStart) == null ? void 0 : _a2.call(options2, options2);
19162
- if (options2.beforeXhrUpload) {
19163
- options2.beforeXhrUpload(xhr, options2);
19164
- } else {
19165
- xhr.send(options2.formData);
19166
- }
19167
- } else {
19168
- console.warn("浏览器不支持 XMLHttpRequest");
19169
- }
19170
- }
19171
- }
19172
- const funcInterceptor = (interceptor, {
19173
- args = [],
19174
- done,
19175
- canceled
19176
- }) => {
19177
- if (interceptor) {
19178
- const returnVal = interceptor.apply(null, args);
19179
- if (isPromise(returnVal)) {
19180
- returnVal.then((value) => {
19181
- if (value) {
19182
- done(value);
19183
- } else if (canceled) {
19184
- canceled();
19274
+ ), item.status === "uploading" && /* @__PURE__ */ React__default.createElement(
19275
+ Progress,
19276
+ {
19277
+ percent: item.percentage,
19278
+ color: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
19279
+ showText: false
19185
19280
  }
19186
- }).catch(() => {
19187
- });
19188
- } else if (returnVal) {
19189
- done();
19190
- } else if (canceled) {
19191
- canceled();
19192
- }
19193
- } else {
19194
- done();
19195
- }
19281
+ ))
19282
+ );
19283
+ }));
19196
19284
  };
19285
+ class FileItem {
19286
+ constructor() {
19287
+ __publicField(this, "status", "ready");
19288
+ __publicField(this, "message", "准备中..");
19289
+ __publicField(this, "uid", (/* @__PURE__ */ new Date()).getTime().toString());
19290
+ __publicField(this, "name");
19291
+ __publicField(this, "url");
19292
+ __publicField(this, "type");
19293
+ __publicField(this, "path");
19294
+ __publicField(this, "percentage", 0);
19295
+ __publicField(this, "formData", {});
19296
+ __publicField(this, "responseText");
19297
+ __publicField(this, "loadingIcon");
19298
+ __publicField(this, "failIcon");
19299
+ }
19300
+ }
19197
19301
  const defaultProps$F = {
19198
19302
  ...ComponentDefaults,
19199
19303
  url: "",
@@ -19216,24 +19320,11 @@ const defaultProps$F = {
19216
19320
  preview: true,
19217
19321
  deletable: true,
19218
19322
  capture: false,
19323
+ uploadIcon: /* @__PURE__ */ React__default.createElement(x$3, { width: "20px", height: "20px", color: "#808080" }),
19219
19324
  beforeDelete: (file, files) => {
19220
19325
  return true;
19221
19326
  }
19222
19327
  };
19223
- class FileItem {
19224
- constructor() {
19225
- __publicField(this, "status", "ready");
19226
- __publicField(this, "message", "准备中..");
19227
- __publicField(this, "uid", (/* @__PURE__ */ new Date()).getTime().toString());
19228
- __publicField(this, "name");
19229
- __publicField(this, "url");
19230
- __publicField(this, "type");
19231
- __publicField(this, "path");
19232
- __publicField(this, "percentage", 0);
19233
- __publicField(this, "formData", new FormData());
19234
- __publicField(this, "responseText");
19235
- }
19236
- }
19237
19328
  const InternalUploader = (props, ref) => {
19238
19329
  const { locale } = useConfig();
19239
19330
  const {
@@ -19278,13 +19369,15 @@ const InternalUploader = (props, ref) => {
19278
19369
  beforeDelete,
19279
19370
  ...restProps
19280
19371
  } = { ...defaultProps$F, ...props };
19281
- const [fileList, setFileList] = useState(defaultValue || []);
19282
- const [uploadQueue, setUploadQueue] = useState([]);
19283
- useEffect(() => {
19284
- if (value) {
19285
- setFileList(value);
19372
+ const [fileList, setFileList] = usePropsValue({
19373
+ value,
19374
+ defaultValue,
19375
+ finalValue: [],
19376
+ onChange: (v) => {
19377
+ onChange == null ? void 0 : onChange(v);
19286
19378
  }
19287
- }, [value]);
19379
+ });
19380
+ const [uploadQueue, setUploadQueue] = useState([]);
19288
19381
  const classes = classNames(className, "nut-uploader");
19289
19382
  useImperativeHandle(ref, () => ({
19290
19383
  submit: () => {
@@ -19310,10 +19403,11 @@ const InternalUploader = (props, ref) => {
19310
19403
  el.value = "";
19311
19404
  };
19312
19405
  const executeUpload = (fileItem, index) => {
19406
+ var _a2, _b;
19313
19407
  const uploadOption = new UploadOptions();
19314
19408
  uploadOption.url = url2;
19315
19409
  for (const [key, value2] of Object.entries(data)) {
19316
- fileItem.formData.append(key, value2);
19410
+ (_a2 = fileItem.formData) == null ? void 0 : _a2.append(key, value2);
19317
19411
  }
19318
19412
  uploadOption.formData = fileItem.formData;
19319
19413
  uploadOption.timeout = timeout2 * 1;
@@ -19323,73 +19417,67 @@ const InternalUploader = (props, ref) => {
19323
19417
  uploadOption.withCredentials = withCredentials;
19324
19418
  uploadOption.beforeXhrUpload = beforeXhrUpload;
19325
19419
  try {
19326
- uploadOption.sourceFile = fileItem.formData.get(name);
19420
+ uploadOption.sourceFile = (_b = fileItem.formData) == null ? void 0 : _b.get(name);
19327
19421
  } catch (error) {
19328
19422
  console.warn(error);
19329
19423
  }
19330
19424
  uploadOption.onStart = (option) => {
19331
19425
  clearUploadQueue(index);
19332
- setFileList((fileList2) => {
19333
- fileList2.map((item) => {
19426
+ setFileList(
19427
+ fileList.map((item) => {
19334
19428
  if (item.uid === fileItem.uid) {
19335
19429
  item.status = "ready";
19336
19430
  item.message = locale.uploader.readyUpload;
19337
19431
  }
19338
19432
  return item;
19339
- });
19340
- return [...fileList2];
19341
- });
19433
+ })
19434
+ );
19342
19435
  onStart && onStart(option);
19343
19436
  };
19344
19437
  uploadOption.onProgress = (e, option) => {
19345
- setFileList((fileList2) => {
19346
- fileList2.map((item) => {
19438
+ setFileList(
19439
+ fileList.map((item) => {
19347
19440
  if (item.uid === fileItem.uid) {
19348
- item.status = "uploading";
19441
+ item.status = UPLOADING;
19349
19442
  item.message = locale.uploader.uploading;
19350
19443
  item.percentage = (e.loaded / e.total * 100).toFixed(0);
19351
19444
  onProgress && onProgress({ e, option, percentage: item.percentage });
19352
19445
  }
19353
19446
  return item;
19354
- });
19355
- return [...fileList2];
19356
- });
19447
+ })
19448
+ );
19357
19449
  };
19358
19450
  uploadOption.onSuccess = (responseText, option) => {
19359
- setFileList((fileList2) => {
19360
- onUpdate && onUpdate(fileList2);
19361
- fileList2.map((item) => {
19362
- if (item.uid === fileItem.uid) {
19363
- item.status = "success";
19364
- item.message = locale.uploader.success;
19365
- item.responseText = responseText;
19366
- }
19367
- return item;
19368
- });
19369
- return [...fileList2];
19451
+ const list = fileList.map((item) => {
19452
+ if (item.uid === fileItem.uid) {
19453
+ item.status = SUCCESS;
19454
+ item.message = locale.uploader.success;
19455
+ item.responseText = responseText;
19456
+ }
19457
+ return item;
19370
19458
  });
19371
- onSuccess && onSuccess({
19459
+ setFileList(list);
19460
+ onUpdate == null ? void 0 : onUpdate(list);
19461
+ onSuccess == null ? void 0 : onSuccess({
19372
19462
  responseText,
19373
19463
  option,
19374
- fileList
19464
+ fileList: list
19375
19465
  });
19376
19466
  };
19377
19467
  uploadOption.onFailure = (responseText, option) => {
19378
- setFileList((fileList2) => {
19379
- fileList2.map((item) => {
19380
- if (item.uid === fileItem.uid) {
19381
- item.status = "error";
19382
- item.message = locale.uploader.error;
19383
- item.responseText = responseText;
19384
- }
19385
- return item;
19386
- });
19387
- return [...fileList2];
19468
+ const list = fileList.map((item) => {
19469
+ if (item.uid === fileItem.uid) {
19470
+ item.status = ERROR;
19471
+ item.message = locale.uploader.error;
19472
+ item.responseText = responseText;
19473
+ }
19474
+ return item;
19388
19475
  });
19389
- onFailure && onFailure({
19476
+ setFileList(list);
19477
+ onFailure == null ? void 0 : onFailure({
19390
19478
  responseText,
19391
19479
  option,
19392
- fileList
19480
+ fileList: list
19393
19481
  });
19394
19482
  };
19395
19483
  const task = new Upload(uploadOption);
@@ -19414,11 +19502,7 @@ const InternalUploader = (props, ref) => {
19414
19502
  fileItem.type = file.type;
19415
19503
  fileItem.formData = formData;
19416
19504
  fileItem.uid = file.lastModified + fileItem.uid;
19417
- if (autoUpload) {
19418
- fileItem.message = locale.uploader.readyUpload;
19419
- } else {
19420
- fileItem.message = locale.uploader.waitingUpload;
19421
- }
19505
+ fileItem.message = autoUpload ? locale.uploader.readyUpload : locale.uploader.waitingUpload;
19422
19506
  executeUpload(fileItem, index);
19423
19507
  if (preview && file.type.includes("image")) {
19424
19508
  const reader = new FileReader();
@@ -19429,8 +19513,7 @@ const InternalUploader = (props, ref) => {
19429
19513
  };
19430
19514
  reader.readAsDataURL(file);
19431
19515
  } else {
19432
- fileList.push(fileItem);
19433
- setFileList([...fileList]);
19516
+ setFileList([...fileList, fileItem]);
19434
19517
  }
19435
19518
  });
19436
19519
  };
@@ -19457,9 +19540,9 @@ const InternalUploader = (props, ref) => {
19457
19540
  return filterFile;
19458
19541
  };
19459
19542
  const deleted = (file, index) => {
19460
- fileList.splice(index, 1);
19461
- onDelete && onDelete(file, fileList);
19462
- setFileList([...fileList]);
19543
+ const deletedFileList = fileList.filter((file2, idx) => idx !== index);
19544
+ onDelete == null ? void 0 : onDelete(file, deletedFileList);
19545
+ setFileList(deletedFileList);
19463
19546
  };
19464
19547
  const onDeleteItem = (file, index) => {
19465
19548
  clearUploadQueue(index);
@@ -19485,131 +19568,53 @@ const InternalUploader = (props, ref) => {
19485
19568
  const _files = filterFiles(new Array().slice.call(files));
19486
19569
  readFile(_files);
19487
19570
  }
19488
- onChange && onChange({ fileList, event });
19571
+ setFileList(fileList);
19489
19572
  if (clearInput) {
19490
19573
  clearInputValue($el);
19491
19574
  }
19492
19575
  };
19493
19576
  const handleItemClick = (file) => {
19494
- onFileItemClick && onFileItemClick(file);
19577
+ onFileItemClick == null ? void 0 : onFileItemClick(file);
19495
19578
  };
19496
- return /* @__PURE__ */ React__default.createElement("div", { className: classes, ...restProps }, (children || previewType === "list") && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__slot" }, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children || /* @__PURE__ */ React__default.createElement(Button, { size: "small", type: "primary" }, "上传文件"), maxCount > fileList.length && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, capture ? /* @__PURE__ */ React__default.createElement(
19579
+ return /* @__PURE__ */ React__default.createElement("div", { className: classes, ...restProps }, (children || previewType === "list") && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__slot" }, children || /* @__PURE__ */ React__default.createElement(Button, { size: "small", type: "primary" }, "上传文件"), maxCount > fileList.length && /* @__PURE__ */ React__default.createElement(
19497
19580
  "input",
19498
19581
  {
19499
19582
  className: "nut-uploader__input",
19500
19583
  type: "file",
19501
- capture: "user",
19584
+ capture,
19502
19585
  name,
19503
19586
  accept,
19504
19587
  disabled,
19505
19588
  multiple,
19506
19589
  onChange: fileChange
19507
19590
  }
19508
- ) : /* @__PURE__ */ React__default.createElement(
19509
- "input",
19591
+ )), /* @__PURE__ */ React__default.createElement(
19592
+ Preview,
19510
19593
  {
19511
- className: "nut-uploader__input",
19512
- type: "file",
19513
- name,
19514
- accept,
19515
- disabled,
19516
- multiple,
19517
- onChange: fileChange
19594
+ ...{
19595
+ fileList,
19596
+ previewType,
19597
+ deletable,
19598
+ onDeleteItem,
19599
+ handleItemClick,
19600
+ previewUrl,
19601
+ children
19602
+ }
19518
19603
  }
19519
- )))), fileList.length !== 0 && Array.isArray(fileList) && fileList.map((item, index) => {
19520
- return /* @__PURE__ */ React__default.createElement(
19521
- "div",
19522
- {
19523
- className: `nut-uploader__preview ${previewType}`,
19524
- key: item.uid
19525
- },
19526
- previewType === "picture" && deletable && /* @__PURE__ */ React__default.createElement(
19527
- x$9,
19528
- {
19529
- color: "rgba(0,0,0,0.6)",
19530
- className: "close",
19531
- onClick: () => onDeleteItem(item, index)
19532
- }
19533
- ),
19534
- previewType === "picture" && !children && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview-img" }, item.status === "ready" ? /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress__msg" }, item.message)) : item.status !== "success" && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress" }, item.failIcon !== " " && item.loadingIcon !== " " && (item.status === "error" ? item.failIcon || /* @__PURE__ */ React__default.createElement(x$9, { color: "#fff" }) : item.loadingIcon || /* @__PURE__ */ React__default.createElement(
19535
- k$3,
19536
- {
19537
- className: "nut-icon-loading",
19538
- color: "#fff"
19539
- }
19540
- )), /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview__progress__msg" }, item.message)), item.type.includes("image") ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, item.url && /* @__PURE__ */ React__default.createElement(
19541
- "img",
19542
- {
19543
- className: "nut-uploader__preview-img__c",
19544
- style: { objectFit: fit },
19545
- src: item.url,
19546
- alt: "",
19547
- onClick: () => handleItemClick(item)
19548
- }
19549
- )) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, previewUrl ? /* @__PURE__ */ React__default.createElement(
19550
- "img",
19551
- {
19552
- className: "nut-uploader__preview-img__c",
19553
- src: previewUrl,
19554
- alt: "",
19555
- onClick: () => handleItemClick(item)
19556
- }
19557
- ) : /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview-img__file" }, /* @__PURE__ */ React__default.createElement(
19558
- "div",
19559
- {
19560
- onClick: () => handleItemClick(item),
19561
- className: "nut-uploader__preview-img__file__name"
19562
- },
19563
- /* @__PURE__ */ React__default.createElement(x$6, { color: "#808080" }),
19564
- /* @__PURE__ */ React__default.createElement("span", null, " ", item.name)
19565
- ))), item.status === "success" ? /* @__PURE__ */ React__default.createElement("div", { className: "tips" }, item.name) : null),
19566
- previewType === "list" && /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__preview-list" }, /* @__PURE__ */ React__default.createElement(
19567
- "div",
19568
- {
19569
- className: `nut-uploader__preview-img__file__name ${item.status}`,
19570
- onClick: () => handleItemClick(item)
19571
- },
19572
- /* @__PURE__ */ React__default.createElement(x$6, null),
19573
- /* @__PURE__ */ React__default.createElement("span", null, " ", item.name)
19574
- ), deletable && /* @__PURE__ */ React__default.createElement(
19575
- y$8,
19576
- {
19577
- color: "#808080",
19578
- className: "nut-uploader__preview-img__file__del",
19579
- onClick: () => onDeleteItem(item, index)
19580
- }
19581
- ), item.status === "uploading" && /* @__PURE__ */ React__default.createElement(
19582
- Progress,
19583
- {
19584
- percent: item.percentage,
19585
- color: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
19586
- showText: false
19587
- }
19588
- ))
19589
- );
19590
- }), maxCount > fileList.length && previewType === "picture" && !children && /* @__PURE__ */ React__default.createElement(
19604
+ ), maxCount > fileList.length && previewType === "picture" && !children && /* @__PURE__ */ React__default.createElement(
19591
19605
  "div",
19592
19606
  {
19593
- className: `nut-uploader__upload ${previewType} ${disabled ? "nut-uploader__upload-disabled" : ""}`
19607
+ className: classNames("nut-uploader__upload", previewType, {
19608
+ "nut-uploader__upload-disabled": disabled
19609
+ })
19594
19610
  },
19595
- /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__icon" }, uploadIcon || /* @__PURE__ */ React__default.createElement(x$3, { width: "20px", height: "20px", color: "#808080" }), /* @__PURE__ */ React__default.createElement("span", { className: "nut-uploader__icon-tip" }, uploadLabel)),
19596
- capture ? /* @__PURE__ */ React__default.createElement(
19597
- "input",
19598
- {
19599
- className: "nut-uploader__input",
19600
- type: "file",
19601
- capture: "user",
19602
- name,
19603
- accept,
19604
- disabled,
19605
- multiple,
19606
- onChange: fileChange
19607
- }
19608
- ) : /* @__PURE__ */ React__default.createElement(
19611
+ /* @__PURE__ */ React__default.createElement("div", { className: "nut-uploader__icon" }, uploadIcon, /* @__PURE__ */ React__default.createElement("span", { className: "nut-uploader__icon-tip" }, uploadLabel)),
19612
+ /* @__PURE__ */ React__default.createElement(
19609
19613
  "input",
19610
19614
  {
19611
19615
  className: "nut-uploader__input",
19612
19616
  type: "file",
19617
+ capture,
19613
19618
  name,
19614
19619
  accept,
19615
19620
  disabled,