diff --git a/packages/react-native/Libraries/Components/Pressable/Pressable.js b/packages/react-native/Libraries/Components/Pressable/Pressable.js index 29e71f0c08a..8fa507bc416 100644 --- a/packages/react-native/Libraries/Components/Pressable/Pressable.js +++ b/packages/react-native/Libraries/Components/Pressable/Pressable.js @@ -43,7 +43,7 @@ type PressableBaseProps = $ReadOnly<{ * Either children or a render prop that receives a boolean reflecting whether * the component is currently pressed. */ - children: React.Node | ((state: PressableStateCallbackType) => React.Node), + children?: React.Node | ((state: PressableStateCallbackType) => React.Node), /** * Duration to wait after hover in before calling `onHoverIn`. diff --git a/packages/react-native/Libraries/EventEmitter/NativeEventEmitter.js b/packages/react-native/Libraries/EventEmitter/NativeEventEmitter.js index 2e901e75ac4..44312cba946 100644 --- a/packages/react-native/Libraries/EventEmitter/NativeEventEmitter.js +++ b/packages/react-native/Libraries/EventEmitter/NativeEventEmitter.js @@ -25,6 +25,8 @@ interface NativeModule { } export type {EventSubscription}; +/** @deprecated Use `EventSubscription` instead. */ +export type NativeEventSubscription = EventSubscription; // $FlowFixMe[unclear-type] unclear type of events type UnsafeObject = Object; diff --git a/packages/react-native/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js b/packages/react-native/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js index 1c243f58ab4..8efa3a95dab 100644 --- a/packages/react-native/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js +++ b/packages/react-native/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js @@ -10,10 +10,10 @@ import type { HostInstance, - LegacyHostInstanceMethods, MeasureInWindowOnSuccessCallback, MeasureLayoutOnSuccessCallback, MeasureOnSuccessCallback, + NativeMethods, } from '../../../src/private/types/HostInstance'; import type { InternalInstanceHandle, @@ -40,9 +40,7 @@ const noop = () => {}; /** * This is used for refs on host components. */ -export default class ReactFabricHostComponent - implements LegacyHostInstanceMethods -{ +export default class ReactFabricHostComponent implements NativeMethods { // These need to be accessible from `ReactFabricPublicInstanceUtils`. __nativeTag: number; __internalInstanceHandle: InternalInstanceHandle; diff --git a/packages/react-native/Libraries/ReactPrivate/ReactNativePrivateInterface.js b/packages/react-native/Libraries/ReactPrivate/ReactNativePrivateInterface.js index 447aba0f1ff..ed7bf10c35a 100644 --- a/packages/react-native/Libraries/ReactPrivate/ReactNativePrivateInterface.js +++ b/packages/react-native/Libraries/ReactPrivate/ReactNativePrivateInterface.js @@ -41,7 +41,7 @@ export type { HostInstance as PublicInstance, // These types are only necessary for Paper - LegacyHostInstanceMethods as LegacyPublicInstance, + NativeMethods as LegacyPublicInstance, MeasureOnSuccessCallback, MeasureInWindowOnSuccessCallback, MeasureLayoutOnSuccessCallback, diff --git a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap index b4ce724c26e..8368a7ed347 100644 --- a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap +++ b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap @@ -1739,7 +1739,7 @@ export type PressableStateCallbackType = $ReadOnly<{ }>; type PressableBaseProps = $ReadOnly<{ cancelable?: ?boolean, - children: React.Node | ((state: PressableStateCallbackType) => React.Node), + children?: React.Node | ((state: PressableStateCallbackType) => React.Node), delayHoverIn?: ?number, delayHoverOut?: ?number, delayLongPress?: ?number, @@ -4424,6 +4424,7 @@ exports[`public API should not change unintentionally Libraries/EventEmitter/Nat removeListeners(count: number): void; } export type { EventSubscription }; +export type NativeEventSubscription = EventSubscription; type UnsafeObject = Object; declare export default class NativeEventEmitter< TEventToArgsMap: $ReadOnly< @@ -7077,9 +7078,7 @@ declare export default typeof UIManagerJS; `; exports[`public API should not change unintentionally Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js 1`] = ` -"declare export default class ReactFabricHostComponent - implements LegacyHostInstanceMethods -{ +"declare export default class ReactFabricHostComponent implements NativeMethods { constructor( tag: number, viewConfig: ViewConfig, @@ -9305,7 +9304,8 @@ declare export default typeof rejectionTrackingOptions; `; exports[`public API should not change unintentionally Libraries/vendor/core/ErrorUtils.js 1`] = ` -"declare export default ErrorUtilsT; +"export type ErrorUtils = ErrorUtilsT; +declare export default ErrorUtilsT; " `; @@ -9575,6 +9575,7 @@ export { default as LogBox } from \\"./Libraries/LogBox/LogBox\\"; export { default as NativeAppEventEmitter } from \\"./Libraries/EventEmitter/RCTNativeAppEventEmitter\\"; export { default as NativeDialogManagerAndroid } from \\"./Libraries/NativeModules/specs/NativeDialogManagerAndroid\\"; export { default as NativeEventEmitter } from \\"./Libraries/EventEmitter/NativeEventEmitter\\"; +export type { NativeEventSubscription } from \\"./Libraries/EventEmitter/NativeEventEmitter\\"; export { default as NativeModules } from \\"./Libraries/BatchedBridge/NativeModules\\"; export { default as Networking } from \\"./Libraries/Network/RCTNetworking\\"; export type { @@ -9660,11 +9661,14 @@ export type { export type * from \\"./Libraries/Types/CodegenTypesNamespace\\"; export type { HostInstance, + NativeMethods, MeasureInWindowOnSuccessCallback, MeasureLayoutOnSuccessCallback, MeasureOnSuccessCallback, } from \\"./src/private/types/HostInstance\\"; export type { HostComponent } from \\"./src/private/types/HostComponent\\"; +export type { ColorSchemeName } from \\"./src/private/specs_DEPRECATED/modules/NativeAppearance\\"; +export type { ErrorUtils } from \\"./Libraries/vendor/core/ErrorUtils\\"; " `; @@ -9717,7 +9721,7 @@ export type MeasureLayoutOnSuccessCallback = ( width: number, height: number ) => void; -export interface LegacyHostInstanceMethods { +export interface NativeMethods { blur(): void; focus(): void; measure(callback: MeasureOnSuccessCallback): void; @@ -9729,7 +9733,7 @@ export interface LegacyHostInstanceMethods { ): void; setNativeProps(nativeProps: { ... }): void; } -export type HostInstance = LegacyHostInstanceMethods; +export type HostInstance = NativeMethods; " `; @@ -9758,7 +9762,7 @@ declare export function createReactNativeDocument( exports[`public API should not change unintentionally src/private/webapis/dom/nodes/ReactNativeElement.js 1`] = ` "declare class ReactNativeElement extends ReadOnlyElement - implements LegacyHostInstanceMethods + implements NativeMethods { constructor( tag: number, diff --git a/packages/react-native/Libraries/vendor/core/ErrorUtils.js b/packages/react-native/Libraries/vendor/core/ErrorUtils.js index 3d331a5166b..c1c6f61e767 100644 --- a/packages/react-native/Libraries/vendor/core/ErrorUtils.js +++ b/packages/react-native/Libraries/vendor/core/ErrorUtils.js @@ -10,6 +10,8 @@ import type {ErrorUtilsT} from '@react-native/js-polyfills/error-guard'; +export type ErrorUtils = ErrorUtilsT; + /** * The particular require runtime that we are using looks for a global * `ErrorUtils` object and if it exists, then it requires modules with the diff --git a/packages/react-native/index.js.flow b/packages/react-native/index.js.flow index 9e3fe82921a..ddcc31860d4 100644 --- a/packages/react-native/index.js.flow +++ b/packages/react-native/index.js.flow @@ -296,6 +296,7 @@ export {default as NativeAppEventEmitter} from './Libraries/EventEmitter/RCTNati export {default as NativeDialogManagerAndroid} from './Libraries/NativeModules/specs/NativeDialogManagerAndroid'; export {default as NativeEventEmitter} from './Libraries/EventEmitter/NativeEventEmitter'; +export type {NativeEventSubscription} from './Libraries/EventEmitter/NativeEventEmitter'; export {default as NativeModules} from './Libraries/BatchedBridge/NativeModules'; export {default as Networking} from './Libraries/Network/RCTNetworking'; @@ -401,10 +402,13 @@ export type * from './Libraries/Types/CodegenTypesNamespace'; export type { HostInstance, + NativeMethods, MeasureInWindowOnSuccessCallback, MeasureLayoutOnSuccessCallback, MeasureOnSuccessCallback, } from './src/private/types/HostInstance'; export type {HostComponent} from './src/private/types/HostComponent'; +export type {ColorSchemeName} from './src/private/specs_DEPRECATED/modules/NativeAppearance'; +export type {ErrorUtils} from './Libraries/vendor/core/ErrorUtils'; // #endregion diff --git a/packages/react-native/src/private/types/HostInstance.js b/packages/react-native/src/private/types/HostInstance.js index bf7aa5a592f..6924ab9f471 100644 --- a/packages/react-native/src/private/types/HostInstance.js +++ b/packages/react-native/src/private/types/HostInstance.js @@ -32,19 +32,77 @@ export type MeasureLayoutOnSuccessCallback = ( ) => void; /** - * Current usages should migrate to this definition + * NativeMethods provides methods to access the underlying native component directly. + * This can be useful in cases when you want to focus a view or measure its on-screen dimensions, + * for example. + * The methods described here are available on most of the default components provided by React Native. + * Note, however, that they are not available on composite components that aren't directly backed by a + * native view. This will generally include most components that you define in your own app. + * For more information, see [Direct Manipulation](https://reactnative.dev/docs/direct-manipulation). + * @see https://github.com/facebook/react-native/blob/master/Libraries/Renderer/shims/ReactNativeTypes.js#L87 */ -export interface LegacyHostInstanceMethods { +export interface NativeMethods { + /** + * Removes focus from an input or view. This is the opposite of `focus()`. + */ blur(): void; + /** + * Requests focus for the given input or view. The exact behavior triggered + * will depend on the platform and type of view. + */ focus(): void; + /** + * Determines the location on screen, width, and height of the given view and + * returns the values via an async callback. If successful, the callback will + * be called with the following arguments: + * + * - x + * - y + * - width + * - height + * - pageX + * - pageY + * + * Note that these measurements are not available until after the rendering + * has been completed in native. If you need the measurements as soon as + * possible, consider using the [`onLayout` + * prop](docs/view.html#onlayout) instead. + */ measure(callback: MeasureOnSuccessCallback): void; + /** + * Determines the location of the given view in the window and returns the + * values via an async callback. If the React root view is embedded in + * another native view, this will give you the absolute coordinates. If + * successful, the callback will be called with the following + * arguments: + * + * - x + * - y + * - width + * - height + * + * Note that these measurements are not available until after the rendering + * has been completed in native. + */ measureInWindow(callback: MeasureInWindowOnSuccessCallback): void; + /** + * Like [`measure()`](#measure), but measures the view relative an ancestor, + * specified as `relativeToNativeComponentRef`. This means that the returned x, y + * are relative to the origin x, y of the ancestor view. + * _Can also be called with a relativeNativeNodeHandle but is deprecated._ + */ measureLayout( relativeToNativeNode: number | HostInstance, onSuccess: MeasureLayoutOnSuccessCallback, onFail?: () => void, ): void; + /** + * This function sends props straight to native. They will not participate in + * future diff process - this means that if you do not include them in the + * next render, they will remain active (see [Direct + * Manipulation](https://reactnative.dev/docs/direct-manipulation)). + */ setNativeProps(nativeProps: {...}): void; } -export type HostInstance = LegacyHostInstanceMethods; +export type HostInstance = NativeMethods; diff --git a/packages/react-native/src/private/webapis/dom/nodes/ReactNativeElement.js b/packages/react-native/src/private/webapis/dom/nodes/ReactNativeElement.js index 362726e0b17..d4f669e8fe2 100644 --- a/packages/react-native/src/private/webapis/dom/nodes/ReactNativeElement.js +++ b/packages/react-native/src/private/webapis/dom/nodes/ReactNativeElement.js @@ -17,10 +17,10 @@ import type { } from '../../../../../Libraries/Renderer/shims/ReactNativeTypes'; import type { HostInstance, - LegacyHostInstanceMethods, MeasureInWindowOnSuccessCallback, MeasureLayoutOnSuccessCallback, MeasureOnSuccessCallback, + NativeMethods, } from '../../../types/HostInstance'; import type {InstanceHandle} from './internals/NodeInternals'; import type ReactNativeDocument from './ReactNativeDocument'; @@ -60,10 +60,7 @@ const noop = () => {}; // was slower than this method because the engine has to create an object than // we then discard to create a new one. -class ReactNativeElement - extends ReadOnlyElement - implements LegacyHostInstanceMethods -{ +class ReactNativeElement extends ReadOnlyElement implements NativeMethods { // These need to be accessible from `ReactFabricPublicInstanceUtils`. __nativeTag: number; __internalInstanceHandle: InstanceHandle;