diff --git a/.gitignore b/.gitignore
index 877ca82..00334eb 100644
--- a/.gitignore
+++ b/.gitignore
@@ -24,3 +24,6 @@
 # ide
 /.vscode
 /.idea
+
+/ .npmrc
+.npmrc
\ No newline at end of file
diff --git a/CHANGELOG.md b/CHANGELOG.md
new file mode 100644
index 0000000..31562df
--- /dev/null
+++ b/CHANGELOG.md
@@ -0,0 +1,646 @@
+# Changelog
+
+All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
+
+### 0.19.4 (2023-07-08)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([635ce17](https://github.com/khanzzirfan/react-timeline-editor/commit/635ce17a04bc3e60786df6b8eeba53f684354729))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+### 0.19.3 (2023-05-19)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([635ce17](https://github.com/khanzzirfan/react-timeline-editor/commit/635ce17a04bc3e60786df6b8eeba53f684354729))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+### 0.19.2 (2023-04-06)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([635ce17](https://github.com/khanzzirfan/react-timeline-editor/commit/635ce17a04bc3e60786df6b8eeba53f684354729))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+### 0.19.1 (2023-04-06)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([635ce17](https://github.com/khanzzirfan/react-timeline-editor/commit/635ce17a04bc3e60786df6b8eeba53f684354729))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.19.0 (2023-04-01)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.18.0 (2023-04-01)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.17.0 (2023-04-01)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.16.0 (2023-04-01)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([7566dc8](https://github.com/khanzzirfan/react-timeline-editor/commit/7566dc8c0843ddc42f0c60fea3b6aca316d3984e))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.15.0 (2023-03-31)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.14.0 (2023-03-31)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.13.0 (2023-03-31)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.12.0 (2023-03-31)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([248e9cb](https://github.com/khanzzirfan/react-timeline-editor/commit/248e9cb16a4531db7ee81f433be70b49800040e5))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.11.0 (2023-03-31)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([0b12559](https://github.com/khanzzirfan/react-timeline-editor/commit/0b12559735cfdd670143989a0decda29576fc038))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.10.0 (2023-03-31)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* fixed bug fixes on null action items ([b446a19](https://github.com/khanzzirfan/react-timeline-editor/commit/b446a19af540b37d2cc610d4ee4e1408bfecd974))
+* updated packagejson ([629a2c9](https://github.com/khanzzirfan/react-timeline-editor/commit/629a2c9c0db4f0dcbda3056131f7eadd20cdf175))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.9.0 (2023-02-21)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.8.0 (2023-02-21)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* updated packagejson ([941743a](https://github.com/khanzzirfan/react-timeline-editor/commit/941743a179a798e27c37dd1648acb85084013027))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.7.0 (2023-02-21)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+* fixed the row drag and drop and cursor locked to its y position ([85dbf46](https://github.com/khanzzirfan/react-timeline-editor/commit/85dbf46ca6fd12c27c0c957dcb7662dedc511c21))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+* updated packagejson ([1b160c5](https://github.com/khanzzirfan/react-timeline-editor/commit/1b160c599bf120df9ee8c769f6b0c7e8a02a6617))
+
+## 0.6.0 (2023-02-18)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+
+## 0.5.0 (2023-02-13)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+
+## 0.4.0 (2023-02-13)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+
+## 0.3.0 (2023-02-13)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
+
+## 0.2.0 (2023-02-13)
+
+
+### Features
+
+* ✨ add cursor drag start/end props ([61b5a5e](https://github.com/khanzzirfan/react-timeline-editor/commit/61b5a5e2a0a263541d908fe82d65c3eed74851f8))
+* ✨ allow to set scrollLeft ([dcc8d1e](https://github.com/khanzzirfan/react-timeline-editor/commit/dcc8d1eade0c4c4c70976c6c8c02b5d1fc2570fe))
+* ✨ auto scroll when drag cursor ([fc55f56](https://github.com/khanzzirfan/react-timeline-editor/commit/fc55f56afb8ec0633d4e90e1e3bc7ee1aec7b790))
+* ✨ on cursor drag ([8150141](https://github.com/khanzzirfan/react-timeline-editor/commit/815014156d39eb0736c346fc270da8f5ffb6d31a))
+
+
+### Bug Fixes
+
+* 🐛 compatible with react18 ([de966e0](https://github.com/khanzzirfan/react-timeline-editor/commit/de966e012a7306cc492a12547638a8d494846301))
+* 🐛 cursor listen scrollLeft change ([520e4cb](https://github.com/khanzzirfan/react-timeline-editor/commit/520e4cbedf0c5a5d5063fa91d4359733105d9abd))
+* 🐛 engine example audio play ([a0f6e54](https://github.com/khanzzirfan/react-timeline-editor/commit/a0f6e54be025b688e0c9d5ed0c36b05b8fc5c788))
+* 🐛 engine example destroy error ([b2919d9](https://github.com/khanzzirfan/react-timeline-editor/commit/b2919d919e0b03fc1b2880017c12e8eabf4a502e))
+* 🐛 engine example engine reference error ([123e72e](https://github.com/khanzzirfan/react-timeline-editor/commit/123e72eb315046ab954ae591574ae2500f2f57c5))
+* 🐛 react type config ([cca5a5b](https://github.com/khanzzirfan/react-timeline-editor/commit/cca5a5b9d617de092b5b8904390a2a34c2f87822))
+* 🐛 remove 'window' to adapt for nextjs ([51904d5](https://github.com/khanzzirfan/react-timeline-editor/commit/51904d5456643e0b66e2227fe74eb6fc78f8ac20))
+* 🐛 remove not necessary dependencies ([61a115d](https://github.com/khanzzirfan/react-timeline-editor/commit/61a115dd5dcfe870a080e6915486898bae27b873))
+* 🐛 scroll sync error ([0a7b459](https://github.com/khanzzirfan/react-timeline-editor/commit/0a7b459a3bf77e9c0879528ff0956ec5163f7440))
+* **emitter:** make offAll() keep events names ([d02f2b7](https://github.com/khanzzirfan/react-timeline-editor/commit/d02f2b79017c1cb1d78465b42afb64804c8f86bf))
diff --git a/README.md b/README.md
index 238cef3..c7492d4 100644
--- a/README.md
+++ b/README.md
@@ -1,10 +1,16 @@
+## Original Work
+
+This repo is forked from the original author repo `@xzdarcy/react-timeline-editor` and modified with custom requirements.
+
 # 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)
 
 **[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
@@ -15,50 +21,47 @@ npm install @xzdarcy/react-timeline-editor
 import { Timeline, TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
 import React from 'react';
 
-const mockData: TimelineRow[] = [{
-    id: "0",
+const mockData: TimelineRow[] = [
+  {
+    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: 1.5,
         end: 5,
-        effectId: "effect1",
-      }
+        effectId: 'effect1',
+      },
     ],
-}]
+  },
+];
 
 const mockEffect: Record<string, TimelineEffect> = {
   effect0: {
-    id: "effect0",
-    name: "效果0",
+    id: 'effect0',
+    name: '效果0',
   },
   effect1: {
-    id: "effect1",
-    name: "效果1",
+    id: 'effect1',
+    name: '效果1',
   },
 };
 
 const TimelineEditor = () => {
-  return (
-      <Timeline
-        editorData={mockData}
-        effects={mockEffect}
-      />
-  );
+  return <Timeline editorData={mockData} effects={mockEffect} />;
 };
 ```
 
 ## Documention
-Checkout the [Docs](https://zdarcy.com/) for a demonstration of some basic and advanced features.
 
+Checkout the [Docs](https://zdarcy.com/) for a demonstration of some basic and advanced features.
diff --git a/docs/editor-demo/editor-basic-irfan/disable.tsx b/docs/editor-demo/editor-basic-irfan/disable.tsx
new file mode 100644
index 0000000..8ca128f
--- /dev/null
+++ b/docs/editor-demo/editor-basic-irfan/disable.tsx
@@ -0,0 +1,23 @@
+import { Timeline } from '../../../src/components/timeline';
+
+import { Switch } from 'antd';
+import { cloneDeep } from 'lodash';
+import React, { useState } from 'react';
+import './index.less';
+import { mockData, mockEffect } from './mock';
+
+const defaultEditorData = cloneDeep(mockData);
+
+const TimelineEditor = () => {
+  const [data, setData] = useState(defaultEditorData);
+  const [allow, setAllow] = useState(true);
+
+  return (
+    <div className="timeline-editor-example0">
+      <Switch checkedChildren="开启编辑" unCheckedChildren="禁用编辑" checked={allow} onChange={(e) => setAllow(e)} style={{ marginBottom: 20 }} />
+      <Timeline onChange={setData} editorData={data} effects={mockEffect} disableDrag={!allow} />
+    </div>
+  );
+};
+
+export default TimelineEditor;
diff --git a/docs/editor-demo/editor-basic-irfan/hideCursor.tsx b/docs/editor-demo/editor-basic-irfan/hideCursor.tsx
new file mode 100644
index 0000000..f429a65
--- /dev/null
+++ b/docs/editor-demo/editor-basic-irfan/hideCursor.tsx
@@ -0,0 +1,22 @@
+import { Timeline } from '../../../src/components/timeline';
+import { Switch } from 'antd';
+import { cloneDeep } from 'lodash';
+import React, { useState } from 'react';
+import './index.less';
+import { mockData, mockEffect } from './mock';
+
+const defaultEditorData = cloneDeep(mockData);
+
+const TimelineEditor = () => {
+  const [data, setData] = useState(defaultEditorData);
+  const [showCursor, setShowCursor] = useState(false);
+
+  return (
+    <div className="timeline-editor-example0">
+      <Switch checkedChildren="开启光标" unCheckedChildren="隐藏光标" checked={showCursor} onChange={(e) => setShowCursor(e)} style={{ marginBottom: 20 }} />
+      <Timeline onChange={setData} editorData={data} effects={mockEffect} hideCursor={!showCursor} />
+    </div>
+  );
+};
+
+export default TimelineEditor;
diff --git a/docs/editor-demo/editor-basic-irfan/index.less b/docs/editor-demo/editor-basic-irfan/index.less
new file mode 100644
index 0000000..6b2ec18
--- /dev/null
+++ b/docs/editor-demo/editor-basic-irfan/index.less
@@ -0,0 +1,66 @@
+@import '~antd/dist/antd.css';
+
+.dropzone {
+  background-color: #bfe4ff;
+  border: dashed 4px transparent;
+  border-radius: 4px;
+  margin: 10px auto 30px;
+  padding: 10px;
+  width: 80%;
+  transition: background-color 0.3s;
+}
+
+.drop-active {
+  border-color: #aaa !important;
+}
+
+.collison-active {
+  background-color: #E0115F !important;
+}
+
+.drop-target {
+  // background-color: #29e !important;
+  border-color: #fff !important;
+  border-style: solid;
+}
+
+.drag-drop {
+  display: inline-block;
+  min-width: 40px;
+  padding: 2em 0.5em;
+  margin: 1rem 0 0 1rem;
+
+  color: #fff;
+  // background-color: #29e;
+  border: solid 2px #fff;
+
+  touch-action: none;
+  transform: translate(0px, 0px);
+
+  transition: background-color 0.3s;
+}
+
+.drag-drop.can-drop {
+  color: #000;
+  background-color: #4e4;
+}
+
+.timeline-editor-example0 {
+  .timeline-editor {
+    width: 100%;
+    max-width: 800px;
+    height: 300px;
+  
+    .timeline-editor-edit-row:nth-of-type(odd) {
+      background-color: darkolivegreen;
+    }
+
+    &-action {
+      height: 28px !important;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+  }
+}
+
+
diff --git a/docs/editor-demo/editor-basic-irfan/index.md b/docs/editor-demo/editor-basic-irfan/index.md
new file mode 100644
index 0000000..b3db9c0
--- /dev/null
+++ b/docs/editor-demo/editor-basic-irfan/index.md
@@ -0,0 +1,13 @@
+---
+title: editor basic irfan test
+toc: 'menu'
+order: 0
+group:
+  title: 编辑器示例
+---
+
+### dropzone usage
+
+> 尝试向右拖动动作块，可自动识别无限滚动延长
+
+<code src="./index.tsx"></code>
diff --git a/docs/editor-demo/editor-basic-irfan/index.tsx b/docs/editor-demo/editor-basic-irfan/index.tsx
new file mode 100644
index 0000000..f01bb13
--- /dev/null
+++ b/docs/editor-demo/editor-basic-irfan/index.tsx
@@ -0,0 +1,52 @@
+import { cloneDeep } from 'lodash';
+import React, { useEffect, useState } from 'react';
+import './index.less';
+import { mockData, mockEffect } from './mock';
+import { Timeline } from '../../../src/components/timeline';
+
+const defaultEditorData = cloneDeep(mockData);
+
+const TimelineEditor = () => {
+  const [data, setData] = useState(defaultEditorData);
+
+  React.useEffect(() => {
+    console.log('data updated', data);
+  }, [data]);
+
+  const handleOnMoveEnd = (...params) => {
+    console.log('actionMoveEnd', params);
+  };
+
+  const handleOnResizeEnd = (...params) => {
+    console.log('handleOnResizeEnd', params);
+  };
+
+  const handleOnClickRow = (...params) => {
+    console.log('handleOnClickRow', params);
+  };
+
+  const handleOnContextMenuRow = (...params) => {
+    console.log('handleOnContextMenuRow', params);
+  };
+
+  return (
+    <div className="timeline-editor-example0">
+      <Timeline
+        onChange={setData}
+        editorData={data}
+        effects={mockEffect}
+        hideCursor={false}
+        autoScroll
+        autoReRender
+        onActionMoveEnd={handleOnMoveEnd}
+        onActionResizeEnd={handleOnResizeEnd}
+        onClickActionOnly={handleOnClickRow}
+        onContextMenuAction={handleOnContextMenuRow}
+        gridSnap
+        dragLine
+      />
+    </div>
+  );
+};
+
+export default TimelineEditor;
diff --git a/docs/editor-demo/editor-basic-irfan/mock.ts b/docs/editor-demo/editor-basic-irfan/mock.ts
new file mode 100644
index 0000000..f24aa7c
--- /dev/null
+++ b/docs/editor-demo/editor-basic-irfan/mock.ts
@@ -0,0 +1,65 @@
+import { TimelineEffect, TimelineRow } from '@xzdarcy/react-timeline-editor';
+
+export const mockEffect: Record<string, TimelineEffect> = {
+  effect0: {
+    id: 'effect0',
+    name: '效果0',
+  },
+  effect1: {
+    id: 'effect1',
+    name: '效果1',
+  },
+};
+
+export const mockData: TimelineRow[] = [
+  {
+    id: '0',
+    actions: [
+      {
+        id: 'action00',
+        start: 0,
+        end: 2,
+        effectId: 'effect0',
+      },
+    ],
+  },
+  {
+    id: '1',
+    actions: [
+      {
+        id: 'action10',
+        start: 1.5,
+        end: 5,
+        effectId: 'effect1',
+      },
+    ],
+  },
+  {
+    id: '2',
+    actions: [
+      {
+        id: 'action20',
+        start: 3,
+        end: 4,
+        effectId: 'effect0',
+      },
+    ],
+  },
+  // {
+  //   id: "3",
+  //   actions: [
+  //     {
+  //       id: "action30",
+  //       start: 4,
+  //       end: 4.5,
+  //       effectId: "effect1",
+  //     },
+  //     {
+  //       id: "action31",
+  //       start: 6,
+  //       end: 8,
+  //       effectId: "effect1",
+  //     },
+  //   ],
+  // },
+];
diff --git a/docs/editor-demo/editor-scroll-sync/index.tsx b/docs/editor-demo/editor-scroll-sync/index.tsx
index 7db1536..e2c0e93 100644
--- a/docs/editor-demo/editor-scroll-sync/index.tsx
+++ b/docs/editor-demo/editor-scroll-sync/index.tsx
@@ -1,4 +1,6 @@
-import { Timeline, TimelineState } from '@xzdarcy/react-timeline-editor';
+// import { Timeline, TimelineState } from '@xzdarcy/react-timeline-editor';
+import { Timeline } from '../../../src/components/timeline';
+import { TimelineState } from '../../../src/interface/timeline';
 import { cloneDeep } from 'lodash';
 import React, { useRef, useState } from 'react';
 import './index.less';
diff --git a/docs/engine/engine-standalone/index.tsx b/docs/engine/engine-standalone/index.tsx
index 2ac13dc..83d819c 100644
--- a/docs/engine/engine-standalone/index.tsx
+++ b/docs/engine/engine-standalone/index.tsx
@@ -22,11 +22,11 @@ const TimelineEditor = () => {
     timelineEngine.current.on('paused', () => setIsPlaying(false));
     timelineEngine.current.on('afterSetTime', ({ time }) => setTime(time));
     timelineEngine.current.on('setTimeByTick', ({ time }) => setTime(time));
-    
+
     let dur = 0;
-    mockData.forEach(row => {
-      row.actions.forEach(action => dur = Math.max(dur, action.end));
-    })
+    mockData.forEach((row) => {
+      row.actions.forEach((action) => (dur = Math.max(dur, action.end)));
+    });
     setDuration(dur);
 
     return () => {
@@ -50,7 +50,7 @@ const TimelineEditor = () => {
   const handleSetTime = (value: number) => {
     timelineEngine.current.setTime(Number(value));
     timelineEngine.current.reRender();
-  }
+  };
 
   // 时间展示
   const timeRender = (time: number) => {
@@ -69,7 +69,7 @@ const TimelineEditor = () => {
         </div>
         <div className="play-time">
           <div className="play-time-current">{timeRender(time)}</div>
-          <Slider onChange={handleSetTime} className="play-time-slider" step={0.01} min={0} max={duration} value={time} />
+          {/* <Slider onChange={handleSetTime} className="play-time-slider" step={0.01} min={0} max={duration} value={time} /> */}
           <div className="play-time-duration">{timeRender(duration)}</div>
         </div>
       </div>
diff --git a/package.json b/package.json
index 5714782..5200e5d 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,9 @@
 {
   "name": "@xzdarcy/react-timeline-editor",
-  "version": "0.1.7",
-  "author": "xzdarcy",
+  "testName": "@xzdarcy/react-timeline-editor",
+  "publishname": "reacthub-timeline-editor",
+  "version": "0.19.4",
+  "author": "khanzzirfan",
   "license": "MIT",
   "keywords": [
     "timeline",
@@ -11,12 +13,12 @@
     "typescript"
   ],
   "bugs": {
-    "url": "https://github.com/xzdarcy/react-timeline-editor/issues"
+    "url": "https://github.com/khanzzirfan/react-timeline-editor/issues"
   },
-  "homepage": "https://github.com/xzdarcy/react-timeline-editor#readme",
+  "homepage": "https://github.com/khanzzirfan/react-timeline-editor#readme",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/xzdarcy/react-timeline-editor.git"
+    "url": "git+https://github.com/khanzzirfan/react-timeline-editor.git"
   },
   "scripts": {
     "start": "dumi dev",
@@ -24,7 +26,8 @@
     "docs:deploy": "",
     "build": "father-build",
     "deploy": "npm run docs:build && npm run docs:deploy",
-    "prepublishOnly": "npm run build"
+    "prepublishOnly": "npm run build",
+    "release": "standard-version --release-as patch &&npm publish"
   },
   "files": [
     "dist"
@@ -41,6 +44,7 @@
     "@types/react-virtualized": "^9.21.14",
     "framework-utils": "^1.1.0",
     "interactjs": "^1.10.11",
+    "react-intersection-observer": "^9.4.3",
     "react-virtualized": "^9.22.3"
   },
   "devDependencies": {
@@ -60,6 +64,7 @@
     "prettier": "^2.2.1",
     "react": "^17.0.0",
     "react-dom": "^17.0.0",
+    "standard-version": "^9.5.0",
     "yorkie": "^2.0.0"
   }
 }
diff --git a/publish.readme.md b/publish.readme.md
new file mode 100644
index 0000000..4b508e1
--- /dev/null
+++ b/publish.readme.md
@@ -0,0 +1,3 @@
+## Git project link
+
+github.com:khanzzirfan/react-timeline-editor.git
diff --git a/src/components/cursor/cursor.less b/src/components/cursor/cursor.less
index 6541581..4e62a7d 100644
--- a/src/components/cursor/cursor.less
+++ b/src/components/cursor/cursor.less
@@ -5,8 +5,8 @@
     top: 32px;
     height: calc(100% - 32px);
     box-sizing: border-box;
-    border-left: 1px solid #5297FF;
-    border-right: 1px solid #5297FF;
+    border-left: 1px solid #00CCA7;
+    border-right: 1px solid #00CCA7;
     transform: translateX(-25%) scaleX(0.5);
 
     &-top {
diff --git a/src/components/cursor/cursor.tsx b/src/components/cursor/cursor.tsx
index eb7c212..ead50eb 100644
--- a/src/components/cursor/cursor.tsx
+++ b/src/components/cursor/cursor.tsx
@@ -112,12 +112,9 @@ export const Cursor: FC<CursorProps> = ({
         return false;
       }}
     >
-      <div className={prefix('cursor')}>
-        <svg className={prefix('cursor-top')} width="8" height="12" viewBox="0 0 8 12" fill="none">
-          <path
-            d="M0 1C0 0.447715 0.447715 0 1 0H7C7.55228 0 8 0.447715 8 1V9.38197C8 9.76074 7.786 10.107 7.44721 10.2764L4.44721 11.7764C4.16569 11.9172 3.83431 11.9172 3.55279 11.7764L0.552786 10.2764C0.214002 10.107 0 9.76074 0 9.38197V1Z"
-            fill="#5297FF"
-          />
+      <div className={prefix('cursor')} data-id="cursor">
+        <svg className={prefix('cursor-top')} width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <circle cx="7" cy="7" r="7" fill="#00CCA7" />
         </svg>
         <div className={prefix('cursor-area')} />
       </div>
diff --git a/src/components/edit_area/edit_action.tsx b/src/components/edit_area/edit_action.tsx
index ac6cfcc..59d6081 100644
--- a/src/components/edit_area/edit_action.tsx
+++ b/src/components/edit_area/edit_action.tsx
@@ -52,8 +52,10 @@ export const EditAction: FC<EditActionProps> = ({
   handleTime,
   areaRef,
   deltaScrollLeft,
+  onDrop,
 }) => {
   const rowRnd = useRef<RowRndApi>();
+
   const isDragWhenClick = useRef(false);
   const { id, maxEnd, minStart, end, start, selected, flexible = true, movable = true, effectId } = action;
 
@@ -102,9 +104,9 @@ export const EditAction: FC<EditActionProps> = ({
   const handleDragStart: RndDragStartCallback = () => {
     onActionMoveStart && onActionMoveStart({ action, row });
   };
-  const handleDrag: RndDragCallback = ({ left, width }) => {
-    isDragWhenClick.current = true;
 
+  const handleDrag: RndDragCallback = ({ left, width, top }) => {
+    isDragWhenClick.current = true;
     if (onActionMoving) {
       const { start, end } = parserTransformToTime({ left, width }, { scaleWidth, scale, startLeft });
       const result = onActionMoving({ action, row, start, end });
@@ -117,14 +119,12 @@ export const EditAction: FC<EditActionProps> = ({
   const handleDragEnd: RndDragEndCallback = ({ left, width }) => {
     // 计算时间
     const { start, end } = parserTransformToTime({ left, width }, { scaleWidth, scale, startLeft });
-
     // 设置数据
     const rowItem = editorData.find((item) => item.id === row.id);
     const action = rowItem.actions.find((item) => item.id === id);
     action.start = start;
     action.end = end;
     setEditorData(editorData);
-
     // 执行回调
     if (onActionMoveEnd) onActionMoveEnd({ action, row, start, end });
   };
@@ -158,6 +158,7 @@ export const EditAction: FC<EditActionProps> = ({
     // 触发回调
     if (onActionResizeEnd) onActionResizeEnd({ action, row, start, end, dir });
   };
+
   //#endregion
 
   const nowAction = {
@@ -230,6 +231,10 @@ export const EditAction: FC<EditActionProps> = ({
         }}
         className={prefix((classNames || []).join(' '))}
         style={{ height: rowHeight }}
+        data-testid="context-menu"
+        data-id="actionitem"
+        data-rowid={row.id}
+        data-actionid={action?.id || 'null'}
       >
         {getActionRender && getActionRender(nowAction, nowRow)}
         {flexible && <div className={prefix('action-left-stretch')} />}
diff --git a/src/components/edit_area/edit_row.tsx b/src/components/edit_area/edit_row.tsx
index fa8f232..1848ba7 100644
--- a/src/components/edit_area/edit_row.tsx
+++ b/src/components/edit_area/edit_row.tsx
@@ -20,18 +20,7 @@ export type EditRowProps = CommonProp & {
 };
 
 export const EditRow: FC<EditRowProps> = (props) => {
-  const {
-    rowData,
-    style = {},
-    onClickRow,
-    onDoubleClickRow,
-    onContextMenuRow,
-    areaRef,
-    scrollLeft,
-    startLeft,
-    scale,
-    scaleWidth,
-  } = props;
+  const { rowData, style = {}, onClickRow, onDoubleClickRow, onContextMenuRow, areaRef, scrollLeft, startLeft, scale, scaleWidth } = props;
 
   const classNames = ['edit-row'];
   if (rowData?.selected) classNames.push('edit-row-selected');
@@ -47,9 +36,9 @@ export const EditRow: FC<EditRowProps> = (props) => {
 
   return (
     <div
-      className={`${prefix(...classNames)} ${(rowData?.classNames || []).join(
-        ' ',
-      )}`}
+      className={`${prefix(...classNames)} ${(rowData?.classNames || []).join(' ')}`}
+      data-testid="itemrow"
+      data-rowid={rowData?.id}
       style={style}
       onClick={(e) => {
         if (rowData && onClickRow) {
@@ -71,13 +60,7 @@ export const EditRow: FC<EditRowProps> = (props) => {
       }}
     >
       {(rowData?.actions || []).map((action) => (
-        <EditAction
-          key={action.id}
-          {...props}
-          handleTime={handleTime}
-          row={rowData}
-          action={action}
-        />
+        <EditAction key={action.id} {...props} handleTime={handleTime} row={rowData} action={action} />
       ))}
     </div>
   );
diff --git a/src/components/row_rnd/interactable.tsx b/src/components/row_rnd/interactable.tsx
index 0b334e4..132d2f7 100644
--- a/src/components/row_rnd/interactable.tsx
+++ b/src/components/row_rnd/interactable.tsx
@@ -1,8 +1,8 @@
-import { DraggableOptions } from "@interactjs/actions/drag/plugin";
-import { ResizableOptions } from "@interactjs/actions/resize/plugin";
-import { DragEvent, Interactable } from "@interactjs/types";
-import interact from "interactjs";
-import { cloneElement, FC, ReactElement, useEffect, useRef } from "react";
+import { DraggableOptions } from '@interactjs/actions/drag/plugin';
+import { ResizableOptions } from '@interactjs/actions/resize/plugin';
+import { DragEvent, Interactable } from '@interactjs/types';
+import interact from 'interactjs';
+import { cloneElement, FC, ReactElement, useEffect, useRef } from 'react';
 
 export const InteractComp: FC<{
   interactRef?: React.MutableRefObject<Interactable>;
@@ -36,12 +36,60 @@ export const InteractComp: FC<{
         onmove: (e) => draggableOptionsRef.current.onmove && (draggableOptionsRef.current.onmove as (e: DragEvent) => any)(e),
         onend: (e) => draggableOptionsRef.current.onend && (draggableOptionsRef.current.onend as (e: DragEvent) => any)(e),
       });
-    if (resizable) interactable.current.resizable({ 
-      ...resizableOptionsRef.current,
-      onstart: (e) => resizableOptionsRef.current.onstart && (resizableOptionsRef.current.onstart as (e: DragEvent) => any)(e),
-      onmove: (e) => resizableOptionsRef.current.onmove && (resizableOptionsRef.current.onmove as (e: DragEvent) => any)(e),
-      onend: (e) => resizableOptionsRef.current.onend && (resizableOptionsRef.current.onend as (e: DragEvent) => any)(e),
-    });
+    if (resizable)
+      interactable.current.resizable({
+        ...resizableOptionsRef.current,
+        onstart: (e) => resizableOptionsRef.current.onstart && (resizableOptionsRef.current.onstart as (e: DragEvent) => any)(e),
+        onmove: (e) => resizableOptionsRef.current.onmove && (resizableOptionsRef.current.onmove as (e: DragEvent) => any)(e),
+        onend: (e) => resizableOptionsRef.current.onend && (resizableOptionsRef.current.onend as (e: DragEvent) => any)(e),
+      });
+
+    // if (dropzone) {
+    // interactable.current.dropzone({
+    //   accept: '.timeline-editor-action',
+    //   overlap: 0.75,
+    //   checker: (dragEvent, event, dropped, dropzone, dropElement, draggable, dragElement) => {
+    //     return true;
+    //   },
+    //   ondropactivate: function (event) {
+    //     // add active dropzone feedback
+    //     console.log('dropactivate');
+    //     event.target.classList.add('drop-active');
+    //   },
+    //   ondragenter: function (event) {
+    //     console.log('ondragenter');
+    //     var draggableElement = event.relatedTarget;
+    //     var dropzoneElement = event.target;
+    //     // feedback the possibility of a drop
+    //     dropzoneElement.classList.add('drop-target');
+    //     draggableElement.classList.add('can-drop');
+    //     // draggableElement.textContent = 'Dragged in';
+    //   },
+    //   ondragleave: function (event) {
+    //     console.log('ondragleave');
+    //     // remove the drop feedback style
+    //     event.target.classList.remove('drop-target');
+    //     event.relatedTarget.classList.remove('can-drop');
+    //     // event.relatedTarget.textContent = 'Dragged out';
+    //   },
+    //   ondrop: function (event) {
+    //     console.log('onDropevent', event);
+    //     // event.relatedTarget.textContent = 'Dropped';
+    //     if (dropzoneOptionsRef.current.ondrop) {
+    //       (dropzoneOptionsRef.current.ondrop as (e: DropEvent) => any)(event);
+    //     }
+    //   },
+    //   ondropdeactivate: function (event) {
+    //     console.log('ondropdeactivate', event);
+    //     // remove active dropzone feedback
+    //     event.target.classList.remove('drop-active');
+    //     event.target.classList.remove('drop-target');
+    //     if (dropzoneOptionsRef.current.ondrop) {
+    //       (dropzoneOptionsRef.current.ondrop as (e: DropEvent) => any)(event);
+    //     }
+    //   },
+    // });
+    // }
   };
 
   return cloneElement(children as ReactElement, {
diff --git a/src/components/row_rnd/row_rnd.tsx b/src/components/row_rnd/row_rnd.tsx
index 3dda6a7..77110fe 100644
--- a/src/components/row_rnd/row_rnd.tsx
+++ b/src/components/row_rnd/row_rnd.tsx
@@ -13,12 +13,13 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
       edges,
       left,
       width,
-
+      top,
       start = DEFAULT_START_LEFT,
       grid = DEFAULT_MOVE_GRID,
       bounds = {
         left: Number.MIN_SAFE_INTEGER,
         right: Number.MAX_SAFE_INTEGER,
+        top: Number.MAX_SAFE_INTEGER,
       },
       enableResizing = true,
       enableDragging = true,
@@ -32,11 +33,15 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
       onDrag,
       parentRef,
       deltaScrollLeft,
+      onDrop,
     },
     ref,
   ) => {
     const interactable = useRef<Interactable>();
     const deltaX = useRef(0);
+    const deltaY = useRef(0);
+    const originalY = useRef(0);
+
     const isAdsorption = useRef(false);
     const { initAutoScroll, dealDragAutoScroll, dealResizeAutoScroll, stopAutoScroll } = useAutoScroll(parentRef);
 
@@ -50,17 +55,25 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
     useImperativeHandle(ref, () => ({
       updateLeft: (left) => handleUpdateLeft(left || 0, false),
       updateWidth: (width) => handleUpdateWidth(width, false),
+      updateTop: (top) => handleUpdateTop(top || 0, false),
       getLeft: handleGetLeft,
       getWidth: handleGetWidth,
+      getTop: handleGetTop,
     }));
+
     useEffect(() => {
       const target = interactable.current.target as HTMLElement;
       handleUpdateWidth(typeof width === 'undefined' ? target.offsetWidth : width, false);
     }, [width]);
+
     useEffect(() => {
       handleUpdateLeft(left || 0, false);
     }, [left]);
 
+    // useEffect(() => {
+    //   handleUpdateTop(top || 0, false);
+    // }, [top]);
+
     const handleUpdateLeft = (left: number, reset = true) => {
       if (!interactable.current || !interactable.current.target) return;
       reset && (deltaX.current = 0);
@@ -68,6 +81,16 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
       target.style.left = `${left}px`;
       Object.assign(target.dataset, { left });
     };
+
+    const handleUpdateTop = (top: number, reset = true) => {
+      if (!interactable.current || !interactable.current.target) return;
+      reset && (deltaY.current = 0);
+      const target = interactable.current.target as HTMLElement;
+      target.style.top = `${top}px`;
+      target.style.zIndex = `10`;
+      Object.assign(target.dataset, { top });
+    };
+
     const handleUpdateWidth = (width: number, reset = true) => {
       if (!interactable.current || !interactable.current.target) return;
       reset && (deltaX.current = 0);
@@ -79,6 +102,12 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
       const target = interactable.current.target as HTMLElement;
       return parseFloat(target?.dataset?.left || '0');
     };
+
+    const handleGetTop = () => {
+      const target = interactable.current.target as HTMLElement;
+      return parseFloat(target?.dataset?.top || '0');
+    };
+
     const handleGetWidth = () => {
       const target = interactable.current.target as HTMLElement;
       return parseFloat(target?.dataset?.width || '0');
@@ -87,14 +116,17 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
 
     //#region [rgba(188,188,120,0.05)] 回调api
     const handleMoveStart = (e: DragEvent) => {
+      const isCursor = e.target.getAttribute('data-id') === 'cursor';
       deltaX.current = 0;
+      if (!isCursor) deltaY.current = 0;
+      if (!isCursor) originalY.current = e.dy;
       isAdsorption.current = false;
       initAutoScroll();
       onDragStart && onDragStart();
     };
 
-    const move = (param: { preLeft: number; preWidth: number; scrollDelta?: number }) => {
-      const { preLeft, preWidth, scrollDelta } = param;
+    const move = (param: { preLeft: number; preWidth: number; scrollDelta?: number; preTop?: number }) => {
+      const { preLeft, preWidth, scrollDelta, preTop } = param;
       const distance = isAdsorption.current ? adsorptionDistance : grid;
       if (Math.abs(deltaX.current) >= distance) {
         const count = parseInt(deltaX.current / distance + '');
@@ -134,48 +166,64 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
               left: curLeft,
               lastWidth: preWidth,
               width: preWidth,
+              top: preTop,
             },
             scrollDelta,
           );
           if (ret === false) return;
         }
-
         handleUpdateLeft(curLeft, false);
       }
+
+      if (preTop) {
+        const currentY = preTop;
+        handleUpdateTop(currentY, false);
+      }
     };
 
     const handleMove = (e: DragEvent) => {
       const target = e.target;
-
+      const isCursor = e.target.getAttribute('data-id') === 'cursor';
       if (deltaScrollLeft && parentRef?.current) {
         const result = dealDragAutoScroll(e, (delta) => {
           deltaScrollLeft(delta);
 
-          let { left, width } = target.dataset;
+          let { left, width, top } = target.dataset;
           const preLeft = parseFloat(left);
           const preWidth = parseFloat(width);
           deltaX.current += delta;
-          move({ preLeft, preWidth, scrollDelta: delta });
+          const preTop = !isCursor ? parseFloat(top || '0') : undefined;
+          if (!isCursor) deltaY.current += e.dy;
+          move({ preLeft, preWidth, scrollDelta: delta, preTop });
         });
         if (!result) return;
       }
 
-      let { left, width } = target.dataset;
+      let { left, width, top } = target.dataset;
       const preLeft = parseFloat(left);
       const preWidth = parseFloat(width);
+      let preTop = !isCursor ? parseFloat(top || '0') : undefined;
 
       deltaX.current += e.dx;
-      move({ preLeft, preWidth });
+      if (!isCursor) deltaY.current += e.dy;
+      if (Math.abs(deltaY.current) > 0) {
+        preTop = deltaY.current;
+      }
+      move({ preLeft, preWidth, preTop });
     };
 
     const handleMoveStop = (e: DragEvent) => {
+      const isCursor = e.target.getAttribute('data-id') === 'cursor';
+
       deltaX.current = 0;
+      if (!isCursor) deltaY.current = 0;
       isAdsorption.current = false;
       stopAutoScroll();
 
       const target = e.target;
-      let { left, width } = target.dataset;
-      onDragEnd && onDragEnd({ left: parseFloat(left), width: parseFloat(width) });
+      let { left, width, top } = target.dataset;
+      const preTop = !isCursor ? parseFloat(top || '0') : undefined;
+      onDragEnd && onDragEnd({ left: parseFloat(left), width: parseFloat(width), top: preTop });
     };
 
     const handleResizeStart = (e: ResizeEvent) => {
@@ -307,29 +355,44 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
       deltaX.current += dir === 'left' ? e.deltaRect.left : e.deltaRect.right;
       resize({ preLeft, preWidth, dir });
     };
+
     const handleResizeStop = (e: ResizeEvent) => {
       deltaX.current = 0;
       isAdsorption.current = false;
       stopAutoScroll();
 
       const target = e.target;
-      let { left, width } = target.dataset;
+      let { left, width, top } = target.dataset;
       let dir: Direction = e.edges?.right ? 'right' : 'left';
       onResizeEnd &&
         onResizeEnd(dir, {
           left: parseFloat(left),
           width: parseFloat(width),
+          top: parseFloat(top),
         });
     };
+
+    // const handleDropDeactivate = (event: DropEvent) => {
+    //   const target = interactable.current.target as HTMLElement;
+    //   event.relatedTarget.style.removeProperty('top');
+    //   // target.style.top = `${top}px`;
+    //   // Object.assign(target.dataset, { top: '0' });
+    //   // target.style.removeProperty('top');
+    //   deltaY.current = 0;
+    //   Object.assign(target.dataset, { top: 0 });
+    // };
+
     //#endregion
 
     return (
       <InteractComp
+        data-testid="interactcomponent"
         interactRef={interactable}
         draggable={enableDragging}
         resizable={enableResizing}
         draggableOptions={{
-          lockAxis: 'x',
+          startAxis: 'xy',
+          // lockAxis: 'start',
           onmove: handleMove,
           onstart: handleMoveStart,
           onend: handleMoveStop,
@@ -357,6 +420,7 @@ export const RowDnd = React.forwardRef<RowRndApi, RowRndProps>(
             ...((children as ReactElement).props.style || {}),
             left,
             width,
+            // zIndex: 10,
           },
         })}
       </InteractComp>
diff --git a/src/components/row_rnd/row_rnd_interface.ts b/src/components/row_rnd/row_rnd_interface.ts
index f089f21..05483da 100644
--- a/src/components/row_rnd/row_rnd_interface.ts
+++ b/src/components/row_rnd/row_rnd_interface.ts
@@ -1,44 +1,39 @@
-import { DragEvent, ResizeEvent } from "@interactjs/types/index";
+import { DragEvent, ResizeEvent } from '@interactjs/types/index';
 
 type EventData = {
   lastLeft: number;
   left: number;
   lastWidth: number;
   width: number;
+  top?: number;
 };
 
 export type RndDragStartCallback = () => void;
-export type RndDragCallback = (
-  data: EventData,
-  scrollDelta?: number,
-) => boolean | void;
-export type RndDragEndCallback = (data: Pick<EventData, 'left' | 'width'>) => void;
+export type RndDragCallback = (data: EventData, scrollDelta?: number) => boolean | void;
+export type RndDragEndCallback = (data: Pick<EventData, 'left' | 'width' | 'top'>) => void;
 
-export type Direction = "left" | "right";
+export type Direction = 'left' | 'right';
 export type RndResizeStartCallback = (dir: Direction) => void;
-export type RndResizeCallback = (
-  dir: Direction,
-  data: EventData
-) => boolean | void;
-export type RndResizeEndCallback = (
-  dir: Direction,
-  data: Pick<EventData, 'left' | 'width'>
-) => void;
+export type RndResizeCallback = (dir: Direction, data: EventData) => boolean | void;
+export type RndResizeEndCallback = (dir: Direction, data: Pick<EventData, 'left' | 'width' | 'top'>) => void;
 
 export interface RowRndApi {
   updateWidth: (size: number) => void;
   updateLeft: (left: number) => void;
+  updateTop: (top: number) => void;
   getLeft: () => number;
   getWidth: () => number;
+  getTop: () => number;
 }
 
 export interface RowRndProps {
   width?: number;
   left?: number;
+  top?: number;
   grid?: number;
   start?: number;
   bounds?: { left: number; right: number };
-  edges?: {left: boolean | string, right: boolean | string};
+  edges?: { left: boolean | string; right: boolean | string };
 
   onResizeStart?: RndResizeStartCallback;
   onResize?: RndResizeCallback;
@@ -46,10 +41,11 @@ export interface RowRndProps {
   onDragStart?: RndDragStartCallback;
   onDrag?: RndDragCallback;
   onDragEnd?: RndDragEndCallback;
+  onDrop?: (rowId: string, actionId: string) => void;
   // 同时传入parentRef和deltaScrollLeft时会启动自动滚动
   parentRef?: React.MutableRefObject<HTMLDivElement>;
   deltaScrollLeft?: (delta: number) => void;
-  
+
   children?: React.ReactNode;
 
   enableResizing?: boolean;
diff --git a/src/components/timeline.tsx b/src/components/timeline.tsx
index a33361f..078811a 100644
--- a/src/components/timeline.tsx
+++ b/src/components/timeline.tsx
@@ -9,10 +9,11 @@ import { Cursor } from './cursor/cursor';
 import { EditArea } from './edit_area/edit_area';
 import './timeline.less';
 import { TimeArea } from './time_area/time_area';
+import interact from 'interactjs';
 
 export const Timeline = React.forwardRef<TimelineState, TimelineEditor>((props, ref) => {
   const checkedProps = checkProps(props);
-  const { style } = props;
+  const { style, onDrop } = props;
   let {
     effects,
     editorData: data,
@@ -27,12 +28,15 @@ export const Timeline = React.forwardRef<TimelineState, TimelineEditor>((props,
     onChange,
     autoReRender = true,
     onScroll: onScrollVertical,
+    onCollisionActive,
+    onCollisionInActive,
   } = checkedProps;
 
   const engineRef = useRef<TimelineEngine>(new TimelineEngine());
   const domRef = useRef<HTMLDivElement>();
   const areaRef = useRef<HTMLDivElement>();
   const scrollSync = useRef<ScrollSync>();
+  const editorDataRef = useRef<TimelineRow[]>(data);
 
   // 编辑器数据
   const [editorData, setEditorData] = useState(data);
@@ -49,6 +53,137 @@ export const Timeline = React.forwardRef<TimelineState, TimelineEditor>((props,
     setEditorData(data);
   }, [data, minScaleCount, scale]);
 
+  useEffect(() => {
+    editorDataRef.current = data;
+  }, [data]);
+
+  useEffect(() => {
+    interact('.timeline-editor-edit-row').dropzone({
+      accept: '.timeline-editor-action',
+      overlap: 0.4,
+      ondropactivate: function (event) {
+        // add active dropzone feedback
+        event.target.classList.add('drop-active');
+      },
+      ondragenter: function (event) {
+        let draggableElement = event.relatedTarget;
+        let dropzoneElement = event.target;
+        // feedback the possibility of a drop
+        dropzoneElement.classList.add('drop-target');
+        draggableElement.classList.add('can-drop');
+        // draggableElement.textContent = 'Dragged in';
+      },
+      ondragleave: function (event) {
+        // remove the drop feedback style
+        event.target.classList.remove('drop-target');
+        event.relatedTarget.classList.remove('can-drop');
+        // event.relatedTarget.textContent = 'Dragged out';
+      },
+      ondrop: function (event) {
+        if (event) {
+          event.stopPropagation();
+        }
+        const rowId = event.currentTarget.getAttribute('data-rowid');
+        const actionId = event.relatedTarget.getAttribute('data-actionid');
+        let droppedRowData = null;
+        let oldRowId = null;
+        let actionData = null;
+
+        editorDataRef.current.forEach((f) => {
+          const hasAction = f.actions.find((e) => e.id === actionId);
+          if (hasAction) {
+            oldRowId = f.id;
+            actionData = hasAction;
+            const { actions, ...restProps } = f;
+            droppedRowData = restProps;
+          }
+        });
+        if (oldRowId === rowId) return;
+        if (!Array.isArray(editorDataRef.current)) return null;
+
+        const modifiedEditorData = editorDataRef.current.map((er) => {
+          if (er.id === rowId) {
+            const currActions = er.actions || [];
+            const updatedActions = currActions.concat(actionData);
+            const nonNullActions = updatedActions.filter((f) => !!f);
+            return {
+              ...er,
+              actions: nonNullActions,
+            };
+          } else if (er.id === oldRowId) {
+            const updatedActions = er.actions.filter((f) => f.id !== actionData.id);
+            const nonNullActions = updatedActions.filter((f) => !!f);
+            return {
+              ...er,
+              actions: nonNullActions,
+            };
+          }
+          return er;
+        });
+        // update actions
+        setEditorData(modifiedEditorData);
+        handleEditorDataChange(modifiedEditorData);
+        if (onDrop) {
+          onDrop(rowId, actionId);
+        }
+      },
+      ondropdeactivate: function (event) {
+        event.stopPropagation();
+        // remove active dropzone feedback
+        event.target.classList.remove('drop-active');
+        event.target.classList.remove('drop-target');
+        event.relatedTarget.style.removeProperty('top');
+      },
+    });
+  }, []);
+
+  useEffect(() => {
+    interact('div[data-id="actionitem"]').dropzone({
+      accept: '.timeline-editor-action',
+      overlap: 0.01,
+      ondropactivate: function (event) {
+        // add active dropzone feedback
+        //console.log('running dropactivate collison');
+      },
+
+      ondragenter: function (event) {
+        // let draggableElement = event.relatedTarget;
+        // let dropzoneElement = event.target;
+        // // feedback the possibility of a drop
+        const targetRowId = event.currentTarget.getAttribute('data-rowid');
+        const targetActionId = event.currentTarget.getAttribute('data-actionid');
+
+        // const dragRowId = event.relatedTarget.getAttribute('data-rowid');
+        const dragActionId = event.relatedTarget.getAttribute('data-actionid');
+        if (dragActionId !== targetActionId) {
+          event.target.classList.add('collison-active');
+          if (onCollisionActive) {
+            onCollisionActive(targetRowId, targetActionId, true);
+          }
+        }
+        // dropzoneElement.classList.add('drop-target');
+        // draggableElement.classList.add('can-drop');
+        // draggableElement.textContent = 'Dragged in';
+      },
+      ondragleave: function (event) {
+        // remove the drop feedback style
+        event.target.classList.remove('collison-active');
+        if (onCollisionInActive) {
+          onCollisionInActive();
+        }
+        // event.target.classList.remove('drop-target');
+        // event.relatedTarget.classList.remove('can-drop');
+        // event.relatedTarget.textContent = 'Dragged out';
+      },
+
+      ondropdeactivate: function (event) {
+        event.stopPropagation();
+        // remove active dropzone feedback
+        event.target.classList.remove('collison-active');
+      },
+    });
+  }, []);
+
   useEffect(() => {
     engineRef.current.effects = effects;
   }, [effects]);
diff --git a/src/interface/timeline.ts b/src/interface/timeline.ts
index c56b7d8..a532f2c 100644
--- a/src/interface/timeline.ts
+++ b/src/interface/timeline.ts
@@ -188,6 +188,27 @@ export interface EditData {
    * @description cursor拖拽事件
    */
   onCursorDrag?: (time: number) => void;
+
+  /**
+   * action item dropped to new row.
+   * @param rowId row id dropped to
+   * @param actionId action item id that got dropped to a rowid
+   * @returns
+   */
+  onDrop?: (rowId, actionId) => void;
+
+  /**
+   * action item for a current collision row id and action id
+   * @param rowId row id dropped to
+   * @param actionId action item id that got dropped to a rowid
+   * @returns
+   */
+  onCollisionActive?: (rowId: string, actionId: string, isCollisionActive: boolean) => void;
+  /**
+   *
+   * @returns when inactive collision triggered
+   */
+  onCollisionInActive?: () => void;
 }
 
 export interface TimelineState {