diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md index 3cf06ed3..6ac093fa 100644 --- a/.github/CONTRIBUTING.md +++ b/.github/CONTRIBUTING.md @@ -71,7 +71,7 @@ yarn compile --watch To run the documentation website: ``` -yarn docs:dev +yarn docs ``` ## Examples @@ -79,7 +79,7 @@ yarn docs:dev To run the examples app: ``` -yarn examples:dev +yarn examples ``` When you're also making changes to the 'react-native-web' source files, run this command in another process: @@ -93,7 +93,7 @@ yarn compile --watch To run the benchmarks locally: ``` -yarn benchmarks:dev +yarn benchmarks open ./packages/benchmarks/dist/index.html ``` diff --git a/packages/docs/src/includes/fragments/footer.html b/packages/docs/src/includes/fragments/footer.html index b89c91f5..f9a824c9 100644 --- a/packages/docs/src/includes/fragments/footer.html +++ b/packages/docs/src/includes/fragments/footer.html @@ -6,7 +6,7 @@ {% endif %}
- {{ site.name }} – + {{ site.name }} – {% if site.footer %} {{ site.footer | safe }} {% endif %} diff --git a/packages/docs/src/includes/layouts/page.html b/packages/docs/src/includes/layouts/page.html index d83beade..710721d4 100644 --- a/packages/docs/src/includes/layouts/page.html +++ b/packages/docs/src/includes/layouts/page.html @@ -27,7 +27,7 @@ section: page
Updated
{% if site.enableEditButton == true %} - Edit + Edit {% endif %}
{% include "fragments/footer.html" %} diff --git a/packages/docs/src/pages/docs/components/image.md b/packages/docs/src/pages/docs/components/image.md index 80aeb2f2..7c413716 100644 --- a/packages/docs/src/pages/docs/components/image.md +++ b/packages/docs/src/pages/docs/components/image.md @@ -60,7 +60,7 @@ Called when the image loading starts. {% endcall %} {% call macro.prop('resizeMode', '?("center" | "cover" | "contain" | "none" | "stretch") = "cover"') %} -The image source. The string can be a path to an external resource or a base64 encoded resource. +Determines how the image source is resized to fit the layout of the image element. {% endcall %} {% call macro.prop('source', '?(string | Source)') %} diff --git a/packages/docs/src/pages/docs/components/touchables.md b/packages/docs/src/pages/docs/components/touchables.md index c219c2dc..0d304585 100644 --- a/packages/docs/src/pages/docs/components/touchables.md +++ b/packages/docs/src/pages/docs/components/touchables.md @@ -21,5 +21,5 @@ Please refer to the React Native documentation below: * [TouchableWithoutFeedback](https://reactnative.dev/docs/touchablewithoutfeedback) :::callout -**Did you know?** The [Pressable]({{ '/docs/pressable' }}) component is a more accessible, flexible, and future-proof way to handle tap and click interactions with React Native. +**Did you know?** The [Pressable]({{ '/docs/pressable' | url }}) component is a more accessible, flexible, and future-proof way to handle tap and click interactions with React Native. ::: diff --git a/packages/docs/src/pages/docs/concepts/interactions.md b/packages/docs/src/pages/docs/concepts/interactions.md index a469d342..beb432b7 100644 --- a/packages/docs/src/pages/docs/concepts/interactions.md +++ b/packages/docs/src/pages/docs/concepts/interactions.md @@ -85,7 +85,7 @@ NOTE: For historical reasons (originating from React Native), mouse interactions A view can become the responder by using the negotiation callbacks. During the capture phase the deepest node is called last. During the bubble phase the deepest node is called first. The capture phase should be used when a view wants to prevent a descendant from becoming the responder. The first view to return `true` from any of the `on*ShouldSetResponderCapture` / `on*ShouldSetResponder` callbacks will either become the responder or enter into negotiation with the existing responder. -N.B. If `stopPropagation` is called on the event for any of the negotiation callbakcs, it only stops further negotiation within the Responder System. It will not stop the propagation of the native event (which has already bubbled to the `document` by this time.) +N.B. If `stopPropagation` is called on the event for any of the negotiation callbacks, it only stops further negotiation within the Responder System. It will not stop the propagation of the native event (which has already bubbled to the `document` by this time.) {% call macro.prop('onStartShouldSetResponder', '?(event: ResponderEvent) => boolean') %} On `pointerdown`, should this view attempt to become the responder? If the view is not the responder, this callback may be called for every pointer start on the view. diff --git a/packages/docs/src/pages/docs/getting-started/installation.md b/packages/docs/src/pages/docs/getting-started/installation.md index 5a32523d..4cb71d48 100644 --- a/packages/docs/src/pages/docs/getting-started/installation.md +++ b/packages/docs/src/pages/docs/getting-started/installation.md @@ -30,7 +30,7 @@ npm install --save-dev babel-plugin-react-native-web ### Expo -[Expo](https://expo.io) is a framework and a platform for universal React applications. [Expo for Web](https://docs.expo.io/workflow/web/) uses React Native for Web, provides dozens of additional cross-platform APIs, includes web build optimizations, and is compatibile with the broder React Native ecosystem. +[Expo](https://expo.io) is a framework and a platform for universal React applications. [Expo for Web](https://docs.expo.io/workflow/web/) uses React Native for Web, provides dozens of additional cross-platform APIs, includes web build optimizations, and is compatibile with the broader React Native ecosystem. ```shell npx expo-cli init my-app diff --git a/packages/examples/pages/app-state/index.js b/packages/examples/pages/app-state/index.js index f2df7f3b..8185a496 100644 --- a/packages/examples/pages/app-state/index.js +++ b/packages/examples/pages/app-state/index.js @@ -3,10 +3,11 @@ import { AppState, Text } from 'react-native'; import Example from '../../shared/example'; export default function AppStatePage() { + const appState = React.useRef(AppState.currentState); const [state, setState] = React.useState({ active: 0, background: 0, - currentState: AppState.currentState + currentState: appState.current }); React.useEffect(() => {