Skip to content

Add *Instance type exports for all built-in components#56953

Open
huntie wants to merge 1 commit into
facebook:mainfrom
huntie:export-D106144383
Open

Add *Instance type exports for all built-in components#56953
huntie wants to merge 1 commit into
facebook:mainfrom
huntie:export-D106144383

Conversation

@huntie
Copy link
Copy Markdown
Member

@huntie huntie commented May 23, 2026

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

NOTE: Draft implementation for the recommended approach in react-native-community/discussions-and-proposals#1003.

Alternative to #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

  • PublicScrollViewInstanceScrollViewInstance (old name kept as deprecated alias; internal usages in ScrollView.js and FlatList.js updated)
  • PublicModalInstanceModalInstance (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

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

NOTE: 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 meta-cla Bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label May 23, 2026
@meta-codesync
Copy link
Copy Markdown

meta-codesync Bot commented May 23, 2026

@huntie has exported this pull request. If you are a Meta employee, you can view the originating Diff in D106144383.

@github-actions
Copy link
Copy Markdown

Warning

JavaScript API change detected

This PR commits an update to ReactNativeApi.d.ts, indicating a change to React Native's public JavaScript API.

  • Please include a clear changelog message.
  • This change will be subject to additional review.

This change was flagged as: POTENTIALLY_BREAKING

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. fb-exported meta-exported p: Facebook Partner: Facebook Partner

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant