From bff0a4c077de309b9d196997b7cc8b1d6e17d8d8 Mon Sep 17 00:00:00 2001 From: supun_yasantha034 Date: Mon, 19 Oct 2026 11:19:06 +0530 Subject: [PATCH] docs: fix broken internal anchors across documentation --- docs/alert.md | 2 +- docs/animations.md | 2 +- docs/communication-ios.md | 2 +- docs/fabric-native-components.md | 2 +- docs/fast-refresh.md | 2 +- docs/handling-text-input.md | 2 +- docs/image.md | 6 +++--- docs/javascript-environment.md | 4 ++-- docs/optimizing-javascript-loading.md | 2 +- docs/react-native-gradle-plugin.md | 2 +- docs/sectionlist.md | 2 +- docs/switch.md | 2 +- docs/troubleshooting.md | 2 +- website/versioned_docs/version-0.77/alert.md | 2 +- website/versioned_docs/version-0.77/animations.md | 2 +- website/versioned_docs/version-0.77/communication-ios.md | 2 +- .../versioned_docs/version-0.77/fabric-native-components.md | 2 +- website/versioned_docs/version-0.77/fast-refresh.md | 2 +- website/versioned_docs/version-0.77/handling-text-input.md | 2 +- website/versioned_docs/version-0.77/image.md | 6 +++--- .../versioned_docs/version-0.77/javascript-environment.md | 4 ++-- .../version-0.77/optimizing-javascript-loading.md | 2 +- .../version-0.77/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.77/sectionlist.md | 2 +- website/versioned_docs/version-0.77/switch.md | 2 +- website/versioned_docs/version-0.77/troubleshooting.md | 2 +- website/versioned_docs/version-0.78/alert.md | 2 +- website/versioned_docs/version-0.78/animations.md | 2 +- website/versioned_docs/version-0.78/communication-ios.md | 2 +- .../versioned_docs/version-0.78/fabric-native-components.md | 2 +- website/versioned_docs/version-0.78/fast-refresh.md | 2 +- website/versioned_docs/version-0.78/handling-text-input.md | 2 +- website/versioned_docs/version-0.78/image.md | 6 +++--- .../versioned_docs/version-0.78/javascript-environment.md | 4 ++-- .../version-0.78/optimizing-javascript-loading.md | 2 +- .../version-0.78/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.78/sectionlist.md | 2 +- website/versioned_docs/version-0.78/switch.md | 2 +- website/versioned_docs/version-0.78/troubleshooting.md | 2 +- website/versioned_docs/version-0.79/alert.md | 2 +- website/versioned_docs/version-0.79/animations.md | 2 +- website/versioned_docs/version-0.79/communication-ios.md | 2 +- .../versioned_docs/version-0.79/fabric-native-components.md | 2 +- website/versioned_docs/version-0.79/fast-refresh.md | 2 +- website/versioned_docs/version-0.79/handling-text-input.md | 2 +- website/versioned_docs/version-0.79/image.md | 6 +++--- .../versioned_docs/version-0.79/javascript-environment.md | 4 ++-- .../version-0.79/optimizing-javascript-loading.md | 2 +- .../version-0.79/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.79/sectionlist.md | 2 +- website/versioned_docs/version-0.79/switch.md | 2 +- website/versioned_docs/version-0.79/troubleshooting.md | 2 +- website/versioned_docs/version-0.80/alert.md | 2 +- website/versioned_docs/version-0.80/animations.md | 2 +- website/versioned_docs/version-0.80/communication-ios.md | 2 +- .../versioned_docs/version-0.80/fabric-native-components.md | 2 +- website/versioned_docs/version-0.80/fast-refresh.md | 2 +- website/versioned_docs/version-0.80/handling-text-input.md | 2 +- website/versioned_docs/version-0.80/image.md | 6 +++--- .../versioned_docs/version-0.80/javascript-environment.md | 4 ++-- .../version-0.80/optimizing-javascript-loading.md | 2 +- .../version-0.80/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.80/sectionlist.md | 2 +- website/versioned_docs/version-0.80/switch.md | 2 +- website/versioned_docs/version-0.80/troubleshooting.md | 2 +- website/versioned_docs/version-0.81/alert.md | 2 +- website/versioned_docs/version-0.81/animations.md | 2 +- website/versioned_docs/version-0.81/communication-ios.md | 2 +- .../versioned_docs/version-0.81/fabric-native-components.md | 2 +- website/versioned_docs/version-0.81/fast-refresh.md | 2 +- website/versioned_docs/version-0.81/handling-text-input.md | 2 +- website/versioned_docs/version-0.81/image.md | 6 +++--- .../versioned_docs/version-0.81/javascript-environment.md | 4 ++-- .../version-0.81/optimizing-javascript-loading.md | 2 +- .../version-0.81/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.81/sectionlist.md | 2 +- website/versioned_docs/version-0.81/switch.md | 2 +- website/versioned_docs/version-0.81/troubleshooting.md | 2 +- website/versioned_docs/version-0.82/alert.md | 2 +- website/versioned_docs/version-0.82/animations.md | 2 +- website/versioned_docs/version-0.82/communication-ios.md | 2 +- .../versioned_docs/version-0.82/fabric-native-components.md | 2 +- website/versioned_docs/version-0.82/fast-refresh.md | 2 +- website/versioned_docs/version-0.82/handling-text-input.md | 2 +- website/versioned_docs/version-0.82/image.md | 6 +++--- .../versioned_docs/version-0.82/javascript-environment.md | 4 ++-- .../version-0.82/optimizing-javascript-loading.md | 2 +- .../version-0.82/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.82/sectionlist.md | 2 +- website/versioned_docs/version-0.82/switch.md | 2 +- website/versioned_docs/version-0.82/troubleshooting.md | 2 +- website/versioned_docs/version-0.83/alert.md | 2 +- website/versioned_docs/version-0.83/animations.md | 2 +- website/versioned_docs/version-0.83/communication-ios.md | 2 +- .../versioned_docs/version-0.83/fabric-native-components.md | 2 +- website/versioned_docs/version-0.83/fast-refresh.md | 2 +- website/versioned_docs/version-0.83/handling-text-input.md | 2 +- website/versioned_docs/version-0.83/image.md | 6 +++--- .../versioned_docs/version-0.83/javascript-environment.md | 4 ++-- .../version-0.83/optimizing-javascript-loading.md | 2 +- .../version-0.83/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.83/sectionlist.md | 2 +- website/versioned_docs/version-0.83/switch.md | 2 +- website/versioned_docs/version-0.83/troubleshooting.md | 2 +- website/versioned_docs/version-0.84/alert.md | 2 +- website/versioned_docs/version-0.84/animations.md | 2 +- website/versioned_docs/version-0.84/communication-ios.md | 2 +- .../versioned_docs/version-0.84/fabric-native-components.md | 2 +- website/versioned_docs/version-0.84/fast-refresh.md | 2 +- website/versioned_docs/version-0.84/handling-text-input.md | 2 +- website/versioned_docs/version-0.84/image.md | 6 +++--- .../versioned_docs/version-0.84/javascript-environment.md | 4 ++-- .../version-0.84/optimizing-javascript-loading.md | 2 +- .../version-0.84/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.84/sectionlist.md | 2 +- website/versioned_docs/version-0.84/switch.md | 2 +- website/versioned_docs/version-0.84/troubleshooting.md | 2 +- website/versioned_docs/version-0.85/alert.md | 2 +- website/versioned_docs/version-0.85/animations.md | 2 +- website/versioned_docs/version-0.85/communication-ios.md | 2 +- .../versioned_docs/version-0.85/fabric-native-components.md | 2 +- website/versioned_docs/version-0.85/fast-refresh.md | 2 +- website/versioned_docs/version-0.85/handling-text-input.md | 2 +- website/versioned_docs/version-0.85/image.md | 6 +++--- .../versioned_docs/version-0.85/javascript-environment.md | 4 ++-- .../version-0.85/optimizing-javascript-loading.md | 2 +- .../version-0.85/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.85/sectionlist.md | 2 +- website/versioned_docs/version-0.85/switch.md | 2 +- website/versioned_docs/version-0.85/troubleshooting.md | 2 +- website/versioned_docs/version-0.86/alert.md | 2 +- website/versioned_docs/version-0.86/animations.md | 2 +- website/versioned_docs/version-0.86/communication-ios.md | 2 +- .../versioned_docs/version-0.86/fabric-native-components.md | 2 +- website/versioned_docs/version-0.86/fast-refresh.md | 2 +- website/versioned_docs/version-0.86/handling-text-input.md | 2 +- website/versioned_docs/version-0.86/image.md | 6 +++--- .../versioned_docs/version-0.86/javascript-environment.md | 4 ++-- .../version-0.86/optimizing-javascript-loading.md | 2 +- .../version-0.86/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.86/sectionlist.md | 2 +- website/versioned_docs/version-0.86/switch.md | 2 +- website/versioned_docs/version-0.86/troubleshooting.md | 2 +- website/versioned_docs/version-0.87/alert.md | 2 +- website/versioned_docs/version-0.87/animations.md | 2 +- website/versioned_docs/version-0.87/communication-ios.md | 2 +- .../versioned_docs/version-0.87/fabric-native-components.md | 2 +- website/versioned_docs/version-0.87/fast-refresh.md | 2 +- website/versioned_docs/version-0.87/handling-text-input.md | 2 +- website/versioned_docs/version-0.87/image.md | 6 +++--- .../versioned_docs/version-0.87/javascript-environment.md | 4 ++-- .../version-0.87/optimizing-javascript-loading.md | 2 +- .../version-0.87/react-native-gradle-plugin.md | 2 +- website/versioned_docs/version-0.87/sectionlist.md | 2 +- website/versioned_docs/version-0.87/switch.md | 2 +- website/versioned_docs/version-0.87/troubleshooting.md | 2 +- 156 files changed, 192 insertions(+), 192 deletions(-) diff --git a/docs/alert.md b/docs/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/docs/alert.md +++ b/docs/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/docs/animations.md b/docs/animations.md index 7f15bce3685..811757bb488 100644 --- a/docs/animations.md +++ b/docs/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/docs/communication-ios.md b/docs/communication-ios.md index ea2b21499f7..ac583094910 100644 --- a/docs/communication-ios.md +++ b/docs/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/docs/fabric-native-components.md b/docs/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/docs/fabric-native-components.md +++ b/docs/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/docs/fast-refresh.md b/docs/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/docs/fast-refresh.md +++ b/docs/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/docs/handling-text-input.md b/docs/handling-text-input.md index c6f249bb31f..37856291baf 100644 --- a/docs/handling-text-input.md +++ b/docs/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/docs/image.md b/docs/image.md index b43614057b3..18f27375f6a 100644 --- a/docs/image.md +++ b/docs/image.md @@ -440,9 +440,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/docs/javascript-environment.md b/docs/javascript-environment.md index 300309cff36..5d2079dee79 100644 --- a/docs/javascript-environment.md +++ b/docs/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/docs/optimizing-javascript-loading.md b/docs/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/docs/optimizing-javascript-loading.md +++ b/docs/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/docs/react-native-gradle-plugin.md b/docs/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/docs/react-native-gradle-plugin.md +++ b/docs/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/docs/sectionlist.md b/docs/sectionlist.md index ead40b211b9..b6dded14508 100644 --- a/docs/sectionlist.md +++ b/docs/sectionlist.md @@ -362,6 +362,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/docs/switch.md b/docs/switch.md index 891847d7fee..51389a4ca83 100644 --- a/docs/switch.md +++ b/docs/switch.md @@ -116,7 +116,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/docs/troubleshooting.md b/docs/troubleshooting.md index b166c182a9f..7bcb2ebb468 100644 --- a/docs/troubleshooting.md +++ b/docs/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.77/alert.md b/website/versioned_docs/version-0.77/alert.md index c80b62fb7a6..5b1b74088cf 100644 --- a/website/versioned_docs/version-0.77/alert.md +++ b/website/versioned_docs/version-0.77/alert.md @@ -173,7 +173,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.77/animations.md b/website/versioned_docs/version-0.77/animations.md index 74cb7650287..ef029eeabb7 100644 --- a/website/versioned_docs/version-0.77/animations.md +++ b/website/versioned_docs/version-0.77/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.77/communication-ios.md b/website/versioned_docs/version-0.77/communication-ios.md index f82cae7e620..f8bced9889b 100644 --- a/website/versioned_docs/version-0.77/communication-ios.md +++ b/website/versioned_docs/version-0.77/communication-ios.md @@ -93,7 +93,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.77/fabric-native-components.md b/website/versioned_docs/version-0.77/fabric-native-components.md index 20a9f672025..df23d2d60ab 100644 --- a/website/versioned_docs/version-0.77/fabric-native-components.md +++ b/website/versioned_docs/version-0.77/fabric-native-components.md @@ -113,7 +113,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.77/fast-refresh.md b/website/versioned_docs/version-0.77/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.77/fast-refresh.md +++ b/website/versioned_docs/version-0.77/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.77/handling-text-input.md b/website/versioned_docs/version-0.77/handling-text-input.md index 2345d089c7e..9a7a3cc4847 100644 --- a/website/versioned_docs/version-0.77/handling-text-input.md +++ b/website/versioned_docs/version-0.77/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.77/image.md b/website/versioned_docs/version-0.77/image.md index 746000d40f8..69801b35b1f 100644 --- a/website/versioned_docs/version-0.77/image.md +++ b/website/versioned_docs/version-0.77/image.md @@ -428,9 +428,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.77/javascript-environment.md b/website/versioned_docs/version-0.77/javascript-environment.md index ab041dd34cd..13ed496fde8 100644 --- a/website/versioned_docs/version-0.77/javascript-environment.md +++ b/website/versioned_docs/version-0.77/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.77/optimizing-javascript-loading.md b/website/versioned_docs/version-0.77/optimizing-javascript-loading.md index 934f6680bbc..bb3bc91d237 100644 --- a/website/versioned_docs/version-0.77/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.77/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::info -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.77/react-native-gradle-plugin.md b/website/versioned_docs/version-0.77/react-native-gradle-plugin.md index 1dcdbb81bbf..610b970a99f 100644 --- a/website/versioned_docs/version-0.77/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.77/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.77/sectionlist.md b/website/versioned_docs/version-0.77/sectionlist.md index 9fe404005dd..7f47a7af919 100644 --- a/website/versioned_docs/version-0.77/sectionlist.md +++ b/website/versioned_docs/version-0.77/sectionlist.md @@ -359,6 +359,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.77/switch.md b/website/versioned_docs/version-0.77/switch.md index fcbaae7b1de..8d71039fc24 100644 --- a/website/versioned_docs/version-0.77/switch.md +++ b/website/versioned_docs/version-0.77/switch.md @@ -110,7 +110,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.77/troubleshooting.md b/website/versioned_docs/version-0.77/troubleshooting.md index a5cad6078f0..ea1158aa535 100644 --- a/website/versioned_docs/version-0.77/troubleshooting.md +++ b/website/versioned_docs/version-0.77/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.78/alert.md b/website/versioned_docs/version-0.78/alert.md index c80b62fb7a6..5b1b74088cf 100644 --- a/website/versioned_docs/version-0.78/alert.md +++ b/website/versioned_docs/version-0.78/alert.md @@ -173,7 +173,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.78/animations.md b/website/versioned_docs/version-0.78/animations.md index 74cb7650287..ef029eeabb7 100644 --- a/website/versioned_docs/version-0.78/animations.md +++ b/website/versioned_docs/version-0.78/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.78/communication-ios.md b/website/versioned_docs/version-0.78/communication-ios.md index f82cae7e620..f8bced9889b 100644 --- a/website/versioned_docs/version-0.78/communication-ios.md +++ b/website/versioned_docs/version-0.78/communication-ios.md @@ -93,7 +93,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.78/fabric-native-components.md b/website/versioned_docs/version-0.78/fabric-native-components.md index 20a9f672025..df23d2d60ab 100644 --- a/website/versioned_docs/version-0.78/fabric-native-components.md +++ b/website/versioned_docs/version-0.78/fabric-native-components.md @@ -113,7 +113,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.78/fast-refresh.md b/website/versioned_docs/version-0.78/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.78/fast-refresh.md +++ b/website/versioned_docs/version-0.78/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.78/handling-text-input.md b/website/versioned_docs/version-0.78/handling-text-input.md index 2345d089c7e..9a7a3cc4847 100644 --- a/website/versioned_docs/version-0.78/handling-text-input.md +++ b/website/versioned_docs/version-0.78/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.78/image.md b/website/versioned_docs/version-0.78/image.md index 71094b8af79..1c8bd15529b 100644 --- a/website/versioned_docs/version-0.78/image.md +++ b/website/versioned_docs/version-0.78/image.md @@ -428,9 +428,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.78/javascript-environment.md b/website/versioned_docs/version-0.78/javascript-environment.md index ab041dd34cd..13ed496fde8 100644 --- a/website/versioned_docs/version-0.78/javascript-environment.md +++ b/website/versioned_docs/version-0.78/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.78/optimizing-javascript-loading.md b/website/versioned_docs/version-0.78/optimizing-javascript-loading.md index 934f6680bbc..bb3bc91d237 100644 --- a/website/versioned_docs/version-0.78/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.78/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::info -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.78/react-native-gradle-plugin.md b/website/versioned_docs/version-0.78/react-native-gradle-plugin.md index 1dcdbb81bbf..610b970a99f 100644 --- a/website/versioned_docs/version-0.78/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.78/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.78/sectionlist.md b/website/versioned_docs/version-0.78/sectionlist.md index 9fe404005dd..7f47a7af919 100644 --- a/website/versioned_docs/version-0.78/sectionlist.md +++ b/website/versioned_docs/version-0.78/sectionlist.md @@ -359,6 +359,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.78/switch.md b/website/versioned_docs/version-0.78/switch.md index fcbaae7b1de..8d71039fc24 100644 --- a/website/versioned_docs/version-0.78/switch.md +++ b/website/versioned_docs/version-0.78/switch.md @@ -110,7 +110,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.78/troubleshooting.md b/website/versioned_docs/version-0.78/troubleshooting.md index a5cad6078f0..ea1158aa535 100644 --- a/website/versioned_docs/version-0.78/troubleshooting.md +++ b/website/versioned_docs/version-0.78/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.79/alert.md b/website/versioned_docs/version-0.79/alert.md index c80b62fb7a6..5b1b74088cf 100644 --- a/website/versioned_docs/version-0.79/alert.md +++ b/website/versioned_docs/version-0.79/alert.md @@ -173,7 +173,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.79/animations.md b/website/versioned_docs/version-0.79/animations.md index 74cb7650287..ef029eeabb7 100644 --- a/website/versioned_docs/version-0.79/animations.md +++ b/website/versioned_docs/version-0.79/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.79/communication-ios.md b/website/versioned_docs/version-0.79/communication-ios.md index f82cae7e620..f8bced9889b 100644 --- a/website/versioned_docs/version-0.79/communication-ios.md +++ b/website/versioned_docs/version-0.79/communication-ios.md @@ -93,7 +93,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.79/fabric-native-components.md b/website/versioned_docs/version-0.79/fabric-native-components.md index 20a9f672025..df23d2d60ab 100644 --- a/website/versioned_docs/version-0.79/fabric-native-components.md +++ b/website/versioned_docs/version-0.79/fabric-native-components.md @@ -113,7 +113,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.79/fast-refresh.md b/website/versioned_docs/version-0.79/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.79/fast-refresh.md +++ b/website/versioned_docs/version-0.79/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.79/handling-text-input.md b/website/versioned_docs/version-0.79/handling-text-input.md index 2345d089c7e..9a7a3cc4847 100644 --- a/website/versioned_docs/version-0.79/handling-text-input.md +++ b/website/versioned_docs/version-0.79/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.79/image.md b/website/versioned_docs/version-0.79/image.md index 71094b8af79..1c8bd15529b 100644 --- a/website/versioned_docs/version-0.79/image.md +++ b/website/versioned_docs/version-0.79/image.md @@ -428,9 +428,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.79/javascript-environment.md b/website/versioned_docs/version-0.79/javascript-environment.md index ab041dd34cd..13ed496fde8 100644 --- a/website/versioned_docs/version-0.79/javascript-environment.md +++ b/website/versioned_docs/version-0.79/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.79/optimizing-javascript-loading.md b/website/versioned_docs/version-0.79/optimizing-javascript-loading.md index 934f6680bbc..bb3bc91d237 100644 --- a/website/versioned_docs/version-0.79/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.79/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::info -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.79/react-native-gradle-plugin.md b/website/versioned_docs/version-0.79/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.79/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.79/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.79/sectionlist.md b/website/versioned_docs/version-0.79/sectionlist.md index 9fe404005dd..7f47a7af919 100644 --- a/website/versioned_docs/version-0.79/sectionlist.md +++ b/website/versioned_docs/version-0.79/sectionlist.md @@ -359,6 +359,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.79/switch.md b/website/versioned_docs/version-0.79/switch.md index fcbaae7b1de..8d71039fc24 100644 --- a/website/versioned_docs/version-0.79/switch.md +++ b/website/versioned_docs/version-0.79/switch.md @@ -110,7 +110,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.79/troubleshooting.md b/website/versioned_docs/version-0.79/troubleshooting.md index a5cad6078f0..ea1158aa535 100644 --- a/website/versioned_docs/version-0.79/troubleshooting.md +++ b/website/versioned_docs/version-0.79/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.80/alert.md b/website/versioned_docs/version-0.80/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.80/alert.md +++ b/website/versioned_docs/version-0.80/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.80/animations.md b/website/versioned_docs/version-0.80/animations.md index 321c8a0b2e1..e137c2005d4 100644 --- a/website/versioned_docs/version-0.80/animations.md +++ b/website/versioned_docs/version-0.80/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.80/communication-ios.md b/website/versioned_docs/version-0.80/communication-ios.md index 89a64ff9b4c..0bd4df531e6 100644 --- a/website/versioned_docs/version-0.80/communication-ios.md +++ b/website/versioned_docs/version-0.80/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.80/fabric-native-components.md b/website/versioned_docs/version-0.80/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.80/fabric-native-components.md +++ b/website/versioned_docs/version-0.80/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.80/fast-refresh.md b/website/versioned_docs/version-0.80/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.80/fast-refresh.md +++ b/website/versioned_docs/version-0.80/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.80/handling-text-input.md b/website/versioned_docs/version-0.80/handling-text-input.md index 32b778af713..cb7ec61af63 100644 --- a/website/versioned_docs/version-0.80/handling-text-input.md +++ b/website/versioned_docs/version-0.80/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.80/image.md b/website/versioned_docs/version-0.80/image.md index 721b717e555..5e0c1fa770a 100644 --- a/website/versioned_docs/version-0.80/image.md +++ b/website/versioned_docs/version-0.80/image.md @@ -426,9 +426,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.80/javascript-environment.md b/website/versioned_docs/version-0.80/javascript-environment.md index 2149516a93b..fe9812caf54 100644 --- a/website/versioned_docs/version-0.80/javascript-environment.md +++ b/website/versioned_docs/version-0.80/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.80/optimizing-javascript-loading.md b/website/versioned_docs/version-0.80/optimizing-javascript-loading.md index 934f6680bbc..bb3bc91d237 100644 --- a/website/versioned_docs/version-0.80/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.80/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::info -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.80/react-native-gradle-plugin.md b/website/versioned_docs/version-0.80/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.80/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.80/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.80/sectionlist.md b/website/versioned_docs/version-0.80/sectionlist.md index 3b2796fef80..407d82b5299 100644 --- a/website/versioned_docs/version-0.80/sectionlist.md +++ b/website/versioned_docs/version-0.80/sectionlist.md @@ -358,6 +358,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.80/switch.md b/website/versioned_docs/version-0.80/switch.md index 43ae6904740..6ac3c580333 100644 --- a/website/versioned_docs/version-0.80/switch.md +++ b/website/versioned_docs/version-0.80/switch.md @@ -110,7 +110,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.80/troubleshooting.md b/website/versioned_docs/version-0.80/troubleshooting.md index d6dba7895e8..5efc85a60ad 100644 --- a/website/versioned_docs/version-0.80/troubleshooting.md +++ b/website/versioned_docs/version-0.80/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.81/alert.md b/website/versioned_docs/version-0.81/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.81/alert.md +++ b/website/versioned_docs/version-0.81/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.81/animations.md b/website/versioned_docs/version-0.81/animations.md index df8bf08b256..3624510acb1 100644 --- a/website/versioned_docs/version-0.81/animations.md +++ b/website/versioned_docs/version-0.81/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.81/communication-ios.md b/website/versioned_docs/version-0.81/communication-ios.md index 89a64ff9b4c..0bd4df531e6 100644 --- a/website/versioned_docs/version-0.81/communication-ios.md +++ b/website/versioned_docs/version-0.81/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.81/fabric-native-components.md b/website/versioned_docs/version-0.81/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.81/fabric-native-components.md +++ b/website/versioned_docs/version-0.81/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.81/fast-refresh.md b/website/versioned_docs/version-0.81/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.81/fast-refresh.md +++ b/website/versioned_docs/version-0.81/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.81/handling-text-input.md b/website/versioned_docs/version-0.81/handling-text-input.md index 32b778af713..cb7ec61af63 100644 --- a/website/versioned_docs/version-0.81/handling-text-input.md +++ b/website/versioned_docs/version-0.81/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.81/image.md b/website/versioned_docs/version-0.81/image.md index 721b717e555..5e0c1fa770a 100644 --- a/website/versioned_docs/version-0.81/image.md +++ b/website/versioned_docs/version-0.81/image.md @@ -426,9 +426,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.81/javascript-environment.md b/website/versioned_docs/version-0.81/javascript-environment.md index 2149516a93b..fe9812caf54 100644 --- a/website/versioned_docs/version-0.81/javascript-environment.md +++ b/website/versioned_docs/version-0.81/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.81/optimizing-javascript-loading.md b/website/versioned_docs/version-0.81/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/website/versioned_docs/version-0.81/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.81/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.81/react-native-gradle-plugin.md b/website/versioned_docs/version-0.81/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.81/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.81/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.81/sectionlist.md b/website/versioned_docs/version-0.81/sectionlist.md index a0330d58f8e..2d5997be989 100644 --- a/website/versioned_docs/version-0.81/sectionlist.md +++ b/website/versioned_docs/version-0.81/sectionlist.md @@ -360,6 +360,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.81/switch.md b/website/versioned_docs/version-0.81/switch.md index 43ae6904740..6ac3c580333 100644 --- a/website/versioned_docs/version-0.81/switch.md +++ b/website/versioned_docs/version-0.81/switch.md @@ -110,7 +110,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.81/troubleshooting.md b/website/versioned_docs/version-0.81/troubleshooting.md index d6dba7895e8..5efc85a60ad 100644 --- a/website/versioned_docs/version-0.81/troubleshooting.md +++ b/website/versioned_docs/version-0.81/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.82/alert.md b/website/versioned_docs/version-0.82/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.82/alert.md +++ b/website/versioned_docs/version-0.82/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.82/animations.md b/website/versioned_docs/version-0.82/animations.md index 95f7f192115..247288eb381 100644 --- a/website/versioned_docs/version-0.82/animations.md +++ b/website/versioned_docs/version-0.82/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.82/communication-ios.md b/website/versioned_docs/version-0.82/communication-ios.md index 89a64ff9b4c..0bd4df531e6 100644 --- a/website/versioned_docs/version-0.82/communication-ios.md +++ b/website/versioned_docs/version-0.82/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.82/fabric-native-components.md b/website/versioned_docs/version-0.82/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.82/fabric-native-components.md +++ b/website/versioned_docs/version-0.82/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.82/fast-refresh.md b/website/versioned_docs/version-0.82/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.82/fast-refresh.md +++ b/website/versioned_docs/version-0.82/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.82/handling-text-input.md b/website/versioned_docs/version-0.82/handling-text-input.md index be56c292f03..e8f6ecd74f1 100644 --- a/website/versioned_docs/version-0.82/handling-text-input.md +++ b/website/versioned_docs/version-0.82/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.82/image.md b/website/versioned_docs/version-0.82/image.md index 3f83be8c19c..8f8a34eabe2 100644 --- a/website/versioned_docs/version-0.82/image.md +++ b/website/versioned_docs/version-0.82/image.md @@ -440,9 +440,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.82/javascript-environment.md b/website/versioned_docs/version-0.82/javascript-environment.md index 2149516a93b..fe9812caf54 100644 --- a/website/versioned_docs/version-0.82/javascript-environment.md +++ b/website/versioned_docs/version-0.82/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.82/optimizing-javascript-loading.md b/website/versioned_docs/version-0.82/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/website/versioned_docs/version-0.82/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.82/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.82/react-native-gradle-plugin.md b/website/versioned_docs/version-0.82/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.82/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.82/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.82/sectionlist.md b/website/versioned_docs/version-0.82/sectionlist.md index ead40b211b9..b6dded14508 100644 --- a/website/versioned_docs/version-0.82/sectionlist.md +++ b/website/versioned_docs/version-0.82/sectionlist.md @@ -362,6 +362,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.82/switch.md b/website/versioned_docs/version-0.82/switch.md index 20c73c69db7..1b1d81705ea 100644 --- a/website/versioned_docs/version-0.82/switch.md +++ b/website/versioned_docs/version-0.82/switch.md @@ -116,7 +116,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.82/troubleshooting.md b/website/versioned_docs/version-0.82/troubleshooting.md index 540f38b984f..0c4fb863acf 100644 --- a/website/versioned_docs/version-0.82/troubleshooting.md +++ b/website/versioned_docs/version-0.82/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.83/alert.md b/website/versioned_docs/version-0.83/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.83/alert.md +++ b/website/versioned_docs/version-0.83/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.83/animations.md b/website/versioned_docs/version-0.83/animations.md index 956e96dc2c5..68e73c31dba 100644 --- a/website/versioned_docs/version-0.83/animations.md +++ b/website/versioned_docs/version-0.83/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.83/communication-ios.md b/website/versioned_docs/version-0.83/communication-ios.md index 89a64ff9b4c..0bd4df531e6 100644 --- a/website/versioned_docs/version-0.83/communication-ios.md +++ b/website/versioned_docs/version-0.83/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.83/fabric-native-components.md b/website/versioned_docs/version-0.83/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.83/fabric-native-components.md +++ b/website/versioned_docs/version-0.83/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.83/fast-refresh.md b/website/versioned_docs/version-0.83/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.83/fast-refresh.md +++ b/website/versioned_docs/version-0.83/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.83/handling-text-input.md b/website/versioned_docs/version-0.83/handling-text-input.md index be56c292f03..e8f6ecd74f1 100644 --- a/website/versioned_docs/version-0.83/handling-text-input.md +++ b/website/versioned_docs/version-0.83/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.83/image.md b/website/versioned_docs/version-0.83/image.md index 3f83be8c19c..8f8a34eabe2 100644 --- a/website/versioned_docs/version-0.83/image.md +++ b/website/versioned_docs/version-0.83/image.md @@ -440,9 +440,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.83/javascript-environment.md b/website/versioned_docs/version-0.83/javascript-environment.md index 2149516a93b..fe9812caf54 100644 --- a/website/versioned_docs/version-0.83/javascript-environment.md +++ b/website/versioned_docs/version-0.83/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.83/optimizing-javascript-loading.md b/website/versioned_docs/version-0.83/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/website/versioned_docs/version-0.83/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.83/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.83/react-native-gradle-plugin.md b/website/versioned_docs/version-0.83/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.83/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.83/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.83/sectionlist.md b/website/versioned_docs/version-0.83/sectionlist.md index ead40b211b9..b6dded14508 100644 --- a/website/versioned_docs/version-0.83/sectionlist.md +++ b/website/versioned_docs/version-0.83/sectionlist.md @@ -362,6 +362,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.83/switch.md b/website/versioned_docs/version-0.83/switch.md index 20c73c69db7..1b1d81705ea 100644 --- a/website/versioned_docs/version-0.83/switch.md +++ b/website/versioned_docs/version-0.83/switch.md @@ -116,7 +116,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.83/troubleshooting.md b/website/versioned_docs/version-0.83/troubleshooting.md index 540f38b984f..0c4fb863acf 100644 --- a/website/versioned_docs/version-0.83/troubleshooting.md +++ b/website/versioned_docs/version-0.83/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.84/alert.md b/website/versioned_docs/version-0.84/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.84/alert.md +++ b/website/versioned_docs/version-0.84/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.84/animations.md b/website/versioned_docs/version-0.84/animations.md index 80b150e32f7..ce1b2531638 100644 --- a/website/versioned_docs/version-0.84/animations.md +++ b/website/versioned_docs/version-0.84/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.84/communication-ios.md b/website/versioned_docs/version-0.84/communication-ios.md index 89a64ff9b4c..0bd4df531e6 100644 --- a/website/versioned_docs/version-0.84/communication-ios.md +++ b/website/versioned_docs/version-0.84/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.84/fabric-native-components.md b/website/versioned_docs/version-0.84/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.84/fabric-native-components.md +++ b/website/versioned_docs/version-0.84/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.84/fast-refresh.md b/website/versioned_docs/version-0.84/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.84/fast-refresh.md +++ b/website/versioned_docs/version-0.84/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.84/handling-text-input.md b/website/versioned_docs/version-0.84/handling-text-input.md index be56c292f03..e8f6ecd74f1 100644 --- a/website/versioned_docs/version-0.84/handling-text-input.md +++ b/website/versioned_docs/version-0.84/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.84/image.md b/website/versioned_docs/version-0.84/image.md index 3f83be8c19c..8f8a34eabe2 100644 --- a/website/versioned_docs/version-0.84/image.md +++ b/website/versioned_docs/version-0.84/image.md @@ -440,9 +440,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.84/javascript-environment.md b/website/versioned_docs/version-0.84/javascript-environment.md index 2149516a93b..fe9812caf54 100644 --- a/website/versioned_docs/version-0.84/javascript-environment.md +++ b/website/versioned_docs/version-0.84/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.84/optimizing-javascript-loading.md b/website/versioned_docs/version-0.84/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/website/versioned_docs/version-0.84/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.84/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.84/react-native-gradle-plugin.md b/website/versioned_docs/version-0.84/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.84/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.84/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.84/sectionlist.md b/website/versioned_docs/version-0.84/sectionlist.md index ead40b211b9..b6dded14508 100644 --- a/website/versioned_docs/version-0.84/sectionlist.md +++ b/website/versioned_docs/version-0.84/sectionlist.md @@ -362,6 +362,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.84/switch.md b/website/versioned_docs/version-0.84/switch.md index 20c73c69db7..1b1d81705ea 100644 --- a/website/versioned_docs/version-0.84/switch.md +++ b/website/versioned_docs/version-0.84/switch.md @@ -116,7 +116,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.84/troubleshooting.md b/website/versioned_docs/version-0.84/troubleshooting.md index 540f38b984f..0c4fb863acf 100644 --- a/website/versioned_docs/version-0.84/troubleshooting.md +++ b/website/versioned_docs/version-0.84/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.85/alert.md b/website/versioned_docs/version-0.85/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.85/alert.md +++ b/website/versioned_docs/version-0.85/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.85/animations.md b/website/versioned_docs/version-0.85/animations.md index 956e96dc2c5..68e73c31dba 100644 --- a/website/versioned_docs/version-0.85/animations.md +++ b/website/versioned_docs/version-0.85/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.85/communication-ios.md b/website/versioned_docs/version-0.85/communication-ios.md index 89a64ff9b4c..0bd4df531e6 100644 --- a/website/versioned_docs/version-0.85/communication-ios.md +++ b/website/versioned_docs/version-0.85/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.85/fabric-native-components.md b/website/versioned_docs/version-0.85/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.85/fabric-native-components.md +++ b/website/versioned_docs/version-0.85/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.85/fast-refresh.md b/website/versioned_docs/version-0.85/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.85/fast-refresh.md +++ b/website/versioned_docs/version-0.85/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.85/handling-text-input.md b/website/versioned_docs/version-0.85/handling-text-input.md index be56c292f03..e8f6ecd74f1 100644 --- a/website/versioned_docs/version-0.85/handling-text-input.md +++ b/website/versioned_docs/version-0.85/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.85/image.md b/website/versioned_docs/version-0.85/image.md index 3f83be8c19c..8f8a34eabe2 100644 --- a/website/versioned_docs/version-0.85/image.md +++ b/website/versioned_docs/version-0.85/image.md @@ -440,9 +440,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.85/javascript-environment.md b/website/versioned_docs/version-0.85/javascript-environment.md index 2149516a93b..fe9812caf54 100644 --- a/website/versioned_docs/version-0.85/javascript-environment.md +++ b/website/versioned_docs/version-0.85/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.85/optimizing-javascript-loading.md b/website/versioned_docs/version-0.85/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/website/versioned_docs/version-0.85/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.85/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.85/react-native-gradle-plugin.md b/website/versioned_docs/version-0.85/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.85/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.85/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.85/sectionlist.md b/website/versioned_docs/version-0.85/sectionlist.md index ead40b211b9..b6dded14508 100644 --- a/website/versioned_docs/version-0.85/sectionlist.md +++ b/website/versioned_docs/version-0.85/sectionlist.md @@ -362,6 +362,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.85/switch.md b/website/versioned_docs/version-0.85/switch.md index 20c73c69db7..1b1d81705ea 100644 --- a/website/versioned_docs/version-0.85/switch.md +++ b/website/versioned_docs/version-0.85/switch.md @@ -116,7 +116,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.85/troubleshooting.md b/website/versioned_docs/version-0.85/troubleshooting.md index 540f38b984f..0c4fb863acf 100644 --- a/website/versioned_docs/version-0.85/troubleshooting.md +++ b/website/versioned_docs/version-0.85/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.86/alert.md b/website/versioned_docs/version-0.86/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.86/alert.md +++ b/website/versioned_docs/version-0.86/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.86/animations.md b/website/versioned_docs/version-0.86/animations.md index 956e96dc2c5..68e73c31dba 100644 --- a/website/versioned_docs/version-0.86/animations.md +++ b/website/versioned_docs/version-0.86/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.86/communication-ios.md b/website/versioned_docs/version-0.86/communication-ios.md index 89a64ff9b4c..0bd4df531e6 100644 --- a/website/versioned_docs/version-0.86/communication-ios.md +++ b/website/versioned_docs/version-0.86/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.86/fabric-native-components.md b/website/versioned_docs/version-0.86/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.86/fabric-native-components.md +++ b/website/versioned_docs/version-0.86/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.86/fast-refresh.md b/website/versioned_docs/version-0.86/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.86/fast-refresh.md +++ b/website/versioned_docs/version-0.86/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.86/handling-text-input.md b/website/versioned_docs/version-0.86/handling-text-input.md index be56c292f03..e8f6ecd74f1 100644 --- a/website/versioned_docs/version-0.86/handling-text-input.md +++ b/website/versioned_docs/version-0.86/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.86/image.md b/website/versioned_docs/version-0.86/image.md index 3f83be8c19c..8f8a34eabe2 100644 --- a/website/versioned_docs/version-0.86/image.md +++ b/website/versioned_docs/version-0.86/image.md @@ -440,9 +440,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.86/javascript-environment.md b/website/versioned_docs/version-0.86/javascript-environment.md index 2149516a93b..fe9812caf54 100644 --- a/website/versioned_docs/version-0.86/javascript-environment.md +++ b/website/versioned_docs/version-0.86/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.86/optimizing-javascript-loading.md b/website/versioned_docs/version-0.86/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/website/versioned_docs/version-0.86/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.86/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.86/react-native-gradle-plugin.md b/website/versioned_docs/version-0.86/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.86/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.86/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.86/sectionlist.md b/website/versioned_docs/version-0.86/sectionlist.md index ead40b211b9..b6dded14508 100644 --- a/website/versioned_docs/version-0.86/sectionlist.md +++ b/website/versioned_docs/version-0.86/sectionlist.md @@ -362,6 +362,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.86/switch.md b/website/versioned_docs/version-0.86/switch.md index 20c73c69db7..1b1d81705ea 100644 --- a/website/versioned_docs/version-0.86/switch.md +++ b/website/versioned_docs/version-0.86/switch.md @@ -116,7 +116,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.86/troubleshooting.md b/website/versioned_docs/version-0.86/troubleshooting.md index 540f38b984f..0c4fb863acf 100644 --- a/website/versioned_docs/version-0.86/troubleshooting.md +++ b/website/versioned_docs/version-0.86/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: diff --git a/website/versioned_docs/version-0.87/alert.md b/website/versioned_docs/version-0.87/alert.md index 78b1c412e66..ebe4d69268b 100644 --- a/website/versioned_docs/version-0.87/alert.md +++ b/website/versioned_docs/version-0.87/alert.md @@ -171,7 +171,7 @@ Create and display a prompt to enter some text in form of Alert. | ---------------------------------------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title
Required
| string | The dialog's title. | | message | string | An optional message that appears above the text input. | -| callbackOrButtons | function
[AlertButton](alert#alertButton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | +| callbackOrButtons | function
[AlertButton](alert#alertbutton)[] | If passed a function, it will be called with the prompt's value
`(text: string) => void`, when the user taps 'OK'.
If passed an array, buttons will be configured based on the array content. | | type | [AlertType](alert#alerttype-ios) | This configures the text input. | | defaultValue | string | The default text in text input. | | keyboardType | string | The keyboard type of first text field (if exists). One of TextInput [keyboardTypes](textinput#keyboardtype). | diff --git a/website/versioned_docs/version-0.87/animations.md b/website/versioned_docs/version-0.87/animations.md index 7f15bce3685..811757bb488 100644 --- a/website/versioned_docs/version-0.87/animations.md +++ b/website/versioned_docs/version-0.87/animations.md @@ -232,7 +232,7 @@ For example, you may want to think about your `Animated.Value` as going from 0 t }} ``` -[`interpolate()`](animated#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: +[`interpolate()`](animatedvalue#interpolate) supports multiple range segments as well, which is handy for defining dead zones and other handy tricks. For example, to get a negation relationship at -300 that goes to 0 at -100, then back up to 1 at 0, and then back down to zero at 100 followed by a dead-zone that remains at 0 for everything beyond that, you could do: ```tsx value.interpolate({ diff --git a/website/versioned_docs/version-0.87/communication-ios.md b/website/versioned_docs/version-0.87/communication-ios.md index ea2b21499f7..ac583094910 100644 --- a/website/versioned_docs/version-0.87/communication-ios.md +++ b/website/versioned_docs/version-0.87/communication-ios.md @@ -92,7 +92,7 @@ The common pattern we use when embedding native in React Native is to make the n ### Calling native functions from React Native (native modules) -Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios#content). +Native modules are Objective-C classes that are available in JS. Typically one instance of each module is created per JS bridge. They can export arbitrary functions and constants to React Native. They have been covered in detail in [this article](legacy/native-modules-ios). The fact that native modules are singletons limits the mechanism in the context of embedding. Let's say we have a React Native component embedded in a native view and we want to update the native, parent view. Using the native module mechanism, we would export a function that not only takes expected arguments, but also an identifier of the parent native view. The identifier would be used to retrieve a reference to the parent view to update. That said, we would need to keep a mapping from identifiers to native views in the module. diff --git a/website/versioned_docs/version-0.87/fabric-native-components.md b/website/versioned_docs/version-0.87/fabric-native-components.md index 6efdd572e92..1ab4bcc03d2 100644 --- a/website/versioned_docs/version-0.87/fabric-native-components.md +++ b/website/versioned_docs/version-0.87/fabric-native-components.md @@ -115,7 +115,7 @@ This specification is composed of three main parts, excluding the imports: - The `NativeProps` is a definition of the props that we can set on the component. - The `codegenNativeComponent` statement allows us to codegenerate the code for the custom component and that defines a name for the component used to match the native implementations. -As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#codegen-typings). +As with Native Modules, you can have multiple specification files in the `specs/` directory. For more information about the types you can use, and the platform types these map to, see the [appendix](appendix.md#ii-codegen-typings). ## 2. Configure Codegen to run diff --git a/website/versioned_docs/version-0.87/fast-refresh.md b/website/versioned_docs/version-0.87/fast-refresh.md index 89010b75065..c03dcd1bfb1 100644 --- a/website/versioned_docs/version-0.87/fast-refresh.md +++ b/website/versioned_docs/version-0.87/fast-refresh.md @@ -3,7 +3,7 @@ id: fast-refresh title: Fast Refresh --- -Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](/docs/debugging#accessing-the-in-app-developer-menu). With Fast Refresh enabled, most edits should be visible within a second or two. +Fast Refresh is a React Native feature that allows you to get near-instant feedback for changes in your React components. Fast Refresh is enabled by default, and you can toggle "Enable Fast Refresh" in the [React Native Dev Menu](debugging.md#opening-the-dev-menu). With Fast Refresh enabled, most edits should be visible within a second or two. ## How It Works diff --git a/website/versioned_docs/version-0.87/handling-text-input.md b/website/versioned_docs/version-0.87/handling-text-input.md index c6f249bb31f..37856291baf 100644 --- a/website/versioned_docs/version-0.87/handling-text-input.md +++ b/website/versioned_docs/version-0.87/handling-text-input.md @@ -3,7 +3,7 @@ id: handling-text-input title: Handling Text Input --- -[`TextInput`](textinput#content) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. +[`TextInput`](textinput) is a [Core Component](intro-react-native-components) that allows the user to enter text. It has an `onChangeText` prop that takes a function to be called every time the text changed, and an `onSubmitEditing` prop that takes a function to be called when the text is submitted. For example, let's say that as the user types, you're translating their words into a different language. In this new language, every single word is written the same way: 🍕. So the sentence "Hello there Bob" would be translated as "🍕 🍕 🍕". diff --git a/website/versioned_docs/version-0.87/image.md b/website/versioned_docs/version-0.87/image.md index b43614057b3..18f27375f6a 100644 --- a/website/versioned_docs/version-0.87/image.md +++ b/website/versioned_docs/version-0.87/image.md @@ -440,9 +440,9 @@ This prop has precedence over both the `src` and `source` props. ### `style` -| Type | -| ---------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#props) | +| Type | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Image Style Props](image-style-props#props), [Layout Props](layout-props#props), [Shadow Props](shadow-props#props), [Transforms](transforms#transform) | --- diff --git a/website/versioned_docs/version-0.87/javascript-environment.md b/website/versioned_docs/version-0.87/javascript-environment.md index 300309cff36..5d2079dee79 100644 --- a/website/versioned_docs/version-0.87/javascript-environment.md +++ b/website/versioned_docs/version-0.87/javascript-environment.md @@ -86,8 +86,8 @@ Many standard functions are also available on all the supported JavaScript runti - [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) - `md [console.{log, warn, error, info, debug, trace, table, group, groupCollapsed, groupEnd}](https://developer.chrome.com/devtools/docs/console-api)` -- [`XMLHttpRequest`, `fetch`](network.md#content) -- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md#content) +- [`XMLHttpRequest`, `fetch`](network.md) +- [`{set, clear}{Timeout, Interval, Immediate}, {request, cancel}AnimationFrame`](timers.md) #### ECMAScript 2015 (ES6) diff --git a/website/versioned_docs/version-0.87/optimizing-javascript-loading.md b/website/versioned_docs/version-0.87/optimizing-javascript-loading.md index e12d8631832..7674e96d706 100644 --- a/website/versioned_docs/version-0.87/optimizing-javascript-loading.md +++ b/website/versioned_docs/version-0.87/optimizing-javascript-loading.md @@ -176,7 +176,7 @@ See the documentation for [`getTransformOptions` in Metro](https://metrobundler. ## Advanced: Use random access module bundles (non-Hermes) :::tip -**Not supported when [using Hermes](#use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. +**Not supported when [using Hermes](#recommended-use-hermes).** Hermes bytecode is not compatible with the RAM bundle format, and provides the same (or better) performance in all use cases. ::: Random access module bundles (also known as RAM bundles) work in conjunction with the techniques mentioned above to limit the amount of JavaScript code that needs to be parsed and loaded into memory. Each module is stored as a separate string (or file) which is only parsed when the module needs to be executed. diff --git a/website/versioned_docs/version-0.87/react-native-gradle-plugin.md b/website/versioned_docs/version-0.87/react-native-gradle-plugin.md index 8f045197d59..2831677b960 100644 --- a/website/versioned_docs/version-0.87/react-native-gradle-plugin.md +++ b/website/versioned_docs/version-0.87/react-native-gradle-plugin.md @@ -77,7 +77,7 @@ cliFile = file("../node_modules/react-native/cli.js") ### `debuggableVariants` -This is the list of variants that are debuggable (see [using variants](#using-variants) for more context on variants). +This is the list of variants that are debuggable (see [using variants](#using-flavors--build-variants) for more context on variants). By default the plugin is considering as `debuggableVariants` only `debug`, while `release` is not. If you have other variants (like `staging`, `lite`, etc.) you'll need to adjust this accordingly. diff --git a/website/versioned_docs/version-0.87/sectionlist.md b/website/versioned_docs/version-0.87/sectionlist.md index ead40b211b9..b6dded14508 100644 --- a/website/versioned_docs/version-0.87/sectionlist.md +++ b/website/versioned_docs/version-0.87/sectionlist.md @@ -362,6 +362,6 @@ An object that identifies the data to be rendered for a given section. | --------------------------------------------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | data
Required
| array | The data for rendering items in this section. Array of objects, much like [`FlatList`'s data prop](flatlist#required-data). | | key | string | Optional key to keep track of section re-ordering. If you don't plan on re-ordering sections, the array index will be used by default. | -| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#renderitem) for the list. | +| renderItem | function | Optionally define an arbitrary item renderer for this section, overriding the default [`renderItem`](sectionlist#requiredrenderitem) for the list. | | ItemSeparatorComponent | component, element | Optionally define an arbitrary item separator for this section, overriding the default [`ItemSeparatorComponent`](sectionlist#itemseparatorcomponent) for the list. | | keyExtractor | function | Optionally define an arbitrary key extractor for this section, overriding the default [`keyExtractor`](sectionlist#keyextractor). | diff --git a/website/versioned_docs/version-0.87/switch.md b/website/versioned_docs/version-0.87/switch.md index 891847d7fee..51389a4ca83 100644 --- a/website/versioned_docs/version-0.87/switch.md +++ b/website/versioned_docs/version-0.87/switch.md @@ -116,7 +116,7 @@ Color of the foreground switch grip. If this is set on iOS, the switch grip will Custom colors for the switch track. -_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundColor). +_iOS_: When the switch value is `false`, the track shrinks into the border. If you want to change the color of the background exposed by the shrunken track, use [`ios_backgroundColor`](switch.md#ios_backgroundcolor-ios). | Type | | ------------------------------------------------------------ | diff --git a/website/versioned_docs/version-0.87/troubleshooting.md b/website/versioned_docs/version-0.87/troubleshooting.md index b166c182a9f..7bcb2ebb468 100644 --- a/website/versioned_docs/version-0.87/troubleshooting.md +++ b/website/versioned_docs/version-0.87/troubleshooting.md @@ -61,7 +61,7 @@ sudo chown -R $USER /usr/local/lib/node_modules ### Missing libraries for React -If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md#content). +If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like `RCTText.xcodeproj`, `RCTImage.xcodeproj`. Next, the binaries built by these dependencies have to be linked to your app binary. Use the `Linked Frameworks and Binaries` section in the Xcode project settings. More detailed steps are here: [Linking Libraries](linking-libraries-ios.md). If you are using CocoaPods, verify that you have added React along with the subspecs to the `Podfile`. For example, if you were using the ``, `` and `fetch()` APIs, you would need to add these in your `Podfile`: