Align to canonical *Instance types in component ref annotations#56951
Open
huntie wants to merge 2 commits into
Open
Align to canonical *Instance types in component ref annotations#56951huntie wants to merge 2 commits into
huntie wants to merge 2 commits into
Conversation
Summary: Add a publicly exported `*Instance` type for every built-in component in `index.js.flow`, giving consumers a consistent way to type refs for any React Native component. Affects the Strict TypeScript API (opt-in generated TS types) only. #### Motivation + RFC Draft implementation for the recommended approach in react-native-community/discussions-and-proposals#1003. Alternative to facebook#56673. #### New types | Component | Instance Type | Type Value | |---|---|---| | `ActivityIndicator` | `ActivityIndicatorInstance` | `HostInstance` | | `Button` | `ButtonInstance` | `ButtonRef` (platform-dependent) | | `DrawerLayoutAndroid` | `DrawerLayoutAndroidInstance` | `DrawerLayoutAndroidMethods` | | `FlatList` | `FlatListInstance` | `FlatList<>` | | `Image` | `ImageInstance` | `HostInstance` | | `ImageBackground` | `ImageBackgroundInstance` | `ImageBackground` (class) | | `KeyboardAvoidingView` | `KeyboardAvoidingViewInstance` | `KeyboardAvoidingView` (class) | | `Modal` | `ModalInstance` | `HostInstance` | | `Pressable` | `PressableInstance` | `HostInstance` | | `ProgressBarAndroid` | `ProgressBarAndroidInstance` | `HostInstance` | | `RefreshControl` | `RefreshControlInstance` | `RefreshControl` (class) | | `SafeAreaView` | `SafeAreaViewInstance` | `HostInstance` | | `ScrollView` | `ScrollViewInstance` | `extends HostInstance, ScrollViewImperativeMethods` | | `SectionList` | `SectionListInstance` | `SectionList<>` | | `StatusBar` | `StatusBarInstance` | `StatusBar` (class) | | `Switch` | `SwitchInstance` | `HostInstance` | | `Text` | `TextInstance` | `HostInstance` | | `TextInput` | `TextInputInstance` | `extends ReactNativeElement` (existing) | | `TouchableHighlight` | `TouchableHighlightInstance` | `HostInstance` | | `TouchableNativeFeedback` | `TouchableNativeFeedbackInstance` | `TouchableNativeFeedback` (class) | | `TouchableOpacity` | `TouchableOpacityInstance` | `HostInstance` | | `View` | `ViewInstance` | `HostInstance` | | `VirtualizedList` | `VirtualizedListInstance` | `React.ElementRef<VirtualizedListType>` | | `VirtualizedSectionList` | `VirtualizedSectionListInstance` | `React.ElementRef<VirtualizedSectionListType>` | #### Renames - `PublicScrollViewInstance` → `ScrollViewInstance` (old name kept as deprecated alias; internal usages in `ScrollView.js` and `FlatList.js` updated) - `PublicModalInstance` → `ModalInstance` (old name kept as deprecated alias) #### Skipped (no ref support) `InputAccessoryView`, `experimental_LayoutConformance`, `TouchableWithoutFeedback`, `Touchable` (namespace) Changelog: [General][Added] - **Strict TypeScript API**: Add `*Instance` ref types for all built-in components Differential Revision: D106144383
meta-cla
Bot
added
the
CLA Signed
|
Warning JavaScript API change detected This PR commits an update to
This change was flagged as: |
Summary: Update all ref parameters, ref-returning props, and `useRef` calls in built-in components to use the canonical `*Instance` types introduced in the previous diff. #### Changes - Replace inline `React.ElementRef<typeof NativeComponent>` patterns with the canonical `*Instance` type in each component declaration and its inline destructuring type. - Replace `useRef<React.ElementRef<...>>` with `useRef<*Instance>` (Pressable, Switch). - Replace `hostRef` prop types with the component `*Instance` type (TouchableHighlight, TouchableOpacity). - Update `ModalBaseProps.modalRef` and `ModalRefProps.ref` from deprecated `PublicModalInstance` to `ModalInstance`. #### Removed aliases - `ButtonRef` (Button.js) — inlined into `ButtonInstance` - `SwitchRef` (Switch.js) — replaced by `SwitchInstance` - `TextForwardRef` (Text.js) — replaced by `TextInstance` - `type Instance` (Pressable.js) — replaced by `PressableInstance` - `HostComponent<empty>` import (ActivityIndicator.js) — no longer needed - `ProgressBarAndroidNativeComponentType` typeof import (ProgressBarAndroid.js) — no longer needed Changelog: [Internal] Differential Revision: D106144380
|
@huntie has exported this pull request. If you are a Meta employee, you can view the originating Diff in D106144380. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary:
Update all ref parameters, ref-returning props, and
useRefcalls in built-in components to use the canonical*Instancetypes introduced in the previous diff.Changes
React.ElementRef<typeof NativeComponent>patterns with the canonical*Instancetype in each component declaration and its inline destructuring type.useRef<React.ElementRef<...>>withuseRef<*Instance>(Pressable, Switch).hostRefprop types with the component*Instancetype (TouchableHighlight, TouchableOpacity).ModalBaseProps.modalRefandModalRefProps.reffrom deprecatedPublicModalInstancetoModalInstance.Removed aliases
ButtonRef(Button.js) — inlined intoButtonInstanceSwitchRef(Switch.js) — replaced bySwitchInstanceTextForwardRef(Text.js) — replaced byTextInstancetype Instance(Pressable.js) — replaced byPressableInstanceHostComponent<empty>import (ActivityIndicator.js) — no longer neededProgressBarAndroidNativeComponentTypetypeof import (ProgressBarAndroid.js) — no longer neededChangelog: [Internal]
Differential Revision: D106144380