@douyinfe/semi-foundation 2.4.0 → 2.5.0

package/cascader/cascader.scss

@@ -20,6 +20,7 @@ $module: #{$prefix}-cascader;
 
     &:hover {
         background-color: $color-cascader_default-bg-hover;
+        border: $width-cascader_hover-border $color-cascader_default-border-hover solid;
     }
 
     &-small {

package/cascader/variables.scss

@@ -1,9 +1,10 @@
 $radius-cascader: var(--semi-border-radius-small); // 级联选择菜单圆角
 
-$color-cascader_default-border-default: transparent; // 级联选择描边颜色
+$color-cascader_default-border-default: transparent; // 级联选择描边颜色 - 默认
+$color-cascader_default-border-hover: transparent; // 级联选择描边颜色 - 悬浮
+$color-cascader_default-border-focus: var(--semi-color-focus-border); // 级联选择描边颜色 - 选中
 $color-cascader_default-bg-default: var(--semi-color-fill-0); // 级联选择菜单项背景颜色 - 默认
 $color-cascader_default-bg-hover: var(--semi-color-fill-1); // 级联选择菜单项背景颜色 - 悬浮
-$color-cascader_default-border-focus: var(--semi-color-focus-border); // 级联选择描边颜色 - 选中
 $color-cascader_option_list-border-default: var(--semi-color-fill-0); // 级联选择各级菜单分割线颜色
 $color-cascader_option_main-text-default: var(--semi-color-text-0); // 级联选择菜单项文字颜色
 $color-cascader_option-bg-hover: var(--semi-color-fill-0); // 级联选择菜单项背景颜色 - 悬浮
@@ -83,6 +84,7 @@ $width-cascader:  80px; // 级联选择触发器最小宽度
 $height-cascader_default:  $height-control-default; // 级联选择触发器高度 - 默认
 $height-cascader_small: $height-control-small; // 级联选择触发器高度 - 小尺寸
 $height-cascader_large: $height-control-large; // 级联选择触发器高度 - 大尺寸
+$width-cascader_hover-border: $width-cascader-border; // 级联选择触发器描边宽度 - 悬浮
 $width-cascader_focus-border: $border-thickness-control-focus; // 级联选择触发器描边宽度 - 选中态
 $width-cascader_search-border: 1px; // 级联选择触搜索描边宽度
 $width-cascader-icon: 16px; // 级联选择图标尺寸

package/datePicker/foundation.ts

@@ -384,6 +384,18 @@ export default class DatePickerFoundation extends BaseFoundation<DatePickerAdapt
         this._adapter.notifyBlur(e);
     }
 
