From 86bbeb0727634a4167760128de57790a5ccb1d2a Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Tue, 29 Sep 2015 20:54:55 +0300 Subject: [PATCH 01/13] Update react-router 0.13.3 -> 1.0.0-rc1 --- react-router/history.d.ts | 152 ++++++++ react-router/react-router-test.ts | 425 ---------------------- react-router/react-router.d.ts | 570 ++++++++++++++---------------- 3 files changed, 423 insertions(+), 724 deletions(-) create mode 100644 react-router/history.d.ts delete mode 100644 react-router/react-router-test.ts diff --git a/react-router/history.d.ts b/react-router/history.d.ts new file mode 100644 index 000000000..ede3d719c --- /dev/null +++ b/react-router/history.d.ts @@ -0,0 +1,152 @@ +// Type definitions for history v1.11.1 +// Project: https://github.com/rackt/history +// Definitions by: Sergey Buturlakin +// Definitions: https://github.com/borisyankov/DefinitelyTyped + + +declare namespace HistoryModule { + + // types based on https://github.com/rackt/history/blob/master/docs/Terms.md + + type Action = string + + type BeforeUnloadHook = () => string + + type CreateHistory = (options: HistoryOptions) => History + + type CreateHistoryEnhancer = (createHistory: CreateHistory) => CreateHistory + + interface History { + listenBefore: (hook: TransitionHook) => Function + listen: (listener: LocationListener) => Function + transitionTo(location: Location): void + pushState(state: LocationState, path: Path): void + replaceState(state: LocationState, path: Path): void + setState(state: LocationState): void + go(n: number): void + goBack(): void + goForward(): void + createKey(): LocationKey + createPath(path: Path): Path + createHref(path: Path): Href + } + + type HistoryOptions = Object + + type Href = string + + type Location = { + pathname: Pathname + search: QueryString + query: Query + state: LocationState + action: Action + key: LocationKey + } + + type LocationKey = string + + type LocationListener = (location: Location) => void + + type LocationState = Object + + type Path = string // Pathname + QueryString + + type Pathname = string + + type QueryString = string + + type Query = Object + + type TransitionHook = (location: Location, callback: Function) => any + +} + + +declare module "history/lib/createBrowserHistory" { + + export default function createBrowserHistory(): HistoryModule.History + +} + + +declare module "history/lib/createHashHistory" { + + export default function createHashHistory(): HistoryModule.History + +} + + +declare module "history/lib/createMemoryHistory" { + + export default function createMemoryHistory(): HistoryModule.History + +} + + +declare module "history/lib/createLocation" { + + export default function createLocation(): HistoryModule.Location + +} + + +declare module "history/lib/useBasename" { + + export default function useBasename(enhancer: HistoryModule.CreateHistoryEnhancer): HistoryModule.CreateHistory + +} + + +declare module "history/lib/useBeforeUnload" { + + export default function useBeforeUnload(enhancer: HistoryModule.CreateHistoryEnhancer): HistoryModule.CreateHistory + +} + + +declare module "history/lib/useQueries" { + + export default function useQueries(enhancer: HistoryModule.CreateHistoryEnhancer): HistoryModule.CreateHistory + +} + + +declare module "history/lib/actions" { + + export const PUSH: string + + export const REPLACE: string + + export const POP: string + + export default { + PUSH, + REPLACE, + POP + } + +} + + +declare module "history" { + + export { default as createHistory } from "history/lib/createBrowserHistory" + + export { default as createHashHistory } from "history/lib/createHashHistory" + + export { default as createMemoryHistory } from "history/lib/createMemoryHistory" + + export { default as createLocation } from "history/lib/createLocation" + + export { default as useBasename } from "history/lib/useBasename" + + export { default as useBeforeUnload } from "history/lib/useBeforeUnload" + + export { default as useQueries } from "history/lib/useQueries" + + import * as Actions from "history/lib/actions" + + export { Actions } + +} diff --git a/react-router/react-router-test.ts b/react-router/react-router-test.ts deleted file mode 100644 index 115c8b77f..000000000 --- a/react-router/react-router-test.ts +++ /dev/null @@ -1,425 +0,0 @@ -/// -"use strict"; - -import React = require('react'); -import ReactAddons = require('react/addons'); -import Router = require('react-router'); - -// Mixin -class NavigationTest { - v: T; - - makePath() { - var v1: string = this.v.makePath('to'); - var v2: string = this.v.makePath('to', {id: 1}); - var v3: string = this.v.makePath('to', {id: 1}, {type: 'json'}); - } - makeHref() { - var v1: string = this.v.makeHref('to'); - var v2: string = this.v.makeHref('to', {id: 1}); - var v3: string = this.v.makeHref('to', {id: 1}, {type: 'json'}); - } - transitionTo() { - var v1: void = this.v.transitionTo('to'); - var v2: void = this.v.transitionTo('to', {id: 1}); - var v3: void = this.v.transitionTo('to', {id: 1}, {type: 'json'}); - } - replaceWith() { - var v1: void = this.v.replaceWith('to'); - var v2: void = this.v.replaceWith('to', {id: 1}); - var v3: void = this.v.replaceWith('to', {id: 1}, {type: 'json'}); - } - goBack() { - var v1: void = this.v.goBack(); - } -} - -class StateTest { - v: T; - - getPath() { - var v1: string = this.v.getPath(); - } - - getRoutes() { - var v1: Router.Route[] = this.v.getRoutes(); - } - - getPathname() { - var v1: string = this.v.getPathname(); - } - - getParams() { - var v1: {} = this.v.getParams(); - } - - getQuery() { - var v1: {} = this.v.getQuery(); - } - - isActive() { - var v1: boolean = this.v.isActive('to'); - var v2: boolean = this.v.isActive('to', {id: 1}); - var v3: boolean = this.v.isActive('to', {id: 1}, {type: 'json'}); - } -} - - -// Location -class LocationTest { - v: T; - - push() { - var v1: void = this.v.push('path/to/hoge'); - } - - replace() { - var v1: void = this.v.replace('path/to/hoge'); - } - - pop() { - var v1: void = this.v.pop(); - } - - getCurrentPath() { - var v1: void = this.v.getCurrentPath(); - } -} -new LocationTest(); -new LocationTest(); -new LocationTest(); - -class LocationListenerTest { - v: T; - - addChangeListener() { - var v1: void = this.v.addChangeListener(() => console.log(1)); - } - - removeChangeListener() { - var v1: void = this.v.removeChangeListener(() => console.log(1)); - } -} -new LocationListenerTest(); -new LocationListenerTest(); - - -// Behavior -class ScrollBehaviorTest { - v: T; - - updateScrollPosition() { - var v1: void = this.v.updateScrollPosition({x: 33, y: 102}, 'scrollTop'); - } -} -new ScrollBehaviorTest(); -new ScrollBehaviorTest(); - - -// Component -class DefaultRouteTest { - v: Router.DefaultRoute; - - props() { - var name: string = this.v.props.name; - var handler: React.ComponentClass = this.v.props.handler; - } - - createElement() { - var Handler: React.ComponentClass; - React.createElement(Router.DefaultRoute, null); - React.createElement(Router.DefaultRoute, {name: 'name', handler: Handler}); - - ReactAddons.createElement(Router.DefaultRoute, null); - ReactAddons.createElement(Router.DefaultRoute, {name: 'name', handler: Handler}); - } -} - -class LinkTest { - v: Router.Link; - - constructor() { - new NavigationTest(); - new StateTest(); - } - - props() { - var activeClassName: string = this.v.props.activeClassName; - var to: string = this.v.props.to; - var params: {} = this.v.props.params; - var query: {} = this.v.props.query; - var onClick: Function = this.v.props.onClick; - } - - getHref() { - var v1: string = this.v.getHref(); - } - - getClassName() { - var v1: string = this.v.getClassName(); - } - - createElement() { - React.createElement(Router.Link, null); - React.createElement(Router.Link, {to: 'home'}); - React.createElement(Router.Link, { - activeClassName: 'name', - to: 'home', - params: {}, - query: {}, - onClick: () => console.log(1) - }); - - ReactAddons.createElement(Router.Link, null); - ReactAddons.createElement(Router.Link, {to: 'home'}); - ReactAddons.createElement(Router.Link, { - activeClassName: 'name', - to: 'home', - params: {}, - query: {}, - onClick: () => console.log(1) - }); - } -} - -class NotFoundRouteTest { - v: Router.NotFoundRoute; - - props() { - var name: string = this.v.props.name; - var handler: React.ComponentClass = this.v.props.handler; - } - - createElement() { - var Handler: React.ComponentClass; - React.createElement(Router.NotFoundRoute, null); - React.createElement(Router.NotFoundRoute, {handler: Handler}); - React.createElement(Router.NotFoundRoute, {handler: Handler, name: "home"}); - - ReactAddons.createElement(Router.NotFoundRoute, null); - ReactAddons.createElement(Router.NotFoundRoute, {handler: Handler}); - ReactAddons.createElement(Router.NotFoundRoute, {handler: Handler, name: "home"}); - } -} - -class RedirectTest { - v: Router.Redirect; - - props() { - var path: string = this.v.props.path; - var from: string = this.v.props.from; - var to: string = this.v.props.to; - } - - createElement() { - React.createElement(Router.Redirect, null); - React.createElement(Router.Redirect, {}); - React.createElement(Router.Redirect, {path: 'a', from: 'a', to: 'b'}); - - ReactAddons.createElement(Router.Redirect, null); - ReactAddons.createElement(Router.Redirect, {}); - ReactAddons.createElement(Router.Redirect, {path: 'a', from: 'a', to: 'b'}); - } -} - -class RouteTest { - v: Router.Route; - - props() { - var name: string = this.v.props.name; - var path: string = this.v.props.path; - var handler: React.ComponentClass = this.v.props.handler; - var ignoreScrollBehavior: boolean = this.v.props.ignoreScrollBehavior; - } - - createElement() { - var Handler: React.ComponentClass; - React.createElement(Router.Route, null); - React.createElement(Router.Route, {}); - React.createElement(Router.Route, {name: "home", path: "/", handler: Handler, ignoreScrollBehavior: true}); - - ReactAddons.createElement(Router.Route, null); - ReactAddons.createElement(Router.Route, {}); - ReactAddons.createElement(Router.Route, {name: "home", path: "/", handler: Handler, ignoreScrollBehavior: true}); - } -} - -class RouteHandlerTest { - v: Router.RouteHandler; - - createElement() { - React.createElement(Router.RouteHandler, null); - React.createElement(Router.RouteHandler, {}); - - ReactAddons.createElement(Router.RouteHandler, null); - ReactAddons.createElement(Router.RouteHandler, {}); - } -} - - -// History -class HistoryTest { - v: Router.History; - - length() { - var v1: number = this.v.length; - } - - back() { - var v1: void = this.v.back(); - } -} - - -// Router -class CreateTest { - v: Router.Router; - - constructor() { - // React.createElement() version - this.v = Router.create({ - routes: React.createElement(Router.Route, null) - }); - this.v = Router.create({ - routes: React.createElement(Router.Route, null), - location: Router.HistoryLocation, - scrollBehavior: Router.ImitateBrowserBehavior - }); - - // React.createFactory() version - this.v = Router.create({ - routes: React.createFactory(Router.Route)() - }); - this.v = Router.create({ - routes: React.createFactory(Router.Route)(), - location: Router.HistoryLocation, - scrollBehavior: Router.ImitateBrowserBehavior - }); - } - - run() { - this.v.run((Handler) => console.log(Handler)); - this.v.run((Handler, state) => console.log(Handler, state)); - } -} - -class RunTest { - constructor() { - // React.createElement() version - var v1: Router.Router = Router.run(React.createElement(Router.Route, null), (Handler) => { - React.render(React.createElement(Handler, null), document.body); - }); - var v2: Router.Router = Router.run(React.createElement(Router.Route, null), Router.HistoryLocation, (Handler, state) => { - React.render(React.createElement(Handler, null), document.body); - }); - var v3: Router.Router = Router.run(React.createElement(Router.Route, null), '/foo/bar', (Handler, state) => { - React.render(React.createElement(Handler, null), document.body); - }); - - // React.createFactory() version - var v4: Router.Router = Router.run(React.createFactory(Router.Route)(), (Handler) => { - React.render(React.createElement(Handler, null), document.body); - }); - var v5: Router.Router = Router.run(React.createFactory(Router.Route)(), Router.HistoryLocation, (Handler, state) => { - React.render(React.createElement(Handler, null), document.body); - }); - var v6: Router.Router = Router.run(React.createFactory(Router.Route)(), '/foo/bar', (Handler, state) => { - React.render(React.createElement(Handler, null), document.body); - }); - } -} - - -// Transition -class TransitionTest { - constructor() { - var v1: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition, params, query, callback) => { - transition.abort(); - transition.redirect('to'); - transition.redirect('to', {id: 1}); - transition.redirect('to', {id: 1}, {type: 'json'}); - transition.retry(); - }, - willTransitionFrom: (transition, component, callback) => {} - }; - var v2: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition, params, query) => {}, - willTransitionFrom: (transition, component) => {} - }; - var v3: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition, params) => {}, - willTransitionFrom: (transition) => {} - }; - var v4: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition) => {}, - willTransitionFrom: () => {} - }; - var v5: Router.TransitionStaticLifecycle = { - willTransitionTo: () => {} - }; - var v6: Router.TransitionStaticLifecycle = { - willTransitionFrom: () => {} - }; - } -} - - -// Context -class ContextTest { - v: Router.Context - - makePath() { - var v1: string = this.v.makePath('home'); - var v2: string = this.v.makePath('home', {p1: 1}); - var v3: string = this.v.makePath('home', {p1: 1}, {q1: 1}); - } - - makeHref() { - var v1: string = this.v.makeHref('home'); - var v2: string = this.v.makeHref('home', {p1: 1}); - var v3: string = this.v.makeHref('home', {p1: 1}, {q1: 1}); - } - - transitionTo() { - var v1: void = this.v.transitionTo('home'); - var v2: void = this.v.transitionTo('home', {p1: 1}); - var v3: void = this.v.transitionTo('home', {p1: 1}, {q1: 1}); - } - - replaceWith() { - var v1: void = this.v.replaceWith('home'); - var v2: void = this.v.replaceWith('home', {p1: 1}); - var v3: void = this.v.replaceWith('home', {p1: 1}, {q1: 1}); - } - - goBack() { - var v: void = this.v.goBack(); - } - - getCurrentPath() { - var v: string = this.v.getCurrentPath(); - } - - getCurrentRoutes() { - var v: Router.Route[] = this.v.getCurrentRoutes(); - } - - getCurrentPathname() { - var v: string = this.v.getCurrentPathname(); - } - - getCurrentParams() { - var v: {} = this.v.getCurrentParams(); - } - - getCurrentQuery() { - var v: {} = this.v.getCurrentQuery(); - } - - isActive() { - var v1: boolean = this.v.isActive('home'); - var v2: boolean = this.v.isActive('home', {p1: 1}); - var v3: boolean = this.v.isActive('home', {p1: 1}, {q1: 1}); - } -} diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index 4cebcfab3..b1da6e006 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -1,354 +1,326 @@ -// Type definitions for React Router 0.13.3 +// Type definitions for history v1.0.0-rc1 // Project: https://github.com/rackt/react-router -// Definitions by: Yuichi Murata , Václav Ostrožlík +// Definitions by: Sergey Buturlakin // Definitions: https://github.com/borisyankov/DefinitelyTyped -/// -declare module ReactRouter { - import React = __React; +/// - // - // Transition - // ---------------------------------------------------------------------- - interface Transition { - path: string; - abortReason: any; - retry(): void; - abort(reason?: any): void; - redirect(to: string, params?: {}, query?: {}): void; - cancel(): void; - from: (transition: Transition, routes: Route[], components?: React.ReactElement[], callback?: (error?: any) => void) => void; - to: (transition: Transition, routes: Route[], params?: {}, query?: {}, callback?: (error?: any) => void) => void; + +declare namespace ReactRouter { + + // types based on https://github.com/rackt/react-router/blob/master/docs/Glossary.md + + type Action = string + + type Component = React.ReactType + + type EnterHook = (nextState: RouterState, replaceState: RedirectFunction, callback?: Function) => any + + type LeaveHook = () => any + + interface Location { + pathname: Pathname + search: QueryString + query: Query + state: LocationState + action: Action + key: LocationKey } - interface TransitionStaticLifecycle { - willTransitionTo?( - transition: Transition, - params: {}, - query: {}, - callback: Function - ): void; + type LocationKey = string - willTransitionFrom?( - transition: Transition, - component: React.ReactElement, - callback: Function - ): void; + type LocationListener = (location: Location) => void + + type LocationState = Object + + type Params = Object + + type Path = string // Pathname + QueryString + + type Pathname = string + + type Query = Object + + type QueryString = string + + type RedirectFunction = (state: LocationState, pathname: Pathname | Path, query?: Query) => void + + interface RouteComponentProps { + history?: RouterObject + location?: Location + params?: Params + route?: RouteObject + routeParams?: Params + routes?: PlainRoute[] } - // - // Route Configuration - // ---------------------------------------------------------------------- - // DefaultRoute - interface DefaultRouteProp { - name?: string; - handler: React.ComponentClass; - } - interface DefaultRoute extends React.ReactElement {} - interface DefaultRouteClass extends React.ComponentClass {} + type RouteComponent = React.ComponentClass - // NotFoundRoute - interface NotFoundRouteProp { - name?: string; - handler: React.ComponentClass; - } - interface NotFoundRoute extends React.ReactElement {} - interface NotFoundRouteClass extends React.ComponentClass {} + type RouteConfig = RouteObject[] - // Redirect - interface RedirectProp { - path?: string; - from?: string; - to?: string; - } - interface Redirect extends React.ReactElement {} - interface RedirectClass extends React.ComponentClass {} + type RouteHook = (nextLocation?: Location) => any - // Route - interface RouteProp { - name?: string; - path?: string; - handler?: React.ComponentClass; - ignoreScrollBehavior?: boolean; - } - interface Route extends React.ReactElement {} - interface RouteClass extends React.ComponentClass {} + type RoutePattern = string - var DefaultRoute: DefaultRouteClass; - var NotFoundRoute: NotFoundRouteClass; - var Redirect: RedirectClass; - var Route: RouteClass; - - interface CreateRouteOptions { - name?: string; - path?: string; - ignoreScrollBehavior?: boolean; - isDefault?: boolean; - isNotFound?: boolean; - onEnter?: (transition: Transition, params: {}, query: {}, callback: Function) => void; - onLeave?: (transition: Transition, wtf: any, callback: Function) => void; - handler?: Function; - parentRoute?: Route; + interface RouteObject { + component: RouteComponent + path: RoutePattern + onEnter: EnterHook + onLeave: LeaveHook } - type CreateRouteCallback = (route: Route) => void; - - function createRoute(callback: CreateRouteCallback): Route; - function createRoute(options: CreateRouteOptions | string, callback: CreateRouteCallback): Route; - function createDefaultRoute(options?: CreateRouteOptions | string): Route; - function createNotFoundRoute(options?: CreateRouteOptions | string): Route; - - interface CreateRedirectOptions extends CreateRouteOptions { - path?: string; - from?: string; - to: string; - params?: {}; - query?: {}; + interface RouterObject { + transitionTo: (location: Location) => void + pushState: (state: LocationState, pathname: Pathname | Path, query?: Query) => void + replaceState: (state: LocationState, pathname: Pathname | Path, query?: Query) => void + go(n: Number): void + listen(listener: RouterListener): Function + match(location: Location, callback: RouterListener): void } - function createRedirect(options: CreateRedirectOptions): Redirect; - function createRoutesFromReactChildren(children: Route): Route[]; - // - // Components - // ---------------------------------------------------------------------- - // Link - interface LinkProp extends React.HTMLAttributes { - activeClassName?: string; - activeStyle?: {}; - to: string; - params?: {}; - query?: {}; - } - interface Link extends React.ReactElement, Navigation, State { - handleClick(event: any): void; - getHref(): string; - getClassName(): string; - getActiveState(): boolean; - } - interface LinkClass extends React.ComponentClass {} - - // RouteHandler - interface RouteHandlerProp { } - interface RouteHandlerChildContext { - routeDepth: number; - } - interface RouteHandler extends React.ReactElement { - getChildContext(): RouteHandlerChildContext; - getRouteDepth(): number; - createChildRouteHandler(props: {}): RouteHandler; - } - interface RouteHandlerClass extends React.ComponentClass {} - - var Link: LinkClass; - var RouteHandler: RouteHandlerClass; - - - // - // Top-Level - // ---------------------------------------------------------------------- - interface Router extends React.ReactElement { - run(callback: RouterRunCallback): void; - } + type RouterListener = (error: Error, nextState: RouterState) => void interface RouterState { - path: string; - action: string; - pathname: string; - params: {}; - query: {}; - routes: Route[]; + location: Location + routes: RouteConfig + params: Params + components: Component[] } - interface RouterCreateOption { - routes: Route; - location?: LocationBase; - scrollBehavior?: ScrollBehaviorBase; - onError?: (error: any) => void; - onAbort?: (error: any) => void; + + interface HistoryProp { + listen(listener: LocationListener): Function + pushState(state: LocationState, path: Path): void + replaceState(state: LocationState, path: Path): void + go(n: number): void } - type RouterRunCallback = (Handler: RouteClass, state: RouterState) => void; + type RouteType = Route | IndexRoute | PlainRoute | Redirect - function create(options: RouterCreateOption): Router; - function run(routes: Route, callback: RouterRunCallback): Router; - function run(routes: Route, location: LocationBase | string, callback: RouterRunCallback): Router; + type Components = { [key: string]: Component } - // - // Location - // ---------------------------------------------------------------------- - interface LocationBase { - getCurrentPath(): void; - toString(): string; + interface RouterProps { + history?: HistoryProp + children?: RouteType[] + routes?: RouteType[] // alias for children + createElement?: (component: Component, props: Object) => any + onError?: (err: any) => any + onUpdate?: () => any + parseQueryString?: (queryString: QueryString) => Query + stringifyQuery?: (queryObject: Query) => QueryString } - interface Location extends LocationBase { - push(path: string): void; - replace(path: string): void; - pop(): void; + interface Router extends React.ComponentClass {} + interface RouterElement extends React.ReactElement {} + const Router: Router + + + interface LinkProps extends React.HTMLAttributesBase { + activeStyle?: React.CSSProperties + activeClassName?: string + onlyActiveOnIndex?: boolean + to: RoutePattern + query?: Query + state?: LocationState + } + interface Link extends React.ComponentClass {} + interface LinkElement extends React.DOMElement {} + const Link: Link + + + interface RoutePropsBase { + children?: RouteType[] + ignoreScrollBehavior?: boolean + component?: Component + components?: Components + getComponent?: (location: Location, cb: (err: any, component?: Component) => void) => void + getComponents?: (location: Location, cb: (err: any, components?: Components) => void) => void + onEnter?: EnterHook + onLeave?: LeaveHook } - interface LocationListener { - addChangeListener(listener: Function): void; - removeChangeListener(listener: Function): void; + interface RouteProps extends RoutePropsBase { + path?: RoutePattern + } + interface Route extends React.ComponentClass {} + interface RouteElement extends React.ReactElement {} + const Route: Route + + + interface PlainRoute extends RoutePropsBase { + childRoutes: RouteType[] + getChildRoutes: (location: Location, cb: (err: any, routesArray: RouteType[]) => void) => void } - interface HashLocation extends Location, LocationListener { } - interface HistoryLocation extends Location, LocationListener { } - interface RefreshLocation extends Location { } - interface StaticLocation extends LocationBase { } - interface TestLocation extends Location, LocationListener { } - var HashLocation: HashLocation; - var HistoryLocation: HistoryLocation; - var RefreshLocation: RefreshLocation; - var StaticLocation: StaticLocation; - var TestLocation: TestLocation; + interface RedirectProps { + path?: RoutePattern + from?: RoutePattern // alias for path + to: RoutePattern + query?: Query + state?: LocationState - - // - // Behavior - // ---------------------------------------------------------------------- - interface ScrollBehaviorBase { - updateScrollPosition(position: { x: number; y: number; }, actionType: string): void; } - interface ImitateBrowserBehavior extends ScrollBehaviorBase { } - interface ScrollToTopBehavior extends ScrollBehaviorBase { } - - var ImitateBrowserBehavior: ImitateBrowserBehavior; - var ScrollToTopBehavior: ScrollToTopBehavior; + interface Redirect extends React.ReactElement {} + interface RedirectELement extends React.ReactElement {} + const Redirect: Redirect - // - // Mixin - // ---------------------------------------------------------------------- - interface Navigation { - makePath(to: string, params?: {}, query?: {}): string; - makeHref(to: string, params?: {}, query?: {}): string; - transitionTo(to: string, params?: {}, query?: {}): void; - replaceWith(to: string, params?: {}, query?: {}): void; - goBack(): void; - } + interface IndexRouteProps extends RoutePropsBase {} + interface IndexRoute extends React.ComponentClass {} + interface IndexRouteElement extends React.ReactElement {} + const IndexRoute: IndexRoute - interface State { - getPath(): string; - getRoutes(): Route[]; - getPathname(): string; - getParams(): {}; - getQuery(): {}; - isActive(to: string, params?: {}, query?: {}): boolean; - } - - var Navigation: Navigation; - var State: State; - - - // - // History - // ---------------------------------------------------------------------- - interface History { - back(): void; - length: number; - } - var History: History; - - - // - // Context - // ---------------------------------------------------------------------- - interface Context { - makePath(to: string, params?: {}, query?: {}): string; - makeHref(to: string, params?: {}, query?: {}): string; - transitionTo(to: string, params?: {}, query?: {}): void; - replaceWith(to: string, params?: {}, query?: {}): void; - goBack(): void; - - getCurrentPath(): string; - getCurrentRoutes(): Route[]; - getCurrentPathname(): string; - getCurrentParams(): {}; - getCurrentQuery(): {}; - isActive(to: string, params?: {}, query?: {}): boolean; - } } + +declare module "react-router/lib/Router" { + + export default ReactRouter.Router + +} + + +declare module "react-router/lib/Link" { + + export default ReactRouter.Link + +} + + +declare module "react-router/lib/IndexRoute" { + + export default ReactRouter.IndexRoute + +} + + +declare module "react-router/lib/Redirect" { + + export default ReactRouter.Redirect + +} + + +declare module "react-router/lib/Route" { + + export default ReactRouter.Route + +} + + +declare module "react-router/lib/History" { + + const History: any + + export default History + +} + + +declare module "react-router/lib/Lifecycle" { + + const Lifecycle: any + + export default Lifecycle + +} + + +declare module "react-router/lib/RouteContext" { + + const RouteContext: any + + export default RouteContext + +} + + +declare module "react-router/lib/useRoutes" { + + const useRoutes: any + + export default useRoutes + +} + + +declare module "react-router/lib/RouteUtils" { + + export const createRoutes: any + +} + + +declare module "react-router/lib/RoutingContext" { + + const RoutingContext: any + + export default RoutingContext + +} + + +declare module "react-router/lib/PropTypes" { + + const PropTypes: any + + export default PropTypes + +} + + +declare module "react-router/lib/match" { + + const match: any + + export default match + +} + + declare module "react-router" { - export = ReactRouter; -} -declare module __React { + import Router from "react-router/lib/Router" - // for DefaultRoute - function createElement( - type: ReactRouter.DefaultRouteClass, - props: ReactRouter.DefaultRouteProp, - ...children: __React.ReactNode[]): ReactRouter.DefaultRoute; + import Link from "react-router/lib/Link" - // for Link - function createElement( - type: ReactRouter.LinkClass, - props: ReactRouter.LinkProp, - ...children: __React.ReactNode[]): ReactRouter.Link; + import IndexRoute from "react-router/lib/IndexRoute" - // for NotFoundRoute - function createElement( - type: ReactRouter.NotFoundRouteClass, - props: ReactRouter.NotFoundRouteProp, - ...children: __React.ReactNode[]): ReactRouter.NotFoundRoute; + import Redirect from "react-router/lib/Redirect" - // for Redirect - function createElement( - type: ReactRouter.RedirectClass, - props: ReactRouter.RedirectProp, - ...children: __React.ReactNode[]): ReactRouter.Redirect; + import Route from "react-router/lib/Route" - // for Route - function createElement( - type: ReactRouter.RouteClass, - props: ReactRouter.RouteProp, - ...children: __React.ReactNode[]): ReactRouter.Route; + import History from "react-router/lib/History" - // for RouteHandler - function createElement( - type: ReactRouter.RouteHandlerClass, - props: ReactRouter.RouteHandlerProp, - ...children: __React.ReactNode[]): ReactRouter.RouteHandler; -} + import Lifecycle from "react-router/lib/Lifecycle" -declare module "react/addons" { - // for DefaultRoute - function createElement( - type: ReactRouter.DefaultRouteClass, - props: ReactRouter.DefaultRouteProp, - ...children: __React.ReactNode[]): ReactRouter.DefaultRoute; + import RouteContext from "react-router/lib/RouteContext" - // for Link - function createElement( - type: ReactRouter.LinkClass, - props: ReactRouter.LinkProp, - ...children: __React.ReactNode[]): ReactRouter.Link; + import { createRoutes } from "react-router/lib/RouteUtils" - // for NotFoundRoute - function createElement( - type: ReactRouter.NotFoundRouteClass, - props: ReactRouter.NotFoundRouteProp, - ...children: __React.ReactNode[]): ReactRouter.NotFoundRoute; + import RoutingContext from "react-router/lib/RoutingContext" - // for Redirect - function createElement( - type: ReactRouter.RedirectClass, - props: ReactRouter.RedirectProp, - ...children: __React.ReactNode[]): ReactRouter.Redirect; + import PropTypes from "react-router/lib/PropTypes" - // for Route - function createElement( - type: ReactRouter.RouteClass, - props: ReactRouter.RouteProp, - ...children: __React.ReactNode[]): ReactRouter.Route; + import match from "react-router/lib/match" + + export { + Router, + Link, + IndexRoute, + Redirect, + Route, + History, + Lifecycle, + RouteContext, + createRoutes, + RoutingContext, + PropTypes, + match + } + + export default Router - // for RouteHandler - function createElement( - type: ReactRouter.RouteHandlerClass, - props: ReactRouter.RouteHandlerProp, - ...children: __React.ReactNode[]): ReactRouter.RouteHandler; } From fb14688db7ba1f2dd4cf5978ef03cbc318d45b40 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Wed, 30 Sep 2015 17:51:09 +0300 Subject: [PATCH 02/13] Update History for use as global and minor fixes --- react-router/history.d.ts | 40 ++++++++++++++++++++++++++++++--------- 1 file changed, 31 insertions(+), 9 deletions(-) diff --git a/react-router/history.d.ts b/react-router/history.d.ts index ede3d719c..e432a2418 100644 --- a/react-router/history.d.ts +++ b/react-router/history.d.ts @@ -12,13 +12,12 @@ declare namespace HistoryModule { type BeforeUnloadHook = () => string - type CreateHistory = (options: HistoryOptions) => History + type CreateHistory = (options?: HistoryOptions) => History type CreateHistoryEnhancer = (createHistory: CreateHistory) => CreateHistory - interface History { - listenBefore: (hook: TransitionHook) => Function - listen: (listener: LocationListener) => Function + interface HistoryBase { + listenBefore(hook: TransitionHook): Function transitionTo(location: Location): void pushState(state: LocationState, path: Path): void replaceState(state: LocationState, path: Path): void @@ -31,6 +30,10 @@ declare namespace HistoryModule { createHref(path: Path): Href } + interface History { + listen(listener: LocationListener): Function + } + type HistoryOptions = Object type Href = string @@ -54,32 +57,51 @@ declare namespace HistoryModule { type Pathname = string - type QueryString = string - type Query = Object + type QueryString = string + type TransitionHook = (location: Location, callback: Function) => any + // Global usage, without modules, needs the small trick, because lib.d.ts + // already has `history` and `History` global definitions: + // var history_: HistoryModule.Module = window['History']; + // history_.createHistory(); + interface Module { + createHistory: CreateHistory + createHashHistory: CreateHistory + createMemoryHistory: CreateHistory + createLocation(): Location + useBasename(enhancer: CreateHistoryEnhancer): CreateHistory + useBeforeUnload(enhancer: CreateHistoryEnhancer): CreateHistory + useQueries(enhancer: CreateHistoryEnhancer): CreateHistory + actions: { + PUSH: string + REPLACE: string + POP: string + } + } + } declare module "history/lib/createBrowserHistory" { - export default function createBrowserHistory(): HistoryModule.History + export default function createBrowserHistory(options?: HistoryModule.HistoryOptions): HistoryModule.History } declare module "history/lib/createHashHistory" { - export default function createHashHistory(): HistoryModule.History + export default function createHashHistory(options?: HistoryModule.HistoryOptions): HistoryModule.History } declare module "history/lib/createMemoryHistory" { - export default function createMemoryHistory(): HistoryModule.History + export default function createMemoryHistory(options?: HistoryModule.HistoryOptions): HistoryModule.History } From ef5f58533485fd056b4c642d9c49c92667d8f290 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Wed, 30 Sep 2015 17:52:15 +0300 Subject: [PATCH 03/13] Complete react-router v1.0.0-rc1 definitions --- react-router/react-router.d.ts | 215 ++++++++++++++++++++------------- 1 file changed, 132 insertions(+), 83 deletions(-) diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index b1da6e006..c96fe284d 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -1,17 +1,18 @@ -// Type definitions for history v1.0.0-rc1 +// Type definitions for react-router v1.0.0-rc1 // Project: https://github.com/rackt/react-router // Definitions by: Sergey Buturlakin // Definitions: https://github.com/borisyankov/DefinitelyTyped -/// +/// +/// declare namespace ReactRouter { // types based on https://github.com/rackt/react-router/blob/master/docs/Glossary.md - type Action = string + import H = HistoryModule type Component = React.ReactType @@ -19,38 +20,17 @@ declare namespace ReactRouter { type LeaveHook = () => any - interface Location { - pathname: Pathname - search: QueryString - query: Query - state: LocationState - action: Action - key: LocationKey - } - - type LocationKey = string - - type LocationListener = (location: Location) => void - - type LocationState = Object - type Params = Object - type Path = string // Pathname + QueryString + type ParseQueryString = (queryString: H.QueryString) => H.Query - type Pathname = string - - type Query = Object - - type QueryString = string - - type RedirectFunction = (state: LocationState, pathname: Pathname | Path, query?: Query) => void + type RedirectFunction = (state: H.LocationState, pathname: H.Pathname | H.Path, query?: H.Query) => void interface RouteComponentProps { - history?: RouterObject + history?: History location?: Location params?: Params - route?: RouteObject + route?: PlainRoute routeParams?: Params routes?: PlainRoute[] } @@ -63,20 +43,24 @@ declare namespace ReactRouter { type RoutePattern = string - interface RouteObject { - component: RouteComponent - path: RoutePattern - onEnter: EnterHook - onLeave: LeaveHook - } + type RouteObject = PlainRoute - interface RouterObject { - transitionTo: (location: Location) => void - pushState: (state: LocationState, pathname: Pathname | Path, query?: Query) => void - replaceState: (state: LocationState, pathname: Pathname | Path, query?: Query) => void - go(n: Number): void + type StringifyQuery = (queryObject: H.Query) => H.QueryString + + + interface History extends H.HistoryBase { + pushState(state: H.LocationState, pathname: H.Pathname | H.Path, query?: H.Query): void + replaceState(state: H.LocationState, pathname: H.Pathname | H.Path, query?: H.Query): void + createPath(path: H.Path, query?: H.Query): H.Path + createHref(path: H.Path, query?: H.Query): H.Href + isActive(pathname: H.Pathname, query: H.Query): boolean + registerRouteHook(route: PlainRoute, hook: H.LocationListener): void + unregisterRouteHook(route: PlainRoute, hook: H.LocationListener): void listen(listener: RouterListener): Function - match(location: Location, callback: RouterListener): void + match(location: H.Location, callback: (error: any, nextState: RouterState, nextLocation: H.Location) => void): void + routes: PlainRoute[] + parseQueryString?: ParseQueryString + stringifyQuery?: StringifyQuery } type RouterListener = (error: Error, nextState: RouterState) => void @@ -89,27 +73,22 @@ declare namespace ReactRouter { } - interface HistoryProp { - listen(listener: LocationListener): Function - pushState(state: LocationState, path: Path): void - replaceState(state: LocationState, path: Path): void - go(n: number): void - } - type RouteType = Route | IndexRoute | PlainRoute | Redirect + type RouteTypes = RouteType | RouteType[] + type Components = { [key: string]: Component } interface RouterProps { - history?: HistoryProp - children?: RouteType[] - routes?: RouteType[] // alias for children + history?: H.History + children?: RouteTypes + routes?: RouteTypes // alias for children createElement?: (component: Component, props: Object) => any onError?: (err: any) => any onUpdate?: () => any - parseQueryString?: (queryString: QueryString) => Query - stringifyQuery?: (queryObject: Query) => QueryString + parseQueryString?: ParseQueryString + stringifyQuery?: StringifyQuery } interface Router extends React.ComponentClass {} interface RouterElement extends React.ReactElement {} @@ -121,8 +100,8 @@ declare namespace ReactRouter { activeClassName?: string onlyActiveOnIndex?: boolean to: RoutePattern - query?: Query - state?: LocationState + query?: H.Query + state?: H.LocationState } interface Link extends React.ComponentClass {} interface LinkElement extends React.DOMElement {} @@ -130,7 +109,7 @@ declare namespace ReactRouter { interface RoutePropsBase { - children?: RouteType[] + children?: RouteTypes ignoreScrollBehavior?: boolean component?: Component components?: Components @@ -148,9 +127,9 @@ declare namespace ReactRouter { const Route: Route - interface PlainRoute extends RoutePropsBase { - childRoutes: RouteType[] - getChildRoutes: (location: Location, cb: (err: any, routesArray: RouteType[]) => void) => void + interface PlainRoute extends RouteProps { + childRoutes: RouteTypes + getChildRoutes: (location: Location, cb: (err: any, routesArray: RouteTypes) => void) => void } @@ -158,12 +137,11 @@ declare namespace ReactRouter { path?: RoutePattern from?: RoutePattern // alias for path to: RoutePattern - query?: Query - state?: LocationState - + query?: H.Query + state?: H.LocationState } interface Redirect extends React.ReactElement {} - interface RedirectELement extends React.ReactElement {} + interface RedirectElement extends React.ReactElement {} const Redirect: Redirect @@ -172,6 +150,51 @@ declare namespace ReactRouter { interface IndexRouteElement extends React.ReactElement {} const IndexRoute: IndexRoute + + interface RoutingContextProps { + history: H.History + createElement?: (component: Component, props: Object) => any + location: Location + routes: RouteTypes + params: Params + components?: Components + } + interface RoutingContext extends React.ReactElement {} + interface RoutingContextElement extends React.ReactElement {} + const RoutingContext: RoutingContext + + + interface LifecycleMixin { + routerWillLeave(nextLocation: Location): string | boolean + } + const Lifecycle: React.Mixin + + + const RouteContext: React.Mixin + + + interface HistoryMixin { + history: History + } + const History: React.Mixin + + + function useRoutes(enhancer: H.CreateHistoryEnhancer): H.CreateHistory + + function createRoutes(routes: RouteTypes): PlainRoute[] + + interface MatchArgs { + routes?: RouteTypes + history?: H.History + location?: Location + parseQueryString?: ParseQueryString + stringifyQuery?: StringifyQuery + } + interface MatchState extends RouterState { + history: History + } + function match(args: MatchArgs, cb: (error: any, nextLocation: H.Location, nextState: MatchState) => void): void + } @@ -189,6 +212,15 @@ declare module "react-router/lib/Link" { } +declare module "react-router/lib/IndexLink" { + + const IndexLink: ReactRouter.Link + + export default IndexLink + +} + + declare module "react-router/lib/IndexRoute" { export default ReactRouter.IndexRoute @@ -212,70 +244,87 @@ declare module "react-router/lib/Route" { declare module "react-router/lib/History" { - const History: any - - export default History + export default ReactRouter.History } declare module "react-router/lib/Lifecycle" { - const Lifecycle: any - - export default Lifecycle + export default ReactRouter.Lifecycle } declare module "react-router/lib/RouteContext" { - const RouteContext: any - - export default RouteContext + export default ReactRouter.RouteContext } declare module "react-router/lib/useRoutes" { - const useRoutes: any - - export default useRoutes + export default ReactRouter.useRoutes } declare module "react-router/lib/RouteUtils" { - export const createRoutes: any + type E = React.ReactElement + + export function isReactChildren(object: E | E[]): boolean + + export function createRouteFromReactElement(element: E): ReactRouter.PlainRoute + + export function createRoutesFromReactChildren(children: E | E[], parentRoute: ReactRouter.PlainRoute): ReactRouter.PlainRoute[] + + import createRoutes = ReactRouter.createRoutes + + export { createRoutes } } declare module "react-router/lib/RoutingContext" { - const RoutingContext: any - - export default RoutingContext + export default ReactRouter.RoutingContext } declare module "react-router/lib/PropTypes" { - const PropTypes: any + export function falsy(props: any, propName: string, componentName: string): Error; - export default PropTypes + export const history: React.Requireable + + export const location: React.Requireable + + export const component: React.Requireable + + export const components: React.Requireable + + export const route: React.Requireable + + export const routes: React.Requireable + + export default { + falsy, + history, + location, + component, + components, + route + } } declare module "react-router/lib/match" { - const match: any - - export default match + export default ReactRouter.match } From 4a33c914d17fd680916dc0dbfa27df1ce41aea26 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Wed, 30 Sep 2015 19:27:10 +0300 Subject: [PATCH 04/13] Add tests Restore old definitions as react-router-0.13.3.d.ts Update react-redux to use old definitions --- react-redux/react-redux-tests.tsx | 2 +- react-router/history.d.ts | 7 +- react-router/react-router-0.13.3.d.ts | 354 ++++++++++++++++++ react-router/react-router-tests.tsx | 67 ++++ react-router/react-router-tests.tsx.tscparams | 1 + react-router/react-router.d.ts | 8 +- 6 files changed, 430 insertions(+), 9 deletions(-) create mode 100644 react-router/react-router-0.13.3.d.ts create mode 100644 react-router/react-router-tests.tsx create mode 100644 react-router/react-router-tests.tsx.tscparams diff --git a/react-redux/react-redux-tests.tsx b/react-redux/react-redux-tests.tsx index 9bd662295..eb2a5b5bc 100644 --- a/react-redux/react-redux-tests.tsx +++ b/react-redux/react-redux-tests.tsx @@ -1,7 +1,7 @@ /// /// /// -/// +/// /// import { Component } from 'react'; diff --git a/react-router/history.d.ts b/react-router/history.d.ts index e432a2418..c982bd229 100644 --- a/react-router/history.d.ts +++ b/react-router/history.d.ts @@ -63,10 +63,9 @@ declare namespace HistoryModule { type TransitionHook = (location: Location, callback: Function) => any - // Global usage, without modules, needs the small trick, because lib.d.ts - // already has `history` and `History` global definitions: - // var history_: HistoryModule.Module = window['History']; - // history_.createHistory(); + // Global usage, without modules, needs the small trick, because lib.d.ts + // already has `history` and `History` global definitions: + // var createHistory = ((window as any).History as HistoryModule.Module).createHistory; interface Module { createHistory: CreateHistory createHashHistory: CreateHistory diff --git a/react-router/react-router-0.13.3.d.ts b/react-router/react-router-0.13.3.d.ts new file mode 100644 index 000000000..4cebcfab3 --- /dev/null +++ b/react-router/react-router-0.13.3.d.ts @@ -0,0 +1,354 @@ +// Type definitions for React Router 0.13.3 +// Project: https://github.com/rackt/react-router +// Definitions by: Yuichi Murata , Václav Ostrožlík +// Definitions: https://github.com/borisyankov/DefinitelyTyped + +/// + +declare module ReactRouter { + import React = __React; + + // + // Transition + // ---------------------------------------------------------------------- + interface Transition { + path: string; + abortReason: any; + retry(): void; + abort(reason?: any): void; + redirect(to: string, params?: {}, query?: {}): void; + cancel(): void; + from: (transition: Transition, routes: Route[], components?: React.ReactElement[], callback?: (error?: any) => void) => void; + to: (transition: Transition, routes: Route[], params?: {}, query?: {}, callback?: (error?: any) => void) => void; + } + + interface TransitionStaticLifecycle { + willTransitionTo?( + transition: Transition, + params: {}, + query: {}, + callback: Function + ): void; + + willTransitionFrom?( + transition: Transition, + component: React.ReactElement, + callback: Function + ): void; + } + + // + // Route Configuration + // ---------------------------------------------------------------------- + // DefaultRoute + interface DefaultRouteProp { + name?: string; + handler: React.ComponentClass; + } + interface DefaultRoute extends React.ReactElement {} + interface DefaultRouteClass extends React.ComponentClass {} + + // NotFoundRoute + interface NotFoundRouteProp { + name?: string; + handler: React.ComponentClass; + } + interface NotFoundRoute extends React.ReactElement {} + interface NotFoundRouteClass extends React.ComponentClass {} + + // Redirect + interface RedirectProp { + path?: string; + from?: string; + to?: string; + } + interface Redirect extends React.ReactElement {} + interface RedirectClass extends React.ComponentClass {} + + // Route + interface RouteProp { + name?: string; + path?: string; + handler?: React.ComponentClass; + ignoreScrollBehavior?: boolean; + } + interface Route extends React.ReactElement {} + interface RouteClass extends React.ComponentClass {} + + var DefaultRoute: DefaultRouteClass; + var NotFoundRoute: NotFoundRouteClass; + var Redirect: RedirectClass; + var Route: RouteClass; + + interface CreateRouteOptions { + name?: string; + path?: string; + ignoreScrollBehavior?: boolean; + isDefault?: boolean; + isNotFound?: boolean; + onEnter?: (transition: Transition, params: {}, query: {}, callback: Function) => void; + onLeave?: (transition: Transition, wtf: any, callback: Function) => void; + handler?: Function; + parentRoute?: Route; + } + + type CreateRouteCallback = (route: Route) => void; + + function createRoute(callback: CreateRouteCallback): Route; + function createRoute(options: CreateRouteOptions | string, callback: CreateRouteCallback): Route; + function createDefaultRoute(options?: CreateRouteOptions | string): Route; + function createNotFoundRoute(options?: CreateRouteOptions | string): Route; + + interface CreateRedirectOptions extends CreateRouteOptions { + path?: string; + from?: string; + to: string; + params?: {}; + query?: {}; + } + function createRedirect(options: CreateRedirectOptions): Redirect; + function createRoutesFromReactChildren(children: Route): Route[]; + + // + // Components + // ---------------------------------------------------------------------- + // Link + interface LinkProp extends React.HTMLAttributes { + activeClassName?: string; + activeStyle?: {}; + to: string; + params?: {}; + query?: {}; + } + interface Link extends React.ReactElement, Navigation, State { + handleClick(event: any): void; + getHref(): string; + getClassName(): string; + getActiveState(): boolean; + } + interface LinkClass extends React.ComponentClass {} + + // RouteHandler + interface RouteHandlerProp { } + interface RouteHandlerChildContext { + routeDepth: number; + } + interface RouteHandler extends React.ReactElement { + getChildContext(): RouteHandlerChildContext; + getRouteDepth(): number; + createChildRouteHandler(props: {}): RouteHandler; + } + interface RouteHandlerClass extends React.ComponentClass {} + + var Link: LinkClass; + var RouteHandler: RouteHandlerClass; + + + // + // Top-Level + // ---------------------------------------------------------------------- + interface Router extends React.ReactElement { + run(callback: RouterRunCallback): void; + } + + interface RouterState { + path: string; + action: string; + pathname: string; + params: {}; + query: {}; + routes: Route[]; + } + + interface RouterCreateOption { + routes: Route; + location?: LocationBase; + scrollBehavior?: ScrollBehaviorBase; + onError?: (error: any) => void; + onAbort?: (error: any) => void; + } + + type RouterRunCallback = (Handler: RouteClass, state: RouterState) => void; + + function create(options: RouterCreateOption): Router; + function run(routes: Route, callback: RouterRunCallback): Router; + function run(routes: Route, location: LocationBase | string, callback: RouterRunCallback): Router; + + + // + // Location + // ---------------------------------------------------------------------- + interface LocationBase { + getCurrentPath(): void; + toString(): string; + } + interface Location extends LocationBase { + push(path: string): void; + replace(path: string): void; + pop(): void; + } + + interface LocationListener { + addChangeListener(listener: Function): void; + removeChangeListener(listener: Function): void; + } + + interface HashLocation extends Location, LocationListener { } + interface HistoryLocation extends Location, LocationListener { } + interface RefreshLocation extends Location { } + interface StaticLocation extends LocationBase { } + interface TestLocation extends Location, LocationListener { } + + var HashLocation: HashLocation; + var HistoryLocation: HistoryLocation; + var RefreshLocation: RefreshLocation; + var StaticLocation: StaticLocation; + var TestLocation: TestLocation; + + + // + // Behavior + // ---------------------------------------------------------------------- + interface ScrollBehaviorBase { + updateScrollPosition(position: { x: number; y: number; }, actionType: string): void; + } + interface ImitateBrowserBehavior extends ScrollBehaviorBase { } + interface ScrollToTopBehavior extends ScrollBehaviorBase { } + + var ImitateBrowserBehavior: ImitateBrowserBehavior; + var ScrollToTopBehavior: ScrollToTopBehavior; + + + // + // Mixin + // ---------------------------------------------------------------------- + interface Navigation { + makePath(to: string, params?: {}, query?: {}): string; + makeHref(to: string, params?: {}, query?: {}): string; + transitionTo(to: string, params?: {}, query?: {}): void; + replaceWith(to: string, params?: {}, query?: {}): void; + goBack(): void; + } + + interface State { + getPath(): string; + getRoutes(): Route[]; + getPathname(): string; + getParams(): {}; + getQuery(): {}; + isActive(to: string, params?: {}, query?: {}): boolean; + } + + var Navigation: Navigation; + var State: State; + + + // + // History + // ---------------------------------------------------------------------- + interface History { + back(): void; + length: number; + } + var History: History; + + + // + // Context + // ---------------------------------------------------------------------- + interface Context { + makePath(to: string, params?: {}, query?: {}): string; + makeHref(to: string, params?: {}, query?: {}): string; + transitionTo(to: string, params?: {}, query?: {}): void; + replaceWith(to: string, params?: {}, query?: {}): void; + goBack(): void; + + getCurrentPath(): string; + getCurrentRoutes(): Route[]; + getCurrentPathname(): string; + getCurrentParams(): {}; + getCurrentQuery(): {}; + isActive(to: string, params?: {}, query?: {}): boolean; + } +} + +declare module "react-router" { + export = ReactRouter; +} + +declare module __React { + + // for DefaultRoute + function createElement( + type: ReactRouter.DefaultRouteClass, + props: ReactRouter.DefaultRouteProp, + ...children: __React.ReactNode[]): ReactRouter.DefaultRoute; + + // for Link + function createElement( + type: ReactRouter.LinkClass, + props: ReactRouter.LinkProp, + ...children: __React.ReactNode[]): ReactRouter.Link; + + // for NotFoundRoute + function createElement( + type: ReactRouter.NotFoundRouteClass, + props: ReactRouter.NotFoundRouteProp, + ...children: __React.ReactNode[]): ReactRouter.NotFoundRoute; + + // for Redirect + function createElement( + type: ReactRouter.RedirectClass, + props: ReactRouter.RedirectProp, + ...children: __React.ReactNode[]): ReactRouter.Redirect; + + // for Route + function createElement( + type: ReactRouter.RouteClass, + props: ReactRouter.RouteProp, + ...children: __React.ReactNode[]): ReactRouter.Route; + + // for RouteHandler + function createElement( + type: ReactRouter.RouteHandlerClass, + props: ReactRouter.RouteHandlerProp, + ...children: __React.ReactNode[]): ReactRouter.RouteHandler; +} + +declare module "react/addons" { + // for DefaultRoute + function createElement( + type: ReactRouter.DefaultRouteClass, + props: ReactRouter.DefaultRouteProp, + ...children: __React.ReactNode[]): ReactRouter.DefaultRoute; + + // for Link + function createElement( + type: ReactRouter.LinkClass, + props: ReactRouter.LinkProp, + ...children: __React.ReactNode[]): ReactRouter.Link; + + // for NotFoundRoute + function createElement( + type: ReactRouter.NotFoundRouteClass, + props: ReactRouter.NotFoundRouteProp, + ...children: __React.ReactNode[]): ReactRouter.NotFoundRoute; + + // for Redirect + function createElement( + type: ReactRouter.RedirectClass, + props: ReactRouter.RedirectProp, + ...children: __React.ReactNode[]): ReactRouter.Redirect; + + // for Route + function createElement( + type: ReactRouter.RouteClass, + props: ReactRouter.RouteProp, + ...children: __React.ReactNode[]): ReactRouter.Route; + + // for RouteHandler + function createElement( + type: ReactRouter.RouteHandlerClass, + props: ReactRouter.RouteHandlerProp, + ...children: __React.ReactNode[]): ReactRouter.RouteHandler; +} diff --git a/react-router/react-router-tests.tsx b/react-router/react-router-tests.tsx new file mode 100644 index 000000000..4c2abc7ef --- /dev/null +++ b/react-router/react-router-tests.tsx @@ -0,0 +1,67 @@ + +/// +/// +/// + + +import * as React from "react"; + +import { Router, Route, IndexRoute, Link } from "react-router"; + +import createHistory from "history/lib/createBrowserHistory" + + +class Master extends React.Component, {}> { + + render() { + return
+

