mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2025-10-16 12:05:41 +00:00
6f7d6c01da
* no-op: Run prettier --write on react-router-dom. * Allow correct "ref" to be passed Link. "ref" can be used rather than "innerRef" to return a ref to the <a> element inside of <Link>. See: [1]: reacttraining.com/react-router/web/api/Link/innerref-function Where it says: > As of React Router 5.1, if you are using React 16 you should not > need this prop because we forward this ref to the underlying <a>. > Use a normal ref instead.Allows access to the underlying ref of the > component. [2]: https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/modules/Link.js#L74-L121 Link is the result of forwardRef rather than an actual React class. This implies a few things: 1. It is a function (see the return type of React.ForwardRefExoticComponent) rather than a class 2. Its reference is to an inner <a> element, rather than what's in React.Component, which is a Ref to the element itself. This introduces a potential incompatibility where users can't use "new Link" anymore. But that reflects reality (Link is callable not newable). Since Link was previously exported as a class, we need to continue to support it being used as both a type and a value. Since Link was exported as a generic, we need to continue to support that. As a result: 1. Link is exported as a function that happens to implement the type corresponding to the result of `forwardRef<HTMLAnchorElement, LinkProps<S>>`. 2. Link is still exported as a type (interface) which is the same as that of the return value of `forwardRef<...>`. * Make sure Link<S> can be used as a generic. This is is only supported in TS >= 2.9. I bumped the minimum TS supported version to 2.9 since 2.8 support ends this month anyway. * Apply prettier --write to tests. * Apply same change (forwardRef) to NavLink. 1. https://reacttraining.com/react-router/web/api/NavLink NavLink is a version of <Link> with the same props. 2. NavLink is similarly implemented in terms of forwardRef, so all the justification from the previous commit applies. See: https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/modules/NavLink.js * To maintain TS 2.8 compatibility, use React.createElement to test Link<{foo:number}> and NavLink. When TS 2.8 compatibility is no longer needed, this CL can be reverted as-is.
86 lines
3.1 KiB
TypeScript
86 lines
3.1 KiB
TypeScript
// Type definitions for React Router 5.1
|
|
// Project: https://github.com/ReactTraining/react-router
|
|
// Definitions by: Huy Nguyen <https://github.com/huy-nguyen>
|
|
// Philip Jackson <https://github.com/p-jackson>
|
|
// John Reilly <https://github.com/johnnyreilly>
|
|
// Sebastian Silbermann <https://github.com/eps1lon>
|
|
// Daniel Nixon <https://github.com/danielnixon>
|
|
// Tony Ward <https://github.com/ynotdraw>
|
|
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
|
// TypeScript Version: 2.8
|
|
|
|
import { match } from 'react-router';
|
|
import * as React from 'react';
|
|
import * as H from 'history';
|
|
|
|
export {
|
|
generatePath,
|
|
Prompt,
|
|
MemoryRouter,
|
|
RedirectProps,
|
|
Redirect,
|
|
RouteChildrenProps,
|
|
RouteComponentProps,
|
|
RouteProps,
|
|
Route,
|
|
Router,
|
|
StaticRouter,
|
|
SwitchProps,
|
|
Switch,
|
|
match,
|
|
matchPath,
|
|
withRouter,
|
|
RouterChildContext,
|
|
useHistory,
|
|
useLocation,
|
|
useParams,
|
|
useRouteMatch,
|
|
} from 'react-router';
|
|
|
|
export interface BrowserRouterProps {
|
|
basename?: string;
|
|
getUserConfirmation?: (message: string, callback: (ok: boolean) => void) => void;
|
|
forceRefresh?: boolean;
|
|
keyLength?: number;
|
|
}
|
|
export class BrowserRouter extends React.Component<BrowserRouterProps, any> {}
|
|
|
|
export interface HashRouterProps {
|
|
basename?: string;
|
|
getUserConfirmation?: (message: string, callback: (ok: boolean) => void) => void;
|
|
hashType?: 'slash' | 'noslash' | 'hashbang';
|
|
}
|
|
export class HashRouter extends React.Component<HashRouterProps, any> {}
|
|
|
|
export interface LinkProps<S = H.LocationState> extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
component?: React.ComponentType<any>;
|
|
to: H.LocationDescriptor<S> | ((location: H.Location<S>) => H.LocationDescriptor<S>);
|
|
replace?: boolean;
|
|
innerRef?: React.Ref<HTMLAnchorElement>;
|
|
}
|
|
export function Link<S = H.LocationState>(
|
|
// TODO: Define this as ...params: Parameters<Link<S>> when only TypeScript >= 3.1 support is needed.
|
|
props: React.PropsWithoutRef<LinkProps<S>> & React.RefAttributes<HTMLAnchorElement>,
|
|
): ReturnType<Link<S>>;
|
|
export interface Link<S = H.LocationState>
|
|
extends React.ForwardRefExoticComponent<
|
|
React.PropsWithoutRef<LinkProps<S>> & React.RefAttributes<HTMLAnchorElement>
|
|
> {}
|
|
|
|
export interface NavLinkProps<S = H.LocationState> extends LinkProps<S> {
|
|
activeClassName?: string;
|
|
activeStyle?: React.CSSProperties;
|
|
exact?: boolean;
|
|
strict?: boolean;
|
|
isActive?<Params extends { [K in keyof Params]?: string }>(match: match<Params>, location: H.Location<S>): boolean;
|
|
location?: H.Location<S>;
|
|
}
|
|
export function NavLink<S = H.LocationState>(
|
|
// TODO: Define this as ...params: Parameters<NavLink<S>> when only TypeScript >= 3.1 support is needed.
|
|
props: React.PropsWithoutRef<NavLinkProps<S>> & React.RefAttributes<HTMLAnchorElement>,
|
|
): ReturnType<NavLink<S>>;
|
|
export interface NavLink<S = H.LocationState>
|
|
extends React.ForwardRefExoticComponent<
|
|
React.PropsWithoutRef<NavLinkProps<S>> & React.RefAttributes<HTMLAnchorElement>
|
|
> {}
|