+    /**
+     * clear range input focus when open is controlled
+     * fixed github 1375
+     */
+    clearRangeInputFocus = () => {
+        const { type } = this._adapter.getProps();
+        const { rangeInputFocus } = this._adapter.getStates();
+        if (type === 'dateTimeRange' && rangeInputFocus) {
+            this._adapter.setRangeInputFocus(false);
+        }
+    }
+
     /**
      * Callback when the content of the input box changes
      * Update the date panel if the changed value is a legal date, otherwise only update the input box

package/lib/cjs/autoComplete/constants.d.ts

@@ -3,7 +3,7 @@ declare const cssClasses: {
 };
 declare const strings: {
     readonly SIZE: readonly ["small", "large", "default"];
-    readonly POSITION: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver"];
+    readonly POSITION: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver", "leftBottomOver", "rightBottomOver"];
     readonly OPTIONS: readonly ["children", "value"];
     readonly STATUS: readonly ["default", "error", "warning", "success"];
 };

package/lib/cjs/cascader/cascader.css

@@ -19,6 +19,7 @@
 }
 .semi-cascader:hover {
   background-color: var(--semi-color-fill-1);
+  border: 1px transparent solid;
 }
 .semi-cascader-small {
   min-height: 24px;

package/lib/cjs/cascader/cascader.scss

@@ -20,6 +20,7 @@ $module: #{$prefix}-cascader;
 
     &:hover {
         background-color: $color-cascader_default-bg-hover;
+        border: $width-cascader_hover-border $color-cascader_default-border-hover solid;
     }
 
     &-small {

package/lib/cjs/cascader/variables.scss

@@ -1,9 +1,10 @@
 $radius-cascader: var(--semi-border-radius-small); // 级联选择菜单圆角
 
-$color-cascader_default-border-default: transparent; // 级联选择描边颜色
+$color-cascader_default-border-default: transparent; // 级联选择描边颜色 - 默认
+$color-cascader_default-border-hover: transparent; // 级联选择描边颜色 - 悬浮
+$color-cascader_default-border-focus: var(--semi-color-focus-border); // 级联选择描边颜色 - 选中
 $color-cascader_default-bg-default: var(--semi-color-fill-0); // 级联选择菜单项背景颜色 - 默认
 $color-cascader_default-bg-hover: var(--semi-color-fill-1); // 级联选择菜单项背景颜色 - 悬浮
-$color-cascader_default-border-focus: var(--semi-color-focus-border); // 级联选择描边颜色 - 选中
 $color-cascader_option_list-border-default: var(--semi-color-fill-0); // 级联选择各级菜单分割线颜色
 $color-cascader_option_main-text-default: var(--semi-color-text-0); // 级联选择菜单项文字颜色
 $color-cascader_option-bg-hover: var(--semi-color-fill-0); // 级联选择菜单项背景颜色 - 悬浮
@@ -83,6 +84,7 @@ $width-cascader:  80px; // 级联选择触发器最小宽度
 $height-cascader_default:  $height-control-default; // 级联选择触发器高度 - 默认
 $height-cascader_small: $height-control-small; // 级联选择触发器高度 - 小尺寸
 $height-cascader_large: $height-control-large; // 级联选择触发器高度 - 大尺寸
+$width-cascader_hover-border: $width-cascader-border; // 级联选择触发器描边宽度 - 悬浮
 $width-cascader_focus-border: $border-thickness-control-focus; // 级联选择触发器描边宽度 - 选中态
 $width-cascader_search-border: 1px; // 级联选择触搜索描边宽度
 $width-cascader-icon: 16px; // 级联选择图标尺寸

package/lib/cjs/datePicker/foundation.d.ts

@@ -221,6 +221,11 @@ export default class DatePickerFoundation extends BaseFoundation<DatePickerAdapt
      * @param {Date[]} dates
      */
     closePanel(e?: any, inputValue?: string, dates?: Date[]): void;
