Destructure all overridden props (#44910)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44910

Props within the `Text` component are accessed both via destructuring the props object but also in some cases by using a "dot" access on the destructured `restProps`. However in all of the "dot" access cases the property is being overrided. Which means in the final JSX these properties get set twice, e.g. via the `restProps` spread then overrrided by static properties. This change just destructures all values to avoid this inefficiency.

Changelog: [Internal]

Reviewed By: javache

Differential Revision: D58446569

fbshipit-source-id: 12a800f5e2218a1d95d57cc689a4c79caab480b4

packages/react-native/Libraries/Text/Text.js

@@ -42,8 +42,10 @@ const Text: React.AbstractComponent<
     'aria-label': ariaLabel,
     'aria-selected': ariaSelected,
     ellipsizeMode,
+    disabled,
     id,
     nativeID,
+    numberOfLines,
     onLongPress,
     onPress,
     onPressIn,
@@ -55,7 +57,10 @@ const Text: React.AbstractComponent<
     onResponderTerminationRequest,
     onStartShouldSetResponder,
     pressRetentionOffset,
+    selectable,
+    selectionColor,
     suppressHighlighting,
+    style,
     ...restProps
   } = props;
 
@@ -92,7 +97,7 @@ const Text: React.AbstractComponent<
   }
 
   const _accessibilityStateDisabled = _accessibilityState?.disabled;
-  const _disabled = restProps.disabled ?? _accessibilityStateDisabled;
+  const _disabled = disabled ?? _accessibilityStateDisabled;
 
   const isPressable =
     (onPress != null ||
@@ -195,29 +200,26 @@ const Text: React.AbstractComponent<
   );
 
   // TODO: Move this processing to the view configuration.
-  const selectionColor =
-    restProps.selectionColor == null
-      ? null
-      : processColor(restProps.selectionColor);
+  const _selectionColor =
+    selectionColor == null ? null : processColor(selectionColor);
 
-  let style = restProps.style;
+  let _style = style;
   if (__DEV__) {
     if (PressabilityDebug.isEnabled() && onPress != null) {
-      style = [restProps.style, {color: 'magenta'}];
+      _style = [style, {color: 'magenta'}];
     }
   }
 
-  let numberOfLines = restProps.numberOfLines;
-  if (numberOfLines != null && !(numberOfLines >= 0)) {
+  let _numberOfLines = numberOfLines;
+  if (_numberOfLines != null && !(_numberOfLines >= 0)) {
     console.error(
-      `'numberOfLines' in <Text> must be a non-negative number, received: ${numberOfLines}. The value will be set to 0.`,
+      `'numberOfLines' in <Text> must be a non-negative number, received: ${_numberOfLines}. The value will be set to 0.`,
     );
-    numberOfLines = 0;
+    _numberOfLines = 0;
   }
 
-  let _selectable = restProps.selectable;
-
-  const processedStyle = flattenStyle(style);
+  let _selectable = selectable;
+  const processedStyle = flattenStyle(_style);
   if (processedStyle != null) {
     if (typeof processedStyle.fontWeight === 'number') {
       // $FlowFixMe[cannot-write]
@@ -252,11 +254,12 @@ const Text: React.AbstractComponent<
         isHighlighted={isHighlighted}
         isPressable={isPressable}
         nativeID={_nativeID}
-        numberOfLines={numberOfLines}
+        numberOfLines={_numberOfLines}
         ref={forwardedRef}
         selectable={_selectable}
-        selectionColor={selectionColor}
+        selectionColor={_selectionColor}
         style={processedStyle}
+        disabled={disabled}
       />
     );
   }
@@ -292,10 +295,10 @@ const Text: React.AbstractComponent<
         ellipsizeMode={ellipsizeMode ?? 'tail'}
         isHighlighted={isHighlighted}
         nativeID={_nativeID}
-        numberOfLines={numberOfLines}
+        numberOfLines={_numberOfLines}
         ref={forwardedRef}
         selectable={_selectable}
-        selectionColor={selectionColor}
+        selectionColor={_selectionColor}
         style={processedStyle}
       />
     </TextAncestor.Provider>