New source found from dndbeyond.com

This commit is contained in:
2026-07-08 01:00:09 -07:00
parent 9a983a6d7b
commit dcefa0d2f2
2865 changed files with 222467 additions and 49053 deletions
+89 -52
View File
@@ -13,8 +13,11 @@ import type {
Navigator,
RelativeRoutingType,
RouteObject,
RouterProps,
RouterProviderProps,
To,
DataStrategyFunction,
PatchRoutesOnNavigationFunction,
} from "react-router";
import {
Router,
@@ -30,15 +33,13 @@ import {
UNSAFE_DataRouterStateContext as DataRouterStateContext,
UNSAFE_NavigationContext as NavigationContext,
UNSAFE_RouteContext as RouteContext,
UNSAFE_logV6DeprecationWarnings as logV6DeprecationWarnings,
UNSAFE_mapRouteProperties as mapRouteProperties,
UNSAFE_useRouteId as useRouteId,
UNSAFE_useRoutesImpl as useRoutesImpl,
} from "react-router";
import type {
BrowserHistory,
unstable_DataStrategyFunction,
unstable_DataStrategyFunctionArgs,
unstable_DataStrategyMatch,
Fetcher,
FormEncType,
FormMethod,
@@ -72,6 +73,7 @@ import type {
ParamKeyValuePair,
URLSearchParamsInit,
SubmitTarget,
FetcherSubmitOptions,
} from "./dom";
import {
createSearchParams,
@@ -86,9 +88,6 @@ import {
////////////////////////////////////////////////////////////////////////////////
export type {
unstable_DataStrategyFunction,
unstable_DataStrategyFunctionArgs,
unstable_DataStrategyMatch,
FormEncType,
FormMethod,
GetScrollRestorationKeyFunction,
@@ -108,6 +107,10 @@ export type {
BlockerFunction,
DataRouteMatch,
DataRouteObject,
DataStrategyFunction,
DataStrategyFunctionArgs,
DataStrategyMatch,
DataStrategyResult,
ErrorResponse,
Fetcher,
FutureConfig,
@@ -130,6 +133,8 @@ export type {
OutletProps,
Params,
ParamParseKey,
PatchRoutesOnNavigationFunction,
PatchRoutesOnNavigationFunctionArgs,
Path,
PathMatch,
Pathname,
@@ -149,7 +154,6 @@ export type {
ShouldRevalidateFunctionArgs,
To,
UIMatch,
unstable_HandlerResult,
} from "react-router";
export {
AbortedDeferredError,
@@ -174,6 +178,7 @@ export {
parsePath,
redirect,
redirectDocument,
replace,
renderMatches,
resolvePath,
useActionData,
@@ -255,7 +260,8 @@ interface DOMRouterOpts {
basename?: string;
future?: Partial<Omit<RouterFutureConfig, "v7_prependBasename">>;
hydrationData?: HydrationState;
unstable_dataStrategy?: unstable_DataStrategyFunction;
dataStrategy?: DataStrategyFunction;
patchRoutesOnNavigation?: PatchRoutesOnNavigationFunction;
window?: Window;
}
@@ -273,7 +279,8 @@ export function createBrowserRouter(
hydrationData: opts?.hydrationData || parseHydrationData(),
routes,
mapRouteProperties,
unstable_dataStrategy: opts?.unstable_dataStrategy,
dataStrategy: opts?.dataStrategy,
patchRoutesOnNavigation: opts?.patchRoutesOnNavigation,
window: opts?.window,
}).initialize();
}
@@ -292,7 +299,8 @@ export function createHashRouter(
hydrationData: opts?.hydrationData || parseHydrationData(),
routes,
mapRouteProperties,
unstable_dataStrategy: opts?.unstable_dataStrategy,
dataStrategy: opts?.dataStrategy,
patchRoutesOnNavigation: opts?.patchRoutesOnNavigation,
window: opts?.window,
}).initialize();
}
@@ -513,16 +521,16 @@ export function RouterProvider({
newState: RouterState,
{
deletedFetchers,
unstable_flushSync: flushSync,
unstable_viewTransitionOpts: viewTransitionOpts,
flushSync: flushSync,
viewTransitionOpts: viewTransitionOpts,
}
) => {
deletedFetchers.forEach((key) => fetcherData.current.delete(key));
newState.fetchers.forEach((fetcher, key) => {
if (fetcher.data !== undefined) {
fetcherData.current.set(key, fetcher.data);
}
});
deletedFetchers.forEach((key) => fetcherData.current.delete(key));
let isViewTransitionUnavailable =
router.window == null ||
@@ -702,6 +710,18 @@ export function RouterProvider({
[router, navigator, basename]
);
let routerFuture = React.useMemo<RouterProps["future"]>(
() => ({
v7_relativeSplatPath: router.future.v7_relativeSplatPath,
}),
[router.future.v7_relativeSplatPath]
);
React.useEffect(
() => logV6DeprecationWarnings(future, router.future),
[future, router.future]
);
// The fragment and {null} here are important! We need them to keep React 18's
// useId happy when we are server-rendering since we may have a <script> here
// containing the hydrated server-side staticContext (from StaticRouterProvider).
@@ -719,12 +739,10 @@ export function RouterProvider({
location={state.location}
navigationType={state.historyAction}
navigator={navigator}
future={{
v7_relativeSplatPath: router.future.v7_relativeSplatPath,
}}
future={routerFuture}
>
{state.initialized || router.future.v7_partialHydration ? (
<DataRoutes
<MemoizedDataRoutes
routes={router.routes}
future={router.future}
state={state}
@@ -742,6 +760,9 @@ export function RouterProvider({
);
}
// Memoize to avoid re-renders when updating `ViewTransitionContext`
const MemoizedDataRoutes = React.memo(DataRoutes);
function DataRoutes({
routes,
future,
@@ -792,6 +813,8 @@ export function BrowserRouter({
React.useLayoutEffect(() => history.listen(setState), [history, setState]);
React.useEffect(() => logV6DeprecationWarnings(future), [future]);
return (
<Router
basename={basename}
@@ -843,6 +866,8 @@ export function HashRouter({
React.useLayoutEffect(() => history.listen(setState), [history, setState]);
React.useEffect(() => logV6DeprecationWarnings(future), [future]);
return (
<Router
basename={basename}
@@ -890,6 +915,8 @@ function HistoryRouter({
React.useLayoutEffect(() => history.listen(setState), [history, setState]);
React.useEffect(() => logV6DeprecationWarnings(future), [future]);
return (
<Router
basename={basename}
@@ -916,7 +943,7 @@ export interface LinkProps
preventScrollReset?: boolean;
relative?: RelativeRoutingType;
to: To;
unstable_viewTransition?: boolean;
viewTransition?: boolean;
}
const isBrowser =
@@ -940,7 +967,7 @@ export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
target,
to,
preventScrollReset,
unstable_viewTransition,
viewTransition,
...rest
},
ref
@@ -990,7 +1017,7 @@ export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
target,
preventScrollReset,
relative,
unstable_viewTransition,
viewTransition,
});
function handleClick(
event: React.MouseEvent<HTMLAnchorElement, MouseEvent>
@@ -1018,7 +1045,7 @@ if (__DEV__) {
Link.displayName = "Link";
}
type NavLinkRenderProps = {
export type NavLinkRenderProps = {
isActive: boolean;
isPending: boolean;
isTransitioning: boolean;
@@ -1047,7 +1074,7 @@ export const NavLink = React.forwardRef<HTMLAnchorElement, NavLinkProps>(
end = false,
style: styleProp,
to,
unstable_viewTransition,
viewTransition,
children,
...rest
},
@@ -1062,7 +1089,7 @@ export const NavLink = React.forwardRef<HTMLAnchorElement, NavLinkProps>(
// Conditional usage is OK here because the usage of a data router is static
// eslint-disable-next-line react-hooks/rules-of-hooks
useViewTransitionState(path) &&
unstable_viewTransition === true;
viewTransition === true;
let toPathname = navigator.encodeLocation
? navigator.encodeLocation(path).pathname
@@ -1146,7 +1173,7 @@ export const NavLink = React.forwardRef<HTMLAnchorElement, NavLinkProps>(
ref={ref}
style={style}
to={to}
unstable_viewTransition={unstable_viewTransition}
viewTransition={viewTransition}
>
{typeof children === "function" ? children(renderProps) : children}
</Link>
@@ -1158,8 +1185,10 @@ if (__DEV__) {
NavLink.displayName = "NavLink";
}
export interface FetcherFormProps
extends React.FormHTMLAttributes<HTMLFormElement> {
/**
* Form props shared by navigations and fetchers
*/
interface SharedFormProps extends React.FormHTMLAttributes<HTMLFormElement> {
/**
* The HTTP verb to use when the form is submit. Supports "get", "post",
* "put", "delete", "patch".
@@ -1200,7 +1229,15 @@ export interface FetcherFormProps
onSubmit?: React.FormEventHandler<HTMLFormElement>;
}
export interface FormProps extends FetcherFormProps {
/**
* Form props available to fetchers
*/
export interface FetcherFormProps extends SharedFormProps {}
/**
* Form props available to navigations
*/
export interface FormProps extends SharedFormProps {
/**
* Indicate a specific fetcherKey to use when using navigate=false
*/
@@ -1231,7 +1268,7 @@ export interface FormProps extends FetcherFormProps {
/**
* Enable view transitions on this Form navigation
*/
unstable_viewTransition?: boolean;
viewTransition?: boolean;
}
type HTMLSubmitEvent = React.BaseSyntheticEvent<
@@ -1261,7 +1298,7 @@ export const Form = React.forwardRef<HTMLFormElement, FormProps>(
onSubmit,
relative,
preventScrollReset,
unstable_viewTransition,
viewTransition,
...props
},
forwardedRef
@@ -1291,7 +1328,7 @@ export const Form = React.forwardRef<HTMLFormElement, FormProps>(
state,
relative,
preventScrollReset,
unstable_viewTransition,
viewTransition,
});
};
@@ -1356,7 +1393,7 @@ enum DataRouterStateHook {
function getDataRouterConsoleError(
hookName: DataRouterHook | DataRouterStateHook
) {
return `${hookName} must be used within a data router. See https://reactrouter.com/routers/picking-a-router.`;
return `${hookName} must be used within a data router. See https://reactrouter.com/v6/routers/picking-a-router.`;
}
function useDataRouterContext(hookName: DataRouterHook) {
@@ -1386,14 +1423,14 @@ export function useLinkClickHandler<E extends Element = HTMLAnchorElement>(
state,
preventScrollReset,
relative,
unstable_viewTransition,
viewTransition,
}: {
target?: React.HTMLAttributeAnchorTarget;
replace?: boolean;
state?: any;
preventScrollReset?: boolean;
relative?: RelativeRoutingType;
unstable_viewTransition?: boolean;
viewTransition?: boolean;
} = {}
): (event: React.MouseEvent<E, MouseEvent>) => void {
let navigate = useNavigate();
@@ -1417,7 +1454,7 @@ export function useLinkClickHandler<E extends Element = HTMLAnchorElement>(
state,
preventScrollReset,
relative,
unstable_viewTransition,
viewTransition,
});
}
},
@@ -1431,7 +1468,7 @@ export function useLinkClickHandler<E extends Element = HTMLAnchorElement>(
to,
preventScrollReset,
relative,
unstable_viewTransition,
viewTransition,
]
);
}
@@ -1448,11 +1485,7 @@ export function useSearchParams(
`You cannot use the \`useSearchParams\` hook in a browser that does not ` +
`support the URLSearchParams API. If you need to support Internet ` +
`Explorer 11, we recommend you load a polyfill such as ` +
`https://github.com/ungap/url-search-params\n\n` +
`If you're unsure how to load polyfills, we recommend you check out ` +
`https://polyfill.io/v3/ which provides some recommendations about how ` +
`to load polyfills only for users that need them, instead of for every ` +
`user.`
`https://github.com/ungap/url-search-params.`
);
let defaultSearchParamsRef = React.useRef(createSearchParams(defaultInit));
@@ -1523,7 +1556,7 @@ export interface FetcherSubmitFunction {
(
target: SubmitTarget,
// Fetchers cannot replace or set state because they are not navigation events
options?: Omit<SubmitOptions, "replace" | "state">
options?: FetcherSubmitOptions
): void;
}
@@ -1565,7 +1598,7 @@ export function useSubmit(): SubmitFunction {
body,
formMethod: options.method || (method as HTMLFormMethod),
formEncType: options.encType || (encType as FormEncType),
unstable_flushSync: options.unstable_flushSync,
flushSync: options.flushSync,
});
} else {
router.navigate(options.action || action, {
@@ -1577,8 +1610,8 @@ export function useSubmit(): SubmitFunction {
replace: options.replace,
state: options.state,
fromRouteId: currentRouteId,
unstable_flushSync: options.unstable_flushSync,
unstable_viewTransition: options.unstable_viewTransition,
flushSync: options.flushSync,
viewTransition: options.viewTransition,
});
}
},
@@ -1614,9 +1647,13 @@ export function useFormAction(
// since it might not apply to our contextual route. We add it back based
// on match.route.index below
let params = new URLSearchParams(path.search);
if (params.has("index") && params.get("index") === "") {
let indexValues = params.getAll("index");
let hasNakedIndexParam = indexValues.some((v) => v === "");
if (hasNakedIndexParam) {
params.delete("index");
path.search = params.toString() ? `?${params.toString()}` : "";
indexValues.filter((v) => v).forEach((v) => params.append("index", v));
let qs = params.toString();
path.search = qs ? `?${qs}` : "";
}
}
@@ -1643,7 +1680,7 @@ export type FetcherWithComponents<TData> = Fetcher<TData> & {
FetcherFormProps & React.RefAttributes<HTMLFormElement>
>;
submit: FetcherSubmitFunction;
load: (href: string, opts?: { unstable_flushSync?: boolean }) => void;
load: (href: string, opts?: { flushSync?: boolean }) => void;
};
// TODO: (v7) Change the useFetcher generic default from `any` to `unknown`
@@ -1693,7 +1730,7 @@ export function useFetcher<TData = any>({
// Fetcher additions
let load = React.useCallback(
(href: string, opts?: { unstable_flushSync?: boolean }) => {
(href: string, opts?: { flushSync?: boolean }) => {
invariant(routeId, "No routeId available for fetcher.load()");
router.fetch(fetcherKey, routeId, href, opts);
},
@@ -1986,7 +2023,7 @@ function useViewTransitionState(
invariant(
vtContext != null,
"`unstable_useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`. " +
"`useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`. " +
"Did you accidentally import `RouterProvider` from `react-router`?"
);
@@ -2009,11 +2046,11 @@ function useViewTransitionState(
// destination. This ensures that other PUSH navigations that reverse
// an indicated transition apply. I.e., on the list view you have:
//
// <NavLink to="/details/1" unstable_viewTransition>
// <NavLink to="/details/1" viewTransition>
//
// If you click the breadcrumb back to the list view:
//
// <NavLink to="/list" unstable_viewTransition>
// <NavLink to="/list" viewTransition>
//
// We should apply the transition because it's indicated as active going
// from /list -> /details/1 and therefore should be active on the reverse
@@ -2024,6 +2061,6 @@ function useViewTransitionState(
);
}
export { useViewTransitionState as unstable_useViewTransitionState };
export { useViewTransitionState as useViewTransitionState };
//#endregion