Master

+ Dashboard Users +

{this.props.children}

+
+ } + +} + + +class Dashboard extends React.Component<{}, {}> { + + render() { + return
+ This is a dashboard +
+ } + +} + +class NotFound extends React.Component<{}, {}> { + + render() { + return
+ This path does not exists +
+ } + +} + + +class Users extends React.Component<{}, {}> { + + render() { + return
+ This is a user list +
+ } + +} + + +React.render(( + + + + + + + +), document.body) diff --git a/react-router/react-router-tests.tsx.tscparams b/react-router/react-router-tests.tsx.tscparams new file mode 100644 index 000000000..f47983778 --- /dev/null +++ b/react-router/react-router-tests.tsx.tscparams @@ -0,0 +1 @@ +--noImplicitAny -jsx react --target es5 \ No newline at end of file diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index c96fe284d..2a6445a3f 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -26,16 +26,16 @@ declare namespace ReactRouter { type RedirectFunction = (state: H.LocationState, pathname: H.Pathname | H.Path, query?: H.Query) => void - interface RouteComponentProps { + interface RouteComponentProps { history?: History location?: Location - params?: Params + params?: P route?: PlainRoute - routeParams?: Params + routeParams?: R routes?: PlainRoute[] } - type RouteComponent = React.ComponentClass + type RouteComponent = React.ComponentClass type RouteConfig = RouteObject[] From f0d5440f90b1c40292a1c345d75bdc8656cded18 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Thu, 1 Oct 2015 11:03:39 +0300 Subject: [PATCH 05/13] Micro update of createRoutes export --- react-router/react-router.d.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index 2a6445a3f..386997876 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -280,9 +280,7 @@ declare module "react-router/lib/RouteUtils" { export function createRoutesFromReactChildren(children: E | E[], parentRoute: ReactRouter.PlainRoute): ReactRouter.PlainRoute[] - import createRoutes = ReactRouter.createRoutes - - export { createRoutes } + export import createRoutes = ReactRouter.createRoutes } From 0d64ea1b82ad1d804892ceec14d98a9be85f64fb Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Thu, 1 Oct 2015 12:31:03 +0300 Subject: [PATCH 06/13] History enhancers definitions improved using union types --- react-router/history.d.ts | 42 ++++++++++++++++++------------ react-router/react-router.d.ts | 47 +++++++++++++++++++--------------- 2 files changed, 52 insertions(+), 37 deletions(-) diff --git a/react-router/history.d.ts b/react-router/history.d.ts index c982bd229..2d88184e6 100644 --- a/react-router/history.d.ts +++ b/react-router/history.d.ts @@ -12,12 +12,13 @@ declare namespace HistoryModule { type BeforeUnloadHook = () => string - type CreateHistory = (options?: HistoryOptions) => History + type CreateHistory = (options?: HistoryOptions) => T - type CreateHistoryEnhancer = (createHistory: CreateHistory) => CreateHistory + type CreateHistoryEnhancer = (createHistory: CreateHistory) => CreateHistory - interface HistoryBase { + interface History { listenBefore(hook: TransitionHook): Function + listen(listener: LocationListener): Function transitionTo(location: Location): void pushState(state: LocationState, path: Path): void replaceState(state: LocationState, path: Path): void @@ -30,10 +31,6 @@ declare namespace HistoryModule { createHref(path: Path): Href } - interface History { - listen(listener: LocationListener): Function - } - type HistoryOptions = Object type Href = string @@ -63,17 +60,30 @@ declare namespace HistoryModule { type TransitionHook = (location: Location, callback: Function) => any + + interface HistoryBeforeUnload { + listenBeforeUnload(hook: () => string | boolean): Function + } + + interface HistoryQueries { + pushState(state: LocationState, pathname: Pathname | Path, query?: Query): void + replaceState(state: LocationState, pathname: Pathname | Path, query?: Query): void + createPath(path: Path, query?: Query): Path + createHref(path: Path, query?: Query): Href + } + + // Global usage, without modules, needs the small trick, because lib.d.ts // already has `history` and `History` global definitions: // var createHistory = ((window as any).History as HistoryModule.Module).createHistory; interface Module { - createHistory: CreateHistory - createHashHistory: CreateHistory - createMemoryHistory: CreateHistory + createHistory: CreateHistory + createHashHistory: CreateHistory + createMemoryHistory: CreateHistory createLocation(): Location - useBasename(enhancer: CreateHistoryEnhancer): CreateHistory - useBeforeUnload(enhancer: CreateHistoryEnhancer): CreateHistory - useQueries(enhancer: CreateHistoryEnhancer): CreateHistory + useBasename(createHistory: CreateHistory): CreateHistory + useBeforeUnload(createHistory: CreateHistory): CreateHistory + useQueries(createHistory: CreateHistory): CreateHistory actions: { PUSH: string REPLACE: string @@ -114,21 +124,21 @@ declare module "history/lib/createLocation" { declare module "history/lib/useBasename" { - export default function useBasename(enhancer: HistoryModule.CreateHistoryEnhancer): HistoryModule.CreateHistory + export default function useBasename(createHistory: HistoryModule.CreateHistory): HistoryModule.CreateHistory } declare module "history/lib/useBeforeUnload" { - export default function useBeforeUnload(enhancer: HistoryModule.CreateHistoryEnhancer): HistoryModule.CreateHistory + export default function useBeforeUnload(createHistory: HistoryModule.CreateHistory): HistoryModule.CreateHistory } declare module "history/lib/useQueries" { - export default function useQueries(enhancer: HistoryModule.CreateHistoryEnhancer): HistoryModule.CreateHistory + export default function useQueries(createHistory: HistoryModule.CreateHistory): HistoryModule.CreateHistory } diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index 386997876..083495404 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -16,6 +16,8 @@ declare namespace ReactRouter { type Component = React.ReactType + type Components = { [key: string]: Component } + type EnterHook = (nextState: RouterState, replaceState: RedirectFunction, callback?: Function) => any type LeaveHook = () => any @@ -47,24 +49,6 @@ declare namespace ReactRouter { type StringifyQuery = (queryObject: H.Query) => H.QueryString - - interface History extends H.HistoryBase { - pushState(state: H.LocationState, pathname: H.Pathname | H.Path, query?: H.Query): void - replaceState(state: H.LocationState, pathname: H.Pathname | H.Path, query?: H.Query): void - createPath(path: H.Path, query?: H.Query): H.Path - createHref(path: H.Path, query?: H.Query): H.Href - isActive(pathname: H.Pathname, query: H.Query): boolean - registerRouteHook(route: PlainRoute, hook: H.LocationListener): void - unregisterRouteHook(route: PlainRoute, hook: H.LocationListener): void - listen(listener: RouterListener): Function - match(location: H.Location, callback: (error: any, nextState: RouterState, nextLocation: H.Location) => void): void - routes: PlainRoute[] - parseQueryString?: ParseQueryString - stringifyQuery?: StringifyQuery - } - - type RouterListener = (error: Error, nextState: RouterState) => void - interface RouterState { location: Location routes: RouteConfig @@ -72,12 +56,18 @@ declare namespace ReactRouter { components: Component[] } - type RouteType = Route | IndexRoute | PlainRoute | Redirect type RouteTypes = RouteType | RouteType[] - type Components = { [key: string]: Component } + + interface HistoryBase extends H.History { + routes: PlainRoute[] + parseQueryString?: ParseQueryString + stringifyQuery?: StringifyQuery + } + + type History = HistoryBase & H.HistoryQueries & HistoryRoutes interface RouterProps { @@ -179,10 +169,22 @@ declare namespace ReactRouter { const History: React.Mixin - function useRoutes(enhancer: H.CreateHistoryEnhancer): H.CreateHistory + type RouterListener = (error: Error, nextState: RouterState) => void + + interface HistoryRoutes { + isActive(pathname: H.Pathname, query: H.Query): boolean + registerRouteHook(route: PlainRoute, hook: H.LocationListener): void + unregisterRouteHook(route: PlainRoute, hook: H.LocationListener): void + listen(listener: RouterListener): Function + match(location: H.Location, callback: (error: any, nextState: RouterState, nextLocation: H.Location) => void): void + } + + function useRoutes(createHistory: HistoryModule.CreateHistory): HistoryModule.CreateHistory + function createRoutes(routes: RouteTypes): PlainRoute[] + interface MatchArgs { routes?: RouteTypes history?: H.History @@ -345,6 +347,8 @@ declare module "react-router" { import RouteContext from "react-router/lib/RouteContext" + import useRoutes from "react-router/lib/useRoutes" + import { createRoutes } from "react-router/lib/RouteUtils" import RoutingContext from "react-router/lib/RoutingContext" @@ -362,6 +366,7 @@ declare module "react-router" { History, Lifecycle, RouteContext, + useRoutes, createRoutes, RoutingContext, PropTypes, From c5179cd689fbd58f3ba0e9d8337caaac202843ed Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Mon, 16 Nov 2015 19:02:38 +0200 Subject: [PATCH 07/13] update definitions to history v1.13.1 --- react-router/history.d.ts | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/react-router/history.d.ts b/react-router/history.d.ts index 2d88184e6..4fd7c5a0f 100644 --- a/react-router/history.d.ts +++ b/react-router/history.d.ts @@ -1,4 +1,4 @@ -// Type definitions for history v1.11.1 +// Type definitions for history v1.13.1 // Project: https://github.com/rackt/history // Definitions by: Sergey Buturlakin // Definitions: https://github.com/borisyankov/DefinitelyTyped @@ -22,13 +22,14 @@ declare namespace HistoryModule { transitionTo(location: Location): void pushState(state: LocationState, path: Path): void replaceState(state: LocationState, path: Path): void - setState(state: LocationState): void + setState(state: LocationState): void // deprecated go(n: number): void goBack(): void goForward(): void createKey(): LocationKey createPath(path: Path): Path createHref(path: Path): Href + createLocation(path?: Path, state?: LocationState, action?: Action, key?: LocationKey): Location } type HistoryOptions = Object @@ -80,7 +81,7 @@ declare namespace HistoryModule { createHistory: CreateHistory createHashHistory: CreateHistory createMemoryHistory: CreateHistory - createLocation(): Location + createLocation(path?: Path, state?: LocationState, action?: Action, key?: LocationKey): Location useBasename(createHistory: CreateHistory): CreateHistory useBeforeUnload(createHistory: CreateHistory): CreateHistory useQueries(createHistory: CreateHistory): CreateHistory @@ -117,7 +118,7 @@ declare module "history/lib/createMemoryHistory" { declare module "history/lib/createLocation" { - export default function createLocation(): HistoryModule.Location + export default function createLocation(path?: HistoryModule.Path, state?: HistoryModule.LocationState, action?: HistoryModule.Action, key?: HistoryModule.LocationKey): HistoryModule.Location } From 91e9c035e1968ec4d07e095968db5acdb3a79388 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Thu, 19 Nov 2015 14:15:44 +0200 Subject: [PATCH 08/13] update to React Router v1.0.0 --- react-router/react-router.d.ts | 185 +++++++++++++++++++++------------ 1 file changed, 116 insertions(+), 69 deletions(-) diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index 083495404..42a524a96 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -1,22 +1,22 @@ -// Type definitions for react-router v1.0.0-rc1 +// Type definitions for react-router v1.0.0 // Project: https://github.com/rackt/react-router -// Definitions by: Sergey Buturlakin +// Definitions by: Sergey Buturlakin , Yuichi Murata , Václav Ostrožlík // Definitions: https://github.com/borisyankov/DefinitelyTyped -/// +/// /// declare namespace ReactRouter { - // types based on https://github.com/rackt/react-router/blob/master/docs/Glossary.md + import React = __React import H = HistoryModule - type Component = React.ReactType + // types based on https://github.com/rackt/react-router/blob/master/docs/Glossary.md - type Components = { [key: string]: Component } + type Component = React.ReactType type EnterHook = (nextState: RouterState, replaceState: RedirectFunction, callback?: Function) => any @@ -28,38 +28,44 @@ declare namespace ReactRouter { type RedirectFunction = (state: H.LocationState, pathname: H.Pathname | H.Path, query?: H.Query) => void + type RouteComponent = Component + + // use the following interface in an app code to get access to route param values, history, location... + // interface MyComponentProps extends ReactRouter.RouteComponentProps<{}, { id: number }> {} + // somewhere in MyComponent + // ... + // let id = this.props.routeParams.id + // ... + // this.props.history. ... + // ... interface RouteComponentProps { history?: History - location?: Location + location?: H.Location params?: P route?: PlainRoute routeParams?: R routes?: PlainRoute[] } - type RouteComponent = React.ComponentClass + type RouteComponents = { [key: string]: RouteComponent } - type RouteConfig = RouteObject[] + type RouteConfig = React.ReactNode | PlainRoute | PlainRoute[] - type RouteHook = (nextLocation?: Location) => any + type RouteHook = (nextLocation?: H.Location) => any type RoutePattern = string - type RouteObject = PlainRoute - type StringifyQuery = (queryObject: H.Query) => H.QueryString + type RouterListener = (error: Error, nextState: RouterState) => void + interface RouterState { - location: Location - routes: RouteConfig + location: H.Location + routes: PlainRoute[] params: Params - components: Component[] + components: RouteComponent[] } - type RouteType = Route | IndexRoute | PlainRoute | Redirect - - type RouteTypes = RouteType | RouteType[] - interface HistoryBase extends H.History { routes: PlainRoute[] @@ -70,11 +76,12 @@ declare namespace ReactRouter { type History = HistoryBase & H.HistoryQueries & HistoryRoutes - interface RouterProps { + /* components */ + + interface RouterProps extends React.Props { history?: H.History - children?: RouteTypes - routes?: RouteTypes // alias for children - createElement?: (component: Component, props: Object) => any + routes?: RouteConfig // alias for children + createElement?: (component: RouteComponent, props: Object) => any onError?: (err: any) => any onUpdate?: () => any parseQueryString?: ParseQueryString @@ -85,7 +92,7 @@ declare namespace ReactRouter { const Router: Router - interface LinkProps extends React.HTMLAttributesBase { + interface LinkProps extends React.HTMLAttributes, React.Props { activeStyle?: React.CSSProperties activeClassName?: string onlyActiveOnIndex?: boolean @@ -94,74 +101,93 @@ declare namespace ReactRouter { state?: H.LocationState } interface Link extends React.ComponentClass {} - interface LinkElement extends React.DOMElement {} + interface LinkElement extends React.ReactElement {} const Link: Link - interface RoutePropsBase { - children?: RouteTypes - ignoreScrollBehavior?: boolean - component?: Component - components?: Components - getComponent?: (location: Location, cb: (err: any, component?: Component) => void) => void - getComponents?: (location: Location, cb: (err: any, components?: Components) => void) => void + const IndexLink: Link + + + interface RoutingContextProps extends React.Props { + history: H.History + createElement: (component: RouteComponent, props: Object) => any + location: H.Location + routes: RouteConfig + params: Params + components?: RouteComponent[] + } + interface RoutingContext extends React.ComponentClass {} + interface RoutingContextElement extends React.ReactElement {} + const RoutingContext: RoutingContext + + + /* components (configuration) */ + + interface RouteProps extends React.Props { + path?: RoutePattern + component?: RouteComponent + components?: RouteComponents + getComponent?: (location: H.Location, cb: (err: any, component?: RouteComponent) => void) => void + getComponents?: (location: H.Location, cb: (err: any, components?: RouteComponents) => void) => void onEnter?: EnterHook onLeave?: LeaveHook } - - interface RouteProps extends RoutePropsBase { - path?: RoutePattern - } interface Route extends React.ComponentClass {} interface RouteElement extends React.ReactElement {} const Route: Route - interface PlainRoute extends RouteProps { - childRoutes: RouteTypes - getChildRoutes: (location: Location, cb: (err: any, routesArray: RouteTypes) => void) => void + interface PlainRoute { + path?: RoutePattern + component?: RouteComponent + components?: RouteComponents + getComponent?: (location: H.Location, cb: (err: any, component?: RouteComponent) => void) => void + getComponents?: (location: H.Location, cb: (err: any, components?: RouteComponents) => void) => void + onEnter?: EnterHook + onLeave?: LeaveHook + indexRoute?: PlainRoute + getIndexRoute?: (location: H.Location, cb: (err: any, indexRoute: RouteConfig) => void) => void + childRoutes?: PlainRoute[] + getChildRoutes?: (location: H.Location, cb: (err: any, childRoutes: RouteConfig) => void) => void } - interface RedirectProps { + interface RedirectProps extends React.Props { path?: RoutePattern from?: RoutePattern // alias for path to: RoutePattern query?: H.Query state?: H.LocationState } - interface Redirect extends React.ReactElement {} + interface Redirect extends React.ComponentClass {} interface RedirectElement extends React.ReactElement {} const Redirect: Redirect - interface IndexRouteProps extends RoutePropsBase {} + interface IndexRouteProps extends React.Props { + component?: RouteComponent + components?: RouteComponents + getComponent?: (location: H.Location, cb: (err: any, component?: RouteComponent) => void) => void + getComponents?: (location: H.Location, cb: (err: any, components?: RouteComponents) => void) => void + onEnter?: EnterHook + onLeave?: LeaveHook + } interface IndexRoute extends React.ComponentClass {} interface IndexRouteElement extends React.ReactElement {} const IndexRoute: IndexRoute - interface RoutingContextProps { - history: H.History - createElement?: (component: Component, props: Object) => any - location: Location - routes: RouteTypes - params: Params - components?: Components + interface IndexRedirectProps extends React.Props { + to: RoutePattern + query?: H.Query + state?: H.LocationState } - interface RoutingContext extends React.ReactElement {} - interface RoutingContextElement extends React.ReactElement {} - const RoutingContext: RoutingContext + interface IndexRedirect extends React.ComponentClass {} + interface IndexRedirectElement extends React.ReactElement {} + const IndexRedirect: IndexRedirect - interface LifecycleMixin { - routerWillLeave(nextLocation: Location): string | boolean - } - const Lifecycle: React.Mixin - - - const RouteContext: React.Mixin - + /* mixins */ interface HistoryMixin { history: History @@ -169,12 +195,21 @@ declare namespace ReactRouter { const History: React.Mixin - type RouterListener = (error: Error, nextState: RouterState) => void + interface LifecycleMixin { + routerWillLeave(nextLocation: H.Location): string | boolean + } + const Lifecycle: React.Mixin + + + const RouteContext: React.Mixin + + + /* utils */ interface HistoryRoutes { isActive(pathname: H.Pathname, query: H.Query): boolean - registerRouteHook(route: PlainRoute, hook: H.LocationListener): void - unregisterRouteHook(route: PlainRoute, hook: H.LocationListener): void + registerRouteHook(route: PlainRoute, hook: RouteHook): void + unregisterRouteHook(route: PlainRoute, hook: RouteHook): void listen(listener: RouterListener): Function match(location: H.Location, callback: (error: any, nextState: RouterState, nextLocation: H.Location) => void): void } @@ -182,13 +217,13 @@ declare namespace ReactRouter { function useRoutes(createHistory: HistoryModule.CreateHistory): HistoryModule.CreateHistory - function createRoutes(routes: RouteTypes): PlainRoute[] + function createRoutes(routes: RouteConfig): PlainRoute[] interface MatchArgs { - routes?: RouteTypes + routes?: RouteConfig history?: H.History - location?: Location + location?: H.Location parseQueryString?: ParseQueryString stringifyQuery?: StringifyQuery } @@ -216,9 +251,14 @@ declare module "react-router/lib/Link" { declare module "react-router/lib/IndexLink" { - const IndexLink: ReactRouter.Link + export default ReactRouter.IndexLink - export default IndexLink +} + + +declare module "react-router/lib/IndexRedirect" { + + export default ReactRouter.IndexRedirect } @@ -274,7 +314,7 @@ declare module "react-router/lib/useRoutes" { declare module "react-router/lib/RouteUtils" { - type E = React.ReactElement + type E = __React.ReactElement export function isReactChildren(object: E | E[]): boolean @@ -296,6 +336,8 @@ declare module "react-router/lib/RoutingContext" { declare module "react-router/lib/PropTypes" { + import React = __React + export function falsy(props: any, propName: string, componentName: string): Error; export const history: React.Requireable @@ -335,6 +377,10 @@ declare module "react-router" { import Link from "react-router/lib/Link" + import IndexLink from "react-router/lib/IndexLink" + + import IndexRedirect from "react-router/lib/IndexRedirect" + import IndexRoute from "react-router/lib/IndexRoute" import Redirect from "react-router/lib/Redirect" @@ -361,6 +407,7 @@ declare module "react-router" { Router, Link, IndexRoute, + IndexRedirect, Redirect, Route, History, From 9962a6144e28da747849dcdf0709a1e4f1960bf1 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Thu, 19 Nov 2015 19:13:28 +0200 Subject: [PATCH 09/13] add IndexLink to the default export --- react-router/react-router.d.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index 42a524a96..c36376077 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -406,8 +406,9 @@ declare module "react-router" { export { Router, Link, - IndexRoute, + IndexLink, IndexRedirect, + IndexRoute, Redirect, Route, History, From 8dedcf938ab0090ee04a5e4ba27abfbef575085a Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Thu, 19 Nov 2015 19:45:21 +0200 Subject: [PATCH 10/13] update tests --- react-router/react-router-tests.ts | 398 ---------------------------- react-router/react-router-tests.tsx | 10 +- 2 files changed, 6 insertions(+), 402 deletions(-) delete mode 100644 react-router/react-router-tests.ts diff --git a/react-router/react-router-tests.ts b/react-router/react-router-tests.ts deleted file mode 100644 index 7c80d740a..000000000 --- a/react-router/react-router-tests.ts +++ /dev/null @@ -1,398 +0,0 @@ -/// -/// -"use strict"; - -import React = require('react'); -import ReactDOM = require('react-dom'); -import Router = require('react-router'); - -// Mixin -class NavigationTest { - v: T; - - makePath() { - var v1: string = this.v.makePath('to'); - var v2: string = this.v.makePath('to', {id: 1}); - var v3: string = this.v.makePath('to', {id: 1}, {type: 'json'}); - } - makeHref() { - var v1: string = this.v.makeHref('to'); - var v2: string = this.v.makeHref('to', {id: 1}); - var v3: string = this.v.makeHref('to', {id: 1}, {type: 'json'}); - } - transitionTo() { - var v1: void = this.v.transitionTo('to'); - var v2: void = this.v.transitionTo('to', {id: 1}); - var v3: void = this.v.transitionTo('to', {id: 1}, {type: 'json'}); - } - replaceWith() { - var v1: void = this.v.replaceWith('to'); - var v2: void = this.v.replaceWith('to', {id: 1}); - var v3: void = this.v.replaceWith('to', {id: 1}, {type: 'json'}); - } - goBack() { - var v1: void = this.v.goBack(); - } -} - -class StateTest { - v: T; - - getPath() { - var v1: string = this.v.getPath(); - } - - getRoutes() { - var v1: Router.Route[] = this.v.getRoutes(); - } - - getPathname() { - var v1: string = this.v.getPathname(); - } - - getParams() { - var v1: {} = this.v.getParams(); - } - - getQuery() { - var v1: {} = this.v.getQuery(); - } - - isActive() { - var v1: boolean = this.v.isActive('to'); - var v2: boolean = this.v.isActive('to', {id: 1}); - var v3: boolean = this.v.isActive('to', {id: 1}, {type: 'json'}); - } -} - - -// Location -class LocationTest { - v: T; - - push() { - var v1: void = this.v.push('path/to/hoge'); - } - - replace() { - var v1: void = this.v.replace('path/to/hoge'); - } - - pop() { - var v1: void = this.v.pop(); - } - - getCurrentPath() { - var v1: void = this.v.getCurrentPath(); - } -} -new LocationTest(); -new LocationTest(); -new LocationTest(); - -class LocationListenerTest { - v: T; - - addChangeListener() { - var v1: void = this.v.addChangeListener(() => console.log(1)); - } - - removeChangeListener() { - var v1: void = this.v.removeChangeListener(() => console.log(1)); - } -} -new LocationListenerTest(); -new LocationListenerTest(); - - -// Behavior -class ScrollBehaviorTest { - v: T; - - updateScrollPosition() { - var v1: void = this.v.updateScrollPosition({x: 33, y: 102}, 'scrollTop'); - } -} -new ScrollBehaviorTest(); -new ScrollBehaviorTest(); - - -// Component -class DefaultRouteTest { - v: Router.DefaultRoute; - - props() { - var name: string = this.v.props.name; - var handler: React.ComponentClass = this.v.props.handler; - } - - createElement() { - var Handler: React.ComponentClass; - React.createElement(Router.DefaultRoute, null); - React.createElement(Router.DefaultRoute, {name: 'name', handler: Handler}); - } -} - -class LinkTest { - v: Router.Link; - - constructor() { - new NavigationTest(); - new StateTest(); - } - - props() { - var activeClassName: string = this.v.props.activeClassName; - var to: string = this.v.props.to; - var params: {} = this.v.props.params; - var query: {} = this.v.props.query; - var onClick: Function = this.v.props.onClick; - } - - getHref() { - var v1: string = this.v.getHref(); - } - - getClassName() { - var v1: string = this.v.getClassName(); - } - - createElement() { - React.createElement(Router.Link, null); - React.createElement(Router.Link, {to: 'home'}); - React.createElement(Router.Link, { - activeClassName: 'name', - to: 'home', - params: {}, - query: {}, - onClick: () => console.log(1) - }); - } -} - -class NotFoundRouteTest { - v: Router.NotFoundRoute; - - props() { - var name: string = this.v.props.name; - var handler: React.ComponentClass = this.v.props.handler; - } - - createElement() { - var Handler: React.ComponentClass; - React.createElement(Router.NotFoundRoute, null); - React.createElement(Router.NotFoundRoute, {handler: Handler}); - React.createElement(Router.NotFoundRoute, {handler: Handler, name: "home"}); - } -} - -class RedirectTest { - v: Router.Redirect; - - props() { - var path: string = this.v.props.path; - var from: string = this.v.props.from; - var to: string = this.v.props.to; - } - - createElement() { - React.createElement(Router.Redirect, null); - React.createElement(Router.Redirect, {}); - React.createElement(Router.Redirect, {path: 'a', from: 'a', to: 'b'}); - } -} - -class RouteTest { - v: Router.Route; - - props() { - var name: string = this.v.props.name; - var path: string = this.v.props.path; - var handler: React.ComponentClass = this.v.props.handler; - var ignoreScrollBehavior: boolean = this.v.props.ignoreScrollBehavior; - } - - createElement() { - var Handler: React.ComponentClass; - React.createElement(Router.Route, null); - React.createElement(Router.Route, {}); - React.createElement(Router.Route, {name: "home", path: "/", handler: Handler, ignoreScrollBehavior: true}); - } -} - -class RouteHandlerTest { - v: Router.RouteHandler; - - createElement() { - React.createElement(Router.RouteHandler, null); - React.createElement(Router.RouteHandler, {}); - } -} - - -// History -class HistoryTest { - v: Router.History; - - length() { - var v1: number = this.v.length; - } - - back() { - var v1: void = this.v.back(); - } -} - - -// Router -class CreateTest { - v: Router.Router; - - constructor() { - // React.createElement() version - this.v = Router.create({ - routes: React.createElement(Router.Route, null) - }); - this.v = Router.create({ - routes: React.createElement(Router.Route, null), - location: Router.HistoryLocation, - scrollBehavior: Router.ImitateBrowserBehavior - }); - - // React.createFactory() version - this.v = Router.create({ - routes: React.createFactory(Router.Route)() - }); - this.v = Router.create({ - routes: React.createFactory(Router.Route)(), - location: Router.HistoryLocation, - scrollBehavior: Router.ImitateBrowserBehavior - }); - } - - run() { - this.v.run((Handler) => console.log(Handler)); - this.v.run((Handler, state) => console.log(Handler, state)); - } -} - -class RunTest { - constructor() { - // React.createElement() version - var v1: Router.Router = Router.run(React.createElement(Router.Route, null), (Handler) => { - ReactDOM.render(React.createElement(Handler, null), document.body); - }); - var v2: Router.Router = Router.run(React.createElement(Router.Route, null), Router.HistoryLocation, (Handler, state) => { - ReactDOM.render(React.createElement(Handler, null), document.body); - }); - var v3: Router.Router = Router.run(React.createElement(Router.Route, null), '/foo/bar', (Handler, state) => { - ReactDOM.render(React.createElement(Handler, null), document.body); - }); - - // React.createFactory() version - var v4: Router.Router = Router.run(React.createFactory(Router.Route)(), (Handler) => { - ReactDOM.render(React.createElement(Handler, null), document.body); - }); - var v5: Router.Router = Router.run(React.createFactory(Router.Route)(), Router.HistoryLocation, (Handler, state) => { - ReactDOM.render(React.createElement(Handler, null), document.body); - }); - var v6: Router.Router = Router.run(React.createFactory(Router.Route)(), '/foo/bar', (Handler, state) => { - ReactDOM.render(React.createElement(Handler, null), document.body); - }); - } -} - - -// Transition -class TransitionTest { - constructor() { - var v1: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition, params, query, callback) => { - transition.abort(); - transition.redirect('to'); - transition.redirect('to', {id: 1}); - transition.redirect('to', {id: 1}, {type: 'json'}); - transition.retry(); - }, - willTransitionFrom: (transition, component, callback) => {} - }; - var v2: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition, params, query) => {}, - willTransitionFrom: (transition, component) => {} - }; - var v3: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition, params) => {}, - willTransitionFrom: (transition) => {} - }; - var v4: Router.TransitionStaticLifecycle = { - willTransitionTo: (transition) => {}, - willTransitionFrom: () => {} - }; - var v5: Router.TransitionStaticLifecycle = { - willTransitionTo: () => {} - }; - var v6: Router.TransitionStaticLifecycle = { - willTransitionFrom: () => {} - }; - } -} - - -// Context -class ContextTest { - v: Router.Context - - makePath() { - var v1: string = this.v.makePath('home'); - var v2: string = this.v.makePath('home', {p1: 1}); - var v3: string = this.v.makePath('home', {p1: 1}, {q1: 1}); - } - - makeHref() { - var v1: string = this.v.makeHref('home'); - var v2: string = this.v.makeHref('home', {p1: 1}); - var v3: string = this.v.makeHref('home', {p1: 1}, {q1: 1}); - } - - transitionTo() { - var v1: void = this.v.transitionTo('home'); - var v2: void = this.v.transitionTo('home', {p1: 1}); - var v3: void = this.v.transitionTo('home', {p1: 1}, {q1: 1}); - } - - replaceWith() { - var v1: void = this.v.replaceWith('home'); - var v2: void = this.v.replaceWith('home', {p1: 1}); - var v3: void = this.v.replaceWith('home', {p1: 1}, {q1: 1}); - } - - goBack() { - var v: void = this.v.goBack(); - } - - getCurrentPath() { - var v: string = this.v.getCurrentPath(); - } - - getCurrentRoutes() { - var v: Router.Route[] = this.v.getCurrentRoutes(); - } - - getCurrentPathname() { - var v: string = this.v.getCurrentPathname(); - } - - getCurrentParams() { - var v: {} = this.v.getCurrentParams(); - } - - getCurrentQuery() { - var v: {} = this.v.getCurrentQuery(); - } - - isActive() { - var v1: boolean = this.v.isActive('home'); - var v2: boolean = this.v.isActive('home', {p1: 1}); - var v3: boolean = this.v.isActive('home', {p1: 1}, {q1: 1}); - } -} diff --git a/react-router/react-router-tests.tsx b/react-router/react-router-tests.tsx index 4c2abc7ef..42ee3236f 100644 --- a/react-router/react-router-tests.tsx +++ b/react-router/react-router-tests.tsx @@ -1,12 +1,14 @@ /// -/// +/// /// +/// -import * as React from "react"; +import * as React from "react" +import * as ReactDOM from "react-dom" -import { Router, Route, IndexRoute, Link } from "react-router"; +import { Router, Route, IndexRoute, Link } from "react-router" import createHistory from "history/lib/createBrowserHistory" @@ -56,7 +58,7 @@ class Users extends React.Component<{}, {}> { } -React.render(( +ReactDOM.render(( From d0e0aacb36bb7d0706fc06a75fe7c1f9bca178d9 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Fri, 20 Nov 2015 11:18:51 +0200 Subject: [PATCH 11/13] add deprecated but supported methods --- react-router/history.d.ts | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/react-router/history.d.ts b/react-router/history.d.ts index 4fd7c5a0f..c527e83e8 100644 --- a/react-router/history.d.ts +++ b/react-router/history.d.ts @@ -10,7 +10,7 @@ declare namespace HistoryModule { type Action = string - type BeforeUnloadHook = () => string + type BeforeUnloadHook = () => string | boolean type CreateHistory = (options?: HistoryOptions) => T @@ -22,7 +22,6 @@ declare namespace HistoryModule { transitionTo(location: Location): void pushState(state: LocationState, path: Path): void replaceState(state: LocationState, path: Path): void - setState(state: LocationState): void // deprecated go(n: number): void goBack(): void goForward(): void @@ -30,6 +29,13 @@ declare namespace HistoryModule { createPath(path: Path): Path createHref(path: Path): Href createLocation(path?: Path, state?: LocationState, action?: Action, key?: LocationKey): Location + + /** @deprecated use location.key to save state instead */ + setState(state: LocationState): void + /** @deprecated use listenBefore instead */ + registerTransitionHook(hook: TransitionHook): void + /** @deprecated use the callback returned from listenBefore instead */ + unregisterTransitionHook(hook: TransitionHook): void } type HistoryOptions = Object @@ -63,7 +69,7 @@ declare namespace HistoryModule { interface HistoryBeforeUnload { - listenBeforeUnload(hook: () => string | boolean): Function + listenBeforeUnload(hook: BeforeUnloadHook): Function } interface HistoryQueries { From 51cd044cad5888e46d6a3fa6374a90b19a0feedf Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Fri, 20 Nov 2015 11:20:02 +0200 Subject: [PATCH 12/13] update useRoutes history enhancer result interface --- react-router/react-router.d.ts | 23 +++++++++++------------ 1 file changed, 11 insertions(+), 12 deletions(-) diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index c36376077..7063d2ab6 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -82,7 +82,7 @@ declare namespace ReactRouter { history?: H.History routes?: RouteConfig // alias for children createElement?: (component: RouteComponent, props: Object) => any - onError?: (err: any) => any + onError?: (error: any) => any onUpdate?: () => any parseQueryString?: ParseQueryString stringifyQuery?: StringifyQuery @@ -127,8 +127,8 @@ declare namespace ReactRouter { path?: RoutePattern component?: RouteComponent components?: RouteComponents - getComponent?: (location: H.Location, cb: (err: any, component?: RouteComponent) => void) => void - getComponents?: (location: H.Location, cb: (err: any, components?: RouteComponents) => void) => void + getComponent?: (location: H.Location, cb: (error: any, component?: RouteComponent) => void) => void + getComponents?: (location: H.Location, cb: (error: any, components?: RouteComponents) => void) => void onEnter?: EnterHook onLeave?: LeaveHook } @@ -141,14 +141,14 @@ declare namespace ReactRouter { path?: RoutePattern component?: RouteComponent components?: RouteComponents - getComponent?: (location: H.Location, cb: (err: any, component?: RouteComponent) => void) => void - getComponents?: (location: H.Location, cb: (err: any, components?: RouteComponents) => void) => void + getComponent?: (location: H.Location, cb: (error: any, component?: RouteComponent) => void) => void + getComponents?: (location: H.Location, cb: (error: any, components?: RouteComponents) => void) => void onEnter?: EnterHook onLeave?: LeaveHook indexRoute?: PlainRoute - getIndexRoute?: (location: H.Location, cb: (err: any, indexRoute: RouteConfig) => void) => void + getIndexRoute?: (location: H.Location, cb: (error: any, indexRoute: RouteConfig) => void) => void childRoutes?: PlainRoute[] - getChildRoutes?: (location: H.Location, cb: (err: any, childRoutes: RouteConfig) => void) => void + getChildRoutes?: (location: H.Location, cb: (error: any, childRoutes: RouteConfig) => void) => void } @@ -167,8 +167,8 @@ declare namespace ReactRouter { interface IndexRouteProps extends React.Props { component?: RouteComponent components?: RouteComponents - getComponent?: (location: H.Location, cb: (err: any, component?: RouteComponent) => void) => void - getComponents?: (location: H.Location, cb: (err: any, components?: RouteComponents) => void) => void + getComponent?: (location: H.Location, cb: (error: any, component?: RouteComponent) => void) => void + getComponents?: (location: H.Location, cb: (error: any, components?: RouteComponents) => void) => void onEnter?: EnterHook onLeave?: LeaveHook } @@ -207,11 +207,10 @@ declare namespace ReactRouter { /* utils */ interface HistoryRoutes { - isActive(pathname: H.Pathname, query: H.Query): boolean - registerRouteHook(route: PlainRoute, hook: RouteHook): void - unregisterRouteHook(route: PlainRoute, hook: RouteHook): void listen(listener: RouterListener): Function + listenBeforeLeavingRoute(route: PlainRoute, hook: RouteHook): void match(location: H.Location, callback: (error: any, nextState: RouterState, nextLocation: H.Location) => void): void + isActive(pathname: H.Pathname, query?: H.Query, indexOnly?: boolean): boolean } function useRoutes(createHistory: HistoryModule.CreateHistory): HistoryModule.CreateHistory From 99f6493ffb1ef5479c6154ec9f82a47178bbf8b6 Mon Sep 17 00:00:00 2001 From: Sergey Buturlakin Date: Fri, 20 Nov 2015 11:31:28 +0200 Subject: [PATCH 13/13] add push and replace methods --- react-router/history.d.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/react-router/history.d.ts b/react-router/history.d.ts index c527e83e8..1b5c6dfad 100644 --- a/react-router/history.d.ts +++ b/react-router/history.d.ts @@ -22,6 +22,8 @@ declare namespace HistoryModule { transitionTo(location: Location): void pushState(state: LocationState, path: Path): void replaceState(state: LocationState, path: Path): void + push(path: Path): void + replace(path: Path): void go(n: number): void goBack(): void goForward(): void