diff --git a/package-lock.json b/package-lock.json
index ce2aa29..db4895e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,16 +8,108 @@
       "name": "@rescript/react",
       "version": "0.14.0",
       "license": "MIT",
+      "dependencies": {
+        "@rescript/webapi": "^0.1.0-experimental-2090589"
+      },
       "devDependencies": {
         "react": "^19.1.0",
         "react-dom": "^19.1.0",
-        "rescript": "^11.0.0"
+        "rescript": "^12.0.0"
       },
       "peerDependencies": {
         "react": ">=19.0.0",
         "react-dom": ">=19.0.0"
       }
     },
+    "node_modules/@rescript/darwin-arm64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/darwin-arm64/-/darwin-arm64-12.0.0.tgz",
+      "integrity": "sha512-N2zNj/Uh0zrg8BJGWxdQjYTDf0d2ZV8D+Vmct8xORaUcEZvAkvZb+xA66UxP2QGhWmATcHmBth7oJ48xpWz/Vg==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=20.11.0"
+      }
+    },
+    "node_modules/@rescript/darwin-x64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/darwin-x64/-/darwin-x64-12.0.0.tgz",
+      "integrity": "sha512-Qx/ao3Fl2lx3rF8mbRsyRK5HGAx8pmzyCdpSIAaUun5wLBnsJbNqgvqUH7VeI2TwaczHvcIljrYmnB7T5LJdFQ==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=20.11.0"
+      }
+    },
+    "node_modules/@rescript/linux-arm64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/linux-arm64/-/linux-arm64-12.0.0.tgz",
+      "integrity": "sha512-H65csj/0uqqjYy235m0h5CFxbrsas6RoVfjy5Xjf91Vyg/r5R/QIGQvhMtFvl4QojYsa1wXzXGcujwXh+S15xQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.11.0"
+      }
+    },
+    "node_modules/@rescript/linux-x64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/linux-x64/-/linux-x64-12.0.0.tgz",
+      "integrity": "sha512-WizQwyfMadxF096foZYU3I4zxcnNIc9XP7TP4fqdfe0v6OvQ5yHMI/uIfOsJ1GfNALce2UxvgS0pn67uxc55uA==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.11.0"
+      }
+    },
+    "node_modules/@rescript/runtime": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/runtime/-/runtime-12.0.0.tgz",
+      "integrity": "sha512-STRbYHT5rnW61vWn2+Bdtj620XaprnoBSbPbkvOYZ+Zs8nfqtpBjhNw+JNpGQLXf73crk6MhxFGPxL2o5vb8TQ=="
+    },
+    "node_modules/@rescript/webapi": {
+      "version": "0.1.0-experimental-82a7689",
+      "resolved": "https://registry.npmjs.org/@rescript/webapi/-/webapi-0.1.0-experimental-82a7689.tgz",
+      "integrity": "sha512-9pptKyqTFS9w0BPKt3VlwpXSFrH4dFhvMncfUGgdlwq66fmrPTo57e0sdkatZp6SNdXmrdX1FYmcHDYoqzRNVg==",
+      "license": "MIT",
+      "dependencies": {
+        "rescript": "^12.0.0-alpha.5"
+      }
+    },
+    "node_modules/@rescript/win32-x64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/win32-x64/-/win32-x64-12.0.0.tgz",
+      "integrity": "sha512-kkqj4kQGbni5YglWoPm76M6hUuzKJHDEiLce5EZxW2Q4FrkS9dNRgm02c2Ck1cz/uKCS3m+ZoKQGIMMXTvo5Jw==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=20.11.0"
+      }
+    },
     "node_modules/react": {
       "version": "19.1.0",
       "resolved": "https://registry.npmjs.org/react/-/react-19.1.0.tgz",
@@ -42,18 +134,39 @@
       }
     },
     "node_modules/rescript": {
-      "version": "11.0.0",
-      "resolved": "https://registry.npmjs.org/rescript/-/rescript-11.0.0.tgz",
-      "integrity": "sha512-uIUwDZZmDUb7ymGkBiiGioxMg8hXh1mze/2k/qhYQcZGgi7PrLHQIW9AksM7gb9WnpjCAvFsA8U2VgC0nA468w==",
-      "dev": true,
-      "hasInstallScript": true,
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/rescript/-/rescript-12.0.0.tgz",
+      "integrity": "sha512-DGcZI2L5W0c6FuEnspLE0MIe1UtTt1VsW/vQfzBFCEBxSsQtoA6YRHUB8Puwnb30PHqZiFK1ADhn6UgA8LWK0A==",
+      "license": "SEE LICENSE IN LICENSE",
+      "workspaces": [
+        "packages/playground",
+        "packages/@rescript/*",
+        "tests/dependencies/**",
+        "tests/analysis_tests/**",
+        "tests/docstring_tests",
+        "tests/gentype_tests/**",
+        "tests/tools_tests",
+        "scripts/res"
+      ],
+      "dependencies": {
+        "@rescript/runtime": "12.0.0"
+      },
       "bin": {
-        "bsc": "bsc",
-        "bstracing": "lib/bstracing",
-        "rescript": "rescript"
+        "bsc": "cli/bsc.js",
+        "bstracing": "cli/bstracing.js",
+        "rescript": "cli/rescript.js",
+        "rescript-legacy": "cli/rescript-legacy.js",
+        "rescript-tools": "cli/rescript-tools.js"
       },
       "engines": {
-        "node": ">=10"
+        "node": ">=20.11.0"
+      },
+      "optionalDependencies": {
+        "@rescript/darwin-arm64": "12.0.0",
+        "@rescript/darwin-x64": "12.0.0",
+        "@rescript/linux-arm64": "12.0.0",
+        "@rescript/linux-x64": "12.0.0",
+        "@rescript/win32-x64": "12.0.0"
       }
     },
     "node_modules/scheduler": {
@@ -65,6 +178,49 @@
     }
   },
   "dependencies": {
+    "@rescript/darwin-arm64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/darwin-arm64/-/darwin-arm64-12.0.0.tgz",
+      "integrity": "sha512-N2zNj/Uh0zrg8BJGWxdQjYTDf0d2ZV8D+Vmct8xORaUcEZvAkvZb+xA66UxP2QGhWmATcHmBth7oJ48xpWz/Vg==",
+      "optional": true
+    },
+    "@rescript/darwin-x64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/darwin-x64/-/darwin-x64-12.0.0.tgz",
+      "integrity": "sha512-Qx/ao3Fl2lx3rF8mbRsyRK5HGAx8pmzyCdpSIAaUun5wLBnsJbNqgvqUH7VeI2TwaczHvcIljrYmnB7T5LJdFQ==",
+      "optional": true
+    },
+    "@rescript/linux-arm64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/linux-arm64/-/linux-arm64-12.0.0.tgz",
+      "integrity": "sha512-H65csj/0uqqjYy235m0h5CFxbrsas6RoVfjy5Xjf91Vyg/r5R/QIGQvhMtFvl4QojYsa1wXzXGcujwXh+S15xQ==",
+      "optional": true
+    },
+    "@rescript/linux-x64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/linux-x64/-/linux-x64-12.0.0.tgz",
+      "integrity": "sha512-WizQwyfMadxF096foZYU3I4zxcnNIc9XP7TP4fqdfe0v6OvQ5yHMI/uIfOsJ1GfNALce2UxvgS0pn67uxc55uA==",
+      "optional": true
+    },
+    "@rescript/runtime": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/runtime/-/runtime-12.0.0.tgz",
+      "integrity": "sha512-STRbYHT5rnW61vWn2+Bdtj620XaprnoBSbPbkvOYZ+Zs8nfqtpBjhNw+JNpGQLXf73crk6MhxFGPxL2o5vb8TQ=="
+    },
+    "@rescript/webapi": {
+      "version": "0.1.0-experimental-82a7689",
+      "resolved": "https://registry.npmjs.org/@rescript/webapi/-/webapi-0.1.0-experimental-82a7689.tgz",
+      "integrity": "sha512-9pptKyqTFS9w0BPKt3VlwpXSFrH4dFhvMncfUGgdlwq66fmrPTo57e0sdkatZp6SNdXmrdX1FYmcHDYoqzRNVg==",
+      "requires": {
+        "rescript": "^12.0.0-alpha.5"
+      }
+    },
+    "@rescript/win32-x64": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@rescript/win32-x64/-/win32-x64-12.0.0.tgz",
+      "integrity": "sha512-kkqj4kQGbni5YglWoPm76M6hUuzKJHDEiLce5EZxW2Q4FrkS9dNRgm02c2Ck1cz/uKCS3m+ZoKQGIMMXTvo5Jw==",
+      "optional": true
+    },
     "react": {
       "version": "19.1.0",
       "resolved": "https://registry.npmjs.org/react/-/react-19.1.0.tgz",
@@ -81,10 +237,17 @@
       }
     },
     "rescript": {
-      "version": "11.0.0",
-      "resolved": "https://registry.npmjs.org/rescript/-/rescript-11.0.0.tgz",
-      "integrity": "sha512-uIUwDZZmDUb7ymGkBiiGioxMg8hXh1mze/2k/qhYQcZGgi7PrLHQIW9AksM7gb9WnpjCAvFsA8U2VgC0nA468w==",
-      "dev": true
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/rescript/-/rescript-12.0.0.tgz",
+      "integrity": "sha512-DGcZI2L5W0c6FuEnspLE0MIe1UtTt1VsW/vQfzBFCEBxSsQtoA6YRHUB8Puwnb30PHqZiFK1ADhn6UgA8LWK0A==",
+      "requires": {
+        "@rescript/darwin-arm64": "12.0.0",
+        "@rescript/darwin-x64": "12.0.0",
+        "@rescript/linux-arm64": "12.0.0",
+        "@rescript/linux-x64": "12.0.0",
+        "@rescript/runtime": "12.0.0",
+        "@rescript/win32-x64": "12.0.0"
+      }
     },
     "scheduler": {
       "version": "0.26.0",
diff --git a/package.json b/package.json
index 11c8dda..7ff1302 100644
--- a/package.json
+++ b/package.json
@@ -30,10 +30,13 @@
   "devDependencies": {
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
-    "rescript": "^11.0.0"
+    "rescript": "^12.0.0"
   },
   "peerDependencies": {
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0"
+  },
+  "dependencies": {
+    "@rescript/webapi": "^0.1.0-experimental-2090589"
   }
-}
+}
\ No newline at end of file
diff --git a/rescript.json b/rescript.json
index 599e1f6..19f0f80 100644
--- a/rescript.json
+++ b/rescript.json
@@ -5,8 +5,11 @@
     "mode": "classic"
   },
   "sources": [{ "dir": "src", "subdirs": true }],
