@douyinfe/semi-foundation 2.1.4 → 2.2.0-beta.1

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.
Files changed (103) hide show
  1. package/cascader/cascader.scss +1 -1
  2. package/cascader/constants.ts +4 -0
  3. package/cascader/foundation.ts +29 -15
  4. package/cascader/util.ts +13 -0
  5. package/checkbox/checkboxFoundation.ts +1 -0
  6. package/datePicker/_utils/parser.ts +4 -3
  7. package/datePicker/datePicker.scss +18 -0
  8. package/datePicker/monthsGridFoundation.ts +101 -8
  9. package/gulpfile.js +3 -1
  10. package/lib/cjs/cascader/cascader.css +2 -2
  11. package/lib/cjs/cascader/cascader.scss +1 -1
  12. package/lib/cjs/cascader/constants.d.ts +3 -0
  13. package/lib/cjs/cascader/constants.js +6 -1
  14. package/lib/cjs/cascader/foundation.d.ts +4 -1
  15. package/lib/cjs/cascader/foundation.js +24 -11
  16. package/lib/cjs/cascader/util.d.ts +1 -0
  17. package/lib/cjs/cascader/util.js +17 -0
  18. package/lib/cjs/checkbox/checkboxFoundation.d.ts +1 -0
  19. package/lib/cjs/datePicker/_utils/parser.d.ts +6 -1
  20. package/lib/cjs/datePicker/_utils/parser.js +3 -1
  21. package/lib/cjs/datePicker/datePicker.css +6 -1
  22. package/lib/cjs/datePicker/datePicker.scss +18 -0
  23. package/lib/cjs/datePicker/monthsGridFoundation.d.ts +35 -3
  24. package/lib/cjs/datePicker/monthsGridFoundation.js +139 -6
  25. package/lib/cjs/modal/modal.css +1 -1
  26. package/lib/cjs/modal/modalFoundation.d.ts +2 -2
  27. package/lib/cjs/modal/variables.scss +1 -1
  28. package/lib/cjs/navigation/navigation.css +0 -1
  29. package/lib/cjs/notification/notification.css +8 -4
  30. package/lib/cjs/notification/notification.scss +9 -5
  31. package/lib/cjs/notification/variables.scss +1 -0
  32. package/lib/cjs/select/foundation.d.ts +10 -1
  33. package/lib/cjs/select/foundation.js +11 -9
  34. package/lib/cjs/select/select.scss +1 -1
  35. package/lib/cjs/sideSheet/sideSheet.css +1 -1
  36. package/lib/cjs/sideSheet/variables.scss +1 -1
  37. package/lib/cjs/table/table.css +2 -2
  38. package/lib/cjs/table/table.scss +2 -2
  39. package/lib/cjs/table/variables.scss +3 -0
  40. package/lib/cjs/timeline/timeline.css +3 -0
  41. package/lib/cjs/timeline/timeline.scss +5 -1
  42. package/lib/cjs/tree/treeUtil.js +14 -14
  43. package/lib/cjs/upload/foundation.d.ts +1 -0
  44. package/lib/cjs/upload/foundation.js +106 -0
  45. package/lib/cjs/upload/rtl.scss +0 -4
  46. package/lib/cjs/upload/upload.css +31 -19
  47. package/lib/cjs/upload/upload.scss +31 -8
  48. package/lib/cjs/upload/variables.scss +6 -2
  49. package/lib/es/cascader/cascader.css +2 -2
  50. package/lib/es/cascader/cascader.scss +1 -1
  51. package/lib/es/cascader/constants.d.ts +3 -0
  52. package/lib/es/cascader/constants.js +6 -1
  53. package/lib/es/cascader/foundation.d.ts +4 -1
  54. package/lib/es/cascader/foundation.js +24 -12
  55. package/lib/es/cascader/util.d.ts +1 -0
  56. package/lib/es/cascader/util.js +14 -0
  57. package/lib/es/checkbox/checkboxFoundation.d.ts +1 -0
  58. package/lib/es/datePicker/_utils/parser.d.ts +6 -1
  59. package/lib/es/datePicker/_utils/parser.js +3 -1
  60. package/lib/es/datePicker/datePicker.css +6 -1
  61. package/lib/es/datePicker/datePicker.scss +18 -0
  62. package/lib/es/datePicker/monthsGridFoundation.d.ts +35 -3
  63. package/lib/es/datePicker/monthsGridFoundation.js +139 -6
  64. package/lib/es/modal/modal.css +1 -1
  65. package/lib/es/modal/modalFoundation.d.ts +2 -2
  66. package/lib/es/modal/variables.scss +1 -1
  67. package/lib/es/navigation/navigation.css +0 -1
  68. package/lib/es/notification/notification.css +8 -4
  69. package/lib/es/notification/notification.scss +9 -5
  70. package/lib/es/notification/variables.scss +1 -0
  71. package/lib/es/select/foundation.d.ts +10 -1
  72. package/lib/es/select/foundation.js +12 -9
  73. package/lib/es/select/select.scss +1 -1
  74. package/lib/es/sideSheet/sideSheet.css +1 -1
  75. package/lib/es/sideSheet/variables.scss +1 -1
  76. package/lib/es/table/table.css +2 -2
  77. package/lib/es/table/table.scss +2 -2
  78. package/lib/es/table/variables.scss +3 -0
  79. package/lib/es/timeline/timeline.css +3 -0
  80. package/lib/es/timeline/timeline.scss +5 -1
  81. package/lib/es/tree/treeUtil.js +13 -12
  82. package/lib/es/upload/foundation.d.ts +1 -0
  83. package/lib/es/upload/foundation.js +107 -0
  84. package/lib/es/upload/rtl.scss +0 -4
  85. package/lib/es/upload/upload.css +31 -19
  86. package/lib/es/upload/upload.scss +31 -8
  87. package/lib/es/upload/variables.scss +6 -2
  88. package/modal/modalFoundation.ts +2 -2
  89. package/modal/variables.scss +1 -1
  90. package/notification/notification.scss +9 -5
  91. package/notification/variables.scss +1 -0
  92. package/package.json +4 -4
  93. package/select/foundation.ts +11 -9
  94. package/select/select.scss +1 -1
  95. package/sideSheet/variables.scss +1 -1
  96. package/table/table.scss +2 -2
  97. package/table/variables.scss +3 -0
  98. package/timeline/timeline.scss +5 -1
  99. package/tree/treeUtil.ts +6 -2
  100. package/upload/foundation.ts +81 -0
  101. package/upload/rtl.scss +0 -4
  102. package/upload/upload.scss +31 -8
  103. package/upload/variables.scss +6 -2
