@office-iss/react-native-win32 0.0.0-canary.260 → 0.0.0-canary.262

package/.flowconfig

@@ -54,8 +54,6 @@
 .*/node_modules/sample-apps/.*
 .*/node_modules/playground/.*
 
-; Ignore templates for 'npx @react-native-community/cli init'
-<PROJECT_ROOT>/packages/react-native/template/.*
 <PROJECT_ROOT>/packages/react-native/sdks/.*
 
 ; Ignore the codegen e2e tests
@@ -67,6 +65,9 @@
 ; Ignore "BUCK" generated dirs
 <PROJECT_ROOT>/\.buckd/
 
+; Ignore cache files
+.*/node_modules/.cache*
+
 ; Ignore the src-win folder - flow files are combined with ones from react-native into the root Libraries folder
 .*/react-native-win32/src-win/.*
 
@@ -159,4 +160,4 @@ untyped-import
 untyped-type-import
 
 [version]
-^0.243.0
+^0.245.0

package/CHANGELOG.json

@@ -2,7 +2,43 @@
   "name": "@office-iss/react-native-win32",
   "entries": [
     {
-      "date": "Wed, 28 Aug 2024 05:14:05 GMT",
+      "date": "Sat, 07 Sep 2024 05:13:20 GMT",
+      "version": "0.0.0-canary.262",
+      "tag": "@office-iss/react-native-win32_v0.0.0-canary.262",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "tatianakapos@microsoft.com",
+            "package": "@office-iss/react-native-win32",
+            "commit": "55e32071ac30a673c7830f717fcbd1a3a228dcff",
+            "comment": "switch to optimized text"
+          },
+          {
+            "author": "34109996+chiaramooney@users.noreply.github.com",
+            "package": "@office-iss/react-native-win32",
+            "commit": "409bf6e085cc1aa6421cff078037f7b3774bd8ec",
+            "comment": "Integrate 8/31"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 05 Sep 2024 05:13:45 GMT",
+      "version": "0.0.0-canary.261",
+      "tag": "@office-iss/react-native-win32_v0.0.0-canary.261",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "34109996+chiaramooney@users.noreply.github.com",
+            "package": "@office-iss/react-native-win32",
+            "commit": "277d6f06a3e1bf1650cd9d1e7b4f22e0619968e9",
+            "comment": "Integrate 8/20"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 28 Aug 2024 05:14:44 GMT",
       "version": "0.0.0-canary.260",
       "tag": "@office-iss/react-native-win32_v0.0.0-canary.260",
       "comments": {

package/CHANGELOG.md

@@ -1,17 +1,34 @@
 # Change Log - @office-iss/react-native-win32
 
-This log was last generated on Wed, 28 Aug 2024 05:14:05 GMT and should not be manually modified.
+<!-- This log was last generated on Sat, 07 Sep 2024 05:13:20 GMT and should not be manually modified. -->
 
 <!-- Start content -->
 
-## 0.0.0-canary.260
+## 0.0.0-canary.262
 
-Wed, 28 Aug 2024 05:14:05 GMT
+Sat, 07 Sep 2024 05:13:20 GMT
 
 ### Changes
 
-- integrate 0.76.0-nightly-20240816-17017d2b8 (tatianakapos@microsoft.com)
+- switch to optimized text (tatianakapos@microsoft.com)
+- Integrate 8/31 (34109996+chiaramooney@users.noreply.github.com)
 
+## 0.0.0-canary.261
+
+Thu, 05 Sep 2024 05:13:45 GMT
+
+### Changes
+
+- Integrate 8/20 (34109996+chiaramooney@users.noreply.github.com)
+
+## 0.0.0-canary.260
+
+Wed, 28 Aug 2024 05:14:44 GMT
+
+### Changes
+
+- integrate 0.76.0-nightly-20240816-17017d2b8 (tatianakapos@microsoft.com)
+
 ## 0.0.0-canary.259
 
 Thu, 22 Aug 2024 05:24:27 GMT

package/Libraries/Animated/nodes/AnimatedObject.js

@@ -23,7 +23,8 @@ function isPlainObject(value: any): boolean {
   return (
     value !== null &&
     typeof value === 'object' &&
-    Object.getPrototypeOf(value).isPrototypeOf(Object)
+    Object.getPrototypeOf(value).isPrototypeOf(Object) &&
+    !React.isValidElement(value)
   );
 }
 
@@ -81,10 +82,6 @@ export function hasAnimatedNode(value: any, depth: number = 0): boolean {
       }
     }
   } else if (isPlainObject(value)) {
-    // Don't consider React elements
-    if (React.isValidElement(value)) {
-      return false;
-    }
     for (const key in value) {
       if (hasAnimatedNode(value[key], depth + 1)) {
         return true;

package/Libraries/Animated/nodes/AnimatedProps.js

@@ -88,6 +88,8 @@ export default class AnimatedProps extends AnimatedNode {
     if (this.__isNative && this._animatedView) {
       this.__disconnectAnimatedView();
     }
+    this._animatedView = null;
+
     for (const key in this._props) {
       const value = this._props[key];
       if (value instanceof AnimatedNode) {

package/Libraries/Components/ScrollView/AndroidHorizontalScrollViewNativeComponent.js

@@ -25,9 +25,6 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = {
     disableIntervalMomentum: true,
     maintainVisibleContentPosition: true,
     endFillColor: {process: require('../../StyleSheet/processColor').default},
-    experimental_boxShadow: {
-      process: require('../../StyleSheet/processBoxShadow').default,
-    },
     fadingEdgeLength: true,
     nestedScrollEnabled: true,
     overScrollMode: true,

package/Libraries/Components/ScrollView/ScrollViewNativeComponent.js

@@ -46,9 +46,6 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           },
           decelerationRate: true,
           enableSyncOnScroll: true, // Fabric only.
-          experimental_boxShadow: {
-            process: require('../../StyleSheet/processBoxShadow').default,
-          },
           disableIntervalMomentum: true,
           maintainVisibleContentPosition: true,
           pagingEnabled: true,

package/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js

@@ -739,9 +739,6 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = {
     },
     borderTopLeftRadius: true,
     borderTopColor: {process: require('../../StyleSheet/processColor').default},
-    experimental_boxShadow: {
-      process: require('../../StyleSheet/processBoxShadow').default,
-    },
   },
 };
 

package/Libraries/Components/TextInput/TextInput.js

@@ -1538,15 +1538,26 @@ function InternalTextInput(props: Props): React.Node {
   // Keep the original (potentially nested) style when possible, as React can diff these more efficiently
   let _style = props.style;
   const flattenedStyle = flattenStyle<TextStyleProp>(props.style);
-  if (typeof flattenedStyle?.fontWeight === 'number') {
-    _style = [
-      _style,
-      {
-        fontWeight:
-          // $FlowFixMe[incompatible-cast]
-          (flattenedStyle.fontWeight.toString(): TextStyleInternal['fontWeight']),
-      },
-    ];
+  if (flattenedStyle != null) {
+    let overrides: ?{...TextStyleInternal} = null;
+    if (typeof flattenedStyle?.fontWeight === 'number') {
+      overrides = overrides || ({}: {...TextStyleInternal});
+      overrides.fontWeight =
+        // $FlowFixMe[incompatible-cast]
+        (flattenedStyle.fontWeight.toString(): TextStyleInternal['fontWeight']);
+    }
+
+    if (flattenedStyle.verticalAlign != null) {
+      overrides = overrides || ({}: {...TextStyleInternal});
+      overrides.textAlignVertical =
+        verticalAlignToTextAlignVerticalMap[flattenedStyle.verticalAlign];
+      overrides.verticalAlign = undefined;
+    }
+
+    if (overrides != null) {
+      // $FlowFixMe[incompatible-type]
+      _style = [_style, overrides];
+    }
   }
 
   if (Platform.OS === 'ios') {
@@ -1782,20 +1793,6 @@ const ExportedForwardRef: React.AbstractComponent<
   },
   forwardedRef: ReactRefSetter<TextInputInstance>,
 ) {
-  // $FlowFixMe[underconstrained-implicit-instantiation]
-  let style = flattenStyle(restProps.style);
-
-  if (style?.verticalAlign != null) {
-    // $FlowFixMe[prop-missing]
-    // $FlowFixMe[cannot-write]
-    style.textAlignVertical =
-      // $FlowFixMe[invalid-computed-prop]
-      verticalAlignToTextAlignVerticalMap[style.verticalAlign];
-    // $FlowFixMe[prop-missing]
-    // $FlowFixMe[cannot-write]
-    delete style.verticalAlign;
-  }
-
   return (
     <InternalTextInput
       allowFontScaling={allowFontScaling}
@@ -1832,7 +1829,6 @@ const ExportedForwardRef: React.AbstractComponent<
       }
       {...restProps}
       forwardedRef={forwardedRef}
-      style={style}
     />
   );
 });

package/Libraries/Components/TextInput/TextInput.win32.js

@@ -1645,15 +1645,26 @@ function InternalTextInput(props: Props): React.Node {
   // Keep the original (potentially nested) style when possible, as React can diff these more efficiently
   let _style = props.style;
   const flattenedStyle = flattenStyle<TextStyleProp>(props.style);
-  if (typeof flattenedStyle?.fontWeight === 'number') {
-    _style = [
-      _style,
-      {
-        fontWeight:
-          // $FlowFixMe[incompatible-cast]
-          (flattenedStyle.fontWeight.toString(): TextStyleInternal['fontWeight']),
-      },
-    ];
+  if (flattenedStyle != null) {
+    let overrides: ?{...TextStyleInternal} = null;
+    if (typeof flattenedStyle?.fontWeight === 'number') {
+      overrides = overrides || ({}: {...TextStyleInternal});
+      overrides.fontWeight =
+        // $FlowFixMe[incompatible-cast]
+        (flattenedStyle.fontWeight.toString(): TextStyleInternal['fontWeight']);
+    }
+
+    if (flattenedStyle.verticalAlign != null) {
+      overrides = overrides || ({}: {...TextStyleInternal});
+      overrides.textAlignVertical =
+        verticalAlignToTextAlignVerticalMap[flattenedStyle.verticalAlign];
+      overrides.verticalAlign = undefined;
+    }
+
+    if (overrides != null) {
+      // $FlowFixMe[incompatible-type]
+      _style = [_style, overrides];
+    }
   }
 
   if (Platform.OS === 'ios') {
@@ -1917,20 +1928,6 @@ const ExportedForwardRef: React.AbstractComponent<
   },
   forwardedRef: ReactRefSetter<TextInputInstance>,
 ) {
-  // $FlowFixMe[underconstrained-implicit-instantiation]
-  let style = flattenStyle(restProps.style);
-
-  if (style?.verticalAlign != null) {
-    // $FlowFixMe[prop-missing]
-    // $FlowFixMe[cannot-write]
-    style.textAlignVertical =
-      // $FlowFixMe[invalid-computed-prop]
-      verticalAlignToTextAlignVerticalMap[style.verticalAlign];
-    // $FlowFixMe[prop-missing]
-    // $FlowFixMe[cannot-write]
-    delete style.verticalAlign;
-  }
-
   return (
     <InternalTextInput
       allowFontScaling={allowFontScaling}
@@ -1966,7 +1963,6 @@ const ExportedForwardRef: React.AbstractComponent<
       }
       {...restProps}
       forwardedRef={forwardedRef}
-      style={style}
     />
   );
 });

package/Libraries/Components/View/ViewNativeComponent.js

@@ -94,17 +94,10 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           borderBlockStartColor: {
             process: require('../../StyleSheet/processColor').default,
           },
-          experimental_boxShadow: {
-            process: require('../../StyleSheet/processBoxShadow').default,
-          },
-
           focusable: true,
           overflow: true,
           backfaceVisibility: true,
           experimental_layoutConformance: true,
-          experimental_backgroundImage: {
-            process: require('../../StyleSheet/processBackgroundImage').default,
-          },
         },
       }
     : {

package/Libraries/Core/ReactNativeVersion.js

@@ -17,7 +17,7 @@ const version: $ReadOnly<{
   major: 0,
   minor: 76,
   patch: 0,
-  prerelease: 'nightly-20240816-17017d2b8',
+  prerelease: 'nightly-20240901-305b4357e',
 };
 
 module.exports = {version};

package/Libraries/Image/ImageViewNativeComponent.js

@@ -113,9 +113,6 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           borderBottomRightRadius: true,
           borderTopRightRadius: true,
           loadingIndicatorSrc: true,
-          experimental_boxShadow: {
-            process: require('../StyleSheet/processBoxShadow').default,
-          },
         },
       }
     : {

package/Libraries/Lists/SectionListModern.js

@@ -16,7 +16,7 @@ import type {
   SectionBase as _SectionBase,
   VirtualizedSectionListProps,
 } from '@react-native/virtualized-lists';
-import type {AbstractComponent, Element, ElementRef} from 'react';
+import type {AbstractComponent, ElementRef} from 'react';
 
 import Platform from '../Utilities/Platform';
 import {VirtualizedSectionList} from '@react-native/virtualized-lists';
@@ -56,7 +56,7 @@ type OptionalProps<SectionT: SectionBase<any>> = {|
       ...
     },
     ...
-  }) => null | Element<any>,
+  }) => null | React.MixedElement,
   /**
    * A marker property for telling the list to re-render (since it implements `PureComponent`). If
    * any of your `renderItem`, Header, Footer, etc. functions depend on anything outside of the

package/Libraries/LogBox/Data/LogBoxData.js

@@ -18,7 +18,7 @@ import type {
   Message,
 } from './parseLogBoxLog';
 
-import NativeDebuggerSessionObserver from '../../../src/private/specs/modules/NativeDebuggerSessionObserver';
+import DebuggerSessionObserver from '../../../src/private/fusebox/FuseboxSessionObserver';
 import parseErrorStack from '../../Core/Devtools/parseErrorStack';
 import NativeDevSettings from '../../NativeModules/specs/NativeDevSettings';
 import NativeLogBox from '../../NativeModules/specs/NativeLogBox';
@@ -198,29 +198,23 @@ function appendNewLog(newLog: LogBoxLog) {
 }
 
 export function addLog(log: LogData): void {
-  if (
-    hostTargetSessionObserverSubscription == null &&
-    NativeDebuggerSessionObserver != null
-  ) {
-    hostTargetSessionObserverSubscription =
-      NativeDebuggerSessionObserver.subscribe(hasActiveSession => {
+  if (hostTargetSessionObserverSubscription == null) {
+    hostTargetSessionObserverSubscription = DebuggerSessionObserver.subscribe(
+      hasActiveSession => {
         if (hasActiveSession) {
           clearWarnings();
         } else {
           // Reset the flag so that we can show the message again if new warning was emitted
           hasShownFuseboxWarningsMigrationMessage = false;
         }
-      });
+      },
+    );
   }
 
   // If Host has Fusebox support
-  if (
-    log.level === 'warn' &&
-    global.__FUSEBOX_HAS_FULL_CONSOLE_SUPPORT__ &&
-    NativeDebuggerSessionObserver != null
-  ) {
+  if (log.level === 'warn' && global.__FUSEBOX_HAS_FULL_CONSOLE_SUPPORT__) {
     // And there is no active debugging session
-    if (!NativeDebuggerSessionObserver.hasActiveSession()) {
+    if (!DebuggerSessionObserver.hasActiveSession()) {
       showFuseboxWarningsMigrationMessageOnce();
     }
 

package/Libraries/Modal/Modal.js

@@ -218,7 +218,6 @@ class Modal extends React.Component<Props, State> {
   }
 
   componentWillUnmount() {
-    this.setState({isRendered: false});
     if (this._eventSubscription) {
       this._eventSubscription.remove();
     }

package/Libraries/NativeComponent/BaseViewConfig.android.js

@@ -166,6 +166,12 @@ const validAttributesForNonEventProps = {
   backgroundColor: {process: require('../StyleSheet/processColor').default},
   transform: true,
   transformOrigin: true,
+  experimental_backgroundImage: {
+    process: require('../StyleSheet/processBackgroundImage').default,
+  },
+  experimental_boxShadow: {
+    process: require('../StyleSheet/processBoxShadow').default,
+  },
   experimental_filter: {
     process: require('../StyleSheet/processFilter').default,
   },

package/Libraries/NativeComponent/NativeComponentRegistry.js

@@ -17,7 +17,6 @@ import type {
 import getNativeComponentAttributes from '../ReactNative/getNativeComponentAttributes';
 import UIManager from '../ReactNative/UIManager';
 import * as ReactNativeViewConfigRegistry from '../Renderer/shims/ReactNativeViewConfigRegistry';
-import verifyComponentAttributeEquivalence from '../Utilities/verifyComponentAttributeEquivalence';
 import * as StaticViewConfigValidator from './StaticViewConfigValidator';
 import {createViewConfig} from './ViewConfig';
 import invariant from 'invariant';
@@ -35,7 +34,6 @@ let getRuntimeConfig;
 export function setRuntimeConfigProvider(
   runtimeConfigProvider: (name: string) => ?{
     native: boolean,
-    strict: boolean,
     verify: boolean,
   },
 ): void {
@@ -55,9 +53,8 @@ export function get<Config>(
   viewConfigProvider: () => PartialViewConfig,
 ): HostComponent<Config> {
   ReactNativeViewConfigRegistry.register(name, () => {
-    const {native, strict, verify} = getRuntimeConfig?.(name) ?? {
+    const {native, verify} = getRuntimeConfig?.(name) ?? {
       native: !global.RN$Bridgeless,
-      strict: false,
       verify: false,
     };
 
@@ -92,23 +89,19 @@ export function get<Config>(
         ? createViewConfig(viewConfigProvider())
         : viewConfig;
 
-      if (strict) {
-        const validationOutput = StaticViewConfigValidator.validate(
-          name,
-          nativeViewConfig,
-          staticViewConfig,
+      const validationOutput = StaticViewConfigValidator.validate(
+        name,
+        nativeViewConfig,
+        staticViewConfig,
+      );
+
+      if (validationOutput.type === 'invalid') {
+        console.error(
+          StaticViewConfigValidator.stringifyValidationResult(
+            name,
+            validationOutput,
+          ),
         );
-
-        if (validationOutput.type === 'invalid') {
-          console.error(
-            StaticViewConfigValidator.stringifyValidationResult(
-              name,
-              validationOutput,
-            ),
-          );
-        }
-      } else {
-        verifyComponentAttributeEquivalence(nativeViewConfig, staticViewConfig);
       }
     }
 

package/Libraries/NativeComponent/StaticViewConfigValidator.js

@@ -22,11 +22,6 @@ export type Difference =
       path: Array<string>,
       nativeValue: mixed,
       staticValue: mixed,
-    }
-  | {
-      type: 'unexpected',
-      path: Array<string>,
-      staticValue: mixed,
     };
 
 export type ValidationResult = ValidResult | InvalidResult;
@@ -90,8 +85,6 @@ export function stringifyValidationResult(
           return `- '${path.join('.')}' is missing.`;
         case 'unequal':
           return `- '${path.join('.')}' is the wrong value.`;
-        case 'unexpected':
-          return `- '${path.join('.')}' is present but not expected to be.`;
       }
     }),
     '',
@@ -145,20 +138,6 @@ function accumulateDifferences(
       });
     }
   }
-
-  for (const staticKey in staticObject) {
-    if (
-      !nativeObject.hasOwnProperty(staticKey) &&
-      // $FlowFixMe[invalid-computed-prop]
-      !isIgnored(staticObject[staticKey])
-    ) {
-      differences.push({
-        path: [...path, staticKey],
-        type: 'unexpected',
-        staticValue: staticObject[staticKey],
-      });
-    }
-  }
 }
 
 function ifObject(value: mixed): ?{...} {

package/Libraries/ReactNative/RendererImplementation.js

@@ -14,7 +14,7 @@ import type {
   Node,
 } from '../Renderer/shims/ReactNativeTypes';
 import type ReactFabricHostComponent from './ReactFabricPublicInstance/ReactFabricHostComponent';
-import type {Element, ElementRef, ElementType} from 'react';
+import type {ElementRef, ElementType} from 'react';
 
 import {
   onCaughtError,
@@ -28,7 +28,7 @@ export function renderElement({
   useFabric,
   useConcurrentRoot,
 }: {
-  element: Element<ElementType>,
+  element: React.MixedElement,
   rootTag: number,
   useFabric: boolean,
   useConcurrentRoot: boolean,

package/Libraries/Renderer/shims/ReactNativeTypes.js

@@ -7,10 +7,15 @@
  * @noformat
  * @nolint
  * @flow strict
- * @generated SignedSource<<4405023a5d82ddc01db31d8eb46a7aa0>>
+ * @generated SignedSource<<89361333bb6b688486e35849a9c669a6>>
  */
 
