diff --git a/src/apis/AccessibilityInfo.res b/src/apis/AccessibilityInfo.res
index f13a309e..4eea5267 100644
--- a/src/apis/AccessibilityInfo.res
+++ b/src/apis/AccessibilityInfo.res
@@ -67,8 +67,10 @@ type accessibilityEventTypes = [
 ]
 
 @scope("AccessibilityInfo") @module("react-native")
-external sendAccessibilityEvent: (NativeElement.ref, accessibilityEventTypes) => unit =
-  "sendAccessibilityEvent"
+external sendAccessibilityEvent: (
+  Ref.t<DOMAPI.element<'nativeElement>>,
+  accessibilityEventTypes,
+) => unit = "sendAccessibilityEvent"
 
 @scope("AccessibilityInfo") @module("react-native")
 external prefersCrossFadeTransitions: unit => promise<bool> = "prefersCrossFadeTransitions"
diff --git a/src/components/ActivityIndicator.bs.js b/src/components/ActivityIndicator.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/ActivityIndicator.bs.js
+++ b/src/components/ActivityIndicator.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/ActivityIndicator.res b/src/components/ActivityIndicator.res
index 09199ef7..1cbccea7 100644
--- a/src/components/ActivityIndicator.res
+++ b/src/components/ActivityIndicator.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asActivityIndicatorElement: DOMAPI.anyElement => element = "%identity"
 
 @unboxed
 type size = | @as("small") Small | @as("large") Large | Number(float)
