react version update

src/components/gantt/gantt.tsx

@@ -278,15 +278,11 @@ export const Gantt: React.FunctionComponent<GanttProps> = ({
     };
 
     // subscribe if scroll is necessary
-    if (wrapperRef.current) {
-      wrapperRef.current.addEventListener("wheel", handleWheel, {
-        passive: false,
-      });
-    }
+    wrapperRef.current?.addEventListener("wheel", handleWheel, {
+      passive: false,
+    });
     return () => {
-      if (wrapperRef.current) {
-        wrapperRef.current.removeEventListener("wheel", handleWheel);
-      }
+      wrapperRef.current?.removeEventListener("wheel", handleWheel);
     };
   }, [
     wrapperRef,

src/components/other/horizontal-scroll.module.css

@@ -1,6 +1,10 @@
 .scrollWrapper {
   overflow: auto;
   max-width: 100%;
+  /*firefox*/
+  scrollbar-width: thin;
+  /*iPad*/
+  height: 1.1rem;
 }
 .scrollWrapper::-webkit-scrollbar {
   width: 1.1rem;

src/components/other/vertical-scroll.module.css

@@ -2,6 +2,8 @@
   overflow: hidden auto;
   width: 17px;
   flex-shrink: 0;
+  /*firefox*/
+  scrollbar-width: thin;
 }
 .scroll::-webkit-scrollbar {
   width: 1.1rem;

src/test/gant.test.tsx

@@ -1,11 +1,12 @@
 import React from "react";
-import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
 import { Gantt } from "../index";
 
 describe("gantt", () => {
   it("renders without crashing", () => {
     const div = document.createElement("div");
-    ReactDOM.render(
+    const root = createRoot(div);
+    root.render(
       <Gantt
         tasks={[
           {
@@ -17,9 +18,7 @@ describe("gantt", () => {
             type: "task",
           },
         ]}
-      />,
-      div
+      />
     );
-    ReactDOM.unmountComponentAtNode(div);
   });
 });