[docs] Update Strict TypeScript API guide#5111
Conversation
- Simplification pass. - Add/consolidate ref type guidance.
|
@huntie is attempting to deploy a commit to the React Foundation Team on Vercel. A member of the Team first needs to authorize it. |
✅ Deploy Preview for react-native ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
cipolleschi
left a comment
cipolleschi
left a comment
There was a problem hiding this comment.
Overall looks good. Left a couple of comments and one code example needs to be fixed.
| When the community is ready, the Strict TypeScript API will become our default API in future — synchronized with deep imports removal. | ||
| The Strict API is currently in preview as we iterate towards a stable JavaScript API for React Native. | ||
|
|
||
| ## Opting in |
There was a problem hiding this comment.
if opt-in is automatic, shouldn't we explain how to opt-out instead, and remove this section?
There was a problem hiding this comment.
Ah yeah — wanted to land this first (base docs update with the definitely-landing changes in 0.87) and then update the opt-out → opt-in change (and blog post) given the rollout looks good across our RC releases.
| ## Migration guide | ||
|
|
||
| ### Codegen types should now be imported from the `react-native` package | ||
| ### Codegen types → `CodegenTypes` namespace |
There was a problem hiding this comment.
| ### Codegen types → `CodegenTypes` namespace | |
| ### `CodegenTypes` namespace |
|
|
||
| **After** | ||
| </TabItem> | ||
| <TabItem value="after" label="After"> |
There was a problem hiding this comment.
nit: my personal preference is to see both before and after at the same time. Switching between the two might make easier to miss some details.
| </TabItem> | ||
| </Tabs> | ||
|
|
||
| ### Refs now use `*Instance` types |
There was a problem hiding this comment.
this will need to be explained also in the Blogpost.
|
|
||
| ```tsx title="" | ||
| import {useRef} from 'react'; | ||
| import type {ViewInstance, TextInputInstance} from 'react-native'; |
There was a problem hiding this comment.
| import type {ViewInstance, TextInputInstance} from 'react-native'; | |
| import type {View, TextInput, ViewInstance, TextInputInstance} from 'react-native'; |
You are still using View and TextInput in the JSX.
| This also replaces the removed `Animated.LegacyRef` type. Code using `ref={ref as React.Ref<Animated.LegacyRef<View>>}` can be simplified to `ref={ref}` with a `ViewInstance`-typed ref. | ||
|
|
||
| <details> | ||
| <summary>**🗒️ Available instance types**</summary> |
There was a problem hiding this comment.
| <summary>**🗒️ Available instance types**</summary> | |
| <summary>**Available instance types**</summary> |
| | `VirtualizedList` | `VirtualizedListInstance` | | ||
| | `VirtualizedSectionList` | `VirtualizedSectionListInstance` | | ||
|
|
||
| Components without ref support (`InputAccessoryView`, `TouchableWithoutFeedback`, `experimental_LayoutConformance`) do not have instance types. |
There was a problem hiding this comment.
will they throw an error?
|
|
||
| **Affected APIs** | ||
| <details> | ||
| <summary>**🗒️ Affected APIs**</summary> |
There was a problem hiding this comment.
| <summary>**🗒️ Affected APIs**</summary> | |
| <summary>**Affected APIs**</summary> |
2 participants
See react-native-community/discussions-and-proposals#1003. Replaces #5067.