react-native-tvos 0.82.1-0 → 0.83.0-0

package/Libraries/Renderer/shims/ReactNative.js

@@ -7,7 +7,9 @@
  * @noformat
  * @nolint
  * @flow
- * @generated SignedSource<<8f46fdc9267fcc4fdc9e76842fe24066>>
+ *
+ * This file is no longer sync'd from the facebook/react repository.
+ * The version compatability check is removed. Use at your own risk.
  */
 'use strict';
 

package/Libraries/Renderer/shims/ReactNativeTypes.js

@@ -7,7 +7,7 @@
  * @noformat
  * @nolint
  * @flow strict
- * @generated SignedSource<<deb7924d11c790f99448a1c2f0edddb9>>
+ * @generated SignedSource<<c0e57723772ea5f1aa8c3c897ac3c216>>
  */
 
 import type {
@@ -135,6 +135,7 @@ export type RenderRootOptions = {
     error: mixed,
     errorInfo: {+componentStack?: ?string},
   ) => void,
+  onDefaultTransitionIndicator?: () => void | (() => void),
 };
 
 /**

package/Libraries/Required/RCTRequired.h

@@ -44,22 +44,22 @@ struct RCTRequired {
   /// Pass-through constructor (allows for implicit conversion) for wrapped type
   /// T
   template <typename... Args>
-  RCTREQUIRED_INLINE RCTRequired(Args&&... args)
-      : _t(std::forward<Args>(args)...) {
+  RCTREQUIRED_INLINE RCTRequired(Args &&...args) : _t(std::forward<Args>(args)...)
+  {
     static_assert(
         sizeof...(Args) > 0,
         "Required struct member not initialized. Expand assert trace to see where this was triggered.");
   }
 
   RCTREQUIRED_INLINE
-  RCTRequired(const RCTRequired&) = default;
+  RCTRequired(const RCTRequired &) = default;
   RCTREQUIRED_INLINE
-  RCTRequired(RCTRequired&&) = default;
+  RCTRequired(RCTRequired &&) = default;
 
   RCTREQUIRED_INLINE
-  RCTRequired& operator=(const RCTRequired&) = default;
+  RCTRequired &operator=(const RCTRequired &) = default;
   RCTREQUIRED_INLINE
-  RCTRequired& operator=(RCTRequired&&) = default;
+  RCTRequired &operator=(RCTRequired &&) = default;
 
   RCTREQUIRED_INLINE
   ~RCTRequired() = default;
@@ -67,21 +67,25 @@ struct RCTRequired {
   /// Public accessor for private storage (Use when implicit conversion is
   /// impracticable)
   RCTREQUIRED_INLINE
-  const T& get() const {
+  const T &get() const
+  {
     return _t;
   }
   RCTREQUIRED_INLINE
-  T& get() {
+  T &get()
+  {
     return _t;
   }
 
   // Implicit conversion
   RCTREQUIRED_INLINE
-  operator T() const {
+  operator T() const
+  {
     return _t;
   }
   RCTREQUIRED_INLINE
-  operator T&() {
+  operator T &()
+  {
     return _t;
   }
 

package/Libraries/Settings/RCTSettingsManager.mm

@@ -39,7 +39,7 @@ RCT_EXPORT_MODULE()
 
 - (instancetype)initWithUserDefaults:(NSUserDefaults *)defaults
 {
-  if ((self = [super init])) {
+  if ((self = [super init]) != nullptr) {
     _defaults = defaults;
 
     [[NSNotificationCenter defaultCenter] addObserver:self
@@ -84,7 +84,7 @@ RCT_EXPORT_METHOD(setValues : (NSDictionary *)values)
   _ignoringUpdates = YES;
   [values enumerateKeysAndObjectsUsingBlock:^(NSString *key, id json, BOOL *stop) {
     id plist = [RCTConvert NSPropertyList:json];
-    if (plist) {
+    if (plist != nullptr) {
       [self->_defaults setObject:plist forKey:key];
     } else {
       [self->_defaults removeObjectForKey:key];

package/Libraries/StyleSheet/StyleSheetTypes.d.ts

@@ -373,7 +373,7 @@ export type GradientValue = {
   direction?: string | undefined;
   colorStops: ReadonlyArray<{
     color: ColorValue | null;
-    positions?: ReadonlyArray<string[]> | undefined;
+    positions?: ReadonlyArray<string> | undefined;
   }>;
 };
 

package/Libraries/StyleSheet/StyleSheetTypes.js

@@ -780,6 +780,43 @@ type RadialGradientValue = {
 
 export type BackgroundImageValue = LinearGradientValue | RadialGradientValue;
 
+export type BackgroundSizeValue =
+  | {
+      x: string | number,
+      y: string | number,
+    }
+  | 'cover'
+  | 'contain';
+
+export type BackgroundRepeatKeyword =
+  | 'repeat'
+  | 'space'
+  | 'round'
+  | 'no-repeat';
+
+export type BackgroundPositionValue =
+  | {
+      top: number | string,
+      left: number | string,
+    }
+  | {
+      top: number | string,
+      right: number | string,
+    }
+  | {
+      bottom: number | string,
+      left: number | string,
+    }
+  | {
+      bottom: number | string,
+      right: number | string,
+    };
+
+export type BackgroundRepeatValue = {
+  x: BackgroundRepeatKeyword,
+  y: BackgroundRepeatKeyword,
+};
+
 export type BoxShadowValue = {
   offsetX: number | string,
   offsetY: number | string,
@@ -854,6 +891,13 @@ export type ____ViewStyle_InternalBase = $ReadOnly<{
   filter?: $ReadOnlyArray<FilterFunction> | string,
   mixBlendMode?: ____BlendMode_Internal,
   experimental_backgroundImage?: $ReadOnlyArray<BackgroundImageValue> | string,
+  experimental_backgroundSize?: $ReadOnlyArray<BackgroundSizeValue> | string,
+  experimental_backgroundPosition?:
+    | $ReadOnlyArray<BackgroundPositionValue>
+    | string,
+  experimental_backgroundRepeat?:
+    | $ReadOnlyArray<BackgroundRepeatValue>
+    | string,
   isolation?: 'auto' | 'isolate',
 }>;
 

package/Libraries/StyleSheet/processBackgroundPosition.js

@@ -0,0 +1,284 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+'use strict';
+import type {BackgroundPositionValue} from './StyleSheetTypes';
+
+export default function processBackgroundPosition(
+  backgroundPosition: ?($ReadOnlyArray<BackgroundPositionValue> | string),
+): $ReadOnlyArray<BackgroundPositionValue> {
+  let result: $ReadOnlyArray<BackgroundPositionValue> = [];
+
+  if (backgroundPosition == null) {
+    return [];
+  }
+  if (typeof backgroundPosition === 'string') {
+    result = parseBackgroundPositionCSSString(
+      backgroundPosition.replace(/\n/g, ' '),
+    );
+  } else if (Array.isArray(backgroundPosition)) {
+    result = backgroundPosition;
+  }
+
+  return result;
+}
+
+// https://www.w3.org/TR/css-backgrounds-3/#typedef-bg-position
+const parseBackgroundPositionCSSString = (
+  backgroundPosition: string,
+): $ReadOnlyArray<BackgroundPositionValue> => {
+  const result: Array<BackgroundPositionValue> = [];
+  const positions = backgroundPosition.split(',').map(s => s.trim());
+
+  for (const position of positions) {
+    let top: string | number;
+    let left: string | number;
+    let right: string | number;
+    let bottom: string | number;
+    const parts = position.split(/\s+/).filter(p => p.length > 0);
+    // 1. Single value syntax [ left | center | right | top | bottom | <length-percentage> ]
+    if (parts.length === 1) {
+      const t1 = parts[0];
+      if (t1 == null) {
+        return [];
+      }
+      const token1 = t1.toLowerCase().trim();
+      if (token1 === 'left') {
+        left = '0%';
+        top = '50%';
+      } else if (token1 === 'center') {
+        left = '50%';
+        top = '50%';
+      } else if (token1 === 'right') {
+        left = '100%';
+        top = '50%';
+      } else if (token1 === 'top') {
+        left = '50%';
+        top = '0%';
+      } else if (token1 === 'bottom') {
+        left = '50%';
+        top = '100%';
+      } else if (isValidPosition(token1)) {
+        const value = getPositionFromCSSValue(token1);
+        if (value == null) {
+          return [];
+        }
+        left = value;
+        top = '50%';
+      }
+    }
+
+    // 2. Two value syntax [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ]
+    if (parts.length === 2) {
+      const t1 = parts[0];
+      const t2 = parts[1];
+      if (t1 == null || t2 == null) {
+        return [];
+      }
+      const token1 = t1.toLowerCase().trim();
+      if (token1 === 'left') {
+        left = '0%';
+      } else if (token1 === 'center') {
+        left = '50%';
+      } else if (token1 === 'right') {
+        left = '100%';
+      } else if (token1 === 'top') {
+        top = '0%';
+      } else if (token1 === 'bottom') {
+        top = '100%';
+      } else if (isValidPosition(token1)) {
+        const value = getPositionFromCSSValue(token1);
+        if (value == null) {
+          return [];
+        }
+        left = value;
+      }
+
+      const token2 = t2.toLowerCase().trim();
+      if (token2 === 'top') {
+        top = '0%';
+      } else if (token2 === 'center') {
+        top = '50%';
+      } else if (token2 === 'bottom') {
+        top = '100%';
+      } else if (token2 === 'left') {
+        left = '0%';
+      } else if (token2 === 'right') {
+        left = '100%';
+      } else if (isValidPosition(token2)) {
+        const value = getPositionFromCSSValue(token2);
+        if (value == null) {
+          return [];
+        }
+        top = value;
+      }
+    }
+
+    // 3. Three value syntax [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ]
+    if (parts.length === 3) {
+      const t1 = parts[0];
+      const t2 = parts[1];
+      const t3 = parts[2];
+      if (t1 == null || t2 == null || t3 == null) {
+        return [];
+      }
+      const token1 = t1.toLowerCase().trim();
+      const token2 = t2.toLowerCase().trim();
+      const token3 = t3.toLowerCase().trim();
+      // e.g. center top 40%
+      if (token1 === 'center') {
+        left = '50%';
+        const value = getPositionFromCSSValue(token3);
+        if (value == null) {
+          return [];
+        }
+        if (token2 === 'top') {
+          top = value;
+        } else if (token2 === 'bottom') {
+          bottom = value;
+        } else {
+          return [];
+        }
+      }
+      // e.g. left 40% center
+      else if (token3 === 'center') {
+        top = '50%';
+        const value = getPositionFromCSSValue(token2);
+        if (value == null) {
+          return [];
+        }
+        if (token1 === 'left') {
+          left = value;
+        } else if (token1 === 'right') {
+          right = value;
+        } else {
+          return [];
+        }
+      }
+      // e.g. left 40% top, left top 10%
+      else {
+        const tokens = [token1, token2, token3];
+        for (let i = 0; i < tokens.length; i++) {
+          const token = tokens[i];
+          if (isValidPosition(token)) {
+            const value = getPositionFromCSSValue(token);
+            if (value == null) {
+              return [];
+            }
+            const previousToken = tokens[i - 1];
+            if (previousToken === 'left') {
+              left = value;
+            } else if (previousToken === 'right') {
+              right = value;
+            } else if (previousToken === 'top') {
+              top = value;
+            } else if (previousToken === 'bottom') {
+              bottom = value;
+            }
+          } else {
+            if (token === 'left') {
+              left = '0%';
+            } else if (token === 'right') {
+              right = '0%';
+            } else if (token === 'top') {
+              top = '0%';
+            } else if (token === 'bottom') {
+              bottom = '0%';
+            } else {
+              return [];
+            }
+          }
+        }
+      }
+    }
+
+    // 4. Four value syntax [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ]
+    if (parts.length === 4) {
+      const t1 = parts.shift();
+      const t2 = parts.shift();
+      const t3 = parts.shift();
+      const t4 = parts.shift();
+      if (t1 == null || t2 == null || t3 == null || t4 == null) {
+        return [];
+      }
+      const token1 = t1.toLowerCase().trim();
+      const token2 = t2.toLowerCase().trim();
+      const token3 = t3.toLowerCase().trim();
+      const token4 = t4.toLowerCase().trim();
+      const keyword1 = token1;
+      const value1 = getPositionFromCSSValue(token2);
+      const keyword2 = token3;
+      const value2 = getPositionFromCSSValue(token4);
+      if (value1 == null || value2 == null) {
+        return [];
+      }
+      if (keyword1 === 'left') {
+        left = value1;
+      } else if (keyword1 === 'right') {
+        right = value1;
+      }
+
+      if (keyword2 === 'top') {
+        top = value2;
+      } else if (keyword2 === 'bottom') {
+        bottom = value2;
+      }
+    }
+
+    if (top != null && left != null) {
+      result.push({
+        top,
+        left,
+      });
+    } else if (bottom != null && right != null) {
+      result.push({
+        bottom,
+        right,
+      });
+    } else if (top != null && right != null) {
+      result.push({
+        top,
+        right,
+      });
+    } else if (bottom != null && left != null) {
+      result.push({
+        bottom,
+        left,
+      });
+    } else {
+      return [];
+    }
+  }
+
+  return result;
+};
+
+function getPositionFromCSSValue(position: string) {
+  if (position.endsWith('px')) {
+    return parseFloat(position);
+  }
+
+  if (position.endsWith('%')) {
+    return position;
+  }
+
+  // CSS length allows 0 as a valid value
+  if (position === '0') {
+    return 0;
+  }
+}
+
+function isValidPosition(position: string) {
+  if (position.endsWith('px') || position.endsWith('%') || position === '0') {
+    return true;
+  }
+
+  return false;
+}

package/Libraries/StyleSheet/processBackgroundRepeat.js

@@ -0,0 +1,105 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+'use strict';
+
+import type {
+  BackgroundRepeatKeyword,
+  BackgroundRepeatValue,
+} from './StyleSheetTypes';
+
+function isBackgroundRepeatKeyword(
+  value: string,
+): value is BackgroundRepeatKeyword {
+  return (
+    value === 'repeat' ||
+    value === 'space' ||
+    value === 'round' ||
+    value === 'no-repeat'
+  );
+}
+
+export default function processBackgroundRepeat(
+  backgroundRepeat: ?($ReadOnlyArray<BackgroundRepeatValue> | string),
+): $ReadOnlyArray<BackgroundRepeatValue> {
+  let result: $ReadOnlyArray<BackgroundRepeatValue> = [];
+  if (backgroundRepeat == null) {
+    return [];
+  }
+
+  if (Array.isArray(backgroundRepeat)) {
+    return backgroundRepeat;
+  }
+
+  if (typeof backgroundRepeat === 'string') {
+    result = parseBackgroundRepeatCSSString(
+      backgroundRepeat.replace(/\n/g, ' '),
+    );
+  }
+
+  return result;
+}
+
+// https://www.w3.org/TR/css-backgrounds-3/#typedef-repeat-style
+function parseBackgroundRepeatCSSString(
+  backgroundRepeat: string,
+): $ReadOnlyArray<BackgroundRepeatValue> {
+  const result: Array<BackgroundRepeatValue> = [];
+  const bgRepeatArray = backgroundRepeat.split(',').map(s => s.trim());
+
+  for (const bgRepeat of bgRepeatArray) {
+    if (bgRepeat.length === 0) {
+      return [];
+    }
+
+    const parts = bgRepeat.split(/\s+/).filter(p => p.length > 0);
+    if (parts.length === 1) {
+      const part1 = parts[0];
+      if (part1 == null) {
+        return [];
+      }
+      const token1 = part1.toLowerCase();
+      if (token1 === 'repeat-x') {
+        result.push({x: 'repeat', y: 'no-repeat'});
+      } else if (token1 === 'repeat-y') {
+        result.push({x: 'no-repeat', y: 'repeat'});
+      } else if (token1 === 'repeat') {
+        result.push({x: 'repeat', y: 'repeat'});
+      } else if (token1 === 'space') {
+        result.push({x: 'space', y: 'space'});
+      } else if (token1 === 'round') {
+        result.push({x: 'round', y: 'round'});
+      } else if (token1 === 'no-repeat') {
+        result.push({x: 'no-repeat', y: 'no-repeat'});
+      } else {
+        return [];
+      }
+    } else if (parts.length === 2) {
+      const part1 = parts[0];
+      const part2 = parts[1];
+      if (part1 == null || part2 == null) {
+        return [];
+      }
+      const token1 = part1.toLowerCase();
+      const token2 = part2.toLowerCase();
+
+      if (
+        isBackgroundRepeatKeyword(token1) &&
+        isBackgroundRepeatKeyword(token2)
+      ) {
+        result.push({x: token1, y: token2});
+      } else {
+        return [];
+      }
+    }
+  }
+
+  return result;
+}

package/Libraries/StyleSheet/processBackgroundSize.js

@@ -0,0 +1,104 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+'use strict';
+
+import type {BackgroundSizeValue} from './StyleSheetTypes';
+
+export default function processBackgroundSize(
+  backgroundSize: ?($ReadOnlyArray<BackgroundSizeValue> | string),
+): $ReadOnlyArray<BackgroundSizeValue> {
+  let result: $ReadOnlyArray<BackgroundSizeValue> = [];
+
+  if (backgroundSize == null) {
+    // If the size is invalid, return an empty array and do not apply any background size. Same as web.
+    return [];
+  }
+
+  if (typeof backgroundSize === 'string') {
+    result = parseBackgroundSizeCSSString(backgroundSize.replace(/\n/g, ' '));
+  } else if (Array.isArray(backgroundSize)) {
+    result = backgroundSize;
+  }
+
+  return result;
+}
+// https://www.w3.org/TR/css-backgrounds-3/#typedef-bg-size
+// <bg-size> = [ <length-percentage [0,∞]> | auto ]{1,2} | cover | contain
+function parseBackgroundSizeCSSString(
+  backgroundSize: string,
+): $ReadOnlyArray<BackgroundSizeValue> {
+  const result: Array<BackgroundSizeValue> = [];
+  const sizes = backgroundSize.split(',').map(s => s.trim());
+
+  for (const size of sizes) {
+    if (size.length === 0) {
+      return [];
+    }
+
+    const parts = size.split(/\s+/).filter(p => p.length > 0);
+
+    if (parts.length === 2) {
+      const x = getValidLengthPercentageSizeOrNull(parts[0].toLowerCase());
+      const y = getValidLengthPercentageSizeOrNull(parts[1].toLowerCase());
+      if (x != null && y != null) {
+        result.push({
+          x,
+          y,
+        });
+      } else {
+        return [];
+      }
+    } else if (parts.length === 1) {
+      const part = parts[0].toLowerCase();
+      if (part === 'cover' || part === 'contain') {
+        result.push(part);
+      } else {
+        const x = getValidLengthPercentageSizeOrNull(parts[0].toLowerCase());
+        if (x != null) {
+          result.push({
+            x,
+            y: 'auto',
+          });
+        } else {
+          return [];
+        }
+      }
+    }
+  }
+
+  return result;
+}
+
+// [ <length-percentage [0,∞]> | auto ]
+function getValidLengthPercentageSizeOrNull(size: ?string) {
+  if (size == null) {
+    return null;
+  }
+
+  if (size.endsWith('px')) {
+    const num = parseFloat(size);
+    if (!Number.isNaN(num) && num >= 0) {
+      return num;
+    }
+  }
+
+  if (size.endsWith('%')) {
+    if (parseFloat(size) >= 0) {
+      return size;
+    }
+  }
+
+  if (size === 'auto') {
+    return size;
+  }
+
+  return null;
+}

package/Libraries/Text/BaseText/RCTBaseTextShadowView.h

@@ -7,7 +7,7 @@
 
 #import <React/RCTShadowView.h>
 
-#ifndef RCT_FIT_RM_OLD_COMPONENT
+#ifndef RCT_REMOVE_LEGACY_ARCH
 
 #import "RCTTextAttributes.h"
 
@@ -32,4 +32,4 @@ __attribute__((deprecated("This API will be removed along with the legacy archit
 
 NS_ASSUME_NONNULL_END
 
-#endif // RCT_FIT_RM_OLD_COMPONENT
+#endif // RCT_REMOVE_LEGACY_ARCH

package/Libraries/Text/BaseText/RCTBaseTextShadowView.mm

@@ -7,7 +7,7 @@
 
 #import <React/RCTBaseTextShadowView.h>
 
-#ifndef RCT_FIT_RM_OLD_COMPONENT
+#ifndef RCT_REMOVE_LEGACY_ARCH
 
 #import <React/RCTShadowView+Layout.h>
 
@@ -159,4 +159,4 @@ static void RCTInlineViewYogaNodeDirtied(YGNodeConstRef node)
 
 @end
 
-#endif // RCT_FIT_RM_OLD_COMPONENT
+#endif // RCT_REMOVE_LEGACY_ARCH