diff --git a/.changeset/rotten-grapes-cough.md b/.changeset/rotten-grapes-cough.md new file mode 100644 index 0000000000..9b5da8b557 --- /dev/null +++ b/.changeset/rotten-grapes-cough.md @@ -0,0 +1,7 @@ +--- +"react-router": minor +--- + +Stabilize `fetcher.reset()` + +- ⚠️ This is a breaking change if you have begun using `fetcher.unstable_reset()` diff --git a/packages/react-router/__tests__/dom/data-browser-router-test.tsx b/packages/react-router/__tests__/dom/data-browser-router-test.tsx index 9648e1f2aa..f779ba1248 100644 --- a/packages/react-router/__tests__/dom/data-browser-router-test.tsx +++ b/packages/react-router/__tests__/dom/data-browser-router-test.tsx @@ -5567,9 +5567,7 @@ function testDomRouter( <>

{`${fetcher.state}-${fetcher.data}`}

- + ); }, diff --git a/packages/react-router/lib/dom/lib.tsx b/packages/react-router/lib/dom/lib.tsx index 61ee05cf4b..54b87d058b 100644 --- a/packages/react-router/lib/dom/lib.tsx +++ b/packages/react-router/lib/dom/lib.tsx @@ -2820,7 +2820,7 @@ export type FetcherWithComponents = Fetcher & { * @param reason Optional `reason` to provide to [`AbortController.abort()`](https://developer.mozilla.org/en-US/docs/Web/API/AbortController/abort) * @returns void */ - unstable_reset: (opts?: { reason?: unknown }) => void; + reset: (opts?: { reason?: unknown }) => void; /** * Submits form data to a route. While multiple nested routes can match a URL, only the leaf route will be called. @@ -2911,7 +2911,7 @@ export type FetcherWithComponents = Fetcher & { * }) * * // reset fetcher - * fetcher.unstable_reset() + * fetcher.reset() * } * * @public @@ -2995,9 +2995,10 @@ export function useFetcher({ [fetcherKey, submitImpl], ); - let unstable_reset = React.useCallback< - FetcherWithComponents["unstable_reset"] - >((opts) => resetFetcher(fetcherKey, opts), [resetFetcher, fetcherKey]); + let reset = React.useCallback["reset"]>( + (opts) => resetFetcher(fetcherKey, opts), + [resetFetcher, fetcherKey], + ); let FetcherForm = React.useMemo(() => { let FetcherForm = React.forwardRef( @@ -3019,11 +3020,11 @@ export function useFetcher({ Form: FetcherForm, submit, load, - unstable_reset, + reset, ...fetcher, data, }), - [FetcherForm, submit, load, unstable_reset, fetcher, data], + [FetcherForm, submit, load, reset, fetcher, data], ); return fetcherWithComponents;