-
Notifications
You must be signed in to change notification settings - Fork 4.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into 0.76-release-blog
- Loading branch information
Showing
65 changed files
with
1,635 additions
and
326 deletions.
There are no files selected for viewing
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import React from "react"; | ||
import IOSContent from "./turbo-native-modules-ios.md"; | ||
import AndroidContent from "./turbo-native-modules-android.md"; | ||
|
||
export function TurboNativeModulesIOS() { | ||
return <IOSContent />; | ||
} | ||
|
||
export function TurboNativeModulesAndroid() { | ||
return <AndroidContent />; | ||
} |
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
# Appendix | ||
|
||
## I. Terminology | ||
|
||
- **Spec** - TypeScript or Flow code that describes the API for a Turbo Native Module or Fabric Native component. Used by **Codegen** to generate boilerplate code. | ||
|
||
- **Turbo Native Modules** - Native libraries that have no User Interface (UI) for the user. Examples would be persistent storage, notifications, network events. These are accessible to your JavaScript application code as functions and objects. | ||
- **Fabric Native Component** - Native platform views that are available to your application JavaScript code through React Components. | ||
|
||
- **Legacy Native Components** - Components which are running on the old React Native architecture. | ||
- **Legacy Native Modules** - Modules which are running on the old React Native architecture. | ||
|
||
## II. Codegen Typings | ||
|
||
You may use the following table as a reference for which types are supported and what they map to in each platform: | ||
|
||
| Flow | TypeScript | Flow Nullable Support | TypeScript Nullable Support | Android (Java) | iOS (ObjC) | | ||
| -------------------------------------------------------------------------- | --------------------------------------------------- | ------------------------------------------------------- | ---------------------------------------------------- | ------------------------------------ | -------------------------------------------------------------- | | ||
| `string` | `string` | `?string` | <code>string | null</code> | `string` | `NSString` | | ||
| `boolean` | `boolean` | `?boolean` | <code>boolean | null</code> | `Boolean` | `NSNumber` | | ||
| Object Literal<br /><code>{| foo: string, ...|}</code> | <code>{ foo: string, ...} as const</code> | <code>?{| foo: string, ...|}</code> | <code>?{ foo: string, ...} as const</code> | \- | \- | | ||
| Object [[1](#notes)] | Object [[1](#notes)] | `?Object` | <code>Object | null</code> | `ReadableMap` | `@` (untyped dictionary) | | ||
| <code>Array<T></code> | <code>Array<T></code> | <code>?Array<T></code> | <code>Array<T> | null</code> | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | ||
| `Function` | `Function` | `?Function` | <code>Function | null</code> | \- | \- | | ||
| <code>Promise<T></code> | <code>Promise<T></code> | <code>?Promise<T></code> | <code>Promise<T> | null</code> | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | ||
| Type Unions<br /><code>'SUCCESS'|'FAIL'</code> | Type Unions<br /><code>'SUCCESS'|'FAIL'</code> | Only as callbacks | | \- | \- | | ||
| Callbacks<br />`() =>` | Callbacks<br />`() =>` | Yes | | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | | ||
| `number` | `number` | No | | `double` | `NSNumber` | | ||
|
||
### Notes: | ||
|
||
<b>[1]</b> We strongly recommend using Object literals instead of Objects. | ||
|
||
:::info | ||
You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository. | ||
::: |
This file contains 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
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
--- | ||
id: fabric-native-modules-android | ||
title: 'Fabric Native Modules: Android' | ||
--- | ||
|
||
import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants'; | ||
|
||
:::caution | ||
This is work-in-progress... 👷 | ||
::: |
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
--- | ||
id: fabric-native-modules-ios | ||
title: 'Fabric Native Modules: iOS' | ||
--- | ||
|
||
import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants'; | ||
|
||
:::caution | ||
This is work-in-progress... 👷 | ||
::: |
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
--- | ||
id: fabric-native-modules-introduction | ||
title: 'Fabric Native Modules' | ||
--- | ||
|
||
import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants'; | ||
|
||
:::caution | ||
This is work-in-progress... 👷 | ||
::: |
This file contains 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
This file contains 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
This file contains 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
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
--- | ||
id: native-platform | ||
title: Native Platform | ||
--- | ||
|
||
import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants'; | ||
|
||
Your application may need access to platform features that aren’t directly available from React Native or one of the hundreds of [third-party libraries](https://reactnative.directory/) maintained by the community. Maybe you want to reuse some existing Objective-C, Swift, Java, Kotlin or C++ code from the JavaScript runtime. Whatever your reason, React Native exposes a powerful set of API to connect your native code to your JavaScript application code. | ||
|
||
This guide introduces: | ||
|
||
- **Turbo Native Modules:** native libraries that have no User Interface (UI) for the user. Examples would be persistent storage, notifications, network events. These are accessible to your user as JavaScript functions and objects. | ||
- **Fabric Native Component:** native platform views, widgets and controllers that are available to your application's JavaScript code through React Components. | ||
|
||
:::note | ||
You might have previously been familiar with: | ||
|
||
- [Legacy Native Modules](./legacy/native-modules-intro); | ||
- [Legacy Native Components](./legacy/native-components-android); | ||
|
||
These are our deprecated native module and component API. You can still use many of these legacy libraries with the New Architecture thanks to our interop layers. You should consider: | ||
|
||
- using alternative libraries, | ||
- upgrading to newer library versions that have first-class support for the New Architecture, or | ||
- port these libraries yourself to Turbo Native Modules or Fabric Native Components. | ||
|
||
::: | ||
|
||
1. Turbo Native Modules | ||
- [Introduction](turbo-native-modules.md) | ||
- [Android](turbo-native-modules-android.md) | ||
- [iOS](turbo-native-modules-ios.md) | ||
2. Fabric Native Components | ||
- [Introduction](fabric-native-modules.md) | ||
- [Android](fabric-native-modules-android.md) | ||
- [iOS](fabric-native-modules-ios.md) |
This file contains 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
Oops, something went wrong.