diff --git a/docs/_getting-started-macos-ios.md b/docs/_getting-started-macos-ios.md index 856ea4acd09..6197de42ba5 100644 --- a/docs/_getting-started-macos-ios.md +++ b/docs/_getting-started-macos-ios.md @@ -1,4 +1,3 @@ -import Anchor from './Anchor.jsx'; import RemoveGlobalCLI from './\_remove-global-cli.md'; import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants'; diff --git a/docs/_integration-with-existing-apps-java.md b/docs/_integration-with-existing-apps-java.md index d5f3cb0a5ca..af77483cebe 100644 --- a/docs/_integration-with-existing-apps-java.md +++ b/docs/_integration-with-existing-apps-java.md @@ -264,7 +264,7 @@ protected void onActivityResult(int requestCode, int resultCode, Intent data) { Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```java public class MyReactActivity extends Activity implements DefaultHardwareBackBtnHandler { diff --git a/docs/_integration-with-existing-apps-kotlin.md b/docs/_integration-with-existing-apps-kotlin.md index c2c7e68081e..a43d9e261e4 100644 --- a/docs/_integration-with-existing-apps-kotlin.md +++ b/docs/_integration-with-existing-apps-kotlin.md @@ -265,7 +265,7 @@ override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```kotlin class MyReactActivity : Activity(), DefaultHardwareBackBtnHandler { diff --git a/docs/animated.md b/docs/animated.md index 55c74a6a211..fcf94c7801c 100644 --- a/docs/animated.md +++ b/docs/animated.md @@ -463,9 +463,9 @@ Animations are started by calling start() on your animation. start() takes a com **Parameters:** -| Name | Type | Required | Description | -| -------- | ------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| callback | (result: {finished: boolean}) => void | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | +| Name | Type | Required | Description | +| -------- | --------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| callback | `(result: {finished: boolean}) => void` | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | Start example with callback: diff --git a/docs/animatedvaluexy.md b/docs/animatedvaluexy.md index e4d29cce1a0..e8353d333c8 100644 --- a/docs/animatedvaluexy.md +++ b/docs/animatedvaluexy.md @@ -74,9 +74,9 @@ Directly set the value. This will stop any animations running on the value and u **Parameters:** -| Name | Type | Required | Description | -| ----- | ---------------------- | -------- | ----------- | -| value | {x: number; y: number} | Yes | Value | +| Name | Type | Required | Description | +| ----- | ------------------------ | -------- | ----------- | +| value | `{x: number; y: number}` | Yes | Value | --- @@ -90,9 +90,9 @@ Sets an offset that is applied on top of whatever value is set, whether via `set **Parameters:** -| Name | Type | Required | Description | -| ------ | ---------------------- | -------- | ------------ | -| offset | {x: number; y: number} | Yes | Offset value | +| Name | Type | Required | Description | +| ------ | ------------------------ | -------- | ------------ | +| offset | `{x: number; y: number}` | Yes | Offset value | --- diff --git a/docs/button.md b/docs/button.md index a07ba86ca04..bb23ef8618b 100644 --- a/docs/button.md +++ b/docs/button.md @@ -120,9 +120,9 @@ export default App; Handler to be called when the user taps the button. -| Type | -| ----------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) | +| Type | +| ---------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)})` | --- diff --git a/docs/flatlist.md b/docs/flatlist.md index 985b4fbf401..3d9d5b61a8a 100644 --- a/docs/flatlist.md +++ b/docs/flatlist.md @@ -618,9 +618,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ------------------------------------------------------------------------------------------------ | -| (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]} => void; | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]} => void;` | --- diff --git a/docs/image.md b/docs/image.md index b0a5c585d5a..e02bb762a2c 100644 --- a/docs/image.md +++ b/docs/image.md @@ -244,9 +244,9 @@ Invoked on load error. Invoked on mount and on layout changes. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [LayoutEvent]layoutevent)} => void | +| Type | +| ------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)} => void` | --- @@ -256,9 +256,9 @@ Invoked when load completes successfully. **Example:** `onLoad={({nativeEvent: {source: {width, height}}}) => setImageRealSize({width, height})}` -| Type | -| ------------------------------------------------------------- | -| ({nativeEvent: [ImageLoadEvent]image#imageloadevent)} => void | +| Type | +| ------------------------------------------------------------------- | +| `md ({nativeEvent: [ImageLoadEvent](image#imageloadevent)} => void` | --- diff --git a/docs/javascript-environment.md b/docs/javascript-environment.md index 45ebf1a3131..ab7db5144e0 100644 --- a/docs/javascript-environment.md +++ b/docs/javascript-environment.md @@ -84,25 +84,25 @@ Many standard functions are also available on all the supported JavaScript runti #### Browser -- [CommonJS require](https://nodejs.org/docs/latest/api/modules.html) -- [console.{log, warn, error, info, trace, table, group, 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) +- [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) +- `md [console.{log, warn, error, info, trace, table, group, 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) #### ECMAScript 2015 (ES6) -- [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) -- Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)} -- [Object.assign](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) -- String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)} +- [`Array.from`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) +- `md Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)}` +- [`Object.assign`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) +- `md String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)}` #### ECMAScript 2016 (ES7) -- Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes) +- `md Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)` #### ECMAScript 2017 (ES8) -- Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)} +- `md Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)}` #### Specific diff --git a/docs/linking.md b/docs/linking.md index 6639f0bfe32..70de35ac923 100644 --- a/docs/linking.md +++ b/docs/linking.md @@ -651,7 +651,7 @@ Launch an Android intent with extras. **Parameters:** -| Name | Type | -| ----------------------------------------------------------- | ------------------------------------------------------------ | -| action
Required
| string | -| extras | array of `{key: string, value: string \| number \| boolean}` | +| Name | Type | +| ----------------------------------------------------------- | ---------------------------------------------------------- | +| action
Required
| string | +| extras | `Array<{key: string, value: string ｜ number ｜ boolean}>` | diff --git a/docs/new-architecture-appendix.md b/docs/new-architecture-appendix.md index a305153fe01..5ce74e0e994 100644 --- a/docs/new-architecture-appendix.md +++ b/docs/new-architecture-appendix.md @@ -38,9 +38,9 @@ This is recommended over using plain `Object`, for type safety. **Example:** `{| foo: string, ... |}` -| Nullable Support? | Android (Java) | iOS | -| --------------------------------------------- | -------------- | --- | -| ?{| foo: string, ...|} | - | - | +| Nullable Support? | Android (Java) | iOS | +| ------------------------------------------------------- | -------------- | --- | +| ?{| foo: string, ...|} | - | - | ### `Object` @@ -98,19 +98,19 @@ You may also find it useful to refer to the JavaScript specifications for the co You may use the following table as a reference for which types are supported and what they map to in each platform: -| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | -| ---------------------------------------------- | -------------------------------------------------------- | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | -| `string` | string | null | `String` | `NSString` | | -| `boolean` | boolean | null | `Boolean` | `NSNumber` | | -| `number` | No | `double` | `NSNumber` | | -| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | -| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | -| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | -| `Function` | Function | null | | | | -| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | -| Type aliases of the above | Yes | | | | -| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | -| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | +| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | +| ------------------------------------------------------- | ------------------------------------------------------------------ | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | +| `string` | string | null | `String` | `NSString` | | +| `boolean` | boolean | null | `Boolean` | `NSNumber` | | +| `number` | No | `double` | `NSNumber` | | +| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | +| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | +| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | +| `Function` | Function | null | | | | +| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | +| Type aliases of the above | Yes | | | | +| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | +| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository. diff --git a/docs/pressable.md b/docs/pressable.md index 4d960b330b1..761cc7e2fa7 100644 --- a/docs/pressable.md +++ b/docs/pressable.md @@ -165,49 +165,49 @@ Sets additional distance outside of element in which a press can be detected. Called when the hover is activated to provide visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onHoverOut` Called when the hover is deactivated to undo visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onLongPress` Called if the time after `onPressIn` lasts longer than 500 milliseconds. This time period can be customized with [`delayLongPress`](#delaylongpress). -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPress` Called after `onPressOut`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPressIn` Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPressOut` Called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `pressRetentionOffset` diff --git a/docs/pushnotificationios.md b/docs/pushnotificationios.md index 9cbb9476757..604367ebf9d 100644 --- a/docs/pushnotificationios.md +++ b/docs/pushnotificationios.md @@ -321,7 +321,7 @@ Valid events are: - `notification` : Fired when a remote notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `localNotification` : Fired when a local notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `register`: Fired when the user registers for remote notifications. The handler will be invoked with a hex string representing the deviceToken. -- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with {message: string, code: number, details: any}. +- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with `{message: string, code: number, details: any}`. --- diff --git a/docs/scrollview.md b/docs/scrollview.md index 0244d5f4553..f0034d27344 100644 --- a/docs/scrollview.md +++ b/docs/scrollview.md @@ -205,9 +205,9 @@ const styles = StyleSheet.create({ The amount by which the scroll view content is inset from the edges of the scroll view. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- @@ -373,9 +373,9 @@ Caveat 1: Reordering elements in the scrollview with this enabled will probably Caveat 2: This uses `contentOffset` and `frame.origin` in native code to compute visibility. Occlusion, transforms, and other complexity won't be taken into account as to whether content is "visible" or not. -| Type | -| ---------------------------------------------------------------------- | -| object: {minIndexForVisible: number, autoscrollToTopThreshold: number} | +| Type | +| ------------------------------------------------------------------------ | +| object: `{minIndexForVisible: number, autoscrollToTopThreshold: number}` | --- @@ -591,9 +591,9 @@ This controls how often the scroll event will be fired while scrolling (as a tim The amount by which the scroll view indicators are inset from the edges of the scroll view. This should normally be set to the same value as the `contentInset`. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- diff --git a/docs/sectionlist.md b/docs/sectionlist.md index 18f9960e900..a14b94e96f2 100644 --- a/docs/sectionlist.md +++ b/docs/sectionlist.md @@ -235,9 +235,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ---------------------------------------------------------------------------------------------------------------- | -| (callback: {changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s}) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | --- @@ -267,9 +267,9 @@ This may improve scroll performance for large lists. Rendered at the bottom of each section. -| Type | -| -------------------------------------------------------------------- | -| (info: {section: [Section](sectionlist#section)}) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- @@ -277,9 +277,9 @@ Rendered at the bottom of each section. Rendered at the top of each section. These stick to the top of the `ScrollView` by default on iOS. See `stickySectionHeadersEnabled`. -| Type | -| -------------------------------------------------------------------- | -| (info: {section: [Section](sectionlist#section)}) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- diff --git a/docs/shadow-props.md b/docs/shadow-props.md index 812165032fd..a328842b736 100644 --- a/docs/shadow-props.md +++ b/docs/shadow-props.md @@ -228,9 +228,9 @@ This property will only work on Android API 28 and above. For similar functional Sets the drop shadow offset. -| Type | -| -------------------------------------- | -| object: {width: number,height: number} | +| Type | +| ---------------------------------------- | +| object: `{width: number,height: number}` | --- diff --git a/docs/switch.md b/docs/switch.md index 1074e457566..f6cff1444ad 100644 --- a/docs/switch.md +++ b/docs/switch.md @@ -109,9 +109,9 @@ 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). -| Type | -| ------------------------------------------------------------- | -| object: {false: [color](colors.md), true: [color](colors.md)} | +| Type | +| ------------------------------------------------------------ | +| `md object: {false: [color](colors), true: [color](colors)}` | --- diff --git a/docs/text-style-props.md b/docs/text-style-props.md index c671104cd07..07c55b98177 100644 --- a/docs/text-style-props.md +++ b/docs/text-style-props.md @@ -894,9 +894,9 @@ Specifies text alignment. On Android, the value 'justify' is only supported on O ### `textShadowOffset` -| Type | -| ----------------------------------------- | -| object: {width?: number, height?: number} | +| Type | +| ------------------------------------------- | +| object: `{width?: number, height?: number}` | --- diff --git a/docs/text.md b/docs/text.md index 444886a2fb5..c107d1679f6 100644 --- a/docs/text.md +++ b/docs/text.md @@ -485,9 +485,9 @@ This prop is commonly used with `ellipsizeMode`. Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -495,9 +495,9 @@ Invoked on mount and on layout changes. This function is called on long press. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -505,9 +505,9 @@ This function is called on long press. Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -515,9 +515,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to Function called on user press, triggered after `onPressOut`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -525,9 +525,9 @@ Function called on user press, triggered after `onPressOut`. Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -535,9 +535,9 @@ Called immediately when a touch is engaged, before `onPressOut` and `onPress`. Called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -547,9 +547,9 @@ The View is now responding to touch events. This is the time to highlight and sh On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| ------------------------------------------------------------ | -| ({nativeEvent: [PressEvent](pressevent)}) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -557,9 +557,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -567,9 +567,9 @@ The user is moving their finger. Fired at the end of the touch. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -577,9 +577,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -587,9 +587,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become a responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -597,9 +597,9 @@ Some other `View` wants to become a responder and is asking this `View` to relea If a parent `View` wants to prevent a child `View` from becoming a responder on a touch start, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- diff --git a/docs/textinput.md b/docs/textinput.md index 9e28a6be7ab..ab72cfd599e 100644 --- a/docs/textinput.md +++ b/docs/textinput.md @@ -589,9 +589,9 @@ Callback that is called when text input ends. Callback that is called when a touch is engaged. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -599,9 +599,9 @@ Callback that is called when a touch is engaged. Callback that is called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -609,9 +609,9 @@ Callback that is called when a touch is released. Callback that is called when the text input is focused. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -629,9 +629,9 @@ Callback that is called when a key is pressed. This will be called with object w Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -787,9 +787,9 @@ If `true`, the text input obscures the text entered so that sensitive text like The start and end of the text input's selection. Set start and end to the same value to position the cursor. -| Type | -| ----------------------------------- | -| object: {start: number,end: number} | +| Type | +| ------------------------------------- | +| object: `{start: number,end: number}` | --- diff --git a/docs/touchablewithoutfeedback.md b/docs/touchablewithoutfeedback.md index e5c0c5d88dd..3f081125a37 100644 --- a/docs/touchablewithoutfeedback.md +++ b/docs/touchablewithoutfeedback.md @@ -177,9 +177,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -307,9 +307,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -437,9 +437,9 @@ Invoked when the item receives focus. Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- diff --git a/docs/transforms.md b/docs/transforms.md index 00200c27dc1..7a885c8a2d0 100644 --- a/docs/transforms.md +++ b/docs/transforms.md @@ -188,9 +188,9 @@ The skew transformations require a string so that the transform may be expressed transform([{skewX: '45deg'}]); ``` -| Type | Required | -| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -| array of objects: {matrix: number[]}, {perspective: number}, {rotate: string}, {rotateX: string}, {rotateY: string}, {rotateZ: string}, {scale: number}, {scaleX: number}, {scaleY: number}, {translateX: number}, {translateY: number}, {skewX: string}, {skewY: string} or string | No | +| Type | Required | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | +| array of objects: `{matrix: number[]}`, `{perspective: number}`, `{rotate: string}`, `{rotateX: string}`, `{rotateY: string}`, `{rotateZ: string}`, `{scale: number}`, `{scaleX: number}`, `{scaleY: number}`, `{translateX: number}`, `{translateY: number}`, `{skewX: string}`, `{skewY: string}` or string | No | --- diff --git a/docs/view.md b/docs/view.md index ef46b508de0..11711c1aac3 100644 --- a/docs/view.md +++ b/docs/view.md @@ -176,9 +176,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -188,9 +188,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -391,9 +391,9 @@ For example, if a touchable view has a height of 20 the touchable height can be > The touch area never extends past the parent view bounds and the Z-index of sibling views always takes precedence if a touch hits two overlapping views. -| Type | -| ------------------------------------------------------------------ | -| object: {top: number, left: number, bottom: number, right: number} | +| Type | +| -------------------------------------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | --- @@ -540,9 +540,9 @@ Invoked on mount and on layout changes. This event is fired immediately once the layout has been calculated, but the new layout may not yet be reflected on the screen at the time the event is received, especially if a layout animation is in progress. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -560,9 +560,9 @@ When `accessible` is `true`, the system will invoke this function when the user Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -570,9 +570,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to If a parent `View` wants to prevent a child `View` from becoming responder on a move, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -582,9 +582,9 @@ The View is now responding for touch events. This is the time to highlight and s On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| ------------------------------------------------------------ | -| ({nativeEvent: [PressEvent](pressevent)}) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -592,9 +592,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -602,9 +602,9 @@ The user is moving their finger. Another responder is already active and will not release it to that `View` asking to be the responder. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -612,9 +612,9 @@ Another responder is already active and will not release it to that `View` askin Fired at the end of the touch. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -622,9 +622,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -632,9 +632,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -642,9 +642,9 @@ Some other `View` wants to become responder and is asking this `View` to release Does this view want to become responder on the start of a touch? -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -652,9 +652,9 @@ Does this view want to become responder on the start of a touch? If a parent `View` wants to prevent a child `View` from becoming responder on a touch start, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- diff --git a/docs/virtualizedlist.md b/docs/virtualizedlist.md index ae9f9671b19..c9c95443c29 100644 --- a/docs/virtualizedlist.md +++ b/docs/virtualizedlist.md @@ -423,9 +423,9 @@ The maximum number of items to render in each incremental render batch. The more Called once when the scroll position gets within within `onEndReachedThreshold` from the logical end of the list. -| Type | -| ----------------------------------------- | -| (info: {distanceFromEnd: number}) => void | +| Type | +| ------------------------------------------- | +| `(info: {distanceFromEnd: number}) => void` | --- @@ -475,9 +475,9 @@ Used to handle failures when scrolling to an index that has not been measured ye Called once when the scroll position gets within within `onStartReachedThreshold` from the logical start of the list. -| Type | -| ------------------------------------------- | -| (info: {distanceFromStart: number}) => void | +| Type | +| --------------------------------------------- | +| `(info: {distanceFromStart: number}) => void` | --- @@ -495,9 +495,9 @@ How far from the start (in units of visible length of the list) the leading edge Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ---------------------------------------------------------------------------------------------------------------- | -| (callback: {changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s}) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | --- diff --git a/website/architecture/render-pipeline.md b/website/architecture/render-pipeline.md index 7c0373844e4..451f9b3efcf 100644 --- a/website/architecture/render-pipeline.md +++ b/website/architecture/render-pipeline.md @@ -117,10 +117,10 @@ function MyComponent() { return ( ); @@ -136,10 +136,10 @@ Notice that **Node 3** maps to a host view with a **red background**, and **Node ```jsx ``` diff --git a/website/blog/2018-01-18-implementing-twitters-app-loading-animation-in-react-native.md b/website/blog/2018-01-18-implementing-twitters-app-loading-animation-in-react-native.md index 2f590e254fc..32805d117d1 100644 --- a/website/blog/2018-01-18-implementing-twitters-app-loading-animation-in-react-native.md +++ b/website/blog/2018-01-18-implementing-twitters-app-loading-animation-in-react-native.md @@ -72,8 +72,8 @@ They say a picture is worth 1,000 words. How many words is an interactive visual See the Pen{' '} Loading Screen Animation Steps - {' '} - by Eli White ( + + {' '}by Eli White ( @TheSavior) on{' '} CodePen. diff --git a/website/blog/2018-08-13-react-native-accessibility-updates.md b/website/blog/2018-08-13-react-native-accessibility-updates.md index dc84adc6e26..5adbb9c5f5d 100644 --- a/website/blog/2018-08-13-react-native-accessibility-updates.md +++ b/website/blog/2018-08-13-react-native-accessibility-updates.md @@ -109,12 +109,16 @@ The most simple use cases can be replaced by running a jscodeshift script. This [script](https://gist.github.com/ziqichen6/246e5778617224d2b4aff198dab0305d) replaces the following instances: - accessibilityTraits=“trait” - accessibilityTraits={[“trait”]} +``` +accessibilityTraits=“trait” +accessibilityTraits={[“trait”]} +``` With - accessibilityRole= “trait” +``` +accessibilityRole= “trait” +``` This script also removes instances of `AccessibilityComponentType` (assuming everywhere you set `AccessibilityComponentType`, you would also set `AccessibilityTraits`). @@ -124,12 +128,16 @@ For the cases that used `AccessibilityTraits` that don't have a corresponding va In general, - accessibilityTraits= {[“button”, “selected”]} +```tsx +accessibilityTraits= {[“button”, “selected”]} +``` would be manually replaced with - accessibilityRole=“button” - accessibilityStates={[“selected”]} +```tsx +accessibilityRole=“button” +accessibilityStates={[“selected”]} +``` These properties are already being used in Facebook's codebase. The codemod for Facebook was surprisingly simple. The jscodeshift script fixed about half of our instances, and the other half was fixed manually. Overall, the entire process took less than a few hours. diff --git a/website/contributing/how-to-open-a-pull-request.md b/website/contributing/how-to-open-a-pull-request.md index 86c683f822e..cc076b73dc6 100644 --- a/website/contributing/how-to-open-a-pull-request.md +++ b/website/contributing/how-to-open-a-pull-request.md @@ -20,11 +20,11 @@ The React Native source code is hosted on GitHub. You can interact with the git While you can browse the source code for React Native on [GitHub](https://github.com/facebook/react-native), we recommend you set up a fork on your local machine. -1. Go to . +1. Go to https://github.com/facebook/react-native. 2. Click on "Fork" button on the upper right. 3. When asked, select your username as the host for this fork. -You will now have a fork of React Native on GitHub at . Next, you will grab a copy of the source code for your local machine. Open a shell and type the following commands: +You will now have a fork of React Native on GitHub at https://github.com/your_username/react-native. Next, you will grab a copy of the source code for your local machine. Open a shell and type the following commands: ```bash git clone https://github.com/facebook/react-native.git diff --git a/website/contributing/release-branch-cut-and-rc0.md b/website/contributing/release-branch-cut-and-rc0.md index c2f2fbb2d60..fde9a285495 100644 --- a/website/contributing/release-branch-cut-and-rc0.md +++ b/website/contributing/release-branch-cut-and-rc0.md @@ -59,7 +59,7 @@ Before continuing further, follow the [testing guide](/contributing/release-test -### 5. Kick off the build of 0.{minor}.0-rc.0 +### 5. Kick off the build of `0.{minor}.0-rc.0` Once you're done with the testing, you can kick-off the bump and publishing of RC0: @@ -131,7 +131,7 @@ In the `publish_release` CI workflow, the `build_hermes_macos` step produces a ` ### 9. Create a tracking discussion post -Create a "Road to " discussion post in the [`react-native-releases`](https://github.com/reactwg/react-native-releases/discussions) working group: +Create a "Road to [YOUR_MINOR_VERSION]" discussion post in the [`react-native-releases`](https://github.com/reactwg/react-native-releases/discussions) working group: diff --git a/website/contributing/release-faq.md b/website/contributing/release-faq.md index f03bd71c510..dc66eaecd0b 100644 --- a/website/contributing/release-faq.md +++ b/website/contributing/release-faq.md @@ -29,7 +29,7 @@ We follow a release cycle that is not strictly monthly - you can read more [abou ### How do I know if my fix/feature is in a certain release? -To determine whether a fix or feature is present in a given release, you will need the commit hash where the fix or feature was added to the `main` branch of the core `react-native` repo. If you know the PR, you can look for the comment from **@facebook-github-bot** that says 'closed this in '. +To determine whether a fix or feature is present in a given release, you will need the commit hash where the fix or feature was added to the `main` branch of the core `react-native` repo. If you know the PR, you can look for the comment from **@facebook-github-bot** that says 'closed this in [COMMIT_HASH]'. Once you have the commit hash, navigate to `https://github.com/facebook/react-native/commit/`. Look closely at the commit message, underneath which you will find a list of tags associated with the commit. These tags will tell you which releases contains this commit. For example, commit [a6768bfd70187634e587d7b2e92d2b6735a4037e](https://github.com/facebook/react-native/commit/a6768bfd70187634e587d7b2e92d2b6735a4037e) has the following tags as of this writing: diff --git a/website/package.json b/website/package.json index 5942d828378..b9ff98d2a62 100644 --- a/website/package.json +++ b/website/package.json @@ -17,7 +17,7 @@ "swizzle": "docusaurus swizzle", "deploy": "docusaurus deploy", "serve": "docusaurus serve", - "clean": "docusaurus clear", + "clear": "docusaurus clear", "test": "yarn build", "version:cut": "docusaurus docs:version", "format:source": "prettier --write {{core,src}/**/*.js,*.js}", diff --git a/website/src/theme/MDXComponents/InlineCode.js b/website/src/theme/MDXComponents/InlineCode.js new file mode 100644 index 00000000000..4eae4577952 --- /dev/null +++ b/website/src/theme/MDXComponents/InlineCode.js @@ -0,0 +1,62 @@ +import React from 'react'; +import Link from '@docusaurus/Link'; + +const MarkdownInlineCodePrefix = 'md '; + +export default function InlineCode(props) { + if ( + typeof props.children === 'string' && + props.children.startsWith(MarkdownInlineCodePrefix) + ) { + return ( + + ); + } + return ; +} + +// An inline code block with some basic Markdown support +// Currently only supports links, which should be good enough... +// To enable Markdown support, use the "`md " prefix +// Syntax example: `md ({nativeEvent: [PressEvent](pressevent)})` +const MarkdownInlineCode = React.memo(function MarkdownInlineCodeInner(props) { + const children = linkify(props.children); + return ; +}); + +// Gives the ability to use basic Markdown links inside inline code blocks +// We use RegExp because a full Markdown parser would be quite heavy +// See https://github.com/facebook/react-native-website/pull/3807 +function linkify(input) { + // Inspired by https://github.com/gakimball/transform-markdown-links + // Thank you: http://stackoverflow.com/a/32382702 (with some modifications) + const linkRegExp = /(?\[(?[^\]]+)?\]\((?[^)]+)\))/g; + const linkSplitRegExp = /\[[^\]]+?\]\([^)]+\)/g; + + const links = []; + let match; + while ((match = linkRegExp.exec(input)) !== null) { + const link = match.groups.link; + const text = match.groups.text; + const url = match.groups.url; + if (url.endsWith('.md') || url.endsWith('.mdx')) { + throw new Error( + "Markdown links inside code blocks can't link using a filename extensions. Problematic link: " + + link + ); + } + links.push({link, text, url}); + } + + return input.split(linkSplitRegExp).map((text, i) => { + return ( + + {text} + {links[i] ? {links[i].text} : null} + + ); + }); +} diff --git a/website/src/theme/MDXComponents/index.js b/website/src/theme/MDXComponents/index.js new file mode 100644 index 00000000000..fd0cb2ecaae --- /dev/null +++ b/website/src/theme/MDXComponents/index.js @@ -0,0 +1,9 @@ +import React from 'react'; +// Import the original mapper +import MDXComponents from '@theme-original/MDXComponents'; +import InlineCode from './InlineCode'; + +export default { + ...MDXComponents, + inlineCode: InlineCode, +}; diff --git a/website/versioned_docs/version-0.69/running-on-device.md b/website/versioned_docs/version-0.69/running-on-device.md deleted file mode 100644 index 77f984f1a8d..00000000000 --- a/website/versioned_docs/version-0.69/running-on-device.md +++ /dev/null @@ -1,394 +0,0 @@ ---- -id: running-on-device -title: Running On Device -hide_table_of_contents: true ---- - -import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants'; - -It's always a good idea to test your app on an actual device before releasing it to your users. This document will guide you through the necessary steps to run your React Native app on a device and to get it ready for production. - -:::info -If you used `create-expo-app` to set up your project, you can run your app on a device in Expo Go by scanning the QR code that is displayed when you run `npm start`. Refer to the Expo guide for [running your project on your device](https://docs.expo.dev/get-started/expo-go/) for more information. -::: - - - - -## Running your app on Android devices - -#### Development OS - - - - -[//]: # 'macOS, Android' - -### 1. Enable Debugging over USB - -Most Android devices can only install and run apps downloaded from Google Play, by default. You will need to enable USB Debugging on your device in order to install your app during development. - -To enable USB debugging on your device, you will first need to enable the "Developer options" menu by going to **Settings** → **About phone** → **Software information** and then tapping the `Build number` row at the bottom seven times. You can then go back to **Settings** → **Developer options** to enable "USB debugging". - -### 2. Plug in your device via USB - -Let's now set up an Android device to run our React Native projects. Go ahead and plug in your device via USB to your development machine. - -Now check that your device is properly connecting to ADB, the Android Debug Bridge, by running `adb devices`. - -```shell -$ adb devices -List of devices attached -emulator-5554 offline # Google emulator -14ed2fcc device # Physical device -``` - -Seeing `device` in the right column means the device is connected. You must have **only one device connected** at a time. - -### 3. Run your app - -Type the following in your command prompt to install and launch your app on the device: - -```shell -$ npx react-native run-android -``` - -> If you get a "bridge configuration isn't available" error, see [Using adb reverse](running-on-device.md#method-1-using-adb-reverse-recommended). - -> Hint: You can also use the `React Native CLI` to generate and run a `Release` build (e.g. `npx react-native run-android --variant=release`). - -

