@office-iss/react-native-win32 0.76.0-preview.1 → 0.76.0-preview.2

package/CHANGELOG.json

@@ -2,7 +2,34 @@
   "name": "@office-iss/react-native-win32",
   "entries": [
     {
-      "date": "Mon, 30 Sep 2024 21:36:50 GMT",
+      "date": "Fri, 11 Oct 2024 20:16:43 GMT",
+      "version": "0.76.0-preview.2",
+      "tag": "@office-iss/react-native-win32_v0.76.0-preview.2",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "jthysell@microsoft.com",
+            "package": "@office-iss/react-native-win32",
+            "commit": "9614bfe01650f577bf573989faecac1d0989c93d",
+            "comment": "Update to @react-native-community/cli@15.0.0-alpha.2"
+          },
+          {
+            "author": "email not defined",
+            "package": "@office-iss/react-native-win32",
+            "commit": "6e76721bda69d1c8603a211729b89056743eb01f",
+            "comment": "integrate RN 0.76.0-rc3"
+          },
+          {
+            "author": "email not defined",
+            "package": "@office-iss/react-native-win32",
+            "commit": "c1536386579b67da32092327aacbb821730dab02",
+            "comment": "integrate 0.76.0-rc.4"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Mon, 30 Sep 2024 23:20:39 GMT",
       "version": "0.76.0-preview.1",
       "tag": "@office-iss/react-native-win32_v0.76.0-preview.1",
       "comments": {

package/CHANGELOG.md

@@ -1,17 +1,27 @@
 # Change Log - @office-iss/react-native-win32
 
-<!-- This log was last generated on Mon, 30 Sep 2024 21:36:50 GMT and should not be manually modified. -->
+<!-- This log was last generated on Fri, 11 Oct 2024 20:16:43 GMT and should not be manually modified. -->
 
 <!-- Start content -->
 
-## 0.76.0-preview.1
+## 0.76.0-preview.2
 
-Mon, 30 Sep 2024 21:36:50 GMT
+Fri, 11 Oct 2024 20:16:43 GMT
 
 ### Changes
 
-- Promote 0.76 to preview (tatianakapos@microsoft.com)
+- Update to @react-native-community/cli@15.0.0-alpha.2 (jthysell@microsoft.com)
+- integrate RN 0.76.0-rc3 (email not defined)
+- integrate 0.76.0-rc.4 (email not defined)
 
+## 0.76.0-preview.1
+
+Mon, 30 Sep 2024 23:20:39 GMT
+
+### Changes
+
+- Promote 0.76 to preview (tatianakapos@microsoft.com)
+
 ## 0.0.0-canary.263
 
 Thu, 26 Sep 2024 17:38:26 GMT

package/Libraries/Components/Keyboard/KeyboardAvoidingView.js

@@ -9,6 +9,7 @@
  */
 
 import type {ViewStyleProp} from '../../StyleSheet/StyleSheet';
+import type {DimensionsPayload} from '../../Utilities/NativeDeviceInfo';
 import type {
   ViewLayout,
   ViewLayoutEvent,
@@ -18,6 +19,7 @@ import type {KeyboardEvent, KeyboardMetrics} from './Keyboard';
 
 import LayoutAnimation from '../../LayoutAnimation/LayoutAnimation';
 import StyleSheet from '../../StyleSheet/StyleSheet';
+import Dimensions from '../../Utilities/Dimensions';
 import Platform from '../../Utilities/Platform';
 import {type EventSubscription} from '../../vendor/emitter/EventEmitter';
 import AccessibilityInfo from '../AccessibilityInfo/AccessibilityInfo';
@@ -66,6 +68,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
   viewRef: {current: React.ElementRef<typeof View> | null, ...};
   _initialFrameHeight: number = 0;
   _bottom: number = 0;
+  _windowWidth: number = Dimensions.get('window').width;
 
   constructor(props: Props) {
     super(props);
@@ -130,6 +133,10 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
     }
   };
 
+  _onDimensionsChange = ({window}: DimensionsPayload) => {
+    this._windowWidth = window?.width ?? 0;
+  };
+
   // Avoid unnecessary renders if the KeyboardAvoidingView is disabled.
   _setBottom = (value: number) => {
     const enabled = this.props.enabled ?? true;
@@ -145,6 +152,15 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
       return;
     }
 
+    if (
+      Platform.OS === 'ios' &&
+      this._windowWidth !== this._keyboardEvent.endCoordinates.width
+    ) {
+      // The keyboard is not the standard bottom-of-the-screen keyboard. For example, floating keyboard on iPadOS.
+      this._setBottom(0);
+      return;
+    }
+
     const {duration, easing, endCoordinates} = this._keyboardEvent;
     const height = await this._relativeKeyboardHeight(endCoordinates);
 
@@ -178,6 +194,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
     if (Platform.OS === 'ios') {
       this._subscriptions = [
         Keyboard.addListener('keyboardWillChangeFrame', this._onKeyboardChange),
+        Dimensions.addEventListener('change', this._onDimensionsChange),
       ];
     } else {
       this._subscriptions = [

package/Libraries/Components/ScrollView/ScrollViewNativeComponent.js

@@ -160,6 +160,9 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           snapToInterval: true,
           snapToOffsets: true,
           snapToStart: true,
+          verticalScrollIndicatorInsets: {
+            diff: require('../../Utilities/differ/insetsDiffer'),
+          },
           zoomScale: true,
           ...ConditionallyIgnoredEventHandlers({
             onScrollBeginDrag: true,

package/Libraries/Components/TextInput/RCTTextInputViewConfig.js

@@ -85,8 +85,15 @@ const RCTTextInputViewConfig = {
     topContentSizeChange: {
       registrationName: 'onContentSizeChange',
     },
+    topChangeSync: {
+      registrationName: 'onChangeSync',
+    },
+    topKeyPressSync: {
+      registrationName: 'onKeyPressSync',
+    },
   },
   validAttributes: {
+    dynamicTypeRamp: true,
     fontSize: true,
     fontWeight: true,
     fontVariant: true,
@@ -97,6 +104,7 @@ const RCTTextInputViewConfig = {
     textTransform: true,
     textAlign: true,
     fontFamily: true,
+    lineBreakModeIOS: true,
     lineHeight: true,
     isHighlighted: true,
     writingDirection: true,
@@ -150,6 +158,8 @@ const RCTTextInputViewConfig = {
       onSelectionChange: true,
       onContentSizeChange: true,
       onScroll: true,
+      onChangeSync: true,
+      onKeyPressSync: true,
     }),
   },
 };

package/Libraries/Components/View/ReactNativeStyleAttributes.js

@@ -120,7 +120,7 @@ const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   /**
    * Filter
    */
-  experimental_filter: {process: processFilter},
+  filter: {process: processFilter},
 
   /**
    * MixBlendMode
@@ -135,7 +135,7 @@ const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   /*
    * BoxShadow
    */
-  experimental_boxShadow: {process: processBoxShadow},
+  boxShadow: {process: processBoxShadow},
 
   /**
    * Linear Gradient

package/Libraries/Core/ReactNativeVersion.js

@@ -17,7 +17,7 @@ const version: $ReadOnly<{
   major: 0,
   minor: 76,
   patch: 0,
-  prerelease: 'rc.0',
+  prerelease: 'rc.4',
 };
 
 module.exports = {version};

package/Libraries/Core/setUpDeveloperTools.js

@@ -42,9 +42,13 @@ if (__DEV__) {
   if (!Platform.isTesting) {
     const HMRClient = require('../Utilities/HMRClient');
 
+    // [0.76 only] When under React Native DevTools, log "JavaScript logs will
+    // be removed from Metro..." warning, and continue to forward logs.
     if (global.__FUSEBOX_HAS_FULL_CONSOLE_SUPPORT__) {
       HMRClient.unstable_notifyFuseboxConsoleEnabled();
-    } else if (console._isPolyfilled) {
+    }
+
+    if (console._isPolyfilled) {
       // We assume full control over the console and send JavaScript logs to Metro.
       [
         'trace',

package/Libraries/NativeComponent/BaseViewConfig.android.js

@@ -169,10 +169,10 @@ const validAttributesForNonEventProps = {
   experimental_backgroundImage: {
     process: require('../StyleSheet/processBackgroundImage').default,
   },
-  experimental_boxShadow: {
+  boxShadow: {
     process: require('../StyleSheet/processBoxShadow').default,
   },
-  experimental_filter: {
+  filter: {
     process: require('../StyleSheet/processFilter').default,
   },
   experimental_mixBlendMode: true,

package/Libraries/NativeComponent/BaseViewConfig.ios.js

@@ -198,6 +198,7 @@ const validAttributesForNonEventProps = {
   testID: true,
   backgroundColor: {process: require('../StyleSheet/processColor').default},
   backfaceVisibility: true,
+  cursor: true,
   opacity: true,
   shadowColor: {process: require('../StyleSheet/processColor').default},
   shadowOffset: {diff: require('../Utilities/differ/sizesDiffer')},
@@ -216,16 +217,18 @@ const validAttributesForNonEventProps = {
   role: true,
   borderRadius: true,
   borderColor: {process: require('../StyleSheet/processColor').default},
+  borderBlockColor: {process: require('../StyleSheet/processColor').default},
   borderCurve: true,
   borderWidth: true,
+  borderBlockWidth: true,
   borderStyle: true,
   hitSlop: {diff: require('../Utilities/differ/insetsDiffer')},
   collapsable: true,
   collapsableChildren: true,
-  experimental_filter: {
+  filter: {
     process: require('../StyleSheet/processFilter').default,
   },
-  experimental_boxShadow: {
+  boxShadow: {
     process: require('../StyleSheet/processBoxShadow').default,
   },
   experimental_mixBlendMode: true,
@@ -240,9 +243,15 @@ const validAttributesForNonEventProps = {
   borderLeftWidth: true,
   borderLeftColor: {process: require('../StyleSheet/processColor').default},
   borderStartWidth: true,
+  borderBlockStartWidth: true,
   borderStartColor: {process: require('../StyleSheet/processColor').default},
+  borderBlockStartColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
   borderEndWidth: true,
+  borderBlockEndWidth: true,
   borderEndColor: {process: require('../StyleSheet/processColor').default},
+  borderBlockEndColor: {process: require('../StyleSheet/processColor').default},
 
   borderTopLeftRadius: true,
   borderTopRightRadius: true,

package/Libraries/NativeComponent/BaseViewConfig.win32.js

@@ -198,6 +198,7 @@ const validAttributesForNonEventProps = {
   testID: true,
   backgroundColor: {process: require('../StyleSheet/processColor').default},
   backfaceVisibility: true,
+  cursor: true,
   opacity: true,
   shadowColor: {process: require('../StyleSheet/processColor').default},
   shadowOffset: {diff: require('../Utilities/differ/sizesDiffer')},
@@ -216,16 +217,18 @@ const validAttributesForNonEventProps = {
   role: true,
   borderRadius: true,
   borderColor: {process: require('../StyleSheet/processColor').default},
+  borderBlockColor: {process: require('../StyleSheet/processColor').default},
   borderCurve: true,
   borderWidth: true,
+  borderBlockWidth: true,
   borderStyle: true,
   hitSlop: {diff: require('../Utilities/differ/insetsDiffer')},
   collapsable: true,
   collapsableChildren: true,
-  experimental_filter: {
+  filter: {
     process: require('../StyleSheet/processFilter').default,
   },
-  experimental_boxShadow: {
+  boxShadow: {
     process: require('../StyleSheet/processBoxShadow').default,
   },
   experimental_mixBlendMode: true,
@@ -240,9 +243,15 @@ const validAttributesForNonEventProps = {
   borderLeftWidth: true,
   borderLeftColor: {process: require('../StyleSheet/processColor').default},
   borderStartWidth: true,
+  borderBlockStartWidth: true,
   borderStartColor: {process: require('../StyleSheet/processColor').default},
+  borderBlockStartColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
   borderEndWidth: true,
+  borderBlockEndWidth: true,
   borderEndColor: {process: require('../StyleSheet/processColor').default},
+  borderBlockEndColor: {process: require('../StyleSheet/processColor').default},
 
   borderTopLeftRadius: true,
   borderTopRightRadius: true,

package/Libraries/ReactNative/getNativeComponentAttributes.js

@@ -188,6 +188,10 @@ function getProcessorForType(typeName: string): ?(nextProp: any) => any {
     case 'UIImage':
     case 'RCTImageSource':
       return resolveAssetSource;
+    case 'BoxShadowArray':
+      return processBoxShadow;
+    case 'FilterArray':
+      return processFilter;
     // Android Types
     case 'Color':
       return processColor;

package/Libraries/StyleSheet/StyleSheetTypes.d.ts

@@ -110,11 +110,102 @@ export interface FlexStyle {
   top?: DimensionValue | undefined;
   width?: DimensionValue | undefined;
   zIndex?: number | undefined;
+  direction?: 'inherit' | 'ltr' | 'rtl' | undefined;
 
   /**
-   * @platform ios
+   * Equivalent to `top`, `bottom`, `right` and `left`
    */
-  direction?: 'inherit' | 'ltr' | 'rtl' | undefined;
+  inset?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `top`, `bottom`
+   */
+  insetBlock?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `bottom`
+   */
+  insetBlockEnd?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `top`
+   */
+  insetBlockStart?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `right` and `left`
+   */
+  insetInline?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `right` or `left`
+   */
+  insetInlineEnd?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `right` or `left`
+   */
+  insetInlineStart?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `marginVertical`
+   */
+  marginBlock?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `marginBottom`
+   */
+  marginBlockEnd?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `marginTop`
+   */
+  marginBlockStart?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `marginHorizontal`
+   */
+  marginInline?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `marginEnd`
+   */
+  marginInlineEnd?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `marginStart`
+   */
+  marginInlineStart?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `paddingVertical`
+   */
+  paddingBlock?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `paddingBottom`
+   */
+  paddingBlockEnd?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `paddingTop`
+   */
+  paddingBlockStart?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `paddingHorizontal`
+   */
+  paddingInline?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `paddingEnd`
+   */
+  paddingInlineEnd?: DimensionValue | undefined;
+
+  /**
+   * Equivalent to `paddingStart`
+   */
+  paddingInlineStart?: DimensionValue | undefined;
 }
 
 export interface ShadowStyleIOS {
@@ -239,16 +330,16 @@ export type FilterFunction =
   | {opacity: number | string}
   | {saturate: number | string}
   | {sepia: number | string}
-  | {dropShadow: DropShadowPrimitive | string};
+  | {dropShadow: DropShadowValue | string};
 
-export type DropShadowPrimitive = {
+export type DropShadowValue = {
   offsetX: number | string;
   offsetY: number | string;
   standardDeviation?: number | string | undefined;
   color?: ColorValue | number | undefined;
 };
 
-export type BoxShadowPrimitive = {
+export type BoxShadowValue = {
   offsetX: number | string;
   offsetY: number | string;
   color?: string | undefined;
@@ -336,6 +427,8 @@ export interface ViewStyle extends FlexStyle, ShadowStyleIOS, TransformsStyle {
   pointerEvents?: 'box-none' | 'none' | 'box-only' | 'auto' | undefined;
   isolation?: 'auto' | 'isolate' | undefined;
   cursor?: CursorValue | undefined;
+  boxShadow?: ReadonlyArray<BoxShadowValue> | string | undefined;
+  filter?: ReadonlyArray<FilterFunction> | string | undefined;
 }
 
 export type FontVariant =

package/Libraries/StyleSheet/StyleSheetTypes.js

@@ -700,9 +700,9 @@ export type FilterFunction =
   | {opacity: number | string}
   | {saturate: number | string}
   | {sepia: number | string}
-  | {dropShadow: DropShadowPrimitive | string};
+  | {dropShadow: DropShadowValue | string};
 
-export type DropShadowPrimitive = {
+export type DropShadowValue = {
   offsetX: number | string,
   offsetY: number | string,
   standardDeviation?: number | string,
@@ -719,7 +719,7 @@ export type GradientValue = {
   }>,
 };
 
-export type BoxShadowPrimitive = {
+export type BoxShadowValue = {
   offsetX: number | string,
   offsetY: number | string,
   color?: ____ColorValue_Internal,
@@ -788,8 +788,8 @@ export type ____ViewStyle_InternalCore = $ReadOnly<{
   elevation?: number,
   pointerEvents?: 'auto' | 'none' | 'box-none' | 'box-only',
   cursor?: CursorValue,
-  experimental_boxShadow?: $ReadOnlyArray<BoxShadowPrimitive> | string,
-  experimental_filter?: $ReadOnlyArray<FilterFunction> | string,
+  boxShadow?: $ReadOnlyArray<BoxShadowValue> | string,
+  filter?: $ReadOnlyArray<FilterFunction> | string,
   experimental_mixBlendMode?: ____BlendMode_Internal,
   experimental_backgroundImage?: $ReadOnlyArray<GradientValue> | string,
   isolation?: 'auto' | 'isolate',

package/Libraries/StyleSheet/processBoxShadow.js

@@ -10,7 +10,7 @@
  */
 
 import type {ProcessedColorValue} from './processColor';
-import type {BoxShadowPrimitive} from './StyleSheetTypes';
+import type {BoxShadowValue} from './StyleSheetTypes';
 
 import processColor from './processColor';
 
@@ -24,7 +24,7 @@ export type ParsedBoxShadow = {
 };
 
 export default function processBoxShadow(
-  rawBoxShadows: ?($ReadOnlyArray<BoxShadowPrimitive> | string),
+  rawBoxShadows: ?($ReadOnlyArray<BoxShadowValue> | string),
 ): Array<ParsedBoxShadow> {
   const result: Array<ParsedBoxShadow> = [];
   if (rawBoxShadows == null) {
@@ -106,16 +106,14 @@ export default function processBoxShadow(
   return result;
 }
 
-function parseBoxShadowString(
-  rawBoxShadows: string,
-): Array<BoxShadowPrimitive> {
-  let result: Array<BoxShadowPrimitive> = [];
+function parseBoxShadowString(rawBoxShadows: string): Array<BoxShadowValue> {
+  let result: Array<BoxShadowValue> = [];
 
   for (const rawBoxShadow of rawBoxShadows
     .split(/,(?![^()]*\))/) // split by comma that is not in parenthesis
     .map(bS => bS.trim())
     .filter(bS => bS !== '')) {
-    const boxShadow: BoxShadowPrimitive = {
+    const boxShadow: BoxShadowValue = {
       offsetX: 0,
       offsetY: 0,
     };

package/Libraries/StyleSheet/processFilter.js

@@ -12,7 +12,7 @@
 'use strict';
 
 import type {ColorValue} from './StyleSheet';
-import type {DropShadowPrimitive, FilterFunction} from './StyleSheetTypes';
+import type {DropShadowValue, FilterFunction} from './StyleSheetTypes';
 
 import processColor from './processColor';
 
@@ -179,7 +179,7 @@ function _getFilterAmount(filterName: string, filterArgs: mixed): ?number {
 }
 
 function parseDropShadow(
-  rawDropShadow: string | DropShadowPrimitive,
+  rawDropShadow: string | DropShadowValue,
 ): ?ParsedDropShadow {
   const dropShadow =
     typeof rawDropShadow === 'string'
@@ -248,8 +248,8 @@ function parseDropShadow(
   return parsedDropShadow;
 }
 
-function parseDropShadowString(rawDropShadow: string): ?DropShadowPrimitive {
-  const dropShadow: DropShadowPrimitive = {
+function parseDropShadowString(rawDropShadow: string): ?DropShadowValue {
+  const dropShadow: DropShadowValue = {
     offsetX: 0,
     offsetY: 0,
   };

package/Libraries/Utilities/HMRClient.js

@@ -153,11 +153,12 @@ const HMRClient: HMRClientNativeInterface = {
         level: 'info',
         data: [
           '\n' +
-            '\x1b[7m' +
-            ' \x1b[1mJavaScript logs have moved!\x1b[22m They will now appear in the debugger console. ' +
-            'Tip: Type \x1b[1mj\x1b[22m in the terminal to open the debugger (requires Google Chrome ' +
-            'or Microsoft Edge).' +
-            '\x1b[27m' +
+            '\u001B[7m' +
+            ' \u001B[1m💡 JavaScript logs will be removed from Metro in React ' +
+            'Native 0.77!\u001B[22m Please use React Native DevTools as your ' +
+            'default tool. Tip: Type \u001B[1mj\u001B[22m in the terminal to ' +
+            'open (requires Google Chrome or Microsoft Edge).' +
+            '\u001B[27m' +
             '\n',
         ],
       }),

package/overrides.json

@@ -7,7 +7,7 @@
     "**/__snapshots__/**",
     "src-win/rntypes/**"
   ],
-  "baseVersion": "0.76.0-rc.0",
+  "baseVersion": "0.76.0-rc.4",
   "overrides": [
     {
       "type": "derived",
@@ -337,7 +337,7 @@
       "type": "derived",
       "file": "src-win/Libraries/NativeComponent/BaseViewConfig.win32.js",
       "baseFile": "packages/react-native/Libraries/NativeComponent/BaseViewConfig.ios.js",
-      "baseHash": "91e7e2aacf6c1559247dccad0c581fde64202bf3"
+      "baseHash": "0b4642542c2865c5cd3d542a82b295a1aca21c1a"
     },
     {
       "type": "copy",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@office-iss/react-native-win32",
-  "version": "0.76.0-preview.1",
+  "version": "0.76.0-preview.2",
   "description": "Implementation of react native on top of Office's Win32 platform.",
   "repository": {
     "type": "git",
@@ -26,21 +26,23 @@
   "dependencies": {
     "@babel/runtime": "^7.0.0",
     "@jest/create-cache-key-function": "^29.6.3",
-    "@react-native-community/cli": "14.0.0",
-    "@react-native-community/cli-platform-android": "14.0.0",
-    "@react-native-community/cli-platform-ios": "14.0.0",
+    "@react-native-community/cli": "15.0.0-alpha.2",
+    "@react-native-community/cli-platform-android": "15.0.0-alpha.2",
+    "@react-native-community/cli-platform-ios": "15.0.0-alpha.2",
     "@react-native/assets": "1.0.0",
-    "@react-native/assets-registry": "0.76.0-rc.0",
-    "@react-native/codegen": "0.76.0-rc.0",
-    "@react-native/community-cli-plugin": "0.76.0-rc.0",
-    "@react-native/gradle-plugin": "0.76.0-rc.0",
-    "@react-native/js-polyfills": "0.76.0-rc.0",
-    "@react-native/normalize-colors": "0.76.0-rc.0",
-    "@react-native/virtualized-lists": "0.76.0-rc.0",
+    "@react-native/assets-registry": "0.76.0-rc.4",
+    "@react-native/codegen": "0.76.0-rc.4",
+    "@react-native/community-cli-plugin": "0.76.0-rc.4",
+    "@react-native/gradle-plugin": "0.76.0-rc.4",
+    "@react-native/js-polyfills": "0.76.0-rc.4",
+    "@react-native/normalize-colors": "0.76.0-rc.4",
+    "@react-native/virtualized-lists": "0.76.0-rc.4",
     "abort-controller": "^3.0.0",
     "anser": "^1.4.9",
     "ansi-regex": "^5.0.0",
     "art": "^0.10.0",
+    "babel-jest": "^29.7.0",
+    "babel-plugin-syntax-hermes-parser": "^0.23.1",
     "base64-js": "^1.5.1",
     "chalk": "^4.0.0",
     "commander": "^12.0.0",
@@ -51,8 +53,8 @@
     "jest-environment-node": "^29.6.3",
     "jsc-android": "^250231.0.0",
     "memoize-one": "^5.0.0",
-    "metro-runtime": "^0.80.10",
-    "metro-source-map": "^0.80.10",
+    "metro-runtime": "^0.81.0-alpha.2",
+    "metro-source-map": "^0.81.0-alpha.2",
     "mkdirp": "^0.5.1",
     "nullthrows": "^1.1.1",
     "pretty-format": "^29.7.0",
@@ -88,14 +90,14 @@
     "just-scripts": "^1.3.3",
     "prettier": "2.8.8",
     "react": "18.3.1",
-    "react-native": "0.76.0-rc.0",
+    "react-native": "0.76.0-rc.4",
     "react-native-platform-override": "^1.9.46",
     "typescript": "5.0.4"
   },
   "peerDependencies": {
     "@types/react": "^18.2.6",
     "react": "^18.2.0",
-    "react-native": "0.76.0-rc.0"
+    "react-native": "0.76.0-rc.4"
   },
   "beachball": {
     "defaultNpmTag": "preview",

package/src/private/components/SafeAreaView_INTERNAL_DO_NOT_USE.js

@@ -13,15 +13,17 @@ import type {ViewProps} from '../../../Libraries/Components/View/ViewPropTypes';
 import Platform from '../../../Libraries/Utilities/Platform';
 import View from '../../../Libraries/Components/View/View';
 import * as React from 'react';
-export * from '../../../src/private/specs/components/RCTSafeAreaViewNativeComponent';
-import RCTSafeAreaViewNativeComponent from '../../../src/private/specs/components/RCTSafeAreaViewNativeComponent';
 
-let exported: React.AbstractComponent<ViewProps, React.ElementRef<typeof View>>;
-
-if (Platform.OS === 'android' || Platform.OS === 'ios') {
-  exported = RCTSafeAreaViewNativeComponent;
-} else {
-  exported = View;
-}
+const exported: React.AbstractComponent<
+  ViewProps,
+  React.ElementRef<typeof View>,
+> = Platform.select({
+  ios: require('../../../src/private/specs/components/RCTSafeAreaViewNativeComponent')
+    .default,
+  android:
+    require('../../../src/private/specs/components/RCTSafeAreaViewNativeComponent')
+      .default,
+  default: View,
+});
 
 export default exported;

package/types/experimental.d.ts

@@ -35,111 +35,11 @@
 import {
   GradientValue,
   BlendMode,
-  BoxShadowPrimitive,
-  DimensionValue,
-  FilterFunction,
 } from 'react-native/Libraries/StyleSheet/StyleSheetTypes';
 
 export {};
 
 declare module '.' {
-  export interface FlexStyle {
-    /**
-     * Equivalent to `top`, `bottom`, `right` and `left`
-     */
-    inset?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `top`, `bottom`
-     */
-    insetBlock?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `bottom`
-     */
-    insetBlockEnd?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `top`
-     */
-    insetBlockStart?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `right` and `left`
-     */
-    insetInline?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `right` or `left`
-     */
-    insetInlineEnd?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `right` or `left`
-     */
-    insetInlineStart?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `marginVertical`
-     */
-    marginBlock?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `marginBottom`
-     */
-    marginBlockEnd?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `marginTop`
-     */
-    marginBlockStart?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `marginHorizontal`
-     */
-    marginInline?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `marginEnd`
-     */
-    marginInlineEnd?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `marginStart`
-     */
-    marginInlineStart?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `paddingVertical`
-     */
-    paddingBlock?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `paddingBottom`
-     */
-    paddingBlockEnd?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `paddingTop`
-     */
-    paddingBlockStart?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `paddingHorizontal`
-     */
-    paddingInline?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `paddingEnd`
-     */
-    paddingInlineEnd?: DimensionValue | undefined;
-
-    /**
-     * Equivalent to `paddingStart`
-     */
-    paddingInlineStart?: DimensionValue | undefined;
-  }
-
   export interface ViewProps {
     /**
      * Contols whether this view, and its transitive children, are laid in a way
@@ -150,11 +50,6 @@ declare module '.' {
   }
 
   export interface ViewStyle {
-    experimental_boxShadow?:
-      | ReadonlyArray<BoxShadowPrimitive>
-      | string
-      | undefined;
-    experimental_filter?: ReadonlyArray<FilterFunction> | string | undefined;
     experimental_mixBlendMode?: BlendMode | undefined;
     experimental_backgroundImage?:
       | ReadonlyArray<GradientValue>