-  "package-specs": [{ "module": "commonjs", "in-source": true }],
+  "package-specs": [{ "module": "esmodule", "in-source": true }],
   "suffix": ".bs.js",
+  "bs-dependencies": [
+    "@rescript/webapi"
+  ],
   "bs-dev-dependencies": [],
   "bsc-flags": []
 }
diff --git a/src/React.bs.js b/src/React.bs.js
index ef827dd..1d52802 100644
--- a/src/React.bs.js
+++ b/src/React.bs.js
@@ -1,33 +1,32 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
-'use strict';
 
-var React = require("react");
+import * as React from "react";
 
-var Children = {};
+let Children = {};
 
-var Context = {};
+let Context = {};
 
-var Fragment = {};
+let Fragment = {};
 
-var StrictMode = {};
+let StrictMode = {};
 
-var Suspense = {};
+let Suspense = {};
 
 function lazy_(load) {
-  return React.lazy(async function () {
-              return {
-                      default: await load()
-                    };
-            });
+  return React.lazy(async () => ({
+    default: await load()
+  }));
 }
 
-var Uncurried = {};
+let Uncurried = {};
 
-exports.Children = Children;
-exports.Context = Context;
-exports.Fragment = Fragment;
-exports.StrictMode = StrictMode;
-exports.Suspense = Suspense;
-exports.lazy_ = lazy_;
-exports.Uncurried = Uncurried;
+export {
+  Children,
+  Context,
+  Fragment,
+  StrictMode,
+  Suspense,
+  lazy_,
+  Uncurried,
+}
 /* react Not a pure module */
