kylefang/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/zhigang1992/DefinitelyTyped.git synced 2026-06-06 06:19:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #24471 from timwangdev/master

Browse Source 
[react-navigation] Add back params generic and support stateless screen component.
This commit is contained in:
Nathan Shively-Sanders
2018-03-27 08:35:19 -07:00
committed by GitHub
parent 1098fe1673 40f7502a23
commit 3cbfb631b0
2 changed files with 60 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
types/react-navigation/index.d.ts vendored
View File

@@ -1,4 +1,4 @@
// Type definitions for react-navigation 1.2
// Type definitions for react-navigation 1.5
// Project: https://github.com/react-navigation/react-navigation
// Definitions by: Huhuanming <https://github.com/huhuanming>
// mhcgrq <https://github.com/mhcgrq>
@@ -45,7 +45,6 @@ export interface HeaderProps extends NavigationSceneRendererProps {
mode: HeaderMode;
router: NavigationRouter<
NavigationState,
NavigationAction,
NavigationStackScreenOptions
>;
getScreenDetails: (navigationScene: NavigationScene) => NavigationScreenDetails<
@@ -75,9 +74,9 @@ export interface NavigationState {
routes: any[];
}
export type NavigationRoute = NavigationLeafRoute | NavigationStateRoute;
export type NavigationRoute<Params = NavigationParams> = NavigationLeafRoute<Params> | NavigationStateRoute<Params>;
export interface NavigationLeafRoute {
export interface NavigationLeafRoute<Params> {
/**
* React's key used by some navigators. No need to specify these manually,
* they will be defined by the router.
@@ -96,23 +95,23 @@ export interface NavigationLeafRoute {
* Params passed to this route when navigating to it,
* e.g. `{ car_id: 123 }` in a route that displays a car.
*/
params?: NavigationParams;
params?: Params;
}
export type NavigationStateRoute = NavigationLeafRoute & NavigationState;
export type NavigationStateRoute<NavigationLeafRouteParams> = NavigationLeafRoute<NavigationLeafRouteParams> & NavigationState;
export type NavigationScreenOptionsGetter<Options> = (
navigation: NavigationScreenProp<NavigationRoute>,
navigation: NavigationScreenProp<NavigationRoute<any>>,
screenProps?: { [key: string]: any }
) => Options;
export interface NavigationRouter<State, Action, Options> {
export interface NavigationRouter<State = NavigationState, Options = {}> {
/**
* The reducer that outputs the new navigation state for a given action, with
* an optional previous state. When the action is considered handled but the
* state is unchanged, the output state is null.
*/
getStateForAction: (action: Action, lastState?: State) => (State | null);
getStateForAction: (action: NavigationAction, lastState?: State) => (State | null);
/**
* Maps a URI-like string to an action. This can be mapped to a state
@@ -121,7 +120,7 @@ export interface NavigationRouter<State, Action, Options> {
getActionForPathAndParams: (
path: string,
params?: NavigationParams
) => (Action | null);
) => (NavigationAction | null);
getPathAndParamsForState: (
state: State
@@ -175,16 +174,22 @@ export type NavigationScreenConfig<Options> =
export type NavigationComponent =
NavigationScreenComponent<any, any>
| NavigationNavigator<any, any, any, any>;
| NavigationNavigator<any, any, any>;
export interface NavigationScreenComponent<T, Options> extends React.ComponentClass<T> {
navigationOptions?: NavigationScreenConfig<Options>;
}
export type NavigationScreenComponent<
Options = {},
Props = {}
> = React.ComponentType<NavigationNavigatorProps<Options, NavigationState> & Props> &
({} | { navigationOptions: NavigationScreenConfig<Options> });
export interface NavigationNavigator<T, State, Action, Options> extends React.ComponentClass<T> {
router?: NavigationRouter<State, Action, Options>;
navigationOptions?: NavigationScreenConfig<Options>;
}
export type NavigationNavigator<
State = NavigationState,
Options = {},
Props = {}
> = React.ComponentType<NavigationNavigatorProps<Options, State> & Props> & {
router: NavigationRouter<State, Options>,
navigationOptions?: NavigationScreenConfig<Options>,
};
export interface NavigationParams {
[key: string]: any;
@@ -452,10 +457,10 @@ export interface NavigationScreenProp<S, P = NavigationParams> {
popToTop: (params?: { immediate?: boolean }) => boolean;
}
export interface NavigationNavigatorProps<S = {}> {
export interface NavigationNavigatorProps<O = {}, S = {}> {
navigation?: NavigationProp<S>;
screenProps?: { [key: string]: any };
navigationOptions?: any;
navigationOptions?: O;
}
/**
@@ -587,7 +592,7 @@ export interface NavigationContainerProps {
export interface NavigationContainer extends React.ComponentClass<
NavigationContainerProps & NavigationNavigatorProps<any>
> {
router: NavigationRouter<any, any, any>;
router: NavigationRouter<any, any>;
screenProps: { [key: string]: any };
navigationOptions: any;
state: { nav: NavigationState | null };
@@ -810,7 +815,7 @@ export class Transitioner extends React.Component<
export function TabRouter(
routeConfigs: NavigationRouteConfigMap,
config: NavigationTabRouterConfig
): NavigationRouter<any, any, any>;
): NavigationRouter<any, any>;
/**
* Stack Router
@@ -820,19 +825,19 @@ export function TabRouter(
export function StackRouter(
routeConfigs: NavigationRouteConfigMap,
config: NavigationTabRouterConfig
): NavigationRouter<any, any, any>;
): NavigationRouter<any, any>;
/**
* Create Navigator
*
* @see https://github.com/react-navigation/react-navigation/blob/master/src/navigators/createNavigator.js
*/
export function createNavigator<C, S, A, Options>(
router: NavigationRouter<S, A, Options>,
export function createNavigator<C, S, Options>(
router: NavigationRouter<S, Options>,
routeConfigs?: NavigationRouteConfigMap,
navigatorConfig?: {} | null,
navigatorType?: NavigatorType
): (NavigationView: React.ComponentClass<C>) => NavigationNavigator<C, S, A, Options>;
): (NavigationView: React.ComponentClass<C>) => NavigationNavigator<C, S, Options>;
/**
* Create an HOC that injects the navigation and manages the navigation state
@@ -843,7 +848,7 @@ export function createNavigator<C, S, A, Options>(
* @see https://github.com/react-navigation/react-navigation/blob/master/src/createNavigationContainer.js
*/
export function createNavigationContainer(
Component: NavigationNavigator<any, any, any, any>
Component: NavigationNavigator<any, any, any>
): NavigationContainer;
/**
* END MANUAL DEFINITIONS OUTSIDE OF TYPEDEFINITION.JS
@@ -853,8 +858,8 @@ export function createNavigationContainer(
* BEGIN CUSTOM CONVENIENCE INTERFACES
*/
export interface NavigationScreenProps {
navigation: NavigationScreenProp<NavigationRoute>;
export interface NavigationScreenProps<Params = NavigationParams> {
navigation: NavigationScreenProp<NavigationRoute<Params>>;
screenProps?: { [key: string]: any };
navigationOptions?: NavigationScreenConfig<any>;
}

31
types/react-navigation/react-navigation-tests.tsx
View File

@@ -36,6 +36,7 @@ import {
NavigationParams,
NavigationPopAction,
NavigationPopToTopAction,
NavigationScreenComponent,
} from 'react-navigation';
// Constants
@@ -48,14 +49,19 @@ const viewStyle: ViewStyle = {
const ROUTE_NAME_START_SCREEN = "StartScreen";
interface StartScreenNavigationParams {
id: number;
s: string;
}
/**
* @desc Simple screen component class with typed component props that should
* receive the navigation prop from the AppNavigator.
*/
class StartScreen extends React.Component<NavigationScreenProps> {
class StartScreen extends React.Component<NavigationScreenProps<StartScreenNavigationParams>> {
render() {
// Implicit type checks.
const navigationStateParams = this.props.navigation.state.params;
const navigationStateParams: StartScreenNavigationParams | undefined = this.props.navigation.state.params;
const id = this.props.navigation.state.params && this.props.navigation.state.params.id;
const s = this.props.navigation.state.params && this.props.navigation.state.params.s;
@@ -84,10 +90,15 @@ class StartScreen extends React.Component<NavigationScreenProps> {
const ROUTE_NAME_NEXT_SCREEN = "NextScreen";
class NextScreen extends React.Component<NavigationScreenProps> {
interface NextScreenNavigationParams {
id: number;
name: string;
}
class NextScreen extends React.Component<NavigationScreenProps<NextScreenNavigationParams>> {
render() {
// Implicit type checks.
const navigationStateParams = this.props.navigation.state.params;
const navigationStateParams: NextScreenNavigationParams | undefined = this.props.navigation.state.params;
const id = this.props.navigation.state.params && this.props.navigation.state.params.id;
const name = this.props.navigation.state.params && this.props.navigation.state.params.name;
@@ -100,7 +111,7 @@ class NextScreen extends React.Component<NavigationScreenProps> {
const navigationOptions = {
headerBackTitle: null,
};
const initialRouteParams: NavigationParams = {
const initialRouteParams: StartScreenNavigationParams = {
id: 1,
s: "Start",
};
@@ -123,6 +134,16 @@ export const AppNavigator = StackNavigator(
},
);
const StatelessScreen: NavigationScreenComponent = () => <View />;
const SimpleStackNavigator = StackNavigator(
{
simple: {
screen: StatelessScreen,
},
}
);
/**
* Router.
*/