+    /**
+     * clear range input focus when open is controlled
+     * fixed github 1375
+     */
+    clearRangeInputFocus: () => void;
     /**
      * Callback when the content of the input box changes
      * Update the date panel if the changed value is a legal date, otherwise only update the input box

package/lib/cjs/datePicker/foundation.js

@@ -76,6 +76,24 @@ var _constants2 = require("../input/constants");
 class DatePickerFoundation extends _foundation.default {
   constructor(adapter) {
     super((0, _assign.default)({}, adapter));
+    /**
+     * clear range input focus when open is controlled
+     * fixed github 1375
+     */
+
+    this.clearRangeInputFocus = () => {
+      const {
+        type
+      } = this._adapter.getProps();
+
+      const {
+        rangeInputFocus
+      } = this._adapter.getStates();
+
+      if (type === 'dateTimeRange' && rangeInputFocus) {
+        this._adapter.setRangeInputFocus(false);
+      }
+    };
 
     this.getMergedMotion = motion => {
       const mergedMotion = typeof motion === 'undefined' || motion ? (0, _assign.default)((0, _assign.default)({}, motion), {

package/lib/cjs/dropdown/constants.d.ts

@@ -4,7 +4,7 @@ declare const cssClasses: {
     DISABLED: string;
 };
 declare const strings: {
-    POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver"];
+    POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver", "leftBottomOver", "rightBottomOver"];
     TRIGGER_SET: string[];
     DEFAULT_LEAVE_DELAY: number;
     ITEM_TYPE: string[];

package/lib/cjs/select/constants.d.ts

@@ -5,7 +5,7 @@ declare const cssClasses: {
 };
 declare const strings: {
     readonly SIZE_SET: readonly ["small", "large", "default"];
-    readonly POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver"];
+    readonly POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver", "leftBottomOver", "rightBottomOver"];
     readonly MODE_SELECT: "select";
     readonly MODE_AUTOCOMPLETE: "autoComplete";
     readonly STATUS: readonly ["default", "error", "warning", "success"];

package/lib/cjs/select/foundation.d.ts

@@ -36,7 +36,7 @@ export interface SelectAdapter<P = Record<string, any>, S = Record<string, any>>
     notifyMouseLeave(event: any): void;
     notifyMouseEnter(event: any): void;
     updateHovering(isHover: boolean): void;
-    updateScrollTop(): void;
+    updateScrollTop(index?: number): void;
 }
 declare type LabelValue = string | number;
 declare type PropValue = LabelValue | Record<string, any>;

package/lib/cjs/select/foundation.js

@@ -944,8 +944,9 @@ class SelectFoundation extends _foundation.default {
     } // console.log('new:' + index);
 
 
-    this._adapter.updateFocusIndex(index); // TODO requires scrollIntoView
+    this._adapter.updateFocusIndex(index);
 
+    this._adapter.updateScrollTop(index);
   }
 
   _handleArrowKeyDown(offset) {

package/lib/cjs/select/optionFoundation.d.ts

@@ -17,5 +17,5 @@ export default class OptionFoundation extends BaseFoundation<OptionDefaultAdapte
     init(): void;
     destroy(): void;
     onOptionClick(option: BasicOptionProps): void;
-    isDisbled_(): any;
+    _isDisabled(): any;
 }

package/lib/cjs/select/optionFoundation.js

@@ -26,14 +26,14 @@ class OptionFoundation extends _foundation.default {
   destroy() {}
 
   onOptionClick(option) {
-    const isDisbled = this.isDisbled_();
+    const isDisabled = this._isDisabled();
 
-    if (!isDisbled) {
+    if (!isDisabled) {
       this._adapter.notifyClick(option);
     }
   }
 
-  isDisbled_() {
+  _isDisabled() {
     return this.getProp('disabled');
   }
 

package/lib/cjs/slider/foundation.js

@@ -162,7 +162,7 @@ class SliderFoundation extends _foundation.default {
 
       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);
     };
@@ -286,7 +286,7 @@ class SliderFoundation extends _foundation.default {
       }
 
       if (step !== 1) {
-        // Find nearest step point 
+        // Find nearest step point
         stepValue = Math.round(stepValue / step) * step;
       }
 

package/lib/cjs/table/foundation.d.ts

@@ -8,6 +8,7 @@ export interface BaseColumnProps<RecordType> {
     className?: string;
     colSpan?: number;
     dataIndex?: string;
+    defaultFilteredValue?: any[];
     defaultSortOrder?: BaseSortOrder;
     filterChildrenRecord?: boolean;
     filterDropdown?: any;
@@ -313,6 +314,7 @@ export interface BaseChangeInfoFilter<RecordType> {
     filters?: BaseFilter[];
     onFilter?: (filteredValue?: any, record?: RecordType) => boolean;
     filteredValue?: any[];
+    defaultFilteredValue?: any[];
     children?: BaseFilter[];
     filterChildrenRecord?: boolean;
 }

package/lib/cjs/table/foundation.js

@@ -219,7 +219,17 @@ class TableFoundation extends _foundation.default {
 
 
   getFilteredSortedDataSource(dataSource, queries) {
-    const filteredDataSource = this.filterDataSource(dataSource, (0, _filter2.default)(queries).call(queries, query => (0, _isFunction2.default)(query.onFilter) && (0, _isArray.default)(query.filters) && query.filters.length && (0, _isArray.default)(query.filteredValue) && query.filteredValue.length));
+    const filteredDataSource = this.filterDataSource(dataSource, (0, _filter2.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 (0, _isFunction2.default)(query.onFilter) && (0, _isArray.default)(query.filters) && query.filters.length && (0, _isArray.default)(currentFilteredValue) && currentFilteredValue.length;
+    }));
     const sortedDataSource = this.sortDataSource(filteredDataSource, (0, _filter2.default)(queries).call(queries, query => query && (0, _isFunction2.default)(query.sorter)));
     return sortedDataSource;
   }
@@ -375,10 +385,12 @@ class TableFoundation extends _foundation.default {
       const {
         onFilter,
         filteredValue,
-        filterChildrenRecord
+        filterChildrenRecord,
+        defaultFilteredValue
       } = filterObj;
+      const currentFilteredValue = (0, _isArray.default)(filteredValue) ? filteredValue : defaultFilteredValue;
 
-      if (typeof onFilter === 'function' && (0, _isArray.default)(filteredValue) && filteredValue.length) {
+      if (typeof onFilter === 'function' && (0, _isArray.default)(currentFilteredValue) && currentFilteredValue.length) {
         hasValidFilters = true;
 
         if (filteredData === null) {
@@ -388,7 +400,7 @@ class TableFoundation extends _foundation.default {
           filteredData = new _map.default();
         }
 
-        (0, _each2.default)(filteredValue, value => {
+        (0, _each2.default)(currentFilteredValue, value => {
           (0, _each2.default)(dataSource, record => {
             const childrenRecords = (0, _get2.default)(record, childrenRecordName);
             const recordKey = this.getRecordKey(record);

package/lib/cjs/table/utils.js

@@ -384,7 +384,10 @@ function assignColumnKeys(columns) {
     if (column.key == null) {
       var _context4;
 
-      column.key = (0, _concat.default)(_context4 = "".concat(level, "-")).call(_context4, index);
+      // if user give column a dataIndex, use it for backup
+      const _index = column.dataIndex || index;
+
+      column.key = (0, _concat.default)(_context4 = "".concat(level, "-")).call(_context4, _index);
     }
 
     if ((0, _isArray.default)(column[childrenColumnName]) && column[childrenColumnName].length) {

package/lib/cjs/tagInput/tagInput.css

@@ -12,6 +12,7 @@
 }
 .semi-tagInput-hover {
   background-color: var(--semi-color-fill-1);
+  border: 1px transparent solid;
 }
 .semi-tagInput-focus {
   background-color: var(--semi-color-fill-0);

package/lib/cjs/tagInput/tagInput.scss

@@ -4,7 +4,7 @@ $module: #{$prefix}-tagInput;
 
 .#{$module} {
     background-color: $color-tagInput_default-bg-default;
-    border: $border-thickness-control-focus $color-textarea-border-default solid;
+    border: $width-tagInput-border-default $color-tagInput-border-default solid;
     border-radius: $radius-tagInput;
     display: inline-flex;
     font-weight: $font-weight-regular;
@@ -13,11 +13,12 @@ $module: #{$prefix}-tagInput;
     
     &-hover {
         background-color: $color-tagInput_default-bg-hover;
+        border: $width-tagInput-border-hover $color-tagInput-border-hover solid;
     }
     
     &-focus {
         background-color: $color-tagInput_default-bg-focus;
-        border: $border-thickness-control-focus $color-tagInput_default-border-focus solid;
+        border: $width-tagInput-border-focus $color-tagInput-border-focus solid;
     }
 
     &-warning {

package/lib/cjs/tagInput/variables.scss

@@ -3,13 +3,16 @@ $color-tagInput-maxTagCount-default: var(--semi-color-text-0); // 标签输入
 $color-tagInput-icon-hover: var(--semi-color-primary-hover); // 标签输入框图标颜色 - 悬浮
 $color-tagInput_disabled-text-default: var(--semi-color-disabled-text); // 标签输入框禁用文字颜色
 $color-tagInput_default-bg-focus: var(--semi-color-fill-0); // 标签输入框背景颜色 - 选中态
-$color-tagInput_default-border-focus: var(--semi-color-focus-border); // 标签输入框描边颜色 - 选中态
+
+$color-tagInput-border-default: transparent; // 标签输入框描边颜色 - 默认
+$color-tagInput-border-hover: transparent ; // 标签输入框描边颜色 - 悬浮
+$color-tagInput-border-focus: var(--semi-color-focus-border); // 标签输入框描边颜色 - 选中态
 $color-tagInput_prefix-default: var(--semi-color-text-2); // 标签输入框 prefix 颜色
 $color-tagInput_suffix-default: var(--semi-color-text-1); // 标签输入框 suffix 颜色
 
 $color-tagInput_default-bg-default: var(--semi-color-fill-0); // 标签输入框背景颜色 - 默认
 $color-tagInput_default-bg-hover: var(--semi-color-fill-1); // 标签输入框背景颜色 - 悬浮
-$color-textarea-border-default: transparent; // 标签输入框描边颜色 - 默认
+// $color-textarea-border-default: transparent; // 标签输入框描边颜色 - 默认，已废弃 deprecated-v2.4
 
 $color-tagInput_warning-bg-default: var(--semi-color-warning-light-default); // 警告标签输入框背景颜色 - 默认
 $color-tagInput_warning-border-default: var(--semi-color-warning-light-default); // 警告标签输入框描边颜色 - 默认
@@ -35,5 +38,8 @@ $height-tagInput-default: $height-control-default; // 默认尺寸标签输入
 $height-tagInput-small: $height-control-small; // 小尺寸标签输入框高度
 
 $width-tagInput-clear-medium: $width-icon-medium * 2; // 标签输入框清空按钮宽度
+$width-tagInput-border-default: $border-thickness-control; // 标签输入框描边描边宽度 - 默认
+$width-tagInput-border-hover: $width-tagInput-border-default; // 标签输入框描边描边宽度 - 悬浮
+$width-tagInput-border-focus: $border-thickness-control-focus; // 标签输入框描边宽度 - 选中态
 
 $radius-tagInput: var(--semi-border-radius-small); // 标签输入框圆角

package/lib/cjs/tooltip/constants.d.ts

@@ -2,7 +2,7 @@ declare const cssClasses: {
     readonly PREFIX: "semi-tooltip";
 };
 declare const strings: {
-    readonly POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver"];
+    readonly POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver", "leftBottomOver", "rightBottomOver"];
     readonly TRIGGER_SET: readonly ["hover", "focus", "click", "custom"];
     readonly STATUS_DISABLED: "disabled";
     readonly STATUS_LOADING: "loading";

package/lib/cjs/tooltip/constants.js

@@ -15,7 +15,7 @@ const cssClasses = {
 };
 exports.cssClasses = cssClasses;
 const 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'

package/lib/cjs/tooltip/foundation.js

@@ -548,6 +548,19 @@ class Tooltip extends _foundation.default {
         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;
     }
@@ -669,12 +682,16 @@ class Tooltip extends _foundation.default {
 
       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':
@@ -736,14 +753,14 @@ class Tooltip extends _foundation.default {
           break;
 
         case 'bottom':
-          if (sholdReverseBottom) {
+          if (shouldReverseBottom) {
             position = this._reversePos(position, true);
           }
 
           break;
 
         case 'bottomLeft':
-          if (sholdReverseBottom) {
+          if (shouldReverseBottom) {
             position = this._reversePos(position, true);
           }
 
@@ -754,7 +771,7 @@ class Tooltip extends _foundation.default {
           break;
 
         case 'bottomRight':
-          if (sholdReverseBottom) {
+          if (shouldReverseBottom) {
             position = this._reversePos(position, true);
           }
 
@@ -793,6 +810,50 @@ class Tooltip extends _foundation.default {
 
           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;
       }

package/lib/cjs/tree/foundation.d.ts

@@ -128,6 +128,7 @@ export interface Virtualize {
     height?: number | string;
     width?: number | string;
 }
+export declare type CheckRelation = 'related' | 'unRelated';
 export interface BasicTreeProps {
     autoExpandParent?: boolean;
     autoExpandWhenDragEnter?: boolean;
@@ -183,6 +184,7 @@ export interface BasicTreeProps {
     value?: BasicValue;
     virtualize?: Virtualize;
     icon?: any;
+    checkRelation?: CheckRelation;
     'aria-label'?: string;
 }
 export interface BasicTreeInnerData {
@@ -193,6 +195,7 @@ export interface BasicTreeInnerData {
     selectedKeys: string[];
     checkedKeys: Set<string>;
     halfCheckedKeys: Set<string>;
+    realCheckedKeys: Set<string>;
     motionKeys: Set<string>;
     motionType: string;
     expandedKeys: Set<string>;
@@ -242,7 +245,7 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
     getCopyFromState(items: string[] | string): Partial<BasicTreeInnerData>;
     getTreeNodeProps(key: string): BasicTreeNodeProps;
     notifyJsonChange(key: string[] | string, e: any): void;
-    notifyMultipleChange(key: string[] | string, e: any): void;
+    notifyMultipleChange(key: string[], e: any): void;
     notifyChange(key: string[] | string, e: any): void;
     handleInputChange(sugInput: string): void;
     handleNodeSelect(e: any, treeNode: BasicTreeNodeProps): void;