@douyinfe/semi-foundation 2.74.1-alpha.2 → 2.74.1-alpha.3

package/audioPlayer/foundation.ts

@@ -8,7 +8,7 @@ export interface AudioPlayerAdapter<P = Record<string, any>, S = Record<string,
     handleStatusClick: () => void;
     handleTimeUpdate: () => void;
     handleTrackChange: (direction: 'next' | 'prev') => void;
-    getAudioRef: () => HTMLAudioElement;
+    getAudioRef: () => React.RefObject<HTMLAudioElement>;
     handleTimeChange: (value: number) => void;
     handleSpeedChange: (value: { label: string; value: number }) => void;
     handleSeek: (direction: number) => void;
@@ -23,14 +23,14 @@ class AudioPlayerFoundation extends BaseFoundation<AudioPlayerAdapter> {
     }
 
     initAudioState() {
-        const audioElement = this.getAudioRef();
+        const audioRef = this.getAudioRef();
         const props = this.getProps();
-
+        
         this.setState({
-            totalTime: audioElement?.duration || 0,
+            totalTime: audioRef.current?.duration || 0,
             isPlaying: props.autoPlay,
-            volume: audioElement?.volume * 100 || 100,
-            currentRate: { label: '1.0x', value: audioElement?.playbackRate || 1 },
+            volume: audioRef.current?.volume * 100 || 100,
+            currentRate: { label: '1.0x', value: audioRef.current?.playbackRate || 1 },
         });
     }
 

package/getBabelConfig.js

@@ -19,7 +19,6 @@ module.exports = ({ isESM }) => {
         ],
         plugins: [
             'lodash',
-            ...(isESM ? [] : ['./scripts/babel-plugin-lottie.js'])
         ]
     };
 };

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import BaseFoundation, { DefaultAdapter } from '../base/foundation';
 export interface AudioPlayerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     init: () => void;
@@ -5,7 +6,7 @@ export interface AudioPlayerAdapter<P = Record<string, any>, S = Record<string,
     handleStatusClick: () => void;
     handleTimeUpdate: () => void;
     handleTrackChange: (direction: 'next' | 'prev') => void;