Connecting to the development server

- -You can also iterate quickly on a device by connecting to the development server running on your development machine. There are several ways of accomplishing this, depending on whether you have access to a USB cable or a Wi-Fi network. - -### Method 1: Using adb reverse (recommended) - -You can use this method if your device is running Android 5.0 (Lollipop) or newer, it has USB debugging enabled, and it is connected via USB to your development machine. - -Run the following in a command prompt: - -```shell -$ adb -s reverse tcp:8081 tcp:8081 -``` - -To find the device name, run the following adb command: - -```shell -$ adb devices -``` - -You can now enable Live reloading from the [Developer menu](debugging.md#accessing-the-in-app-developer-menu). Your app will reload whenever your JavaScript code has changed. - -### Method 2: Connect via Wi-Fi - -You can also connect to the development server over Wi-Fi. You'll first need to install the app on your device using a USB cable, but once that has been done you can debug wirelessly by following these instructions. You'll need your development machine's current IP address before proceeding. - -You can find the IP address in **System Preferences** → **Network**. - -1. Make sure your laptop and your phone are on the **same** Wi-Fi network. -2. Open your React Native app on your device. -3. You'll see a [red screen with an error](debugging.md#in-app-errors-and-warnings). This is OK. The following steps will fix that. -4. Open the in-app [Developer menu](debugging.md#accessing-the-in-app-developer-menu). -5. Go to **Dev Settings** → **Debug server host & port for device**. -6. Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081). -7. Go back to the **Developer menu** and select **Reload JS**. - -You can now enable Live reloading from the [Developer menu](debugging.md#accessing-the-in-app-developer-menu). Your app will reload whenever your JavaScript code has changed. - -## Building your app for production - -You have built a great app using React Native, and you are now itching to release it in the Play Store. The process is the same as any other native Android app, with some additional considerations to take into account. Follow the guide for [generating a signed APK](signed-apk-android.md) to learn more. - - - - -[//]: # 'Windows, Android' - -### 1. Enable Debugging over USB - -Most Android devices can only install and run apps downloaded from Google Play, by default. You will need to enable USB Debugging on your device in order to install your app during development. - -To enable USB debugging on your device, you will first need to enable the "Developer options" menu by going to **Settings** → **About phone** → **Software information** and then tapping the `Build number` row at the bottom seven times. You can then go back to **Settings** → **Developer options** to enable "USB debugging". - -### 2. Plug in your device via USB - -Let's now set up an Android device to run our React Native projects. Go ahead and plug in your device via USB to your development machine. - -Now check that your device is properly connecting to ADB, the Android Debug Bridge, by running `adb devices`. - -```shell -$ adb devices -List of devices attached -emulator-5554 offline # Google emulator -14ed2fcc device # Physical device -``` - -Seeing `device` in the right column means the device is connected. You must have **only one device connected** at a time. - -### 3. Run your app - -Type the following in your command prompt to install and launch your app on the device: - -```shell -$ npx react-native run-android -``` - -> Hint: You can also use the `React Native CLI` to generate and run a `Release` build (e.g. `npx react-native run-android --variant=release`). - -

