From 403894c47328ead23d90b576d564558fda447dd2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Va=CC=81clav=20Ostroz=CC=8Cli=CC=81k?= Date: Wed, 20 May 2015 21:54:16 +0200 Subject: [PATCH] React-router 0.13 support --- react-router/react-router-test.ts | 86 ++--- react-router/react-router.d.ts | 559 +++++++++++++++--------------- 2 files changed, 324 insertions(+), 321 deletions(-) diff --git a/react-router/react-router-test.ts b/react-router/react-router-test.ts index 41b352af3..fa335e934 100644 --- a/react-router/react-router-test.ts +++ b/react-router/react-router-test.ts @@ -7,7 +7,7 @@ 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}); @@ -35,27 +35,27 @@ class NavigationTest { 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}); @@ -63,35 +63,23 @@ class StateTest { } } -class RouteHandlerMixinTest { - v: T; - - getRouteDepth() { - var v1: number = this.v.getRouteDepth(); - } - - createChildRouteHandler() { - var v1: Router.RouteHandler = this.v.createChildRouteHandler({ref: 'hoge'}); - } -} - // Location -class LocationTest { +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(); } @@ -102,11 +90,11 @@ 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)); } @@ -118,7 +106,7 @@ new LocationListenerTest(); // Behavior class ScrollBehaviorTest { v: T; - + updateScrollPosition() { var v1: void = this.v.updateScrollPosition({x: 33, y: 102}, 'scrollTop'); } @@ -130,12 +118,12 @@ 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); @@ -145,12 +133,12 @@ class DefaultRouteTest { 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; @@ -158,15 +146,15 @@ class LinkTest { 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'}); @@ -182,12 +170,12 @@ class LinkTest { 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); @@ -198,13 +186,13 @@ class NotFoundRouteTest { 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, {}); @@ -214,14 +202,14 @@ class RedirectTest { 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); @@ -232,11 +220,7 @@ class RouteTest { class RouteHandlerTest { v: Router.RouteHandler; - - constructor() { - new RouteHandlerMixinTest(); - } - + createElement() { React.createElement(Router.RouteHandler, null); React.createElement(Router.RouteHandler, {}); @@ -247,11 +231,11 @@ class RouteHandlerTest { // History class HistoryTest { v: Router.History; - + length() { var v1: number = this.v.length; } - + back() { var v1: void = this.v.back(); } @@ -261,7 +245,7 @@ class HistoryTest { // Router class CreateTest { v: Router.Router; - + constructor() { // React.createElement() version this.v = Router.create({ @@ -272,7 +256,7 @@ class CreateTest { location: Router.HistoryLocation, scrollBehavior: Router.ImitateBrowserBehavior }); - + // React.createFactory() version this.v = Router.create({ routes: React.createFactory(Router.Route)() @@ -283,7 +267,7 @@ class CreateTest { scrollBehavior: Router.ImitateBrowserBehavior }); } - + run() { this.v.run((Handler) => console.log(Handler)); this.v.run((Handler, state) => console.log(Handler, state)); @@ -299,7 +283,7 @@ class RunTest { var v2: Router.Router = Router.run(React.createElement(Router.Route, null), Router.HistoryLocation, (Handler, state) => { React.render(React.createElement(Handler, null), document.body); }); - + // React.createFactory() version var v3: Router.Router = Router.run(React.createFactory(Router.Route)(), (Handler) => { React.render(React.createElement(Handler, null), document.body); diff --git a/react-router/react-router.d.ts b/react-router/react-router.d.ts index 58ec9069a..c02892ffe 100644 --- a/react-router/react-router.d.ts +++ b/react-router/react-router.d.ts @@ -1,278 +1,297 @@ -// Type definitions for React Router 0.12.0 +// Type definitions for React Router 0.13.3 // Project: https://github.com/rackt/react-router -// Definitions by: Yuichi Murata +// Definitions by: Yuichi Murata , Václav Ostrožlík // Definitions: https://github.com/borisyankov/DefinitelyTyped -/// +/// -declare module ReactRouter { - // - // 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 RouteHandlerMixin { - getRouteDepth(): number; - createChildRouteHandler(props: {}): RouteHandler; - } - - interface State { - getPath(): string; - getRoutes(): Route[]; - getPathname(): string; - getParams(): {}; - getQuery(): {}; - isActive(to: string, params?: {}, query?: {}): boolean; - } - - var Navigation: Navigation; - var State: State; - var RouteHandlerMixin: RouteHandlerMixin; - - - // - // Component - // ---------------------------------------------------------------------- - // DefaultRoute - interface DefaultRouteProp { - name?: string; - handler: React.ComponentClass; - } - interface DefaultRoute extends React.ReactElement { - __react_router_default_route__: any; // dummy - } - interface DefaultRouteClass extends React.ComponentClass { - __react_router_default_route__: any; // dummy - } - - // Link - interface LinkProp { - activeClassName?: string; - to: string; - params?: {}; - query?: {}; - onClick?: Function; - } - interface Link extends React.ReactElement, Navigation, State { - __react_router_link__: any; // dummy - - getHref(): string; - getClassName(): string; - } - interface LinkClass extends React.ComponentClass { - __react_router_link__: any; // dummy - } - - // NotFoundRoute - interface NotFoundRouteProp { - name?: string; - handler: React.ComponentClass; - } - interface NotFoundRoute extends React.ReactElement { - __react_router_not_found_route__: any; // dummy - } - interface NotFoundRouteClass extends React.ComponentClass { - __react_router_not_found_route__: any; // dummy - } - - // Redirect - interface RedirectProp { - path?: string; - from?: string; - to?: string; - } - interface Redirect extends React.ReactElement { - __react_router_redirect__: any; // dummy - } - interface RedirectClass extends React.ComponentClass { - __react_router_redirect__: any; // dummy - } - - // Route - interface RouteProp { - name?: string; - path?: string; - handler?: React.ComponentClass; - ignoreScrollBehavior?: boolean; - } - interface Route extends React.ReactElement { - __react_router_route__: any; // dummy - } - interface RouteClass extends React.ComponentClass { - __react_router_route__: any; // dummy - } - - // RouteHandler - interface RouteHandlerProp {} - interface RouteHandler extends React.ReactElement, RouteHandlerMixin { - __react_router_route_handler__: any; // dummy - } - interface RouteHandlerClass extends React.ReactElement { - __react_router_route_handler__: any; // dummy - } - - var DefaultRoute: DefaultRouteClass; - var Link: LinkClass; - var NotFoundRoute: NotFoundRouteClass; - var Redirect: RedirectClass; - var Route: RouteClass; - var RouteHandler: RouteHandlerClass; - - - // - // Location - // ---------------------------------------------------------------------- - interface LocationBase { - push(path: string): void; - replace(path: string): void; - pop(): void; - getCurrentPath(): void; - } - - interface LocationListener { - addChangeListener(listener: Function): void; - removeChangeListener(listener: Function): void; - } - - interface HashLocation extends LocationBase, LocationListener {} - interface HistoryLocation extends LocationBase, LocationListener {} - interface RefreshLocation extends LocationBase {} - - var HashLocation: HashLocation; - var HistoryLocation: HistoryLocation; - var RefreshLocation: RefreshLocation; - - - // - // 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; - - - // - // Router - // ---------------------------------------------------------------------- - interface Router extends React.ReactElement { - run(callback: RouterRunCallback): void; - } - - interface RouterState { - path: string; - action: string; - pathname: string; - params: {}; - query: {}; - routes : Route[]; - } - - interface RouterCreateOption { - routes: React.ReactElement; - location?: LocationBase; - scrollBehavior?: ScrollBehaviorBase; - } - - type RouterRunCallback = (Handler: Router, state: RouterState) => void; - - function create(options: RouterCreateOption): Router; - function run(routes: React.ReactElement, callback: RouterRunCallback): Router; - function run(routes: React.ReactElement, location: LocationBase, callback: RouterRunCallback): Router; - - - // - // History - // ---------------------------------------------------------------------- - interface History { - back(): void; - length: number; - } - var History: History; - - - // - // Transition - // ---------------------------------------------------------------------- - interface Transition { - abort(): void; - redirect(to: string, params?: {}, query?: {}): void; - retry(): void; - } - - interface TransitionStaticLifecycle { - willTransitionTo?( - transition: Transition, - params: {}, - query: {}, - callback: Function - ): void; - - willTransitionFrom?( - transition: Transition, - component: React.ReactElement, - callback: Function - ): void; - } +declare module "react-router" { + + import React = require("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 { + activeClassName?: string; + activeStyle?: {}; + to: string; + params?: {}; + query?: {}; + onClick?: Function; + } + 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.ReactElement {} + + 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, 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; } -declare module 'react-router' { - import Export = ReactRouter; - export = Export; -} -declare module React { - interface TopLevelAPI { - // for DefaultRoute - createElement( - type: ReactRouter.DefaultRouteClass, - props: ReactRouter.DefaultRouteProp, - ...children: ReactNode[] - ): ReactRouter.DefaultRoute; - - // for Link - createElement( - type: ReactRouter.LinkClass, - props: ReactRouter.LinkProp, - ...children: ReactNode[] - ): ReactRouter.Link; - - // for NotFoundRoute - createElement( - type: ReactRouter.NotFoundRouteClass, - props: ReactRouter.NotFoundRouteProp, - ...children: ReactNode[] - ): ReactRouter.NotFoundRoute; - - // for Redirect - createElement( - type: ReactRouter.RedirectClass, - props: ReactRouter.RedirectProp, - ...children: ReactNode[] - ): ReactRouter.Redirect; - - // for Route - createElement( - type: ReactRouter.RouteClass, - props: ReactRouter.RouteProp, - ...children: ReactNode[] - ): ReactRouter.Route; - - // for RouteHandler - createElement( - type: ReactRouter.RouteHandlerClass, - props: ReactRouter.RouteHandlerProp, - ...children: ReactNode[] - ): ReactRouter.RouteHandler; - } +declare module "react" { + import ReactRouter = require("react-router"); + + // for DefaultRoute + function createElement( + type: ReactRouter.DefaultRouteClass, + props: ReactRouter.DefaultRouteProp, + ...children: ReactNode[]): ReactRouter.DefaultRoute; + + // for Link + function createElement( + type: ReactRouter.LinkClass, + props: ReactRouter.LinkProp, + ...children: ReactNode[]): ReactRouter.Link; + + // for NotFoundRoute + function createElement( + type: ReactRouter.NotFoundRouteClass, + props: ReactRouter.NotFoundRouteProp, + ...children: ReactNode[]): ReactRouter.NotFoundRoute; + + // for Redirect + function createElement( + type: ReactRouter.RedirectClass, + props: ReactRouter.RedirectProp, + ...children: ReactNode[]): ReactRouter.Redirect; + + // for Route + function createElement( + type: ReactRouter.RouteClass, + props: ReactRouter.RouteProp, + ...children: ReactNode[]): ReactRouter.Route; + + // for RouteHandler + function createElement( + type: ReactRouter.RouteHandlerClass, + props: ReactRouter.RouteHandlerProp, + ...children: ReactNode[]): ReactRouter.RouteHandler; }