-import type {ElementRef, ElementType, Element, AbstractComponent} from 'react';
+import type {
+  ElementRef,
+  ElementType,
+  MixedElement,
+  AbstractComponent,
+} from 'react';
 
 export type MeasureOnSuccessCallback = (
   x: number,
@@ -222,7 +227,7 @@ export type ReactNativeType = {
     eventType: string,
   ): void,
   render(
-    element: Element<ElementType>,
+    element: MixedElement,
     containerTag: number,
     callback: ?() => void,
     options: ?RenderRootOptions,
@@ -257,7 +262,7 @@ export type ReactFabricType = {
     eventType: string,
   ): void,
   render(
-    element: Element<ElementType>,
+    element: MixedElement,
     containerTag: number,
     callback: ?() => void,
     concurrentRoot: ?boolean,

package/Libraries/StyleSheet/StyleSheetTypes.d.ts

@@ -276,10 +276,10 @@ export type BlendMode =
 export type GradientValue = {
   type: 'linearGradient';
   // Angle or direction enums
-  direction: string | undefined;
-  colorStops: Array<{
+  direction?: string | undefined;
+  colorStops: ReadonlyArray<{
     color: ColorValue;
-    position: number | undefined;
+    positions?: ReadonlyArray<string[]> | undefined;
   }>;
 };
 

package/Libraries/StyleSheet/StyleSheetTypes.js

@@ -715,7 +715,7 @@ export type GradientValue = {
   direction?: string,
   colorStops: $ReadOnlyArray<{
     color: ____ColorValue_Internal,
-    position?: string,
+    positions?: $ReadOnlyArray<string>,
   }>,
 };