Connecting to the development server

- -You can also iterate quickly on a device by connecting to the development server running on your development machine. There are several ways of accomplishing this, depending on whether you have access to a USB cable or a Wi-Fi network. - -### Method 1: Using adb reverse (recommended) - -You can use this method if your device is running Android 5.0 (Lollipop) or newer, it has USB debugging enabled, and it is connected via USB to your development machine. - -Run the following in a command prompt: - -```shell -$ adb -s reverse tcp:8081 tcp:8081 -``` - -To find the device name, run the following adb command: - -```shell -$ adb devices -``` - -You can now enable Live reloading from the [Developer menu](debugging.md#accessing-the-in-app-developer-menu). Your app will reload whenever your JavaScript code has changed. - -### Method 2: Connect via Wi-Fi - -You can also connect to the development server over Wi-Fi. You'll first need to install the app on your device using a USB cable, but once that has been done you can debug wirelessly by following these instructions. You'll need your development machine's current IP address before proceeding. - -Open the command prompt and type `ipconfig` to find your machine's IP address ([more info](http://windows.microsoft.com/en-us/windows/using-command-line-tools-networking-information)). - -1. Make sure your laptop and your phone are on the **same** Wi-Fi network. -2. Open your React Native app on your device. -3. You'll see a [red screen with an error](debugging.md#in-app-errors-and-warnings). This is OK. The following steps will fix that. -4. Open the in-app [Developer menu](debugging.md#accessing-the-in-app-developer-menu). -5. Go to **Dev Settings** → **Debug server host & port for device**. -6. Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081). -7. Go back to the **Developer menu** and select **Reload JS**. - -You can now enable Live reloading from the [Developer menu](debugging.md#accessing-the-in-app-developer-menu). Your app will reload whenever your JavaScript code has changed. - -## Building your app for production - -You have built a great app using React Native, and you are now itching to release it in the Play Store. The process is the same as any other native Android app, with some additional considerations to take into account. Follow the guide for [generating a signed APK](signed-apk-android.md) to learn more. - - - - -[//]: # 'Linux, Android' - -### 1. Enable Debugging over USB - -Most Android devices can only install and run apps downloaded from Google Play, by default. You will need to enable USB Debugging on your device in order to install your app during development. - -To enable USB debugging on your device, you will first need to enable the "Developer options" menu by going to **Settings** → **About phone** → **Software information** and then tapping the `Build number` row at the bottom seven times. You can then go back to **Settings** → **Developer options** to enable "USB debugging". - -### 2. Plug in your device via USB - -Let's now set up an Android device to run our React Native projects. Go ahead and plug in your device via USB to your development machine. - -Next, check the manufacturer code by using `lsusb` (on mac, you must first [install lsusb](https://github.com/jlhonora/lsusb)). `lsusb` should output something like this: - -```bash -$ lsusb -Bus 002 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub -Bus 002 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub -Bus 001 Device 003: ID 22b8:2e76 Motorola PCS -Bus 001 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub -Bus 001 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub -Bus 004 Device 001: ID 1d6b:0003 Linux Foundation 3.0 root hub -Bus 003 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub -``` - -These lines represent the USB devices currently connected to your machine. - -You want the line that represents your phone. If you're in doubt, try unplugging your phone and running the command again: - -```bash -$ lsusb -Bus 002 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub -Bus 002 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub -Bus 001 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub -Bus 001 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub -Bus 004 Device 001: ID 1d6b:0003 Linux Foundation 3.0 root hub -Bus 003 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub -``` - -You'll see that after removing the phone, the line which has the phone model ("Motorola PCS" in this case) disappeared from the list. This is the line that we care about. - -`Bus 001 Device 003: ID 22b8:2e76 Motorola PCS` - -From the above line, you want to grab the first four digits from the device ID: - -`22b8:2e76` - -In this case, it's `22b8`. That's the identifier for Motorola. - -You'll need to input this into your udev rules in order to get up and running: - -```shell -echo 'SUBSYSTEM=="usb", ATTR{idVendor}=="22b8", MODE="0666", GROUP="plugdev"' | sudo tee /etc/udev/rules.d/51-android-usb.rules -``` - -Make sure that you replace `22b8` with the identifier you get in the above command. - -Now check that your device is properly connecting to ADB, the Android Debug Bridge, by running `adb devices`. - -```shell -$ adb devices -List of devices attached -emulator-5554 offline # Google emulator -14ed2fcc device # Physical device -``` - -Seeing `device` in the right column means the device is connected. You must have **only one device connected** at a time. - -### 3. Run your app - -Type the following in your command prompt to install and launch your app on the device: - -```shell -$ npx react-native run-android -``` - -> If you get a "bridge configuration isn't available" error, see [Using adb reverse](running-on-device.md#method-1-using-adb-reverse-recommended). - -> Hint: You can also use the `React Native CLI` to generate and run a `Release` build (e.g. `npx react-native run-android --variant=release`). - -

Connecting to the development server

- -You can also iterate quickly on a device by connecting to the development server running on your development machine. There are several ways of accomplishing this, depending on whether you have access to a USB cable or a Wi-Fi network. - -### Method 1: Using adb reverse (recommended) - -You can use this method if your device is running Android 5.0 (Lollipop) or newer, it has USB debugging enabled, and it is connected via USB to your development machine. - -Run the following in a command prompt: - -```shell -$ adb -s reverse tcp:8081 tcp:8081 -``` - -To find the device name, run the following adb command: - -```shell -$ adb devices -``` - -You can now enable Live reloading from the [Developer menu](debugging.md#accessing-the-in-app-developer-menu). Your app will reload whenever your JavaScript code has changed. - -### Method 2: Connect via Wi-Fi - -You can also connect to the development server over Wi-Fi. You'll first need to install the app on your device using a USB cable, but once that has been done you can debug wirelessly by following these instructions. You'll need your development machine's current IP address before proceeding. - -Open a terminal and type `/sbin/ifconfig` to find your machine's IP address. - -1. Make sure your laptop and your phone are on the **same** Wi-Fi network. -2. Open your React Native app on your device. -3. You'll see a [red screen with an error](debugging.md#in-app-errors-and-warnings). This is OK. The following steps will fix that. -4. Open the in-app [Developer menu](debugging.md#accessing-the-in-app-developer-menu). -5. Go to **Dev Settings** → **Debug server host & port for device**. -6. Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081). -7. Go back to the **Developer menu** and select **Reload JS**. - -You can now enable Live reloading from the [Developer menu](debugging.md#accessing-the-in-app-developer-menu). Your app will reload whenever your JavaScript code has changed. - -## Building your app for production - -You have built a great app using React Native, and you are now itching to release it in the Play Store. The process is the same as any other native Android app, with some additional considerations to take into account. Follow the guide for [generating a signed APK](signed-apk-android.md) to learn more. - - - - - - - -## Running your app on iOS devices - -#### Development OS - - - - -[//]: # 'macOS, iOS' - -### 1. Plug in your device via USB - -Connect your iOS device to your Mac using a USB to Lightning cable. Navigate to the `ios` folder in your project, then open the `.xcodeproj` file, or if you are using CocoaPods open `.xcworkspace`, within it using Xcode. - -If this is your first time running an app on your iOS device, you may need to register your device for development. Open the **Product** menu from Xcode's menubar, then go to **Destination**. Look for and select your device from the list. Xcode will then register your device for development. - -### 2. Configure code signing - -Register for an [Apple developer account](https://developer.apple.com/) if you don't have one yet. - -Select your project in the Xcode Project Navigator, then select your main target (it should share the same name as your project). Look for the "General" tab. Go to "Signing" and make sure your Apple developer account or team is selected under the Team dropdown. Do the same for the tests target (it ends with Tests, and is below your main target). - -**Repeat** this step for the **Tests** target in your project. - -![](/docs/assets/RunningOnDeviceCodeSigning.png) - -### 3. Build and Run your app - -If everything is set up correctly, your device will be listed as the build target in the Xcode toolbar, and it will also appear in the Devices pane (`⇧⌘2`). You can now press the **Build and run** button (`⌘R`) or select **Run** from the **Product** menu. Your app will launch on your device shortly. - -![](/docs/assets/RunningOnDeviceReady.png) - -> If you run into any issues, please take a look at Apple's [Launching Your App on a Device](https://developer.apple.com/library/content/documentation/IDEs/Conceptual/AppDistributionGuide/LaunchingYourApponDevices/LaunchingYourApponDevices.html#//apple_ref/doc/uid/TP40012582-CH27-SW4) docs. - -

Connecting to the development server