diff --git a/src/ReactDOM.bs.js b/src/ReactDOM.bs.js
index fa51640..766ec05 100644
--- a/src/ReactDOM.bs.js
+++ b/src/ReactDOM.bs.js
@@ -1,58 +1,57 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
-'use strict';
 
-var Caml_option = require("rescript/lib/js/caml_option.js");
+import * as Primitive_option from "@rescript/runtime/lib/es6/Primitive_option.js";
 
-var Root = {};
+let Root = {};
 
-var Client = {
+let Client = {
   Root: Root
 };
 
 function getString(formData, name) {
-  var value = formData.get(name);
+  let value = formData.get(name);
   if (!(value == null) && typeof value === "string") {
-    return Caml_option.some(value);
+    return Primitive_option.some(value);
   }
-  
 }
 
 function getFile(formData, name) {
-  var value = formData.get(name);
+  let value = formData.get(name);
   if (!(value == null) && typeof value !== "string") {
-    return Caml_option.some(value);
+    return Primitive_option.some(value);
   }
-  
 }
 
 function getAll(t, string) {
-  return t.getAll(string).map(function (value) {
-              if (typeof value === "string") {
-                return {
-                        TAG: "String",
-                        _0: value
-                      };
-              } else {
-                return {
-                        TAG: "File",
-                        _0: value
-                      };
-              }
-            });
+  return t.getAll(string).map(value => {
+    if (typeof value === "string") {
+      return {
+        TAG: "String",
+        _0: value
+      };
+    } else {
+      return {
+        TAG: "File",
+        _0: value
+      };
+    }
+  });
 }
 
-var $$FormData = {
+let FormData = {
   getString: getString,
   getFile: getFile,
   getAll: getAll
 };
 
-var Ref = {};
+let Ref = {};
 
-var Style;
+let Style;
 
-exports.Client = Client;
-exports.$$FormData = $$FormData;
-exports.Ref = Ref;
-exports.Style = Style;
+export {
+  Client,
+  FormData,
+  Ref,
+  Style,
+}
 /* No side effect */
diff --git a/src/ReactDOM.res b/src/ReactDOM.res
index fbd564b..af425f7 100644
--- a/src/ReactDOM.res
+++ b/src/ReactDOM.res
@@ -6,8 +6,11 @@
  calls and add the appropriate `require("react-dom")` in the file calling this `render` */
 
 // Helper so that ReactDOM itself doesn't bring any runtime
+
+open WebAPI
+
 @val @return(nullable)
-external querySelector: string => option<Dom.element> = "document.querySelector"
+external querySelector: string => option<DOMAPI.element> = "document.querySelector"
 
 module Client = {
   module Root = {
@@ -19,10 +22,10 @@ module Client = {
   }
 
   @module("react-dom/client")
-  external createRoot: Dom.element => Root.t = "createRoot"
+  external createRoot: DOMAPI.element => Root.t = "createRoot"
 
   @module("react-dom/client")
-  external hydrateRoot: (Dom.element, React.element) => Root.t = "hydrateRoot"
+  external hydrateRoot: (DOMAPI.element, React.element) => Root.t = "hydrateRoot"
 }
 
 // Very rudimentary form data bindings
@@ -72,9 +75,9 @@ module FormData = {
 }
 
 @module("react-dom")
-external createPortal: (React.element, Dom.element) => React.element = "createPortal"
+external createPortal: (React.element, DOMAPI.element) => React.element = "createPortal"
 
-external domElementToObj: Dom.element => {..} = "%identity"
+external domElementToObj: DOMAPI.element => {..} = "%identity"
 
 type style = ReactDOMStyle.t
 
@@ -82,8 +85,8 @@ type domRef = JsxDOM.domRef
 
 module Ref = {
   type t = domRef
-  type currentDomRef = React.ref<Js.nullable<Dom.element>>
-  type callbackDomRef = Js.nullable<Dom.element> => option<unit => unit>
+  type currentDomRef = React.ref<Js.nullable<DOMAPI.element>>
+  type callbackDomRef = Js.nullable<DOMAPI.element> => option<unit => unit>
 
   external domRef: currentDomRef => domRef = "%identity"
   external callbackDomRef: callbackDomRef => domRef = "%identity"
diff --git a/src/ReactDOMStyle.bs.js b/src/ReactDOMStyle.bs.js
index 18702c8..f7f5e14 100644
--- a/src/ReactDOMStyle.bs.js
+++ b/src/ReactDOMStyle.bs.js
@@ -1,12 +1,13 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
-'use strict';
 
 
 function unsafeAddProp(style, key, value) {
-  var dict = {};
+  let dict = {};
   dict[key] = value;
   return Object.assign({}, style, dict);
 }
 
-exports.unsafeAddProp = unsafeAddProp;
+export {
+  unsafeAddProp,
+}
 /* No side effect */
diff --git a/src/ReactEvent.bs.js b/src/ReactEvent.bs.js
index 179cde2..5303ddd 100644
--- a/src/ReactEvent.bs.js
+++ b/src/ReactEvent.bs.js
@@ -1,53 +1,54 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
-'use strict';
 
 
-var Synthetic = {};
+let Synthetic = {};
 
-var Clipboard = {};
+let Clipboard = {};
 
-var Composition = {};
+let Composition = {};
 
-var Keyboard = {};
+let Keyboard = {};
 
-var Focus = {};
+let Focus = {};
 
-var Form = {};
+let Form = {};
 
-var Mouse = {};
+let Mouse = {};
 
-var Pointer = {};
+let Pointer = {};
 
-var $$Selection = {};
+let Selection = {};
 
-var $$Touch = {};
+let Touch = {};
 
-var UI = {};
+let UI = {};
 
-var Wheel = {};
+let Wheel = {};
 
-var Media = {};
+let Media = {};
 
-var $$Image = {};
+let Image = {};
 
-var $$Animation = {};
+let Animation = {};
 
-var Transition = {};
+let Transition = {};
 
-exports.Synthetic = Synthetic;
-exports.Clipboard = Clipboard;
-exports.Composition = Composition;
-exports.Keyboard = Keyboard;
-exports.Focus = Focus;
-exports.Form = Form;
-exports.Mouse = Mouse;
-exports.Pointer = Pointer;
-exports.$$Selection = $$Selection;
-exports.$$Touch = $$Touch;
-exports.UI = UI;
-exports.Wheel = Wheel;
-exports.Media = Media;
-exports.$$Image = $$Image;
-exports.$$Animation = $$Animation;
-exports.Transition = Transition;
+export {
+  Synthetic,
+  Clipboard,
+  Composition,
+  Keyboard,
+  Focus,
+  Form,
+  Mouse,
+  Pointer,
+  Selection,
+  Touch,
+  UI,
+  Wheel,
+  Media,
+  Image,
+  Animation,
+  Transition,
+}
 /* No side effect */
diff --git a/src/ReactEvent.res b/src/ReactEvent.res
index 2d927a1..1ee6efb 100644
--- a/src/ReactEvent.res
+++ b/src/ReactEvent.res
@@ -5,40 +5,43 @@ module MakeEventWithType = (
     type t
   },
 ) => {
+  open WebAPI
+
   @get external bubbles: Type.t => bool = "bubbles"
   @get external cancelable: Type.t => bool = "cancelable"
   @get
-  external currentTarget: Type.t => {..} = "currentTarget" /* Should return Dom.eventTarget */
+  external currentTarget: Type.t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: Type.t => bool = "defaultPrevented"
   @get external eventPhase: Type.t => int = "eventPhase"
   @get external isTrusted: Type.t => bool = "isTrusted"
-  @get external nativeEvent: Type.t => {..} = "nativeEvent" /* Should return Dom.event */
+  @get external nativeEvent: Type.t => EventAPI.event = "nativeEvent"
   @send external preventDefault: Type.t => unit = "preventDefault"
   @send
   external isDefaultPrevented: Type.t => bool = "isDefaultPrevented"
   @send external stopPropagation: Type.t => unit = "stopPropagation"
   @send
   external isPropagationStopped: Type.t => bool = "isPropagationStopped"
-  @get external target: Type.t => {..} = "target" /* Should return Dom.eventTarget */
+  @get external target: Type.t => DOMAPI.node = "target"
   @get external timeStamp: Type.t => float = "timeStamp"
   @get external type_: Type.t => string = "type"
   @send external persist: Type.t => unit = "persist"
 }
 
+open WebAPI
+
 module Synthetic = {
   type tag = JsxEvent.Synthetic.tag
   type t = synthetic<tag>
   @get external bubbles: synthetic<'a> => bool = "bubbles"
   @get external cancelable: synthetic<'a> => bool = "cancelable"
   @get
-  external currentTarget: synthetic<'a> => {..} =
-    "currentTarget" /* Should return Dom.eventTarget */
+  external currentTarget: synthetic<'a> => DOMAPI.node = "currentTarget"
   @get
   external defaultPrevented: synthetic<'a> => bool = "defaultPrevented"
   @get external eventPhase: synthetic<'a> => int = "eventPhase"
   @get external isTrusted: synthetic<'a> => bool = "isTrusted"
   @get
-  external nativeEvent: synthetic<'a> => {..} = "nativeEvent" /* Should return Dom.event */
+  external nativeEvent: synthetic<'a> => EventAPI.event = "nativeEvent"
   @send
   external preventDefault: synthetic<'a> => unit = "preventDefault"
   @send
@@ -47,7 +50,7 @@ module Synthetic = {
   external stopPropagation: synthetic<'a> => unit = "stopPropagation"
   @send
   external isPropagationStopped: synthetic<'a> => bool = "isPropagationStopped"
-  @get external target: synthetic<'a> => {..} = "target" /* Should return Dom.eventTarget */
+  @get external target: synthetic<'a> => DOMAPI.node = "target"
   @get external timeStamp: synthetic<'a> => float = "timeStamp"
   @get external type_: synthetic<'a> => string = "type"
   @send external persist: synthetic<'a> => unit = "persist"
@@ -62,7 +65,7 @@ module Clipboard = {
   include MakeEventWithType({
     type t = t
   })
-  @get external clipboardData: t => {..} = "clipboardData" /* Should return Dom.dataTransfer */
+  @get external clipboardData: t => WebAPI.UIEventsAPI.dataTransfer = "clipboardData"
 }
 
 module Composition = {
@@ -103,7 +106,7 @@ module Focus = {
     type t = t
   })
   @get @return(nullable)
-  external relatedTarget: t => option<{..}> = "relatedTarget" /* Should return Dom.eventTarget */
+  external relatedTarget: t => option<EventAPI.eventTarget> = "relatedTarget"
 }
 
 module Form = {
@@ -134,7 +137,7 @@ module Mouse = {
   @get external pageX: t => int = "pageX"
   @get external pageY: t => int = "pageY"
   @get @return(nullable)
-  external relatedTarget: t => option<{..}> = "relatedTarget" /* Should return Dom.eventTarget */
+  external relatedTarget: t => option<EventAPI.eventTarget> = "relatedTarget"
   @get external screenX: t => int = "screenX"
   @get external screenY: t => int = "screenY"
   @get external shiftKey: t => bool = "shiftKey"
@@ -149,7 +152,7 @@ module Pointer = {
 
   // UIEvent
   @get external detail: t => int = "detail"
-  @get external view: t => Dom.window = "view" /* Should return DOMAbstractView/WindowProxy */
+  @get external view: t => DOMAPI.window = "view"
 
   // MouseEvent
   @get external screenX: t => int = "screenX"
@@ -172,7 +175,7 @@ module Pointer = {
   @get external buttons: t => int = "buttons"
 
   @get @return(nullable)
-  external relatedTarget: t => option<{..}> = "relatedTarget" /* Should return Dom.eventTarget */
+  external relatedTarget: t => option<EventAPI.eventTarget> = "relatedTarget"
 
   // PointerEvent
   @get external pointerId: t => Dom.eventPointerId = "pointerId"
@@ -202,14 +205,14 @@ module Touch = {
     type t = t
   })
   @get external altKey: t => bool = "altKey"
-  @get external changedTouches: t => {..} = "changedTouches" /* Should return Dom.touchList */
+  @get external changedTouches: t => UIEventsAPI.touchList = "changedTouches"
   @get external ctrlKey: t => bool = "ctrlKey"
   @send
   external getModifierState: (t, string) => bool = "getModifierState"
   @get external metaKey: t => bool = "metaKey"
   @get external shiftKey: t => bool = "shiftKey"
-  @get external targetTouches: t => {..} = "targetTouches" /* Should return Dom.touchList */
-  @get external touches: t => {..} = "touches" /* Should return Dom.touchList */
+  @get external targetTouches: t => UIEventsAPI.touchList = "targetTouches"
+  @get external touches: t => UIEventsAPI.touchList = "touches"
 }
 
 module UI = {
@@ -219,7 +222,7 @@ module UI = {
     type t = t
   })
   @get external detail: t => int = "detail"
-  @get external view: t => Dom.window = "view" /* Should return DOMAbstractView/WindowProxy */
+  @get external view: t => DOMAPI.window = "view"
 }
 
 module Wheel = {
diff --git a/src/ReactEvent.resi b/src/ReactEvent.resi
index 61b5d4b..eb9132c 100644
--- a/src/ReactEvent.resi
+++ b/src/ReactEvent.resi
@@ -38,19 +38,21 @@
  */
 type synthetic<'a> = JsxEvent.synthetic<'a>
 
+open WebAPI
+
 module Synthetic: {
   type tag = JsxEvent.Synthetic.tag
   type t = synthetic<tag>
   @get external bubbles: synthetic<'a> => bool = "bubbles"
   @get external cancelable: synthetic<'a> => bool = "cancelable"
   @get
-  external currentTarget: synthetic<'a> => {..} = "currentTarget"
+  external currentTarget: synthetic<'a> => DOMAPI.node = "currentTarget"
   @get
   external defaultPrevented: synthetic<'a> => bool = "defaultPrevented"
   @get external eventPhase: synthetic<'a> => int = "eventPhase"
   @get external isTrusted: synthetic<'a> => bool = "isTrusted"
   @get
-  external nativeEvent: synthetic<'a> => {..} = "nativeEvent"
+  external nativeEvent: synthetic<'a> => EventAPI.event = "nativeEvent"
   @send
   external preventDefault: synthetic<'a> => unit = "preventDefault"
   @send
@@ -59,7 +61,7 @@ module Synthetic: {
   external stopPropagation: synthetic<'a> => unit = "stopPropagation"
   @send
   external isPropagationStopped: synthetic<'a> => bool = "isPropagationStopped"
-  @get external target: synthetic<'a> => {..} = "target"
+  @get external target: synthetic<'a> => DOMAPI.node = "target"
   @get external timeStamp: synthetic<'a> => float = "timeStamp"
   @get external type_: synthetic<'a> => string = "type"
   @send external persist: synthetic<'a> => unit = "persist"
@@ -73,20 +75,20 @@ module Clipboard: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
-  @get external clipboardData: t => {..} = "clipboardData" /* Should return Dom.dataTransfer */
+  @get external clipboardData: t => WebAPI.UIEventsAPI.dataTransfer = "clipboardData"
 }
 
 module Composition: {
@@ -94,16 +96,16 @@ module Composition: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -115,16 +117,16 @@ module Keyboard: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -149,21 +151,21 @@ module Focus: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
   @get @return(nullable)
-  external relatedTarget: t => option<{..}> = "relatedTarget" /* Should return Dom.eventTarget */
+  external relatedTarget: t => option<EventAPI.eventTarget> = "relatedTarget"
 }
 
 module Form: {
@@ -171,16 +173,16 @@ module Form: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -191,16 +193,16 @@ module Mouse: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -218,7 +220,7 @@ module Mouse: {
   @get external pageX: t => int = "pageX"
   @get external pageY: t => int = "pageY"
   @get @return(nullable)
-  external relatedTarget: t => option<{..}> = "relatedTarget" /* Should return Dom.eventTarget */
+  external relatedTarget: t => option<EventAPI.eventTarget> = "relatedTarget"
   @get external screenX: t => int = "screenX"
   @get external screenY: t => int = "screenY"
   @get external shiftKey: t => bool = "shiftKey"
@@ -230,8 +232,8 @@ module Pointer: {
 
   // Event
   @get external type_: t => string = "type"
-  @get external target: t => {..} = "target"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external target: t => DOMAPI.node = "target"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
 
   @get external eventPhase: t => int = "eventPhase"
 
@@ -245,14 +247,14 @@ module Pointer: {
   @get external timeStamp: t => float = "timeStamp"
 
   // SyntheticEvent
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
   @send external persist: t => unit = "persist"
 
   // UIEvent
   @get external detail: t => int = "detail"
-  @get external view: t => Dom.window = "view" /* Should return DOMAbstractView/WindowProxy */
+  @get external view: t => DOMAPI.window = "view"
 
   // MouseEvent
   @get external screenX: t => int = "screenX"
@@ -275,7 +277,7 @@ module Pointer: {
   @get external buttons: t => int = "buttons"
 
   @get @return(nullable)
-  external relatedTarget: t => option<{..}> = "relatedTarget" /* Should return Dom.eventTarget */
+  external relatedTarget: t => option<EventAPI.eventTarget> = "relatedTarget"
 
   // PointerEvent
   @get external pointerId: t => Dom.eventPointerId = "pointerId"
@@ -295,16 +297,16 @@ module Selection: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -315,28 +317,28 @@ module Touch: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
   @get external altKey: t => bool = "altKey"
-  @get external changedTouches: t => {..} = "changedTouches" /* Should return Dom.touchList */
+  @get external changedTouches: t => UIEventsAPI.touchList = "changedTouches"
   @get external ctrlKey: t => bool = "ctrlKey"
   @send
   external getModifierState: (t, string) => bool = "getModifierState"
   @get external metaKey: t => bool = "metaKey"
   @get external shiftKey: t => bool = "shiftKey"
-  @get external targetTouches: t => {..} = "targetTouches" /* Should return Dom.touchList */
-  @get external touches: t => {..} = "touches" /* Should return Dom.touchList */
+  @get external targetTouches: t => UIEventsAPI.touchList = "targetTouches"
+  @get external touches: t => UIEventsAPI.touchList = "touches"
 }
 
 module UI: {
@@ -344,21 +346,21 @@ module UI: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
   @get external detail: t => int = "detail"
-  @get external view: t => Dom.window = "view" /* Should return DOMAbstractView/WindowProxy */
+  @get external view: t => DOMAPI.window = "view"
 }
 
 module Wheel: {
@@ -366,16 +368,16 @@ module Wheel: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -390,16 +392,16 @@ module Media: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -410,16 +412,16 @@ module Image: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -430,16 +432,16 @@ module Animation: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
@@ -453,16 +455,16 @@ module Transition: {
   type t = synthetic<tag>
   @get external bubbles: t => bool = "bubbles"
   @get external cancelable: t => bool = "cancelable"
-  @get external currentTarget: t => {..} = "currentTarget"
+  @get external currentTarget: t => DOMAPI.node = "currentTarget"
   @get external defaultPrevented: t => bool = "defaultPrevented"
   @get external eventPhase: t => int = "eventPhase"
   @get external isTrusted: t => bool = "isTrusted"
-  @get external nativeEvent: t => {..} = "nativeEvent"
+  @get external nativeEvent: t => EventAPI.event = "nativeEvent"
   @send external preventDefault: t => unit = "preventDefault"
   @send external isDefaultPrevented: t => bool = "isDefaultPrevented"
   @send external stopPropagation: t => unit = "stopPropagation"
   @send external isPropagationStopped: t => bool = "isPropagationStopped"
-  @get external target: t => {..} = "target"
+  @get external target: t => DOMAPI.node = "target"
   @get external timeStamp: t => float = "timeStamp"
   @get external type_: t => string = "type"
   @send external persist: t => unit = "persist"
diff --git a/src/ReactTestUtils.bs.js b/src/ReactTestUtils.bs.js
index 7ddadac..2166cce 100644
--- a/src/ReactTestUtils.bs.js
+++ b/src/ReactTestUtils.bs.js
@@ -1,41 +1,38 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
-'use strict';
 
-var Caml_option = require("rescript/lib/js/caml_option.js");
-var TestUtils = require("react-dom/test-utils");
+import * as Primitive_option from "@rescript/runtime/lib/es6/Primitive_option.js";
+import * as TestUtils from "react-dom/test-utils";
 
 function act(func) {
-  var reactFunc = function () {
+  let reactFunc = () => {
     func();
   };
   TestUtils.act(reactFunc);
 }
 
 function actAsync(func) {
-  return TestUtils.act(function () {
-              return func();
-            });
+  return TestUtils.act(() => func());
 }
 
 function changeWithValue(element, value) {
-  var $$event = {
+  let event = {
     target: {
       value: value
     }
   };
-  TestUtils.Simulate.change(element, $$event);
+  TestUtils.Simulate.change(element, event);
 }
 
 function changeWithChecked(element, value) {
-  var $$event = {
+  let event = {
     target: {
       checked: value
     }
   };
-  TestUtils.Simulate.change(element, $$event);
+  TestUtils.Simulate.change(element, event);
 }
 
-var Simulate = {
+let Simulate = {
   changeWithValue: changeWithValue,
   changeWithChecked: changeWithChecked
 };
@@ -49,18 +46,14 @@ function findByAllSelector(element, selector) {
 }
 
 function findBySelectorAndTextContent(element, selector, content) {
-  return Caml_option.undefined_to_opt(Array.from(element.querySelectorAll(selector)).find(function (node) {
-                  return node.textContent === content;
-                }));
+  return Array.from(element.querySelectorAll(selector)).find(node => node.textContent === content);
 }
 
 function findBySelectorAndPartialTextContent(element, selector, content) {
-  return Caml_option.undefined_to_opt(Array.from(element.querySelectorAll(selector)).find(function (node) {
-                  return node.textContent.includes(content);
-                }));
+  return Array.from(element.querySelectorAll(selector)).find(node => node.textContent.includes(content));
 }
 
-var DOM = {
+let DOM = {
   findBySelector: findBySelector,
   findByAllSelector: findByAllSelector,
   findBySelectorAndTextContent: findBySelectorAndTextContent,
@@ -68,38 +61,40 @@ var DOM = {
 };
 
 function prepareContainer(container, param) {
-  var containerElement = document.createElement("div");
-  var body = document.body;
+  let containerElement = document.createElement("div");
+  let body = document.body;
   if (body !== undefined) {
-    Caml_option.valFromOption(body).appendChild(containerElement);
+    Primitive_option.valFromOption(body).appendChild(containerElement);
   }
-  container.contents = Caml_option.some(containerElement);
+  container.contents = Primitive_option.some(containerElement);
 }
 
 function cleanupContainer(container, param) {
-  var contents = container.contents;
+  let contents = container.contents;
   if (contents !== undefined) {
-    Caml_option.valFromOption(contents).remove();
+    Primitive_option.valFromOption(contents).remove();
   }
   container.contents = undefined;
 }
 
 function getContainer(container) {
-  var contents = container.contents;
+  let contents = container.contents;
   if (contents !== undefined) {
-    return Caml_option.valFromOption(contents);
+    return Primitive_option.valFromOption(contents);
   }
   throw {
-        RE_EXN_ID: "Not_found",
-        Error: new Error()
-      };
+    RE_EXN_ID: "Not_found",
+    Error: new Error()
+  };
 }
 
-exports.act = act;
-exports.actAsync = actAsync;
-exports.Simulate = Simulate;
-exports.DOM = DOM;
-exports.prepareContainer = prepareContainer;
-exports.cleanupContainer = cleanupContainer;
-exports.getContainer = getContainer;
+export {
+  act,
+  actAsync,
+  Simulate,
+  DOM,
+  prepareContainer,
+  cleanupContainer,
+  getContainer,
+}
 /* react-dom/test-utils Not a pure module */
diff --git a/src/RescriptReactErrorBoundary.bs.js b/src/RescriptReactErrorBoundary.bs.js
index fe5f73e..a491d09 100644
--- a/src/RescriptReactErrorBoundary.bs.js
+++ b/src/RescriptReactErrorBoundary.bs.js
@@ -1,11 +1,10 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
-'use strict';
 
-var React = require("react");
+import * as React from "react";
 
-var noOp = (function (_x) {});
+let noOp = (function (_x) {});
 
-var reactComponentClass = React.Component;
+let reactComponentClass = React.Component;
 
 noOp(reactComponentClass);
 
@@ -27,7 +26,9 @@ var ErrorBoundary = (function (Component) {
 })(reactComponentClass);
 ;
 
-var make = ErrorBoundary;
+let make = ErrorBoundary;
 
-exports.make = make;
+export {
+  make,
+}
 /* reactComponentClass Not a pure module */
diff --git a/src/RescriptReactRouter.bs.js b/src/RescriptReactRouter.bs.js
index eb542b6..3bee765 100644
--- a/src/RescriptReactRouter.bs.js
+++ b/src/RescriptReactRouter.bs.js
@@ -1,37 +1,34 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
-'use strict';
 
-var React = require("react");
-var Caml_option = require("rescript/lib/js/caml_option.js");
+import * as React from "react";
+import * as Primitive_option from "@rescript/runtime/lib/es6/Primitive_option.js";
 
 function safeMakeEvent(eventName) {
   if (typeof Event === "function") {
     return new Event(eventName);
   }
-  var $$event = document.createEvent("Event");
-  $$event.initEvent(eventName, true, true);
-  return $$event;
+  let event = document.createEvent("Event");
+  event.initEvent(eventName, true, true);
+  return event;
 }
 
 function pathParse(str) {
   switch (str) {
     case "" :
     case "/" :
-        return /* [] */0;
+      return /* [] */0;
     default:
-      var raw = str.slice(1);
-      var match = raw[raw.length - 1 | 0];
-      var raw$1 = match === "/" ? raw.slice(0, -1) : raw;
-      var match$1 = raw$1.split("?", 2);
-      var raw$2 = match$1.length !== 2 ? raw$1 : match$1[0];
-      var a = raw$2.split("/").filter(function (item) {
-            return item.length !== 0;
-          });
-      var _i = a.length - 1 | 0;
-      var _res = /* [] */0;
-      while(true) {
-        var res = _res;
-        var i = _i;
+      let raw = str.slice(1);
+      let match = raw[raw.length - 1 | 0];
+      let raw$1 = match === "/" ? raw.slice(0, -1) : raw;
+      let match$1 = raw$1.split("?", 2);
+      let raw$2 = match$1.length !== 2 ? raw$1 : match$1[0];
+      let a = raw$2.split("/").filter(item => item.length !== 0);
+      let _i = a.length - 1 | 0;
+      let _res = /* [] */0;
+      while (true) {
+        let res = _res;
+        let i = _i;
         if (i < 0) {
           return res;
         }
@@ -40,32 +37,32 @@ function pathParse(str) {
           tl: res
         };
         _i = i - 1 | 0;
-        continue ;
+        continue;
       };
   }
 }
 
 function path(serverUrlString, param) {
-  var match = globalThis.window;
+  let match = globalThis.window;
   if (serverUrlString !== undefined) {
     return pathParse(serverUrlString);
   } else if (match !== undefined) {
-    return pathParse(Caml_option.valFromOption(match).location.pathname);
+    return pathParse(Primitive_option.valFromOption(match).location.pathname);
   } else {
     return /* [] */0;
   }
 }
 
 function hash() {
-  var $$window = globalThis.window;
-  if ($$window === undefined) {
+  let window = globalThis.window;
+  if (window === undefined) {
     return "";
   }
-  var raw = Caml_option.valFromOption($$window).location.hash;
+  let raw = Primitive_option.valFromOption(window).location.hash;
   switch (raw) {
     case "" :
     case "#" :
-        return "";
+      return "";
     default:
       return raw.slice(1);
   }
@@ -75,9 +72,9 @@ function searchParse(str) {
   switch (str) {
     case "" :
     case "?" :
-        return "";
+      return "";
     default:
-      var match = str.split("?", 2);
+      let match = str.split("?", 2);
       if (match.length !== 2) {
         return "";
       } else {
@@ -87,55 +84,49 @@ function searchParse(str) {
 }
 
 function search(serverUrlString, param) {
-  var match = globalThis.window;
+  let match = globalThis.window;
   if (serverUrlString !== undefined) {
     return searchParse(serverUrlString);
   } else if (match !== undefined) {
-    return searchParse(Caml_option.valFromOption(match).location.search);
+    return searchParse(Primitive_option.valFromOption(match).location.search);
   } else {
     return "";
   }
 }
 
 function push(path) {
-  var match = globalThis.history;
-  var match$1 = globalThis.window;
+  let match = globalThis.history;
+  let match$1 = globalThis.window;
   if (match !== undefined && match$1 !== undefined) {
-    Caml_option.valFromOption(match).pushState(null, "", path);
-    Caml_option.valFromOption(match$1).dispatchEvent(safeMakeEvent("popstate"));
-    return ;
+    Primitive_option.valFromOption(match).pushState(null, "", path);
+    Primitive_option.valFromOption(match$1).dispatchEvent(safeMakeEvent("popstate"));
+    return;
   }
-  
 }
 
 function replace(path) {
-  var match = globalThis.history;
-  var match$1 = globalThis.window;
+  let match = globalThis.history;
+  let match$1 = globalThis.window;
   if (match !== undefined && match$1 !== undefined) {
-    Caml_option.valFromOption(match).replaceState(null, "", path);
-    Caml_option.valFromOption(match$1).dispatchEvent(safeMakeEvent("popstate"));
-    return ;
+    Primitive_option.valFromOption(match).replaceState(null, "", path);
+    Primitive_option.valFromOption(match$1).dispatchEvent(safeMakeEvent("popstate"));
+    return;
   }
-  
 }
 
 function urlNotEqual(a, b) {
   if (a.hash !== b.hash || a.search !== b.search) {
     return true;
   } else {
-    var _aList = a.path;
-    var _bList = b.path;
-    while(true) {
-      var bList = _bList;
-      var aList = _aList;
-      if (!aList) {
-        if (bList) {
-          return true;
-        } else {
-          return false;
-        }
+    let _aList = a.path;
+    let _bList = b.path;
+    while (true) {
+      let bList = _bList;
+      let aList = _aList;
+      if (aList === 0) {
+        return bList !== 0;
       }
-      if (!bList) {
+      if (bList === 0) {
         return true;
       }
       if (aList.hd !== bList.hd) {
@@ -143,77 +134,66 @@ function urlNotEqual(a, b) {
       }
       _bList = bList.tl;
       _aList = aList.tl;
-      continue ;
+      continue;
     };
   }
 }
 
 function url(serverUrlString, param) {
   return {
-          path: path(serverUrlString, undefined),
-          hash: hash(),
-          search: search(serverUrlString, undefined)
-        };
+    path: path(serverUrlString, undefined),
+    hash: hash(),
+    search: search(serverUrlString, undefined)
+  };
 }
 
 function watchUrl(callback) {
-  var $$window = globalThis.window;
-  if ($$window === undefined) {
-    return function () {
-      
-    };
+  let window = globalThis.window;
+  if (window === undefined) {
+    return () => {};
   }
-  var watcherID = function () {
-    callback(url(undefined, undefined));
-  };
-  Caml_option.valFromOption($$window).addEventListener("popstate", watcherID);
+  let watcherID = () => callback(url(undefined, undefined));
+  Primitive_option.valFromOption(window).addEventListener("popstate", watcherID);
   return watcherID;
 }
 
 function unwatchUrl(watcherID) {
-  var $$window = globalThis.window;
-  if ($$window !== undefined) {
-    Caml_option.valFromOption($$window).removeEventListener("popstate", watcherID);
-    return ;
+  let window = globalThis.window;
+  if (window !== undefined) {
+    Primitive_option.valFromOption(window).removeEventListener("popstate", watcherID);
+    return;
   }
-  
 }
 
 function useUrl(serverUrl, param) {
-  var match = React.useState(function () {
-        if (serverUrl !== undefined) {
-          return serverUrl;
-        } else {
-          return url(undefined, undefined);
-        }
-      });
-  var setUrl = match[1];
-  var url$1 = match[0];
-  React.useEffect((function () {
-          var watcherId = watchUrl(function (url) {
-                setUrl(function (param) {
-                      return url;
-                    });
-              });
-          var newUrl = url(undefined, undefined);
-          if (urlNotEqual(newUrl, url$1)) {
-            setUrl(function (param) {
-                  return newUrl;
-                });
-          }
-          return (function () {
-                    unwatchUrl(watcherId);
-                  });
-        }), []);
+  let match = React.useState(() => {
+    if (serverUrl !== undefined) {
+      return serverUrl;
+    } else {
+      return url(undefined, undefined);
+    }
+  });
+  let setUrl = match[1];
+  let url$1 = match[0];
+  React.useEffect(() => {
+    let watcherId = watchUrl(url => setUrl(param => url));
+    let newUrl = url(undefined, undefined);
+    if (urlNotEqual(newUrl, url$1)) {
+      setUrl(param => newUrl);
+    }
+    return () => unwatchUrl(watcherId);
+  }, []);
   return url$1;
 }
 
-var dangerouslyGetInitialUrl = url;
+let dangerouslyGetInitialUrl = url;
 
-exports.push = push;
-exports.replace = replace;
-exports.watchUrl = watchUrl;
-exports.unwatchUrl = unwatchUrl;
-exports.dangerouslyGetInitialUrl = dangerouslyGetInitialUrl;
-exports.useUrl = useUrl;
+export {
+  push,
+  replace,
+  watchUrl,
+  unwatchUrl,
+  dangerouslyGetInitialUrl,
+  useUrl,
+}
 /* react Not a pure module */
diff --git a/src/RescriptReactRouter.res b/src/RescriptReactRouter.res
index 80f3d75..24c9605 100644
--- a/src/RescriptReactRouter.res
+++ b/src/RescriptReactRouter.res
@@ -55,7 +55,7 @@ let arrayToList = a => {
     if i < 0 {
       res
     } else {
-      tolist(i - 1, list{a->Js.Array2.unsafe_get(i), ...res})
+      tolist(i - 1, list{Array.getUnsafe(a, i), ...res})
     }
   tolist(a->Js.Array2.length - 1, list{})
 }