UNPKG

28.5 kBTypeScriptView Raw
1// Type definitions for react-navigation 3.0.0
2// Project: https://github.com/react-navigation/react-navigation
3// Definitions by: Huhuanming <https://github.com/huhuanming>
4// mhcgrq <https://github.com/mhcgrq>
5// fangpenlin <https://github.com/fangpenlin>
6// petejkim <https://github.com/petejkim>
7// Kyle Roach <https://github.com/iRoachie>
8// phanalpha <https://github.com/phanalpha>
9// charlesfamu <https://github.com/charlesfamu>
10// Tim Wang <https://github.com/timwangdev>
11// Qibang Sun <https://github.com/bang88>
12// Sergei Butko: <https://github.com/svbutko>
13// Veit Lehmann: <https://github.com/levito>
14// Steven Miller <https://github.com/YourGamesBeOver>
15// Armando Assuncao <https://github.com/ArmandoAssuncao>
16// Ciaran Liedeman <https://github.com/cliedeman>
17// Edward Sammut Alessi <https://github.com/Slessi>
18// Jérémy Magrin <https://github.com/magrinj>
19// Luca Campana <https://github.com/TizioFittizio>
20// Ullrich Schaefer <https://github.com/stigi>
21// Linus Unnebäck <https://github.com/LinusU>
22// Yosuke Seki <https://github.com/jshosomichi>
23// Jake <https://github.com/jakebooyah>
24// Gustavo Brunoro <https://github.com/brunoro>
25// Denis Frezzato <https://github.com/DenisFrezzato>
26// Mickael Wegerich <https://github.com/mickaelw>
27// Max Davidson <https://github.com/maxdavidson>
28// Lachlan Young <https://github.com/builtbyproxy>
29// Jason Killian <https://github.com/jkillian>
30// Jan Hesters <https://github.com/janhesters>
31// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
32// TypeScript Version: 2.8
33
34import * as React from 'react';
35
36import {
37 Text,
38 TextInput,
39 StatusBar,
40 ViewProps,
41 ViewStyle,
42 StyleProp,
43} from 'react-native';
44
45// re-export Scrollables
46// @todo: should we re-export from RNGH? not currently exposed through it
47export { FlatList, SectionList, ScrollView } from 'react-native';
48
49// @todo - any..
50export function getActiveChildNavigationOptions<S>(
51 navigation: NavigationProp<S>,
52 screenProps?: unknown,
53 theme?: SupportedThemes
54): NavigationParams;
55
56// @todo when we split types into common, native and web,
57// we can properly change Animated.Value to its real value
58export type AnimatedValue = any;
59
60/**
61 * NavigationState is a tree of routes for a single navigator, where each child
62 * route may either be a NavigationScreenRoute or a NavigationRouterRoute.
63 * NavigationScreenRoute represents a leaf screen, while the
64 * NavigationRouterRoute represents the state of a child navigator.
65 *
66 * NOTE: NavigationState is a state tree local to a single navigator and
67 * its child navigators (via the routes field).
68 * If we're in navigator nested deep inside the app, the state will only be the
69 * state for that navigator.
70 * The state for the root navigator of our app represents the whole navigation
71 * state for the whole app.
72 */
73export interface NavigationState {
74 /**
75 * Index refers to the active child route in the routes array.
76 */
77 index: number;
78 routes: NavigationRoute[];
79 isTransitioning: boolean;
80 key: string;
81 params?: NavigationParams | undefined;
82}
83
84export interface DrawerNavigationState extends NavigationState {
85 isDrawerOpen: boolean;
86 isTransitioning: boolean;
87}
88
89export type NavigationRoute<Params = NavigationParams> =
90 | NavigationLeafRoute<Params>
91 | NavigationStateRoute<Params>;
92
93export interface NavigationLeafRoute<Params = NavigationParams> {
94 /**
95 * React's key used by some navigators. No need to specify these manually,
96 * they will be defined by the router.
97 */
98 key: string;
99 /**
100 * Index that represents the depth of the stack
101 */
102 index: number;
103 /**
104 * For example 'Home'.
105 * This is used as a key in a route config when creating a navigator.
106 */
107 routeName: string;
108 /**
109 * Path is an advanced feature used for deep linking and on the web.
110 */
111 path?: string;
112 /**
113 * Params passed to this route when navigating to it,
114 * e.g. `{ car_id: 123 }` in a route that displays a car.
115 */
116 params?: Params;
117 /**
118 * Array containing the navigator's routes
119 */
120 routes: NavigationRoute[];
121 /**
122 * Flag that indicates the transition state of the route
123 */
124 isTransitioning: boolean;
125}
126
127export type NavigationStateRoute<
128 NavigationLeafRouteParams
129> = NavigationLeafRoute<NavigationLeafRouteParams> & NavigationState;
130
131export type NavigationScreenOptionsGetter<Options> = (
132 navigation: NavigationScreenProp<NavigationRoute<any>>,
133 screenProps: unknown | null,
134 theme: SupportedThemes
135) => Options;
136
137export interface NavigationRouter<State = NavigationState, Options = {}> {
138 /**
139 * The reducer that outputs the new navigation state for a given action, with
140 * an optional previous state. When the action is considered handled but the
141 * state is unchanged, the output state is null.
142 */
143 getStateForAction: (
144 action: NavigationAction,
145 lastState?: State
146 ) => State | null;
147
148 /**
149 * Maps a URI-like string to an action. This can be mapped to a state
150 * using `getStateForAction`.
151 */
152 getActionForPathAndParams: (
153 path: string,
154 params?: NavigationParams
155 ) => NavigationAction | null;
156
157 getPathAndParamsForState: (
158 state: State
159 ) => {
160 path: string;
161 params?: NavigationParams;
162 };
163
164 getComponentForRouteName: (
165 routeName: string
166 ) => NavigationComponent<{}, NavigationScreenProp<NavigationRoute>>;
167
168 getComponentForState: (
169 state: State
170 ) => NavigationComponent<{}, NavigationScreenProp<NavigationRoute>>;
171
172 getActionCreators: (
173 route: NavigationRoute,
174 key: string
175 ) => {
176 [key: string]: () => NavigationAction;
177 };
178
179 /**
180 * Gets the screen navigation options for a given screen.
181 *
182 * For example, we could get the config for the 'Foo' screen when the
183 * `navigation.state` is:
184 *
185 * {routeName: 'Foo', key: '123'}
186 */
187 getScreenOptions: NavigationScreenOptionsGetter<Options>;
188}
189
190export type NavigationScreenComponent<
191 Options,
192 NavigationScreenPropType
193> = React.ComponentType<any> & {
194 navigationOptions?: NavigationScreenConfig<Options, NavigationScreenPropType>;
195};
196
197export interface NavigationScreenConfigProps<
198 NavigationScreenPropType,
199 ScreenProps = unknown
200> {
201 navigation: NavigationScreenPropType;
202 screenProps: ScreenProps;
203 theme: SupportedThemes;
204}
205
206export type NavigationScreenConfig<
207 Options,
208 NavigationScreenPropType,
209 ScreenProps = unknown
210> =
211 | Options
212 | ((
213 navigationOptionsContainer: NavigationScreenConfigProps<
214 NavigationScreenPropType,
215 ScreenProps
216 > & {
217 navigationOptions: Options;
218 }
219 ) => Options);
220
221export type NavigationComponent<Options, NavigationPropType> =
222 | NavigationScreenComponent<Options, NavigationPropType>
223 | NavigationNavigator<Options, NavigationPropType>;
224
225export type NavigationNavigator<
226 Options,
227 NavigationPropType
228> = React.ComponentType<NavigationNavigatorProps<Options>> & {
229 router: NavigationRouter<Options>;
230 navigationOptions?: NavigationScreenConfig<Options, NavigationPropType>;
231};
232
233export interface NavigationParams {
234 [key: string]: any;
235}
236
237export interface NavigationNavigateActionPayload {
238 routeName: string;
239 params?: NavigationParams;
240
241 // The action to run inside the sub-router
242 action?: NavigationNavigateAction;
243
244 key?: string;
245}
246
247export interface NavigationNavigateAction
248 extends NavigationNavigateActionPayload {
249 type: 'Navigation/NAVIGATE';
250}
251
252export interface NavigationBackActionPayload {
253 key?: string | null;
254 immediate?: boolean;
255}
256
257export interface NavigationBackAction extends NavigationBackActionPayload {
258 type: 'Navigation/BACK';
259}
260
261export interface NavigationSetParamsActionPayload {
262 // The key of the route where the params should be set
263 key: string;
264
265 // The new params to merge into the existing route params
266 params: NavigationParams;
267}
268
269export interface NavigationSetParamsAction
270 extends NavigationSetParamsActionPayload {
271 type: 'Navigation/SET_PARAMS';
272}
273
274export interface NavigationInitActionPayload {
275 params?: NavigationParams;
276}
277
278export interface NavigationInitAction extends NavigationInitActionPayload {
279 type: 'Navigation/INIT';
280 key?: string;
281}
282
283export interface NavigationReplaceActionPayload {
284 key?: string;
285 newKey?: string;
286 routeName: string;
287 params?: NavigationParams;
288 action?: NavigationAction;
289}
290
291export interface NavigationReplaceAction {
292 type: 'Navigation/REPLACE';
293 key: string;
294 routeName: string;
295 params?: NavigationParams;
296 action?: NavigationAction;
297}
298
299export interface NavigationCompleteTransitionActionPayload {
300 key?: string;
301 toChildKey?: string;
302}
303
304export interface NavigationCompleteTransitionAction {
305 type: 'Navigation/COMPLETE_TRANSITION';
306 key: string;
307}
308
309export interface NavigationResetActionPayload {
310 index: number;
311 key?: string | null;
312 actions: NavigationNavigateAction[];
313}
314
315export interface NavigationResetAction extends NavigationResetActionPayload {
316 type: 'Navigation/RESET';
317}
318
319export interface NavigationUriActionPayload {
320 uri: string;
321}
322
323export interface NavigationUriAction extends NavigationUriActionPayload {
324 type: 'Navigation/URI';
325}
326
327export interface NavigationPopActionPayload {
328 // n: the number of routes to pop of the stack
329 n?: number;
330 immediate?: boolean;
331 prune?: boolean;
332 key?: string;
333}
334
335export interface NavigationPopAction extends NavigationPopActionPayload {
336 type: 'Navigation/POP';
337 key?: string;
338}
339
340export interface NavigationPopToTopActionPayload {
341 key?: string;
342 immediate?: boolean;
343}
344
345export interface NavigationPopToTopAction
346 extends NavigationPopToTopActionPayload {
347 type: 'Navigation/POP_TO_TOP';
348}
349
350export interface NavigationPushActionPayload {
351 routeName: string;
352 params?: NavigationParams;
353 action?: NavigationNavigateAction;
354 key?: string;
355}
356
357export interface NavigationPushAction {
358 type: 'Navigation/PUSH';
359 routeName: string;
360 params?: NavigationParams;
361 action?: NavigationNavigateAction;
362 key?: string;
363}
364
365export interface NavigationJumpToActionPayload {
366 routeName: string;
367 key?: string;
368 preserveFocus?: boolean;
369}
370
371export interface NavigationJumpToAction {
372 type: 'Navigation/JUMP_TO';
373 routeName: string;
374 key: string;
375 preserveFocus?: boolean;
376}
377
378export interface NavigationDrawerOpenedAction {
379 key?: string;
380 type: 'Navigation/DRAWER_OPENED';
381}
382
383export interface NavigationDrawerClosedAction {
384 key?: string;
385 type: 'Navigation/DRAWER_CLOSED';
386}
387
388export interface NavigationOpenDrawerAction {
389 key?: string;
390 type: 'Navigation/OPEN_DRAWER';
391}
392
393export interface NavigationCloseDrawerAction {
394 key?: string;
395 type: 'Navigation/CLOSE_DRAWER';
396}
397
398export interface NavigationToggleDrawerAction {
399 key?: string;
400 type: 'Navigation/TOGGLE_DRAWER';
401}
402
403/**
404 * Switch Navigator
405 */
406export interface NavigationSwitchRouterConfig {
407 initialRouteName?: string;
408 initialRouteParams?: NavigationParams;
409 paths?: NavigationPathsConfig;
410 order?: string[];
411 backBehavior?: 'none' | 'initialRoute' | 'history' | 'order'; // defaults to 'none'
412 resetOnBlur?: boolean; // defaults to `true`
413}
414
415export function SwitchRouter(
416 routeConfigs: NavigationRouteConfigMap<any, any>,
417 config?: NavigationSwitchRouterConfig
418): NavigationRouter<any, any>;
419
420export type NavigationSwitchProp<
421 State = NavigationRoute,
422 Params = NavigationParams
423> = NavigationScreenProp<State, Params> & {
424 jumpTo(routeName: string, key?: string): void;
425};
426
427export type NavigationSwitchScreenProps<
428 Params = NavigationParams,
429 ScreenProps = unknown
430> = {
431 theme: SupportedThemes;
432 navigation: NavigationSwitchProp<NavigationRoute, Params>;
433 screenProps: ScreenProps;
434};
435
436export type NavigationSwitchScreenComponent<
437 Params = NavigationParams,
438 ScreenProps = unknown
439> = React.ComponentType<NavigationSwitchScreenProps<Params, ScreenProps>> & {
440 navigationOptions?: NavigationScreenConfig<
441 {},
442 NavigationSwitchProp<NavigationRoute, Params>,
443 ScreenProps
444 >;
445};
446
447export type NavigationStackAction =
448 | NavigationInitAction
449 | NavigationNavigateAction
450 | NavigationBackAction
451 | NavigationSetParamsAction
452 | NavigationResetAction
453 | NavigationReplaceAction
454 | NavigationPopAction
455 | NavigationPushAction
456 | NavigationPopToTopAction
457 | NavigationCompleteTransitionAction;
458
459export type NavigationTabAction =
460 | NavigationInitAction
461 | NavigationNavigateAction
462 | NavigationBackAction;
463
464export type NavigationDrawerAction =
465 | NavigationDrawerOpenedAction
466 | NavigationDrawerClosedAction
467 | NavigationOpenDrawerAction
468 | NavigationCloseDrawerAction
469 | NavigationToggleDrawerAction;
470
471export type NavigationSwitchAction = NavigationJumpToAction;
472
473export type NavigationAction =
474 | NavigationInitAction
475 | NavigationStackAction
476 | NavigationTabAction
477 | NavigationDrawerAction
478 | NavigationSwitchAction
479 | { type: 'CHILD_ACTION'; key?: string };
480
481export type NavigationRouteConfig<
482 Options,
483 NavigationScreenPropType,
484 ScreenProps = unknown
485> =
486 | NavigationComponent<Options, NavigationScreenPropType>
487 | ((
488 | { screen: NavigationComponent<Options, NavigationScreenPropType> }
489 | {
490 getScreen(): NavigationScreenComponent<
491 Options,
492 NavigationScreenPropType
493 >;
494 }
495 ) & {
496 navigationOptions?: NavigationScreenConfig<
497 Options,
498 NavigationScreenPropType,
499 ScreenProps
500 >;
501 params?: { [key: string]: any };
502 path?: string;
503 });
504
505export interface NavigationPathsConfig {
506 [routeName: string]: string;
507}
508
509// tslint:disable-next-line:strict-export-declare-modifiers
510export interface NavigationTabRouterConfig {
511 initialRouteName?: string;
512 initialRouteParams?: NavigationParams;
513 paths?: NavigationPathsConfig;
514 order?: string[]; // todo: type these as the real route names rather than 'string'
515 backBehavior?: 'none' | 'initialRoute' | 'history' | 'order'; // defaults to 'initialRoute'
516 resetOnBlur?: boolean;
517}
518
519export interface NavigationRouteConfigMap<
520 Options,
521 NavigationScreenPropType,
522 ScreenProps = unknown
523> {
524 [routeName: string]: NavigationRouteConfig<
525 Options,
526 NavigationScreenPropType,
527 ScreenProps
528 >;
529}
530
531export type NavigationDispatch = (action: NavigationAction) => boolean;
532
533export interface NavigationProp<S> {
534 state: S;
535 dispatch: NavigationDispatch;
536}
537
538export type EventType =
539 | 'willFocus'
540 | 'didFocus'
541 | 'willBlur'
542 | 'didBlur'
543 | 'action';
544
545export interface NavigationEventPayload {
546 type: EventType;
547 action: NavigationAction;
548 state: NavigationState;
549 lastState: NavigationState | null | undefined;
550}
551
552export type NavigationEventCallback = (payload: NavigationEventPayload) => void;
553
554export interface NavigationEventSubscription {
555 remove: () => void;
556}
557
558export interface NavigationEventsProps extends ViewProps {
559 onWillFocus?: NavigationEventCallback;
560 onDidFocus?: NavigationEventCallback;
561 onWillBlur?: NavigationEventCallback;
562 onDidBlur?: NavigationEventCallback;
563}
564
565export const NavigationEvents: React.ComponentType<NavigationEventsProps>;
566
567export interface NavigationScreenProp<S, P = NavigationParams> {
568 state: S & { params?: P };
569 dispatch: NavigationDispatch;
570 goBack: (routeKey?: string | null) => boolean;
571 dismiss: () => boolean;
572 navigate<T extends NavigationParams>(options: {
573 routeName:
574 | string
575 | {
576 routeName: string;
577 params?: T;
578 action?: NavigationNavigateAction;
579 key?: string;
580 };
581 params?: T;
582 action?: NavigationAction;
583 key?: string;
584 }): boolean;
585
586 navigate<T extends NavigationParams>(
587 routeNameOrOptions: string,
588 params?: T,
589 action?: NavigationAction
590 ): boolean;
591 getParam<T extends keyof P>(
592 param: T,
593 fallback: NonNullable<P[T]>
594 ): NonNullable<P[T]>;
595 getParam<T extends keyof P>(param: T): P[T];
596 setParams: (newParams: Partial<P>) => boolean;
597 emit: (eventName: 'refocus') => void;
598 addListener: (
599 eventName: string,
600 callback: NavigationEventCallback
601 ) => NavigationEventSubscription;
602 isFocused: () => boolean;
603 isFirstRouteInParent: () => boolean;
604 router?: NavigationRouter;
605 dangerouslyGetParent: () => NavigationScreenProp<S> | undefined;
606}
607
608export interface NavigationNavigatorProps<
609 Options = {},
610 State = {},
611 ScreenProps = unknown
612> {
613 theme?: SupportedThemes | 'no-preference';
614 detached?: boolean;
615 navigation?: NavigationProp<State>;
616 screenProps?: ScreenProps;
617 navigationOptions?: Options;
618}
619
620export type NavigatorType =
621 | 'react-navigation/STACK'
622 | 'react-navigation/TABS'
623 | 'react-navigation/DRAWER';
624
625export interface NavigationContainerProps<
626 State = {},
627 Options = {},
628 ScreenProps = unknown
629> {
630 uriPrefix?: string | RegExp;
631 /**
632 * Controls whether the navigation container handles URLs opened via 'Linking'
633 * @see https://facebook.github.io/react-native/docs/linking
634 * @see https://reactnavigation.org/docs/en/deep-linking.html
635 */
636 enableURLHandling?: boolean; // defaults to true
637 onNavigationStateChange?: (
638 prevNavigationState: NavigationState,
639 nextNavigationState: NavigationState,
640 action: NavigationAction
641 ) => void | null | undefined;
642 navigation?: NavigationScreenProp<State>;
643 /*
644 * This prop is no longer supported. Use `loadNavigationState` and
645 * `persistNavigationState` instead.
646 */
647 persistenceKey?: string | null;
648
649 loadNavigationState?: () => Promise<any>;
650 persistNavigationState?: (state: NavigationState) => Promise<any>;
651
652 renderLoadingExperimental?: React.ComponentType;
653 screenProps?: ScreenProps;
654 navigationOptions?: Options;
655 style?: StyleProp<ViewStyle>;
656}
657
658export interface NavigationContainerComponent
659 extends React.Component<
660 NavigationContainerProps & NavigationNavigatorProps<any>
661 > {
662 dispatch: NavigationDispatch;
663}
664
665export interface NavigationContainer
666 extends React.ComponentClass<
667 NavigationContainerProps & NavigationNavigatorProps<any>
668 > {
669 new (
670 props: NavigationContainerProps & NavigationNavigatorProps<any>,
671 context?: any
672 ): NavigationContainerComponent;
673
674 router: NavigationRouter<any, any>;
675 screenProps: unknown;
676 navigationOptions: any;
677 state: { nav: NavigationState | null };
678}
679
680export function createSwitchNavigator(
681 routeConfigMap: NavigationRouteConfigMap<{}, NavigationSwitchProp>,
682 switchConfig?: CreateNavigatorConfig<
683 {},
684 NavigationSwitchRouterConfig,
685 {},
686 NavigationSwitchProp
687 >
688): NavigationNavigator<{}, NavigationProp<NavigationState>>;
689
690/**
691 * NavigationActions
692 */
693export namespace NavigationActions {
694 export const BACK: 'Navigation/BACK';
695 export const INIT: 'Navigation/INIT';
696 export const NAVIGATE: 'Navigation/NAVIGATE';
697 export const SET_PARAMS: 'Navigation/SET_PARAMS';
698
699 export function init(
700 options?: NavigationInitActionPayload
701 ): NavigationInitAction;
702 export function navigate(
703 options: NavigationNavigateActionPayload
704 ): NavigationNavigateAction;
705 export function back(
706 options?: NavigationBackActionPayload
707 ): NavigationBackAction;
708 export function setParams(
709 options: NavigationSetParamsActionPayload
710 ): NavigationSetParamsAction;
711}
712
713/**
714 * DrawerActions
715 */
716export namespace DrawerActions {
717 export const OPEN_DRAWER: 'Navigation/OPEN_DRAWER';
718 export const CLOSE_DRAWER: 'Navigation/CLOSE_DRAWER';
719 export const TOGGLE_DRAWER: 'Navigation/TOGGLE_DRAWER';
720
721 export function openDrawer(): NavigationOpenDrawerAction;
722 export function closeDrawer(): NavigationCloseDrawerAction;
723 export function toggleDrawer(): NavigationToggleDrawerAction;
724}
725
726/**
727 * StackActions
728 */
729export namespace StackActions {
730 export const POP: 'Navigation/POP';
731 export const POP_TO_TOP: 'Navigation/POP_TO_TOP';
732 export const PUSH: 'Navigation/PUSH';
733 export const RESET: 'Navigation/RESET';
734 export const REPLACE: 'Navigation/REPLACE';
735 export const COMPLETE_TRANSITION: 'Navigation/COMPLETE_TRANSITION';
736
737 export function pop(
738 options?: NavigationPopActionPayload
739 ): NavigationPopAction;
740 export function popToTop(
741 options?: NavigationPopToTopActionPayload
742 ): NavigationPopToTopAction;
743
744 export function push(
745 options: NavigationPushActionPayload
746 ): NavigationPushAction;
747 export function reset(
748 options: NavigationResetActionPayload
749 ): NavigationResetAction;
750
751 export function replace(
752 options: NavigationReplaceActionPayload
753 ): NavigationReplaceAction;
754
755 export function completeTransition(
756 payload?: NavigationCompleteTransitionActionPayload
757 ): NavigationCompleteTransitionAction;
758}
759
760/**
761 * SwitchActions
762 */
763export namespace SwitchActions {
764 export const JUMP_TO: 'Navigation/JUMP_TO';
765
766 export function jumpTo(
767 options: NavigationJumpToActionPayload
768 ): NavigationJumpToAction;
769}
770
771/**
772 * Tab Router
773 *
774 * @desc from react-navigation/src/routers/TabRouter.js
775 */
776export function TabRouter(
777 routeConfigs: NavigationRouteConfigMap<any, any>,
778 config: NavigationTabRouterConfig
779): NavigationRouter<any, any>;
780
781/**
782 * Stack Router
783 *
784 * @desc from react-navigation/src/routers/StackRouter.js
785 */
786export function StackRouter(
787 routeConfigs: NavigationRouteConfigMap<any, any>,
788 config?: NavigationTabRouterConfig
789): NavigationRouter<any, any>;
790
791export interface NavigationStackRouterConfig {
792 initialRouteName?: string;
793 initialRouteParams?: NavigationParams;
794 paths?: NavigationPathsConfig;
795 initialRouteKey?: string;
796}
797
798/**
799 * Create Navigator
800 *
801 * @see https://github.com/react-navigation/react-navigation/blob/master/src/navigators/createNavigator.js
802 */
803export interface NavigationDescriptor<
804 Params = NavigationParams,
805 Options = {},
806 NavigationScreenPropType = NavigationScreenProp<NavigationRoute>
807> {
808 key: string;
809 state: NavigationLeafRoute<Params> | NavigationStateRoute<Params>;
810 navigation: NavigationScreenPropType;
811 options: Options;
812 getComponent: () => React.ComponentType;
813}
814
815// eslint-disable-next-line @typescript-eslint/no-unused-vars
816export type NavigationView<Options, State, ScreenProps = unknown> =
817 | React.ComponentType<
818 {
819 descriptors: { [key: string]: NavigationDescriptor };
820 navigationConfig: Options;
821 screenProps?: ScreenProps;
822 } & NavigationInjectedProps
823 >
824 | React.ComponentType<any>;
825
826export type CreateNavigatorConfig<
827 NavigatorConfig,
828 RouterConfig,
829 Options,
830 NavigationScreenPropType
831> = NavigatorConfig &
832 RouterConfig & {
833 defaultNavigationOptions?: NavigationScreenConfig<
834 Options,
835 NavigationScreenPropType
836 >;
837 navigationOptions?: NavigationScreenConfig<
838 { [key: string]: any },
839 NavigationScreenProp<NavigationRoute>
840 >;
841 };
842
843export function createNavigator<S, Options>(
844 view: NavigationView<Options, S>,
845 router: NavigationRouter<S, Options>,
846 navigatorConfig?: {},
847 navigatorType?: NavigatorType
848): NavigationNavigator<Options, NavigationProp<NavigationState>>;
849
850/**
851 * Create an HOC that injects the navigation and manages the navigation state
852 * in case it's not passed from above.
853 * This allows to use e.g. the StackNavigator and TabNavigator as root-level
854 * components.
855 *
856 * @see https://github.com/react-navigation/react-navigation/blob/master/src/createNavigationContainer.js
857 */
858export function createNavigationContainer<Options, NavigationPropType>(
859 Component: NavigationNavigator<Options, NavigationPropType>
860): NavigationContainer;
861
862/**
863 * Create an app container to wrap the root navigator
864 *
865 * @see https://github.com/react-navigation/react-navigation-native/blob/098e2e52b349d37357109d5aee545fa74699d3d4/src/createAppContainer.js#L64
866 */
867export function createAppContainer<Options, NavigationPropType>(
868 Component: NavigationNavigator<Options, NavigationPropType>
869): NavigationContainer;
870
871export type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;
872
873export type InferProps<
874 T extends React.ComponentType<any>
875> = T extends React.ComponentType<infer P> ? P : never;
876
877export interface NavigationOrientationInjectedProps {
878 isLandscape: boolean;
879}
880
881export function withOrientation<P extends NavigationOrientationInjectedProps>(
882 Component: React.ComponentType<P>
883): React.ComponentType<Omit<P, keyof NavigationOrientationInjectedProps>>;
884
885export interface NavigationInjectedProps<P = NavigationParams> {
886 navigation: NavigationScreenProp<NavigationRoute<P>, P>;
887}
888
889// If the wrapped component is a class, we can get a ref to it
890export function withNavigation<
891 P extends NavigationInjectedProps,
892 T extends React.ComponentClass<P>
893>(
894 Component: T & React.ComponentClass<P>
895): React.ComponentType<
896 Omit<P, keyof NavigationInjectedProps> & {
897 onRef?: React.Ref<InstanceType<T>>;
898 }
899>;
900
901// eslint-disable-next-line no-redeclare
902export function withNavigation<P extends NavigationInjectedProps>(
903 Component: React.ComponentType<P>
904): React.ComponentType<Omit<P, keyof NavigationInjectedProps>>;
905
906// For backwards compatibility
907// eslint-disable-next-line no-redeclare
908export function withNavigation<T = {}, P = NavigationParams>(
909 Component: React.ComponentType<T & NavigationInjectedProps<P>>
910): React.ComponentType<
911 T & { onRef?: React.Ref<React.Component<T & NavigationInjectedProps<P>>> }
912>;
913
914export const NavigationProvider: React.ComponentType<{
915 value: NavigationProp<any>;
916}>;
917
918export interface NavigationFocusInjectedProps<P = NavigationParams>
919 extends NavigationInjectedProps<P> {
920 isFocused: boolean;
921}
922
923// If the wrapped component is a class, we can get a ref to it
924export function withNavigationFocus<
925 P extends NavigationFocusInjectedProps,
926 T extends React.ComponentClass<P>
927>(
928 Component: T & React.ComponentClass<P>
929): React.ComponentType<
930 Omit<P, keyof NavigationFocusInjectedProps> & {
931 onRef?: React.Ref<InstanceType<T>>;
932 }
933>;
934
935// eslint-disable-next-line no-redeclare
936export function withNavigationFocus<P extends NavigationFocusInjectedProps>(
937 Component: React.ComponentType<P>
938): React.ComponentType<Omit<P, keyof NavigationFocusInjectedProps>>;
939
940// For backwards compatibility
941// eslint-disable-next-line no-redeclare
942export function withNavigationFocus<T = {}, P = NavigationParams>(
943 Component: React.ComponentType<T & NavigationFocusInjectedProps<P>>
944): React.ComponentType<
945 T & {
946 onRef?: React.Ref<React.Component<T & NavigationFocusInjectedProps<P>>>;
947 }
948>;
949
950/**
951 * SafeAreaView Component
952 */
953export type SafeAreaViewForceInsetValue = 'always' | 'never';
954export interface SafeAreaViewProps extends ViewProps {
955 forceInset?: {
956 top?: SafeAreaViewForceInsetValue;
957 bottom?: SafeAreaViewForceInsetValue;
958 left?: SafeAreaViewForceInsetValue;
959 right?: SafeAreaViewForceInsetValue;
960 horizontal?: SafeAreaViewForceInsetValue;
961 vertical?: SafeAreaViewForceInsetValue;
962 };
963 children?: React.ReactNode;
964}
965
966export const SafeAreaView: React.ComponentClass<SafeAreaViewProps>;
967
968export const NavigationContext: React.Context<NavigationScreenProp<
969 NavigationRoute
970>>;
971
972export function createKeyboardAwareNavigator<Props>(
973 Comp: React.ComponentType<Props>,
974 stackConfig: object
975): React.ComponentType<Props>;
976
977/**
978 * SceneView
979 */
980
981export interface SceneViewProps {
982 component: React.ComponentType;
983 screenProps: unknown;
984 navigation: NavigationProp<any>;
985}
986
987export const SceneView: React.ComponentType<SceneViewProps>;
988
989/**
990 * Themes
991 */
992
993// Context
994export type SupportedThemes = 'light' | 'dark';
995export const ThemeContext: React.Context<SupportedThemes>;
996
997// Hooks
998export function useTheme(): SupportedThemes;
999
1000// Colors
1001export interface Theme {
1002 header: string;
1003 headerBorder: string;
1004 body: string;
1005 bodyBorder: string;
1006 bodyContent: string;
1007 bodyContentBorder: string;
1008 label: string;
1009}
1010
1011export const ThemeColors: { [k in SupportedThemes]: Theme };
1012
1013// Themed components
1014interface ThemedStatusBarProps extends React.ComponentProps<typeof StatusBar> {}
1015interface ThemedTextProps extends React.ComponentProps<typeof Text> {}
1016interface ThemedTextInputProps extends React.ComponentProps<typeof TextInput> {}
1017
1018export namespace Themed {
1019 export const StatusBar: React.ComponentType<ThemedStatusBarProps>;
1020 export const Text: React.ComponentType<ThemedTextProps>;
1021 export const TextInput: React.ComponentType<ThemedTextInputProps>;
1022}