- -You can also iterate quickly on a device using the development server. You only have to be on the same Wi-Fi network as your computer. Shake your device to open the [Developer menu](debugging.md#accessing-the-in-app-developer-menu), then enable Live Reload. Your app will reload whenever your JavaScript code has changed. - -![](/docs/assets/DeveloperMenu.png) - -### Troubleshooting - -> If you have any issues, ensure that your Mac and device are on the same network and can reach each other. Many open wireless networks with captive portals are configured to prevent devices from reaching other devices on the network. You may use your device's Personal Hotspot feature in this case. You may also share your internet (Wi-Fi/Ethernet) connection from your Mac to your device via USB and connect to the bundler through this tunnel for very high transfer speeds. - -When trying to connect to the development server you might get a [red screen with an error](debugging.md#in-app-errors-and-warnings) saying: - -> Connection to `http://localhost:8081/debugger-proxy?role=client` timed out. Are you running node proxy? If you are running on the device, check if you have the right IP address in `RCTWebSocketExecutor.m`. - -To solve this issue check the following points. - -#### 1. Wi-Fi network. - -Make sure your laptop and your phone are on the **same** Wi-Fi network. - -#### 2. IP address - -Make sure that the build script detected the IP address of your machine correctly (e.g. 10.0.1.123). - -![](/docs/assets/XcodeBuildIP.png) - -Open the **Report navigator** tab, select the last **Build** and search for `IP=` followed by an IP address. The IP address which gets embedded in the app should match your machines IP address. - -## Building your app for production - -You have built a great app using React Native, and you are now itching to release it in the App Store. The process is the same as any other native iOS app, with some additional considerations to take into account. Follow the guide for [publishing to the Apple App Store](publishing-to-app-store.md) to learn more. - - - - -[//]: # 'Windows, iOS' - -> A Mac is required in order to build your app for iOS devices. Alternatively, you can refer to our [environment setup guide](environment-setup) to learn how to build your app using Expo CLI, which will allow you to run your app using the Expo client app. - - - - -[//]: # 'Linux, iOS' - -> A Mac is required in order to build your app for iOS devices. Alternatively, you can refer to our [environment setup guide](environment-setup) to learn how to build your app using Expo CLI, which will allow you to run your app using the Expo client app. - - - - - - diff --git a/website/versioned_docs/version-0.70/_integration-with-existing-apps-java.md b/website/versioned_docs/version-0.70/_integration-with-existing-apps-java.md index 6f9ec198e9b..daba62d6f3f 100644 --- a/website/versioned_docs/version-0.70/_integration-with-existing-apps-java.md +++ b/website/versioned_docs/version-0.70/_integration-with-existing-apps-java.md @@ -221,7 +221,7 @@ protected void onActivityResult(int requestCode, int resultCode, Intent data) { Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```java public class MyReactActivity extends Activity implements DefaultHardwareBackBtnHandler { diff --git a/website/versioned_docs/version-0.70/_integration-with-existing-apps-kotlin.md b/website/versioned_docs/version-0.70/_integration-with-existing-apps-kotlin.md index a1582ad01e9..a7ac5bce434 100644 --- a/website/versioned_docs/version-0.70/_integration-with-existing-apps-kotlin.md +++ b/website/versioned_docs/version-0.70/_integration-with-existing-apps-kotlin.md @@ -239,7 +239,7 @@ override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```kotlin class MyReactActivity : Activity(), DefaultHardwareBackBtnHandler { diff --git a/website/versioned_docs/version-0.70/animated.md b/website/versioned_docs/version-0.70/animated.md index 006278d3601..4916c1c9636 100644 --- a/website/versioned_docs/version-0.70/animated.md +++ b/website/versioned_docs/version-0.70/animated.md @@ -530,9 +530,9 @@ Animations are started by calling start() on your animation. start() takes a com **Parameters:** -| Name | Type | Required | Description | -| -------- | ------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| callback | ?(result?: {finished: boolean}) | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | +| Name | Type | Required | Description | +| -------- | --------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| callback | `?(result?: {finished: boolean})` | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | Start example with callback: diff --git a/website/versioned_docs/version-0.70/button.md b/website/versioned_docs/version-0.70/button.md index b9c3424eda7..dfb94ecba4d 100644 --- a/website/versioned_docs/version-0.70/button.md +++ b/website/versioned_docs/version-0.70/button.md @@ -112,9 +112,9 @@ export default App; Handler to be called when the user taps the button. -| Type | -| ------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) | +| Type | +| ---------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)})` | --- diff --git a/website/versioned_docs/version-0.70/flatlist.md b/website/versioned_docs/version-0.70/flatlist.md index 9d39af7f7db..854e21b1410 100644 --- a/website/versioned_docs/version-0.70/flatlist.md +++ b/website/versioned_docs/version-0.70/flatlist.md @@ -448,9 +448,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ------------------------------------------------------------------------------------------------------------------ | -| (callback: { changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s }) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]} => void;` | --- diff --git a/website/versioned_docs/version-0.70/image.md b/website/versioned_docs/version-0.70/image.md index a2f6a4ad256..81597e13702 100644 --- a/website/versioned_docs/version-0.70/image.md +++ b/website/versioned_docs/version-0.70/image.md @@ -305,9 +305,9 @@ Invoked on load error. Invoked on mount and on layout changes. -| Type | -| ----------------------------------------------------- | -| ({ nativeEvent: [LayoutEvent](layoutevent) }) => void | +| Type | +| ------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)} => void` | --- @@ -317,9 +317,9 @@ Invoked when load completes successfully. **Example:** `onLoad={({nativeEvent: {source: {width, height}}}) => setImageRealSize({width, height})}` -| Type | -| ----------------------------------------------------------------- | -| ({ nativeEvent: [ImageLoadEvent](image#imageloadevent) }) => void | +| Type | +| ------------------------------------------------------------------- | +| `md ({nativeEvent: [ImageLoadEvent](image#imageloadevent)} => void` | --- diff --git a/website/versioned_docs/version-0.70/javascript-environment.md b/website/versioned_docs/version-0.70/javascript-environment.md index 035776ba34f..57898efd0b6 100644 --- a/website/versioned_docs/version-0.70/javascript-environment.md +++ b/website/versioned_docs/version-0.70/javascript-environment.md @@ -84,25 +84,25 @@ Many standard functions are also available on all the supported JavaScript runti #### Browser -- [CommonJS require](https://nodejs.org/docs/latest/api/modules.html) -- [console.{log, warn, error, info, trace, table, group, 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) +- [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) +- `md [console.{log, warn, error, info, trace, table, group, 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) #### ECMAScript 2015 (ES6) -- [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) -- Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)} -- [Object.assign](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) -- String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)} +- [`Array.from`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) +- `md Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)}` +- [`Object.assign`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) +- `md String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)}` #### ECMAScript 2016 (ES7) -- Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes) +- `md Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)` #### ECMAScript 2017 (ES8) -- Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)} +- `md Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)}` #### Specific diff --git a/website/versioned_docs/version-0.70/linking.md b/website/versioned_docs/version-0.70/linking.md index 1b089210cc9..d5b936a4694 100644 --- a/website/versioned_docs/version-0.70/linking.md +++ b/website/versioned_docs/version-0.70/linking.md @@ -406,7 +406,7 @@ Launch an Android intent with extras. **Parameters:** -| Name | Type | -| ----------------------------------------------------------- | ------------------------------------------------------------ | -| action
Required
| string | -| extras | array of `{key: string, value: string \| number \| boolean}` | +| Name | Type | +| ----------------------------------------------------------- | ---------------------------------------------------------- | +| action
Required
| string | +| extras | `Array<{key: string, value: string ｜ number ｜ boolean}>` | diff --git a/website/versioned_docs/version-0.70/new-architecture-appendix.md b/website/versioned_docs/version-0.70/new-architecture-appendix.md index 61bbc1377e3..4a5b85cb2ca 100644 --- a/website/versioned_docs/version-0.70/new-architecture-appendix.md +++ b/website/versioned_docs/version-0.70/new-architecture-appendix.md @@ -38,9 +38,9 @@ This is recommended over using plain `Object`, for type safety. **Example:** `{| foo: string, ... |}` -| Nullable Support? | Android (Java) | iOS | -| --------------------------------------------- | -------------- | --- | -| ?{| foo: string, ...|} | - | - | +| Nullable Support? | Android (Java) | iOS | +| ------------------------------------------------------- | -------------- | --- | +| ?{| foo: string, ...|} | - | - | ### `Object` @@ -98,19 +98,19 @@ You may also find it useful to refer to the JavaScript specifications for the co You may use the following table as a reference for which types are supported and what they map to in each platform: -| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | -| ---------------------------------------------- | -------------------------------------------------------- | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | -| `string` | string | null | `String` | `NSString` | | -| `boolean` | boolean | null | `Boolean` | `NSNumber` | | -| `Float`, `Double`, or `Int32` | No | `double` | `NSNumber` | | -| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | -| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | -| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | -| `Function` | Function | null | | | | -| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | -| Type aliases of the above | Yes | | | | -| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | -| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | +| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | +| ------------------------------------------------------- | ------------------------------------------------------------------ | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | +| `string` | string | null | `String` | `NSString` | | +| `boolean` | boolean | null | `Boolean` | `NSNumber` | | +| `Float`, `Double`, or `Int32` | No | `double` | `NSNumber` | | +| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | +| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | +| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | +| `Function` | Function | null | | | | +| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | +| Type aliases of the above | Yes | | | | +| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | +| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository. diff --git a/website/versioned_docs/version-0.70/pressable.md b/website/versioned_docs/version-0.70/pressable.md index e99550542c3..c2145b959aa 100644 --- a/website/versioned_docs/version-0.70/pressable.md +++ b/website/versioned_docs/version-0.70/pressable.md @@ -169,49 +169,49 @@ Sets additional distance outside of element in which a press can be detected. Called when the hover is activated to provide visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onHoverOut` Called when the hover is deactivated to undo visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onLongPress` Called if the time after `onPressIn` lasts longer than 500 milliseconds. This time period can be customized with [`delayLongPress`](#delaylongpress). -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | ### `onPress` Called after `onPressOut`. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | ### `onPressIn` Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | ### `onPressOut` Called when a touch is released. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | ### `pressRetentionOffset` diff --git a/website/versioned_docs/version-0.70/pushnotificationios.md b/website/versioned_docs/version-0.70/pushnotificationios.md index 8a801b3ccbe..9399cd0c429 100644 --- a/website/versioned_docs/version-0.70/pushnotificationios.md +++ b/website/versioned_docs/version-0.70/pushnotificationios.md @@ -313,7 +313,7 @@ Valid events are: - `notification` : Fired when a remote notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `localNotification` : Fired when a local notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `register`: Fired when the user registers for remote notifications. The handler will be invoked with a hex string representing the deviceToken. -- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with {message: string, code: number, details: any}. +- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with `{message: string, code: number, details: any}`. --- diff --git a/website/versioned_docs/version-0.70/scrollview.md b/website/versioned_docs/version-0.70/scrollview.md index 2d2bf4a8a19..b142a9f0ee0 100644 --- a/website/versioned_docs/version-0.70/scrollview.md +++ b/website/versioned_docs/version-0.70/scrollview.md @@ -199,9 +199,9 @@ const styles = StyleSheet.create({ The amount by which the scroll view content is inset from the edges of the scroll view. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- @@ -369,7 +369,7 @@ Caveat 2: This uses `contentOffset` and `frame.origin` in native code to compute | Type | | ------------------------------------------------------------------------ | -| object: { minIndexForVisible: number, autoscrollToTopThreshold: number } | +| object: `{minIndexForVisible: number, autoscrollToTopThreshold: number}` | --- @@ -585,9 +585,9 @@ This controls how often the scroll event will be fired while scrolling (as a tim The amount by which the scroll view indicators are inset from the edges of the scroll view. This should normally be set to the same value as the `contentInset`. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- diff --git a/website/versioned_docs/version-0.70/sectionlist.md b/website/versioned_docs/version-0.70/sectionlist.md index 2b8690b4522..3e517c9bec1 100644 --- a/website/versioned_docs/version-0.70/sectionlist.md +++ b/website/versioned_docs/version-0.70/sectionlist.md @@ -300,9 +300,9 @@ Rendered at the very beginning of the list. Can be a React Component (e.g. `Some Called once when the scroll position gets within `onEndReachedThreshold` of the rendered content. -| Type | -| ------------------------------------------- | -| (info: { distanceFromEnd: number }) => void | +| Type | +| --------------------------------------------- | +| `(info: { distanceFromEnd: number }) => void` | --- @@ -330,9 +330,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ------------------------------------------------------------------------------------------------------------------ | -| (callback: { changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s }) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | --- @@ -362,9 +362,9 @@ This may improve scroll performance for large lists. Rendered at the bottom of each section. -| Type | -| ---------------------------------------------------------------------- | -| (info: { section: [Section](sectionlist#section) }) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- @@ -372,9 +372,9 @@ Rendered at the bottom of each section. Rendered at the top of each section. These stick to the top of the `ScrollView` by default on iOS. See `stickySectionHeadersEnabled`. -| Type | -| ---------------------------------------------------------------------- | -| (info: { section: [Section](sectionlist#section) }) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- diff --git a/website/versioned_docs/version-0.70/shadow-props.md b/website/versioned_docs/version-0.70/shadow-props.md index 83be11c01dc..5b0bfd39050 100644 --- a/website/versioned_docs/version-0.70/shadow-props.md +++ b/website/versioned_docs/version-0.70/shadow-props.md @@ -118,9 +118,9 @@ This property will only work on Android API 28 and above. For similar functional Sets the drop shadow offset. -| Type | -| -------------------------------------- | -| object: {width: number,height: number} | +| Type | +| ---------------------------------------- | +| object: `{width: number,height: number}` | --- diff --git a/website/versioned_docs/version-0.70/switch.md b/website/versioned_docs/version-0.70/switch.md index 365755d61ee..6af1693c675 100644 --- a/website/versioned_docs/version-0.70/switch.md +++ b/website/versioned_docs/version-0.70/switch.md @@ -109,9 +109,9 @@ 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). -| Type | -| --------------------------------------------------------------- | -| object: { false: [color](colors.md), true: [color](colors.md) } | +| Type | +| ------------------------------------------------------------ | +| `md object: {false: [color](colors), true: [color](colors)}` | --- diff --git a/website/versioned_docs/version-0.70/text-style-props.md b/website/versioned_docs/version-0.70/text-style-props.md index 5bc4a6d35be..cfe081ee7ba 100644 --- a/website/versioned_docs/version-0.70/text-style-props.md +++ b/website/versioned_docs/version-0.70/text-style-props.md @@ -484,7 +484,7 @@ Specifies text alignment. On Android, the value 'justify' is only supported on O | Type | | ------------------------------------------- | -| object: { width?: number, height?: number } | +| object: `{width?: number, height?: number}` | --- diff --git a/website/versioned_docs/version-0.70/text.md b/website/versioned_docs/version-0.70/text.md index 9305c290887..e7cf1da6c6f 100644 --- a/website/versioned_docs/version-0.70/text.md +++ b/website/versioned_docs/version-0.70/text.md @@ -465,9 +465,9 @@ This prop is commonly used with `ellipsizeMode`. Invoked on mount and on layout changes. -| Type | -| ----------------------------------------------------- | -| ({ nativeEvent: [LayoutEvent](layoutevent) }) => void | +| Type | +| ---------------------------------------------------------- | +| `md ({ nativeEvent: [LayoutEvent](layoutevent) }) => void` | --- @@ -475,9 +475,9 @@ Invoked on mount and on layout changes. This function is called on long press. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -485,9 +485,9 @@ This function is called on long press. Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ------------------------------------------------------ | -| ({ nativeEvent: [PressEvent](pressevent) }) => boolean | +| Type | +| ----------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => boolean` | --- @@ -495,9 +495,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to Function called on user press, triggered after `onPressOut`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -505,9 +505,9 @@ Function called on user press, triggered after `onPressOut`. Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -515,9 +515,9 @@ Called immediately when a touch is engaged, before `onPressOut` and `onPress`. Called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -527,9 +527,9 @@ The View is now responding to touch events. This is the time to highlight and sh On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| -------------------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -537,9 +537,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -547,9 +547,9 @@ The user is moving their finger. Fired at the end of the touch. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -557,9 +557,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -567,9 +567,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become a responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| ------------------------------------------------------ | -| ({ nativeEvent: [PressEvent](pressevent) }) => boolean | +| Type | +| ----------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => boolean` | --- @@ -577,9 +577,9 @@ Some other `View` wants to become a responder and is asking this `View` to relea If a parent `View` wants to prevent a child `View` from becoming a responder on a touch start, it should have this handler which returns `true`. -| Type | -| ------------------------------------------------------ | -| ({ nativeEvent: [PressEvent](pressevent) }) => boolean | +| Type | +| ----------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => boolean` | --- diff --git a/website/versioned_docs/version-0.70/textinput.md b/website/versioned_docs/version-0.70/textinput.md index c685e65d14c..813629463ab 100644 --- a/website/versioned_docs/version-0.70/textinput.md +++ b/website/versioned_docs/version-0.70/textinput.md @@ -527,9 +527,9 @@ Callback that is called when text input ends. Callback that is called when a touch is engaged. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -537,9 +537,9 @@ Callback that is called when a touch is engaged. Callback that is called when a touch is released. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -547,9 +547,9 @@ Callback that is called when a touch is released. Callback that is called when the text input is focused. -| Type | -| ----------------------------------------------------- | -| ({ nativeEvent: [LayoutEvent](layoutevent) }) => void | +| Type | +| ---------------------------------------------------------- | +| `md ({ nativeEvent: [LayoutEvent](layoutevent) }) => void` | --- @@ -567,9 +567,9 @@ Callback that is called when a key is pressed. This will be called with object w Invoked on mount and on layout changes. -| Type | -| ----------------------------------------------------- | -| ({ nativeEvent: [LayoutEvent](layoutevent) }) => void | +| Type | +| ---------------------------------------------------------- | +| `md ({ nativeEvent: [LayoutEvent](layoutevent) }) => void` | --- @@ -705,9 +705,9 @@ If `true`, the text input obscures the text entered so that sensitive text like The start and end of the text input's selection. Set start and end to the same value to position the cursor. -| Type | -| ----------------------------------- | -| object: {start: number,end: number} | +| Type | +| ------------------------------------- | +| object: `{start: number,end: number}` | --- diff --git a/website/versioned_docs/version-0.70/touchablewithoutfeedback.md b/website/versioned_docs/version-0.70/touchablewithoutfeedback.md index 52a42fdc9c9..dbf948d7b8a 100644 --- a/website/versioned_docs/version-0.70/touchablewithoutfeedback.md +++ b/website/versioned_docs/version-0.70/touchablewithoutfeedback.md @@ -177,9 +177,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -213,9 +213,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -293,9 +293,9 @@ Invoked when the item receives focus. Invoked on mount and on layout changes. -| Type | -| ----------------------------------------------------- | -| ({ nativeEvent: [LayoutEvent](layoutevent) }) => void | +| Type | +| ---------------------------------------------------------- | +| `md ({ nativeEvent: [LayoutEvent](layoutevent) }) => void` | --- diff --git a/website/versioned_docs/version-0.70/transforms.md b/website/versioned_docs/version-0.70/transforms.md index 22da7098d18..a8cc5f7d282 100644 --- a/website/versioned_docs/version-0.70/transforms.md +++ b/website/versioned_docs/version-0.70/transforms.md @@ -284,9 +284,9 @@ The skew transformations require a string so that the transform may be expressed transform([{skewX: '45deg'}]); ``` -| Type | Required | -| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -| array of objects: {matrix: number[]}, {perspective: number}, {rotate: string}, {rotateX: string}, {rotateY: string}, {rotateZ: string}, {scale: number}, {scaleX: number}, {scaleY: number}, {translateX: number}, {translateY: number}, {skewX: string}, {skewY: string} | No | +| Type | Required | +| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | +| array of objects: `{matrix: number[]}`, `{perspective: number}`, `{rotate: string}`, `{rotateX: string}`, `{rotateY: string}`, `{rotateZ: string}`, `{scale: number}`, `{scaleX: number}`, `{scaleY: number}`, `{translateX: number}`, `{translateY: number}`, `{skewX: string}`, `{skewY: string}` | No | --- diff --git a/website/versioned_docs/version-0.70/view.md b/website/versioned_docs/version-0.70/view.md index d5636f9e0f0..fab181348b0 100644 --- a/website/versioned_docs/version-0.70/view.md +++ b/website/versioned_docs/version-0.70/view.md @@ -212,9 +212,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -224,9 +224,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -276,9 +276,9 @@ For example, if a touchable view has a height of 20 the touchable height can be > The touch area never extends past the parent view bounds and the Z-index of sibling views always takes precedence if a touch hits two overlapping views. -| Type | -| ------------------------------------------------------------------ | -| object: {top: number, left: number, bottom: number, right: number} | +| Type | +| -------------------------------------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | --- @@ -413,9 +413,9 @@ Invoked on mount and on layout changes. This event is fired immediately once the layout has been calculated, but the new layout may not yet be reflected on the screen at the time the event is received, especially if a layout animation is in progress. -| Type | -| ----------------------------------------------------- | -| ({ nativeEvent: [LayoutEvent](layoutevent) }) => void | +| Type | +| ---------------------------------------------------------- | +| `md ({ nativeEvent: [LayoutEvent](layoutevent) }) => void` | --- @@ -433,9 +433,9 @@ When `accessible` is `true`, the system will invoke this function when the user Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ------------------------------------------------------ | -| ({ nativeEvent: [PressEvent](pressevent) }) => boolean | +| Type | +| ----------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => boolean` | --- @@ -443,9 +443,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to If a parent `View` wants to prevent a child `View` from becoming responder on a move, it should have this handler which returns `true`. -| Type | -| ------------------------------------------------------ | -| ({ nativeEvent: [PressEvent](pressevent) }) => boolean | +| Type | +| ----------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => boolean` | --- @@ -455,9 +455,9 @@ The View is now responding for touch events. This is the time to highlight and s On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| -------------------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -465,9 +465,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -475,9 +475,9 @@ The user is moving their finger. Another responder is already active and will not release it to that `View` asking to be the responder. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -485,9 +485,9 @@ Another responder is already active and will not release it to that `View` askin Fired at the end of the touch. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -495,9 +495,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -505,9 +505,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| --------------------------------------------------- | -| ({ nativeEvent: [PressEvent](pressevent) }) => void | +| Type | +| -------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => void` | --- @@ -515,9 +515,9 @@ Some other `View` wants to become responder and is asking this `View` to release Does this view want to become responder on the start of a touch? -| Type | -| ------------------------------------------------------ | -| ({ nativeEvent: [PressEvent](pressevent) }) => boolean | +| Type | +| ----------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => boolean` | --- @@ -525,9 +525,9 @@ Does this view want to become responder on the start of a touch? If a parent `View` wants to prevent a child `View` from becoming responder on a touch start, it should have this handler which returns `true`. -| Type | -| ------------------------------------------------------ | -| ({ nativeEvent: [PressEvent](pressevent) }) => boolean | +| Type | +| ----------------------------------------------------------- | +| `md ({ nativeEvent: [PressEvent](pressevent) }) => boolean` | --- diff --git a/website/versioned_docs/version-0.70/virtualizedlist.md b/website/versioned_docs/version-0.70/virtualizedlist.md index f530add946c..7c410f73bdd 100644 --- a/website/versioned_docs/version-0.70/virtualizedlist.md +++ b/website/versioned_docs/version-0.70/virtualizedlist.md @@ -396,9 +396,9 @@ Used to handle failures when scrolling to an index that has not been measured ye Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ------------------------------------------------------------------------------------------------------------------ | -| (callback: { changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s }) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | --- diff --git a/website/versioned_docs/version-0.71/_integration-with-existing-apps-java.md b/website/versioned_docs/version-0.71/_integration-with-existing-apps-java.md index 2e5b61eefb5..0dfb11dbd01 100644 --- a/website/versioned_docs/version-0.71/_integration-with-existing-apps-java.md +++ b/website/versioned_docs/version-0.71/_integration-with-existing-apps-java.md @@ -234,7 +234,7 @@ protected void onActivityResult(int requestCode, int resultCode, Intent data) { Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```java public class MyReactActivity extends Activity implements DefaultHardwareBackBtnHandler { diff --git a/website/versioned_docs/version-0.71/_integration-with-existing-apps-kotlin.md b/website/versioned_docs/version-0.71/_integration-with-existing-apps-kotlin.md index 0ab43d37f3c..d43e9cfa64d 100644 --- a/website/versioned_docs/version-0.71/_integration-with-existing-apps-kotlin.md +++ b/website/versioned_docs/version-0.71/_integration-with-existing-apps-kotlin.md @@ -235,7 +235,7 @@ override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```kotlin class MyReactActivity : Activity(), DefaultHardwareBackBtnHandler { diff --git a/website/versioned_docs/version-0.71/animated.md b/website/versioned_docs/version-0.71/animated.md index 08c8061d11b..9e010641df4 100644 --- a/website/versioned_docs/version-0.71/animated.md +++ b/website/versioned_docs/version-0.71/animated.md @@ -565,9 +565,9 @@ Animations are started by calling start() on your animation. start() takes a com **Parameters:** -| Name | Type | Required | Description | -| -------- | ------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| callback | (result: {finished: boolean}) => void | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | +| Name | Type | Required | Description | +| -------- | --------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| callback | `(result: {finished: boolean}) => void` | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | Start example with callback: diff --git a/website/versioned_docs/version-0.71/animatedvaluexy.md b/website/versioned_docs/version-0.71/animatedvaluexy.md index e4d29cce1a0..e8353d333c8 100644 --- a/website/versioned_docs/version-0.71/animatedvaluexy.md +++ b/website/versioned_docs/version-0.71/animatedvaluexy.md @@ -74,9 +74,9 @@ Directly set the value. This will stop any animations running on the value and u **Parameters:** -| Name | Type | Required | Description | -| ----- | ---------------------- | -------- | ----------- | -| value | {x: number; y: number} | Yes | Value | +| Name | Type | Required | Description | +| ----- | ------------------------ | -------- | ----------- | +| value | `{x: number; y: number}` | Yes | Value | --- @@ -90,9 +90,9 @@ Sets an offset that is applied on top of whatever value is set, whether via `set **Parameters:** -| Name | Type | Required | Description | -| ------ | ---------------------- | -------- | ------------ | -| offset | {x: number; y: number} | Yes | Offset value | +| Name | Type | Required | Description | +| ------ | ------------------------ | -------- | ------------ | +| offset | `{x: number; y: number}` | Yes | Offset value | --- diff --git a/website/versioned_docs/version-0.71/button.md b/website/versioned_docs/version-0.71/button.md index 87bf065ab7f..a51eac41d06 100644 --- a/website/versioned_docs/version-0.71/button.md +++ b/website/versioned_docs/version-0.71/button.md @@ -120,9 +120,9 @@ export default App; Handler to be called when the user taps the button. -| Type | -| ----------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) | +| Type | +| ---------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)})` | --- diff --git a/website/versioned_docs/version-0.71/flatlist.md b/website/versioned_docs/version-0.71/flatlist.md index cccbea3a4c6..ec1c364f512 100644 --- a/website/versioned_docs/version-0.71/flatlist.md +++ b/website/versioned_docs/version-0.71/flatlist.md @@ -642,9 +642,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ------------------------------------------------------------------------------------------------ | -| (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]} => void; | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]} => void;` | --- diff --git a/website/versioned_docs/version-0.71/image.md b/website/versioned_docs/version-0.71/image.md index 5cc45f11a69..1df5d2c9f9f 100644 --- a/website/versioned_docs/version-0.71/image.md +++ b/website/versioned_docs/version-0.71/image.md @@ -336,9 +336,9 @@ Invoked on load error. Invoked on mount and on layout changes. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [LayoutEvent]layoutevent)} => void | +| Type | +| ------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)} => void` | --- @@ -348,9 +348,9 @@ Invoked when load completes successfully. **Example:** `onLoad={({nativeEvent: {source: {width, height}}}) => setImageRealSize({width, height})}` -| Type | -| ------------------------------------------------------------- | -| ({nativeEvent: [ImageLoadEvent]image#imageloadevent)} => void | +| Type | +| ------------------------------------------------------------------- | +| `md ({nativeEvent: [ImageLoadEvent](image#imageloadevent)} => void` | --- diff --git a/website/versioned_docs/version-0.71/javascript-environment.md b/website/versioned_docs/version-0.71/javascript-environment.md index 97e41683a6e..7b3adc05a6d 100644 --- a/website/versioned_docs/version-0.71/javascript-environment.md +++ b/website/versioned_docs/version-0.71/javascript-environment.md @@ -84,25 +84,25 @@ Many standard functions are also available on all the supported JavaScript runti #### Browser -- [CommonJS require](https://nodejs.org/docs/latest/api/modules.html) -- [console.{log, warn, error, info, trace, table, group, 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) +- [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) +- `md [console.{log, warn, error, info, trace, table, group, 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) #### ECMAScript 2015 (ES6) -- [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) -- Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)} -- [Object.assign](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) -- String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)} +- [`Array.from`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) +- `md Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)}` +- [`Object.assign`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) +- `md String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)}` #### ECMAScript 2016 (ES7) -- Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes) +- `md Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)` #### ECMAScript 2017 (ES8) -- Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)} +- `md Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)}` #### Specific diff --git a/website/versioned_docs/version-0.71/linking.md b/website/versioned_docs/version-0.71/linking.md index 0a5fd3b0349..80a06e8af9e 100644 --- a/website/versioned_docs/version-0.71/linking.md +++ b/website/versioned_docs/version-0.71/linking.md @@ -651,7 +651,7 @@ Launch an Android intent with extras. **Parameters:** -| Name | Type | -| ----------------------------------------------------------- | ------------------------------------------------------------ | -| action
Required
| string | -| extras | array of `{key: string, value: string \| number \| boolean}` | +| Name | Type | +| ----------------------------------------------------------- | ---------------------------------------------------------- | +| action
Required
| string | +| extras | `Array<{key: string, value: string ｜ number ｜ boolean}>` | diff --git a/website/versioned_docs/version-0.71/new-architecture-appendix.md b/website/versioned_docs/version-0.71/new-architecture-appendix.md index 61bbc1377e3..4a5b85cb2ca 100644 --- a/website/versioned_docs/version-0.71/new-architecture-appendix.md +++ b/website/versioned_docs/version-0.71/new-architecture-appendix.md @@ -38,9 +38,9 @@ This is recommended over using plain `Object`, for type safety. **Example:** `{| foo: string, ... |}` -| Nullable Support? | Android (Java) | iOS | -| --------------------------------------------- | -------------- | --- | -| ?{| foo: string, ...|} | - | - | +| Nullable Support? | Android (Java) | iOS | +| ------------------------------------------------------- | -------------- | --- | +| ?{| foo: string, ...|} | - | - | ### `Object` @@ -98,19 +98,19 @@ You may also find it useful to refer to the JavaScript specifications for the co You may use the following table as a reference for which types are supported and what they map to in each platform: -| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | -| ---------------------------------------------- | -------------------------------------------------------- | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | -| `string` | string | null | `String` | `NSString` | | -| `boolean` | boolean | null | `Boolean` | `NSNumber` | | -| `Float`, `Double`, or `Int32` | No | `double` | `NSNumber` | | -| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | -| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | -| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | -| `Function` | Function | null | | | | -| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | -| Type aliases of the above | Yes | | | | -| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | -| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | +| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | +| ------------------------------------------------------- | ------------------------------------------------------------------ | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | +| `string` | string | null | `String` | `NSString` | | +| `boolean` | boolean | null | `Boolean` | `NSNumber` | | +| `Float`, `Double`, or `Int32` | No | `double` | `NSNumber` | | +| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | +| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | +| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | +| `Function` | Function | null | | | | +| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | +| Type aliases of the above | Yes | | | | +| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | +| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository. diff --git a/website/versioned_docs/version-0.71/pressable.md b/website/versioned_docs/version-0.71/pressable.md index 1590b187b6e..8cfb57e9c6d 100644 --- a/website/versioned_docs/version-0.71/pressable.md +++ b/website/versioned_docs/version-0.71/pressable.md @@ -165,49 +165,49 @@ Sets additional distance outside of element in which a press can be detected. Called when the hover is activated to provide visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onHoverOut` Called when the hover is deactivated to undo visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onLongPress` Called if the time after `onPressIn` lasts longer than 500 milliseconds. This time period can be customized with [`delayLongPress`](#delaylongpress). -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPress` Called after `onPressOut`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPressIn` Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPressOut` Called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `pressRetentionOffset` diff --git a/website/versioned_docs/version-0.71/pushnotificationios.md b/website/versioned_docs/version-0.71/pushnotificationios.md index 9cbb9476757..604367ebf9d 100644 --- a/website/versioned_docs/version-0.71/pushnotificationios.md +++ b/website/versioned_docs/version-0.71/pushnotificationios.md @@ -321,7 +321,7 @@ Valid events are: - `notification` : Fired when a remote notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `localNotification` : Fired when a local notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `register`: Fired when the user registers for remote notifications. The handler will be invoked with a hex string representing the deviceToken. -- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with {message: string, code: number, details: any}. +- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with `{message: string, code: number, details: any}`. --- diff --git a/website/versioned_docs/version-0.71/scrollview.md b/website/versioned_docs/version-0.71/scrollview.md index 06490a1a3cd..c78cc53c5be 100644 --- a/website/versioned_docs/version-0.71/scrollview.md +++ b/website/versioned_docs/version-0.71/scrollview.md @@ -205,9 +205,9 @@ const styles = StyleSheet.create({ The amount by which the scroll view content is inset from the edges of the scroll view. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- @@ -373,9 +373,9 @@ Caveat 1: Reordering elements in the scrollview with this enabled will probably Caveat 2: This uses `contentOffset` and `frame.origin` in native code to compute visibility. Occlusion, transforms, and other complexity won't be taken into account as to whether content is "visible" or not. -| Type | -| ---------------------------------------------------------------------- | -| object: {minIndexForVisible: number, autoscrollToTopThreshold: number} | +| Type | +| ------------------------------------------------------------------------ | +| object: `{minIndexForVisible: number, autoscrollToTopThreshold: number}` | --- @@ -591,9 +591,9 @@ This controls how often the scroll event will be fired while scrolling (as a tim The amount by which the scroll view indicators are inset from the edges of the scroll view. This should normally be set to the same value as the `contentInset`. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- diff --git a/website/versioned_docs/version-0.71/sectionlist.md b/website/versioned_docs/version-0.71/sectionlist.md index e6fb7c76355..bfce587195c 100644 --- a/website/versioned_docs/version-0.71/sectionlist.md +++ b/website/versioned_docs/version-0.71/sectionlist.md @@ -310,9 +310,9 @@ Rendered at the very beginning of the list. Can be a React Component (e.g. `Some Called once when the scroll position gets within `onEndReachedThreshold` of the rendered content. -| Type | -| ----------------------------------------- | -| (info: {distanceFromEnd: number}) => void | +| Type | +| ------------------------------------------- | +| `(info: {distanceFromEnd: number}) => void` | --- @@ -340,9 +340,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ---------------------------------------------------------------------------------------------------------------- | -| (callback: {changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s}) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | --- @@ -372,9 +372,9 @@ This may improve scroll performance for large lists. Rendered at the bottom of each section. -| Type | -| -------------------------------------------------------------------- | -| (info: {section: [Section](sectionlist#section)}) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- @@ -382,9 +382,9 @@ Rendered at the bottom of each section. Rendered at the top of each section. These stick to the top of the `ScrollView` by default on iOS. See `stickySectionHeadersEnabled`. -| Type | -| -------------------------------------------------------------------- | -| (info: {section: [Section](sectionlist#section)}) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- diff --git a/website/versioned_docs/version-0.71/shadow-props.md b/website/versioned_docs/version-0.71/shadow-props.md index 650a27ec8ca..0eeb706a642 100644 --- a/website/versioned_docs/version-0.71/shadow-props.md +++ b/website/versioned_docs/version-0.71/shadow-props.md @@ -229,9 +229,9 @@ This property will only work on Android API 28 and above. For similar functional Sets the drop shadow offset. -| Type | -| -------------------------------------- | -| object: {width: number,height: number} | +| Type | +| ---------------------------------------- | +| object: `{width: number,height: number}` | --- diff --git a/website/versioned_docs/version-0.71/switch.md b/website/versioned_docs/version-0.71/switch.md index 1074e457566..f6cff1444ad 100644 --- a/website/versioned_docs/version-0.71/switch.md +++ b/website/versioned_docs/version-0.71/switch.md @@ -109,9 +109,9 @@ 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). -| Type | -| ------------------------------------------------------------- | -| object: {false: [color](colors.md), true: [color](colors.md)} | +| Type | +| ------------------------------------------------------------ | +| `md object: {false: [color](colors), true: [color](colors)}` | --- diff --git a/website/versioned_docs/version-0.71/text-style-props.md b/website/versioned_docs/version-0.71/text-style-props.md index c671104cd07..07c55b98177 100644 --- a/website/versioned_docs/version-0.71/text-style-props.md +++ b/website/versioned_docs/version-0.71/text-style-props.md @@ -894,9 +894,9 @@ Specifies text alignment. On Android, the value 'justify' is only supported on O ### `textShadowOffset` -| Type | -| ----------------------------------------- | -| object: {width?: number, height?: number} | +| Type | +| ------------------------------------------- | +| object: `{width?: number, height?: number}` | --- diff --git a/website/versioned_docs/version-0.71/text.md b/website/versioned_docs/version-0.71/text.md index 46b7626fbef..d1c2447f6a3 100644 --- a/website/versioned_docs/version-0.71/text.md +++ b/website/versioned_docs/version-0.71/text.md @@ -527,9 +527,9 @@ This prop is commonly used with `ellipsizeMode`. Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -537,9 +537,9 @@ Invoked on mount and on layout changes. This function is called on long press. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -547,9 +547,9 @@ This function is called on long press. Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -557,9 +557,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to Function called on user press, triggered after `onPressOut`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -567,9 +567,9 @@ Function called on user press, triggered after `onPressOut`. Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -577,9 +577,9 @@ Called immediately when a touch is engaged, before `onPressOut` and `onPress`. Called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -589,9 +589,9 @@ The View is now responding to touch events. This is the time to highlight and sh On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| ------------------------------------------------------------ | -| ({nativeEvent: [PressEvent](pressevent)}) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -599,9 +599,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -609,9 +609,9 @@ The user is moving their finger. Fired at the end of the touch. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -619,9 +619,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -629,9 +629,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become a responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -639,9 +639,9 @@ Some other `View` wants to become a responder and is asking this `View` to relea If a parent `View` wants to prevent a child `View` from becoming a responder on a touch start, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- diff --git a/website/versioned_docs/version-0.71/textinput.md b/website/versioned_docs/version-0.71/textinput.md index 60e73ecdd81..e3932bd0a46 100644 --- a/website/versioned_docs/version-0.71/textinput.md +++ b/website/versioned_docs/version-0.71/textinput.md @@ -589,9 +589,9 @@ Callback that is called when text input ends. Callback that is called when a touch is engaged. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -599,9 +599,9 @@ Callback that is called when a touch is engaged. Callback that is called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -609,9 +609,9 @@ Callback that is called when a touch is released. Callback that is called when the text input is focused. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -629,9 +629,9 @@ Callback that is called when a key is pressed. This will be called with object w Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -787,9 +787,9 @@ If `true`, the text input obscures the text entered so that sensitive text like The start and end of the text input's selection. Set start and end to the same value to position the cursor. -| Type | -| ----------------------------------- | -| object: {start: number,end: number} | +| Type | +| ------------------------------------- | +| object: `{start: number,end: number}` | --- diff --git a/website/versioned_docs/version-0.71/touchablewithoutfeedback.md b/website/versioned_docs/version-0.71/touchablewithoutfeedback.md index e5c0c5d88dd..3f081125a37 100644 --- a/website/versioned_docs/version-0.71/touchablewithoutfeedback.md +++ b/website/versioned_docs/version-0.71/touchablewithoutfeedback.md @@ -177,9 +177,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -307,9 +307,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -437,9 +437,9 @@ Invoked when the item receives focus. Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- diff --git a/website/versioned_docs/version-0.71/transforms.md b/website/versioned_docs/version-0.71/transforms.md index ebc0109890a..5058345f2b0 100644 --- a/website/versioned_docs/version-0.71/transforms.md +++ b/website/versioned_docs/version-0.71/transforms.md @@ -356,9 +356,9 @@ The skew transformations require a string so that the transform may be expressed transform([{skewX: '45deg'}]); ``` -| Type | Required | -| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -| array of objects: {matrix: number[]}, {perspective: number}, {rotate: string}, {rotateX: string}, {rotateY: string}, {rotateZ: string}, {scale: number}, {scaleX: number}, {scaleY: number}, {translateX: number}, {translateY: number}, {skewX: string}, {skewY: string} or string | No | +| Type | Required | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | +| array of objects: `{matrix: number[]}`, `{perspective: number}`, `{rotate: string}`, `{rotateX: string}`, `{rotateY: string}`, `{rotateZ: string}`, `{scale: number}`, `{scaleX: number}`, `{scaleY: number}`, `{translateX: number}`, `{translateY: number}`, `{skewX: string}`, `{skewY: string}` or string | No | --- diff --git a/website/versioned_docs/version-0.71/view.md b/website/versioned_docs/version-0.71/view.md index d3ceede0eef..69a595c6c35 100644 --- a/website/versioned_docs/version-0.71/view.md +++ b/website/versioned_docs/version-0.71/view.md @@ -211,9 +211,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -223,9 +223,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -426,9 +426,9 @@ For example, if a touchable view has a height of 20 the touchable height can be > The touch area never extends past the parent view bounds and the Z-index of sibling views always takes precedence if a touch hits two overlapping views. -| Type | -| ------------------------------------------------------------------ | -| object: {top: number, left: number, bottom: number, right: number} | +| Type | +| -------------------------------------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | --- @@ -575,9 +575,9 @@ Invoked on mount and on layout changes. This event is fired immediately once the layout has been calculated, but the new layout may not yet be reflected on the screen at the time the event is received, especially if a layout animation is in progress. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -595,9 +595,9 @@ When `accessible` is `true`, the system will invoke this function when the user Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -605,9 +605,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to If a parent `View` wants to prevent a child `View` from becoming responder on a move, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -617,9 +617,9 @@ The View is now responding for touch events. This is the time to highlight and s On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| ------------------------------------------------------------ | -| ({nativeEvent: [PressEvent](pressevent)}) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -627,9 +627,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -637,9 +637,9 @@ The user is moving their finger. Another responder is already active and will not release it to that `View` asking to be the responder. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -647,9 +647,9 @@ Another responder is already active and will not release it to that `View` askin Fired at the end of the touch. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -657,9 +657,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -667,9 +667,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -677,9 +677,9 @@ Some other `View` wants to become responder and is asking this `View` to release Does this view want to become responder on the start of a touch? -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -687,9 +687,9 @@ Does this view want to become responder on the start of a touch? If a parent `View` wants to prevent a child `View` from becoming responder on a touch start, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- diff --git a/website/versioned_docs/version-0.71/virtualizedlist.md b/website/versioned_docs/version-0.71/virtualizedlist.md index 8a81dc0677e..59483da90ed 100644 --- a/website/versioned_docs/version-0.71/virtualizedlist.md +++ b/website/versioned_docs/version-0.71/virtualizedlist.md @@ -479,9 +479,9 @@ Used to handle failures when scrolling to an index that has not been measured ye Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ---------------------------------------------------------------------------------------------------------------- | -| (callback: {changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s}) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | --- diff --git a/website/versioned_docs/version-0.72/_integration-with-existing-apps-java.md b/website/versioned_docs/version-0.72/_integration-with-existing-apps-java.md index d5f3cb0a5ca..af77483cebe 100644 --- a/website/versioned_docs/version-0.72/_integration-with-existing-apps-java.md +++ b/website/versioned_docs/version-0.72/_integration-with-existing-apps-java.md @@ -264,7 +264,7 @@ protected void onActivityResult(int requestCode, int resultCode, Intent data) { Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```java public class MyReactActivity extends Activity implements DefaultHardwareBackBtnHandler { diff --git a/website/versioned_docs/version-0.72/_integration-with-existing-apps-kotlin.md b/website/versioned_docs/version-0.72/_integration-with-existing-apps-kotlin.md index c2c7e68081e..a43d9e261e4 100644 --- a/website/versioned_docs/version-0.72/_integration-with-existing-apps-kotlin.md +++ b/website/versioned_docs/version-0.72/_integration-with-existing-apps-kotlin.md @@ -265,7 +265,7 @@ override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) Let's add some native code in order to start the React Native runtime and tell it to render our JS component. To do this, we're going to create an `Activity` that creates a `ReactRootView`, starts a React application inside it and sets it as the main content view. -> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. +> If you are targeting Android version <5, use the `AppCompatActivity` class from the `com.android.support:appcompat` package instead of `Activity`. ```kotlin class MyReactActivity : Activity(), DefaultHardwareBackBtnHandler { diff --git a/website/versioned_docs/version-0.72/animated.md b/website/versioned_docs/version-0.72/animated.md index af44b6a55af..0fe745664ed 100644 --- a/website/versioned_docs/version-0.72/animated.md +++ b/website/versioned_docs/version-0.72/animated.md @@ -463,9 +463,9 @@ Animations are started by calling start() on your animation. start() takes a com **Parameters:** -| Name | Type | Required | Description | -| -------- | ------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| callback | (result: {finished: boolean}) => void | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | +| Name | Type | Required | Description | +| -------- | --------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| callback | `(result: {finished: boolean}) => void` | No | Function that will be called after the animation finished running normally or when the animation is done because stop() was called on it before it could finish | Start example with callback: diff --git a/website/versioned_docs/version-0.72/animatedvaluexy.md b/website/versioned_docs/version-0.72/animatedvaluexy.md index e4d29cce1a0..e8353d333c8 100644 --- a/website/versioned_docs/version-0.72/animatedvaluexy.md +++ b/website/versioned_docs/version-0.72/animatedvaluexy.md @@ -74,9 +74,9 @@ Directly set the value. This will stop any animations running on the value and u **Parameters:** -| Name | Type | Required | Description | -| ----- | ---------------------- | -------- | ----------- | -| value | {x: number; y: number} | Yes | Value | +| Name | Type | Required | Description | +| ----- | ------------------------ | -------- | ----------- | +| value | `{x: number; y: number}` | Yes | Value | --- @@ -90,9 +90,9 @@ Sets an offset that is applied on top of whatever value is set, whether via `set **Parameters:** -| Name | Type | Required | Description | -| ------ | ---------------------- | -------- | ------------ | -| offset | {x: number; y: number} | Yes | Offset value | +| Name | Type | Required | Description | +| ------ | ------------------------ | -------- | ------------ | +| offset | `{x: number; y: number}` | Yes | Offset value | --- diff --git a/website/versioned_docs/version-0.72/button.md b/website/versioned_docs/version-0.72/button.md index a07ba86ca04..bb23ef8618b 100644 --- a/website/versioned_docs/version-0.72/button.md +++ b/website/versioned_docs/version-0.72/button.md @@ -120,9 +120,9 @@ export default App; Handler to be called when the user taps the button. -| Type | -| ----------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) | +| Type | +| ---------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)})` | --- diff --git a/website/versioned_docs/version-0.72/flatlist.md b/website/versioned_docs/version-0.72/flatlist.md index 985b4fbf401..3d9d5b61a8a 100644 --- a/website/versioned_docs/version-0.72/flatlist.md +++ b/website/versioned_docs/version-0.72/flatlist.md @@ -618,9 +618,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ------------------------------------------------------------------------------------------------ | -| (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]} => void; | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]} => void;` | --- diff --git a/website/versioned_docs/version-0.72/image.md b/website/versioned_docs/version-0.72/image.md index 96653484d69..e7ef24d0d27 100644 --- a/website/versioned_docs/version-0.72/image.md +++ b/website/versioned_docs/version-0.72/image.md @@ -244,9 +244,9 @@ Invoked on load error. Invoked on mount and on layout changes. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [LayoutEvent]layoutevent)} => void | +| Type | +| ------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)} => void` | --- @@ -256,9 +256,9 @@ Invoked when load completes successfully. **Example:** `onLoad={({nativeEvent: {source: {width, height}}}) => setImageRealSize({width, height})}` -| Type | -| ------------------------------------------------------------- | -| ({nativeEvent: [ImageLoadEvent]image#imageloadevent)} => void | +| Type | +| ------------------------------------------------------------------- | +| `md ({nativeEvent: [ImageLoadEvent](image#imageloadevent)} => void` | --- diff --git a/website/versioned_docs/version-0.72/javascript-environment.md b/website/versioned_docs/version-0.72/javascript-environment.md index 97e41683a6e..7b3adc05a6d 100644 --- a/website/versioned_docs/version-0.72/javascript-environment.md +++ b/website/versioned_docs/version-0.72/javascript-environment.md @@ -84,25 +84,25 @@ Many standard functions are also available on all the supported JavaScript runti #### Browser -- [CommonJS require](https://nodejs.org/docs/latest/api/modules.html) -- [console.{log, warn, error, info, trace, table, group, 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) +- [CommonJS `require`](https://nodejs.org/docs/latest/api/modules.html) +- `md [console.{log, warn, error, info, trace, table, group, 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) #### ECMAScript 2015 (ES6) -- [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) -- Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)} -- [Object.assign](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) -- String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)} +- [`Array.from`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) +- `md Array.prototype.{[find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [findIndex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)}` +- [`Object.assign`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) +- `md String.prototype.{[startsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith), [endsWith](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith), [repeat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat), [includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)}` #### ECMAScript 2016 (ES7) -- Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes) +- `md Array.prototype.[includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)` #### ECMAScript 2017 (ES8) -- Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)} +- `md Object.{[entries](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries), [values](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)}` #### Specific diff --git a/website/versioned_docs/version-0.72/linking.md b/website/versioned_docs/version-0.72/linking.md index c17b746f7c5..184fbb0fe73 100644 --- a/website/versioned_docs/version-0.72/linking.md +++ b/website/versioned_docs/version-0.72/linking.md @@ -651,7 +651,7 @@ Launch an Android intent with extras. **Parameters:** -| Name | Type | -| ----------------------------------------------------------- | ------------------------------------------------------------ | -| action
Required
| string | -| extras | array of `{key: string, value: string \| number \| boolean}` | +| Name | Type | +| ----------------------------------------------------------- | ---------------------------------------------------------- | +| action
Required
| string | +| extras | `Array<{key: string, value: string ｜ number ｜ boolean}>` | diff --git a/website/versioned_docs/version-0.72/new-architecture-appendix.md b/website/versioned_docs/version-0.72/new-architecture-appendix.md index a305153fe01..5ce74e0e994 100644 --- a/website/versioned_docs/version-0.72/new-architecture-appendix.md +++ b/website/versioned_docs/version-0.72/new-architecture-appendix.md @@ -38,9 +38,9 @@ This is recommended over using plain `Object`, for type safety. **Example:** `{| foo: string, ... |}` -| Nullable Support? | Android (Java) | iOS | -| --------------------------------------------- | -------------- | --- | -| ?{| foo: string, ...|} | - | - | +| Nullable Support? | Android (Java) | iOS | +| ------------------------------------------------------- | -------------- | --- | +| ?{| foo: string, ...|} | - | - | ### `Object` @@ -98,19 +98,19 @@ You may also find it useful to refer to the JavaScript specifications for the co You may use the following table as a reference for which types are supported and what they map to in each platform: -| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | -| ---------------------------------------------- | -------------------------------------------------------- | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | -| `string` | string | null | `String` | `NSString` | | -| `boolean` | boolean | null | `Boolean` | `NSNumber` | | -| `number` | No | `double` | `NSNumber` | | -| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | -| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | -| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | -| `Function` | Function | null | | | | -| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | -| Type aliases of the above | Yes | | | | -| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | -| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | +| TypeScript Type | Nullable Support? | Android (Java) | iOS | Note | +| ------------------------------------------------------- | ------------------------------------------------------------------ | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ | +| `string` | string | null | `String` | `NSString` | | +| `boolean` | boolean | null | `Boolean` | `NSNumber` | | +| `number` | No | `double` | `NSNumber` | | +| {| foo: string, ... |} | {| foo: string, ...|} | null | | | Object literal. This is recommended over simply using Object, for type safety. | +| `Object` | Object | null | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). | +| `Array<*>` | Array<\*> | null | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | | +| `Function` | Function | null | | | | +| `Promise<*>` | Promise<\*> | null | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | | +| Type aliases of the above | Yes | | | | +| Type Unions 'SUCCESS'|'FAIL' | Only as callbacks. | | | Type unions only supported as callbacks. | +| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. | You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository. diff --git a/website/versioned_docs/version-0.72/pressable.md b/website/versioned_docs/version-0.72/pressable.md index 4d960b330b1..761cc7e2fa7 100644 --- a/website/versioned_docs/version-0.72/pressable.md +++ b/website/versioned_docs/version-0.72/pressable.md @@ -165,49 +165,49 @@ Sets additional distance outside of element in which a press can be detected. Called when the hover is activated to provide visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onHoverOut` Called when the hover is deactivated to undo visual feedback. -| Type | -| ---------------------------------------------------------------------------------------------------- | -| ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void | +| Type | +| --------------------------------------------------------------------------------------------------------- | +| `md ({ nativeEvent: [MouseEvent](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent) }) => void` | ### `onLongPress` Called if the time after `onPressIn` lasts longer than 500 milliseconds. This time period can be customized with [`delayLongPress`](#delaylongpress). -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPress` Called after `onPressOut`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPressIn` Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `onPressOut` Called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | ### `pressRetentionOffset` diff --git a/website/versioned_docs/version-0.72/pushnotificationios.md b/website/versioned_docs/version-0.72/pushnotificationios.md index 9cbb9476757..604367ebf9d 100644 --- a/website/versioned_docs/version-0.72/pushnotificationios.md +++ b/website/versioned_docs/version-0.72/pushnotificationios.md @@ -321,7 +321,7 @@ Valid events are: - `notification` : Fired when a remote notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `localNotification` : Fired when a local notification is received. The handler will be invoked with an instance of `PushNotificationIOS`. - `register`: Fired when the user registers for remote notifications. The handler will be invoked with a hex string representing the deviceToken. -- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with {message: string, code: number, details: any}. +- `registrationError`: Fired when the user fails to register for remote notifications. Typically occurs when APNS is having issues, or the device is a simulator. The handler will be invoked with `{message: string, code: number, details: any}`. --- diff --git a/website/versioned_docs/version-0.72/scrollview.md b/website/versioned_docs/version-0.72/scrollview.md index 0244d5f4553..f0034d27344 100644 --- a/website/versioned_docs/version-0.72/scrollview.md +++ b/website/versioned_docs/version-0.72/scrollview.md @@ -205,9 +205,9 @@ const styles = StyleSheet.create({ The amount by which the scroll view content is inset from the edges of the scroll view. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- @@ -373,9 +373,9 @@ Caveat 1: Reordering elements in the scrollview with this enabled will probably Caveat 2: This uses `contentOffset` and `frame.origin` in native code to compute visibility. Occlusion, transforms, and other complexity won't be taken into account as to whether content is "visible" or not. -| Type | -| ---------------------------------------------------------------------- | -| object: {minIndexForVisible: number, autoscrollToTopThreshold: number} | +| Type | +| ------------------------------------------------------------------------ | +| object: `{minIndexForVisible: number, autoscrollToTopThreshold: number}` | --- @@ -591,9 +591,9 @@ This controls how often the scroll event will be fired while scrolling (as a tim The amount by which the scroll view indicators are inset from the edges of the scroll view. This should normally be set to the same value as the `contentInset`. -| Type | Default | -| ------------------------------------------------------------------ | ---------------------------------------- | -| object: {top: number, left: number, bottom: number, right: number} | `{top: 0, left: 0, bottom: 0, right: 0}` | +| Type | Default | +| -------------------------------------------------------------------- | ---------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | `{top: 0, left: 0, bottom: 0, right: 0}` | --- diff --git a/website/versioned_docs/version-0.72/sectionlist.md b/website/versioned_docs/version-0.72/sectionlist.md index 18f9960e900..a14b94e96f2 100644 --- a/website/versioned_docs/version-0.72/sectionlist.md +++ b/website/versioned_docs/version-0.72/sectionlist.md @@ -235,9 +235,9 @@ If provided, a standard RefreshControl will be added for "Pull to Refresh" funct Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ---------------------------------------------------------------------------------------------------------------- | -| (callback: {changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s}) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | --- @@ -267,9 +267,9 @@ This may improve scroll performance for large lists. Rendered at the bottom of each section. -| Type | -| -------------------------------------------------------------------- | -| (info: {section: [Section](sectionlist#section)}) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- @@ -277,9 +277,9 @@ Rendered at the bottom of each section. Rendered at the top of each section. These stick to the top of the `ScrollView` by default on iOS. See `stickySectionHeadersEnabled`. -| Type | -| -------------------------------------------------------------------- | -| (info: {section: [Section](sectionlist#section)}) => element, `null` | +| Type | +| ------------------------------------------------------------------------- | +| `md (info: {section: [Section](sectionlist#section)}) => element ｜ null` | --- diff --git a/website/versioned_docs/version-0.72/shadow-props.md b/website/versioned_docs/version-0.72/shadow-props.md index 812165032fd..a328842b736 100644 --- a/website/versioned_docs/version-0.72/shadow-props.md +++ b/website/versioned_docs/version-0.72/shadow-props.md @@ -228,9 +228,9 @@ This property will only work on Android API 28 and above. For similar functional Sets the drop shadow offset. -| Type | -| -------------------------------------- | -| object: {width: number,height: number} | +| Type | +| ---------------------------------------- | +| object: `{width: number,height: number}` | --- diff --git a/website/versioned_docs/version-0.72/switch.md b/website/versioned_docs/version-0.72/switch.md index 1074e457566..f6cff1444ad 100644 --- a/website/versioned_docs/version-0.72/switch.md +++ b/website/versioned_docs/version-0.72/switch.md @@ -109,9 +109,9 @@ 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). -| Type | -| ------------------------------------------------------------- | -| object: {false: [color](colors.md), true: [color](colors.md)} | +| Type | +| ------------------------------------------------------------ | +| `md object: {false: [color](colors), true: [color](colors)}` | --- diff --git a/website/versioned_docs/version-0.72/text-style-props.md b/website/versioned_docs/version-0.72/text-style-props.md index c671104cd07..07c55b98177 100644 --- a/website/versioned_docs/version-0.72/text-style-props.md +++ b/website/versioned_docs/version-0.72/text-style-props.md @@ -894,9 +894,9 @@ Specifies text alignment. On Android, the value 'justify' is only supported on O ### `textShadowOffset` -| Type | -| ----------------------------------------- | -| object: {width?: number, height?: number} | +| Type | +| ------------------------------------------- | +| object: `{width?: number, height?: number}` | --- diff --git a/website/versioned_docs/version-0.72/text.md b/website/versioned_docs/version-0.72/text.md index 444886a2fb5..c107d1679f6 100644 --- a/website/versioned_docs/version-0.72/text.md +++ b/website/versioned_docs/version-0.72/text.md @@ -485,9 +485,9 @@ This prop is commonly used with `ellipsizeMode`. Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -495,9 +495,9 @@ Invoked on mount and on layout changes. This function is called on long press. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -505,9 +505,9 @@ This function is called on long press. Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -515,9 +515,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to Function called on user press, triggered after `onPressOut`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -525,9 +525,9 @@ Function called on user press, triggered after `onPressOut`. Called immediately when a touch is engaged, before `onPressOut` and `onPress`. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -535,9 +535,9 @@ Called immediately when a touch is engaged, before `onPressOut` and `onPress`. Called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -547,9 +547,9 @@ The View is now responding to touch events. This is the time to highlight and sh On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| ------------------------------------------------------------ | -| ({nativeEvent: [PressEvent](pressevent)}) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -557,9 +557,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -567,9 +567,9 @@ The user is moving their finger. Fired at the end of the touch. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -577,9 +577,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -587,9 +587,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become a responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -597,9 +597,9 @@ Some other `View` wants to become a responder and is asking this `View` to relea If a parent `View` wants to prevent a child `View` from becoming a responder on a touch start, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- diff --git a/website/versioned_docs/version-0.72/textinput.md b/website/versioned_docs/version-0.72/textinput.md index 590ff1f5d83..4b7d0c3b6d5 100644 --- a/website/versioned_docs/version-0.72/textinput.md +++ b/website/versioned_docs/version-0.72/textinput.md @@ -589,9 +589,9 @@ Callback that is called when text input ends. Callback that is called when a touch is engaged. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -599,9 +599,9 @@ Callback that is called when a touch is engaged. Callback that is called when a touch is released. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -609,9 +609,9 @@ Callback that is called when a touch is released. Callback that is called when the text input is focused. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -629,9 +629,9 @@ Callback that is called when a key is pressed. This will be called with object w Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -787,9 +787,9 @@ If `true`, the text input obscures the text entered so that sensitive text like The start and end of the text input's selection. Set start and end to the same value to position the cursor. -| Type | -| ----------------------------------- | -| object: {start: number,end: number} | +| Type | +| ------------------------------------- | +| object: `{start: number,end: number}` | --- diff --git a/website/versioned_docs/version-0.72/touchablewithoutfeedback.md b/website/versioned_docs/version-0.72/touchablewithoutfeedback.md index e5c0c5d88dd..3f081125a37 100644 --- a/website/versioned_docs/version-0.72/touchablewithoutfeedback.md +++ b/website/versioned_docs/version-0.72/touchablewithoutfeedback.md @@ -177,9 +177,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -307,9 +307,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -437,9 +437,9 @@ Invoked when the item receives focus. Invoked on mount and on layout changes. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- diff --git a/website/versioned_docs/version-0.72/transforms.md b/website/versioned_docs/version-0.72/transforms.md index 00200c27dc1..7a885c8a2d0 100644 --- a/website/versioned_docs/version-0.72/transforms.md +++ b/website/versioned_docs/version-0.72/transforms.md @@ -188,9 +188,9 @@ The skew transformations require a string so that the transform may be expressed transform([{skewX: '45deg'}]); ``` -| Type | Required | -| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -| array of objects: {matrix: number[]}, {perspective: number}, {rotate: string}, {rotateX: string}, {rotateY: string}, {rotateZ: string}, {scale: number}, {scaleX: number}, {scaleY: number}, {translateX: number}, {translateY: number}, {skewX: string}, {skewY: string} or string | No | +| Type | Required | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | +| array of objects: `{matrix: number[]}`, `{perspective: number}`, `{rotate: string}`, `{rotateX: string}`, `{rotateY: string}`, `{rotateZ: string}`, `{scale: number}`, `{scaleX: number}`, `{scaleY: number}`, `{translateX: number}`, `{translateY: number}`, `{skewX: string}`, `{skewY: string}` or string | No | --- diff --git a/website/versioned_docs/version-0.72/view.md b/website/versioned_docs/version-0.72/view.md index 298612759a5..2f703015dd2 100644 --- a/website/versioned_docs/version-0.72/view.md +++ b/website/versioned_docs/version-0.72/view.md @@ -176,9 +176,9 @@ Describes the current state of a component to the user of an assistive technolog See the [Accessibility guide](accessibility.md#accessibilitystate-ios-android) for more information. -| Type | -| ---------------------------------------------------------------------------------------------- | -| object: {disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool} | +| Type | +| ------------------------------------------------------------------------------------------------ | +| object: `{disabled: bool, selected: bool, checked: bool or 'mixed', busy: bool, expanded: bool}` | --- @@ -188,9 +188,9 @@ Represents the current value of a component. It can be a textual description of See the [Accessibility guide](accessibility.md#accessibilityvalue-ios-android) for more information. -| Type | -| ------------------------------------------------------------- | -| object: {min: number, max: number, now: number, text: string} | +| Type | +| --------------------------------------------------------------- | +| object: `{min: number, max: number, now: number, text: string}` | --- @@ -391,9 +391,9 @@ For example, if a touchable view has a height of 20 the touchable height can be > The touch area never extends past the parent view bounds and the Z-index of sibling views always takes precedence if a touch hits two overlapping views. -| Type | -| ------------------------------------------------------------------ | -| object: {top: number, left: number, bottom: number, right: number} | +| Type | +| -------------------------------------------------------------------- | +| object: `{top: number, left: number, bottom: number, right: number}` | --- @@ -540,9 +540,9 @@ Invoked on mount and on layout changes. This event is fired immediately once the layout has been calculated, but the new layout may not yet be reflected on the screen at the time the event is received, especially if a layout animation is in progress. -| Type | -| --------------------------------------------------- | -| ({nativeEvent: [LayoutEvent](layoutevent)}) => void | +| Type | +| -------------------------------------------------------- | +| `md ({nativeEvent: [LayoutEvent](layoutevent)}) => void` | --- @@ -560,9 +560,9 @@ When `accessible` is `true`, the system will invoke this function when the user Does this view want to "claim" touch responsiveness? This is called for every touch move on the `View` when it is not the responder. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -570,9 +570,9 @@ Does this view want to "claim" touch responsiveness? This is called for every to If a parent `View` wants to prevent a child `View` from becoming responder on a move, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -582,9 +582,9 @@ The View is now responding for touch events. This is the time to highlight and s On Android, return true from this callback to prevent any other native components from becoming responder until this responder terminates. -| Type | -| ------------------------------------------------------------ | -| ({nativeEvent: [PressEvent](pressevent)}) => void \| boolean | +| Type | +| ----------------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void ｜ boolean` | --- @@ -592,9 +592,9 @@ On Android, return true from this callback to prevent any other native component The user is moving their finger. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -602,9 +602,9 @@ The user is moving their finger. Another responder is already active and will not release it to that `View` asking to be the responder. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -612,9 +612,9 @@ Another responder is already active and will not release it to that `View` askin Fired at the end of the touch. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -622,9 +622,9 @@ Fired at the end of the touch. The responder has been taken from the `View`. Might be taken by other views after a call to `onResponderTerminationRequest`, or might be taken by the OS without asking (e.g., happens with control center/ notification center on iOS) -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -632,9 +632,9 @@ The responder has been taken from the `View`. Might be taken by other views afte Some other `View` wants to become responder and is asking this `View` to release its responder. Returning `true` allows its release. -| Type | -| ------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => void | +| Type | +| ------------------------------------------------------ | +| `md ({nativeEvent: [PressEvent](pressevent)}) => void` | --- @@ -642,9 +642,9 @@ Some other `View` wants to become responder and is asking this `View` to release Does this view want to become responder on the start of a touch? -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- @@ -652,9 +652,9 @@ Does this view want to become responder on the start of a touch? If a parent `View` wants to prevent a child `View` from becoming responder on a touch start, it should have this handler which returns `true`. -| Type | -| ---------------------------------------------------- | -| ({nativeEvent: [PressEvent](pressevent)}) => boolean | +| Type | +| --------------------------------------------------------- | +| `md ({nativeEvent: [PressEvent](pressevent)}) => boolean` | --- diff --git a/website/versioned_docs/version-0.72/virtualizedlist.md b/website/versioned_docs/version-0.72/virtualizedlist.md index ae9f9671b19..c9c95443c29 100644 --- a/website/versioned_docs/version-0.72/virtualizedlist.md +++ b/website/versioned_docs/version-0.72/virtualizedlist.md @@ -423,9 +423,9 @@ The maximum number of items to render in each incremental render batch. The more Called once when the scroll position gets within within `onEndReachedThreshold` from the logical end of the list. -| Type | -| ----------------------------------------- | -| (info: {distanceFromEnd: number}) => void | +| Type | +| ------------------------------------------- | +| `(info: {distanceFromEnd: number}) => void` | --- @@ -475,9 +475,9 @@ Used to handle failures when scrolling to an index that has not been measured ye Called once when the scroll position gets within within `onStartReachedThreshold` from the logical start of the list. -| Type | -| ------------------------------------------- | -| (info: {distanceFromStart: number}) => void | +| Type | +| --------------------------------------------- | +| `(info: {distanceFromStart: number}) => void` | --- @@ -495,9 +495,9 @@ How far from the start (in units of visible length of the list) the leading edge Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop. -| Type | -| ---------------------------------------------------------------------------------------------------------------- | -| (callback: {changed: array of [ViewToken](viewtoken)s, viewableItems: array of [ViewToken](viewtoken)s}) => void | +| Type | +| ----------------------------------------------------------------------------------------------------- | +| `md (callback: {changed: [ViewToken](viewtoken)[], viewableItems: [ViewToken](viewtoken)[]}) => void` | ---