diff --git a/src/components/Button.bs.js b/src/components/Button.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/Button.bs.js
+++ b/src/components/Button.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/Button.res b/src/components/Button.res
index b1e619c9..511aef40 100644
--- a/src/components/Button.res
+++ b/src/components/Button.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asButtonElement: DOMAPI.anyElement => element = "%identity"
 
 type props = {
   ref?: ref,
diff --git a/src/components/Image.bs.js b/src/components/Image.bs.js
index f7d8b0e6..26125b48 100644
--- a/src/components/Image.bs.js
+++ b/src/components/Image.bs.js
@@ -3,6 +3,8 @@
 var Event$ReactNative = require("../apis/Event.bs.js");
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
+
 var Source = {};
 
 Event$ReactNative.SyntheticEvent({});
diff --git a/src/components/Image.res b/src/components/Image.res
index 14a1b45c..91e22812 100644
--- a/src/components/Image.res
+++ b/src/components/Image.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asImageElement: DOMAPI.anyElement => element = "%identity"
 
 type cache = [
   | #default
diff --git a/src/components/ImageBackground.bs.js b/src/components/ImageBackground.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/ImageBackground.bs.js
+++ b/src/components/ImageBackground.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/ImageBackground.res b/src/components/ImageBackground.res
index 6d28a7ce..6f0caa2f 100644
--- a/src/components/ImageBackground.res
+++ b/src/components/ImageBackground.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asImageBackgroundElement: DOMAPI.anyElement => element = "%identity"
 
 type props = {
   ref?: ref,
diff --git a/src/components/KeyboardAvoidingView.bs.js b/src/components/KeyboardAvoidingView.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/KeyboardAvoidingView.bs.js
+++ b/src/components/KeyboardAvoidingView.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/KeyboardAvoidingView.res b/src/components/KeyboardAvoidingView.res
index 9d0bc81c..1d11544c 100644
--- a/src/components/KeyboardAvoidingView.res
+++ b/src/components/KeyboardAvoidingView.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asKeyboardAvoidingViewElement: DOMAPI.anyElement => element = "%identity"
 
 type behavior = [#height | #position | #padding]
 
diff --git a/src/components/Modal.bs.js b/src/components/Modal.bs.js
index 173c3869..a7165034 100644
--- a/src/components/Modal.bs.js
+++ b/src/components/Modal.bs.js
@@ -3,6 +3,8 @@
 var Event$ReactNative = require("../apis/Event.bs.js");
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
+
 Event$ReactNative.SyntheticEvent({});
 
 var OrientationChangeEvent = {};
diff --git a/src/components/Modal.res b/src/components/Modal.res
index 7ba6035e..549bd80a 100644
--- a/src/components/Modal.res
+++ b/src/components/Modal.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asModalElement: DOMAPI.anyElement => element = "%identity"
 
 type orientation = [
   | #landscape
diff --git a/src/components/Pressable.bs.js b/src/components/Pressable.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/Pressable.bs.js
+++ b/src/components/Pressable.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/Pressable.res b/src/components/Pressable.res
index 627bc802..1aeaf603 100644
--- a/src/components/Pressable.res
+++ b/src/components/Pressable.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asPressableElement: DOMAPI.anyElement => element = "%identity"
 
 type rippleConfig = {
   borderless?: bool,
diff --git a/src/components/ProgressBarAndroid.bs.js b/src/components/ProgressBarAndroid.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/ProgressBarAndroid.bs.js
+++ b/src/components/ProgressBarAndroid.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/ProgressBarAndroid.res b/src/components/ProgressBarAndroid.res
index 9b49fb2b..832948cd 100644
--- a/src/components/ProgressBarAndroid.res
+++ b/src/components/ProgressBarAndroid.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asProgressBarAndroidElement: DOMAPI.anyElement => element = "%identity"
 
 type styleAttr = [
   | #Horizontal
diff --git a/src/components/RefreshControl.bs.js b/src/components/RefreshControl.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/RefreshControl.bs.js
+++ b/src/components/RefreshControl.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/RefreshControl.res b/src/components/RefreshControl.res
index 04d12d30..184f56d2 100644
--- a/src/components/RefreshControl.res
+++ b/src/components/RefreshControl.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asRefreshControlElement: DOMAPI.anyElement => element = "%identity"
 
 type props = {
   ref?: ref,
diff --git a/src/components/SafeAreaView.bs.js b/src/components/SafeAreaView.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/SafeAreaView.bs.js
+++ b/src/components/SafeAreaView.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/SafeAreaView.res b/src/components/SafeAreaView.res
index fce05fae..9cd9987a 100644
--- a/src/components/SafeAreaView.res
+++ b/src/components/SafeAreaView.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asSafeAreaViewElement: DOMAPI.anyElement => element = "%identity"
 
 type props = {
   ref?: ref,
diff --git a/src/components/Switch.bs.js b/src/components/Switch.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/Switch.bs.js
+++ b/src/components/Switch.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/Switch.res b/src/components/Switch.res
index a8bb3f33..b9727684 100644
--- a/src/components/Switch.res
+++ b/src/components/Switch.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asSwitchElement: DOMAPI.anyElement => element = "%identity"
 
 type trackColor = {
   \"true"?: Color.t,
diff --git a/src/components/Text.bs.js b/src/components/Text.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/Text.bs.js
+++ b/src/components/Text.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/Text.res b/src/components/Text.res
index 1d2eb007..c855e15e 100644
--- a/src/components/Text.res
+++ b/src/components/Text.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asTextElement: DOMAPI.anyElement => element = "%identity"
 
 type android_hyphenationFrequency = [
   | #normal
diff --git a/src/components/TouchableHighlight.bs.js b/src/components/TouchableHighlight.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/TouchableHighlight.bs.js
+++ b/src/components/TouchableHighlight.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/TouchableHighlight.res b/src/components/TouchableHighlight.res
index a8dd96d3..ce582a6d 100644
--- a/src/components/TouchableHighlight.res
+++ b/src/components/TouchableHighlight.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asTouchableHighlightElement: DOMAPI.anyElement => element = "%identity"
 
 type props = {
   ref?: ref,
diff --git a/src/components/TouchableNativeFeedback.bs.js b/src/components/TouchableNativeFeedback.bs.js
index d633edcd..f1831e1c 100644
--- a/src/components/TouchableNativeFeedback.bs.js
+++ b/src/components/TouchableNativeFeedback.bs.js
@@ -2,7 +2,9 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
+
 var Background = {};
 
 exports.Background = Background;
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/TouchableNativeFeedback.res b/src/components/TouchableNativeFeedback.res
index 750cea4d..4abb0d4c 100644
--- a/src/components/TouchableNativeFeedback.res
+++ b/src/components/TouchableNativeFeedback.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asTouchableNativeFeedbackElement: DOMAPI.anyElement => element = "%identity"
 
 module Background = {
   type t
diff --git a/src/components/TouchableWithoutFeedback.bs.js b/src/components/TouchableWithoutFeedback.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/TouchableWithoutFeedback.bs.js
+++ b/src/components/TouchableWithoutFeedback.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/TouchableWithoutFeedback.res b/src/components/TouchableWithoutFeedback.res
index 0660295b..f11089fd 100644
--- a/src/components/TouchableWithoutFeedback.res
+++ b/src/components/TouchableWithoutFeedback.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asTouchableWithoutFeedbackElement: DOMAPI.anyElement => element = "%identity"
 
 type coreProps = {
   accessible?: bool,
diff --git a/src/components/View.bs.js b/src/components/View.bs.js
index 24e54d23..484019b9 100644
--- a/src/components/View.bs.js
+++ b/src/components/View.bs.js
@@ -2,5 +2,6 @@
 
 var NativeElement$ReactNative = require("../elements/NativeElement.bs.js");
 
+NativeElement$ReactNative.Impl({});
 
-/* NativeElement-ReactNative Not a pure module */
+/*  Not a pure module */
diff --git a/src/components/View.res b/src/components/View.res
index 1176f1ca..0848bd1b 100644
--- a/src/components/View.res
+++ b/src/components/View.res
@@ -1,4 +1,10 @@
-include NativeElement
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asViewElement: DOMAPI.anyElement => element = "%identity"
 
 // @todo in 0.71.0
 // after adding `aria-*` props, make sure `aria-checked` can be true, false or "mixed"
diff --git a/src/elements/DrawerLayoutAndroidElement.bs.js b/src/elements/DrawerLayoutAndroidElement.bs.js
index 7c3ecfe5..9417c111 100644
--- a/src/elements/DrawerLayoutAndroidElement.bs.js
+++ b/src/elements/DrawerLayoutAndroidElement.bs.js
@@ -1,10 +1,10 @@
 'use strict';
 
-var NativeMethods$ReactNative = require("./NativeMethods.bs.js");
+var NativeElement$ReactNative = require("./NativeElement.bs.js");
 var DrawerLayoutAndroidMethods$ReactNative = require("./DrawerLayoutAndroidMethods.bs.js");
 
-DrawerLayoutAndroidMethods$ReactNative.Make({});
+NativeElement$ReactNative.Impl({});
 
-NativeMethods$ReactNative.Make({});
+DrawerLayoutAndroidMethods$ReactNative.Make({});
 
 /*  Not a pure module */
diff --git a/src/elements/DrawerLayoutAndroidElement.res b/src/elements/DrawerLayoutAndroidElement.res
index 51df4e6f..616b1722 100644
--- a/src/elements/DrawerLayoutAndroidElement.res
+++ b/src/elements/DrawerLayoutAndroidElement.res
@@ -1,10 +1,11 @@
-type element
-type ref = Ref.t<element>
+type nativeElement
 
-include DrawerLayoutAndroidMethods.Make({
-  type t = element
+include NativeElement.Impl({
+  type t = nativeElement
 })
 
-include NativeMethods.Make({
+external asDrawerLayoutAndroidElement: DOMAPI.anyElement => element = "%identity"
+
+include DrawerLayoutAndroidMethods.Make({
   type t = element
 })
diff --git a/src/elements/NativeElement.bs.js b/src/elements/NativeElement.bs.js
index b690878c..b9d5c466 100644
--- a/src/elements/NativeElement.bs.js
+++ b/src/elements/NativeElement.bs.js
@@ -1,7 +1,13 @@
 'use strict';
 
+var DOMAPI$ReactNative = require("../types/DOMAPI.bs.js");
 var NativeMethods$ReactNative = require("./NativeMethods.bs.js");
 
-NativeMethods$ReactNative.Make({});
+function Impl(T) {
+  NativeMethods$ReactNative.Make({});
+  DOMAPI$ReactNative.$$Element.Impl({});
+  return {};
+}
 
-/*  Not a pure module */
+exports.Impl = Impl;
+/* No side effect */
diff --git a/src/elements/NativeElement.res b/src/elements/NativeElement.res
index 620b9a2f..72c244f5 100644
--- a/src/elements/NativeElement.res
+++ b/src/elements/NativeElement.res
@@ -1,6 +1,16 @@
-type element
-type ref = Ref.t<element>
+module Impl = (
+  T: {
+    type t
+  },
+) => {
+  type element = DOMAPI.element<T.t>
+  type ref = Ref.t<element>
 
-include NativeMethods.Make({
-  type t = element
-})
+  include NativeMethods.Make({
+    type t = element
+  })
+
+  include DOMAPI.Element.Impl({
+    type t = element
+  })
+}
diff --git a/src/elements/ScrollViewElement.bs.js b/src/elements/ScrollViewElement.bs.js
index fdd8c3bf..e7539384 100644
--- a/src/elements/ScrollViewElement.bs.js
+++ b/src/elements/ScrollViewElement.bs.js
@@ -1,7 +1,10 @@
 'use strict';
 
+var NativeElement$ReactNative = require("./NativeElement.bs.js");
 var ScrollViewMethods$ReactNative = require("./ScrollViewMethods.bs.js");
 
+NativeElement$ReactNative.Impl({});
+
 ScrollViewMethods$ReactNative.Make({});
 
 /*  Not a pure module */
diff --git a/src/elements/ScrollViewElement.res b/src/elements/ScrollViewElement.res
index 8ba5e10a..ded62f89 100644
--- a/src/elements/ScrollViewElement.res
+++ b/src/elements/ScrollViewElement.res
@@ -1,5 +1,10 @@
-type element
-type ref = Ref.t<element>
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asScrollViewElement: DOMAPI.anyElement => element = "%identity"
 
 include ScrollViewMethods.Make({
   type t = element
diff --git a/src/elements/TextInputElement.bs.js b/src/elements/TextInputElement.bs.js
index e91dede9..2e6eb6a5 100644
--- a/src/elements/TextInputElement.bs.js
+++ b/src/elements/TextInputElement.bs.js
@@ -1,10 +1,10 @@
 'use strict';
 
-var NativeMethods$ReactNative = require("./NativeMethods.bs.js");
+var NativeElement$ReactNative = require("./NativeElement.bs.js");
 var TextInputMethods$ReactNative = require("./TextInputMethods.bs.js");
 
-TextInputMethods$ReactNative.Make({});
+NativeElement$ReactNative.Impl({});
 
-NativeMethods$ReactNative.Make({});
+TextInputMethods$ReactNative.Make({});
 
 /*  Not a pure module */
diff --git a/src/elements/TextInputElement.res b/src/elements/TextInputElement.res
index 496fb8c0..1c798778 100644
--- a/src/elements/TextInputElement.res
+++ b/src/elements/TextInputElement.res
@@ -1,10 +1,11 @@
-type element
-type ref = Ref.t<element>
+type nativeElement
 
-include TextInputMethods.Make({
-  type t = element
+include NativeElement.Impl({
+  type t = nativeElement
 })
 
-include NativeMethods.Make({
+external asTextInputElement: DOMAPI.anyElement => element = "%identity"
+
+include TextInputMethods.Make({
   type t = element
 })
diff --git a/src/elements/TouchableOpacityElement.bs.js b/src/elements/TouchableOpacityElement.bs.js
index 072e00ac..19bb2c5c 100644
--- a/src/elements/TouchableOpacityElement.bs.js
+++ b/src/elements/TouchableOpacityElement.bs.js
@@ -1,10 +1,10 @@
 'use strict';
 
-var NativeMethods$ReactNative = require("./NativeMethods.bs.js");
+var NativeElement$ReactNative = require("./NativeElement.bs.js");
 var TouchableOpacityMethods$ReactNative = require("./TouchableOpacityMethods.bs.js");
 
-TouchableOpacityMethods$ReactNative.Make({});
+NativeElement$ReactNative.Impl({});
 
-NativeMethods$ReactNative.Make({});
+TouchableOpacityMethods$ReactNative.Make({});
 
 /*  Not a pure module */
diff --git a/src/elements/TouchableOpacityElement.res b/src/elements/TouchableOpacityElement.res
index 6ae84974..8b1909d0 100644
--- a/src/elements/TouchableOpacityElement.res
+++ b/src/elements/TouchableOpacityElement.res
@@ -1,10 +1,11 @@
-type element
-type ref = Ref.t<element>
+type nativeElement
 
-include TouchableOpacityMethods.Make({
-  type t = element
+include NativeElement.Impl({
+  type t = nativeElement
 })
 
-include NativeMethods.Make({
+external asTouchableOpacityElement: DOMAPI.anyElement => element = "%identity"
+
+include TouchableOpacityMethods.Make({
   type t = element
 })
diff --git a/src/elements/VirtualizedListElement.bs.js b/src/elements/VirtualizedListElement.bs.js
index 9dc2a0d1..c9c3bf1a 100644
--- a/src/elements/VirtualizedListElement.bs.js
+++ b/src/elements/VirtualizedListElement.bs.js
@@ -1,8 +1,11 @@
 'use strict';
 
+var NativeElement$ReactNative = require("./NativeElement.bs.js");
 var ScrollViewMethods$ReactNative = require("./ScrollViewMethods.bs.js");
 var VirtualizedListMethods$ReactNative = require("./VirtualizedListMethods.bs.js");
 
+NativeElement$ReactNative.Impl({});
+
 VirtualizedListMethods$ReactNative.Make({});
 
 ScrollViewMethods$ReactNative.Make({});
diff --git a/src/elements/VirtualizedListElement.res b/src/elements/VirtualizedListElement.res
index 3d5ad723..4572c16a 100644
--- a/src/elements/VirtualizedListElement.res
+++ b/src/elements/VirtualizedListElement.res
@@ -1,5 +1,10 @@
-type element
-type ref = Ref.t<element>
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asVirtualizedListElement: DOMAPI.anyElement => element = "%identity"
 
 include VirtualizedListMethods.Make({
   type t = element
diff --git a/src/elements/VirtualizedSectionListElement.bs.js b/src/elements/VirtualizedSectionListElement.bs.js
index 7794898f..77d09425 100644
--- a/src/elements/VirtualizedSectionListElement.bs.js
+++ b/src/elements/VirtualizedSectionListElement.bs.js
@@ -1,7 +1,10 @@
 'use strict';
 
+var NativeElement$ReactNative = require("./NativeElement.bs.js");
 var VirtualizedSectionListMethods$ReactNative = require("./VirtualizedSectionListMethods.bs.js");
 
+NativeElement$ReactNative.Impl({});
+
 VirtualizedSectionListMethods$ReactNative.Make({});
 
 /*  Not a pure module */
diff --git a/src/elements/VirtualizedSectionListElement.res b/src/elements/VirtualizedSectionListElement.res
index 2029818b..ba4525b9 100644
--- a/src/elements/VirtualizedSectionListElement.res
+++ b/src/elements/VirtualizedSectionListElement.res
@@ -1,5 +1,10 @@
-type element
-type ref = Ref.t<element>
+type nativeElement
+
+include NativeElement.Impl({
+  type t = nativeElement
+})
+
+external asVirtualizedSectionListElement: DOMAPI.anyElement => element = "%identity"
 
 include VirtualizedSectionListMethods.Make({
   type t = element
diff --git a/src/types/DOMAPI.bs.js b/src/types/DOMAPI.bs.js
new file mode 100644
index 00000000..20397128
--- /dev/null
+++ b/src/types/DOMAPI.bs.js
@@ -0,0 +1,61 @@
+'use strict';
+
+
+var $$NodeList = {};
+
+var $$HTMLCollection = {};
+
+function Impl(T) {
+  return {};
+}
+
+var $$Node = {
+  Impl: Impl
+};
+
+function Impl$1(T) {
+  return {};
+}
+
+var $$Element = {
+  Impl: Impl$1
+};
+
+var $$Document = {};
+
+var $$Text = {};
+
+function classify(node) {
+  switch (node.nodeType) {
+    case 1 :
+        return {
+                TAG: "Element",
+                _0: node
+              };
+    case 3 :
+        return {
+                TAG: "Text",
+                _0: node
+              };
+    case 9 :
+        return {
+                TAG: "Document",
+                _0: node
+              };
+    default:
+      return "Unknown";
+  }
+}
+
+var NodeType = {
+  classify: classify
+};
+
+exports.$$NodeList = $$NodeList;
+exports.$$HTMLCollection = $$HTMLCollection;
+exports.$$Node = $$Node;
+exports.$$Element = $$Element;
+exports.$$Document = $$Document;
+exports.$$Text = $$Text;
+exports.NodeType = NodeType;
+/* No side effect */
diff --git a/src/types/DOMAPI.res b/src/types/DOMAPI.res
new file mode 100644
index 00000000..409369fc
--- /dev/null
+++ b/src/types/DOMAPI.res
@@ -0,0 +1,185 @@
+@@warning("-30")
+
+type nodeList<'node> = {length: int}
+type htmlCollection<'element> = {length: int}
+
+type readOnlyNode<'node, 'document, 'element> = {
+  // Node
+  childNodes: nodeList<'node>,
+  firstChild: Js.Null.t<'node>,
+  isConnected: bool,
+  lastChild: Js.Null.t<'node>,
+  nextSibling: Js.Null.t<'node>,
+  nodeType: int,
+  nodeName: string,
+  nodeValue: Js.Null.t<string>,
+  ownerDocument: Js.Null.t<'document>,
+  parentElement: Js.Null.t<'element>,
+  parentNode: Js.Null.t<'node>,
+  previousSibling: Js.Null.t<'node>,
+  textContent: string,
+}
+
+type unknownNativeElement
+
+type rec node = {
+  ...readOnlyNode<node, document, anyElement>,
+}
+
+and element<'nativeElement> = {
+  // Node
+  ...readOnlyNode<node, document, anyElement>,
+  // Element
+  childElementCount: int,
+  children: htmlCollection<anyElement>,
+  clientHeight: int,
+  clientLeft: int,
+  clientTop: int,
+  clientWidth: int,
+  firstElementChild: Js.Null.t<anyElement>,
+  id: string,
+  lastElementChild: Js.Null.t<anyElement>,
+  nextElementSibling: Js.Null.t<anyElement>,
+  previousElementSibling: Js.Null.t<anyElement>,
+  scrollHeight: int,
+  scrollLeft: int,
+  scrollTop: int,
+  scrollWidth: int,
+  tagName: string,
+  // HTMLElement
+  offsetHeight: int,
+  offsetLeft: int,
+  offsetTop: int,
+  offsetWidth: int,
+  offsetParent: Js.Null.t<anyElement>,
+}
+
+and text = {
+  // Node
+  ...readOnlyNode<node, document, anyElement>,
+  // CharacterData
+  data: string,
+  length: int,
+  nextElementSibling: Js.Null.t<anyElement>,
+  previousElementSibling: Js.Null.t<anyElement>,
+}
+
+and document = {
+  ...readOnlyNode<node, document, anyElement>,
+  childElementCount: int,
+  children: htmlCollection<anyElement>,
+  documentElement: anyElement,
+  firstElementChild: Js.Null.t<anyElement>,
+  lastElementChild: Js.Null.t<anyElement>,
+}
+
+and anyElement = element<unknownNativeElement>
+
+module NodeList = {
+  @send
+  external item: (nodeList<'node>, int) => Js.Null.t<'node> = "item"
+}
+
+module HTMLCollection = {
+  @send
+  external item: (htmlCollection<'element>, int) => Js.Null.t<'element> = "item"
+
+  @send
+  external namedItem: (htmlCollection<'element>, string) => Js.Null.t<'element> = "namedItem"
+}
+
+module Node = {
+  module Impl = (
+    T: {
+      type t
+    },
+  ) => {
+    external asNode: T.t => node = "%identity"
+
+    @send
+    external compareDocumentPosition: (T.t, node) => int = "compareDocumentPosition"
+    @send external contains: (T.t, node) => bool = "contains"
+    @send external getRootNode: T.t => node = "getRootNode"
+    @send external hasChildNodes: T.t => bool = "hasChildNodes"
+  }
+
+  include Impl({
+    type t = node
+  })
+}
+
+module Element = {
+  module Impl = (
+    T: {
+      type t
+    },
+  ) => {
+    include Node.Impl({
+      type t = T.t
+    })
+
+    @send
+    external getBoundingClientRect: T.t => Rect.t = "getBoundingClientRect"
+    @send
+    external hasPointerCapture: (T.t, int) => bool = "hasPointerCapture"
+    @send
+    external releasePointerCapture: (T.t, int) => unit = "releasePointerCapture"
+    @send
+    external setPointerCapture: (T.t, int) => unit = "setPointerCapture"
+    @send external focus: T.t => unit = "focus"
+    @send external blur: T.t => unit = "blur"
+
+    @send external setNativeProps: (T.t, {..}) => unit = "setNativeProps"
+  }
+
+  include Impl({
+    type t = anyElement
+  })
+}
+
+module Document = {
+  include Node.Impl({
+    type t = document
+  })
+
+  @send
+  external getElementById: (document, string) => Js.Null.t<anyElement> = "getElementById"
+}
+
+module Text = {
+  include Node.Impl({
+    type t = text
+  })
+
+  @send external substringData: (text, ~offset: int, ~count: int) => string = "substringData"
+}
+
+module NodeType = {
+  /*
+  Helper for handle NodeType
+  Waiting for this issue :
+  https://github.com/rescript-lang/rescript/issues/8280
+  to use this type for node instead
+
+  @tag("nodeType")
+  type rec node =
+    | @as(1) Element(element)
+    | @as(3) Text(text)
+    | @as(9) Document(document)
+
+  and remove this helper
+ */
+  type t =
+    | Element(element<unknownNativeElement>)
+    | Text(text)
+    | Document(document)
+    | Unknown
+
+  let classify = (node: node) =>
+    switch node {
+    | {nodeType: 1} => Element(node->Obj.magic)
+    | {nodeType: 3} => Text(node->Obj.magic)
+    | {nodeType: 9} => Document(node->Obj.magic)
+    | _ => Unknown
+    }
+}