docs(hooks): fix grammar + typos (#10653)

Author: MichaelDeBoey

docs/hooks/use-action-data.md

@@ -5,7 +5,7 @@ toc: false
 
 # `useActionData`
 
-Returns the serialized data from the most recent route [action][action] or `undefined` if there isn't one. This hook only returns action data from the route in context - it can not access data from other parent or child routes.
+Returns the serialized data from the most recent route [action][action] or `undefined` if there isn't one. This hook only returns action data from the route in context — it cannot access data from other parent or child routes.
 
 ```tsx lines=[10,14]
 import type { ActionFunctionArgs } from "@remix-run/node"; // or cloudflare/deno

docs/hooks/use-before-unload.md

@@ -7,7 +7,7 @@ toc: false
 
 This hook is just a helper around [`window.beforeunload`][window_before_unload].
 
-When users click links to pages they haven't visited yet, Remix loads the code-split modules for that page. If you deploy in the middle of a user's session, and you or your host removes the old files from the server (many do 😭), then Remix's requests for those modules will fail. Remix recovers by automatically reloading the browser at the new URL. This should start over from the server with the latest version of your application. Most of the time this works out great, and user doesn't even know anything happened.
+When users click links to pages they haven't visited yet, Remix loads the code-split modules for that page. If you deploy in the middle of a user's session, and you or your host removes the old files from the server (many do 😭), then Remix's requests for those modules will fail. Remix recovers by automatically reloading the browser at the new URL. This should start over from the server with the latest version of your application. Most of the time this works out great, and the user doesn't even know anything happened.
 
 In this situation, you may need to save important application state on the page (to something like the browser's local storage), because the automatic page reload will lose any state you had.
 

docs/hooks/use-blocker.md

@@ -7,11 +7,11 @@ title: useBlocker
 The `useBlocker` hook allows you to prevent the user from navigating away from the current location, and present them with a custom UI to allow them to confirm the navigation.
 
 <docs-info>
-This only works for client-side navigations within your React Router application and will not block document requests. To prevent document navigations you will need to add your own <a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event" target="_blank">`beforeunload`</a> event handler.
+This only works for client-side navigations within your React Router application and will not block document requests. To prevent document navigations, you will need to add your own <a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event" target="_blank">`beforeunload`</a> event handler.
 </docs-info>
 
 <docs-warning>
-Blocking a user from navigating is a bit of an anti-pattern, so please carefully consider any usage of this hook and use it sparingly. In the de-facto use case of preventing a user navigating away from a half-filled form, you might consider persisting unsaved state to `sessionStorage` and automatically re-filling it if they return instead of blocking them from navigating away.
+Blocking a user from navigating is a bit of an antipattern, so please carefully consider any usage of this hook and use it sparingly. In the de-facto use case of preventing a user navigating away from a half-filled form, you might consider persisting unsaved state to `sessionStorage` and automatically re-filling it if they return instead of blocking them from navigating away.
 </docs-warning>
 
 ```tsx
@@ -77,6 +77,6 @@ When in a `blocked` state, you may call `blocker.proceed()` to proceed to the bl
 
 ### `reset()`
 
-When in a `blocked` state, you may call `blocker.reset()` to return the blocker back to an `unblocked` state and leave the user at the current location.
+When in a `blocked` state, you may call `blocker.reset()` to return the blocker to an `unblocked` state and leave the user at the current location.
 
 [example]: https://github.com/remix-run/react-router/tree/main/examples/navigation-blocking

docs/hooks/use-fetcher.md

@@ -112,7 +112,7 @@ fetcher.submit(
 
 Loads data from a route loader. While multiple nested routes can match a URL, only the leaf route will be called.
 
-Note that when calling `load` on an index route's loader, you must include an [`?index` query param][index-query-param] in order to disambiguate between the `index.tsx` layout and the `root.tsx` route.
+Note that when calling `load` on an index route's loader, you must include an [`?index` query param][index-query-param] to disambiguate between the `index.tsx` layout and the `root.tsx` route.
 
 ```ts
 fetcher.load("/some/route");
@@ -133,9 +133,9 @@ The `flushSync` option tells React Router DOM to wrap the initial state update f
 
 You can know the state of the fetcher with `fetcher.state`. It will be one of:
 
-- **idle** - Nothing is being fetched.
-- **submitting** - A form has been submitted. If the method is `GET`, then the route `loader` is being called. If `DELETE`, `PATCH`, `POST`, or `PUT`, then the route `action` is being called.
-- **loading** - The loaders for the routes are being reloaded after an `action` submission.
+- **idle** — Nothing is being fetched.
+- **submitting** — A form has been submitted. If the method is `GET`, then the route `loader` is being called. If `DELETE`, `PATCH`, `POST`, or `PUT`, then the route `action` is being called.
+- **loading** — The loaders for the routes are being reloaded after an `action` submission.
 
 ### `fetcher.data`
 

docs/hooks/use-fetchers.md

@@ -5,7 +5,7 @@ toc: false
 
 # `useFetchers`
 
-Returns an array of all in-flight fetchers. This is useful for components throughout the app that didn't create the fetchers but want to use their submissions to participate in optimistic UI.
+Returns an array of all in-flight fetchers. This is useful for components throughout the app that didn't create the fetchers but want to use their submissions to participate in an optimistic UI.
 
 ```tsx
 import { useFetchers } from "@remix-run/react";

docs/hooks/use-form-action.md

@@ -34,7 +34,7 @@ Optional. The action to append to the closest route URL.
 
 The only option is `{ relative: "route" | "path"}`.
 
-- **route** default - relative to the route hierarchy, not the URL
-- **path** - makes the action relative to the URL paths, so `..` will remove one URL segment.
+- **route** default — relative to the route hierarchy, not the URL
+- **path** — makes the action relative to the URL paths, so `..` will remove one URL segment.
 
 [form_component]: ../components/form

docs/hooks/use-href.md

@@ -32,8 +32,8 @@ Optional. The path to append to the resolved URL.
 
 The only option is `{ relative: "route" | "path"}`, which defines the behavior when resolving relative URLs.
 
-- **route** default - relative to the route hierarchy, not the URL
-- **path** - makes the action relative to the URL paths, so `..` will remove one URL segment.
+- **route** default — relative to the route hierarchy, not the URL
+- **path** — makes the action relative to the URL paths, so `..` will remove one URL segment.
 
 [anchor_element_href_attribute]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#href
 [anchor_element]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link

docs/hooks/use-navigate.md

@@ -78,13 +78,13 @@ navigate(".", {
 });
 ```
 
-- **replace**: boolean - replace the current entry in the history stack instead of pushing a new one
-- **relative**: `"route" | "path"` - defines the relative path behavior for the link
+- **replace**: boolean — replace the current entry in the history stack instead of pushing a new one
+- **relative**: `"route" | "path"` — defines the relative path behavior for the link
   - `"route"` will use the route hierarchy so `".."` will remove all URL segments of the current route pattern while `"path"` will use the URL path so `".."` will remove one URL segment
-- **state**: any - adds persistent client side routing state to the next location
+- **state**: any — adds persistent client side routing state to the next location
 - **preventScrollReset**: boolean - if you are using [`<ScrollRestoration>`][scroll-restoration], prevent the scroll position from being reset to the top of the window when navigating
-- **flushSync**: boolean - wraps the initial state update for this navigation in a [`ReactDOM.flushSync`][flush-sync] call instead of the default [`React.startTransition`][start-transition]
-- **viewTransition**: boolean - enables a [View Transition][view-transitions] for this navigation by wrapping the final state update in `document.startViewTransition()`
+- **flushSync**: boolean — wraps the initial state update for this navigation in a [`ReactDOM.flushSync`][flush-sync] call instead of the default [`React.startTransition`][start-transition]
+- **viewTransition**: boolean — enables a [View Transition][view-transitions] for this navigation by wrapping the final state update in `document.startViewTransition()`
   - If you need to apply specific styles for this view transition, you will also need to leverage the [`useViewTransitionState()`][use-view-transition-state]
 
 [redirect]: ../utils/redirect

docs/hooks/use-navigation-type.md

@@ -18,7 +18,7 @@ function SomeComponent() {
 ## Return Values
 
 - **PUSH**: The user came to the current page via a push action on the history stack: clicking a link or submitting a form, etc.
-- **REPLACE**: The user came to the current page via a replace action on the history stack: clicking a link with `<Link replace>`, submitting a form with `<Form replace>` or calling `navigate(to, { replace: true })`, etc.
+- **REPLACE**: The user came to the current page via a `replace` action on the history stack: clicking a link with `<Link replace>`, submitting a form with `<Form replace>` or calling `navigate(to, { replace: true })`, etc.
 - **POP**: The user came to the current page via a pop action on the history stack: clicking the back or forward button, calling `navigate(-1)` or `navigate(1)`, etc.
 
 ## Additional Resources

docs/hooks/use-navigation.md

@@ -62,9 +62,9 @@ This tells you what the next location is going to be.
 
 ### `navigation.state`
 
-- **idle** - There is no navigation pending.
-- **submitting** - A route action is being called due to a form submission using POST, PUT, PATCH, or DELETE
-- **loading** - The loaders for the next routes are being called to render the next page
+- **idle** — There is no navigation pending.
+- **submitting** — A route action is being called due to a form submission using POST, PUT, PATCH, or DELETE
+- **loading** — The loaders for the next routes are being called to render the next page
 
 Normal navigations and GET form submissions transition through these states: