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