@office-iss/react-native-win32 0.0.0-canary.283 → 0.0.0-canary.285

package/src/private/featureflags/ReactNativeFeatureFlags.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<3037cf1c938dae492b656333cec9633c>>
+ * @generated SignedSource<<189673854f1226119417140b4afd46e4>>
  * @flow strict
  */
 
@@ -30,19 +30,18 @@ export type ReactNativeFeatureFlagsJsOnly = $ReadOnly<{
   jsOnlyTestFlag: Getter<boolean>,
   animatedShouldDebounceQueueFlush: Getter<boolean>,
   animatedShouldUseSingleOp: Getter<boolean>,
+  avoidStateUpdateInAnimatedPropsMemo: Getter<boolean>,
   disableInteractionManager: Getter<boolean>,
-  disableInteractionManagerInBatchinator: Getter<boolean>,
   enableAccessToHostTreeInFabric: Getter<boolean>,
-  enableAnimatedAllowlist: Getter<boolean>,
   enableAnimatedClearImmediateFix: Getter<boolean>,
-  enableAnimatedPropsMemo: Getter<boolean>,
+  enableDOMDocumentAPI: Getter<boolean>,
   fixVirtualizeListCollapseWindowSize: Getter<boolean>,
   isLayoutAnimationEnabled: Getter<boolean>,
+  scheduleAnimatedCleanupInMicrotask: Getter<boolean>,
   shouldSkipStateUpdatesForLoopingAnimations: Getter<boolean>,
   shouldUseAnimatedObjectForTransform: Getter<boolean>,
   shouldUseRemoveClippedSubviewsAsDefaultOnIOS: Getter<boolean>,
   shouldUseSetNativePropsInFabric: Getter<boolean>,
-  useInsertionEffectsForAnimations: Getter<boolean>,
   useRefsForTextInputState: Getter<boolean>,
 }>;
 