@@ -57,12 +57,10 @@ var _every = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stab
57
57
 
58
58
  var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
59
59
 
60
- var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
61
-
62
- var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
63
-
64
60
  var _some = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/some"));
65
61
 
62
+ var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
63
+
66
64
  var _values = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/values"));
67
65
 
68
66
  var _get2 = _interopRequireDefault(require("lodash/get"));
@@ -557,7 +555,7 @@ function normalizedArr(val) {
557
555
 
558
556
  function normalizeKeyList(keyList, keyEntities) {
559
557
  let leafOnly = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
560
- let res = [];
558
+ const res = [];
561
559
  const keyListSet = new _set.default(keyList);
562
560
 
563
561
  if (!leafOnly) {
@@ -577,9 +575,11 @@ function normalizeKeyList(keyList, keyEntities) {
577
575
  res.push(key);
578
576
  });
579
577
  } else {
580
- var _context8;
581
-
582
- res = (0, _filter.default)(_context8 = (0, _from.default)(keyList)).call(_context8, key => keyEntities[key] && !isValid(keyEntities[key].children));
578
+ (0, _forEach.default)(keyList).call(keyList, key => {
579
+ if (keyEntities[key] && !isValid(keyEntities[key].children)) {
580
+ res.push(key);
581
+ }
582
+ });
583
583
  }
584
584
 
585
585
  return res;
@@ -589,9 +589,9 @@ function getMotionKeys(eventKey, expandedKeys, keyEntities) {
589
589
  const res = [];
590
590
 
591
591
  const getChild = itemKey => {
592
- var _context9;
592
+ var _context8;
593
593
 
594
- keyEntities[itemKey].children && (0, _forEach.default)(_context9 = keyEntities[itemKey].children).call(_context9, item => {
594
+ keyEntities[itemKey].children && (0, _forEach.default)(_context8 = keyEntities[itemKey].children).call(_context8, item => {
595
595
  const {
596
596
  key
597
597
  } = item;
@@ -707,7 +707,7 @@ function calcCheckedKeysForUnchecked(key, keyEntities, checkedKeys, halfCheckedK
707
707
  }
708
708
 
709
709
  function filterTreeData(info) {
710
- var _context10, _context11;
710
+ var _context9, _context10;
711
711
 
712
712
  const {
713
713
  showFilteredOnly,
@@ -719,7 +719,7 @@ function filterTreeData(info) {
719
719
  prevExpandedKeys
720
720
  } = info;
721
721
  let filteredOptsKeys = [];
722
- filteredOptsKeys = (0, _map.default)(_context10 = (0, _filter.default)(_context11 = (0, _values.default)(keyEntities)).call(_context11, item => filter(inputValue, item.data, filterTreeNode, filterProps))).call(_context10, item => item.key);
722
+ filteredOptsKeys = (0, _map.default)(_context9 = (0, _filter.default)(_context10 = (0, _values.default)(keyEntities)).call(_context10, item => filter(inputValue, item.data, filterTreeNode, filterProps))).call(_context9, item => item.key);
723
723
  let expandedOptsKeys = findAncestorKeys(filteredOptsKeys, keyEntities, false);
724
724
 
725
725
  if (prevExpandedKeys.length) {
@@ -763,9 +763,9 @@ function updateKeys(keySet, keyEntities) {
763
763
  }
764
764
 
765
765
  function calcDisabledKeys(keyEntities) {
766
- var _context12;
766
+ var _context11;
767
767
 
768
- const disabledKeys = (0, _filter.default)(_context12 = (0, _keys.default)(keyEntities)).call(_context12, key => keyEntities[key].data.disabled);
768
+ const disabledKeys = (0, _filter.default)(_context11 = (0, _keys.default)(keyEntities)).call(_context11, key => keyEntities[key].data.disabled);
769
769
  const {
770
770
  checkedKeys
771
771
  } = calcCheckedKeys(disabledKeys, keyEntities);
@@ -119,6 +119,7 @@ declare class UploadFoundation<P = Record<string, any>, S = Record<string, any>>
119
119
  buildFileItem(fileInstance: CustomFile, uploadTrigger: string): BaseFileItem;
120
120
  replaceFileList(files: Array<CustomFile>): void;
121
121
  addFilesToList(files: Array<CustomFile>): void;
122
+ insertFileToList(files: Array<CustomFile>, index: number): void;
122
123
  manualUpload(): void;
123
124
  startUpload(fileList: Array<BaseFileItem>): void;
124
125
  upload(file: BaseFileItem): void;
@@ -405,6 +405,112 @@ class UploadFoundation extends _foundation.default {
405
405
  this.startUpload(currentFiles);
406
406
  }
407
407
  });
408
+ } // 插入多个文件到指定位置
409
+ // Insert files to the specified location
410
+
411
+
412
+ insertFileToList(files, index) {
413
+ const {
414
+ limit,
415
+ transformFile,
416
+ accept,
417
+ uploadTrigger
418
+ } = this.getProps();
419
+ const {
420
+ fileList
421
+ } = this.getStates();
422
+ const unAcceptFileList = []; // 当次选中的文件
423
+ // current selected file
424
+
425
+ let currentFileList = (0, _from.default)(files);
426
+
427
+ if (typeof accept !== 'undefined') {
428
+ currentFileList = (0, _filter.default)(currentFileList).call(currentFileList, item => {
429
+ const isValid = this.checkFileFormat(accept, item);
430
+
431
+ if (!isValid) {
432
+ unAcceptFileList.push(item);
433
+ }
434
+
435
+ return isValid;
436
+ });
437
+
438
+ if (unAcceptFileList.length !== 0) {
439
+ this._adapter.notifyAcceptInvalid(unAcceptFileList);
440
+ }
441
+
442
+ if (currentFileList.length === 0) {
443
+ return;
444
+ }
445
+ }
446
+
447
+ currentFileList = (0, _map.default)(currentFileList).call(currentFileList, file => {
448
+ if (!file.uid) {
449
+ file.uid = (0, _uuid.getUuidv4)();
450
+ }
451
+
452
+ if (this.checkFileSize(file)) {
453
+ file._sizeInvalid = true;
454
+ file.status = FILE_STATUS_VALID_FAIL;
455
+
456
+ this._adapter.notifySizeError(file, fileList);
457
+ }
458
+
459
+ if (transformFile) {
460
+ file = transformFile(file);
461
+ }
462
+
463
+ return file;
464
+ });
465
+ const total = fileList.length + currentFileList.length;
466
+
467
+ if (typeof limit !== 'undefined') {
468
+ // 判断是否超出限制
469
+ // Determine whether the limit is exceeded
470
+ if (total > limit) {
471
+ if (limit === 1) {
472
+ // 使用最后面的文件对当前文件进行替换
473
+ // Use the last file to replace the current file
474
+ currentFileList = (0, _slice.default)(currentFileList).call(currentFileList, -1);
475
+
476
+ this._adapter.notifyFileSelect(currentFileList);
477
+
478
+ this._adapter.resetInput();
479
+
480
+ this.replaceFileList(currentFileList);
481
+ return;
482
+ } // 如果超出了限制,则计算还能添加几个文件,将剩余的文件继续上传
483
+ // If the limit is exceeded, several files can be added to the calculation, and the remaining files will continue to be uploaded
484
+
485
+
486
+ const restNum = limit - fileList.length;
487
+ currentFileList = (0, _slice.default)(currentFileList).call(currentFileList, 0, restNum);
488
+
489
+ this._adapter.notifyExceed(currentFileList);
490
+ }
491
+ }
492
+
493
+ const fileItemList = (0, _map.default)(currentFileList).call(currentFileList, file => this.buildFileItem(file, uploadTrigger));
494
+ const newFileList = (0, _slice.default)(fileList).call(fileList);
495
+
496
+ if (typeof index !== 'undefined') {
497
+ (0, _splice.default)(newFileList).call(newFileList, index, 0, ...fileItemList);
498
+ } else {
499
+ newFileList.push(...fileItemList);
500
+ }
501
+
502
+ this._adapter.notifyFileSelect(currentFileList);
503
+
504
+ this._adapter.notifyChange({
505
+ fileList: newFileList,
506
+ currentFile: null
507
+ });
508
+
509
+ this._adapter.updateFileList(newFileList, () => {
510
+ if (uploadTrigger === TRIGGER_AUTO) {
511
+ this.startUpload(fileItemList);
512
+ }
513
+ });
408
514
  }
409
515
 
410
516
  manualUpload() {
@@ -22,8 +22,6 @@ $module: #{$prefix}-upload;
22
22
  }
23
23
 
24
24
  &-file-card {
25
- margin-right: 0;
26
- margin-left: $spacing-upload_picture_file_card-marginRight;
27
25
 
28
26
  &-info {
29
27
 
@@ -53,8 +51,6 @@ $module: #{$prefix}-upload;
53
51
  &-picture {
54
52
 
55
53
  &-file-card {
56
- margin-right: 0;
57
- margin-left: $spacing-upload_picture_file_card-marginRight;
58
54
 
59
55
  &-close {
60
56
  right: auto;
@@ -73,6 +73,8 @@
73
73
  display: flex;
74
74
  flex-wrap: wrap;
75
75
  flex-shrink: 0;
76
+ gap: 8px;
77
+ margin-bottom: 8px;
76
78
  }
77
79
  .semi-upload-file-list-main p {
78
80
  display: flex;
@@ -99,8 +101,6 @@
99
101
  justify-content: space-between;
100
102
  height: 52px;
101
103
  width: 250px;
102
- margin-right: 8px;
103
- margin-bottom: 8px;
104
104
  background-color: var(--semi-color-fill-0);
105
105
  cursor: pointer;
106
106
  }
@@ -235,16 +235,16 @@
235
235
  flex-direction: column;
236
236
  }
237
237
  .semi-upload-picture[x-prompt-pos=bottom] .semi-upload-prompt {
238
- order: 2;
238
+ order: 1;
239
239
  }
240
240
  .semi-upload-picture[x-prompt-pos=bottom] .semi-upload-add {
241
- order: 1;
241
+ order: 0;
242
242
  }
243
243
  .semi-upload-picture[x-prompt-pos=right] .semi-upload-prompt {
244
- order: 2;
244
+ order: 1;
245
245
  }
246
246
  .semi-upload-picture[x-prompt-pos=right] .semi-upload-add {
247
- order: 1;
247
+ order: 0;
248
248
  }
249
249
  .semi-upload-picture-add {
250
250
  background-color: var(--semi-color-fill-0);
@@ -281,11 +281,14 @@
281
281
  margin-bottom: 0;
282
282
  }
283
283
  .semi-upload-picture-file-card {
284
+ display: flex;
285
+ align-items: center;
286
+ justify-content: center;
284
287
  height: 96px;
285
288
  width: 96px;
289
+ border-radius: var(--semi-border-radius-small);
286
290
  position: relative;
287
- margin-right: 8px;
288
- margin-bottom: 8px;
291
+ overflow: hidden;
289
292
  }
290
293
  .semi-upload-picture-file-card img {
291
294
  height: 96px;
@@ -296,7 +299,7 @@
296
299
  .semi-upload-picture-file-card-close {
297
300
  width: 16px;
298
301
  height: 16px;
299
- background-color: var(--semi-overlay-bg);
302
+ background-color: var(--semi-color-overlay-bg);
300
303
  position: absolute;
301
304
  top: 8px;
302
305
  right: 8px;
@@ -350,6 +353,22 @@
350
353
  color: var(--semi-color-white);
351
354
  transform: translate3D(-50%, -50%, 0);
352
355
  }
356
+ .semi-upload-picture-file-card-pic-info {
357
+ display: inline-flex;
358
+ box-sizing: border-box;
359
+ justify-content: space-between;
360
+ align-items: center;
361
+ position: absolute;
362
+ width: 100%;
363
+ height: 24px;
364
+ padding: 0 10px;
365
+ bottom: 0;
366
+ left: 0;
367
+ color: var(--semi-color-white);
368
+ font-size: 12px;
369
+ font-weight: 600;
370
+ background: linear-gradient(0deg, rgba(22, 22, 26, 0.3) 0%, rgba(22, 22, 26, 0) 77.08%);
371
+ }
353
372
  .semi-upload-picture-file-card-icon-loading, .semi-upload-picture-file-card-icon-error {
354
373
  position: absolute;
355
374
  bottom: 6px;
@@ -362,6 +381,9 @@
362
381
  .semi-upload-picture-file-card-show-pointer {
363
382
  cursor: pointer;
364
383
  }
384
+ .semi-upload-picture-file-card-error {
385
+ outline: 1px solid var(--semi-color-danger);
386
+ }
365
387
  .semi-upload-drag-area {
366
388
  border-radius: var(--semi-border-radius-small);
367
389
  border: 2px dashed var(--semi-color-border);
@@ -442,11 +464,6 @@
442
464
  .semi-portal-rtl .semi-upload-file-list-title-clear {
443
465
  display: inline-block;
444
466
  }
445
- .semi-rtl .semi-upload-file-card,
446
- .semi-portal-rtl .semi-upload-file-card {
447
- margin-right: 0;
448
- margin-left: 8px;
449
- }
450
467
  .semi-rtl .semi-upload-file-card-info-size,
451
468
  .semi-portal-rtl .semi-upload-file-card-info-size {
452
469
  margin-left: 0;
@@ -463,11 +480,6 @@
463
480
  margin-right: 0;
464
481
  margin-left: 2px;
465
482
  }
466
- .semi-rtl .semi-upload-picture-file-card,
467
- .semi-portal-rtl .semi-upload-picture-file-card {
468
- margin-right: 0;
469
- margin-left: 8px;
470
- }
471
483
  .semi-rtl .semi-upload-picture-file-card-close,
472
484
  .semi-portal-rtl .semi-upload-picture-file-card-close {
473
485
  right: auto;
@@ -99,6 +99,8 @@ $module: #{$prefix}-upload;
99
99
  display: flex;
100
100
  flex-wrap: wrap;
101
101
  flex-shrink: 0;
102
+ gap: $spacing-upload_picture_file_card-gap;
103
+ margin-bottom: $spacing-upload_picture_file_card-marginBottom;
102
104
 
103
105
  p {
104
106
  @include ver-center;
@@ -130,8 +132,6 @@ $module: #{$prefix}-upload;
130
132
  justify-content: space-between;
131
133
  height: $height-upload_file_card;
132
134
  width: $width-upload_file_card;
133
- margin-right: $spacing-tight;
134
- margin-bottom: $spacing-tight;
135
135
  background-color: $color-upload_card-bg;
136
136
  cursor: pointer;
137
137
 
@@ -292,21 +292,21 @@ $module: #{$prefix}-upload;
292
292
  flex-direction: column;
293
293
 
294
294
  .#{$module}-prompt {
295
- order: 2;
295
+ order: 1;
296
296
  }
297
297
 
298
298
  .#{$module}-add {
299
- order: 1;
299
+ order: 0;
300
300
  }
301
301
  }
302
302
 
303
303
  &[x-prompt-pos="right"] {
304
304
  .#{$module}-prompt {
305
- order: 2;
305
+ order: 1;
306
306
  }
307
307
 
308
308
  .#{$module}-add {
309
- order: 1;
309
+ order: 0;
310
310
  }
311
311
  }
312
312
 
@@ -353,11 +353,14 @@ $module: #{$prefix}-upload;
353
353
  }
354
354
 
355
355
  &-file-card {
356
+ display: flex;
357
+ align-items: center;
358
+ justify-content: center;
356
359
  height: $height-upload_file_pic_card;
357
360
  width: $width-upload_file_pic_card;
361
+ border-radius: $radius-upload_picture_file_card_img;
358
362
  position: relative;
359
- margin-right: $spacing-upload_picture_file_card-marginRight;
360
- margin-bottom: $spacing-upload_picture_file_card-marginBottom;
363
+ overflow: hidden;
361
364
 
362
365
  img {
363
366
  height: $width-upload_picture_file_card_img;
@@ -429,6 +432,22 @@ $module: #{$prefix}-upload;
429
432
  color: $color-upload_replace-text;
430
433
  transform: translate3D(-50%, -50%, 0);
431
434
  }
435
+ &-pic-info {
436
+ display: inline-flex;
437
+ box-sizing: border-box;
438
+ justify-content: space-between;
439
+ align-items: center;
440
+ position: absolute;
441
+ width: 100%;
442
+ height: 24px;
443
+ padding: 0 10px;
444
+ bottom: 0;
445
+ left: 0;
446
+ color: $color-upload_picture_file_card_pic_info-text;
447
+ font-size: $font-upload_picture_file_card_pic_info-fontSize;
448
+ font-weight: $font-upload_picture_file_card_pic_info-fontWeight;
449
+ background: linear-gradient(0deg, rgba(22, 22, 26, 0.3) 0%, rgba(22, 22, 26, 0) 77.08%);
450
+ }
432
451
 
433
452
  &-icon-loading,
434
453
  &-icon-error {
@@ -445,6 +464,10 @@ $module: #{$prefix}-upload;
445
464
  &-show-pointer {
446
465
  cursor: pointer;
447
466
  }
467
+
468
+ &-error {
469
+ outline: 1px solid $color-upload_picture_file_card_error-border;
470
+ }
448
471
  }
449
472
  }
450
473
 
@@ -22,8 +22,10 @@ $color-upload-icon: var(--semi-color-tertiary); // 图片墙上传图标加号
22
22
  $color-upload_pic_add-bg-active: var(--semi-color-fill-2); // 图片墙上传背景色 - 按下
23
23
  $color-upload_pic_add-bg-hover: var(--semi-color-fill-1); // 图片墙上传背景色 - 悬浮
24
24
  $color-upload_pic_add-bg: var(--semi-color-fill-0); // 图片墙上传背景色 - 默认
25
- $color-upload_pic_remove-bg: var(--semi-overlay-bg); // 图片墙上传移除图标颜色
25
+ $color-upload_pic_remove-bg: var(--semi-color-overlay-bg); // 图片墙上传移除图标颜色
26
26
  $color-upload_picture_file_card_loading_error-icon: var(--semi-color-danger); // 图片墙上传移除图标颜色
27
+ $color-upload_picture_file_card_error-border: var(--semi-color-danger); // 图片墙上传移除图标颜色
28
+ $color-upload_picture_file_card_pic_info-text: var(--semi-color-white); // 图片墙图片信息(序号)文字颜色
27
29
  $color-upload_preview-icon: var(--semi-color-text-2); // 上传文件卡片文本颜色
28
30
  $color-upload_retry-text: var(--semi-color-primary); // 上传文件卡片重新上传按钮文本颜色
29
31
  $color-upload_replace-text: var(--semi-color-white); // 上传文件卡片重新替换按钮文本颜色
@@ -56,7 +58,7 @@ $spacing-upload_file_card_info_progress-marginTop: 4px; // 上传文件卡片进
56
58
  $spacing-upload_file_card_close-marginLeft: $spacing-tight; // 上传文件卡片删除按钮左侧外边距
57
59
  $spacing-upload_file_card_close-marginRight: $spacing-tight; // 上传文件卡片删除按钮右侧外边距
58
60
  $spacing-upload_file_card_icon-marginRight: $spacing-super-tight; // 上传文件卡片图标右侧外边距
59
- $spacing-upload_picture_file_card-marginRight: $spacing-tight; // 图片墙上传卡片右侧外边距
61
+ $spacing-upload_picture_file_card-gap: $spacing-tight; // 图片墙卡片之间边距
60
62
  $spacing-upload_picture_file_card-marginBottom: $spacing-tight; // 图片墙上传卡片底部外边距
61
63
  $spacing-upload_picture_file_card_close-top: 8px; // 图片墙上传卡片删除按钮顶部位置
62
64
  $spacing-upload_picture_file_card_close-right: 8px; // 图片墙上传卡片删除右侧位置
@@ -79,3 +81,5 @@ $radius-upload_drag_area: var(--semi-border-radius-small); // 可拖拽上传拖
79
81
  $font-upload_file_card_info_name-fontWeight: $font-weight-bold; // 上传文件卡片文件名字重
80
82
  $font-upload_file_card_info_size-fontWeight: $font-weight-regular; // 上传文件卡片文件尺寸字重
81
83
  $font-upload_drag_area_tips-fontWeight: 600; // 可拖拽上传提示文本字重
84
+ $font-upload_picture_file_card_pic_info-fontSize: 12px; // 图片墙图片信息字体大小
85
+ $font-upload_picture_file_card_pic_info-fontWeight: 600; // 图片墙图片信息文本字重
@@ -99,11 +99,11 @@
99
99
  .semi-cascader-selection-tag:first-child {
100
100
  margin-left: 0;
101
101
  }
102
- .semi-cascader-selection-tag-disabled {
102
+ .semi-cascader-selection-tag-disabled.semi-tag {
103
103
  color: var(--semi-color-disabled-text);
104
104
  cursor: not-allowed;
105
105
  }
106
- .semi-cascader-selection-tag-disabled .semi-tag-close {
106
+ .semi-cascader-selection-tag-disabled.semi-tag .semi-tag-close {
107
107
  color: var(--semi-color-disabled-text);
108
108
  cursor: not-allowed;
109
109
  pointer-events: none;
@@ -116,7 +116,7 @@ $module: #{$prefix}-cascader;
116
116
  margin-left: 0;
117
117
  }
118
118
 
119
- &-disabled {
119
+ &-disabled.#{$prefix}-tag {
120
120
  color: $color-cascader_input_disabled-text-default;
121
121
  cursor: not-allowed;
122
122
 
@@ -9,6 +9,9 @@ declare const strings: {
9
9
  readonly IS_VALUE: "isValue";
10
10
  readonly SHOW_NEXT_BY_CLICK: "click";
11
11
  readonly SHOW_NEXT_BY_HOVER: "hover";
12
+ readonly LEAF_ONLY_MERGE_TYPE: "leafOnly";
13
+ readonly AUTO_MERGE_VALUE_MERGE_TYPE: "autoMergeValue";
14
+ readonly NONE_MERGE_TYPE: "none";
12
15
  };
13
16
  declare const numbers: {};
14
17
  export { cssClasses, strings, numbers };
@@ -9,7 +9,12 @@ const strings = {
9
9
  IS_KEY: 'isKey',
10
10
  IS_VALUE: 'isValue',
11
11
  SHOW_NEXT_BY_CLICK: 'click',
12
- SHOW_NEXT_BY_HOVER: 'hover'
12
+ SHOW_NEXT_BY_HOVER: 'hover',
13
+
14
+ /* Merge Type */
15
+ LEAF_ONLY_MERGE_TYPE: 'leafOnly',
16
+ AUTO_MERGE_VALUE_MERGE_TYPE: 'autoMergeValue',
17
+ NONE_MERGE_TYPE: 'none'
13
18
  };
14
19
  const numbers = {};
15
20
  export { cssClasses, strings, numbers };
@@ -57,6 +57,7 @@ export interface BasicScrollPanelProps {
57
57
  export interface BasicCascaderProps {
58
58
  mouseEnterDelay?: number;
59
59
  mouseLeaveDelay?: number;
60
+ separator?: string;
60
61
  arrowIcon?: any;
61
62
  changeOnSelect?: boolean;
62
63
  multiple?: boolean;
@@ -96,6 +97,8 @@ export interface BasicCascaderProps {
96
97
  topSlot?: any;
97
98
  showNext?: ShowNextType;
98
99
  disableStrictly?: boolean;
100
+ leafOnly?: boolean;
101
+ enableLeafClick?: boolean;
99
102
  onClear?: () => void;
100
103
  triggerRender?: (props: BasicTriggerRenderProps) => any;
101
104
  onListScroll?: (e: any, panel: BasicScrollPanelProps) => void;
@@ -125,7 +128,7 @@ export interface BasicCascaderInnerData {
125
128
  isHovering: boolean;
126
129
  checkedKeys: Set<string>;
127
130
  halfCheckedKeys: Set<string>;
128
- mergedCheckedKeys: Set<string>;
131
+ resolvedCheckedKeys: Set<string>;
129
132
  loadedKeys: Set<string>;
130
133
  loadingKeys: Set<string>;
131
134
  loading: boolean;
@@ -22,7 +22,8 @@ import _sortInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instanc
22
22
  import _parseInt from "@babel/runtime-corejs3/core-js-stable/parse-int";
23
23
  import BaseFoundation from '../base/foundation';
24
24
  import { filter, findAncestorKeys, calcCheckedKeysForUnchecked, calcCheckedKeysForChecked, calcCheckedKeys, findDescendantKeys, normalizeKeyList } from '../tree/treeUtil';
25
- import { convertDataToEntities, findKeysForValues, normalizedArr, isValid } from './util'; // eslint-disable-next-line max-len
25
+ import { convertDataToEntities, findKeysForValues, normalizedArr, isValid, calcMergeType } from './util';
26
+ import { strings } from './constants'; // eslint-disable-next-line max-len
26
27
 
27
28
  export default class CascaderFoundation extends BaseFoundation {
28
29
  constructor(adapter) {
@@ -535,10 +536,12 @@ export default class CascaderFoundation extends BaseFoundation {
535
536
  }
536
537
 
537
538
  _defaultRenderText(path, displayRender) {
539
+ const separator = this.getProp('separator');
540
+
538
541
  if (displayRender && typeof displayRender === 'function') {
539
542
  return displayRender(path);
540
543
  } else {
541
- return path.join(' / ');
544
+ return path.join(separator);
542
545
  }
543
546
  }
544
547
 
@@ -612,7 +615,8 @@ export default class CascaderFoundation extends BaseFoundation {
612
615
  const {
613
616
  changeOnSelect: allowChange,
614
617
  filterLeafOnly,
615
- multiple
618
+ multiple,
619
+ enableLeafClick
616
620
  } = this.getProps();
617
621
  const {
618
622
  keyEntities,
@@ -646,6 +650,10 @@ export default class CascaderFoundation extends BaseFoundation {
646
650
  this._adapter.updateStates({
647
651
  activeKeys: new _Set(activeKeys)
648
652
  });
653
+
654
+ if (isLeaf && enableLeafClick) {
655
+ this.onItemCheckboxClick(item);
656
+ }
649
657
  } else {
650
658
  this._adapter.notifySelect(data.value);
651
659
 
@@ -695,12 +703,13 @@ export default class CascaderFoundation extends BaseFoundation {
695
703
  const {
696
704
  checkedKeys,
697
705
  keyEntities,
698
- mergedCheckedKeys
706
+ resolvedCheckedKeys
699
707
  } = this.getStates();
700
708
  const {
701
709
  autoMergeValue,
702
710
  max,
703
- disableStrictly
711
+ disableStrictly,
712
+ leafOnly
704
713
  } = this.getProps(); // prev checked status
705
714
 
706
715
  const prevCheckedStatus = checkedKeys.has(key); // next checked status
@@ -711,16 +720,19 @@ export default class CascaderFoundation extends BaseFoundation {
711
720
  checkedKeys: curCheckedKeys,
712
721
  halfCheckedKeys: curHalfCheckedKeys
713
722
  } = disableStrictly ? this.calcNonDisabedCheckedKeys(key, curCheckedStatus) : this.calcCheckedKeys(key, curCheckedStatus);
714
- const curMergedCheckedKeys = new _Set(normalizeKeyList(curCheckedKeys, keyEntities));
715
- const curRealCheckedKeys = autoMergeValue ? curMergedCheckedKeys : curCheckedKeys;
723
+ const mergeType = calcMergeType(autoMergeValue, leafOnly);
724
+ const isLeafOnlyMerge = mergeType === strings.LEAF_ONLY_MERGE_TYPE;
725
+ const isNoneMerge = mergeType === strings.NONE_MERGE_TYPE;
726
+ const curResolvedCheckedKeys = new _Set(normalizeKeyList(curCheckedKeys, keyEntities, isLeafOnlyMerge));
727
+ const curRealCheckedKeys = isNoneMerge ? curCheckedKeys : curResolvedCheckedKeys;
716
728
 
717
729
  if (_isNumber(max)) {
718
- if (autoMergeValue) {
730
+ if (!isNoneMerge) {
719
731
  // When it exceeds max, the quantity is allowed to be reduced, and no further increase is allowed
720
- if (mergedCheckedKeys.size < curMergedCheckedKeys.size && curMergedCheckedKeys.size > max) {
732
+ if (resolvedCheckedKeys.size < curResolvedCheckedKeys.size && curResolvedCheckedKeys.size > max) {
721
733
  const checkedEntities = [];
722
734
 
723
- _forEachInstanceProperty(curMergedCheckedKeys).call(curMergedCheckedKeys, itemKey => {
735
+ _forEachInstanceProperty(curResolvedCheckedKeys).call(curResolvedCheckedKeys, itemKey => {
724
736
  checkedEntities.push(keyEntities[itemKey]);
725
737
  });
726
738
 
@@ -748,7 +760,7 @@ export default class CascaderFoundation extends BaseFoundation {
748
760
  this._adapter.updateStates({
749
761
  checkedKeys: curCheckedKeys,
750
762
  halfCheckedKeys: curHalfCheckedKeys,
751
- mergedCheckedKeys: curMergedCheckedKeys
763
+ resolvedCheckedKeys: curResolvedCheckedKeys
752
764
  });
753
765
  } // The click event during multiple selection will definitely cause the checked state of node to change,
754
766
  // so there is no need to judge the value to change.
@@ -911,7 +923,7 @@ export default class CascaderFoundation extends BaseFoundation {
911
923
  newState.halfCheckedKeys = new _Set([]);
912
924
  newState.selectedKeys = new _Set([]);
913
925
  newState.activeKeys = new _Set([]);
914
- newState.mergedCheckedKeys = new _Set([]);
926
+ newState.resolvedCheckedKeys = new _Set([]);
915
927
 
916
928
  this._adapter.notifyChange([]);
917
929
  } else {
@@ -2,3 +2,4 @@ export declare function isValid(val: any): boolean;
2
2
  export declare function normalizedArr(val: any): any[];
3
3
  export declare function convertDataToEntities(dataNodes: any): any;
4
4
  export declare function findKeysForValues(value: any, keyEntities: any): any[];
5
+ export declare function calcMergeType(autoMergeValue: boolean, leafOnly: boolean): string;
@@ -8,6 +8,7 @@ import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/inst
8
8
  import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
9
9
  import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
10
10
  import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
11
+ import { strings } from './constants';
11
12
 
12
13
  function getPosition(level, index) {
13
14
  var _context;
@@ -88,4 +89,17 @@ export function findKeysForValues(value, keyEntities) {
88
89
  const res = _mapInstanceProperty(_context2 = _filterInstanceProperty(_context3 = _Object$values(keyEntities)).call(_context3, item => _isEqual(item.valuePath, valuePath))).call(_context2, item => item.key);
89
90
 
90
91
  return res;
92
+ }
93
+ export function calcMergeType(autoMergeValue, leafOnly) {
94
+ let mergeType;
95
+
96
+ if (leafOnly) {
97
+ mergeType = strings.LEAF_ONLY_MERGE_TYPE;
98
+ } else if (autoMergeValue) {
99
+ mergeType = strings.AUTO_MERGE_VALUE_MERGE_TYPE;
100
+ } else {
101
+ mergeType = strings.NONE_MERGE_TYPE;
102
+ }
103
+
104
+ return mergeType;
91
105
  }