@office-iss/react-native-win32 0.0.0-canary.272 → 0.0.0-canary.274

package/Libraries/Core/ExceptionsManager.js

@@ -141,24 +141,31 @@ let inExceptionHandler = false;
  * Logs exceptions to the (native) console and displays them
  */
 function handleException(e: mixed, isFatal: boolean) {
-  let error: Error;
-  if (e instanceof Error) {
-    error = e;
-  } else {
-    // Workaround for reporting errors caused by `throw 'some string'`
-    // Unfortunately there is no way to figure out the stacktrace in this
-    // case, so if you ended up here trying to trace an error, look for
-    // `throw '<error message>'` somewhere in your codebase.
-    error = new SyntheticError(e);
-  }
-  try {
-    inExceptionHandler = true;
-    /* $FlowFixMe[class-object-subtyping] added when improving typing for this
-     * parameters */
-    // $FlowFixMe[incompatible-call]
-    reportException(error, isFatal, /*reportToConsole*/ true);
-  } finally {
-    inExceptionHandler = false;
+  // TODO(T196834299): We should really use a c++ turbomodule for this
+  const reportToConsole = true;
+  if (
+    !global.RN$handleException ||
+    !global.RN$handleException(e, isFatal, reportToConsole)
+  ) {
+    let error: Error;
+    if (e instanceof Error) {
+      error = e;
+    } else {
+      // Workaround for reporting errors caused by `throw 'some string'`
+      // Unfortunately there is no way to figure out the stacktrace in this
+      // case, so if you ended up here trying to trace an error, look for
+      // `throw '<error message>'` somewhere in your codebase.
+      error = new SyntheticError(e);
+    }
+    try {
+      inExceptionHandler = true;
+      /* $FlowFixMe[class-object-subtyping] added when improving typing for this
+       * parameters */
+      // $FlowFixMe[incompatible-call]
+      reportException(error, isFatal, reportToConsole);
+    } finally {
+      inExceptionHandler = false;
+    }
   }
 }
 
@@ -170,7 +177,10 @@ function reactConsoleErrorHandler(...args) {
   if (!console.reportErrorsAsExceptions) {
     return;
   }
-  if (inExceptionHandler) {
+  if (
+    inExceptionHandler ||
+    (global.RN$inExceptionHandler && global.RN$inExceptionHandler())
+  ) {
     // The fundamental trick here is that are multiple entry point to logging errors:
     // (see D19743075 for more background)
     //
@@ -224,14 +234,21 @@ function reactConsoleErrorHandler(...args) {
     error.name = 'console.error';
   }
 
-  reportException(
-    /* $FlowFixMe[class-object-subtyping] added when improving typing for this
-     * parameters */
-    // $FlowFixMe[incompatible-call]
-    error,
-    false, // isFatal
-    false, // reportToConsole
-  );
+  const isFatal = false;
+  const reportToConsole = false;
+  if (
+    !global.RN$handleException ||
+    !global.RN$handleException(error, isFatal, reportToConsole)
+  ) {
+    reportException(
+      /* $FlowFixMe[class-object-subtyping] added when improving typing for this
+       * parameters */
+      // $FlowFixMe[incompatible-call]
+      error,
+      isFatal,
+      reportToConsole,
+    );
+  }
 }
 
 /**

package/Libraries/Core/ReactNativeVersion.js

@@ -17,7 +17,7 @@ const version: $ReadOnly<{
   major: 0,
   minor: 77,
   patch: 0,
-  prerelease: 'nightly-20241015-3485e9ed8',
+  prerelease: 'nightly-20241031-3a01a0c9c',
 };
 
 module.exports = {version};

package/Libraries/Core/__mocks__/NativeExceptionsManager.js

@@ -14,7 +14,6 @@ import typeof NativeExceptionsManager from '../NativeExceptionsManager';
 export default ({
   reportFatalException: jest.fn(),
   reportSoftException: jest.fn(),
-  updateExceptionMessage: jest.fn(),
   dismissRedbox: jest.fn(),
   reportException: jest.fn(),
 }: NativeExceptionsManager);

package/Libraries/Core/setUpErrorHandling.js

@@ -21,13 +21,7 @@ ExceptionsManager.installConsoleErrorReporter();
 if (!global.__fbDisableExceptionsManager) {
   const handleError = (e: mixed, isFatal: boolean) => {
     try {
-      // TODO(T196834299): We should really use a c++ turbomodule for this
-      if (
-        !global.RN$handleException ||
-        !global.RN$handleException(e, isFatal)
-      ) {
-        ExceptionsManager.handleException(e, isFatal);
-      }
+      ExceptionsManager.handleException(e, isFatal);
     } catch (ee) {
       console.log('Failed to print error: ', ee.message);
       throw e;

package/Libraries/Core/setUpReactDevTools.js

@@ -11,6 +11,7 @@
 'use strict';
 
 import type {Domain} from '../../src/private/debugging/setUpFuseboxReactDevToolsDispatcher';
+import type {Spec as NativeReactDevToolsRuntimeSettingsModuleSpec} from '../../src/private/fusebox/specs/NativeReactDevToolsRuntimeSettingsModule';
 
 if (__DEV__) {
   // Register dispatcher on global, which can be used later by Chrome DevTools frontend
@@ -24,6 +25,8 @@ if (__DEV__) {
   const reactDevToolsSettingsManager = require('../../src/private/debugging/ReactDevToolsSettingsManager');
   const serializedHookSettings =
     reactDevToolsSettingsManager.getGlobalHookSettings();
+  const maybeReactDevToolsRuntimeSettingsModuleModule =
+    require('../../src/private/fusebox/specs/NativeReactDevToolsRuntimeSettingsModule').default;
 
   let hookSettings = null;
   if (serializedHookSettings != null) {
@@ -36,8 +39,14 @@ if (__DEV__) {
       );
     }
   }
+
+  const {
+    isProfiling: shouldStartProfilingNow,
+    profilingSettings: initialProfilingSettings,
+  } = readReloadAndProfileConfig(maybeReactDevToolsRuntimeSettingsModuleModule);
+
   // Install hook before React is loaded.
-  initialize(hookSettings);
+  initialize(hookSettings, shouldStartProfilingNow, initialProfilingSettings);
 
   // This should be defined in DEV, otherwise error is expected.
   const fuseboxReactDevToolsDispatcher =
@@ -63,6 +72,14 @@ if (__DEV__) {
   }
 
   function connectToReactDevToolsInFusebox(domain: Domain) {
+    const {
+      isReloadAndProfileSupported,
+      isProfiling,
+      onReloadAndProfile,
+      onReloadAndProfileFlagsReset,
+    } = readReloadAndProfileConfig(
+      maybeReactDevToolsRuntimeSettingsModuleModule,
+    );
     disconnect = connectWithCustomMessagingProtocol({
       onSubscribe: listener => {
         domain.onMessage.addEventListener(listener);
@@ -76,6 +93,10 @@ if (__DEV__) {
       nativeStyleEditorValidAttributes: Object.keys(ReactNativeStyleAttributes),
       resolveRNStyle,
       onSettingsUpdated: handleReactDevToolsSettingsUpdate,
+      isReloadAndProfileSupported,
+      isProfiling,
+      onReloadAndProfile,
+      onReloadAndProfileFlagsReset,
     });
   }
 
@@ -127,6 +148,14 @@ if (__DEV__) {
         isWebSocketOpen = true;
       });
 
+      const {
+        isReloadAndProfileSupported,
+        isProfiling,
+        onReloadAndProfile,
+        onReloadAndProfileFlagsReset,
+      } = readReloadAndProfileConfig(
+        maybeReactDevToolsRuntimeSettingsModuleModule,
+      );
       connectToDevTools({
         isAppActive,
         resolveRNStyle,
@@ -135,6 +164,10 @@ if (__DEV__) {
         ),
         websocket: ws,
         onSettingsUpdated: handleReactDevToolsSettingsUpdate,
+        isReloadAndProfileSupported,
+        isProfiling,
+        onReloadAndProfile,
+        onReloadAndProfileFlagsReset,
       });
     }
   }
@@ -166,3 +199,43 @@ if (__DEV__) {
   );
   connectToWSBasedReactDevToolsFrontend(); // Try connecting once on load
 }
+
+function readReloadAndProfileConfig(
+  maybeModule: ?NativeReactDevToolsRuntimeSettingsModuleSpec,
+) {
+  const isReloadAndProfileSupported = maybeModule != null;
+  const config = maybeModule?.getReloadAndProfileConfig();
+  const isProfiling = config?.shouldReloadAndProfile === true;
+  const profilingSettings = {
+    recordChangeDescriptions: config?.recordChangeDescriptions === true,
+    recordTimeline: false,
+  };
+  const onReloadAndProfile = (recordChangeDescriptions: boolean) => {
+    if (maybeModule == null) {
+      return;
+    }
+
+    maybeModule.setReloadAndProfileConfig({
+      shouldReloadAndProfile: true,
+      recordChangeDescriptions,
+    });
+  };
+  const onReloadAndProfileFlagsReset = () => {
+    if (maybeModule == null) {
+      return;
+    }
+
+    maybeModule.setReloadAndProfileConfig({
+      shouldReloadAndProfile: false,
+      recordChangeDescriptions: false,
+    });
+  };
+
+  return {
+    isReloadAndProfileSupported,
+    isProfiling,
+    profilingSettings,
+    onReloadAndProfile,
+    onReloadAndProfileFlagsReset,
+  };
+}

package/Libraries/Core/setUpTimers.js

@@ -21,6 +21,25 @@ if (__DEV__) {
   }
 }
 
+const isEventLoopEnabled = (() => {
+  if (NativeReactNativeFeatureFlags == null) {
+    return false;
+  }
+
+  if (NativeReactNativeFeatureFlags.disableEventLoopOnBridgeless == null) {
+    // Flags not unified yet
+    return (
+      ReactNativeFeatureFlags.useModernRuntimeScheduler() &&
+      ReactNativeFeatureFlags.enableMicrotasks()
+    );
+  } else {
+    return (
+      ReactNativeFeatureFlags.enableBridgelessArchitecture() &&
+      !ReactNativeFeatureFlags.disableEventLoopOnBridgeless()
+    );
+  }
+})();
+
 // In bridgeless mode, timers are host functions installed from cpp.
 if (global.RN$Bridgeless !== true) {
   /**
@@ -48,12 +67,7 @@ if (global.RN$Bridgeless !== true) {
   defineLazyTimer('cancelAnimationFrame');
   defineLazyTimer('requestIdleCallback');
   defineLazyTimer('cancelIdleCallback');
-} else if (
-  // TODO remove this condition when bridgeless == modern scheduler everywhere.
-  NativeReactNativeFeatureFlags != null &&
-  // eslint-disable-next-line react-hooks/rules-of-hooks -- false positive due to `use` prefix
-  ReactNativeFeatureFlags.useModernRuntimeScheduler()
-) {
+} else if (isEventLoopEnabled) {
   polyfillGlobal(
     'requestIdleCallback',
     () =>
@@ -72,10 +86,7 @@ if (global.RN$Bridgeless !== true) {
 // We need to check if the native module is available before accessing the
 // feature flag, because otherwise the API would throw an error in the legacy
 // architecture in OSS, where the native module isn't available.
-if (
-  NativeReactNativeFeatureFlags != null &&
-  ReactNativeFeatureFlags.enableMicrotasks()
-) {
+if (isEventLoopEnabled) {
   // This is the flag that tells React to use `queueMicrotask` to batch state
   // updates, instead of using the scheduler to schedule a regular task.
   // We use a global variable because we don't currently have any other

package/Libraries/Image/Image.android.js

@@ -166,11 +166,9 @@ let BaseImage: AbstractImageAndroid = React.forwardRef(
       sources = [source];
     }
 
-    const {height, width, ...restProps} = props;
-
     const {onLoadStart, onLoad, onLoadEnd, onError} = props;
     const nativeProps = {
-      ...restProps,
+      ...props,
       style,
       shouldNotifyLoadEvents: !!(onLoadStart || onLoad || onLoadEnd || onError),
       // Both iOS and C++ sides expect to have "source" prop, whereas on Android it's "src"

package/Libraries/Image/Image.d.ts

@@ -60,18 +60,28 @@ export interface ImagePropsIOS {
 interface ImagePropsAndroid {
   /**
    * The mechanism that should be used to resize the image when the image's dimensions
-   * differ from the image view's dimensions. Defaults to auto.
+   * differ from the image view's dimensions. Defaults to `auto`.
    *
-   * 'auto': Use heuristics to pick between resize and scale.
+   * - `auto`: Use heuristics to pick between `resize` and `scale`.
    *
-   * 'resize': A software operation which changes the encoded image in memory before it gets decoded.
-   * This should be used instead of scale when the image is much larger than the view.
+   * - `resize`: A software operation which changes the encoded image in memory before it
+   * gets decoded. This should be used instead of `scale` when the image is much larger
+   * than the view.
    *
-   * 'scale': The image gets drawn downscaled or upscaled. Compared to resize, scale is faster (usually hardware accelerated)
-   * and produces higher quality images. This should be used if the image is smaller than the view.
-   * It should also be used if the image is slightly bigger than the view.
+   * - `scale`: The image gets drawn downscaled or upscaled. Compared to `resize`, `scale` is
+   * faster (usually hardware accelerated) and produces higher quality images. This
+   * should be used if the image is smaller than the view. It should also be used if the
+   * image is slightly bigger than the view.
+   *
+   * - `none`: No sampling is performed and the image is displayed in its full resolution. This
+   * should only be used in rare circumstances because it is considered unsafe as Android will
+   * throw a runtime exception when trying to render images that consume too much memory.
+   *
+   * More details about `resize` and `scale` can be found at http://frescolib.org/docs/resizing-rotating.html.
+   *
+   * @platform android
    */
-  resizeMethod?: 'auto' | 'resize' | 'scale' | undefined;
+  resizeMethod?: 'auto' | 'resize' | 'scale' | 'none' | undefined;
 
   /**
    * Duration of fade in animation in ms. Defaults to 300
@@ -193,27 +203,6 @@ export interface ImagePropsBase
    */
   resizeMode?: ImageResizeMode | undefined;
 
-  /**
-   * The mechanism that should be used to resize the image when the image's dimensions
-   * differ from the image view's dimensions. Defaults to `auto`.
-   *
-   * - `auto`: Use heuristics to pick between `resize` and `scale`.
-   *
-   * - `resize`: A software operation which changes the encoded image in memory before it
-   * gets decoded. This should be used instead of `scale` when the image is much larger
-   * than the view.
-   *
-   * - `scale`: The image gets drawn downscaled or upscaled. Compared to `resize`, `scale` is
-   * faster (usually hardware accelerated) and produces higher quality images. This
-   * should be used if the image is smaller than the view. It should also be used if the
-   * image is slightly bigger than the view.
-   *
-   * More details about `resize` and `scale` can be found at http://frescolib.org/docs/resizing-rotating.html.
-   *
-   * @platform android
-   */
-  resizeMethod?: 'auto' | 'resize' | 'scale' | undefined;
-
   /**
    * The image source (either a remote URL or a local file resource).
    *

package/Libraries/Image/Image.ios.js

@@ -145,9 +145,7 @@ let BaseImage: AbstractImageIOS = React.forwardRef((props, forwardedRef) => {
     'aria-disabled': ariaDisabled,
     'aria-expanded': ariaExpanded,
     'aria-selected': ariaSelected,
-    height,
     src,
-    width,
     ...restProps
   } = props;
 

package/Libraries/Image/Image.win32.js

@@ -164,9 +164,7 @@ let BaseImage: AbstractImageIOS = React.forwardRef((props, forwardedRef) => {
     'aria-multiselectable': ariaMultiselectable, // Win32
     'aria-required': ariaRequired, // Win32
     'aria-selected': ariaSelected,
-    height,
     src,
-    width,
     ...restProps
   } = props;
 

package/Libraries/Inspector/Inspector.js

@@ -17,6 +17,7 @@ import type {
 } 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');

package/Libraries/Inspector/Inspector.win32.js

@@ -17,6 +17,7 @@ import type {
 } 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 PressabilityDebug = require('../Pressability/PressabilityDebug');

package/Libraries/Lists/SectionListModern.js

@@ -16,7 +16,7 @@ import type {
   SectionBase as _SectionBase,
   VirtualizedSectionListProps,
 } from '@react-native/virtualized-lists';
-import type {AbstractComponent, ElementRef} from 'react';
+import type {ElementRef} from 'react';
 
 import Platform from '../Utilities/Platform';
 import {VirtualizedSectionList} from '@react-native/virtualized-lists';
@@ -93,7 +93,7 @@ type OptionalProps<SectionT: SectionBase<any>> = {|
   removeClippedSubviews?: boolean,
 |};
 
-export type Props<SectionT> = {|
+export type Props<SectionT: SectionBase<any>> = $ReadOnly<{|
   ...$Diff<
     VirtualizedSectionListProps<SectionT>,
     {
@@ -115,7 +115,7 @@ export type Props<SectionT> = {|
   >,
   ...RequiredProps<SectionT>,
   ...OptionalProps<SectionT>,
-|};
+|}>;
 
 /**
  * A performant interface for rendering sectioned lists, supporting the most handy features:
@@ -172,10 +172,10 @@ export type Props<SectionT> = {|
  *   Alternatively, you can provide a custom `keyExtractor` prop.
  *
  */
-const SectionList: AbstractComponent<Props<SectionBase<any>>, any> = forwardRef<
-  Props<SectionBase<any>>,
-  any,
->((props, ref) => {
+const SectionList: component(
+  ref?: React.RefSetter<any>,
+  ...Props<SectionBase<any>>
+) = forwardRef<Props<SectionBase<any>>, any>((props, ref) => {
   const propsWithDefaults = {
     stickySectionHeadersEnabled: Platform.OS === 'ios',
     ...props,

package/Libraries/LogBox/Data/LogBoxData.js

@@ -421,7 +421,7 @@ type State = $ReadOnly<{|
   selectedLogIndex: number,
 |}>;
 
-type SubscribedComponent = React.AbstractComponent<
+type SubscribedComponent = React.ComponentType<
   $ReadOnly<{|
     logs: $ReadOnlyArray<LogBoxLog>,
     isDisabled: boolean,
@@ -431,7 +431,7 @@ type SubscribedComponent = React.AbstractComponent<
 
 export function withSubscription(
   WrappedComponent: SubscribedComponent,
-): React.AbstractComponent<{||}> {
+): React.ComponentType<{||}> {
   class LogBoxStateSubscription extends React.Component<Props, State> {
     static getDerivedStateFromError(): {hasError: boolean} {
       return {hasError: true};

package/Libraries/LogBox/LogBoxInspectorContainer.js

@@ -65,4 +65,4 @@ export class _LogBoxInspectorContainer extends React.Component<Props> {
 
 export default (LogBoxData.withSubscription(
   _LogBoxInspectorContainer,
-): React.AbstractComponent<{||}>);
+): React.ComponentType<{||}>);

package/Libraries/LogBox/LogBoxNotificationContainer.js

@@ -8,13 +8,13 @@
  * @format
  */
 
+import SafeAreaView from '../../src/private/components/SafeAreaView_INTERNAL_DO_NOT_USE';
 import View from '../Components/View/View';
 import StyleSheet from '../StyleSheet/StyleSheet';
 import * as LogBoxData from './Data/LogBoxData';
 import LogBoxLog from './Data/LogBoxLog';
 import LogBoxLogNotification from './UI/LogBoxNotification';
 import * as React from 'react';
-import SafeAreaView from '../../src/private/components/SafeAreaView_INTERNAL_DO_NOT_USE';
 
 type Props = $ReadOnly<{|
   logs: $ReadOnlyArray<LogBoxLog>,
@@ -102,4 +102,4 @@ const styles = StyleSheet.create({
 
 export default (LogBoxData.withSubscription(
   _LogBoxNotificationContainer,
-): React.AbstractComponent<{||}>);
+): React.ComponentType<{||}>);

package/Libraries/LogBox/UI/LogBoxInspectorHeader.js

@@ -27,7 +27,7 @@ type Props = $ReadOnly<{
   level: LogLevel,
 }>;
 
-const LogBoxInspectorHeaderSafeArea: React.AbstractComponent<ViewProps> =
+const LogBoxInspectorHeaderSafeArea: React.ComponentType<ViewProps> =
   Platform.OS === 'android' ? View : SafeAreaView;
 
 export default function LogBoxInspectorHeader(props: Props): React.Node {

package/Libraries/LogBox/UI/LogBoxInspectorHeader.win32.js

@@ -29,7 +29,7 @@ type Props = $ReadOnly<{
   level: LogLevel,
 }>;
 
-const LogBoxInspectorHeaderSafeArea: React.AbstractComponent<ViewProps> =
+const LogBoxInspectorHeaderSafeArea: React.ComponentType<ViewProps> =
   Platform.OS === 'android' ? View : SafeAreaView;
 
 export default function LogBoxInspectorHeader(props: Props): React.Node {

package/Libraries/Modal/Modal.js

@@ -224,6 +224,9 @@ class Modal extends React.Component<Props, State> {
   }
 
   componentWillUnmount() {
+    if (Platform.OS === 'ios') {
+      this.setState({isRendered: false});
+    }
     if (this._eventSubscription) {
       this._eventSubscription.remove();
     }
@@ -339,8 +342,7 @@ const styles = StyleSheet.create({
   },
 });
 
-const ExportedModal: React.AbstractComponent<
-  React.ElementConfig<typeof Modal>,
-> = ModalInjection.unstable_Modal ?? Modal;
+const ExportedModal: React.ComponentType<React.ElementConfig<typeof Modal>> =
+  ModalInjection.unstable_Modal ?? Modal;
 
 module.exports = ExportedModal;

package/Libraries/NativeComponent/BaseViewConfig.android.js

@@ -294,6 +294,71 @@ const validAttributesForNonEventProps = {
   style: ReactNativeStyleAttributes,
 
   experimental_layoutConformance: true,
+
+  // ReactClippingViewManager @ReactProps
+  removeClippedSubviews: true,
+
+  // ReactViewManager @ReactProps
+  accessible: true,
+  hasTVPreferredFocus: true,
+  nextFocusDown: true,
+  nextFocusForward: true,
+  nextFocusLeft: true,
+  nextFocusRight: true,
+  nextFocusUp: true,
+
+  borderRadius: true,
+  borderTopLeftRadius: true,
+  borderTopRightRadius: true,
+  borderBottomRightRadius: true,
+  borderBottomLeftRadius: true,
+  borderTopStartRadius: true,
+  borderTopEndRadius: true,
+  borderBottomStartRadius: true,
+  borderBottomEndRadius: true,
+  borderEndEndRadius: true,
+  borderEndStartRadius: true,
+  borderStartEndRadius: true,
+  borderStartStartRadius: true,
+  borderStyle: true,
+  hitSlop: true,
+  pointerEvents: true,
+  nativeBackgroundAndroid: true,
+  nativeForegroundAndroid: true,
+  needsOffscreenAlphaCompositing: true,
+
+  borderColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderLeftColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderRightColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderTopColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderBottomColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderStartColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderEndColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderBlockColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderBlockEndColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  borderBlockStartColor: {
+    process: require('../StyleSheet/processColor').default,
+  },
+  focusable: true,
+  backfaceVisibility: true,
 };
 
 // Props for bubbling and direct events

package/Libraries/NativeComponent/NativeComponentRegistry.js

@@ -48,7 +48,7 @@ export function setRuntimeConfigProvider(
  * The supplied `viewConfigProvider` may or may not be invoked and utilized,
  * depending on how `setRuntimeConfigProvider` is configured.
  */
-export function get<Config>(
+export function get<Config: {...}>(
   name: string,
   viewConfigProvider: () => PartialViewConfig,
 ): HostComponent<Config> {
@@ -121,10 +121,10 @@ export function get<Config>(
  * that the return value of this is not `HostComponent` because the returned
  * component instance is not guaranteed to have native methods.
  */
-export function getWithFallback_DEPRECATED<Config>(
+export function getWithFallback_DEPRECATED<Config: {...}>(
   name: string,
   viewConfigProvider: () => PartialViewConfig,
-): React.AbstractComponent<Config> {
+): React.ComponentType<Config> {
   if (getRuntimeConfig == null) {
     // `getRuntimeConfig == null` when static view configs are disabled
     // If `setRuntimeConfigProvider` is not configured, use native reflection.