@@ -52,13 +51,10 @@ export type ReactNativeFeatureFlags = $ReadOnly<{
   ...ReactNativeFeatureFlagsJsOnly,
   commonTestFlag: Getter<boolean>,
   commonTestFlagWithoutNativeImplementation: Getter<boolean>,
-  completeReactInstanceCreationOnBgThreadOnAndroid: Getter<boolean>,
-  disableEventLoopOnBridgeless: Getter<boolean>,
   disableMountItemReorderingAndroid: Getter<boolean>,
   enableAccumulatedUpdatesInRawPropsAndroid: Getter<boolean>,
   enableBridgelessArchitecture: Getter<boolean>,
   enableCppPropsIteratorSetter: Getter<boolean>,
-  enableDeletionOfUnmountedViews: Getter<boolean>,
   enableEagerRootViewAttachment: Getter<boolean>,
   enableEventEmitterRetentionDuringGesturesOnAndroid: Getter<boolean>,
   enableFabricLogs: Getter<boolean>,
@@ -67,6 +63,7 @@ export type ReactNativeFeatureFlags = $ReadOnly<{
   enableGranularShadowTreeStateReconciliation: Getter<boolean>,
   enableIOSViewClipToPaddingBox: Getter<boolean>,
   enableImagePrefetchingAndroid: Getter<boolean>,
+  enableJSRuntimeGCOnMemoryPressureOnIOS: Getter<boolean>,
   enableLayoutAnimationsOnAndroid: Getter<boolean>,
   enableLayoutAnimationsOnIOS: Getter<boolean>,
   enableLongTaskAPI: Getter<boolean>,
@@ -82,15 +79,13 @@ export type ReactNativeFeatureFlags = $ReadOnly<{
   fixMappingOfEventPrioritiesBetweenFabricAndReact: Getter<boolean>,
   fixMountingCoordinatorReportedPendingTransactionsOnAndroid: Getter<boolean>,
   fuseboxEnabledRelease: Getter<boolean>,
-  initEagerTurboModulesOnNativeModulesQueueAndroid: Getter<boolean>,
+  fuseboxNetworkInspectionEnabled: Getter<boolean>,
   lazyAnimationCallbacks: Getter<boolean>,
-  loadVectorDrawablesOnImages: Getter<boolean>,
   traceTurboModulePromiseRejectionsOnAndroid: Getter<boolean>,
   useAlwaysAvailableJSErrorHandling: Getter<boolean>,
+  useEditTextStockAndroidFocusBehavior: Getter<boolean>,
   useFabricInterop: Getter<boolean>,
-  useImmediateExecutorInAndroidBridgeless: Getter<boolean>,
   useNativeViewConfigsInBridgelessMode: Getter<boolean>,
-  useOptimisedViewPreallocationOnAndroid: Getter<boolean>,
   useOptimizedEventBatchingOnAndroid: Getter<boolean>,
   useRawPropsJsiValue: Getter<boolean>,
   useRuntimeShadowNodeReferenceUpdate: Getter<boolean>,
@@ -114,34 +109,29 @@ export const animatedShouldDebounceQueueFlush: Getter<boolean> = createJavaScrip
 export const animatedShouldUseSingleOp: Getter<boolean> = createJavaScriptFlagGetter('animatedShouldUseSingleOp', false);
 
 /**
- * Disables InteractionManager and replaces its scheduler with `setImmediate`.
+ * Changes `useAnimatedPropsMemo` to avoid state updates to invalidate the cached `AnimatedProps`.
  */
-export const disableInteractionManager: Getter<boolean> = createJavaScriptFlagGetter('disableInteractionManager', false);
+export const avoidStateUpdateInAnimatedPropsMemo: Getter<boolean> = createJavaScriptFlagGetter('avoidStateUpdateInAnimatedPropsMemo', false);
 
 /**
- * Skips InteractionManager in `Batchinator` and invokes callbacks synchronously.
+ * Disables InteractionManager and replaces its scheduler with `setImmediate`.
  */
-export const disableInteractionManagerInBatchinator: Getter<boolean> = createJavaScriptFlagGetter('disableInteractionManagerInBatchinator', false);
+export const disableInteractionManager: Getter<boolean> = createJavaScriptFlagGetter('disableInteractionManager', false);
 
 /**
  * Enables access to the host tree in Fabric using DOM-compatible APIs.
  */
 export const enableAccessToHostTreeInFabric: Getter<boolean> = createJavaScriptFlagGetter('enableAccessToHostTreeInFabric', false);
 
-/**
- * Enables Animated to skip non-allowlisted props and styles.
- */
-export const enableAnimatedAllowlist: Getter<boolean> = createJavaScriptFlagGetter('enableAnimatedAllowlist', true);
-
 /**
  * Enables an experimental to use the proper clearIntermediate instead of calling the wrong clearTimeout and canceling another timer.
  */
 export const enableAnimatedClearImmediateFix: Getter<boolean> = createJavaScriptFlagGetter('enableAnimatedClearImmediateFix', true);
 
 /**
- * Enables Animated to analyze props to minimize invalidating `AnimatedProps`.
+ * Enables the DOM Document API, exposing instaces of document through `getRootNode` and `ownerDocument`, and providing access to the `documentElement` representing the root node. This flag will be short-lived, only to test the Document API specifically, and then it will be collapsed into the enableAccessToHostTreeInFabric flag.
  */
-export const enableAnimatedPropsMemo: Getter<boolean> = createJavaScriptFlagGetter('enableAnimatedPropsMemo', true);
+export const enableDOMDocumentAPI: Getter<boolean> = createJavaScriptFlagGetter('enableDOMDocumentAPI', false);
 
 /**
  * Fixing an edge case where the current window size is not properly calculated with fast scrolling. Window size collapsed to 1 element even if windowSize more than the current amount of elements
@@ -153,6 +143,11 @@ export const fixVirtualizeListCollapseWindowSize: Getter<boolean> = createJavaSc
  */
 export const isLayoutAnimationEnabled: Getter<boolean> = createJavaScriptFlagGetter('isLayoutAnimationEnabled', true);
 
+/**
+ * Changes the cleanup of`AnimatedProps` to occur in a microtask instead of synchronously during effect cleanup (for unmount) or subsequent mounts (for updates).
+ */
+export const scheduleAnimatedCleanupInMicrotask: Getter<boolean> = createJavaScriptFlagGetter('scheduleAnimatedCleanupInMicrotask', false);
+
 /**
  * If the animation is within Animated.loop, we do not send state updates to React.
  */
@@ -173,11 +168,6 @@ export const shouldUseRemoveClippedSubviewsAsDefaultOnIOS: Getter<boolean> = cre
  */
 export const shouldUseSetNativePropsInFabric: Getter<boolean> = createJavaScriptFlagGetter('shouldUseSetNativePropsInFabric', true);
 
-/**
- * Changes construction of the animation graph to `useInsertionEffect` instead of `useLayoutEffect`.
- */
-export const useInsertionEffectsForAnimations: Getter<boolean> = createJavaScriptFlagGetter('useInsertionEffectsForAnimations', true);
-
 /**
  * Enable a variant of TextInput that moves some state to refs to avoid unnecessary re-renders
  */
@@ -190,15 +180,7 @@ export const commonTestFlag: Getter<boolean> = createNativeFlagGetter('commonTes
 /**
  * Common flag for testing (without native implementation). Do NOT modify.
  */
-export const commonTestFlagWithoutNativeImplementation: Getter<boolean> = createNativeFlagGetter('commonTestFlagWithoutNativeImplementation', false);
-/**
- * Do not wait for a main-thread dispatch to complete init to start executing work on the JS thread on Android
- */
-export const completeReactInstanceCreationOnBgThreadOnAndroid: Getter<boolean> = createNativeFlagGetter('completeReactInstanceCreationOnBgThreadOnAndroid', true);
-/**
- * The bridgeless architecture enables the event loop by default. This feature flag allows us to force disabling it in specific instances.
- */
-export const disableEventLoopOnBridgeless: Getter<boolean> = createNativeFlagGetter('disableEventLoopOnBridgeless', false);
+export const commonTestFlagWithoutNativeImplementation: Getter<boolean> = createNativeFlagGetter('commonTestFlagWithoutNativeImplementation', false, true);
 /**
  * Prevent FabricMountingManager from reordering mountitems, which may lead to invalid state on the UI thread
  */
@@ -215,10 +197,6 @@ export const enableBridgelessArchitecture: Getter<boolean> = createNativeFlagGet
  * Enable prop iterator setter-style construction of Props in C++ (this flag is not used in Java).
  */
 export const enableCppPropsIteratorSetter: Getter<boolean> = createNativeFlagGetter('enableCppPropsIteratorSetter', false);
-/**
- * Deletes views that were pre-allocated but never mounted on the screen.
- */
-export const enableDeletionOfUnmountedViews: Getter<boolean> = createNativeFlagGetter('enableDeletionOfUnmountedViews', false);
 /**
  * Feature flag to configure eager attachment of the root view/initialisation of the JS code.
  */
@@ -251,6 +229,10 @@ export const enableIOSViewClipToPaddingBox: Getter<boolean> = createNativeFlagGe
  * When enabled, Andoid will build and initiate image prefetch requests on ImageShadowNode::layout
  */
 export const enableImagePrefetchingAndroid: Getter<boolean> = createNativeFlagGetter('enableImagePrefetchingAndroid', false);
+/**
+ * Trigger JS runtime GC on memory pressure event on iOS
+ */
+export const enableJSRuntimeGCOnMemoryPressureOnIOS: Getter<boolean> = createNativeFlagGetter('enableJSRuntimeGCOnMemoryPressureOnIOS', false);
 /**
  * When enabled, LayoutAnimations API will animate state changes on Android.
  */
@@ -312,17 +294,13 @@ export const fixMountingCoordinatorReportedPendingTransactionsOnAndroid: Getter<
  */
 export const fuseboxEnabledRelease: Getter<boolean> = createNativeFlagGetter('fuseboxEnabledRelease', false);
 /**
- * Construct modules that requires eager init on the dedicate native modules thread
+ * Enable network inspection support in the React Native DevTools CDP backend. This flag is global and should not be changed across React Host lifetimes.
  */
-export const initEagerTurboModulesOnNativeModulesQueueAndroid: Getter<boolean> = createNativeFlagGetter('initEagerTurboModulesOnNativeModulesQueueAndroid', true);
+export const fuseboxNetworkInspectionEnabled: Getter<boolean> = createNativeFlagGetter('fuseboxNetworkInspectionEnabled', false);
 /**
  * Only enqueue Choreographer calls if there is an ongoing animation, instead of enqueueing every frame.
  */
 export const lazyAnimationCallbacks: Getter<boolean> = createNativeFlagGetter('lazyAnimationCallbacks', false);
-/**
- * Adds support for loading vector drawable assets in the Image component (only on Android)
- */
-export const loadVectorDrawablesOnImages: Getter<boolean> = createNativeFlagGetter('loadVectorDrawablesOnImages', true);
 /**
  * Enables storing js caller stack when creating promise in native module. This is useful in case of Promise rejection and tracing the cause.
  */
@@ -332,21 +310,17 @@ export const traceTurboModulePromiseRejectionsOnAndroid: Getter<boolean> = creat
  */
 export const useAlwaysAvailableJSErrorHandling: Getter<boolean> = createNativeFlagGetter('useAlwaysAvailableJSErrorHandling', false);
 /**
- * Should this application enable the Fabric Interop Layer for Android? If yes, the application will behave so that it can accept non-Fabric components and render them on Fabric. This toggle is controlling extra logic such as custom event dispatching that are needed for the Fabric Interop Layer to work correctly.
+ * If true, focusing in ReactEditText will mainly use stock Android requestFocus() behavior. If false it will use legacy custom focus behavior.
  */
-export const useFabricInterop: Getter<boolean> = createNativeFlagGetter('useFabricInterop', false);
+export const useEditTextStockAndroidFocusBehavior: Getter<boolean> = createNativeFlagGetter('useEditTextStockAndroidFocusBehavior', true);
 /**
- * Invoke callbacks immediately on the ReactInstance rather than going through a background thread for synchronization
+ * Should this application enable the Fabric Interop Layer for Android? If yes, the application will behave so that it can accept non-Fabric components and render them on Fabric. This toggle is controlling extra logic such as custom event dispatching that are needed for the Fabric Interop Layer to work correctly.
  */
-export const useImmediateExecutorInAndroidBridgeless: Getter<boolean> = createNativeFlagGetter('useImmediateExecutorInAndroidBridgeless', true);
+export const useFabricInterop: Getter<boolean> = createNativeFlagGetter('useFabricInterop', false);
 /**
  * When enabled, the native view configs are used in bridgeless mode.
  */
 export const useNativeViewConfigsInBridgelessMode: Getter<boolean> = createNativeFlagGetter('useNativeViewConfigsInBridgelessMode', false);
-/**
- * Moves more of the work in view preallocation to the main thread to free up JS thread.
- */
-export const useOptimisedViewPreallocationOnAndroid: Getter<boolean> = createNativeFlagGetter('useOptimisedViewPreallocationOnAndroid', false);
 /**
  * Uses an optimized mechanism for event batching on Android that does not need to wait for a Choreographer frame callback.
  */

package/src/private/featureflags/ReactNativeFeatureFlagsBase.js

@@ -62,12 +62,13 @@ type NativeFeatureFlags = $NonMaybeType<typeof NativeReactNativeFeatureFlags>;
 export function createNativeFlagGetter<K: $Keys<NativeFeatureFlags>>(
   configName: K,
   defaultValue: ReturnType<$NonMaybeType<NativeFeatureFlags[K]>>,
+  skipUnavailableNativeModuleError: boolean = false,
 ): Getter<ReturnType<$NonMaybeType<NativeFeatureFlags[K]>>> {
   return createGetter(
     configName,
     () => {
       const valueFromNative = NativeReactNativeFeatureFlags?.[configName]?.();
-      if (valueFromNative == null) {
+      if (valueFromNative == null && !skipUnavailableNativeModuleError) {
         logUnavailableNativeModuleError(configName);
       }
       return valueFromNative;

package/src/private/featureflags/specs/NativeReactNativeFeatureFlags.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<37e95652ef5d824bb05e78ebdb051e43>>
+ * @generated SignedSource<<8a004cfe15509541b1aa045f219bbaca>>
  * @flow strict
  */
 
@@ -25,13 +25,10 @@ import * as TurboModuleRegistry from '../../../../Libraries/TurboModule/TurboMod
 export interface Spec extends TurboModule {
   +commonTestFlag?: () => boolean;
   +commonTestFlagWithoutNativeImplementation?: () => boolean;
-  +completeReactInstanceCreationOnBgThreadOnAndroid?: () => boolean;
-  +disableEventLoopOnBridgeless?: () => boolean;
   +disableMountItemReorderingAndroid?: () => boolean;
   +enableAccumulatedUpdatesInRawPropsAndroid?: () => boolean;
   +enableBridgelessArchitecture?: () => boolean;
   +enableCppPropsIteratorSetter?: () => boolean;
-  +enableDeletionOfUnmountedViews?: () => boolean;
   +enableEagerRootViewAttachment?: () => boolean;
   +enableEventEmitterRetentionDuringGesturesOnAndroid?: () => boolean;
   +enableFabricLogs?: () => boolean;
@@ -40,6 +37,7 @@ export interface Spec extends TurboModule {
   +enableGranularShadowTreeStateReconciliation?: () => boolean;
   +enableIOSViewClipToPaddingBox?: () => boolean;
   +enableImagePrefetchingAndroid?: () => boolean;
+  +enableJSRuntimeGCOnMemoryPressureOnIOS?: () => boolean;
   +enableLayoutAnimationsOnAndroid?: () => boolean;
   +enableLayoutAnimationsOnIOS?: () => boolean;
   +enableLongTaskAPI?: () => boolean;
@@ -55,15 +53,13 @@ export interface Spec extends TurboModule {
   +fixMappingOfEventPrioritiesBetweenFabricAndReact?: () => boolean;
   +fixMountingCoordinatorReportedPendingTransactionsOnAndroid?: () => boolean;
   +fuseboxEnabledRelease?: () => boolean;
-  +initEagerTurboModulesOnNativeModulesQueueAndroid?: () => boolean;
+  +fuseboxNetworkInspectionEnabled?: () => boolean;
   +lazyAnimationCallbacks?: () => boolean;
-  +loadVectorDrawablesOnImages?: () => boolean;
   +traceTurboModulePromiseRejectionsOnAndroid?: () => boolean;
   +useAlwaysAvailableJSErrorHandling?: () => boolean;
+  +useEditTextStockAndroidFocusBehavior?: () => boolean;
   +useFabricInterop?: () => boolean;
-  +useImmediateExecutorInAndroidBridgeless?: () => boolean;
   +useNativeViewConfigsInBridgelessMode?: () => boolean;
-  +useOptimisedViewPreallocationOnAndroid?: () => boolean;
   +useOptimizedEventBatchingOnAndroid?: () => boolean;
   +useRawPropsJsiValue?: () => boolean;
   +useRuntimeShadowNodeReferenceUpdate?: () => boolean;

package/{Libraries/Inspector → src/private/inspector}/BorderBox.js

@@ -10,11 +10,11 @@
 
 'use strict';
 
-import type {ViewStyleProp} from '../StyleSheet/StyleSheet';
+import type {ViewStyleProp} from '../../../Libraries/StyleSheet/StyleSheet';
 
 import React from 'react';
 
-const View = require('../Components/View/View');
+const View = require('../../../Libraries/Components/View/View').default;
 
 type Props = $ReadOnly<{
   children: React.Node,
@@ -41,4 +41,4 @@ function BorderBox({children, box, style}: Props): React.Node {
   return <View style={[borderStyle, style]}>{children}</View>;
 }
 
-module.exports = BorderBox;
+export default BorderBox;

package/{Libraries/Inspector → src/private/inspector}/BoxInspector.js

@@ -10,15 +10,18 @@
 
 'use strict';
 
-import type {TextStyleProp, ViewStyleProp} from '../StyleSheet/StyleSheet';
+import type {
+  TextStyleProp,
+  ViewStyleProp,
+} from '../../../Libraries/StyleSheet/StyleSheet';
 import type {InspectedElementFrame} from './Inspector';
 
 import React from 'react';
 
-const View = require('../Components/View/View');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Text = require('../Text/Text');
-const resolveBoxStyle = require('./resolveBoxStyle');
+const View = require('../../../Libraries/Components/View/View').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const Text = require('../../../Libraries/Text/Text').default;
+const resolveBoxStyle = require('./resolveBoxStyle').default;
 
 const blank = {
   top: 0,
@@ -124,4 +127,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = BoxInspector;
+export default BoxInspector;

package/{Libraries/Inspector → src/private/inspector}/ElementBox.js

@@ -10,17 +10,17 @@
 
 'use strict';
 
-import type {ViewStyleProp} from '../StyleSheet/StyleSheet';
+import type {ViewStyleProp} from '../../../Libraries/StyleSheet/StyleSheet';
 import type {InspectedElementFrame} from './Inspector';
 
 import React from 'react';
 
-const View = require('../Components/View/View');
-const flattenStyle = require('../StyleSheet/flattenStyle');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Dimensions = require('../Utilities/Dimensions').default;
-const BorderBox = require('./BorderBox');
-const resolveBoxStyle = require('./resolveBoxStyle');
+const View = require('../../../Libraries/Components/View/View').default;
+const flattenStyle = require('../../../Libraries/StyleSheet/flattenStyle');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const Dimensions = require('../../../Libraries/Utilities/Dimensions').default;
+const BorderBox = require('./BorderBox').default;
+const resolveBoxStyle = require('./resolveBoxStyle').default;
 
 type Props = $ReadOnly<{
   frame: InspectedElementFrame,
@@ -147,4 +147,4 @@ function resolveSizeInPlace(
   }
 }
 
-module.exports = ElementBox;
+export default ElementBox;

package/{Libraries/Inspector → src/private/inspector}/ElementProperties.js

@@ -10,27 +10,30 @@
 
 'use strict';
 
-import type {InspectorData} from '../Renderer/shims/ReactNativeTypes';
-import type {ViewStyleProp} from '../StyleSheet/StyleSheet';
+import type {InspectorData} from '../../../Libraries/Renderer/shims/ReactNativeTypes';
+import type {ViewStyleProp} from '../../../Libraries/StyleSheet/StyleSheet';
 
-const TouchableHighlight = require('../Components/Touchable/TouchableHighlight');
-const TouchableWithoutFeedback = require('../Components/Touchable/TouchableWithoutFeedback');
-const View = require('../Components/View/View');
-const flattenStyle = require('../StyleSheet/flattenStyle');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Text = require('../Text/Text');
-const mapWithSeparator = require('../Utilities/mapWithSeparator');
-const BoxInspector = require('./BoxInspector');
-const StyleInspector = require('./StyleInspector');
-const React = require('react');
+import React from 'react';
 
-type Props = $ReadOnly<{|
+const TouchableHighlight =
+  require('../../../Libraries/Components/Touchable/TouchableHighlight').default;
+const TouchableWithoutFeedback =
+  require('../../../Libraries/Components/Touchable/TouchableWithoutFeedback').default;
+const View = require('../../../Libraries/Components/View/View').default;
+const flattenStyle = require('../../../Libraries/StyleSheet/flattenStyle');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const Text = require('../../../Libraries/Text/Text').default;
+const mapWithSeparator = require('../../../Libraries/Utilities/mapWithSeparator');
+const BoxInspector = require('./BoxInspector').default;
+const StyleInspector = require('./StyleInspector').default;
+
+type Props = $ReadOnly<{
   hierarchy: ?InspectorData['hierarchy'],
   style?: ?ViewStyleProp,
   frame?: ?Object,
   selection?: ?number,
   setSelection?: number => mixed,
-|}>;
+}>;
 
 class ElementProperties extends React.Component<Props> {
   render(): React.Node {
@@ -117,4 +120,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = ElementProperties;
+export default ElementProperties;

package/{Libraries/Inspector → src/private/inspector}/Inspector.js

@@ -10,26 +10,29 @@
 
 'use strict';
 
-import type {InspectedViewRef} from '../ReactNative/AppContainer-dev';
+import type {InspectedViewRef} from '../../../Libraries/ReactNative/AppContainer-dev';
 import type {
   InspectorData,
   TouchedViewDataAtPoint,
-} from '../Renderer/shims/ReactNativeTypes';
-import type {ViewStyleProp} from '../StyleSheet/StyleSheet';
-import type {ReactDevToolsAgent} from '../Types/ReactDevToolsTypes';
-
-import SafeAreaView from '../../src/private/components/SafeAreaView_INTERNAL_DO_NOT_USE';
-
-const View = require('../Components/View/View');
-const PressabilityDebug = require('../Pressability/PressabilityDebug');
-const {findNodeHandle} = require('../ReactNative/RendererProxy');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Dimensions = require('../Utilities/Dimensions').default;
-const Platform = require('../Utilities/Platform');
-const getInspectorDataForViewAtPoint = require('./getInspectorDataForViewAtPoint');
-const InspectorOverlay = require('./InspectorOverlay');
-const InspectorPanel = require('./InspectorPanel');
-const React = require('react');
+} from '../../../Libraries/Renderer/shims/ReactNativeTypes';
+import type {ViewStyleProp} from '../../../Libraries/StyleSheet/StyleSheet';
+import type {ReactDevToolsAgent} from '../../../Libraries/Types/ReactDevToolsTypes';
+
+import SafeAreaView from '../components/SafeAreaView_INTERNAL_DO_NOT_USE';
+import React from 'react';
+
+const View = require('../../../Libraries/Components/View/View').default;
+const PressabilityDebug = require('../../../Libraries/Pressability/PressabilityDebug');
+const {
+  findNodeHandle,
+} = require('../../../Libraries/ReactNative/RendererProxy');
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const Dimensions = require('../../../Libraries/Utilities/Dimensions').default;
+const Platform = require('../../../Libraries/Utilities/Platform');
+const getInspectorDataForViewAtPoint =
+  require('./getInspectorDataForViewAtPoint').default;
+const InspectorOverlay = require('./InspectorOverlay').default;
+const InspectorPanel = require('./InspectorPanel').default;
 
 const {useState} = React;
 
@@ -203,4 +206,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = Inspector;
+export default Inspector;

package/{Libraries/Inspector → src/private/inspector}/InspectorOverlay.js

@@ -10,18 +10,19 @@
 
 'use strict';
 
-import type {PressEvent} from '../Types/CoreEventTypes';
+import type {PressEvent} from '../../../Libraries/Types/CoreEventTypes';
 import type {InspectedElement} from './Inspector';
 
-const View = require('../Components/View/View');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const ElementBox = require('./ElementBox');
-const React = require('react');
+import React from 'react';
 
-type Props = $ReadOnly<{|
+const View = require('../../../Libraries/Components/View/View').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const ElementBox = require('./ElementBox').default;
+
+type Props = $ReadOnly<{
   inspected?: ?InspectedElement,
   onTouchPoint: (locationX: number, locationY: number) => void,
-|}>;
+}>;
 
 function InspectorOverlay({inspected, onTouchPoint}: Props): React.Node {
   const findViewForTouchEvent = (e: PressEvent) => {
@@ -62,4 +63,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = InspectorOverlay;
+export default InspectorOverlay;

package/{Libraries/Inspector → src/private/inspector}/InspectorPanel.js

@@ -12,19 +12,21 @@
 
 import type {ElementsHierarchy, InspectedElement} from './Inspector';
 
-import SafeAreaView from '../Components/SafeAreaView/SafeAreaView';
+import SafeAreaView from '../../../Libraries/Components/SafeAreaView/SafeAreaView';
+import React from 'react';
 
-const ScrollView = require('../Components/ScrollView/ScrollView');
-const TouchableHighlight = require('../Components/Touchable/TouchableHighlight');
-const View = require('../Components/View/View');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Text = require('../Text/Text');
-const ElementProperties = require('./ElementProperties');
-const NetworkOverlay = require('./NetworkOverlay');
-const PerformanceOverlay = require('./PerformanceOverlay');
-const React = require('react');
+const ScrollView =
+  require('../../../Libraries/Components/ScrollView/ScrollView').default;
+const TouchableHighlight =
+  require('../../../Libraries/Components/Touchable/TouchableHighlight').default;
+const View = require('../../../Libraries/Components/View/View').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet');
+const Text = require('../../../Libraries/Text/Text').default;
+const ElementProperties = require('./ElementProperties').default;
+const NetworkOverlay = require('./NetworkOverlay').default;
+const PerformanceOverlay = require('./PerformanceOverlay').default;
 
-type Props = $ReadOnly<{|
+type Props = $ReadOnly<{
   devtoolsIsOpen: boolean,
   inspecting: boolean,
   setInspecting: (val: boolean) => void,
@@ -38,7 +40,7 @@ type Props = $ReadOnly<{|
   selection?: ?number,
   setSelection: number => mixed,
   inspected?: ?InspectedElement,
-|}>;
+}>;
 
 class InspectorPanel extends React.Component<Props> {
   renderWaiting(): React.Node {
@@ -107,11 +109,11 @@ class InspectorPanel extends React.Component<Props> {
   }
 }
 
-type InspectorPanelButtonProps = $ReadOnly<{|
+type InspectorPanelButtonProps = $ReadOnly<{
   onClick: (val: boolean) => void,
   pressed: boolean,
   title: string,
-|}>;
+}>;
 
 class InspectorPanelButton extends React.Component<InspectorPanelButtonProps> {
   render(): React.Node {
@@ -161,4 +163,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = InspectorPanel;
+export default InspectorPanel;