upgrade react virtualized

README.md

@@ -1,18 +1,17 @@
 # React Timeline Editor
-[![npm version](https://img.shields.io/npm/v/@xzdarcy/react-timeline-editor.svg?style=flat-square)](https://www.npmjs.com/package/@xzdarcy/react-timeline-editor)
-[![npm downloads](https://img.shields.io/npm/dm/@xzdarcy/react-timeline-editor.svg?style=flat-square)](https://www.npmjs.com/package/@xzdarcy/react-timeline-editor)
+This repo is forked from [xzdarcy/react-timeline-editor](https://github.com/xzdarcy/react-timeline-editor)
+[![npm version](https://img.shields.io/npm/v/@rakesh.rk1/react-timeline-editor.svg?style=flat-square)](https://www.npmjs.com/package/@rakesh.rk1/react-timeline-editor)
 
 **[React Timeline Editor](https://zdarcy.com/)** is a react component used to quickly build a timeline animation editor.
 
-![example](https://github.com/xzdarcy/react-timeline-editor/blob/f79d85eee8a723e5210c04232daf2c51888418c0/public/assets/timeline.gif)
 ## Getting Started
 
 ```bash
-npm install @xzdarcy/react-timeline-editor
+npm i @rakesh.rk1/react-timeline-editor
 ```
 
 ```ts
-import { Timeline, TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { Timeline, TimelineEffect, TimelineRow } from '@rakesh.rk1/react-timeline-editor';
 import React from 'react';
 
 const mockData: TimelineRow[] = [{

docs/editor-demo/editor-action-config/custom.tsx

@@ -1,22 +1,20 @@
 import React, { FC } from 'react';
-import { TimelineAction, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineAction, TimelineRow } from '@rakesh.rk1/react-timeline-editor';
 
-export const CustomRender0: FC<{ action: TimelineAction; row: TimelineRow }> =
-  ({ action, row }) => {
-    return (
-      <div className={'effect0'}>
-        <div className={`effect0-text`}>{`播放音频: ${(
-          action.end - action.start
-        ).toFixed(2)}s ${action.movable === false ? '（不可移动）' : ''} ${
-          action.flexible === false ? '（不可缩放）' : ''
-        }`}</div>
-      </div>
-    );
-  };
+export const CustomRender0: FC<{ action: TimelineAction; row: TimelineRow }> = ({ action, row }) => {
+  return (
+    <div className={'effect0'}>
+      <div className={`effect0-text`}>{`播放音频: ${(action.end - action.start).toFixed(2)}s ${action.movable === false ? '（不可移动）' : ''} ${
+        action.flexible === false ? '（不可缩放）' : ''
+      }`}</div>
+    </div>
+  );
+};
 
-export const CustomRender1: FC<{ action: TimelineAction; row: TimelineRow }> =
-  ({ action, row }) => {
-    return <div className={'effect1'}>
+export const CustomRender1: FC<{ action: TimelineAction; row: TimelineRow }> = ({ action, row }) => {
+  return (
+    <div className={'effect1'}>
       <img src="/assets/flag.png"></img>
-    </div>;
-  };
+    </div>
+  );
+};

docs/editor-demo/editor-action-config/custom2.tsx

@@ -1,13 +1,10 @@
 import React, { FC } from 'react';
-import { TimelineAction, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineAction, TimelineRow } from '@rakesh.rk1/react-timeline-editor';
 
-export const CustomRender0: FC<{ action: TimelineAction; row: TimelineRow }> =
-  ({ action, row }) => {
-    return (
-      <div className={'effect0'}>
-        <div className={`effect0-text`}>{`${typeof action.minStart === 'number' ? 'minStart:' + action.minStart : ''} ${
-          typeof action.maxEnd === 'number' ? 'maxEnd:' + action.maxEnd : ''
-        }`}</div>
-      </div>
-    );
-  };
+export const CustomRender0: FC<{ action: TimelineAction; row: TimelineRow }> = ({ action, row }) => {
+  return (
+    <div className={'effect0'}>
+      <div className={`effect0-text`}>{`${typeof action.minStart === 'number' ? 'minStart:' + action.minStart : ''} ${typeof action.maxEnd === 'number' ? 'maxEnd:' + action.maxEnd : ''}`}</div>
+    </div>
+  );
+};

docs/editor-demo/editor-action-config/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from '@rakesh.rk1/react-timeline-editor';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';
 import { CustomRender0, CustomRender1 } from './custom';
@@ -18,10 +18,10 @@ const TimelineEditor = () => {
         effects={mockEffect}
         hideCursor={false}
         getActionRender={(action, row) => {
-          if(action.effectId === 'effect0') {
-            return <CustomRender0 action={action} row={row}/>
+          if (action.effectId === 'effect0') {
+            return <CustomRender0 action={action} row={row} />;
           } else if (action.effectId === 'effect1') {
-            return <CustomRender1 action={action} row={row}/>
+            return <CustomRender1 action={action} row={row} />;
           }
         }}
       />

docs/editor-demo/editor-action-config/index2.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from '@rakesh.rk1/react-timeline-editor';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';
 import { CustomRender0 } from './custom2';

docs/editor-demo/editor-action-config/mock.ts

@@ -1,86 +1,85 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from '@rakesh.rk1/react-timeline-editor';
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {
-    id: "effect0",
-    name: "效果0",
+    id: 'effect0',
+    name: '效果0',
   },
   effect1: {
-    id: "effect1",
-    name: "效果1",
+    id: 'effect1',
+    name: '效果1',
   },
 };
 
-
 export const mockData: TimelineRow[] = [
   {
-    id: "0",
+    id: '0',
     actions: [
       {
-        id: "action00",
+        id: 'action00',
         start: 0,
         end: 2,
-        effectId: "effect0",
+        effectId: 'effect0',
       },
     ],
   },
   {
-    id: "1",
+    id: '1',
     actions: [
       {
-        id: "action10",
+        id: 'action10',
         start: 3,
         end: 3,
         flexible: false,
-        effectId: "effect1",
-      }
+        effectId: 'effect1',
+      },
     ],
   },
   {
-    id: "2",
+    id: '2',
     actions: [
       {
-        id: "action20",
+        id: 'action20',
         flexible: false,
         start: 2.3,
         end: 4.6,
-        effectId: "effect0",
+        effectId: 'effect0',
       },
     ],
   },
   {
-    id: "3",
+    id: '3',
     actions: [
       {
-        id: "action30",
+        id: 'action30',
         start: 1.5,
         end: 1.5,
-        effectId: "effect0",
-      }
+        effectId: 'effect0',
+      },
     ],
   },
   {
-    id: "4",
+    id: '4',
     actions: [
       {
-        id: "action40",
+        id: 'action40',
         start: 1,
         end: 1,
         flexible: false,
-        effectId: "effect1",
-      }
+        effectId: 'effect1',
+      },
     ],
   },
   {
-    id: "5",
+    id: '5',
     actions: [
       {
-        id: "action50",
+        id: 'action50',
         movable: false,
         start: 1,
         end: 3,
-        effectId: "effect0",
-      }
+        effectId: 'effect0',
+      },
     ],
   },
 ];

docs/editor-demo/editor-action-config/mock2.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from '@rakesh.rk1/react-timeline-editor';
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-auto-scroll/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from '@rakesh.rk1/react-timeline-editor';
 import { Switch } from 'antd';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';
@@ -13,19 +13,8 @@ const TimelineEditor = () => {
 
   return (
     <div className="timeline-editor-example9">
-      <Switch
-        checkedChildren="开启自动滚动"
-        unCheckedChildren="禁用自动滚动"
-        checked={autoScroll}
-        onChange={(e) => setAutoScroll(e)}
-        style={{ marginBottom: 20 }}
-      />
-      <Timeline
-        onChange={setData}
-        editorData={data}
-        effects={mockEffect}
-        autoScroll={autoScroll}
-      />
+      <Switch checkedChildren="开启自动滚动" unCheckedChildren="禁用自动滚动" checked={autoScroll} onChange={(e) => setAutoScroll(e)} style={{ marginBottom: 20 }} />
+      <Timeline onChange={setData} editorData={data} effects={mockEffect} autoScroll={autoScroll} />
     </div>
   );
 };

docs/editor-demo/editor-auto-scroll/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-auxiliary-line-snap/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { Switch } from 'antd';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';

docs/editor-demo/editor-auxiliary-line-snap/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-basic-event/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline, TimelineAction } from '@xzdarcy/react-timeline-editor';
+import { Timeline, TimelineAction } from @rakesh.rk1/react-timeline-editor;
 import { cloneDeep } from 'lodash';
 import React, { useRef, useState } from 'react';
 import './index.less';

docs/editor-demo/editor-basic-event/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-basic/disable.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { Switch } from 'antd';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';

docs/editor-demo/editor-basic/hideCursor.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { Switch } from 'antd';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';

docs/editor-demo/editor-basic/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { cloneDeep } from 'lodash';
 import React, { useEffect, useState } from 'react';
 import './index.less';

docs/editor-demo/editor-basic/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-callback/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';
 import './index.less';

docs/editor-demo/editor-callback/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-custom-style/custom.tsx

@@ -1,5 +1,5 @@
 import React, { FC } from 'react';
-import { TimelineAction, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineAction, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const CustomRender0: FC<{ action: TimelineAction; row: TimelineRow }> =
   ({ action, row }) => {

docs/editor-demo/editor-custom-style/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { cloneDeep } from 'lodash';
 import React, { useEffect, useState } from 'react';
 import { CustomRender0, CustomRender1 } from './custom';

docs/editor-demo/editor-custom-style/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-grid-snap/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { Input, Row, Col, Switch } from 'antd';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';

docs/editor-demo/editor-grid-snap/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-scale-customization/custom.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';
 import './index.less';

docs/editor-demo/editor-scale-customization/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from @rakesh.rk1/react-timeline-editor;
 import { Col, Input, Row } from 'antd';
 import { cloneDeep } from 'lodash';
 import React, { useState } from 'react';

docs/editor-demo/editor-scale-customization/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {

docs/editor-demo/editor-scroll-sync/index.tsx

@@ -1,4 +1,4 @@
-import { Timeline, TimelineState } from '@xzdarcy/react-timeline-editor';
+import { Timeline, TimelineState } from @rakesh.rk1/react-timeline-editor;
 import { cloneDeep } from 'lodash';
 import React, { useRef, useState } from 'react';
 import './index.less';

docs/editor-demo/editor-scroll-sync/mock.ts

@@ -1,4 +1,4 @@
-import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+import { TimelineEffect, TimelineRow } from @rakesh.rk1/react-timeline-editor;
 
 export const mockEffect: Record<string, TimelineEffect> = {
   effect0: {