[change] Add hrefAttrs prop to Text and View

When an 'href' is provided, the 'hrefAttr's prop can be used to set the 'download', 'rel', and 'target' attributes. The 'target' value does not require a "_" prefix.

packages/react-native-web/src/exports/Text/__tests__/__snapshots__/index-test.js.snap

@@ -67,6 +67,17 @@ exports[`components/Text prop "accessibilityRole" value is set 1`] = `
 />
 `;
 
+exports[`components/Text prop "hrefAttrs" values are set 1`] = `
+<div
+  class="css-text-901oao"
+  dir="auto"
+  download=""
+  href="#"
+  rel="noopener"
+  target="_blank"
+/>
+`;
+
 exports[`components/Text prop "nativeID" value is set 1`] = `
 <div
   class="css-text-901oao"

packages/react-native-web/src/exports/Text/__tests__/index-test.js

@@ -54,6 +54,15 @@ describe('components/Text', () => {
     expect(container.firstChild).toMatchSnapshot();
   });
 
+  describe('prop "hrefAttrs"', () => {
+    test('values are set', () => {
+      const { container } = render(
+        <Text href="#" hrefAttrs={{ download: true, target: 'blank', rel: 'noopener' }} />
+      );
+      expect(container.firstChild).toMatchSnapshot();
+    });
+  });
+
   describe('prop "nativeID"', () => {
     test('value is set', () => {
       const { container } = render(<Text nativeID="nativeID" />);

packages/react-native-web/src/exports/Text/index.js

@@ -65,9 +65,7 @@ const forwardPropsList = {
   onMouseUp: true,
   onScroll: true,
   onWheel: true,
-  href: true,
+  href: true
-  rel: true,
-  target: true
 };
 
 const pickProps = props => pick(props, forwardPropsList);
@@ -75,6 +73,7 @@ const pickProps = props => pick(props, forwardPropsList);
 const Text = forwardRef<TextProps, *>((props, forwardedRef) => {
   const {
     dir,
+    hrefAttrs,
     numberOfLines,
     onClick,
     onLayout,
@@ -155,6 +154,18 @@ const Text = forwardRef<TextProps, *>((props, forwardedRef) => {
   }
   supportedProps.onClick = handleClick;
   supportedProps.style = style;
+  if (props.href != null && hrefAttrs != null) {
+    const { download, rel, target } = hrefAttrs;
+    if (download != null) {
+      supportedProps.download = download;
+    }
+    if (rel != null) {
+      supportedProps.rel = rel;
+    }
+    if (typeof target === 'string' && target.charAt(0) !== '_') {
+      supportedProps.target = '_' + target;
+    }
+  }
 
   const platformMethodsRef = usePlatformMethods(supportedProps);
   const setRef = useMergeRefs(hostRef, platformMethodsRef, forwardedRef);

packages/react-native-web/src/exports/View/index.js

@@ -63,15 +63,14 @@ const forwardPropsList = {
   onMouseUp: true,
   onScroll: true,
   onWheel: true,
-  href: true,
+  href: true
-  rel: true,
-  target: true
 };
 
 const pickProps = props => pick(props, forwardPropsList);
 
 const View = forwardRef<ViewProps, *>((props, forwardedRef) => {
   const {
+    hrefAttrs,
     onLayout,
     onMoveShouldSetResponder,
     onMoveShouldSetResponderCapture,
@@ -130,6 +129,18 @@ const View = forwardRef<ViewProps, *>((props, forwardedRef) => {
   const supportedProps = pickProps(props);
   supportedProps.classList = classList;
   supportedProps.style = style;
+  if (props.href != null && hrefAttrs != null) {
+    const { download, rel, target } = hrefAttrs;
+    if (download != null) {
+      supportedProps.download = download;
+    }
+    if (rel != null) {
+      supportedProps.rel = rel;
+    }
+    if (typeof target === 'string' && target.charAt(0) !== '_') {
+      supportedProps.target = '_' + target;
+    }
+  }
 
   const platformMethodsRef = usePlatformMethods(supportedProps);
   const setRef = useMergeRefs(hostRef, platformMethodsRef, forwardedRef);