UNPKG

20.9 kBTypeScriptView Raw
1import type { DefaultRouterOptions, InitialState, NavigationAction, NavigationState, ParamListBase, PartialState, Route } from '@react-navigation/routers';
2import type * as React from 'react';
3declare global {
4 namespace ReactNavigation {
5 interface RootParamList {
6 }
7 }
8}
9declare type Keyof<T extends {}> = Extract<keyof T, string>;
10export declare type DefaultNavigatorOptions<ParamList extends ParamListBase, State extends NavigationState, ScreenOptions extends {}, EventMap extends EventMapBase> = DefaultRouterOptions<Keyof<ParamList>> & {
11 /**
12 * Optional ID for the navigator. Can be used with `navigation.getParent(id)` to refer to a parent.
13 */
14 id?: string;
15 /**
16 * Children React Elements to extract the route configuration from.
17 * Only `Screen`, `Group` and `React.Fragment` are supported as children.
18 */
19 children: React.ReactNode;
20 /**
21 * Event listeners for all the screens in the navigator.
22 */
23 screenListeners?: ScreenListeners<State, EventMap> | ((props: {
24 route: RouteProp<ParamList>;
25 navigation: any;
26 }) => ScreenListeners<State, EventMap>);
27 /**
28 * Default options for all screens under this navigator.
29 */
30 screenOptions?: ScreenOptions | ((props: {
31 route: RouteProp<ParamList>;
32 navigation: any;
33 }) => ScreenOptions);
34 /**
35 * Default options specified by the navigator.
36 * It receives the custom options in the arguments if a function is specified.
37 */
38 defaultScreenOptions?: ScreenOptions | ((props: {
39 route: RouteProp<ParamList>;
40 navigation: any;
41 options: ScreenOptions;
42 }) => ScreenOptions);
43};
44export declare type EventMapBase = Record<string, {
45 data?: any;
46 canPreventDefault?: boolean;
47}>;
48export declare type EventMapCore<State extends NavigationState> = {
49 focus: {
50 data: undefined;
51 };
52 blur: {
53 data: undefined;
54 };
55 state: {
56 data: {
57 state: State;
58 };
59 };
60 beforeRemove: {
61 data: {
62 action: NavigationAction;
63 };
64 canPreventDefault: true;
65 };
66};
67export declare type EventArg<EventName extends string, CanPreventDefault extends boolean | undefined = false, Data = undefined> = {
68 /**
69 * Type of the event (e.g. `focus`, `blur`)
70 */
71 readonly type: EventName;
72 readonly target?: string;
73} & (CanPreventDefault extends true ? {
74 /**
75 * Whether `event.preventDefault()` was called on this event object.
76 */
77 readonly defaultPrevented: boolean;
78 /**
79 * Prevent the default action which happens on this event.
80 */
81 preventDefault(): void;
82} : {}) & (undefined extends Data ? {
83 readonly data?: Readonly<Data>;
84} : {
85 readonly data: Readonly<Data>;
86});
87export declare type EventListenerCallback<EventMap extends EventMapBase, EventName extends keyof EventMap> = (e: EventArg<Extract<EventName, string>, EventMap[EventName]['canPreventDefault'], EventMap[EventName]['data']>) => void;
88export declare type EventConsumer<EventMap extends EventMapBase> = {
89 /**
90 * Subscribe to events from the parent navigator.
91 *
92 * @param type Type of the event (e.g. `focus`, `blur`)
93 * @param callback Callback listener which is executed upon receiving the event.
94 */
95 addListener<EventName extends Keyof<EventMap>>(type: EventName, callback: EventListenerCallback<EventMap, EventName>): () => void;
96 removeListener<EventName extends Keyof<EventMap>>(type: EventName, callback: EventListenerCallback<EventMap, EventName>): void;
97};
98export declare type EventEmitter<EventMap extends EventMapBase> = {
99 /**
100 * Emit an event to child screens.
101 *
102 * @param options.type Type of the event (e.g. `focus`, `blur`)
103 * @param [options.data] Optional information regarding the event.
104 * @param [options.target] Key of the target route which should receive the event.
105 * If not specified, all routes receive the event.
106 */
107 emit<EventName extends Keyof<EventMap>>(options: {
108 type: EventName;
109 target?: string;
110 } & (EventMap[EventName]['canPreventDefault'] extends true ? {
111 canPreventDefault: true;
112 } : {}) & (undefined extends EventMap[EventName]['data'] ? {
113 data?: EventMap[EventName]['data'];
114 } : {
115 data: EventMap[EventName]['data'];
116 })): EventArg<EventName, EventMap[EventName]['canPreventDefault'], EventMap[EventName]['data']>;
117};
118export declare class PrivateValueStore<T extends [any, any, any]> {
119 /**
120 * UGLY HACK! DO NOT USE THE TYPE!!!
121 *
122 * TypeScript requires a type to be used to be able to infer it.
123 * The type should exist as its own without any operations such as union.
124 * So we need to figure out a way to store this type in a property.
125 * The problem with a normal property is that it shows up in intelliSense.
126 * Adding private keyword works, but the annotation is stripped away in declaration.
127 * Turns out if we use an empty string, it doesn't show up in intelliSense.
128 */
129 protected ''?: T;
130}
131declare type NavigationHelpersCommon<ParamList extends ParamListBase, State extends NavigationState = NavigationState> = {
132 /**
133 * Dispatch an action or an update function to the router.
134 * The update function will receive the current state,
135 *
136 * @param action Action object or update function.
137 */
138 dispatch(action: NavigationAction | ((state: State) => NavigationAction)): void;
139 /**
140 * Navigate to a route in current navigation tree.
141 *
142 * @param name Name of the route to navigate to.
143 * @param [params] Params object for the route.
144 */
145 navigate<RouteName extends keyof ParamList>(...args: undefined extends ParamList[RouteName] ? [screen: RouteName] | [screen: RouteName, params: ParamList[RouteName]] : [screen: RouteName, params: ParamList[RouteName]]): void;
146 /**
147 * Navigate to a route in current navigation tree.
148 *
149 * @param route Object with `key` or `name` for the route to navigate to, and a `params` object.
150 */
151 navigate<RouteName extends keyof ParamList>(options: {
152 key: string;
153 params?: ParamList[RouteName];
154 merge?: boolean;
155 } | {
156 name: RouteName;
157 key?: string;
158 params: ParamList[RouteName];
159 merge?: boolean;
160 }): void;
161 /**
162 * Reset the navigation state to the provided state.
163 *
164 * @param state Navigation state object.
165 */
166 reset(state: PartialState<State> | State): void;
167 /**
168 * Go back to the previous route in history.
169 */
170 goBack(): void;
171 /**
172 * Check if the screen is focused. The method returns `true` if focused, `false` otherwise.
173 * Note that this method doesn't re-render screen when the focus changes. So don't use it in `render`.
174 * To get notified of focus changes, use `addListener('focus', cb)` and `addListener('blur', cb)`.
175 * To conditionally render content based on focus state, use the `useIsFocused` hook.
176 */
177 isFocused(): boolean;
178 /**
179 * Check if dispatching back action will be handled by navigation.
180 * Note that this method doesn't re-render screen when the result changes. So don't use it in `render`.
181 */
182 canGoBack(): boolean;
183 /**
184 * Returns the name of the navigator specified in the `name` prop.
185 * If no name is specified, returns `undefined`.
186 */
187 getId(): string | undefined;
188 /**
189 * Returns the navigation helpers from a parent navigator based on the ID.
190 * If an ID is provided, the navigation helper from the parent navigator with matching ID (including current) will be returned.
191 * If no ID is provided, the navigation helper from the immediate parent navigator will be returned.
192 *
193 * @param id Optional ID of a parent navigator.
194 */
195 getParent<T = NavigationHelpers<ParamListBase> | undefined>(id?: string): T;
196 /**
197 * Returns the navigator's state.
198 * Note that this method doesn't re-render screen when the result changes. So don't use it in `render`.
199 */
200 getState(): State;
201} & PrivateValueStore<[ParamList, unknown, unknown]>;
202export declare type NavigationHelpers<ParamList extends ParamListBase, EventMap extends EventMapBase = {}> = NavigationHelpersCommon<ParamList> & EventEmitter<EventMap> & {
203 /**
204 * Update the param object for the route.
205 * The new params will be shallow merged with the old one.
206 *
207 * @param params Params object for the current route.
208 */
209 setParams<RouteName extends keyof ParamList>(params: Partial<ParamList[RouteName]>): void;
210};
211export declare type NavigationContainerProps = {
212 /**
213 * Initial navigation state for the child navigators.
214 */
215 initialState?: InitialState;
216 /**
217 * Callback which is called with the latest navigation state when it changes.
218 */
219 onStateChange?: (state: NavigationState | undefined) => void;
220 /**
221 * Callback which is called when an action is not handled.
222 */
223 onUnhandledAction?: (action: NavigationAction) => void;
224 /**
225 * Whether this navigation container should be independent of parent containers.
226 * If this is not set to `true`, this container cannot be nested inside another container.
227 * Setting it to `true` disconnects any children navigators from parent container.
228 */
229 independent?: boolean;
230 /**
231 * Children elements to render.
232 */
233 children: React.ReactNode;
234};
235export declare type NavigationProp<ParamList extends {}, RouteName extends keyof ParamList = Keyof<ParamList>, NavigatorID extends string | undefined = undefined, State extends NavigationState = NavigationState<ParamList>, ScreenOptions extends {} = {}, EventMap extends EventMapBase = {}> = Omit<NavigationHelpersCommon<ParamList, State>, 'getParent'> & {
236 /**
237 * Returns the navigation prop from a parent navigator based on the ID.
238 * If an ID is provided, the navigation prop from the parent navigator with matching ID (including current) will be returned.
239 * If no ID is provided, the navigation prop from the immediate parent navigator will be returned.
240 *
241 * @param id Optional ID of a parent navigator.
242 */
243 getParent<T = NavigationProp<ParamListBase> | undefined>(id?: NavigatorID): T;
244 /**
245 * Update the param object for the route.
246 * The new params will be shallow merged with the old one.
247 *
248 * @param params Params object for the current route.
249 */
250 setParams(params: Partial<ParamList[RouteName]>): void;
251 /**
252 * Update the options for the route.
253 * The options object will be shallow merged with default options object.
254 *
255 * @param options Options object for the route.
256 */
257 setOptions(options: Partial<ScreenOptions>): void;
258} & EventConsumer<EventMap & EventMapCore<State>> & PrivateValueStore<[ParamList, RouteName, EventMap]>;
259export declare type RouteProp<ParamList extends ParamListBase, RouteName extends keyof ParamList = Keyof<ParamList>> = Route<Extract<RouteName, string>, ParamList[RouteName]>;
260export declare type CompositeNavigationProp<A extends NavigationProp<ParamListBase, string, any, any, any>, B extends NavigationHelpersCommon<ParamListBase, any>> = Omit<A & B, keyof NavigationProp<any>> & NavigationProp<
261/**
262 * Param list from both navigation objects needs to be combined
263 * For example, we should be able to navigate to screens in both A and B
264 */
265(A extends NavigationHelpersCommon<infer T> ? T : never) & (B extends NavigationHelpersCommon<infer U> ? U : never),
266/**
267 * The route name should refer to the route name specified in the first type
268 * Ideally it should work for any of them, but it's not possible to infer that way
269 */
270A extends NavigationProp<any, infer R> ? R : string,
271/**
272 * ID from both navigation objects needs to be combined for `getParent`
273 */
274(A extends NavigationProp<any, any, infer I> ? I : never) | (B extends NavigationProp<any, any, infer J> ? J : never),
275/**
276 * The type of state should refer to the state specified in the first type
277 */
278A extends NavigationProp<any, any, any, infer S> ? S : NavigationState,
279/**
280 * Screen options from both navigation objects needs to be combined
281 * This allows typechecking `setOptions`
282 */
283(A extends NavigationProp<any, any, any, any, infer O> ? O : {}) & (B extends NavigationProp<any, any, any, any, infer P> ? P : {}),
284/**
285 * Event consumer config should refer to the config specified in the first type
286 * This allows typechecking `addListener`/`removeListener`
287 */
288A extends NavigationProp<any, any, any, any, any, infer E> ? E : {}>;
289export declare type CompositeScreenProps<A extends {
290 navigation: NavigationProp<ParamListBase, string, string | undefined, any, any, any>;
291 route: RouteProp<ParamListBase>;
292}, B extends {
293 navigation: NavigationHelpersCommon<any, any>;
294}> = {
295 navigation: CompositeNavigationProp<A['navigation'], B['navigation']>;
296 route: A['route'];
297};
298export declare type Descriptor<ScreenOptions extends {}, Navigation extends NavigationProp<any, any, any, any, any, any>, Route extends RouteProp<any, any>> = {
299 /**
300 * Render the component associated with this route.
301 */
302 render(): JSX.Element;
303 /**
304 * Options for the route.
305 */
306 options: ScreenOptions;
307 /**
308 * Route object for the screen
309 */
310 route: Route;
311 /**
312 * Navigation object for the screen
313 */
314 navigation: Navigation;
315};
316export declare type ScreenListeners<State extends NavigationState, EventMap extends EventMapBase> = Partial<{
317 [EventName in keyof (EventMap & EventMapCore<State>)]: EventListenerCallback<EventMap, EventName>;
318}>;
319export declare type RouteConfigComponent<ParamList extends ParamListBase, RouteName extends keyof ParamList> = {
320 /**
321 * React component to render for this screen.
322 */
323 component: React.ComponentType<any>;
324 getComponent?: never;
325 children?: never;
326} | {
327 /**
328 * Lazily get a React component to render for this screen.
329 */
330 getComponent: () => React.ComponentType<any>;
331 component?: never;
332 children?: never;
333} | {
334 /**
335 * Render callback to render content of this screen.
336 */
337 children: (props: {
338 route: RouteProp<ParamList, RouteName>;
339 navigation: any;
340 }) => React.ReactNode;
341 component?: never;
342 getComponent?: never;
343};
344export declare type RouteConfig<ParamList extends ParamListBase, RouteName extends keyof ParamList, State extends NavigationState, ScreenOptions extends {}, EventMap extends EventMapBase> = {
345 /**
346 * Optional key for this screen. This doesn't need to be unique.
347 * If the key changes, existing screens with this name will be removed or reset.
348 * Useful when we have some common screens and have conditional rendering.
349 */
350 navigationKey?: string;
351 /**
352 * Route name of this screen.
353 */
354 name: RouteName;
355 /**
356 * Navigator options for this screen.
357 */
358 options?: ScreenOptions | ((props: {
359 route: RouteProp<ParamList, RouteName>;
360 navigation: any;
361 }) => ScreenOptions);
362 /**
363 * Event listeners for this screen.
364 */
365 listeners?: ScreenListeners<State, EventMap> | ((props: {
366 route: RouteProp<ParamList, RouteName>;
367 navigation: any;
368 }) => ScreenListeners<State, EventMap>);
369 /**
370 * Function to return an unique ID for this screen.
371 * Receives an object with the route params.
372 * For a given screen name, there will always be only one screen corresponding to an ID.
373 * If `undefined` is returned, it acts same as no `getId` being specified.
374 */
375 getId?: ({ params }: {
376 params: ParamList[RouteName];
377 }) => string | undefined;
378 /**
379 * Initial params object for the route.
380 */
381 initialParams?: Partial<ParamList[RouteName]>;
382} & RouteConfigComponent<ParamList, RouteName>;
383export declare type RouteGroupConfig<ParamList extends ParamListBase, ScreenOptions extends {}> = {
384 /**
385 * Optional key for the screens in this group.
386 * If the key changes, all existing screens in this group will be removed or reset.
387 */
388 navigationKey?: string;
389 /**
390 * Navigator options for this screen.
391 */
392 screenOptions?: ScreenOptions | ((props: {
393 route: RouteProp<ParamList, keyof ParamList>;
394 navigation: any;
395 }) => ScreenOptions);
396 /**
397 * Children React Elements to extract the route configuration from.
398 * Only `Screen`, `Group` and `React.Fragment` are supported as children.
399 */
400 children: React.ReactNode;
401};
402export declare type NavigationContainerEventMap = {
403 /**
404 * Event which fires when the navigation state changes.
405 */
406 state: {
407 data: {
408 /**
409 * The updated state object after the state change.
410 */
411 state: NavigationState | PartialState<NavigationState> | undefined;
412 };
413 };
414 /**
415 * Event which fires when current options changes.
416 */
417 options: {
418 data: {
419 options: object;
420 };
421 };
422 /**
423 * Event which fires when an action is dispatched.
424 * Only intended for debugging purposes, don't use it for app logic.
425 * This event will be emitted before state changes have been applied.
426 */
427 __unsafe_action__: {
428 data: {
429 /**
430 * The action object which was dispatched.
431 */
432 action: NavigationAction;
433 /**
434 * Whether the action was a no-op, i.e. resulted any state changes.
435 */
436 noop: boolean;
437 /**
438 * Stack trace of the action, this will only be available during development.
439 */
440 stack: string | undefined;
441 };
442 };
443};
444export declare type NavigationContainerRef<ParamList extends {}> = NavigationHelpers<ParamList> & EventConsumer<NavigationContainerEventMap> & {
445 /**
446 * Reset the navigation state of the root navigator to the provided state.
447 *
448 * @param state Navigation state object.
449 */
450 resetRoot(state?: PartialState<NavigationState> | NavigationState): void;
451 /**
452 * Get the rehydrated navigation state of the navigation tree.
453 */
454 getRootState(): NavigationState;
455 /**
456 * Get the currently focused navigation route.
457 */
458 getCurrentRoute(): Route<string> | undefined;
459 /**
460 * Get the currently focused route's options.
461 */
462 getCurrentOptions(): object | undefined;
463 /**
464 * Whether the navigation container is ready to handle actions.
465 */
466 isReady(): boolean;
467};
468export declare type NavigationContainerRefWithCurrent<ParamList extends {}> = NavigationContainerRef<ParamList> & {
469 current: NavigationContainerRef<ParamList> | null;
470};
471export declare type TypedNavigator<ParamList extends ParamListBase, State extends NavigationState, ScreenOptions extends {}, EventMap extends EventMapBase, Navigator extends React.ComponentType<any>> = {
472 /**
473 * Navigator component which manages the child screens.
474 */
475 Navigator: React.ComponentType<Omit<React.ComponentProps<Navigator>, keyof DefaultNavigatorOptions<any, any, any, any>> & DefaultNavigatorOptions<ParamList, State, ScreenOptions, EventMap>>;
476 /**
477 * Component used for grouping multiple route configuration.
478 */
479 Group: React.ComponentType<RouteGroupConfig<ParamList, ScreenOptions>>;
480 /**
481 * Component used for specifying route configuration.
482 */
483 Screen: <RouteName extends keyof ParamList>(_: RouteConfig<ParamList, RouteName, State, ScreenOptions, EventMap>) => null;
484};
485export declare type NavigatorScreenParams<ParamList, State extends NavigationState = NavigationState> = {
486 screen?: never;
487 params?: never;
488 initial?: never;
489 path?: string;
490 state: PartialState<State> | State | undefined;
491} | {
492 [RouteName in keyof ParamList]: undefined extends ParamList[RouteName] ? {
493 screen: RouteName;
494 params?: ParamList[RouteName];
495 initial?: boolean;
496 path?: string;
497 state?: never;
498 } : {
499 screen: RouteName;
500 params: ParamList[RouteName];
501 initial?: boolean;
502 path?: string;
503 state?: never;
504 };
505}[keyof ParamList];
506export declare type PathConfig<ParamList extends {}> = {
507 path?: string;
508 exact?: boolean;
509 parse?: Record<string, (value: string) => any>;
510 stringify?: Record<string, (value: any) => string>;
511 screens?: PathConfigMap<ParamList>;
512 initialRouteName?: keyof ParamList;
513};
514export declare type PathConfigMap<ParamList extends {}> = {
515 [RouteName in keyof ParamList]?: NonNullable<ParamList[RouteName]> extends NavigatorScreenParams<infer T, any> ? string | PathConfig<T> : string | Omit<PathConfig<{}>, 'screens' | 'initialRouteName'>;
516};
517export {};