feat: ✨ allow to set scrollLeft

deprecated scrollTop

Author: xzdarcy

src/components/timeline.tsx

@@ -61,6 +61,11 @@ export const Timeline = React.forwardRef<TimelineState, TimelineEditor>((props,
     autoReRender && engineRef.current.reRender();
   }, [editorData]);
 
+  // deprecated
+  useEffect(() => {
+    scrollSync.current && scrollSync.current.setState({ scrollTop: scrollTop });
+  }, [scrollTop])
+
   /** 处理主动数据变化 */
   const handleEditorDataChange = (editorData: TimelineRow[]) => {
     const result = onChange(editorData);
@@ -124,12 +129,18 @@ export const Timeline = React.forwardRef<TimelineState, TimelineEditor>((props,
     reRender: engineRef.current.reRender.bind(engineRef.current),
     play: (param: Parameters<TimelineState['play']>[0]) => engineRef.current.play({ ...param }),
     pause: engineRef.current.pause.bind(engineRef.current),
+    setScrollLeft: (val) =>{
+      scrollSync.current && scrollSync.current.setState({ scrollLeft: val });
+    },
+    setScrollTop: (val) =>{
+      scrollSync.current && scrollSync.current.setState({ scrollTop: val });
+    }
   }));
 
   return (
     <div ref={domRef} style={style} className={`${PREFIX} ${disableDrag ? PREFIX + '-disable' : ''}`}>
       <ScrollSync ref={scrollSync}>
-        {({ scrollLeft, onScroll }) => (
+        {({ scrollLeft, scrollTop, onScroll }) => (
           <>
             <TimeArea
               {...checkedProps}

src/interface/timeline.ts

@@ -216,6 +216,10 @@ export interface TimelineState {
   }) => boolean;
   /** 暂停 */
   pause: () => void;
+  /** 设置scroll left */
+  setScrollLeft: (val: number) => void;
+  /** 设置scroll top */
+  setScrollTop: (val: number) => void;
 }
 
 /**
@@ -225,7 +229,8 @@ export interface TimelineState {
  */
 export interface TimelineEditor extends EditData {
   /**
-   * @description 编辑区域距离顶部滚动距离 (用于控制与编辑行滚动同步)
+   * @description 编辑区域距离顶部滚动距离 (请使用ref.setScrollTop代替)
+   * @deprecated
    */
   scrollTop?: number;
   /**