-    getAudioRef: () => HTMLAudioElement;
+    getAudioRef: () => React.RefObject<HTMLAudioElement>;
     handleTimeChange: (value: number) => void;
     handleSpeedChange: (value: {
         label: string;
@@ -27,7 +28,7 @@ declare class AudioPlayerFoundation extends BaseFoundation<AudioPlayerAdapter> {
     handleStatusClick(): void;
     handleTimeUpdate(): void;
     handleTrackChange(direction: 'next' | 'prev'): void;
-    getAudioRef(): HTMLAudioElement;
+    getAudioRef(): import("react").RefObject<HTMLAudioElement>;
     handleTimeChange(value: number): void;
     handleSpeedChange(value: {
         label: string;

package/lib/cjs/audioPlayer/foundation.js

@@ -11,15 +11,16 @@ class AudioPlayerFoundation extends _foundation.default {
     super(Object.assign(Object.assign({}, AudioPlayerFoundation), adapter));
   }
   initAudioState() {
-    const audioElement = this.getAudioRef();
+    var _a, _b, _c;
+    const audioRef = this.getAudioRef();
     const props = this.getProps();
     this.setState({
-      totalTime: (audioElement === null || audioElement === void 0 ? void 0 : audioElement.duration) || 0,
+      totalTime: ((_a = audioRef.current) === null || _a === void 0 ? void 0 : _a.duration) || 0,
       isPlaying: props.autoPlay,
-      volume: (audioElement === null || audioElement === void 0 ? void 0 : audioElement.volume) * 100 || 100,
+      volume: ((_b = audioRef.current) === null || _b === void 0 ? void 0 : _b.volume) * 100 || 100,
       currentRate: {
         label: '1.0x',
-        value: (audioElement === null || audioElement === void 0 ? void 0 : audioElement.playbackRate) || 1
+        value: ((_c = audioRef.current) === null || _c === void 0 ? void 0 : _c.playbackRate) || 1
       }
     });
   }

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

@@ -244,16 +244,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
      */
     calcCheckedKeys(key: string, curCheckedStatus: boolean): {
         checkedKeys: Set<string>;
-        halfCheckedKeys: Set<string>; /**
-         * If selectedKeys does not meet the update conditions,
-         * and state.selectedKeys is the same as selectedKeys
-         * at this time, state.selectedKeys should be cleared.
-         * A typical scenario is:
-         * The originally selected node is the leaf node, but
-         * after props.treeData is dynamically updated, the node
-         * is a non-leaf node. At this point, selectedKeys should
-         * be cleared.
-         */
+        halfCheckedKeys: Set<string>;
     };
     handleInputChange(sugInput: string): void;
     handleClear(): void;

package/lib/cjs/lottie/foundation.js

@@ -5,12 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _foundation = _interopRequireDefault(require("../base/foundation"));
+var _lottieWeb = _interopRequireDefault(require("lottie-web"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _lottieWeb = undefined;
-if (typeof document !== "undefined") {
-  _lottieWeb = require("lottie-web");
-  if (_lottieWeb && _lottieWeb.__esModule) _lottieWeb = _lottieWeb.default;
-}
 class LottieFoundation extends _foundation.default {
   constructor(adapter) {
     super(Object.assign(Object.assign({}, LottieFoundation.defaultAdapter), adapter));
@@ -18,14 +14,14 @@ class LottieFoundation extends _foundation.default {
     this.handleParamsUpdate = () => {
       var _a;
       this.animation.destroy();
-      this.animation = lottie.loadAnimation(this._adapter.getLoadParams());
+      this.animation = _lottieWeb.default.loadAnimation(this._adapter.getLoadParams());
       (_a = this.getProp("getAnimationInstance")) === null || _a === void 0 ? void 0 : _a(this.animation);
     };
   }
   init(lifecycle) {
     var _a, _b;
     super.init(lifecycle);
-    this.animation = lottie.loadAnimation(this._adapter.getLoadParams());
+    this.animation = _lottieWeb.default.loadAnimation(this._adapter.getLoadParams());
     (_a = this.getProp("getAnimationInstance")) === null || _a === void 0 ? void 0 : _a(this.animation);
     (_b = this.getProp("getLottie")) === null || _b === void 0 ? void 0 : _b(LottieFoundation.getLottie());
   }
@@ -35,6 +31,6 @@ class LottieFoundation extends _foundation.default {
   }
 }
 LottieFoundation.getLottie = () => {
-  return lottie;
+  return _lottieWeb.default;
 };
 var _default = exports.default = LottieFoundation;

package/lib/cjs/resizable/group/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="lodash" />
 import BaseFoundation, { DefaultAdapter } from '../../base/foundation';
-import { ResizeStartCallback, ResizeCallback } from "../types";
+import { ResizeStartCallback, ResizeCallback, ResizeEventType } from "../types";
 export interface ResizeHandlerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     registerEvents: () => void;
     unregisterEvents: () => void;
@@ -29,8 +29,8 @@ export interface ResizeGroupAdapter<P = Record<string, any>, S = Record<string,
     getItemChange: (index: number) => ResizeCallback;
     getItemEnd: (index: number) => ResizeCallback;
     getItemDefaultSize: (index: number) => string | number;
-    registerEvents: () => void;
-    unregisterEvents: () => void;
+    registerEvents: (type: ResizeEventType) => void;
+    unregisterEvents: (type: ResizeEventType) => void;
 }
 export declare class ResizeGroupFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<ResizeGroupAdapter<P, S>, P, S> {
     constructor(adapter: ResizeGroupAdapter<P, S>);
@@ -40,13 +40,16 @@ export declare class ResizeGroupFoundation<P = Record<string, any>, S = Record<s
     itemMinusMap: Map<number, number>;
     totalMinus: number;
     itemPercentMap: Map<number, number>;
+    type?: ResizeEventType;
     init(): void;
     get window(): Window | null;
     registerEvents: () => void;
     unregisterEvents: () => void;
-    onResizeStart: (handlerIndex: number, e: MouseEvent) => void;
-    onResizing: (e: MouseEvent) => void;
-    onResizeEnd: (e: MouseEvent) => void;
+    onResizeStart: (handlerIndex: number, e: MouseEvent | Touch, type: ResizeEventType) => void;
+    onMouseMove: (e: MouseEvent) => void;
+    onTouchMove: (e: TouchEvent) => void;
+    onResizing: (e: MouseEvent | TouchEvent) => void;
+    onResizeEnd: (e: MouseEvent | TouchEvent) => void;
     initSpace: () => void;
     ensureConstraint: import("lodash").DebouncedFunc<() => void>;
     destroy(): void;

package/lib/cjs/resizable/group/index.js

@@ -32,12 +32,13 @@ class ResizeGroupFoundation extends _foundation.default {
   constructor(adapter) {
     super(Object.assign({}, adapter));
     this.registerEvents = () => {
-      this._adapter.registerEvents();
+      this._adapter.registerEvents(this.type);
     };
     this.unregisterEvents = () => {
-      this._adapter.unregisterEvents();
+      this._adapter.unregisterEvents(this.type);
     };
-    this.onResizeStart = (handlerIndex, e) => {
+    this.onResizeStart = (handlerIndex, e, type) => {
+      this.type = type;
       let {
         clientX,
         clientY
@@ -79,6 +80,14 @@ class ResizeGroupFoundation extends _foundation.default {
         nextStart(e, nextDir);
       }
     };
+    this.onMouseMove = e => {
+      this.onResizing(e);
+    };
+    this.onTouchMove = e => {
+      // prevent page move in mobile
+      e.preventDefault();
+      this.onResizing(e);
+    };
     this.onResizing = e => {
       const state = this.getStates();
       if (!state.isResizing) {
@@ -99,7 +108,7 @@ class ResizeGroupFoundation extends _foundation.default {
       let {
         clientX,
         clientY
-      } = e;
+      } = this.type === 'mouse' ? e : e.targetTouches[0];
       const props = this.getProps();
       const {
         direction

package/lib/cjs/resizable/single/index.d.ts

@@ -1,5 +1,5 @@
 import BaseFoundation, { DefaultAdapter } from '../../base/foundation';
-import { Size, NumberSize, Direction } from "../types";
+import { Size, NumberSize, Direction, ResizeEventType } from "../types";
 export interface ResizableHandlerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     registerEvent: () => void;
     unregisterEvent: () => void;
@@ -8,17 +8,19 @@ export declare class ResizableHandlerFoundation<P = Record<string, any>, S = Rec
     constructor(adapter: ResizableHandlerAdapter<P, S>);
     init(): void;
     onMouseDown: (e: MouseEvent) => void;
+    onTouchStart: (e: TouchEvent) => void;
     destroy(): void;
 }
 export interface ResizableAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     getResizable: () => HTMLDivElement | null;
-    registerEvent: () => void;
-    unregisterEvent: () => void;
+    registerEvent: (type: ResizeEventType) => void;
+    unregisterEvent: (type: ResizeEventType) => void;
 }
 export declare class ResizableFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<ResizableAdapter<P, S>, P, S> {
     constructor(adapter: ResizableAdapter<P, S>);
     init(): void;
     flexDirection?: 'row' | 'column';
+    type?: ResizeEventType;
     lockAspectRatio: number;
     resizable: HTMLElement | null;
     parentLeft: number;
@@ -63,8 +65,10 @@ export declare class ResizableFoundation<P = Record<string, any>, S = Record<str
         newHeight: number;
     };
     setBoundary(): void;
-    onResizeStart: (e: MouseEvent, direction: Direction) => void;
+    onResizeStart: (e: MouseEvent, direction: Direction, type: ResizeEventType) => void;
     onMouseMove: (event: MouseEvent) => void;
-    onMouseUp: (event: MouseEvent) => void;
+    onTouchMove: (event: TouchEvent) => void;
+    changePosition: (event: Touch | MouseEvent) => void;
+    onMouseUp: (event: MouseEvent | TouchEvent) => void;
     destroy(): void;
 }

package/lib/cjs/resizable/single/index.js

@@ -12,7 +12,11 @@ class ResizableHandlerFoundation extends _foundation.default {
   constructor(adapter) {
     super(Object.assign({}, adapter));
     this.onMouseDown = e => {
-      this.getProp('onResizeStart')(e, this.getProp('direction'));
+      this.getProp('onResizeStart')(e, this.getProp('direction'), 'mouse');
+    };
+    this.onTouchStart = e => {
+      const touch = e.targetTouches[0];
+      this.getProp('onResizeStart')(touch, this.getProp('direction'), 'touch');
     };
   }
   init() {
@@ -36,7 +40,8 @@ class ResizableFoundation extends _foundation.default {
     this.boundaryBottom = 0;
     this.targetLeft = 0;
     this.targetTop = 0;
-    this.onResizeStart = (e, direction) => {
+    this.onResizeStart = (e, direction, type) => {
+      this.type = type;
       this.resizable = this._adapter.getResizable();
       if (!this.resizable || !this.window) {
         return;
@@ -112,6 +117,14 @@ class ResizableFoundation extends _foundation.default {
       this.setState(state);
     };
     this.onMouseMove = event => {
+      this.changePosition(event);
+    };
+    this.onTouchMove = event => {
+      event.preventDefault();
+      const touch = event.targetTouches[0];
+      this.changePosition(touch);
+    };
+    this.changePosition = event => {
       var _a, _b;
       const states = this.getStates();
       const props = this.getProps();
@@ -410,10 +423,10 @@ class ResizableFoundation extends _foundation.default {
     return size;
   }
   registerEvents() {
-    this._adapter.registerEvent();
+    this._adapter.registerEvent(this.type);
   }
   unregisterEvents() {
-    this._adapter.unregisterEvent();
+    this._adapter.unregisterEvent(this.type);
   }
   getCssPropertySize(newSize, property) {
     var _a;

package/lib/cjs/resizable/types.d.ts

@@ -10,7 +10,8 @@ export interface HandleClassName {
     bottomLeft?: string;
     topLeft?: string;
 }
-export type HandlerCallback = (e: MouseEvent, direction: Direction) => void;
+export type ResizeEventType = 'mouse' | 'touch';
+export type HandlerCallback = (e: MouseEvent, direction: Direction, type?: ResizeEventType) => void;
 export interface Enable {
     top?: boolean;
     right?: boolean;
@@ -37,5 +38,5 @@ export declare const DEFAULT_SIZE: {
     width: string;
     height: string;
 };
-export type ResizeCallback = (size: Size, event: MouseEvent, direction: Direction) => void;
-export type ResizeStartCallback = (e: MouseEvent, dir: Direction) => void | boolean;
+export type ResizeCallback = (size: Size, event: MouseEvent | TouchEvent, direction: Direction) => void;
+export type ResizeStartCallback = (e: MouseEvent | Touch, dir: Direction) => void | boolean;

package/lib/cjs/select/foundation.js

@@ -1131,12 +1131,11 @@ class SelectFoundation extends _foundation.default {
       autoFocus
     } = this.getProps();
     const {
-      showInput,
-      isOpen
+      showInput
     } = this.getStates();
     const isMultiple = this._isMultiple();
     if (filter && !isMultiple) {
-      if ((showInput || autoFocus) && !isOpen) {
+      if (showInput || autoFocus) {
         this.toggle2SearchInput(false);
       }
     }

package/lib/cjs/steps/bacisSteps.scss

@@ -233,7 +233,7 @@ $basicType: #{$module}-basic;
             color: $color-steps_main-text-default;
             vertical-align: top;
             padding-right: $spacing-steps_basic_item_title-paddingRight;
-            margin-bottom: $spacing-steps_basic_item_title-paddingBottom;
+            padding-bottom: $spacing-steps_basic_item_title-paddingBottom;
             transition: color $transition_duration-steps_item_title-text $transition_function-steps_item_title-text $transition_delay-steps_item_title-text; //step文字color的transition变化
        
         }

package/lib/cjs/steps/steps.css

@@ -316,7 +316,7 @@
   color: var(--semi-color-text-0);
   vertical-align: top;
   padding-right: 16px;
-  margin-bottom: 4px;
+  padding-bottom: 4px;
   transition: color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
 }
 .semi-steps-basic .semi-steps-item-finish .semi-steps-item-left .semi-steps-item-icon {

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

@@ -83,6 +83,6 @@ export declare function getValueOrKey(data: any, keyMaps?: KeyMapProps): any;
 export declare function normalizeValue(value: any, withObject: boolean, keyMaps?: KeyMapProps): any;
 export declare function updateKeys(keySet: Set<string> | string[], keyEntities: KeyEntities): string[];
 export declare function calcDisabledKeys(keyEntities: KeyEntities, keyMaps?: KeyMapProps): Set<string>;
-export declare function calcDropRelativePosition(event: any, treeNode: any): 0 | 1 | -1;
+export declare function calcDropRelativePosition(event: any, treeNode: any): 1 | -1 | 0;
 export declare function getDragNodesKeys(key: string, keyEntities: KeyEntities): string[];
 export declare function calcDropActualPosition(pos: string, relativeDropPos: any): any;

package/lib/cjs/tree/treeUtil.js

@@ -68,9 +68,6 @@ function flattenTreeData(treeNodeList, expandedKeys, keyMaps) {
   const filterSearch = Boolean(filteredShownKeys);
   const realKeyName = (0, _get2.default)(keyMaps, 'key', 'key');
   const realChildrenName = (0, _get2.default)(keyMaps, 'children', 'children');
-  if ((0, _isUndefined2.default)(treeNodeList)) {
-    return [];
-  }
   function flatten(list) {
     let parent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
     return list.map((treeNode, index) => {

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

@@ -18,7 +18,7 @@ declare const strings: {
     DRAG_AREA_ILLEGAL: string;
     TRIGGER_AUTO: "auto";
     TRIGGER_CUSTOM: "custom";
-    UPLOAD_TRIGGER: ("custom" | "auto")[];
+    UPLOAD_TRIGGER: ("auto" | "custom")[];
     VALIDATE_STATUS: readonly ["default", "error", "warning", "success"];
     PROMPT_POSITION: readonly ["left", "right", "bottom"];
 };

package/lib/es/audioPlayer/foundation.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import BaseFoundation, { DefaultAdapter } from '../base/foundation';
 export interface AudioPlayerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     init: () => void;
@@ -5,7 +6,7 @@ export interface AudioPlayerAdapter<P = Record<string, any>, S = Record<string,
     handleStatusClick: () => void;
     handleTimeUpdate: () => void;
     handleTrackChange: (direction: 'next' | 'prev') => void;
-    getAudioRef: () => HTMLAudioElement;
+    getAudioRef: () => React.RefObject<HTMLAudioElement>;
     handleTimeChange: (value: number) => void;
     handleSpeedChange: (value: {
         label: string;
@@ -27,7 +28,7 @@ declare class AudioPlayerFoundation extends BaseFoundation<AudioPlayerAdapter> {
     handleStatusClick(): void;
     handleTimeUpdate(): void;
     handleTrackChange(direction: 'next' | 'prev'): void;
-    getAudioRef(): HTMLAudioElement;
+    getAudioRef(): import("react").RefObject<HTMLAudioElement>;
     handleTimeChange(value: number): void;
     handleSpeedChange(value: {
         label: string;

package/lib/es/audioPlayer/foundation.js

@@ -4,15 +4,16 @@ class AudioPlayerFoundation extends BaseFoundation {
     super(Object.assign(Object.assign({}, AudioPlayerFoundation), adapter));
   }
   initAudioState() {
-    const audioElement = this.getAudioRef();
+    var _a, _b, _c;
+    const audioRef = this.getAudioRef();
     const props = this.getProps();
     this.setState({
-      totalTime: (audioElement === null || audioElement === void 0 ? void 0 : audioElement.duration) || 0,
+      totalTime: ((_a = audioRef.current) === null || _a === void 0 ? void 0 : _a.duration) || 0,
       isPlaying: props.autoPlay,
-      volume: (audioElement === null || audioElement === void 0 ? void 0 : audioElement.volume) * 100 || 100,
+      volume: ((_b = audioRef.current) === null || _b === void 0 ? void 0 : _b.volume) * 100 || 100,
       currentRate: {
         label: '1.0x',
-        value: (audioElement === null || audioElement === void 0 ? void 0 : audioElement.playbackRate) || 1
+        value: ((_c = audioRef.current) === null || _c === void 0 ? void 0 : _c.playbackRate) || 1
       }
     });
   }

package/lib/es/cascader/foundation.d.ts

@@ -244,16 +244,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
      */
     calcCheckedKeys(key: string, curCheckedStatus: boolean): {
         checkedKeys: Set<string>;
-        halfCheckedKeys: Set<string>; /**
-         * If selectedKeys does not meet the update conditions,
-         * and state.selectedKeys is the same as selectedKeys
-         * at this time, state.selectedKeys should be cleared.
-         * A typical scenario is:
-         * The originally selected node is the leaf node, but
-         * after props.treeData is dynamically updated, the node
-         * is a non-leaf node. At this point, selectedKeys should
-         * be cleared.
-         */
+        halfCheckedKeys: Set<string>;
     };
     handleInputChange(sugInput: string): void;
     handleClear(): void;

package/lib/es/resizable/group/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="lodash" />
 import BaseFoundation, { DefaultAdapter } from '../../base/foundation';
-import { ResizeStartCallback, ResizeCallback } from "../types";
+import { ResizeStartCallback, ResizeCallback, ResizeEventType } from "../types";
 export interface ResizeHandlerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     registerEvents: () => void;
     unregisterEvents: () => void;
@@ -29,8 +29,8 @@ export interface ResizeGroupAdapter<P = Record<string, any>, S = Record<string,
     getItemChange: (index: number) => ResizeCallback;
     getItemEnd: (index: number) => ResizeCallback;
     getItemDefaultSize: (index: number) => string | number;
-    registerEvents: () => void;
-    unregisterEvents: () => void;
+    registerEvents: (type: ResizeEventType) => void;
+    unregisterEvents: (type: ResizeEventType) => void;
 }
 export declare class ResizeGroupFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<ResizeGroupAdapter<P, S>, P, S> {
     constructor(adapter: ResizeGroupAdapter<P, S>);
@@ -40,13 +40,16 @@ export declare class ResizeGroupFoundation<P = Record<string, any>, S = Record<s
     itemMinusMap: Map<number, number>;
     totalMinus: number;
     itemPercentMap: Map<number, number>;
+    type?: ResizeEventType;
     init(): void;
     get window(): Window | null;
     registerEvents: () => void;
     unregisterEvents: () => void;
-    onResizeStart: (handlerIndex: number, e: MouseEvent) => void;
-    onResizing: (e: MouseEvent) => void;
-    onResizeEnd: (e: MouseEvent) => void;
+    onResizeStart: (handlerIndex: number, e: MouseEvent | Touch, type: ResizeEventType) => void;
+    onMouseMove: (e: MouseEvent) => void;
+    onTouchMove: (e: TouchEvent) => void;
+    onResizing: (e: MouseEvent | TouchEvent) => void;
+    onResizeEnd: (e: MouseEvent | TouchEvent) => void;
     initSpace: () => void;
     ensureConstraint: import("lodash").DebouncedFunc<() => void>;
     destroy(): void;

package/lib/es/resizable/group/index.js

@@ -24,12 +24,13 @@ export class ResizeGroupFoundation extends BaseFoundation {
   constructor(adapter) {
     super(Object.assign({}, adapter));
     this.registerEvents = () => {
-      this._adapter.registerEvents();
+      this._adapter.registerEvents(this.type);
     };
     this.unregisterEvents = () => {
-      this._adapter.unregisterEvents();
+      this._adapter.unregisterEvents(this.type);
     };
-    this.onResizeStart = (handlerIndex, e) => {
+    this.onResizeStart = (handlerIndex, e, type) => {
+      this.type = type;
       let {
         clientX,
         clientY
@@ -71,6 +72,14 @@ export class ResizeGroupFoundation extends BaseFoundation {
         nextStart(e, nextDir);
       }
     };
+    this.onMouseMove = e => {
+      this.onResizing(e);
+    };
+    this.onTouchMove = e => {
+      // prevent page move in mobile
+      e.preventDefault();
+      this.onResizing(e);
+    };
     this.onResizing = e => {
       const state = this.getStates();
       if (!state.isResizing) {
@@ -91,7 +100,7 @@ export class ResizeGroupFoundation extends BaseFoundation {
       let {
         clientX,
         clientY
-      } = e;
+      } = this.type === 'mouse' ? e : e.targetTouches[0];
       const props = this.getProps();
       const {
         direction

package/lib/es/resizable/single/index.d.ts

@@ -1,5 +1,5 @@
 import BaseFoundation, { DefaultAdapter } from '../../base/foundation';
-import { Size, NumberSize, Direction } from "../types";
+import { Size, NumberSize, Direction, ResizeEventType } from "../types";
 export interface ResizableHandlerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     registerEvent: () => void;
     unregisterEvent: () => void;
@@ -8,17 +8,19 @@ export declare class ResizableHandlerFoundation<P = Record<string, any>, S = Rec
     constructor(adapter: ResizableHandlerAdapter<P, S>);
     init(): void;
     onMouseDown: (e: MouseEvent) => void;
+    onTouchStart: (e: TouchEvent) => void;
     destroy(): void;
 }
 export interface ResizableAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     getResizable: () => HTMLDivElement | null;
-    registerEvent: () => void;
-    unregisterEvent: () => void;
+    registerEvent: (type: ResizeEventType) => void;
+    unregisterEvent: (type: ResizeEventType) => void;
 }
 export declare class ResizableFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<ResizableAdapter<P, S>, P, S> {
     constructor(adapter: ResizableAdapter<P, S>);
     init(): void;
     flexDirection?: 'row' | 'column';
+    type?: ResizeEventType;
     lockAspectRatio: number;
     resizable: HTMLElement | null;
     parentLeft: number;
@@ -63,8 +65,10 @@ export declare class ResizableFoundation<P = Record<string, any>, S = Record<str
         newHeight: number;
     };
     setBoundary(): void;
-    onResizeStart: (e: MouseEvent, direction: Direction) => void;
+    onResizeStart: (e: MouseEvent, direction: Direction, type: ResizeEventType) => void;
     onMouseMove: (event: MouseEvent) => void;
-    onMouseUp: (event: MouseEvent) => void;
+    onTouchMove: (event: TouchEvent) => void;
+    changePosition: (event: Touch | MouseEvent) => void;
+    onMouseUp: (event: MouseEvent | TouchEvent) => void;
     destroy(): void;
 }

package/lib/es/resizable/single/index.js

@@ -5,7 +5,11 @@ export class ResizableHandlerFoundation extends BaseFoundation {
   constructor(adapter) {
     super(Object.assign({}, adapter));
     this.onMouseDown = e => {
-      this.getProp('onResizeStart')(e, this.getProp('direction'));
+      this.getProp('onResizeStart')(e, this.getProp('direction'), 'mouse');
+    };
+    this.onTouchStart = e => {
+      const touch = e.targetTouches[0];
+      this.getProp('onResizeStart')(touch, this.getProp('direction'), 'touch');
     };
   }
   init() {
@@ -28,7 +32,8 @@ export class ResizableFoundation extends BaseFoundation {
     this.boundaryBottom = 0;
     this.targetLeft = 0;
     this.targetTop = 0;
-    this.onResizeStart = (e, direction) => {
+    this.onResizeStart = (e, direction, type) => {
+      this.type = type;
       this.resizable = this._adapter.getResizable();
       if (!this.resizable || !this.window) {
         return;
@@ -104,6 +109,14 @@ export class ResizableFoundation extends BaseFoundation {
       this.setState(state);
     };
     this.onMouseMove = event => {
+      this.changePosition(event);
+    };
+    this.onTouchMove = event => {
+      event.preventDefault();
+      const touch = event.targetTouches[0];
+      this.changePosition(touch);
+    };
+    this.changePosition = event => {
       var _a, _b;
       const states = this.getStates();
       const props = this.getProps();
@@ -402,10 +415,10 @@ export class ResizableFoundation extends BaseFoundation {
     return size;
   }
   registerEvents() {
-    this._adapter.registerEvent();
+    this._adapter.registerEvent(this.type);
   }
   unregisterEvents() {
-    this._adapter.unregisterEvent();
+    this._adapter.unregisterEvent(this.type);
   }
   getCssPropertySize(newSize, property) {
     var _a;

package/lib/es/resizable/types.d.ts

@@ -10,7 +10,8 @@ export interface HandleClassName {
     bottomLeft?: string;
     topLeft?: string;
 }
-export type HandlerCallback = (e: MouseEvent, direction: Direction) => void;
+export type ResizeEventType = 'mouse' | 'touch';
+export type HandlerCallback = (e: MouseEvent, direction: Direction, type?: ResizeEventType) => void;
 export interface Enable {
     top?: boolean;
     right?: boolean;
@@ -37,5 +38,5 @@ export declare const DEFAULT_SIZE: {
     width: string;
     height: string;
 };
-export type ResizeCallback = (size: Size, event: MouseEvent, direction: Direction) => void;
-export type ResizeStartCallback = (e: MouseEvent, dir: Direction) => void | boolean;
+export type ResizeCallback = (size: Size, event: MouseEvent | TouchEvent, direction: Direction) => void;
+export type ResizeStartCallback = (e: MouseEvent | Touch, dir: Direction) => void | boolean;

package/lib/es/select/foundation.js

@@ -1122,12 +1122,11 @@ export default class SelectFoundation extends BaseFoundation {
       autoFocus
     } = this.getProps();
     const {
-      showInput,
-      isOpen
+      showInput
     } = this.getStates();
     const isMultiple = this._isMultiple();
     if (filter && !isMultiple) {
-      if ((showInput || autoFocus) && !isOpen) {
+      if (showInput || autoFocus) {
         this.toggle2SearchInput(false);
       }
     }

package/lib/es/steps/bacisSteps.scss

@@ -233,7 +233,7 @@ $basicType: #{$module}-basic;
             color: $color-steps_main-text-default;
             vertical-align: top;
             padding-right: $spacing-steps_basic_item_title-paddingRight;
-            margin-bottom: $spacing-steps_basic_item_title-paddingBottom;
+            padding-bottom: $spacing-steps_basic_item_title-paddingBottom;
             transition: color $transition_duration-steps_item_title-text $transition_function-steps_item_title-text $transition_delay-steps_item_title-text; //step文字color的transition变化
        
         }

package/lib/es/steps/steps.css

@@ -316,7 +316,7 @@
   color: var(--semi-color-text-0);
   vertical-align: top;
   padding-right: 16px;
-  margin-bottom: 4px;
+  padding-bottom: 4px;
   transition: color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
 }
 .semi-steps-basic .semi-steps-item-finish .semi-steps-item-left .semi-steps-item-icon {

package/lib/es/tree/treeUtil.d.ts

@@ -83,6 +83,6 @@ export declare function getValueOrKey(data: any, keyMaps?: KeyMapProps): any;
 export declare function normalizeValue(value: any, withObject: boolean, keyMaps?: KeyMapProps): any;
 export declare function updateKeys(keySet: Set<string> | string[], keyEntities: KeyEntities): string[];
 export declare function calcDisabledKeys(keyEntities: KeyEntities, keyMaps?: KeyMapProps): Set<string>;
-export declare function calcDropRelativePosition(event: any, treeNode: any): 0 | 1 | -1;
+export declare function calcDropRelativePosition(event: any, treeNode: any): 1 | -1 | 0;
 export declare function getDragNodesKeys(key: string, keyEntities: KeyEntities): string[];
 export declare function calcDropActualPosition(pos: string, relativeDropPos: any): any;

package/lib/es/tree/treeUtil.js

@@ -33,9 +33,6 @@ export function flattenTreeData(treeNodeList, expandedKeys, keyMaps) {
   const filterSearch = Boolean(filteredShownKeys);
   const realKeyName = _get(keyMaps, 'key', 'key');
   const realChildrenName = _get(keyMaps, 'children', 'children');
-  if (_isUndefined(treeNodeList)) {
-    return [];
-  }
   function flatten(list) {
     let parent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
     return list.map((treeNode, index) => {

package/lib/es/upload/constants.d.ts

@@ -18,7 +18,7 @@ declare const strings: {
     DRAG_AREA_ILLEGAL: string;
     TRIGGER_AUTO: "auto";
     TRIGGER_CUSTOM: "custom";
-    UPLOAD_TRIGGER: ("custom" | "auto")[];
+    UPLOAD_TRIGGER: ("auto" | "custom")[];
     VALIDATE_STATUS: readonly ["default", "error", "warning", "success"];
     PROMPT_POSITION: readonly ["left", "right", "bottom"];
 };

package/package.json

@@ -1,14 +1,14 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.74.1-alpha.2",
+    "version": "2.74.1-alpha.3",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.74.0",
-        "@douyinfe/semi-json-viewer-core": "2.74.0",
+        "@douyinfe/semi-animation": "2.74.1-alpha.3",
+        "@douyinfe/semi-json-viewer-core": "2.74.1-alpha.3",
         "@mdx-js/mdx": "^3.0.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
@@ -29,7 +29,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "f20b6d5af38f745a6df72e0daffdbd238fcbe8cf",
+    "gitHead": "555d2e8969779e9a1eb15654845e7ed8e062d250",
     "devDependencies": {
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",

package/resizable/group/index.ts

@@ -1,6 +1,6 @@
 import { getItemDirection, getPixelSize } from "../utils";
 import BaseFoundation, { DefaultAdapter } from '../../base/foundation';
-import { ResizeStartCallback, ResizeCallback } from "../types";
+import { ResizeStartCallback, ResizeCallback, ResizeEventType } from "../types";
 import { adjustNewSize, judgeConstraint, getOffset } from "../utils";
 import { debounce } from "lodash";
 export interface ResizeHandlerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
@@ -49,8 +49,8 @@ export interface ResizeGroupAdapter<P = Record<string, any>, S = Record<string,
     getItemChange: (index: number) => ResizeCallback;
     getItemEnd: (index: number) => ResizeCallback;
     getItemDefaultSize: (index: number) => string | number;
-    registerEvents: () => void;
-    unregisterEvents: () => void
+    registerEvents: (type: ResizeEventType) => void;
+    unregisterEvents: (type: ResizeEventType) => void
 }
 
 export class ResizeGroupFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<ResizeGroupAdapter<P, S>, P, S> {
@@ -72,6 +72,7 @@ export class ResizeGroupFoundation<P = Record<string, any>, S = Record<string, a
     itemMinusMap: Map<number, number>; // 这个是为了给handler留出空间，方便维护每一个item的size为cal(percent% - minus)
     totalMinus: number;
     itemPercentMap: Map<number, number>; // 内部维护一个百分比数组，消除浮点计算误差
+    type?: ResizeEventType;
 
 
     init(): void {
@@ -86,14 +87,15 @@ export class ResizeGroupFoundation<P = Record<string, any>, S = Record<string, a
 
     
     registerEvents = () => {
-        this._adapter.registerEvents();
+        this._adapter.registerEvents(this.type);
     }
 
     unregisterEvents = () => {
-        this._adapter.unregisterEvents();
+        this._adapter.unregisterEvents(this.type);
     }
 
-    onResizeStart = (handlerIndex: number, e: MouseEvent) => { // handler ref
+    onResizeStart = (handlerIndex: number, e: MouseEvent | Touch, type: ResizeEventType) => { // handler ref
+        this.type = type;
         let { clientX, clientY } = e;
         let lastItem = this._adapter.getItem(handlerIndex), nextItem = this._adapter.getItem(handlerIndex + 1);
         let lastOffset: number, nextOffset: number;
@@ -135,15 +137,25 @@ export class ResizeGroupFoundation<P = Record<string, any>, S = Record<string, a
         }
     }
 
+    onMouseMove = (e: MouseEvent) => {
+        this.onResizing(e);
+    }
 
-    onResizing = (e: MouseEvent) => {
+    onTouchMove = (e: TouchEvent) => {
+        // prevent page move in mobile
+        e.preventDefault();
+        this.onResizing(e);
+    }
+
+
+    onResizing = (e: MouseEvent | TouchEvent) => {
         const state = this.getStates();
         if (!state.isResizing) {
             return;
         }
         const { curHandler, originalPosition } = state;
         let { x: initX, y: initY, lastItemSize, nextItemSize, lastOffset, nextOffset } = originalPosition;
-        let { clientX, clientY } = e;
+        let { clientX, clientY } = this.type === 'mouse' ? e : (e as any).targetTouches[0];
 
         const props = this.getProps();
         const { direction } = props;
@@ -193,7 +205,7 @@ export class ResizeGroupFoundation<P = Record<string, any>, S = Record<string, a
         }
     }
 
-    onResizeEnd = (e: MouseEvent) => {
+    onResizeEnd = (e: MouseEvent | TouchEvent) => {
         const { curHandler } = this.getStates();
         let lastItem = this._adapter.getItem(curHandler), nextItem = this._adapter.getItem(curHandler + 1);
         let lastFunc = this._adapter.getItemEnd(curHandler),

package/resizable/single/index.ts

@@ -1,5 +1,5 @@
 import BaseFoundation, { DefaultAdapter } from '../../base/foundation';
-import { DEFAULT_SIZE, Size, NumberSize, Direction, NewSize } from "../types";
+import { DEFAULT_SIZE, Size, NumberSize, Direction, NewSize, ResizeEventType } from "../types";
 import { getStringSize, getNumberSize, has, calculateNewMax, findNextSnap, snap, clamp } from "../utils";
 export interface ResizableHandlerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     registerEvent: () => void;
@@ -16,9 +16,14 @@ export class ResizableHandlerFoundation<P = Record<string, any>, S = Record<stri
     }
 
     onMouseDown = (e: MouseEvent) => {
-        this.getProp('onResizeStart')(e, this.getProp('direction'));
+        this.getProp('onResizeStart')(e, this.getProp('direction'), 'mouse');
     };
 
+    onTouchStart = (e: TouchEvent) => {
+        const touch = e.targetTouches[0];
+        this.getProp('onResizeStart')(touch, this.getProp('direction'), 'touch');
+    }
+
     destroy(): void {
         this._adapter.unregisterEvent();
     }
@@ -26,8 +31,8 @@ export class ResizableHandlerFoundation<P = Record<string, any>, S = Record<stri
 
 export interface ResizableAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     getResizable: () => HTMLDivElement | null;
-    registerEvent: () => void;
-    unregisterEvent: () => void
+    registerEvent: (type: ResizeEventType) => void;
+    unregisterEvent: (type: ResizeEventType) => void
 }
 
 export class ResizableFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<ResizableAdapter<P, S>, P, S> {
@@ -53,6 +58,7 @@ export class ResizableFoundation<P = Record<string, any>, S = Record<string, any
     }
 
     flexDirection?: 'row' | 'column';
+    type?: ResizeEventType;
 
     lockAspectRatio = 1;
     resizable: HTMLElement | null = null;
@@ -202,11 +208,11 @@ export class ResizableFoundation<P = Record<string, any>, S = Record<string, any
     }
 
     registerEvents() {
-        this._adapter.registerEvent();
+        this._adapter.registerEvent(this.type);
     }
 
     unregisterEvents() {
-        this._adapter.unregisterEvent();
+        this._adapter.unregisterEvent(this.type);
     }
 
     getCssPropertySize(newSize: number | string, property: 'width' | 'height'): number | string {
@@ -380,7 +386,8 @@ export class ResizableFoundation<P = Record<string, any>, S = Record<string, any
     }
 
 
-    onResizeStart = (e: MouseEvent, direction: Direction) => {
+    onResizeStart = (e: MouseEvent, direction: Direction, type: ResizeEventType) => {
+        this.type = type;
         this.resizable = this._adapter.getResizable();
         if (!this.resizable || !this.window) {
             return;
@@ -456,6 +463,16 @@ export class ResizableFoundation<P = Record<string, any>, S = Record<string, any
 
 
     onMouseMove = (event: MouseEvent) => {
+        this.changePosition(event);
+    }
+
+    onTouchMove = (event: TouchEvent) => {
+        event.preventDefault();
+        const touch = event.targetTouches[0];
+        this.changePosition(touch);
+    }
+
+    changePosition = (event: Touch | MouseEvent) => {
         const states = this.getStates();
         const props = this.getProps();
 
@@ -583,7 +600,7 @@ export class ResizableFoundation<P = Record<string, any>, S = Record<string, any
     }
 
 
-    onMouseUp = (event: MouseEvent) => {
+    onMouseUp = (event: MouseEvent | TouchEvent) => {
         const { isResizing, direction, original } = this.getStates();
 
         if (!isResizing || !this.resizable) {

package/resizable/types.ts

@@ -14,9 +14,12 @@ export interface HandleClassName {
     topLeft?: string
 }
 
+export type ResizeEventType = 'mouse' | 'touch'; 
+
 export type HandlerCallback = (
     e: MouseEvent,
-    direction: Direction
+    direction: Direction,
+    type?: ResizeEventType,
 ) => void;
 
 export interface Enable {
@@ -51,12 +54,12 @@ export const DEFAULT_SIZE = {
 
 export type ResizeCallback = (
     size: Size,
-    event: MouseEvent,
+    event: MouseEvent | TouchEvent,
     direction: Direction,
 ) => void;
 
 export type ResizeStartCallback = (
-    e: MouseEvent,
+    e: MouseEvent | Touch,
     dir: Direction,
 ) => void | boolean;
 

package/select/foundation.ts

@@ -1113,10 +1113,10 @@ export default class SelectFoundation extends BaseFoundation<SelectAdapter> {
 
     handleInputBlur(e: any) {
         const { filter, autoFocus } = this.getProps();
-        const { showInput, isOpen } = this.getStates();
+        const { showInput } = this.getStates();
         const isMultiple = this._isMultiple();
         if (filter && !isMultiple ) {
-            if ((showInput || autoFocus) && !isOpen) {
+            if (showInput || autoFocus) {
                 this.toggle2SearchInput(false);
             }
         }

package/steps/bacisSteps.scss

@@ -233,7 +233,7 @@ $basicType: #{$module}-basic;
             color: $color-steps_main-text-default;
             vertical-align: top;
             padding-right: $spacing-steps_basic_item_title-paddingRight;
-            margin-bottom: $spacing-steps_basic_item_title-paddingBottom;
+            padding-bottom: $spacing-steps_basic_item_title-paddingBottom;
             transition: color $transition_duration-steps_item_title-text $transition_function-steps_item_title-text $transition_delay-steps_item_title-text; //step文字color的transition变化
        
         }

package/tree/treeUtil.ts

@@ -53,9 +53,6 @@ export function flattenTreeData(treeNodeList: any[], expandedKeys: Set<string>,
     const filterSearch = Boolean(filteredShownKeys);
     const realKeyName = get(keyMaps, 'key', 'key');
     const realChildrenName = get(keyMaps, 'children', 'children');
-    if (isUndefined(treeNodeList)) {
-        return [];
-    }
     function flatten(list: any[], parent: any = null) {
         return list.map((treeNode, index) => {
             const pos = getPosition(parent ? parent.pos : '0', index);

package/scripts/babel-plugin-lottie.js

@@ -1,58 +0,0 @@
-module.exports = function (babel) {
-    const { types: t } = babel;
-    return {
-        visitor: {
-            ImportDeclaration(path) {
-                // 只处理 lottie-web 的导入
-                if (path.node.source.value === 'lottie-web') {
-                    // 创建变量声明
-                    const varDeclaration = t.variableDeclaration('var', [
-                        t.variableDeclarator(
-                            t.identifier('_lottieWeb'),
-                            t.identifier('undefined')
-                        )
-                    ]);
-
-                    // 创建条件语句
-                    const ifStatement = t.ifStatement(
-                        t.binaryExpression(
-                            '!==',
-                            t.unaryExpression('typeof', t.identifier('document')),
-                            t.stringLiteral('undefined')
-                        ),
-                        t.blockStatement([
-                            // _lottieWeb = require("lottie-web")
-                            t.expressionStatement(
-                                t.assignmentExpression(
-                                    '=',
-                                    t.identifier('_lottieWeb'),
-                                    t.callExpression(t.identifier('require'), [
-                                        t.stringLiteral('lottie-web')
-                                    ])
-                                )
-                            ),
-                            // if (_lottieWeb && _lottieWeb.__esModule) _lottieWeb = _lottieWeb.default
-                            t.ifStatement(
-                                t.logicalExpression(
-                                    '&&',
-                                    t.identifier('_lottieWeb'),
-                                    t.memberExpression(t.identifier('_lottieWeb'), t.identifier('__esModule'))
-                                ),
-                                t.expressionStatement(
-                                    t.assignmentExpression(
-                                        '=',
-                                        t.identifier('_lottieWeb'),
-                                        t.memberExpression(t.identifier('_lottieWeb'), t.identifier('default'))
-                                    )
-                                )
-                            )
-                        ])
-                    );
-
-                    path.insertBefore(varDeclaration);
-                    path.replaceWith(ifStatement);
-                }
-            }
-        }
-    };
-};