Add more web props, press-event, href and target (facebook#650)

* Press-event, href and target * Fix typo * Add react-native-web accessibility roles * also add web properties to touchables * use window scrolling * Update src/components/ScrollView.re Co-authored-by: Max Thirouin <git@moox.io>
jfrolich · Mar 26, 2020 · 6cba498 · 6cba498
1 parent 2703957
commit 6cba498
Show file tree

Hide file tree

Showing 6 changed files with 115 additions and 6 deletions.
diff --git a/src/components/Text.re b/src/components/Text.re
@@ -55,8 +55,8 @@ external make:
     ~ellipsizeMode: [@bs.string] [ | `clip | `head | `middle | `tail]=?,
     ~numberOfLines: int=?,
     ~onLayout: Event.layoutEvent => unit=?,
-    ~onLongPress: unit => unit=?,
-    ~onPress: unit => unit=?,
+    ~onLongPress: Event.pressEvent => unit=?,
+    ~onPress: Event.pressEvent => unit=?,
     ~pressRetentionOffset: View.edgeInsets=?,
     ~selectable: bool=?,
     ~style: Style.t=?,
@@ -69,6 +69,25 @@ external make:
     ~value: string=?,
     ~children: React.element=?,
     // React Native Web Props
+    ~rel: [@bs.string] [
+            | `alternate
+            | `author
+            | [@bs.as "dns-prefetch"] `dnsPrefetch
+            | `icon
+            | `license
+            | `next
+            | `pingback
+            | `preconnect
+            | `prefetch
+            | `preload
+            | `prerender
+            | `prev
+            | `search
+            | `stylesheet
+          ]
+            =?,
+    ~href: string=?,
+    ~target: [@bs.string] [ | `_blank | `_self | `_parent | `_top]=?
     ~onMouseDown: ReactEvent.Mouse.t => unit=?,
     ~onMouseEnter: ReactEvent.Mouse.t => unit=?,
     ~onMouseLeave: ReactEvent.Mouse.t => unit=?,

diff --git a/src/components/TouchableHighlight.re b/src/components/TouchableHighlight.re
@@ -53,7 +53,27 @@ external make:
     ~pressRetentionOffset: View.edgeInsets=?,
     ~testID: string=?,
     ~touchSoundDisabled: bool=?,
-    ~children: React.element=?
+    ~children: React.element=?,
+    // escape hatches for react-native web:
+    ~rel: [@bs.string] [
+            | `alternate
+            | `author
+            | [@bs.as "dns-prefetch"] `dnsPrefetch
+            | `icon
+            | `license
+            | `next
+            | `pingback
+            | `preconnect
+            | `prefetch
+            | `preload
+            | `prerender
+            | `prev
+            | `search
+            | `stylesheet
+          ]
+            =?,
+    ~href: string=?,
+    ~target: [@bs.string] [ | `_blank | `_self | `_parent | `_top]=?
   ) =>
   React.element =
   "TouchableHighlight";
diff --git a/src/components/TouchableNativeFeedback.re b/src/components/TouchableNativeFeedback.re
@@ -65,7 +65,27 @@ external make:
     ~pressRetentionOffset: View.edgeInsets=?,
     ~testID: string=?,
     ~touchSoundDisabled: bool=?,
-    ~children: React.element=?
+    ~children: React.element=?,
+    // escape hatches for react-native web:
+    ~rel: [@bs.string] [
+            | `alternate
+            | `author
+            | [@bs.as "dns-prefetch"] `dnsPrefetch
+            | `icon
+            | `license
+            | `next
+            | `pingback
+            | `preconnect
+            | `prefetch
+            | `preload
+            | `prerender
+            | `prev
+            | `search
+            | `stylesheet
+          ]
+            =?,
+    ~href: string=?,
+    ~target: [@bs.string] [ | `_blank | `_self | `_parent | `_top]=?
   ) =>
   React.element =
   "TouchableNativeFeedback";
diff --git a/src/components/TouchableOpacity.re b/src/components/TouchableOpacity.re
@@ -50,7 +50,27 @@ external make:
     ~pressRetentionOffset: View.edgeInsets=?,
     ~testID: string=?,
     ~touchSoundDisabled: bool=?,
-    ~children: React.element=?
+    ~children: React.element=?,
+    // escape hatches for react-native web:
+    ~rel: [@bs.string] [
+            | `alternate
+            | `author
+            | [@bs.as "dns-prefetch"] `dnsPrefetch
+            | `icon
+            | `license
+            | `next
+            | `pingback
+            | `preconnect
+            | `prefetch
+            | `preload
+            | `prerender
+            | `prev
+            | `search
+            | `stylesheet
+          ]
+            =?,
+    ~href: string=?,
+    ~target: [@bs.string] [ | `_blank | `_self | `_parent | `_top]=?
   ) =>
   React.element =
   "TouchableOpacity";
diff --git a/src/components/TouchableWithoutFeedback.re b/src/components/TouchableWithoutFeedback.re
@@ -47,7 +47,27 @@ external make:
     ~pressRetentionOffset: View.edgeInsets=?,
     ~testID: string=?,
     ~touchSoundDisabled: bool=?,
-    ~children: React.element=?
+    ~children: React.element=?,
+    // escape hatches for react-native web:
+    ~rel: [@bs.string] [
+            | `alternate
+            | `author
+            | [@bs.as "dns-prefetch"] `dnsPrefetch
+            | `icon
+            | `license
+            | `next
+            | `pingback
+            | `preconnect
+            | `prefetch
+            | `preload
+            | `prerender
+            | `prev
+            | `search
+            | `stylesheet
+          ]
+            =?,
+    ~href: string=?,
+    ~target: [@bs.string] [ | `_blank | `_self | `_parent | `_top]=?
   ) =>
   React.element =
   "TouchableWithoutFeedback";
diff --git a/src/components/View.re b/src/components/View.re
@@ -36,6 +36,16 @@ external make:
                           | `header
                           | `summary
                           | `imagebutton
+                          | `article
+                          | `banner
+                          | `complementary
+                          | `contentinfo
+                          | `form
+                          | `list
+                          | `listitem
+                          | `main
+                          | `navigation
+                          | `region
                         ]
                           =?,
     ~accessibilityStates: array(AccessibilityState.t)=?,