expo-router 4.0.0-preview.11 → 4.0.0-preview.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/ExpoRoot.js +2 -2
- package/build/ExpoRoot.js.map +1 -1
- package/build/exports.d.ts +1 -1
- package/build/exports.d.ts.map +1 -1
- package/build/exports.js +24 -2
- package/build/exports.js.map +1 -1
- package/build/fast-refresh.d.ts.map +1 -1
- package/build/fast-refresh.js.map +1 -1
- package/build/getRoutesCore.d.ts +1 -0
- package/build/getRoutesCore.d.ts.map +1 -1
- package/build/getRoutesCore.js +3 -1
- package/build/getRoutesCore.js.map +1 -1
- package/build/global-state/router-store.d.ts.map +1 -1
- package/build/global-state/router-store.js +1 -2
- package/build/global-state/router-store.js.map +1 -1
- package/build/head/url.d.ts +1 -0
- package/build/head/url.d.ts.map +1 -1
- package/build/head/url.js +21 -4
- package/build/head/url.js.map +1 -1
- package/build/hooks.d.ts +90 -38
- package/build/hooks.d.ts.map +1 -1
- package/build/hooks.js +46 -39
- package/build/hooks.js.map +1 -1
- package/build/imperative-api.d.ts +58 -15
- package/build/imperative-api.d.ts.map +1 -1
- package/build/imperative-api.js.map +1 -1
- package/build/layouts/Drawer.d.ts +2 -142
- package/build/layouts/Drawer.d.ts.map +1 -1
- package/build/layouts/Drawer.js +8 -5
- package/build/layouts/Drawer.js.map +1 -1
- package/build/layouts/DrawerClient.d.ts +144 -0
- package/build/layouts/DrawerClient.d.ts.map +1 -0
- package/build/layouts/DrawerClient.js +10 -0
- package/build/layouts/DrawerClient.js.map +1 -0
- package/build/layouts/Stack.d.ts +2 -126
- package/build/layouts/Stack.d.ts.map +1 -1
- package/build/layouts/Stack.js +8 -6
- package/build/layouts/Stack.js.map +1 -1
- package/build/layouts/StackClient.d.ts +128 -0
- package/build/layouts/StackClient.d.ts.map +1 -0
- package/build/layouts/StackClient.js +10 -0
- package/build/layouts/StackClient.js.map +1 -0
- package/build/layouts/Tabs.d.ts +2 -134
- package/build/layouts/Tabs.d.ts.map +1 -1
- package/build/layouts/Tabs.js +5 -37
- package/build/layouts/Tabs.js.map +1 -1
- package/build/layouts/TabsClient.d.ts +136 -0
- package/build/layouts/TabsClient.d.ts.map +1 -0
- package/build/layouts/TabsClient.js +44 -0
- package/build/layouts/TabsClient.js.map +1 -0
- package/build/layouts/withLayoutContext.d.ts +4 -1
- package/build/layouts/withLayoutContext.d.ts.map +1 -1
- package/build/layouts/withLayoutContext.js +4 -1
- package/build/layouts/withLayoutContext.js.map +1 -1
- package/build/link/Link.d.ts +48 -4
- package/build/link/Link.d.ts.map +1 -1
- package/build/link/Link.js +47 -3
- package/build/link/Link.js.map +1 -1
- package/build/link/href.d.ts +1 -1
- package/build/link/href.d.ts.map +1 -1
- package/build/link/href.js.map +1 -1
- package/build/link/useLinkHooks.d.ts +122 -29
- package/build/link/useLinkHooks.d.ts.map +1 -1
- package/build/link/useLinkHooks.js.map +1 -1
- package/build/renderRootComponent.d.ts.map +1 -1
- package/build/renderRootComponent.js +1 -2
- package/build/renderRootComponent.js.map +1 -1
- package/build/rsc/exports.d.ts +3 -1
- package/build/rsc/exports.d.ts.map +1 -1
- package/build/rsc/exports.js +3 -1
- package/build/rsc/exports.js.map +1 -1
- package/build/rsc/middleware.d.ts +1 -1
- package/build/rsc/middleware.d.ts.map +1 -1
- package/build/rsc/middleware.js +2 -1
- package/build/rsc/middleware.js.map +1 -1
- package/build/rsc/router/client.d.ts +2 -2
- package/build/rsc/router/client.d.ts.map +1 -1
- package/build/rsc/router/client.js.map +1 -1
- package/build/rsc/router/host.d.ts.map +1 -1
- package/build/rsc/router/host.js +20 -15
- package/build/rsc/router/host.js.map +1 -1
- package/build/rsc/rsc-renderer.d.ts +1 -1
- package/build/rsc/rsc-renderer.d.ts.map +1 -1
- package/build/rsc/rsc-renderer.js +1 -1
- package/build/rsc/rsc-renderer.js.map +1 -1
- package/build/rsc/server.d.ts +3 -0
- package/build/rsc/server.d.ts.map +1 -1
- package/build/rsc/server.js +19 -1
- package/build/rsc/server.js.map +1 -1
- package/build/testing-library/context-stubs.d.ts.map +1 -1
- package/build/testing-library/context-stubs.js +3 -1
- package/build/testing-library/context-stubs.js.map +1 -1
- package/build/testing-library/mocks.js +14 -13
- package/build/testing-library/mocks.js.map +1 -1
- package/build/typed-routes/generate.d.ts +5 -1
- package/build/typed-routes/generate.d.ts.map +1 -1
- package/build/typed-routes/generate.js +129 -64
- package/build/typed-routes/generate.js.map +1 -1
- package/build/typed-routes/index.d.ts +5 -0
- package/build/typed-routes/index.d.ts.map +1 -1
- package/build/typed-routes/index.js +8 -3
- package/build/typed-routes/index.js.map +1 -1
- package/build/typed-routes/testSetup.d.ts +1 -1
- package/build/typed-routes/testSetup.d.ts.map +1 -1
- package/build/typed-routes/testSetup.js +29 -17
- package/build/typed-routes/testSetup.js.map +1 -1
- package/build/typed-routes/types.d.ts +43 -145
- package/build/typed-routes/types.d.ts.map +1 -1
- package/build/typed-routes/types.js.map +1 -1
- package/build/types.d.ts +33 -0
- package/build/types.d.ts.map +1 -1
- package/build/types.js.map +1 -1
- package/build/ui/TabContext.d.ts +158 -1
- package/build/ui/TabContext.d.ts.map +1 -1
- package/build/ui/TabContext.js +25 -1
- package/build/ui/TabContext.js.map +1 -1
- package/build/ui/TabList.d.ts +17 -1
- package/build/ui/TabList.d.ts.map +1 -1
- package/build/ui/TabList.js +16 -0
- package/build/ui/TabList.js.map +1 -1
- package/build/ui/TabSlot.d.ts +55 -5
- package/build/ui/TabSlot.d.ts.map +1 -1
- package/build/ui/TabSlot.js +38 -14
- package/build/ui/TabSlot.js.map +1 -1
- package/build/ui/TabTrigger.d.ts +65 -70
- package/build/ui/TabTrigger.d.ts.map +1 -1
- package/build/ui/TabTrigger.js +25 -1
- package/build/ui/TabTrigger.js.map +1 -1
- package/build/ui/Tabs.d.ts +89 -132
- package/build/ui/Tabs.d.ts.map +1 -1
- package/build/ui/Tabs.js +53 -8
- package/build/ui/Tabs.js.map +1 -1
- package/build/ui/common.d.ts +3 -3
- package/build/ui/common.d.ts.map +1 -1
- package/build/ui/common.js.map +1 -1
- package/build/useFocusEffect.d.ts +15 -6
- package/build/useFocusEffect.d.ts.map +1 -1
- package/build/useFocusEffect.js +15 -6
- package/build/useFocusEffect.js.map +1 -1
- package/build/useNavigation.d.ts +11 -5
- package/build/useNavigation.d.ts.map +1 -1
- package/build/useNavigation.js +11 -5
- package/build/useNavigation.js.map +1 -1
- package/build/utils/splash.d.ts +6 -0
- package/build/utils/splash.d.ts.map +1 -0
- package/build/utils/splash.js +51 -0
- package/build/utils/splash.js.map +1 -0
- package/build/views/Navigator.d.ts +6 -5
- package/build/views/Navigator.d.ts.map +1 -1
- package/build/views/Navigator.js +6 -5
- package/build/views/Navigator.js.map +1 -1
- package/build/views/Splash.d.ts +1 -1
- package/build/views/Splash.d.ts.map +1 -1
- package/build/views/Splash.js +3 -13
- package/build/views/Splash.js.map +1 -1
- package/build/views/Try.d.ts +1 -1
- package/build/views/Try.d.ts.map +1 -1
- package/build/views/Try.js +1 -1
- package/build/views/Try.js.map +1 -1
- package/entry-classic.js +0 -6
- package/package.json +3 -5
- package/plugin/build/index.d.ts +2 -0
- package/plugin/options.json +74 -73
- package/rsc/entry.js +0 -6
- package/rsc/headers.d.ts +3 -0
- package/rsc/headers.js +5 -0
- package/build/rsc/runtime.d.ts +0 -9
- package/build/rsc/runtime.d.ts.map +0 -1
- package/build/rsc/runtime.js +0 -36
- package/build/rsc/runtime.js.map +0 -1
- package/virtual-client-boundaries.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabContext.d.ts","sourceRoot":"","sources":["../../src/ui/TabContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,gBAAgB,EAChB,oBAAoB,EACrB,MAAM,0BAA0B,CAAC;AAGlC,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAEtC,MAAM,MAAM,aAAa,GAAG,wBAAwB,CAAC;AAErD,MAAM,MAAM,8BAA8B,GAAG;IAC3C,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,uBAAuB,CAC5D,aAAa,EACb,MAAM,GAAG,SAAS,EAClB,kBAAkB,CAAC,aAAa,CAAC,EACjC,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,CAAC,aAAa,CAAC,CACtC,GAEC,IAAI,CAAC,gBAAgB,EAAE,kBAAkB,CAAC,GAC1C,8BAA8B,CAAC;AAEjC,MAAM,MAAM,sBAAsB,CAChC,SAAS,SAAS,aAAa,EAC/B,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,EACnD,WAAW,SAAS,MAAM,GAAG,SAAS,GAAG,SAAS,IAChD,cAAc,CAChB,SAAS,EACT,SAAS,EACT,WAAW,EACX,kBAAkB,CAAC,aAAa,CAAC,EACjC,qBAAqB,EACrB,qBAAqB,CACtB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,
|
|
1
|
+
{"version":3,"file":"TabContext.d.ts","sourceRoot":"","sources":["../../src/ui/TabContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,0BAA0B,EAAE,MAAM,+BAA+B,CAAC;AAC3E,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,gBAAgB,EAChB,oBAAoB,EACrB,MAAM,0BAA0B,CAAC;AAGlC,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAEtC,MAAM,MAAM,aAAa,GAAG,wBAAwB,CAAC;AAErD,MAAM,MAAM,8BAA8B,GAAG;IAC3C,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,uBAAuB,CAC5D,aAAa,EACb,MAAM,GAAG,SAAS,EAClB,kBAAkB,CAAC,aAAa,CAAC,EACjC,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,CAAC,aAAa,CAAC,CACtC,GAEC,IAAI,CAAC,gBAAgB,EAAE,kBAAkB,CAAC,GAC1C,8BAA8B,CAAC;AAEjC,MAAM,MAAM,sBAAsB,CAChC,SAAS,SAAS,aAAa,EAC/B,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,EACnD,WAAW,SAAS,MAAM,GAAG,SAAS,GAAG,SAAS,IAChD,cAAc,CAChB,SAAS,EACT,SAAS,EACT,WAAW,EACX,kBAAkB,CAAC,aAAa,CAAC,EACjC,qBAAqB,EACrB,qBAAqB,CACtB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,IAAI,CACtC,0BAA0B,EAC1B,OAAO,GAAG,MAAM,GAAG,cAAc,CAClC,GAAG;IACF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,gBAAgB,CAAC;CAC1B,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,QAAQ,EAAE;QAAE,IAAI,EAAE,SAAS,CAAC;QAAC,iBAAiB,EAAE,IAAI,CAAA;KAAE,CAAC;IACvD;;OAEG;IACH,YAAY,EAAE;QAAE,IAAI,EAAE,SAAS,CAAA;KAAE,CAAC;CACnC,CAAC;AAEF;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,UAAU,CACvC,OAAO,oBAAoB,CACzB,kBAAkB,CAAC,GAAG,CAAC,EACvB,gBAAgB,EAChB,gBAAgB,CAAC,aAAa,CAAC,EAC/B,8BAA8B,EAC9B,qBAAqB,CACtB,CACF,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC;AAExD,eAAO,MAAM,UAAU,yDAAqC,CAAC;AAC7D;;GAEG;AACH,eAAO,MAAM,oBAAoB,qCAAgC,CAAC;AAClE;;GAEG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uWAAqD,CAAC;AACzF;;GAEG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4CAA6D,CAAC;AAC/F;;GAEG;AACH,eAAO,MAAM,gBAAgB,kDAS3B,CAAC;AAEH,MAAM,MAAM,KAAK,GAAG,kBAAkB,CAAC,aAAa,CAAC,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;AACxE,MAAM,MAAM,cAAc,GAAG,gBAAgB,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC"}
|
package/build/ui/TabContext.js
CHANGED
|
@@ -1,7 +1,31 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TabTriggerMapContext = exports.TabContext = void 0;
|
|
3
|
+
exports.TabsStateContext = exports.TabsNavigatorContext = exports.TabsDescriptorsContext = exports.TabTriggerMapContext = exports.TabContext = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
5
|
exports.TabContext = (0, react_1.createContext)({});
|
|
6
|
+
/**
|
|
7
|
+
* @hidden
|
|
8
|
+
*/
|
|
6
9
|
exports.TabTriggerMapContext = (0, react_1.createContext)({});
|
|
10
|
+
/**
|
|
11
|
+
* @hidden
|
|
12
|
+
*/
|
|
13
|
+
exports.TabsDescriptorsContext = (0, react_1.createContext)({});
|
|
14
|
+
/**
|
|
15
|
+
* @hidden
|
|
16
|
+
*/
|
|
17
|
+
exports.TabsNavigatorContext = (0, react_1.createContext)(null);
|
|
18
|
+
/**
|
|
19
|
+
* @hidden
|
|
20
|
+
*/
|
|
21
|
+
exports.TabsStateContext = (0, react_1.createContext)({
|
|
22
|
+
type: 'tab',
|
|
23
|
+
preloadedRouteKeys: [],
|
|
24
|
+
history: [],
|
|
25
|
+
index: -1,
|
|
26
|
+
key: '',
|
|
27
|
+
stale: false,
|
|
28
|
+
routeNames: [],
|
|
29
|
+
routes: [],
|
|
30
|
+
});
|
|
7
31
|
//# sourceMappingURL=TabContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabContext.js","sourceRoot":"","sources":["../../src/ui/TabContext.tsx"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"TabContext.js","sourceRoot":"","sources":["../../src/ui/TabContext.tsx"],"names":[],"mappings":";;;AAWA,iCAAsC;AAiFzB,QAAA,UAAU,GAAG,IAAA,qBAAa,EAAkB,EAAE,CAAC,CAAC;AAC7D;;GAEG;AACU,QAAA,oBAAoB,GAAG,IAAA,qBAAa,EAAa,EAAE,CAAC,CAAC;AAClE;;GAEG;AACU,QAAA,sBAAsB,GAAG,IAAA,qBAAa,EAAkC,EAAE,CAAC,CAAC;AACzF;;GAEG;AACU,QAAA,oBAAoB,GAAG,IAAA,qBAAa,EAAwC,IAAI,CAAC,CAAC;AAC/F;;GAEG;AACU,QAAA,gBAAgB,GAAG,IAAA,qBAAa,EAA4B;IACvE,IAAI,EAAE,KAAK;IACX,kBAAkB,EAAE,EAAE;IACtB,OAAO,EAAE,EAAE;IACX,KAAK,EAAE,CAAC,CAAC;IACT,GAAG,EAAE,EAAE;IACP,KAAK,EAAE,KAAK;IACZ,UAAU,EAAE,EAAE;IACd,MAAM,EAAE,EAAE;CACX,CAAC,CAAC","sourcesContent":["import { BottomTabNavigationOptions } from '@react-navigation/bottom-tabs';\nimport {\n DefaultNavigatorOptions,\n NavigationAction,\n NavigationProp,\n ParamListBase,\n TabActionHelpers,\n TabNavigationState,\n TabRouterOptions,\n useNavigationBuilder,\n} from '@react-navigation/native';\nimport { createContext } from 'react';\n\nimport { TriggerMap } from './common';\n\nexport type ExpoTabsProps = ExpoTabsNavigatorOptions;\n\nexport type ExpoTabsNavigatorScreenOptions = {\n detachInactiveScreens?: boolean;\n unmountOnBlur?: boolean;\n freezeOnBlur?: boolean;\n lazy?: boolean;\n};\n\nexport type ExpoTabsNavigatorOptions = DefaultNavigatorOptions<\n ParamListBase,\n string | undefined,\n TabNavigationState<ParamListBase>,\n ExpoTabsScreenOptions,\n TabNavigationEventMap,\n ExpoTabsNavigationProp<ParamListBase>\n> &\n // Should be set through `unstable_settings`\n Omit<TabRouterOptions, 'initialRouteName'> &\n ExpoTabsNavigatorScreenOptions;\n\nexport type ExpoTabsNavigationProp<\n ParamList extends ParamListBase,\n RouteName extends keyof ParamList = keyof ParamList,\n NavigatorID extends string | undefined = undefined,\n> = NavigationProp<\n ParamList,\n RouteName,\n NavigatorID,\n TabNavigationState<ParamListBase>,\n ExpoTabsScreenOptions,\n TabNavigationEventMap\n>;\n\n/**\n * @hidden\n */\nexport type ExpoTabsScreenOptions = Pick<\n BottomTabNavigationOptions,\n 'title' | 'lazy' | 'freezeOnBlur'\n> & {\n params?: object;\n title: string;\n action: NavigationAction;\n};\n\n/**\n * @hidden\n */\nexport type TabNavigationEventMap = {\n /**\n * Event which fires on tapping on the tab in the tab bar.\n */\n tabPress: { data: undefined; canPreventDefault: true };\n /**\n * Event which fires on long press on the tab in the tab bar.\n */\n tabLongPress: { data: undefined };\n};\n\n/**\n * The React Navigation custom navigator.\n *\n * @see [`useNavigationBuilder`](https://reactnavigation.org/docs/custom-navigators/#usenavigationbuilder) hook from React Navigation for more information.\n */\nexport type TabsContextValue = ReturnType<\n typeof useNavigationBuilder<\n TabNavigationState<any>,\n TabRouterOptions,\n TabActionHelpers<ParamListBase>,\n ExpoTabsNavigatorScreenOptions,\n TabNavigationEventMap\n >\n>;\n\nexport type TabContextValue = TabsDescriptor['options'];\n\nexport const TabContext = createContext<TabContextValue>({});\n/**\n * @hidden\n */\nexport const TabTriggerMapContext = createContext<TriggerMap>({});\n/**\n * @hidden\n */\nexport const TabsDescriptorsContext = createContext<TabsContextValue['descriptors']>({});\n/**\n * @hidden\n */\nexport const TabsNavigatorContext = createContext<TabsContextValue['navigation'] | null>(null);\n/**\n * @hidden\n */\nexport const TabsStateContext = createContext<TabsContextValue['state']>({\n type: 'tab',\n preloadedRouteKeys: [],\n history: [],\n index: -1,\n key: '',\n stale: false,\n routeNames: [],\n routes: [],\n});\n\nexport type Route = TabNavigationState<ParamListBase>['routes'][number];\nexport type TabsDescriptor = TabsContextValue['descriptors'][number];\n"]}
|
package/build/ui/TabList.d.ts
CHANGED
|
@@ -1,9 +1,25 @@
|
|
|
1
1
|
import { ReactElement, ComponentProps } from 'react';
|
|
2
2
|
import { ViewProps } from 'react-native';
|
|
3
3
|
export type TabListProps = ViewProps & {
|
|
4
|
-
/** Forward props to child component and removes the extra
|
|
4
|
+
/** Forward props to child component and removes the extra `<View>`. Useful for custom wrappers. */
|
|
5
5
|
asChild?: boolean;
|
|
6
6
|
};
|
|
7
|
+
/**
|
|
8
|
+
* Wrapper component for `TabTriggers`. `TabTriggers` within the `TabList` define the tabs.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* <Tabs>
|
|
13
|
+
* <TabSlot />
|
|
14
|
+
* <TabList>
|
|
15
|
+
* <TabTrigger name="home" href="/" />
|
|
16
|
+
* </TabList>
|
|
17
|
+
* </Tabs>
|
|
18
|
+
* ```
|
|
19
|
+
*/
|
|
7
20
|
export declare function TabList({ asChild, style, ...props }: TabListProps): import("react").JSX.Element;
|
|
21
|
+
/**
|
|
22
|
+
* @hidden
|
|
23
|
+
*/
|
|
8
24
|
export declare function isTabList(child: ReactElement<any>): child is ReactElement<ComponentProps<typeof TabList>>;
|
|
9
25
|
//# sourceMappingURL=TabList.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabList.d.ts","sourceRoot":"","sources":["../../src/ui/TabList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AAI3D,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG;IACrC,mGAAmG;IACnG,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,+BAGjE;AAED,wBAAgB,SAAS,CACvB,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,GACvB,KAAK,IAAI,YAAY,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,CAEvD"}
|
|
1
|
+
{"version":3,"file":"TabList.d.ts","sourceRoot":"","sources":["../../src/ui/TabList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AAI3D,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG;IACrC,mGAAmG;IACnG,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,wBAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,+BAGjE;AAED;;GAEG;AACH,wBAAgB,SAAS,CACvB,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,GACvB,KAAK,IAAI,YAAY,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,CAEvD"}
|
package/build/ui/TabList.js
CHANGED
|
@@ -3,11 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.isTabList = exports.TabList = void 0;
|
|
4
4
|
const react_native_1 = require("react-native");
|
|
5
5
|
const common_1 = require("./common");
|
|
6
|
+
/**
|
|
7
|
+
* Wrapper component for `TabTriggers`. `TabTriggers` within the `TabList` define the tabs.
|
|
8
|
+
*
|
|
9
|
+
* @example
|
|
10
|
+
* ```tsx
|
|
11
|
+
* <Tabs>
|
|
12
|
+
* <TabSlot />
|
|
13
|
+
* <TabList>
|
|
14
|
+
* <TabTrigger name="home" href="/" />
|
|
15
|
+
* </TabList>
|
|
16
|
+
* </Tabs>
|
|
17
|
+
* ```
|
|
18
|
+
*/
|
|
6
19
|
function TabList({ asChild, style, ...props }) {
|
|
7
20
|
const Comp = asChild ? common_1.ViewSlot : react_native_1.View;
|
|
8
21
|
return <Comp style={[styles.tabList, style]} {...props}/>;
|
|
9
22
|
}
|
|
10
23
|
exports.TabList = TabList;
|
|
24
|
+
/**
|
|
25
|
+
* @hidden
|
|
26
|
+
*/
|
|
11
27
|
function isTabList(child) {
|
|
12
28
|
return child.type === TabList;
|
|
13
29
|
}
|
package/build/ui/TabList.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabList.js","sourceRoot":"","sources":["../../src/ui/TabList.tsx"],"names":[],"mappings":";;;AACA,+CAA2D;AAE3D,qCAAoC;AAOpC,SAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,KAAK,EAAgB;IAChE,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAQ,CAAC,CAAC,CAAC,mBAAI,CAAC;IACvC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AAC7D,CAAC;AAHD,0BAGC;AAED,SAAgB,SAAS,CACvB,KAAwB;IAExB,OAAO,KAAK,CAAC,IAAI,KAAK,OAAO,CAAC;AAChC,CAAC;AAJD,8BAIC;AAED,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,OAAO,EAAE;QACP,aAAa,EAAE,KAAK;QACpB,cAAc,EAAE,eAAe;KAChC;IACD,UAAU,EAAE;QACV,aAAa,EAAE,KAAK;QACpB,cAAc,EAAE,eAAe;KAChC;CACF,CAAC,CAAC","sourcesContent":["import { ReactElement, ComponentProps } from 'react';\nimport { View, StyleSheet, ViewProps } from 'react-native';\n\nimport { ViewSlot } from './common';\n\nexport type TabListProps = ViewProps & {\n /** Forward props to child component and removes the extra
|
|
1
|
+
{"version":3,"file":"TabList.js","sourceRoot":"","sources":["../../src/ui/TabList.tsx"],"names":[],"mappings":";;;AACA,+CAA2D;AAE3D,qCAAoC;AAOpC;;;;;;;;;;;;GAYG;AACH,SAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,KAAK,EAAgB;IAChE,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAQ,CAAC,CAAC,CAAC,mBAAI,CAAC;IACvC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AAC7D,CAAC;AAHD,0BAGC;AAED;;GAEG;AACH,SAAgB,SAAS,CACvB,KAAwB;IAExB,OAAO,KAAK,CAAC,IAAI,KAAK,OAAO,CAAC;AAChC,CAAC;AAJD,8BAIC;AAED,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,OAAO,EAAE;QACP,aAAa,EAAE,KAAK;QACpB,cAAc,EAAE,eAAe;KAChC;IACD,UAAU,EAAE;QACV,aAAa,EAAE,KAAK;QACpB,cAAc,EAAE,eAAe;KAChC;CACF,CAAC,CAAC","sourcesContent":["import { ReactElement, ComponentProps } from 'react';\nimport { View, StyleSheet, ViewProps } from 'react-native';\n\nimport { ViewSlot } from './common';\n\nexport type TabListProps = ViewProps & {\n /** Forward props to child component and removes the extra `<View>`. Useful for custom wrappers. */\n asChild?: boolean;\n};\n\n/**\n * Wrapper component for `TabTriggers`. `TabTriggers` within the `TabList` define the tabs.\n *\n * @example\n * ```tsx\n * <Tabs>\n * <TabSlot />\n * <TabList>\n * <TabTrigger name=\"home\" href=\"/\" />\n * </TabList>\n * </Tabs>\n * ```\n */\nexport function TabList({ asChild, style, ...props }: TabListProps) {\n const Comp = asChild ? ViewSlot : View;\n return <Comp style={[styles.tabList, style]} {...props} />;\n}\n\n/**\n * @hidden\n */\nexport function isTabList(\n child: ReactElement<any>\n): child is ReactElement<ComponentProps<typeof TabList>> {\n return child.type === TabList;\n}\n\nconst styles = StyleSheet.create({\n tabList: {\n flexDirection: 'row',\n justifyContent: 'space-between',\n },\n tabTrigger: {\n flexDirection: 'row',\n justifyContent: 'space-between',\n },\n});\n"]}
|
package/build/ui/TabSlot.d.ts
CHANGED
|
@@ -3,22 +3,72 @@ import { ScreenContainer } from 'react-native-screens';
|
|
|
3
3
|
import { TabsDescriptor } from './TabContext';
|
|
4
4
|
import { TabListProps } from './TabList';
|
|
5
5
|
export type UseTabSlotOptions = ComponentProps<typeof ScreenContainer> & {
|
|
6
|
+
/**
|
|
7
|
+
* Remove inactive screens.
|
|
8
|
+
*/
|
|
6
9
|
detachInactiveScreens?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Override how the `Screen` component is rendered.
|
|
12
|
+
*/
|
|
7
13
|
renderFn?: typeof defaultTabsSlotRender;
|
|
8
14
|
};
|
|
15
|
+
/**
|
|
16
|
+
* Options provided to the `UseTabSlotOptions`.
|
|
17
|
+
*/
|
|
9
18
|
export type TabsSlotRenderOptions = {
|
|
19
|
+
/**
|
|
20
|
+
* Index of screen.
|
|
21
|
+
*/
|
|
10
22
|
index: number;
|
|
23
|
+
/**
|
|
24
|
+
* Whether the screen is focused.
|
|
25
|
+
*/
|
|
11
26
|
isFocused: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Whether the screen has been loaded.
|
|
29
|
+
*/
|
|
12
30
|
loaded: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Should the screen be unloaded when inactive.
|
|
33
|
+
*/
|
|
13
34
|
detachInactiveScreens: boolean;
|
|
14
35
|
};
|
|
15
|
-
|
|
36
|
+
/**
|
|
37
|
+
*
|
|
38
|
+
* Returns a `ReactElement` of the current tab.
|
|
39
|
+
*
|
|
40
|
+
* @see [`useTabSlot`](#usetabslotoptions).
|
|
41
|
+
*
|
|
42
|
+
* @example
|
|
43
|
+
* ```tsx
|
|
44
|
+
* function MyTabSlot() {
|
|
45
|
+
* const slot = useTabSlot();
|
|
46
|
+
*
|
|
47
|
+
* return slot;
|
|
48
|
+
* }
|
|
49
|
+
* ```
|
|
50
|
+
*/
|
|
51
|
+
export declare function useTabSlot(options?: UseTabSlotOptions): import("react").JSX.Element;
|
|
16
52
|
export type TabSlotProps = UseTabSlotOptions;
|
|
53
|
+
/**
|
|
54
|
+
* Renders the current tab.
|
|
55
|
+
*
|
|
56
|
+
* @see [`useTabSlot`](#usetabslot) for a hook version of this component.
|
|
57
|
+
*
|
|
58
|
+
* @example
|
|
59
|
+
* ```tsx
|
|
60
|
+
* <Tabs>
|
|
61
|
+
* <TabSlot />
|
|
62
|
+
* <TabList>
|
|
63
|
+
* <TabTrigger name="home" href="/" />
|
|
64
|
+
* </TabList>
|
|
65
|
+
* </Tabs>
|
|
66
|
+
* ```
|
|
67
|
+
*/
|
|
17
68
|
export declare function TabSlot(props: TabSlotProps): import("react").JSX.Element;
|
|
18
|
-
export declare function useTab(): {
|
|
19
|
-
options: import("./TabContext").ExpoTabsNavigatorScreenOptions;
|
|
20
|
-
setOptions: (options: Partial<{}>) => void;
|
|
21
|
-
};
|
|
22
69
|
export declare function defaultTabsSlotRender(descriptor: TabsDescriptor, { isFocused, loaded, detachInactiveScreens }: TabsSlotRenderOptions): import("react").JSX.Element | null;
|
|
70
|
+
/**
|
|
71
|
+
* @hidden
|
|
72
|
+
*/
|
|
23
73
|
export declare function isTabSlot(child: ReactElement<any>): child is ReactElement<TabListProps>;
|
|
24
74
|
//# sourceMappingURL=TabSlot.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabSlot.d.ts","sourceRoot":"","sources":["../../src/ui/TabSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,YAAY,
|
|
1
|
+
{"version":3,"file":"TabSlot.d.ts","sourceRoot":"","sources":["../../src/ui/TabSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAY,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,eAAe,EAAU,MAAM,sBAAsB,CAAC;AAE/D,OAAO,EAAc,cAAc,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAGzC,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,GAAG;IACvE;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,qBAAqB,CAAC;CACzC,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,qBAAqB,EAAE,OAAO,CAAC;CAChC,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,UAAU,CAAC,OAAO,GAAE,iBAAsB,+BAsCzD;AAED,MAAM,MAAM,YAAY,GAAG,iBAAiB,CAAC;AAE7C;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,+BAE1C;AAED,wBAAgB,qBAAqB,CACnC,UAAU,EAAE,cAAc,EAC1B,EAAE,SAAS,EAAE,MAAM,EAAE,qBAAqB,EAAE,EAAE,qBAAqB,sCAuBpE;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,GAAG,KAAK,IAAI,YAAY,CAAC,YAAY,CAAC,CAEvF"}
|
package/build/ui/TabSlot.js
CHANGED
|
@@ -1,15 +1,30 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.isTabSlot = exports.defaultTabsSlotRender = exports.
|
|
3
|
+
exports.isTabSlot = exports.defaultTabsSlotRender = exports.TabSlot = exports.useTabSlot = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
5
|
const react_native_1 = require("react-native");
|
|
6
6
|
const react_native_screens_1 = require("react-native-screens");
|
|
7
7
|
const TabContext_1 = require("./TabContext");
|
|
8
|
-
const useNavigation_1 = require("../useNavigation");
|
|
9
8
|
const Navigator_1 = require("../views/Navigator");
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
9
|
+
/**
|
|
10
|
+
*
|
|
11
|
+
* Returns a `ReactElement` of the current tab.
|
|
12
|
+
*
|
|
13
|
+
* @see [`useTabSlot`](#usetabslotoptions).
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* ```tsx
|
|
17
|
+
* function MyTabSlot() {
|
|
18
|
+
* const slot = useTabSlot();
|
|
19
|
+
*
|
|
20
|
+
* return slot;
|
|
21
|
+
* }
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
function useTabSlot(options = {}) {
|
|
25
|
+
const { detachInactiveScreens = react_native_1.Platform.OS === 'web' ||
|
|
26
|
+
react_native_1.Platform.OS === 'android' ||
|
|
27
|
+
react_native_1.Platform.OS === 'ios', style, renderFn = defaultTabsSlotRender, } = options;
|
|
13
28
|
const { state, descriptors } = (0, Navigator_1.useNavigatorContext)();
|
|
14
29
|
const focusedRouteKey = state.routes[state.index].key;
|
|
15
30
|
const [loaded, setLoaded] = (0, react_1.useState)({ [focusedRouteKey]: true });
|
|
@@ -31,19 +46,25 @@ function useTabSlot({ detachInactiveScreens = react_native_1.Platform.OS === 'we
|
|
|
31
46
|
</react_native_screens_1.ScreenContainer>);
|
|
32
47
|
}
|
|
33
48
|
exports.useTabSlot = useTabSlot;
|
|
49
|
+
/**
|
|
50
|
+
* Renders the current tab.
|
|
51
|
+
*
|
|
52
|
+
* @see [`useTabSlot`](#usetabslot) for a hook version of this component.
|
|
53
|
+
*
|
|
54
|
+
* @example
|
|
55
|
+
* ```tsx
|
|
56
|
+
* <Tabs>
|
|
57
|
+
* <TabSlot />
|
|
58
|
+
* <TabList>
|
|
59
|
+
* <TabTrigger name="home" href="/" />
|
|
60
|
+
* </TabList>
|
|
61
|
+
* </Tabs>
|
|
62
|
+
* ```
|
|
63
|
+
*/
|
|
34
64
|
function TabSlot(props) {
|
|
35
65
|
return useTabSlot(props);
|
|
36
66
|
}
|
|
37
67
|
exports.TabSlot = TabSlot;
|
|
38
|
-
function useTab() {
|
|
39
|
-
const navigation = (0, useNavigation_1.useNavigation)();
|
|
40
|
-
const options = (0, react_1.useContext)(TabContext_1.TabContext);
|
|
41
|
-
return {
|
|
42
|
-
options,
|
|
43
|
-
setOptions: navigation.setOptions,
|
|
44
|
-
};
|
|
45
|
-
}
|
|
46
|
-
exports.useTab = useTab;
|
|
47
68
|
function defaultTabsSlotRender(descriptor, { isFocused, loaded, detachInactiveScreens }) {
|
|
48
69
|
const { lazy = true, unmountOnBlur, freezeOnBlur } = descriptor.options;
|
|
49
70
|
if (unmountOnBlur && !isFocused) {
|
|
@@ -58,6 +79,9 @@ function defaultTabsSlotRender(descriptor, { isFocused, loaded, detachInactiveSc
|
|
|
58
79
|
</react_native_screens_1.Screen>);
|
|
59
80
|
}
|
|
60
81
|
exports.defaultTabsSlotRender = defaultTabsSlotRender;
|
|
82
|
+
/**
|
|
83
|
+
* @hidden
|
|
84
|
+
*/
|
|
61
85
|
function isTabSlot(child) {
|
|
62
86
|
return child.type === TabSlot;
|
|
63
87
|
}
|
package/build/ui/TabSlot.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabSlot.js","sourceRoot":"","sources":["../../src/ui/TabSlot.tsx"],"names":[],"mappings":";;;AAAA,
|
|
1
|
+
{"version":3,"file":"TabSlot.js","sourceRoot":"","sources":["../../src/ui/TabSlot.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ComponentProps, ReactElement, useState } from 'react';\nimport { Platform, StyleSheet } from 'react-native';\nimport { ScreenContainer, Screen } from 'react-native-screens';\n\nimport { TabContext, TabsDescriptor } from './TabContext';\nimport { TabListProps } from './TabList';\nimport { useNavigatorContext } from '../views/Navigator';\n\nexport type UseTabSlotOptions = ComponentProps<typeof ScreenContainer> & {\n /**\n * Remove inactive screens.\n */\n detachInactiveScreens?: boolean;\n /**\n * Override how the `Screen` component is rendered.\n */\n renderFn?: typeof defaultTabsSlotRender;\n};\n\n/**\n * Options provided to the `UseTabSlotOptions`.\n */\nexport type TabsSlotRenderOptions = {\n /**\n * Index of screen.\n */\n index: number;\n /**\n * Whether the screen is focused.\n */\n isFocused: boolean;\n /**\n * Whether the screen has been loaded.\n */\n loaded: boolean;\n /**\n * Should the screen be unloaded when inactive.\n */\n detachInactiveScreens: boolean;\n};\n\n/**\n *\n * Returns a `ReactElement` of the current tab.\n *\n * @see [`useTabSlot`](#usetabslotoptions).\n *\n * @example\n * ```tsx\n * function MyTabSlot() {\n * const slot = useTabSlot();\n *\n * return slot;\n * }\n * ```\n */\nexport function useTabSlot(options: UseTabSlotOptions = {}) {\n const {\n detachInactiveScreens = Platform.OS === 'web' ||\n Platform.OS === 'android' ||\n Platform.OS === 'ios',\n style,\n renderFn = defaultTabsSlotRender,\n } = options;\n\n const { state, descriptors } = useNavigatorContext();\n const focusedRouteKey = state.routes[state.index].key;\n const [loaded, setLoaded] = useState({ [focusedRouteKey]: true });\n\n if (!loaded[focusedRouteKey]) {\n setLoaded({ ...loaded, [focusedRouteKey]: true });\n }\n\n return (\n <ScreenContainer\n enabled={detachInactiveScreens}\n hasTwoStates\n style={[styles.screenContainer, style]}>\n {state.routes.map((route, index) => {\n const descriptor = descriptors[route.key] as unknown as TabsDescriptor;\n\n return (\n <TabContext.Provider key={descriptor.route.key} value={descriptor.options}>\n {renderFn(descriptor, {\n index,\n isFocused: state.index === index,\n loaded: loaded[route.key],\n detachInactiveScreens,\n })}\n </TabContext.Provider>\n );\n })}\n </ScreenContainer>\n );\n}\n\nexport type TabSlotProps = UseTabSlotOptions;\n\n/**\n * Renders the current tab.\n *\n * @see [`useTabSlot`](#usetabslot) for a hook version of this component.\n *\n * @example\n * ```tsx\n * <Tabs>\n * <TabSlot />\n * <TabList>\n * <TabTrigger name=\"home\" href=\"/\" />\n * </TabList>\n * </Tabs>\n * ```\n */\nexport function TabSlot(props: TabSlotProps) {\n return useTabSlot(props);\n}\n\nexport function defaultTabsSlotRender(\n descriptor: TabsDescriptor,\n { isFocused, loaded, detachInactiveScreens }: TabsSlotRenderOptions\n) {\n const { lazy = true, unmountOnBlur, freezeOnBlur } = descriptor.options;\n\n if (unmountOnBlur && !isFocused) {\n return null;\n }\n\n if (lazy && !loaded && !isFocused) {\n // Don't render a lazy screen if we've never navigated to it\n return null;\n }\n\n return (\n <Screen\n key={descriptor.route.key}\n enabled={detachInactiveScreens}\n activityState={isFocused ? 2 : 0}\n freezeOnBlur={freezeOnBlur}\n style={[styles.screen, isFocused ? styles.focused : styles.unfocused]}>\n {descriptor.render()}\n </Screen>\n );\n}\n\n/**\n * @hidden\n */\nexport function isTabSlot(child: ReactElement<any>): child is ReactElement<TabListProps> {\n return child.type === TabSlot;\n}\n\nconst styles = StyleSheet.create({\n screen: {\n flex: 1,\n position: 'relative',\n height: '100%',\n },\n screenContainer: {\n flexShrink: 0,\n flexGrow: 1,\n },\n focused: {\n zIndex: 1,\n display: 'flex',\n flexShrink: 0,\n flexGrow: 1,\n },\n unfocused: {\n zIndex: -1,\n display: 'none',\n flexShrink: 1,\n flexGrow: 0,\n },\n});\n"]}
|
package/build/ui/TabTrigger.d.ts
CHANGED
|
@@ -1,94 +1,89 @@
|
|
|
1
|
+
import { TabNavigationState } from '@react-navigation/native';
|
|
1
2
|
import { ReactNode, ReactElement, ComponentProps } from 'react';
|
|
2
3
|
import { View, PressableProps } from 'react-native';
|
|
3
4
|
import { ExpoTabsResetValue } from './TabRouter';
|
|
5
|
+
import type { TriggerMap } from './common';
|
|
4
6
|
import type { Href } from '../types';
|
|
5
7
|
type PressablePropsWithoutFunctionChildren = Omit<PressableProps, 'children'> & {
|
|
6
8
|
children?: ReactNode | undefined;
|
|
7
9
|
};
|
|
8
|
-
export type TabTriggerProps
|
|
10
|
+
export type TabTriggerProps = PressablePropsWithoutFunctionChildren & {
|
|
11
|
+
/**
|
|
12
|
+
* Name of tab. When used within a `TabList` this sets the name of the tab.
|
|
13
|
+
* Otherwise, this references the name.
|
|
14
|
+
*/
|
|
9
15
|
name: string;
|
|
10
|
-
|
|
11
|
-
|
|
16
|
+
/**
|
|
17
|
+
* Name of tab. Required when used within a `TabList`.
|
|
18
|
+
*/
|
|
19
|
+
href?: Href;
|
|
20
|
+
/**
|
|
21
|
+
* Forward props to child component. Useful for custom wrappers.
|
|
22
|
+
*/
|
|
12
23
|
asChild?: boolean;
|
|
13
|
-
/**
|
|
24
|
+
/**
|
|
25
|
+
* Resets the route when switching to a tab.
|
|
26
|
+
*/
|
|
14
27
|
reset?: SwitchToOptions['reset'] | 'onLongPress';
|
|
15
28
|
};
|
|
16
|
-
export type TabTriggerOptions
|
|
29
|
+
export type TabTriggerOptions = {
|
|
17
30
|
name: string;
|
|
18
|
-
href: Href
|
|
31
|
+
href: Href;
|
|
19
32
|
};
|
|
20
33
|
export type TabTriggerSlotProps = PressablePropsWithoutFunctionChildren & React.RefAttributes<View> & {
|
|
21
34
|
isFocused?: boolean;
|
|
22
35
|
href?: string;
|
|
23
36
|
};
|
|
24
|
-
|
|
37
|
+
/**
|
|
38
|
+
* Creates a trigger to navigate to a tab. When used as child of `TabList`, its
|
|
39
|
+
* functionality slightly changes since the `href` prop is required,
|
|
40
|
+
* and the trigger also defines what routes are present in the `Tabs`.
|
|
41
|
+
*
|
|
42
|
+
* When used outside of `TabList`, this component no longer requires an `href`.
|
|
43
|
+
*
|
|
44
|
+
* @example
|
|
45
|
+
* ```tsx
|
|
46
|
+
* <Tabs>
|
|
47
|
+
* <TabSlot />
|
|
48
|
+
* <TabList>
|
|
49
|
+
* <TabTrigger name="home" href="/" />
|
|
50
|
+
* </TabList>
|
|
51
|
+
* </Tabs>
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export declare function TabTrigger({ asChild, name, href, reset, ...props }: TabTriggerProps): import("react").JSX.Element;
|
|
55
|
+
/**
|
|
56
|
+
* @hidden
|
|
57
|
+
*/
|
|
25
58
|
export declare function isTabTrigger(child: ReactElement<any>): child is ReactElement<ComponentProps<typeof TabTrigger>>;
|
|
59
|
+
/**
|
|
60
|
+
* Options for `switchTab` function.
|
|
61
|
+
*/
|
|
26
62
|
export type SwitchToOptions = {
|
|
63
|
+
/**
|
|
64
|
+
* Navigate and reset the history.
|
|
65
|
+
*/
|
|
27
66
|
reset?: ExpoTabsResetValue;
|
|
28
67
|
};
|
|
29
|
-
export
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
name: string;
|
|
34
|
-
href: string;
|
|
35
|
-
routeNode: import("../Route").RouteNode;
|
|
36
|
-
action: import("@react-navigation/routers").TabActionType | {
|
|
37
|
-
type: "JUMP_TO";
|
|
38
|
-
source?: string | undefined;
|
|
39
|
-
target?: string | undefined;
|
|
40
|
-
payload: {
|
|
41
|
-
name: string;
|
|
42
|
-
reset?: ExpoTabsResetValue | undefined;
|
|
43
|
-
params?: object | undefined;
|
|
44
|
-
};
|
|
45
|
-
};
|
|
46
|
-
index: number;
|
|
47
|
-
isFocused: boolean;
|
|
48
|
-
route: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>;
|
|
49
|
-
resolvedHref: string;
|
|
50
|
-
} | {
|
|
51
|
-
type: "external";
|
|
52
|
-
name: string;
|
|
53
|
-
href: string;
|
|
54
|
-
index: number;
|
|
55
|
-
isFocused: boolean;
|
|
56
|
-
route: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>;
|
|
57
|
-
resolvedHref: string;
|
|
58
|
-
} | undefined;
|
|
59
|
-
trigger: {
|
|
60
|
-
type: "internal";
|
|
61
|
-
name: string;
|
|
62
|
-
href: string;
|
|
63
|
-
routeNode: import("../Route").RouteNode;
|
|
64
|
-
action: import("@react-navigation/routers").TabActionType | {
|
|
65
|
-
type: "JUMP_TO";
|
|
66
|
-
source?: string | undefined;
|
|
67
|
-
target?: string | undefined;
|
|
68
|
-
payload: {
|
|
69
|
-
name: string;
|
|
70
|
-
reset?: ExpoTabsResetValue | undefined;
|
|
71
|
-
params?: object | undefined;
|
|
72
|
-
};
|
|
73
|
-
};
|
|
74
|
-
index: number;
|
|
75
|
-
isFocused: boolean;
|
|
76
|
-
route: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>;
|
|
77
|
-
resolvedHref: string;
|
|
78
|
-
} | {
|
|
79
|
-
type: "external";
|
|
80
|
-
name: string;
|
|
81
|
-
href: string;
|
|
82
|
-
index: number;
|
|
83
|
-
isFocused: boolean;
|
|
84
|
-
route: import("@react-navigation/routers").NavigationRoute<import("@react-navigation/routers").ParamListBase, string>;
|
|
85
|
-
resolvedHref: string;
|
|
86
|
-
} | undefined;
|
|
87
|
-
triggerProps: {
|
|
88
|
-
isFocused: boolean;
|
|
89
|
-
onPress: (event: import("react-native").GestureResponderEvent) => void;
|
|
90
|
-
onLongPress: (event: import("react-native").GestureResponderEvent) => void;
|
|
91
|
-
};
|
|
68
|
+
export type Trigger = TriggerMap[string] & {
|
|
69
|
+
isFocused: boolean;
|
|
70
|
+
resolvedHref: string;
|
|
71
|
+
route: TabNavigationState<any>['routes'][number];
|
|
92
72
|
};
|
|
73
|
+
export type UseTabTriggerResult = {
|
|
74
|
+
switchTab: (name: string, options: SwitchToOptions) => void;
|
|
75
|
+
getTrigger: (name: string) => Trigger | undefined;
|
|
76
|
+
trigger?: Trigger;
|
|
77
|
+
triggerProps: TriggerProps;
|
|
78
|
+
};
|
|
79
|
+
export type TriggerProps = {
|
|
80
|
+
isFocused: boolean;
|
|
81
|
+
onPress: PressableProps['onPress'];
|
|
82
|
+
onLongPress: PressableProps['onLongPress'];
|
|
83
|
+
};
|
|
84
|
+
/**
|
|
85
|
+
* Utility hook creating custom `TabTrigger`.
|
|
86
|
+
*/
|
|
87
|
+
export declare function useTabTrigger(options: TabTriggerProps): UseTabTriggerResult;
|
|
93
88
|
export {};
|
|
94
89
|
//# sourceMappingURL=TabTrigger.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabTrigger.d.ts","sourceRoot":"","sources":["../../src/ui/TabTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAc,YAAY,EAAE,cAAc,EAAe,MAAM,OAAO,CAAC;AACzF,OAAO,EAAE,IAAI,EAAyB,cAAc,EAAE,MAAM,cAAc,CAAC;AAG3E,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"TabTrigger.d.ts","sourceRoot":"","sources":["../../src/ui/TabTrigger.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAc,YAAY,EAAE,cAAc,EAAe,MAAM,OAAO,CAAC;AACzF,OAAO,EAAE,IAAI,EAAyB,cAAc,EAAE,MAAM,cAAc,CAAC;AAG3E,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAK3C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAGrC,KAAK,qCAAqC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,GAAG;IAC9E,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,qCAAqC,GAAG;IACpE;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,GAAG,aAAa,CAAC;CAClD,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;CACZ,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,qCAAqC,GACrE,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAIJ;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAiB,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,+BA4B/F;AAED;;GAEG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,GACvB,KAAK,IAAI,YAAY,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC,CAE1D;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,kBAAkB,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,CAAC,GAAG;IACzC,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,kBAAkB,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;CAClD,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,GAAG,SAAS,CAAC;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,EAAE,YAAY,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACnC,WAAW,EAAE,cAAc,CAAC,aAAa,CAAC,CAAC;CAC5C,CAAC;AAEF;;GAEG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,eAAe,GAAG,mBAAmB,CAwG3E"}
|
package/build/ui/TabTrigger.js
CHANGED
|
@@ -11,6 +11,23 @@ const useLinkToPathProps_1 = require("../link/useLinkToPathProps");
|
|
|
11
11
|
const matchers_1 = require("../matchers");
|
|
12
12
|
const Navigator_1 = require("../views/Navigator");
|
|
13
13
|
const TabTriggerSlot = react_slot_1.Slot;
|
|
14
|
+
/**
|
|
15
|
+
* Creates a trigger to navigate to a tab. When used as child of `TabList`, its
|
|
16
|
+
* functionality slightly changes since the `href` prop is required,
|
|
17
|
+
* and the trigger also defines what routes are present in the `Tabs`.
|
|
18
|
+
*
|
|
19
|
+
* When used outside of `TabList`, this component no longer requires an `href`.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```tsx
|
|
23
|
+
* <Tabs>
|
|
24
|
+
* <TabSlot />
|
|
25
|
+
* <TabList>
|
|
26
|
+
* <TabTrigger name="home" href="/" />
|
|
27
|
+
* </TabList>
|
|
28
|
+
* </Tabs>
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
14
31
|
function TabTrigger({ asChild, name, href, reset = 'onFocus', ...props }) {
|
|
15
32
|
const { trigger, triggerProps } = useTabTrigger({
|
|
16
33
|
name,
|
|
@@ -32,12 +49,19 @@ function TabTrigger({ asChild, name, href, reset = 'onFocus', ...props }) {
|
|
|
32
49
|
}
|
|
33
50
|
}
|
|
34
51
|
exports.TabTrigger = TabTrigger;
|
|
52
|
+
/**
|
|
53
|
+
* @hidden
|
|
54
|
+
*/
|
|
35
55
|
function isTabTrigger(child) {
|
|
36
56
|
return child.type === TabTrigger;
|
|
37
57
|
}
|
|
38
58
|
exports.isTabTrigger = isTabTrigger;
|
|
39
|
-
|
|
59
|
+
/**
|
|
60
|
+
* Utility hook creating custom `TabTrigger`.
|
|
61
|
+
*/
|
|
62
|
+
function useTabTrigger(options) {
|
|
40
63
|
const { state, navigation } = (0, Navigator_1.useNavigatorContext)();
|
|
64
|
+
const { name, reset, onPress, onLongPress } = options;
|
|
41
65
|
const triggerMap = (0, react_1.useContext)(TabContext_1.TabTriggerMapContext);
|
|
42
66
|
const getTrigger = (0, react_1.useCallback)((name) => {
|
|
43
67
|
const config = triggerMap[name];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabTrigger.js","sourceRoot":"","sources":["../../src/ui/TabTrigger.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport { ReactNode, useContext, ReactElement, ComponentProps, useCallback } from 'react';\nimport { View, StyleSheet, Pressable, PressableProps } from 'react-native';\n\nimport { TabTriggerMapContext } from './TabContext';\nimport { ExpoTabsResetValue } from './TabRouter';\nimport { appendBaseUrl } from '../fork/getPathFromState';\nimport { router } from '../imperative-api';\nimport { shouldHandleMouseEvent } from '../link/useLinkToPathProps';\nimport { stripGroupSegmentsFromPath } from '../matchers';\nimport type { Href } from '../types';\nimport { useNavigatorContext } from '../views/Navigator';\n\ntype PressablePropsWithoutFunctionChildren = Omit<PressableProps, 'children'> & {\n children?: ReactNode | undefined;\n};\n\nexport type TabTriggerProps<T extends string | object> = PressablePropsWithoutFunctionChildren & {\n name: string;\n href?: Href<T>;\n /** Forward props to child component. Useful for custom wrappers. */\n asChild?: boolean;\n /** Reset the route when switching to the tab */\n reset?: SwitchToOptions['reset'] | 'onLongPress';\n};\n\nexport type TabTriggerOptions<T extends string | object> = {\n name: string;\n href: Href<T>;\n};\n\nexport type TabTriggerSlotProps = PressablePropsWithoutFunctionChildren &\n React.RefAttributes<View> & {\n isFocused?: boolean;\n href?: string;\n };\n\nconst TabTriggerSlot = Slot as React.ForwardRefExoticComponent<TabTriggerSlotProps>;\n\nexport function TabTrigger<T extends string | object>({\n asChild,\n name,\n href,\n reset = 'onFocus',\n ...props\n}: TabTriggerProps<T>) {\n const { trigger, triggerProps } = useTabTrigger({\n name,\n reset,\n ...props,\n });\n\n // Pressable doesn't accept the extra props, so only pass them if we are using asChild\n if (asChild) {\n return (\n <TabTriggerSlot\n style={styles.tabTrigger}\n {...props}\n {...triggerProps}\n href={trigger?.resolvedHref}>\n {props.children}\n </TabTriggerSlot>\n );\n } else {\n // These props are not typed, but are allowed by React Native Web\n const reactNativeWebProps = { href: trigger?.resolvedHref };\n\n return (\n <Pressable style={styles.tabTrigger} {...reactNativeWebProps} {...props} {...triggerProps}>\n {props.children}\n </Pressable>\n );\n }\n}\n\nexport function isTabTrigger(\n child: ReactElement<any>\n): child is ReactElement<ComponentProps<typeof TabTrigger>> {\n return child.type === TabTrigger;\n}\n\nexport type SwitchToOptions = { reset?: ExpoTabsResetValue };\n\nexport function useTabTrigger({ name, reset, onPress, onLongPress }: TabTriggerProps<any>) {\n const { state, navigation } = useNavigatorContext();\n const triggerMap = useContext(TabTriggerMapContext);\n\n const getTrigger = useCallback(\n (name: string) => {\n const config = triggerMap[name];\n\n if (!config) {\n return;\n }\n\n return {\n isFocused: state.index === config.index,\n route: state.routes[config.index],\n resolvedHref: stripGroupSegmentsFromPath(appendBaseUrl(config.href)),\n ...config,\n };\n },\n [triggerMap]\n );\n\n const trigger = name !== undefined ? getTrigger(name) : undefined;\n\n const switchTab = useCallback(\n (name: string, options?: SwitchToOptions) => {\n const config = triggerMap[name];\n\n if (config) {\n if (config.type === 'external') {\n return router.navigate(config.href);\n } else {\n return navigation?.dispatch({\n type: 'JUMP_TO',\n payload: {\n name,\n ...options,\n },\n });\n }\n } else {\n return navigation?.dispatch({\n type: 'JUMP_TO',\n payload: {\n name,\n },\n });\n }\n },\n [navigation, triggerMap]\n );\n\n const handleOnPress = useCallback<NonNullable<PressableProps['onPress']>>(\n (event) => {\n onPress?.(event);\n if (!trigger) return;\n if (event?.isDefaultPrevented()) return;\n\n navigation?.emit({\n type: 'tabPress',\n target: trigger.type === 'internal' ? trigger.route.key : trigger?.href,\n canPreventDefault: true,\n });\n\n if (!shouldHandleMouseEvent(event)) return;\n\n switchTab(name, { reset: reset !== 'onLongPress' ? reset : undefined });\n },\n [onPress, name, reset, trigger]\n );\n\n const handleOnLongPress = useCallback<NonNullable<PressableProps['onPress']>>(\n (event) => {\n onPress?.(event);\n if (!trigger) return;\n if (event?.isDefaultPrevented()) return;\n\n navigation?.emit({\n type: 'tabLongPress',\n target: trigger.type === 'internal' ? trigger.route.key : trigger?.href,\n });\n\n if (!shouldHandleMouseEvent(event)) return;\n\n switchTab(name, {\n reset: reset === 'onLongPress' ? 'always' : reset,\n });\n },\n [onLongPress, name, reset, trigger]\n );\n\n const triggerProps = {\n isFocused: Boolean(trigger?.isFocused),\n onPress: handleOnPress,\n onLongPress: handleOnLongPress,\n };\n\n return {\n switchTab,\n getTrigger,\n trigger,\n triggerProps,\n };\n}\n\nconst styles = StyleSheet.create({\n tabTrigger: {\n flexDirection: 'row',\n justifyContent: 'space-between',\n },\n});\n"]}
|
|
1
|
+
{"version":3,"file":"TabTrigger.js","sourceRoot":"","sources":["../../src/ui/TabTrigger.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport { TabNavigationState } from '@react-navigation/native';\nimport { ReactNode, useContext, ReactElement, ComponentProps, useCallback } from 'react';\nimport { View, StyleSheet, Pressable, PressableProps } from 'react-native';\n\nimport { TabTriggerMapContext } from './TabContext';\nimport { ExpoTabsResetValue } from './TabRouter';\nimport type { TriggerMap } from './common';\nimport { appendBaseUrl } from '../fork/getPathFromState';\nimport { router } from '../imperative-api';\nimport { shouldHandleMouseEvent } from '../link/useLinkToPathProps';\nimport { stripGroupSegmentsFromPath } from '../matchers';\nimport type { Href } from '../types';\nimport { useNavigatorContext } from '../views/Navigator';\n\ntype PressablePropsWithoutFunctionChildren = Omit<PressableProps, 'children'> & {\n children?: ReactNode | undefined;\n};\n\nexport type TabTriggerProps = PressablePropsWithoutFunctionChildren & {\n /**\n * Name of tab. When used within a `TabList` this sets the name of the tab.\n * Otherwise, this references the name.\n */\n name: string;\n /**\n * Name of tab. Required when used within a `TabList`.\n */\n href?: Href;\n /**\n * Forward props to child component. Useful for custom wrappers.\n */\n asChild?: boolean;\n /**\n * Resets the route when switching to a tab.\n */\n reset?: SwitchToOptions['reset'] | 'onLongPress';\n};\n\nexport type TabTriggerOptions = {\n name: string;\n href: Href;\n};\n\nexport type TabTriggerSlotProps = PressablePropsWithoutFunctionChildren &\n React.RefAttributes<View> & {\n isFocused?: boolean;\n href?: string;\n };\n\nconst TabTriggerSlot = Slot as React.ForwardRefExoticComponent<TabTriggerSlotProps>;\n\n/**\n * Creates a trigger to navigate to a tab. When used as child of `TabList`, its\n * functionality slightly changes since the `href` prop is required,\n * and the trigger also defines what routes are present in the `Tabs`.\n *\n * When used outside of `TabList`, this component no longer requires an `href`.\n *\n * @example\n * ```tsx\n * <Tabs>\n * <TabSlot />\n * <TabList>\n * <TabTrigger name=\"home\" href=\"/\" />\n * </TabList>\n * </Tabs>\n * ```\n */\nexport function TabTrigger({ asChild, name, href, reset = 'onFocus', ...props }: TabTriggerProps) {\n const { trigger, triggerProps } = useTabTrigger({\n name,\n reset,\n ...props,\n });\n\n // Pressable doesn't accept the extra props, so only pass them if we are using asChild\n if (asChild) {\n return (\n <TabTriggerSlot\n style={styles.tabTrigger}\n {...props}\n {...triggerProps}\n href={trigger?.resolvedHref}>\n {props.children}\n </TabTriggerSlot>\n );\n } else {\n // These props are not typed, but are allowed by React Native Web\n const reactNativeWebProps = { href: trigger?.resolvedHref };\n\n return (\n <Pressable style={styles.tabTrigger} {...reactNativeWebProps} {...props} {...triggerProps}>\n {props.children}\n </Pressable>\n );\n }\n}\n\n/**\n * @hidden\n */\nexport function isTabTrigger(\n child: ReactElement<any>\n): child is ReactElement<ComponentProps<typeof TabTrigger>> {\n return child.type === TabTrigger;\n}\n\n/**\n * Options for `switchTab` function.\n */\nexport type SwitchToOptions = {\n /**\n * Navigate and reset the history.\n */\n reset?: ExpoTabsResetValue;\n};\n\nexport type Trigger = TriggerMap[string] & {\n isFocused: boolean;\n resolvedHref: string;\n route: TabNavigationState<any>['routes'][number];\n};\n\nexport type UseTabTriggerResult = {\n switchTab: (name: string, options: SwitchToOptions) => void;\n getTrigger: (name: string) => Trigger | undefined;\n trigger?: Trigger;\n triggerProps: TriggerProps;\n};\n\nexport type TriggerProps = {\n isFocused: boolean;\n onPress: PressableProps['onPress'];\n onLongPress: PressableProps['onLongPress'];\n};\n\n/**\n * Utility hook creating custom `TabTrigger`.\n */\nexport function useTabTrigger(options: TabTriggerProps): UseTabTriggerResult {\n const { state, navigation } = useNavigatorContext();\n const { name, reset, onPress, onLongPress } = options;\n const triggerMap = useContext(TabTriggerMapContext);\n\n const getTrigger = useCallback(\n (name: string) => {\n const config = triggerMap[name];\n\n if (!config) {\n return;\n }\n\n return {\n isFocused: state.index === config.index,\n route: state.routes[config.index],\n resolvedHref: stripGroupSegmentsFromPath(appendBaseUrl(config.href)),\n ...config,\n };\n },\n [triggerMap]\n );\n\n const trigger = name !== undefined ? getTrigger(name) : undefined;\n\n const switchTab = useCallback(\n (name: string, options?: SwitchToOptions) => {\n const config = triggerMap[name];\n\n if (config) {\n if (config.type === 'external') {\n return router.navigate(config.href);\n } else {\n return navigation?.dispatch({\n type: 'JUMP_TO',\n payload: {\n name,\n ...options,\n },\n });\n }\n } else {\n return navigation?.dispatch({\n type: 'JUMP_TO',\n payload: {\n name,\n },\n });\n }\n },\n [navigation, triggerMap]\n );\n\n const handleOnPress = useCallback<NonNullable<PressableProps['onPress']>>(\n (event) => {\n onPress?.(event);\n if (!trigger) return;\n if (event?.isDefaultPrevented()) return;\n\n navigation?.emit({\n type: 'tabPress',\n target: trigger.type === 'internal' ? trigger.route.key : trigger?.href,\n canPreventDefault: true,\n });\n\n if (!shouldHandleMouseEvent(event)) return;\n\n switchTab(name, { reset: reset !== 'onLongPress' ? reset : undefined });\n },\n [onPress, name, reset, trigger]\n );\n\n const handleOnLongPress = useCallback<NonNullable<PressableProps['onPress']>>(\n (event) => {\n onPress?.(event);\n if (!trigger) return;\n if (event?.isDefaultPrevented()) return;\n\n navigation?.emit({\n type: 'tabLongPress',\n target: trigger.type === 'internal' ? trigger.route.key : trigger?.href,\n });\n\n if (!shouldHandleMouseEvent(event)) return;\n\n switchTab(name, {\n reset: reset === 'onLongPress' ? 'always' : reset,\n });\n },\n [onLongPress, name, reset, trigger]\n );\n\n const triggerProps = {\n isFocused: Boolean(trigger?.isFocused),\n onPress: handleOnPress,\n onLongPress: handleOnLongPress,\n };\n\n return {\n switchTab,\n getTrigger,\n trigger,\n triggerProps,\n };\n}\n\nconst styles = StyleSheet.create({\n tabTrigger: {\n flexDirection: 'row',\n justifyContent: 'space-between',\n },\n});\n"]}
|