@douyinfe/semi-ui 2.4.1 → 2.5.0-beta.0

package/dist/umd/semi-ui.js

@@ -24257,6 +24257,19 @@ class foundation_Tooltip extends foundation {
         translateX = -1;
         break;
 
+      case 'leftBottomOver':
+        left = triggerRect.left;
+        top = triggerRect.bottom;
+        translateY = -1;
+        break;
+
+      case 'rightBottomOver':
+        left = triggerRect.right;
+        top = triggerRect.bottom;
+        translateX = -1;
+        translateY = -1;
+        break;
+
       default:
         break;
     }
@@ -24380,12 +24393,16 @@ class foundation_Tooltip extends foundation {
 
       const shouldReverseTop = clientTop < wrapperRect.height + spacing && restClientBottom > wrapperRect.height + spacing;
       const shouldReverseLeft = clientLeft < wrapperRect.width + spacing && restClientRight > wrapperRect.width + spacing;
-      const sholdReverseBottom = restClientBottom < wrapperRect.height + spacing && clientTop > wrapperRect.height + spacing;
+      const shouldReverseBottom = restClientBottom < wrapperRect.height + spacing && clientTop > wrapperRect.height + spacing;
       const shouldReverseRight = restClientRight < wrapperRect.width + spacing && clientLeft > wrapperRect.width + spacing;
+      const shouldReverseTopOver = restClientTop < wrapperRect.height + spacing && clientBottom > wrapperRect.height + spacing;
+      const shouldReverseBottomOver = clientBottom < wrapperRect.height + spacing && restClientTop > wrapperRect.height + spacing;
       const shouldReverseTopSide = restClientTop < wrapperRect.height && clientBottom > wrapperRect.height;
       const shouldReverseBottomSide = clientBottom < wrapperRect.height && restClientTop > wrapperRect.height;
       const shouldReverseLeftSide = restClientLeft < wrapperRect.width && clientRight > wrapperRect.width;
       const shouldReverseRightSide = clientRight < wrapperRect.width && restClientLeft > wrapperRect.width;
+      const shouldReverseLeftOver = restClientLeft < wrapperRect.width && clientRight > wrapperRect.width;
+      const shouldReverseRightOver = clientRight < wrapperRect.width && restClientLeft > wrapperRect.width;
 
       switch (position) {
         case 'top':
@@ -24447,14 +24464,14 @@ class foundation_Tooltip extends foundation {
           break;
 
         case 'bottom':
-          if (sholdReverseBottom) {
+          if (shouldReverseBottom) {
             position = this._reversePos(position, true);
           }
 
           break;
 
         case 'bottomLeft':
-          if (sholdReverseBottom) {
+          if (shouldReverseBottom) {
             position = this._reversePos(position, true);
           }
 
@@ -24465,7 +24482,7 @@ class foundation_Tooltip extends foundation {
           break;
 
         case 'bottomRight':
-          if (sholdReverseBottom) {
+          if (shouldReverseBottom) {
             position = this._reversePos(position, true);
           }
 
@@ -24504,6 +24521,50 @@ class foundation_Tooltip extends foundation {
 
           break;
 
+        case 'leftTopOver':
+          if (shouldReverseTopOver) {
+            position = this._reversePos(position, true);
+          }
+
+          if (shouldReverseLeftOver) {
+            position = this._reversePos(position);
+          }
+
+          break;
+
+        case 'leftBottomOver':
+          if (shouldReverseBottomOver) {
+            position = this._reversePos(position, true);
+          }
+
+          if (shouldReverseLeftOver) {
+            position = this._reversePos(position);
+          }
+
+          break;
+
+        case 'rightTopOver':
+          if (shouldReverseTopOver) {
+            position = this._reversePos(position, true);
+          }
+
+          if (shouldReverseRightOver) {
+            position = this._reversePos(position);
+          }
+
+          break;
+
+        case 'rightBottomOver':
+          if (shouldReverseBottomOver) {
+            position = this._reversePos(position, true);
+          }
+
+          if (shouldReverseRightOver) {
+            position = this._reversePos(position);
+          }
+
+          break;
+
         default:
           break;
       }
@@ -24533,7 +24594,7 @@ const tooltip_constants_cssClasses = {
   PREFIX: "".concat(BASE_CLASS_PREFIX, "-tooltip")
 };
 const tooltip_constants_strings = {
-  POSITION_SET: ['top', 'topLeft', 'topRight', 'left', 'leftTop', 'leftBottom', 'right', 'rightTop', 'rightBottom', 'bottom', 'bottomLeft', 'bottomRight', 'leftTopOver', 'rightTopOver'],
+  POSITION_SET: ['top', 'topLeft', 'topRight', 'left', 'leftTop', 'leftBottom', 'right', 'rightTop', 'rightBottom', 'bottom', 'bottomLeft', 'bottomRight', 'leftTopOver', 'rightTopOver', 'leftBottomOver', 'rightBottomOver'],
   TRIGGER_SET: ['hover', 'focus', 'click', 'custom'],
   STATUS_DISABLED: 'disabled',
   STATUS_LOADING: 'loading'
@@ -33915,9 +33976,9 @@ class option_Option extends external_root_React_commonjs2_react_commonjs_react_a
     const {
       props
     } = this;
-    const isDisbled = props.disabled;
+    const isDisabled = props.disabled;
 
-    if (!isDisbled) {
+    if (!isDisabled) {
       props.onSelect(assign_default()(assign_default()({}, rest), {
         value,
         label: label || children
@@ -42911,6 +42972,10 @@ cardGroup_CardGroup.defaultProps = {
 var lodash_flatten = __webpack_require__("1xil");
 var flatten_default = /*#__PURE__*/__webpack_require__.n(lodash_flatten);
 
+// EXTERNAL MODULE: /home/runner/work/semi-design/semi-design/node_modules/lodash/isSet.js
+var isSet = __webpack_require__("/iLo");
+var isSet_default = /*#__PURE__*/__webpack_require__.n(isSet);
+
 // EXTERNAL MODULE: /home/runner/work/semi-design/semi-design/node_modules/@babel/runtime-corejs3/core-js-stable/promise.js
 var promise = __webpack_require__("kNzS");
 var promise_default = /*#__PURE__*/__webpack_require__.n(promise);
@@ -46868,6 +46933,7 @@ tagInput_TagInput.defaultProps = {
 
 
 
+
 
 
 const cascader_prefixcls = cascader_constants_cssClasses.PREFIX;
@@ -47560,6 +47626,10 @@ class cascader_Cascader extends baseComponent_BaseComponent {
           realKeys = formatKeys;
         }
 
+        if (isSet_default()(realKeys)) {
+          realKeys = [...realKeys];
+        }
+
         const calRes = calcCheckedKeys(flatten_default()(realKeys), keyEntities);
         const checkedKeys = new set_default.a(calRes.checkedKeys);
         const halfCheckedKeys = new set_default.a(calRes.halfCheckedKeys); // disableStrictly
@@ -54450,10 +54520,6 @@ function addMonths(dirtyDate, dirtyAmount) {
     return date;
   }
 }
-// EXTERNAL MODULE: /home/runner/work/semi-design/semi-design/node_modules/lodash/isSet.js
-var isSet = __webpack_require__("/iLo");
-var isSet_default = /*#__PURE__*/__webpack_require__.n(isSet);
-
 // CONCATENATED MODULE: /home/runner/work/semi-design/semi-design/node_modules/date-fns/esm/differenceInCalendarMonths/index.js
 
 
@@ -77388,7 +77454,7 @@ class foundation_SliderFoundation extends foundation {
 
       const scroll = node => regex.test(style(node, 'overflow') + style(node, 'overflow-y') + style(node, 'overflow-x'));
 
-      const scrollParent = node => !node || node === document.body ? document.body : scroll(node) ? node : scrollParent(node.parentNode);
+      const scrollParent = node => !node || node === document.body || !(node instanceof Element) ? document.body : scroll(node) ? node : scrollParent(node.parentNode);
 
       return scrollParent(el);
     };
@@ -77512,7 +77578,7 @@ class foundation_SliderFoundation extends foundation {
       }
 
       if (step !== 1) {
-        // Find nearest step point 
+        // Find nearest step point
         stepValue = Math.round(stepValue / step) * step;
       }
 
@@ -80710,7 +80776,17 @@ class foundation_TableFoundation extends foundation {
 
 
   getFilteredSortedDataSource(dataSource, queries) {
-    const filteredDataSource = this.filterDataSource(dataSource, filter_default()(queries).call(queries, query => isFunction_default()(query.onFilter) && is_array_default()(query.filters) && query.filters.length && is_array_default()(query.filteredValue) && query.filteredValue.length));
+    const filteredDataSource = this.filterDataSource(dataSource, filter_default()(queries).call(queries, query => {
+      /**
+       * 这里无需判断 filteredValue 是否为数组，初始化时它是 `undefined`，点击选择空时为 `[]`
+       * 初始化时我们应该用 `defaultFilteredValue`，点击后我们应该用 `filteredValue`
+       *
+       * There is no need to judge whether `filteredValue` is an array here, because it is `undefined` when initialized, and `[]` when you click to select empty
+       * When initializing we should use `defaultFilteredValue`, after clicking we should use `filteredValue`
+       */
+      const currentFilteredValue = query.filteredValue ? query.filteredValue : query.defaultFilteredValue;
+      return isFunction_default()(query.onFilter) && is_array_default()(query.filters) && query.filters.length && is_array_default()(currentFilteredValue) && currentFilteredValue.length;
+    }));
     const sortedDataSource = this.sortDataSource(filteredDataSource, filter_default()(queries).call(queries, query => query && isFunction_default()(query.sorter)));
     return sortedDataSource;
   }
@@ -80869,10 +80945,12 @@ class foundation_TableFoundation extends foundation {
       const {
         onFilter,
         filteredValue,
-        filterChildrenRecord
+        filterChildrenRecord,
+        defaultFilteredValue
       } = filterObj;
+      const currentFilteredValue = is_array_default()(filteredValue) ? filteredValue : defaultFilteredValue;
 
-      if (typeof onFilter === 'function' && is_array_default()(filteredValue) && filteredValue.length) {
+      if (typeof onFilter === 'function' && is_array_default()(currentFilteredValue) && currentFilteredValue.length) {
         hasValidFilters = true;
 
         if (filteredData === null) {
@@ -80882,7 +80960,7 @@ class foundation_TableFoundation extends foundation {
           filteredData = new core_js_stable_map_default.a();
         }
 
-        each_default()(filteredValue, value => {
+        each_default()(currentFilteredValue, value => {
           each_default()(dataSource, record => {
             const childrenRecords = get_default()(record, childrenRecordName);
 
@@ -85692,10 +85770,17 @@ class Table_Table extends baseComponent_BaseComponent {
           titleArr.push(sorter);
         }
 
+        const stateFilteredValue = get_default()(curQuery, 'filteredValue');
+
+        const defaultFilteredValue = get_default()(curQuery, 'defaultFilteredValue');
+
+        const filteredValue = stateFilteredValue ? stateFilteredValue : defaultFilteredValue;
+
         if (is_array_default()(column.filters) && column.filters.length || /*#__PURE__*/Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["isValidElement"])(column.filterDropdown)) {
           const filter = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(ColumnFilter, assign_default()({
             key: table_constants_strings.DEFAULT_KEY_COLUMN_FILTER
           }, curQuery, {
+            filteredValue: filteredValue,
             onFilterDropdownVisibleChange: visible => _this.foundation.toggleShowFilter(dataIndex, visible),
             onSelect: data => _this.foundation.handleFilterSelect(dataIndex, data)
           }));
@@ -86284,11 +86369,12 @@ class Table_Table extends baseComponent_BaseComponent {
       willUpdateStates.cachedColumns = props.columns;
       willUpdateStates.cachedChildren = null;
     } else if (props.children && props.children !== state.cachedChildren) {
-      const newFlattenColumns = flattenColumns(getColumns(props.children));
+      const newNestedColumns = getColumns(props.children);
+      const newFlattenColumns = flattenColumns(newNestedColumns);
       const columns = mergeColumns(state.queries, newFlattenColumns, null, false);
       willUpdateStates.flattenColumns = newFlattenColumns;
       willUpdateStates.queries = [...columns];
-      willUpdateStates.cachedColumns = [...columns];
+      willUpdateStates.cachedColumns = [...newNestedColumns];
       willUpdateStates.cachedChildren = props.children;
     } // Update controlled selection column
 
@@ -90552,6 +90638,7 @@ class foundation_TreeFoundation extends foundation {
       selectedKeys = [],
       checkedKeys = new set_default.a([]),
       halfCheckedKeys = new set_default.a([]),
+      realCheckedKeys = new set_default.a([]),
       keyEntities = {},
       filteredKeys = new set_default.a([]),
       inputValue = '',
@@ -90561,13 +90648,26 @@ class foundation_TreeFoundation extends foundation {
       disabledKeys = new set_default.a([])
     } = this.getStates();
     const {
-      treeNodeFilterProp
+      treeNodeFilterProp,
+      checkRelation
     } = this.getProps();
     const entity = keyEntities[key];
     const notExist = !entity;
 
     if (notExist) {
       return null;
+    } // if checkRelation is invalid, the checked status of node will be false
+
+
+    let realChecked = false;
+    let realHalfChecked = false;
+
+    if (checkRelation === 'related') {
+      realChecked = checkedKeys.has(key);
+      realHalfChecked = halfCheckedKeys.has(key);
+    } else if (checkRelation === 'unRelated') {
+      realChecked = realCheckedKeys.has(key);
+      realHalfChecked = false;
     }
 
     const isSearching = Boolean(inputValue);
@@ -90575,8 +90675,8 @@ class foundation_TreeFoundation extends foundation {
       eventKey: key,
       expanded: isSearching ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
       selected: includes_default()(selectedKeys).call(selectedKeys, key),
-      checked: checkedKeys.has(key),
-      halfChecked: halfCheckedKeys.has(key),
+      checked: realChecked,
+      halfChecked: realHalfChecked,
       pos: String(entity ? entity.pos : ''),
       level: entity.level,
       filtered: filteredKeys.has(key),
@@ -90610,10 +90710,17 @@ class foundation_TreeFoundation extends foundation {
       keyEntities
     } = this.getStates();
     const {
-      leafOnly
+      leafOnly,
+      checkRelation
     } = this.getProps();
     let value;
-    const keyList = normalizeKeyList(key, keyEntities, leafOnly);
+    let keyList = [];
+
+    if (checkRelation === 'related') {
+      keyList = normalizeKeyList(key, keyEntities, leafOnly);
+    } else if (checkRelation === 'unRelated') {
+      keyList = key;
+    }
 
     if (this.getProp('onChangeWithObject')) {
       value = map_default()(keyList).call(keyList, itemKey => keyEntities[itemKey].data);
@@ -90828,30 +90935,58 @@ class foundation_TreeFoundation extends foundation {
 
   handleMultipleSelect(e, treeNode) {
     const {
-      disableStrictly
-    } = this.getProps(); // eventKey: The key value of the currently clicked node
+      disableStrictly,
+      checkRelation
+    } = this.getProps();
+    const {
+      realCheckedKeys
+    } = this.getStates(); // eventKey: The key value of the currently clicked node
 
     const {
       checked,
       eventKey,
       data
-    } = treeNode; // Find the checked state of the current node
+    } = treeNode;
 
-    const targetStatus = disableStrictly ? this.calcChekcedStatus(!checked, eventKey) : !checked;
-    const {
-      checkedKeys,
-      halfCheckedKeys
-    } = disableStrictly ? this.calcNonDisabedCheckedKeys(eventKey, targetStatus) : this.calcCheckedKeys(eventKey, targetStatus);
+    if (checkRelation === 'related') {
+      // Find the checked state of the current node
+      const targetStatus = disableStrictly ? this.calcChekcedStatus(!checked, eventKey) : !checked;
+      const {
+        checkedKeys,
+        halfCheckedKeys
+      } = disableStrictly ? this.calcNonDisabedCheckedKeys(eventKey, targetStatus) : this.calcCheckedKeys(eventKey, targetStatus);
 
-    this._adapter.notifySelect(eventKey, targetStatus, data);
+      this._adapter.notifySelect(eventKey, targetStatus, data);
 
-    this.notifyChange([...checkedKeys], e);
+      this.notifyChange([...checkedKeys], e);
 
-    if (!this._isControlledComponent()) {
-      this._adapter.updateState({
-        checkedKeys,
-        halfCheckedKeys
-      });
+      if (!this._isControlledComponent()) {
+        this._adapter.updateState({
+          checkedKeys,
+          halfCheckedKeys
+        });
+      }
+    } else if (checkRelation === 'unRelated') {
+      const newRealCheckedKeys = new set_default.a(realCheckedKeys);
+      let targetStatus;
+
+      if (realCheckedKeys.has(eventKey)) {
+        newRealCheckedKeys.delete(eventKey);
+        targetStatus = false;
+      } else {
+        newRealCheckedKeys.add(eventKey);
+        targetStatus = true;
+      }
+
+      this._adapter.notifySelect(eventKey, targetStatus, data);
+
+      this.notifyChange([...newRealCheckedKeys], e);
+
+      if (!this._isControlledComponent()) {
+        this._adapter.updateState({
+          realCheckedKeys: newRealCheckedKeys
+        });
+      }
     }
   }
 
@@ -92262,6 +92397,7 @@ class tree_Tree extends baseComponent_BaseComponent {
       selectedKeys: [],
       checkedKeys: new set_default.a(),
       halfCheckedKeys: new set_default.a(),
+      realCheckedKeys: new set_default.a([]),
       motionKeys: new set_default.a([]),
       motionType: 'hide',
       expandedKeys: new set_default.a(props.expandedKeys),
@@ -92472,12 +92608,16 @@ class tree_Tree extends baseComponent_BaseComponent {
       }
 
       if (checkedKeyValues) {
-        const {
-          checkedKeys,
-          halfCheckedKeys
-        } = calcCheckedKeys(checkedKeyValues, keyEntities);
-        newState.checkedKeys = checkedKeys;
-        newState.halfCheckedKeys = halfCheckedKeys;
+        if (props.checkRelation === 'unRelated') {
+          newState.realCheckedKeys = new set_default.a(checkedKeyValues);
+        } else if (props.checkRelation === 'related') {
+          const {
+            checkedKeys,
+            halfCheckedKeys
+          } = calcCheckedKeys(checkedKeyValues, keyEntities);
+          newState.checkedKeys = checkedKeys;
+          newState.halfCheckedKeys = halfCheckedKeys;
+        }
       }
     } // update loadedKeys
 
@@ -92487,7 +92627,7 @@ class tree_Tree extends baseComponent_BaseComponent {
     } // update disableStrictly
 
 
-    if (treeData && props.disableStrictly) {
+    if (treeData && props.disableStrictly && props.checkRelation === 'related') {
       newState.disabledKeys = calcDisabledKeys(keyEntities);
     }
 
@@ -92808,6 +92948,7 @@ tree_Tree.propTypes = {
   onDragStart: prop_types_default.a.func,
   onDrop: prop_types_default.a.func,
   labelEllipsis: prop_types_default.a.bool,
+  checkRelation: prop_types_default.a.string,
   'aria-label': prop_types_default.a.string
 };
 tree_Tree.defaultProps = {
@@ -92827,7 +92968,8 @@ tree_Tree.defaultProps = {
   expandAction: false,
   disableStrictly: false,
   draggable: false,
-  autoExpandWhenDragEnter: true
+  autoExpandWhenDragEnter: true,
+  checkRelation: 'related'
 };
 tree_Tree.TreeNode = treeNode_TreeNode;
 /* harmony default export */ var tree_0 = (tree_Tree);
@@ -92973,6 +93115,7 @@ class foundation_TreeSelectFoundation extends foundation {
       selectedKeys = [],
       checkedKeys = new set_default.a([]),
       halfCheckedKeys = new set_default.a([]),
+      realCheckedKeys = new set_default.a([]),
       keyEntities = {},
       filteredKeys = new set_default.a([]),
       inputValue = '',
@@ -92982,13 +93125,26 @@ class foundation_TreeSelectFoundation extends foundation {
       disabledKeys = new set_default.a([])
     } = this.getStates();
     const {
-      treeNodeFilterProp
+      treeNodeFilterProp,
+      checkRelation
     } = this.getProps();
     const entity = keyEntities[key];
     const notExist = !entity;
 
     if (notExist) {
       return null;
+    } // if checkRelation is invalid, the checked status of node will be false
+
+
+    let realChecked = false;
+    let realHalfChecked = false;
+
+    if (checkRelation === 'related') {
+      realChecked = checkedKeys.has(key);
+      realHalfChecked = halfCheckedKeys.has(key);
+    } else if (checkRelation === 'unRelated') {
+      realChecked = realCheckedKeys.has(key);
+      realHalfChecked = false;
     }
 
     const isSearching = Boolean(inputValue);
@@ -92996,8 +93152,8 @@ class foundation_TreeSelectFoundation extends foundation {
       eventKey: key,
       expanded: isSearching ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
       selected: includes_default()(selectedKeys).call(selectedKeys, key),
-      checked: checkedKeys.has(key),
-      halfChecked: halfCheckedKeys.has(key),
+      checked: realChecked,
+      halfChecked: realHalfChecked,
       pos: String(entity ? entity.pos : ''),
       level: entity.level,
       filtered: filteredKeys.has(key),
@@ -93063,9 +93219,16 @@ class foundation_TreeSelectFoundation extends foundation {
       keyEntities
     } = this.getStates();
     const {
-      leafOnly
+      leafOnly,
+      checkRelation
     } = this.getProps();
-    const keyList = normalizeKeyList(key, keyEntities, leafOnly);
+    let keyList = [];
+
+    if (checkRelation === 'related') {
+      keyList = normalizeKeyList(key, keyEntities, leafOnly);
+    } else if (checkRelation === 'unRelated') {
+      keyList = key;
+    }
 
     const nodes = map_default()(keyList).call(keyList, i => keyEntities[i].data);
 
@@ -93192,7 +93355,8 @@ class foundation_TreeSelectFoundation extends foundation {
       this._adapter.updateState({
         selectedKeys: [],
         checkedKeys: new set_default.a(),
-        halfCheckedKeys: new set_default.a()
+        halfCheckedKeys: new set_default.a(),
+        realCheckedKeys: new set_default.a([])
       });
     } // When triggerSearch, clicking the clear button will trigger to clear Input
 
@@ -93220,11 +93384,13 @@ class foundation_TreeSelectFoundation extends foundation {
 
   removeTag(eventKey) {
     const {
-      disableStrictly
+      disableStrictly,
+      checkRelation
     } = this.getProps();
     const {
       keyEntities,
-      disabledKeys
+      disabledKeys,
+      realCheckedKeys
     } = this.getStates();
     const item = keyEntities[eventKey].data;
 
@@ -93232,20 +93398,35 @@ class foundation_TreeSelectFoundation extends foundation {
       return;
     }
 
-    const {
-      checkedKeys,
-      halfCheckedKeys
-    } = this.calcCheckedKeys(eventKey, false);
+    if (checkRelation === 'unRelated') {
+      const newRealCheckedKeys = new set_default.a(realCheckedKeys);
+      newRealCheckedKeys.delete(eventKey);
 
-    this._notifyChange([...checkedKeys], null);
+      this._notifyChange([...newRealCheckedKeys], null);
 
-    if (!this._isControlledComponent()) {
-      this._adapter.updateState({
+      if (!this._isControlledComponent()) {
+        this._adapter.updateState({
+          realCheckedKeys: newRealCheckedKeys
+        });
+
+        this._adapter.rePositionDropdown();
+      }
+    } else if (checkRelation === 'related') {
+      const {
         checkedKeys,
         halfCheckedKeys
-      });
+      } = this.calcCheckedKeys(eventKey, false);
 
-      this._adapter.rePositionDropdown();
+      this._notifyChange([...checkedKeys], null);
+
+      if (!this._isControlledComponent()) {
+        this._adapter.updateState({
+          checkedKeys,
+          halfCheckedKeys
+        });
+
+        this._adapter.rePositionDropdown();
+      }
     }
 
     this._adapter.notifySelect(eventKey, false, item); // reposition dropdown when selected values change
@@ -93396,39 +93577,67 @@ class foundation_TreeSelectFoundation extends foundation {
   handleMultipleSelect(e, treeNode) {
     const {
       searchPosition,
-      disableStrictly
+      disableStrictly,
+      checkRelation
     } = this.getProps();
     const {
-      inputValue
+      inputValue,
+      realCheckedKeys
     } = this.getStates();
     const {
       checked,
       eventKey,
       data
     } = treeNode;
-    const targetStatus = disableStrictly ? this.calcChekcedStatus(!checked, eventKey) : !checked;
-    const {
-      checkedKeys,
-      halfCheckedKeys
-    } = disableStrictly ? this.calcNonDisabedCheckedKeys(eventKey, targetStatus) : this.calcCheckedKeys(eventKey, targetStatus);
 
-    this._adapter.notifySelect(eventKey, targetStatus, data);
+    if (checkRelation === 'related') {
+      const targetStatus = disableStrictly ? this.calcChekcedStatus(!checked, eventKey) : !checked;
+      const {
+        checkedKeys,
+        halfCheckedKeys
+      } = disableStrictly ? this.calcNonDisabedCheckedKeys(eventKey, targetStatus) : this.calcCheckedKeys(eventKey, targetStatus);
 
-    this._notifyChange([...checkedKeys], e);
+      this._adapter.notifySelect(eventKey, targetStatus, data);
 
-    if (searchPosition === treeSelect_constants_strings.SEARCH_POSITION_TRIGGER && inputValue !== '') {
-      this._adapter.updateState({
-        inputValue: ''
-      });
+      this._notifyChange([...checkedKeys], e);
+
+      if (!this._isControlledComponent()) {
+        this._adapter.updateState({
+          checkedKeys,
+          halfCheckedKeys
+        });
+
+        this._adapter.rePositionDropdown();
+      }
+    } else if (checkRelation === 'unRelated') {
+      const newRealCheckedKeys = new set_default.a(realCheckedKeys);
+      let targetStatus;
+
+      if (realCheckedKeys.has(eventKey)) {
+        newRealCheckedKeys.delete(eventKey);
+        targetStatus = false;
+      } else {
+        newRealCheckedKeys.add(eventKey);
+        targetStatus = true;
+      }
+
+      this._adapter.notifySelect(eventKey, targetStatus, data);
+
+      this._notifyChange([...newRealCheckedKeys], e);
+
+      if (!this._isControlledComponent()) {
+        this._adapter.updateState({
+          realCheckedKeys: newRealCheckedKeys
+        });
+
+        this._adapter.rePositionDropdown();
+      }
     }
 
-    if (!this._isControlledComponent()) {
+    if (searchPosition === treeSelect_constants_strings.SEARCH_POSITION_TRIGGER && inputValue !== '') {
       this._adapter.updateState({
-        checkedKeys,
-        halfCheckedKeys
+        inputValue: ''
       });
-
-      this._adapter.rePositionDropdown();
     }
   }
 
@@ -93756,34 +93965,52 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
       this.foundation.handleSelectionEnterPress(e);
     };
 
-    this.showClearBtn = () => {
+    this.hasValue = () => {
       const {
-        searchPosition
+        multiple,
+        checkRelation
       } = this.props;
       const {
-        inputValue
+        realCheckedKeys,
+        checkedKeys,
+        selectedKeys
       } = this.state;
-      const triggerSearchHasInputValue = searchPosition === treeSelect_constants_strings.SEARCH_POSITION_TRIGGER && inputValue;
+      let hasValue = false;
+
+      if (multiple) {
+        if (checkRelation === 'related') {
+          hasValue = Boolean(checkedKeys.size);
+        } else if (checkRelation === 'unRelated') {
+          hasValue = Boolean(realCheckedKeys.size);
+        }
+      } else {
+        hasValue = Boolean(selectedKeys.length);
+      }
+
+      return hasValue;
+    };
+
+    this.showClearBtn = () => {
       const {
         showClear,
         disabled,
-        multiple
+        searchPosition
       } = this.props;
       const {
-        selectedKeys,
-        checkedKeys,
+        inputValue,
         isOpen,
         isHovering
       } = this.state;
-      const hasValue = multiple ? Boolean(checkedKeys.size) : Boolean(selectedKeys.length);
-      return showClear && (hasValue || triggerSearchHasInputValue) && !disabled && (isOpen || isHovering);
+      const triggerSearchHasInputValue = searchPosition === treeSelect_constants_strings.SEARCH_POSITION_TRIGGER && inputValue;
+      return showClear && (this.hasValue() || triggerSearchHasInputValue) && !disabled && (isOpen || isHovering);
     };
 
     this.renderTagList = () => {
       const {
         checkedKeys,
         keyEntities,
-        disabledKeys
+        disabledKeys,
+        realCheckedKeys
       } = this.state;
       const {
         treeNodeLabelProp,
@@ -93791,13 +94018,21 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         disabled,
         disableStrictly,
         size,
+        checkRelation,
         renderSelectedItem: propRenderSelectedItem
       } = this.props;
       const renderSelectedItem = isFunction_default()(propRenderSelectedItem) ? propRenderSelectedItem : item => ({
         isRenderInTag: true,
         content: get_default()(item, treeNodeLabelProp, null)
       });
-      const renderKeys = normalizeKeyList([...checkedKeys], keyEntities, leafOnly);
+      let renderKeys = [];
+
+      if (checkRelation === 'related') {
+        renderKeys = normalizeKeyList([...checkedKeys], keyEntities, leafOnly);
+      } else if (checkRelation === 'unRelated') {
+        renderKeys = [...realCheckedKeys];
+      }
+
       const tagList = []; // eslint-disable-next-line @typescript-eslint/no-shadow
 
       for_each_default()(renderKeys).call(renderKeys, key => {
@@ -93886,11 +94121,6 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         searchPosition,
         filterTreeNode
       } = this.props;
-      const {
-        selectedKeys,
-        checkedKeys
-      } = this.state;
-      const hasValue = multiple ? Boolean(checkedKeys.size) : Boolean(selectedKeys.length);
       const isTriggerPositionSearch = filterTreeNode && searchPosition === treeSelect_constants_strings.SEARCH_POSITION_TRIGGER; // searchPosition = trigger
 
       if (isTriggerPositionSearch) {
@@ -93898,7 +94128,7 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
       } // searchPosition = dropdown and single seleciton
 
 
-      if (!multiple || !hasValue) {
+      if (!multiple || !this.hasValue()) {
         const renderText = this.foundation.getRenderTextInSingle();
         const spanCls = classnames_default()({
           ["".concat(treeSelect_prefixcls, "-selection-placeholder")]: !renderText
@@ -94155,14 +94385,23 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
         size,
         searchAutoFocus,
         placeholder,
-        maxTagCount
+        maxTagCount,
+        checkRelation
       } = this.props;
       const {
         keyEntities,
         checkedKeys,
-        inputValue
+        inputValue,
+        realCheckedKeys
       } = this.state;
-      const keyList = normalizeKeyList(checkedKeys, keyEntities, leafOnly);
+      let keyList = [];
+
+      if (checkRelation === 'related') {
+        keyList = normalizeKeyList(checkedKeys, keyEntities, leafOnly);
+      } else if (checkRelation === 'unRelated') {
+        keyList = [...realCheckedKeys];
+      }
+
       return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(tagInput_0, {
         maxTagCount: maxTagCount,
         disabled: disabled,
@@ -94487,6 +94726,7 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
       selectedKeys: [],
       checkedKeys: new set_default.a(),
       halfCheckedKeys: new set_default.a(),
+      realCheckedKeys: new set_default.a([]),
       disabledKeys: new set_default.a(),
       motionKeys: new set_default.a([]),
       motionType: 'hide',
@@ -94607,12 +94847,16 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
       }
 
       if (checkedKeyValues) {
-        const {
-          checkedKeys,
-          halfCheckedKeys
-        } = calcCheckedKeys(checkedKeyValues, keyEntities);
-        newState.checkedKeys = checkedKeys;
-        newState.halfCheckedKeys = halfCheckedKeys;
+        if (props.checkRelation === 'unRelated') {
+          newState.realCheckedKeys = new set_default.a(checkedKeyValues);
+        } else if (props.checkRelation === 'related') {
+          const {
+            checkedKeys,
+            halfCheckedKeys
+          } = calcCheckedKeys(checkedKeyValues, keyEntities);
+          newState.checkedKeys = checkedKeys;
+          newState.halfCheckedKeys = halfCheckedKeys;
+        }
       }
     } // loadedKeys
 
@@ -94627,7 +94871,7 @@ class treeSelect_TreeSelect extends baseComponent_BaseComponent {
     } // ================ disableStrictly =================
 
 
-    if (treeData && props.disableStrictly) {
+    if (treeData && props.disableStrictly && props.checkRelation === 'related') {
       newState.disabledKeys = calcDisabledKeys(keyEntities);
     }
 
@@ -94893,6 +95137,7 @@ treeSelect_TreeSelect.propTypes = {
   optionListStyle: prop_types_default.a.object,
   searchRender: prop_types_default.a.oneOfType([prop_types_default.a.func, prop_types_default.a.bool]),
   renderSelectedItem: prop_types_default.a.func,
+  checkRelation: prop_types_default.a.string,
   'aria-label': prop_types_default.a.string
 };
 treeSelect_TreeSelect.defaultProps = {
@@ -94921,6 +95166,7 @@ treeSelect_TreeSelect.defaultProps = {
   expandAction: false,
   clickToHide: true,
   searchAutoFocus: false,
+  checkRelation: 'related',
   'aria-label': 'TreeSelect'
 };
 /* harmony default export */ var treeSelect_0 = (treeSelect_TreeSelect);
@@ -96492,6 +96738,7 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
       onPreviewClick,
       showPicInfo,
       renderPicInfo,
+      renderPicPreviewIcon,
       renderThumbnail,
       name,
       index
@@ -96499,6 +96746,7 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
     const showProgress = status === upload_constants_strings.FILE_STATUS_UPLOADING && percent !== 100;
     const showRetry = status === upload_constants_strings.FILE_STATUS_UPLOAD_FAIL && this.props.showRetry;
     const showReplace = status === upload_constants_strings.FILE_STATUS_SUCCESS && this.props.showReplace;
+    const showPreview = status === upload_constants_strings.FILE_STATUS_SUCCESS && !this.props.showReplace;
     const filePicCardCls = classnames_default()({
       ["".concat(fileCard_prefixCls, "-picture-file-card")]: true,
       ["".concat(fileCard_prefixCls, "-picture-file-card-disabled")]: disabled,
@@ -96506,7 +96754,6 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
       ["".concat(fileCard_prefixCls, "-picture-file-card-error")]: status === upload_constants_strings.FILE_STATUS_UPLOAD_FAIL,
       ["".concat(fileCard_prefixCls, "-picture-file-card-uploading")]: showProgress
     });
-    const closeCls = "".concat(fileCard_prefixCls, "-picture-file-card-close");
     const retry = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
       role: "button",
       tabIndex: 0,
@@ -96529,6 +96776,17 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
     }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(ReplaceSvg, {
       className: "".concat(fileCard_prefixCls, "-picture-file-card-icon-replace")
     })));
+    const preview = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+      className: "".concat(fileCard_prefixCls, "-picture-file-card-preview")
+    }, typeof renderPicPreviewIcon === 'function' ? renderPicPreviewIcon(this.props) : null);
+    const close = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+      role: "button",
+      tabIndex: 0,
+      className: "".concat(fileCard_prefixCls, "-picture-file-card-close"),
+      onClick: e => this.onRemove(e)
+    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconClear, {
+      className: "".concat(fileCard_prefixCls, "-picture-file-card-icon-close")
+    }));
     const picInfo = typeof renderPicInfo === 'function' ? renderPicInfo(this.props) : /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
       className: "".concat(fileCard_prefixCls, "-picture-file-card-pic-info")
     }, index + 1);
@@ -96547,14 +96805,7 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
       size: "small",
       orbitStroke: '#FFF',
       "aria-label": "uploading file progress"
-    }) : null, showRetry ? retry : null, showReplace && replace, showPicInfo && picInfo, !disabled && /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-      className: closeCls,
-      onClick: e => this.onRemove(e)
-    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconClose, {
-      tabIndex: 0,
-      role: "button",
-      size: "extra-small"
-    })), this.renderPicValidateMsg());
+    }) : null, showRetry ? retry : null, showReplace && replace, showPreview && preview, showPicInfo && picInfo, !disabled && close, this.renderPicValidateMsg());
   }
 
   renderFile(locale) {
@@ -96569,7 +96820,8 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
       previewFile,
       status,
       style,
-      onPreviewClick
+      onPreviewClick,
+      renderFileOperation
     } = this.props;
     const fileCardCls = classnames_default()({
       ["".concat(fileCard_prefixCls, "-file-card")]: true,
@@ -96599,6 +96851,14 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
       previewContent = previewFile(this.props);
     }
 
+    const operation = typeof renderFileOperation === 'function' ? renderFileOperation(this.props) : /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(button_0, {
+      onClick: e => this.onRemove(e),
+      type: "tertiary",
+      icon: /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconClose, null),
+      theme: "borderless",
+      size: "small",
+      className: closeCls
+    });
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
       role: "listitem",
       className: fileCardCls,
@@ -96619,7 +96879,7 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
       position: "top",
       showArrow: false,
       content: locale.replace
-    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(iconButton_0, {
+    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(button_0, {
       onClick: e => this.onReplace(e),
       type: "tertiary",
       theme: "borderless",
@@ -96641,29 +96901,22 @@ class fileCard_FileCard extends external_root_React_commonjs2_react_commonjs_rea
       tabIndex: 0,
       className: "".concat(infoCls, "-retry"),
       onClick: e => this.onRetry(e)
-    }, locale.retry) : null)), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(iconButton_0, {
-      onClick: e => this.onRemove(e),
-      type: "tertiary",
-      icon: /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconClose, null),
-      theme: "borderless",
-      size: "small",
-      className: closeCls
-    }));
+    }, locale.retry) : null)), operation);
   }
 
   onRemove(e) {
     e.stopPropagation();
-    this.props.onRemove(this.props, e);
+    this.props.onRemove();
   }
 
   onReplace(e) {
     e.stopPropagation();
-    this.props.onReplace(this.props, e);
+    this.props.onReplace();
   }
 
   onRetry(e) {
     e.stopPropagation();
-    this.props.onRetry(this.props, e);
+    this.props.onRetry();
   }
 
   render() {
@@ -96727,6 +96980,7 @@ var upload = __webpack_require__("/t7F");
 
 
 
+
 /* eslint-disable max-len */
 
 
@@ -96837,14 +97091,14 @@ class upload_Upload extends baseComponent_BaseComponent {
         previewFile,
         listType,
         itemStyle,
-        showRetry,
         showPicInfo,
         renderPicInfo,
+        renderPicPreviewIcon,
+        renderFileOperation,
         renderFileItem,
         renderThumbnail,
         disabled,
-        onPreviewClick,
-        showReplace
+        onPreviewClick
       } = this.props;
 
       const onRemove = () => this.remove(file);
@@ -96857,20 +97111,20 @@ class upload_Upload extends baseComponent_BaseComponent {
         this.replace(index);
       };
 
-      const fileCardProps = assign_default()(assign_default()({}, file), {
+      const fileCardProps = assign_default()(assign_default()(assign_default()({}, pick_default()(this.props, ['showRetry', 'showReplace', ''])), file), {
         previewFile,
         listType,
         onRemove,
         onRetry,
         index,
         key: uid || concat_default()(_context = "".concat(name)).call(_context, index),
-        showRetry: typeof file.showRetry !== 'undefined' ? file.showRetry : showRetry,
         style: itemStyle,
         disabled,
         showPicInfo,
         renderPicInfo,
+        renderPicPreviewIcon,
+        renderFileOperation,
         renderThumbnail,
-        showReplace: typeof file.showReplace !== 'undefined' ? file.showReplace : showReplace,
         onReplace,
         onPreviewClick: typeof onPreviewClick !== 'undefined' ? () => this.foundation.handlePreviewClick(file) : undefined
       });
@@ -96912,7 +97166,8 @@ class upload_Upload extends baseComponent_BaseComponent {
         limit,
         disabled,
         children,
-        draggable
+        draggable,
+        hotSpotLocation
       } = this.props;
       const {
         fileList: stateFileList,
@@ -96970,7 +97225,7 @@ class upload_Upload extends baseComponent_BaseComponent {
         className: mainCls,
         role: "list",
         "aria-label": "picture list"
-      }, map_default()(fileList).call(fileList, (file, index) => this.renderFile(file, index, locale)), showAddTriggerInList ? addContent : null)));
+      }, showAddTriggerInList && hotSpotLocation === 'start' ? addContent : null, map_default()(fileList).call(fileList, (file, index) => this.renderFile(file, index, locale)), showAddTriggerInList && hotSpotLocation === 'end' ? addContent : null)));
     };
 
     this.renderFileListDefault = () => {
@@ -97310,6 +97565,7 @@ upload_Upload.propTypes = {
   fileList: prop_types_default.a.array,
   fileName: prop_types_default.a.string,
   headers: prop_types_default.a.oneOfType([prop_types_default.a.object, prop_types_default.a.func]),
+  hotSpotLocation: prop_types_default.a.oneOf(['start', 'end']),
   itemStyle: prop_types_default.a.object,
   limit: prop_types_default.a.number,
   listType: prop_types_default.a.oneOf(upload_constants_strings.LIST_TYPE),
@@ -97335,6 +97591,8 @@ upload_Upload.propTypes = {
   prompt: prop_types_default.a.node,
   promptPosition: prop_types_default.a.oneOf(upload_constants_strings.PROMPT_POSITION),
   renderFileItem: prop_types_default.a.func,
+  renderPicPreviewIcon: prop_types_default.a.func,
+  renderFileOperation: prop_types_default.a.func,
   renderPicInfo: prop_types_default.a.func,
   renderThumbnail: prop_types_default.a.func,
   showClear: prop_types_default.a.bool,
@@ -97354,6 +97612,7 @@ upload_Upload.defaultProps = {
   defaultFileList: [],
   disabled: false,
   listType: 'list',
+  hotSpotLocation: 'end',
   multiple: false,
   onAcceptInvalid: noop_default.a,
   onChange: noop_default.a,