UNPKG

3.83 kBJavaScriptView Raw
1function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
3import * as React from 'react';
4import { BaseNavigationContainer } from '@react-navigation/core';
5import ThemeProvider from './theming/ThemeProvider';
6import DefaultTheme from './theming/DefaultTheme';
7import LinkingContext from './LinkingContext';
8import useThenable from './useThenable';
9import useLinking from './useLinking';
10import useDocumentTitle from './useDocumentTitle';
11import useBackButton from './useBackButton';
12
13/**
14 * Container component which holds the navigation state designed for React Native apps.
15 * This should be rendered at the root wrapping the whole app.
16 *
17 * @param props.initialState Initial state object for the navigation tree. When deep link handling is enabled, this will override deep links when specified. Make sure that you don't specify an `initialState` when there's a deep link (`Linking.getInitialURL()`).
18 * @param props.onReady Callback which is called after the navigation tree mounts.
19 * @param props.onStateChange Callback which is called with the latest navigation state when it changes.
20 * @param props.theme Theme object for the navigators.
21 * @param props.linking Options for deep linking. Deep link handling is enabled when this prop is provided, unless `linking.enabled` is `false`.
22 * @param props.fallback Fallback component to render until we have finished getting initial state when linking is enabled. Defaults to `null`.
23 * @param props.documentTitle Options to configure the document title on Web. Updating document title is handled by default unless `documentTitle.enabled` is `false`.
24 * @param props.children Child elements to render the content.
25 * @param props.ref Ref object which refers to the navigation object containing helper methods.
26 */
27const NavigationContainer = /*#__PURE__*/React.forwardRef(function NavigationContainer({
28 theme = DefaultTheme,
29 linking,
30 fallback = null,
31 documentTitle,
32 onReady,
33 ...rest
34}, ref) {
35 const isLinkingEnabled = linking ? linking.enabled !== false : false;
36 const refContainer = React.useRef(null);
37 useBackButton(refContainer);
38 useDocumentTitle(refContainer, documentTitle);
39 const {
40 getInitialState
41 } = useLinking(refContainer, {
42 enabled: isLinkingEnabled,
43 prefixes: [],
44 ...linking
45 });
46 const [isResolved, initialState] = useThenable(getInitialState);
47 React.useImperativeHandle(ref, () => refContainer.current);
48 const linkingContext = React.useMemo(() => ({
49 options: linking
50 }), [linking]);
51 const isReady = rest.initialState != null || !isLinkingEnabled || isResolved;
52 const onReadyRef = React.useRef(onReady);
53 React.useEffect(() => {
54 onReadyRef.current = onReady;
55 });
56 React.useEffect(() => {
57 if (isReady) {
58 var _onReadyRef$current;
59
60 (_onReadyRef$current = onReadyRef.current) === null || _onReadyRef$current === void 0 ? void 0 : _onReadyRef$current.call(onReadyRef);
61 }
62 }, [isReady]);
63
64 if (!isReady) {
65 // This is temporary until we have Suspense for data-fetching
66 // Then the fallback will be handled by a parent `Suspense` component
67 return fallback;
68 }
69
70 return /*#__PURE__*/React.createElement(LinkingContext.Provider, {
71 value: linkingContext
72 }, /*#__PURE__*/React.createElement(ThemeProvider, {
73 value: theme
74 }, /*#__PURE__*/React.createElement(BaseNavigationContainer, _extends({}, rest, {
75 initialState: rest.initialState == null ? initialState : rest.initialState,
76 ref: refContainer
77 }))));
78});
79export default NavigationContainer;
80//# sourceMappingURL=NavigationContainer.js.map
\No newline at end of file