@office-iss/react-native-win32 0.0.0-canary.259 → 0.0.0-canary.261

package/Libraries/LogBox/Data/LogBoxData.js

@@ -18,6 +18,7 @@ import type {
   Message,
 } from './parseLogBoxLog';
 
+import NativeDebuggerSessionObserver from '../../../src/private/specs/modules/NativeDebuggerSessionObserver';
 import parseErrorStack from '../../Core/Devtools/parseErrorStack';
 import NativeDevSettings from '../../NativeModules/specs/NativeDevSettings';
 import NativeLogBox from '../../NativeModules/specs/NativeLogBox';
@@ -75,6 +76,7 @@ let updateTimeout: $FlowFixMe | null = null;
 let _isDisabled = false;
 let _selectedIndex = -1;
 let hasShownFuseboxWarningsMigrationMessage = false;
+let hostTargetSessionObserverSubscription = null;
 
 let warningFilter: WarningFilter = function (format) {
   return {
@@ -196,11 +198,36 @@ function appendNewLog(newLog: LogBoxLog) {
 }
 
 export function addLog(log: LogData): void {
-  if (log.level === 'warn' && global.__FUSEBOX_HAS_FULL_CONSOLE_SUPPORT__) {
-    // Under Fusebox, don't report warnings to LogBox.
-    showFuseboxWarningsMigrationMessageOnce();
+  if (
+    hostTargetSessionObserverSubscription == null &&
+    NativeDebuggerSessionObserver != null
+  ) {
+    hostTargetSessionObserverSubscription =
+      NativeDebuggerSessionObserver.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
+  ) {
+    // And there is no active debugging session
+    if (!NativeDebuggerSessionObserver.hasActiveSession()) {
+      showFuseboxWarningsMigrationMessageOnce();
+    }
+
+    // Don't show LogBox warnings when Host has active debugging session
     return;
   }
+
   const errorForStackTrace = new Error();
 
   // Parsing logs are expensive so we schedule this
@@ -484,7 +511,6 @@ function showFuseboxWarningsMigrationMessageOnce() {
         if (NativeDevSettings.openDebugger) {
           NativeDevSettings.openDebugger();
         }
-        clearWarnings();
       },
     }),
   );

package/Libraries/NativeComponent/BaseViewConfig.android.js

@@ -170,6 +170,7 @@ const validAttributesForNonEventProps = {
     process: require('../StyleSheet/processFilter').default,
   },
   experimental_mixBlendMode: true,
+  isolation: true,
   opacity: true,
   elevation: true,
   shadowColor: {process: require('../StyleSheet/processColor').default},

package/Libraries/NativeComponent/BaseViewConfig.ios.js

@@ -193,6 +193,8 @@ const validAttributesForNonEventProps = {
   accessibilityViewIsModal: true,
   accessibilityElementsHidden: true,
   accessibilityIgnoresInvertColors: true,
+  accessibilityShowsLargeContentViewer: true,
+  accessibilityLargeContentTitle: true,
   testID: true,
   backgroundColor: {process: require('../StyleSheet/processColor').default},
   backfaceVisibility: true,
@@ -226,6 +228,8 @@ const validAttributesForNonEventProps = {
   experimental_boxShadow: {
     process: require('../StyleSheet/processBoxShadow').default,
   },
+  experimental_mixBlendMode: true,
+  isolation: true,
 
   borderTopWidth: true,
   borderTopColor: {process: require('../StyleSheet/processColor').default},

package/Libraries/NativeComponent/BaseViewConfig.win32.js

@@ -193,6 +193,8 @@ const validAttributesForNonEventProps = {
   accessibilityViewIsModal: true,
   accessibilityElementsHidden: true,
   accessibilityIgnoresInvertColors: true,
+  accessibilityShowsLargeContentViewer: true,
+  accessibilityLargeContentTitle: true,
   testID: true,
   backgroundColor: {process: require('../StyleSheet/processColor').default},
   backfaceVisibility: true,
@@ -226,6 +228,8 @@ const validAttributesForNonEventProps = {
   experimental_boxShadow: {
     process: require('../StyleSheet/processBoxShadow').default,
   },
+  experimental_mixBlendMode: true,
+  isolation: true,
 
   borderTopWidth: true,
   borderTopColor: {process: require('../StyleSheet/processColor').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/Network/XMLHttpRequest.js

@@ -78,7 +78,9 @@ const REQUEST_EVENTS = [
 
 const XHR_EVENTS = REQUEST_EVENTS.concat('readystatechange');
 
-class XMLHttpRequestEventTarget extends (EventTarget(...REQUEST_EVENTS): any) {
+class XMLHttpRequestEventTarget extends (EventTarget(
+  ...REQUEST_EVENTS,
+): typeof EventTarget) {
   onload: ?Function;
   onloadstart: ?Function;
   onprogress: ?Function;
@@ -91,7 +93,7 @@ class XMLHttpRequestEventTarget extends (EventTarget(...REQUEST_EVENTS): any) {
 /**
  * Shared base for platform-specific XMLHttpRequest implementations.
  */
-class XMLHttpRequest extends (EventTarget(...XHR_EVENTS): any) {
+class XMLHttpRequest extends (EventTarget(...XHR_EVENTS): typeof EventTarget) {
   static UNSENT: number = UNSENT;
   static OPENED: number = OPENED;
   static HEADERS_RECEIVED: number = HEADERS_RECEIVED;

package/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js

@@ -20,7 +20,7 @@ import type {
 import type {ElementRef} from 'react';
 
 import TextInputState from '../../Components/TextInput/TextInputState';
-import {getNodeFromInternalInstanceHandle} from '../../Renderer/shims/ReactFabric';
+import {getNodeFromInternalInstanceHandle} from '../../ReactNative/RendererProxy';
 import {getFabricUIManager} from '../FabricUIManager';
 import {create} from './ReactNativeAttributePayload';
 import warnForStyleProps from './warnForStyleProps';

package/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstance.js

@@ -15,7 +15,7 @@
 
 import type ReactNativeElement from '../../../src/private/webapis/dom/nodes/ReactNativeElement';
 import type ReadOnlyText from '../../../src/private/webapis/dom/nodes/ReadOnlyText';
-import typeof ReactFabricType from '../../Renderer/shims/ReactFabric';
+import typeof * as RendererProxyT from '../../ReactNative/RendererProxy';
 import type {
   InternalInstanceHandle,
   Node,
@@ -32,7 +32,7 @@ let PublicInstanceClass:
 let ReadOnlyTextClass: Class<ReadOnlyText>;
 
 // Lazy loaded to avoid evaluating the module when using the legacy renderer.
-let ReactFabric: ReactFabricType;
+let RendererProxy: RendererProxyT;
 
 export function createPublicInstance(
   tag: number,
@@ -78,10 +78,10 @@ export function getNodeFromPublicInstance(
     return null;
   }
 
-  if (ReactFabric == null) {
-    ReactFabric = require('../../Renderer/shims/ReactFabric');
+  if (RendererProxy == null) {
+    RendererProxy = require('../../ReactNative/RendererProxy');
   }
-  return ReactFabric.getNodeFromInternalInstanceHandle(
+  return RendererProxy.getNodeFromInternalInstanceHandle(
     publicInstance.__internalInstanceHandle,
   );
 }

package/Libraries/ReactNative/RendererImplementation.js

@@ -8,15 +8,19 @@
  * @flow strict-local
  */
 
-import type {HostComponent} from '../Renderer/shims/ReactNativeTypes';
+import type {
+  HostComponent,
+  InternalInstanceHandle,
+  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,
   onRecoverableError,
   onUncaughtError,
-} from '../Core/ErrorHandlers';
+} from '../../src/private/renderer/errorhandling/ErrorHandlers';
 import {type RootTag} from './RootTag';
 export function renderElement({
   element,
@@ -24,7 +28,7 @@ export function renderElement({
   useFabric,
   useConcurrentRoot,
 }: {
-  element: Element<ElementType>,
+  element: React.MixedElement,
   rootTag: number,
   useFabric: boolean,
   useConcurrentRoot: boolean,
@@ -139,3 +143,21 @@ export function isChildPublicInstance(
     childInstance,
   );
 }
+
+export function getNodeFromInternalInstanceHandle(
+  internalInstanceHandle: InternalInstanceHandle,
+): ?Node {
+  // This is only available in Fabric
+  return require('../Renderer/shims/ReactFabric').getNodeFromInternalInstanceHandle(
+    internalInstanceHandle,
+  );
+}
+
+export function getPublicInstanceFromInternalInstanceHandle(
+  internalInstanceHandle: InternalInstanceHandle,
+): mixed /*PublicInstance | PublicTextInstance | null*/ {
+  // This is only available in Fabric
+  return require('../Renderer/shims/ReactFabric').getPublicInstanceFromInternalInstanceHandle(
+    internalInstanceHandle,
+  );
+}

package/Libraries/ReactNative/getNativeComponentAttributes.js

@@ -10,8 +10,12 @@
 
 'use strict';
 
+import processBoxShadow from '../StyleSheet/processBoxShadow';
+
 const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
 const resolveAssetSource = require('../Image/resolveAssetSource');
+const processBackgroundImage =
+  require('../StyleSheet/processBackgroundImage').default;
 const processColor = require('../StyleSheet/processColor').default;
 const processColorArray = require('../StyleSheet/processColorArray');
 const processFilter = require('../StyleSheet/processFilter').default;
@@ -191,8 +195,12 @@ function getProcessorForType(typeName: string): ?(nextProp: any) => any {
       return processColorArray;
     case 'Filter':
       return processFilter;
+    case 'BackgroundImage':
+      return processBackgroundImage;
     case 'ImageSource':
       return resolveAssetSource;
+    case 'BoxShadow':
+      return processBoxShadow;
   }
   return null;
 }

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/StyleSheet.js

@@ -23,7 +23,7 @@ import type {
   ____ViewStyleProp_Internal,
 } from './StyleSheetTypes';
 
-import composeStyles from '../../src/private/core/composeStyles';
+import composeStyles from '../../src/private/styles/composeStyles';
 
 const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
 const PixelRatio = require('../Utilities/PixelRatio').default;

package/Libraries/StyleSheet/StyleSheet.win32.js

@@ -23,7 +23,7 @@ import type {
   ____ViewStyleProp_Internal,
 } from './StyleSheetTypes';
 
-import composeStyles from '../../src/private/core/composeStyles';
+import composeStyles from '../../src/private/styles/composeStyles';
 
 const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
 const PixelRatio = require('../Utilities/PixelRatio').default;

package/Libraries/StyleSheet/StyleSheetTypes.d.ts

@@ -273,6 +273,16 @@ export type BlendMode =
   | 'color'
   | 'luminosity';
 
+export type GradientValue = {
+  type: 'linearGradient';
+  // Angle or direction enums
+  direction?: string | undefined;
+  colorStops: ReadonlyArray<{
+    color: ColorValue;
+    positions?: ReadonlyArray<string[]> | undefined;
+  }>;
+};
+
 /**
  * @see https://reactnative.dev/docs/view#style
  */
@@ -322,6 +332,7 @@ export interface ViewStyle extends FlexStyle, ShadowStyleIOS, TransformsStyle {
    * Controls whether the View can be the target of touch events.
    */
   pointerEvents?: 'box-none' | 'none' | 'box-only' | 'auto' | undefined;
+  isolation?: 'auto' | 'isolate' | undefined;
   cursor?: CursorValue | undefined;
 }
 

package/Libraries/StyleSheet/StyleSheetTypes.js

@@ -709,6 +709,16 @@ export type DropShadowPrimitive = {
   color?: ____ColorValue_Internal,
 };
 
+export type GradientValue = {
+  type: 'linearGradient',
+  // Angle or direction enums
+  direction?: string,
+  colorStops: $ReadOnlyArray<{
+    color: ____ColorValue_Internal,
+    positions?: $ReadOnlyArray<string>,
+  }>,
+};
+
 export type BoxShadowPrimitive = {
   offsetX: number | string,
   offsetY: number | string,
@@ -778,9 +788,11 @@ export type ____ViewStyle_InternalCore = $ReadOnly<{
   elevation?: number,
   pointerEvents?: 'auto' | 'none' | 'box-none' | 'box-only',
   cursor?: CursorValue,
-  experimental_boxShadow?: $ReadOnlyArray<BoxShadowPrimitive>,
-  experimental_filter?: $ReadOnlyArray<FilterFunction>,
+  experimental_boxShadow?: $ReadOnlyArray<BoxShadowPrimitive> | string,
+  experimental_filter?: $ReadOnlyArray<FilterFunction> | string,
   experimental_mixBlendMode?: ____BlendMode_Internal,
+  experimental_backgroundImage?: $ReadOnlyArray<GradientValue> | string,
+  isolation?: 'auto' | 'isolate',
 }>;
 
 export type ____ViewStyle_Internal = $ReadOnly<{