@rdyl/react-native-navigator-connect 0.1.3 → 0.1.5
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/dist/hooks.js +6 -5
- package/dist/index.js +16 -38
- package/package.json +3 -3
- package/types/hooks.d.ts +2 -2
- package/types/index.d.ts +2 -4
- package/types/type.d.ts +10 -6
package/dist/hooks.js
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useNavigator = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
4
|
const native_1 = require("@react-navigation/native");
|
|
5
|
+
const react_1 = require("react");
|
|
6
6
|
const useNavigator = () => {
|
|
7
7
|
const navigation = (0, native_1.useNavigation)();
|
|
8
8
|
const route = (0, native_1.useRoute)();
|
|
9
9
|
const option = (0, react_1.useMemo)(() => {
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
if (!(global === null || global === void 0 ? void 0 : global.$findNavigatorOption))
|
|
11
|
+
return;
|
|
12
|
+
const opt = global.$findNavigatorOption(route.name);
|
|
12
13
|
if (opt) {
|
|
13
14
|
return opt.option;
|
|
14
15
|
}
|
|
@@ -36,13 +37,13 @@ const useNavigator = () => {
|
|
|
36
37
|
}
|
|
37
38
|
}
|
|
38
39
|
}, [navigation]);
|
|
39
|
-
const
|
|
40
|
+
const onParams = (0, react_1.useCallback)((params = {}) => {
|
|
40
41
|
navigation.dispatch(Object.assign(Object.assign({}, native_1.CommonActions.setParams(params)), { source: route.key }));
|
|
41
42
|
}, [navigation, route]);
|
|
42
43
|
return Object.assign(Object.assign({}, route), { option,
|
|
43
44
|
push,
|
|
44
45
|
back,
|
|
45
46
|
redirect,
|
|
46
|
-
|
|
47
|
+
onParams });
|
|
47
48
|
};
|
|
48
49
|
exports.useNavigator = useNavigator;
|
package/dist/index.js
CHANGED
|
@@ -42,18 +42,18 @@ const stack_1 = require("@react-navigation/stack");
|
|
|
42
42
|
const bottom_tabs_1 = require("@react-navigation/bottom-tabs");
|
|
43
43
|
const Tab = (0, bottom_tabs_1.createBottomTabNavigator)();
|
|
44
44
|
const Stack = (0, stack_1.createStackNavigator)();
|
|
45
|
-
const NavigatorConnect = ({ afterEach, stack =
|
|
45
|
+
const NavigatorConnect = ({ afterEach, stack = [], initial, tabs, }) => {
|
|
46
46
|
const navigatorRef = (0, native_1.useNavigationContainerRef)();
|
|
47
47
|
const [routeName, setRouteName] = (0, react_1.useState)("");
|
|
48
48
|
const findNavigatorOption = (0, react_1.useCallback)((name) => {
|
|
49
|
-
const tab = ((tabs === null || tabs === void 0 ? void 0 : tabs.
|
|
49
|
+
const tab = ((tabs === null || tabs === void 0 ? void 0 : tabs.list) || []).find(ele => ele.name === name);
|
|
50
50
|
if (tab) {
|
|
51
51
|
return {
|
|
52
52
|
type: "tab",
|
|
53
53
|
option: tab,
|
|
54
54
|
};
|
|
55
55
|
}
|
|
56
|
-
const item =
|
|
56
|
+
const item = stack.find(ele => ele.name === name);
|
|
57
57
|
if (item) {
|
|
58
58
|
return {
|
|
59
59
|
type: "stack",
|
|
@@ -61,42 +61,13 @@ const NavigatorConnect = ({ afterEach, stack = {}, tabs = {}, }) => {
|
|
|
61
61
|
};
|
|
62
62
|
}
|
|
63
63
|
return null;
|
|
64
|
-
}, []);
|
|
64
|
+
}, [tabs, stack]);
|
|
65
65
|
const option = (0, react_1.useMemo)(() => {
|
|
66
66
|
const opt = findNavigatorOption(routeName);
|
|
67
67
|
if (opt) {
|
|
68
68
|
return opt.option;
|
|
69
69
|
}
|
|
70
70
|
}, [findNavigatorOption, routeName]);
|
|
71
|
-
const initialTabName = (0, react_1.useMemo)(() => {
|
|
72
|
-
const { initial, items = [] } = tabs;
|
|
73
|
-
if (initial) {
|
|
74
|
-
return initial;
|
|
75
|
-
}
|
|
76
|
-
if (items[0]) {
|
|
77
|
-
return items[0].name;
|
|
78
|
-
}
|
|
79
|
-
}, [tabs]);
|
|
80
|
-
const initialStackName = (0, react_1.useMemo)(() => {
|
|
81
|
-
const { initial, items = [] } = stack;
|
|
82
|
-
if (initial) {
|
|
83
|
-
return initial;
|
|
84
|
-
}
|
|
85
|
-
if (items[0]) {
|
|
86
|
-
return items[0].name;
|
|
87
|
-
}
|
|
88
|
-
}, [tabs]);
|
|
89
|
-
const TabsNavigator = (0, react_1.useMemo)(() => {
|
|
90
|
-
return () => (react_1.default.createElement(Tab.Navigator, { initialRouteName: initialTabName }, ((tabs === null || tabs === void 0 ? void 0 : tabs.items) || []).map(ele => {
|
|
91
|
-
const { component, name, meta: { title = "", tabBarIcon } = {}, } = ele;
|
|
92
|
-
return (react_1.default.createElement(Tab.Screen, { options: {
|
|
93
|
-
headerShown: false,
|
|
94
|
-
tabBarLabel: title,
|
|
95
|
-
tabBarIcon,
|
|
96
|
-
tabBarActiveTintColor: "#333",
|
|
97
|
-
}, key: name, name: name, component: component }));
|
|
98
|
-
})));
|
|
99
|
-
}, [tabs]);
|
|
100
71
|
(0, react_1.useEffect)(() => {
|
|
101
72
|
if (option && afterEach) {
|
|
102
73
|
afterEach(option);
|
|
@@ -114,15 +85,22 @@ const NavigatorConnect = ({ afterEach, stack = {}, tabs = {}, }) => {
|
|
|
114
85
|
return () => navigatorRef.removeListener("__unsafe_action__", callback);
|
|
115
86
|
}, [navigatorRef.isReady]);
|
|
116
87
|
(0, react_1.useEffect)(() => {
|
|
117
|
-
// @ts-ignore
|
|
118
88
|
global.$findNavigatorOption = findNavigatorOption;
|
|
119
89
|
}, [findNavigatorOption]);
|
|
120
90
|
return (react_1.default.createElement(native_1.NavigationContainer, { ref: navigatorRef },
|
|
121
|
-
react_1.default.createElement(Stack.Navigator, { initialRouteName:
|
|
122
|
-
react_1.default.createElement(Stack.Screen, { key: "tabs", name:
|
|
91
|
+
react_1.default.createElement(Stack.Navigator, { initialRouteName: initial },
|
|
92
|
+
!!tabs && (react_1.default.createElement(Stack.Screen, { key: "tabs", name: tabs.name, options: {
|
|
123
93
|
headerShown: false,
|
|
124
|
-
}, component:
|
|
125
|
-
|
|
94
|
+
}, component: () => (react_1.default.createElement(Tab.Navigator, { initialRouteName: (tabs === null || tabs === void 0 ? void 0 : tabs.initial) || (tabs === null || tabs === void 0 ? void 0 : tabs.list[0].name) || "" }, tabs.list.map(ele => {
|
|
95
|
+
const { component, name, meta: { title = "", tabBarIcon } = {}, } = ele;
|
|
96
|
+
return (react_1.default.createElement(Tab.Screen, { options: {
|
|
97
|
+
headerShown: false,
|
|
98
|
+
tabBarLabel: title,
|
|
99
|
+
tabBarIcon,
|
|
100
|
+
tabBarActiveTintColor: "#333",
|
|
101
|
+
}, key: name, name: name, component: component }));
|
|
102
|
+
}))) })),
|
|
103
|
+
stack.map(({ component, name }) => (react_1.default.createElement(Stack.Screen, { options: {
|
|
126
104
|
headerShown: false,
|
|
127
105
|
}, key: name, name: name, component: component }))))));
|
|
128
106
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rdyl/react-native-navigator-connect",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.5",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"types": "./types/index.d.ts",
|
|
6
6
|
"license": "MIT",
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
},
|
|
26
26
|
"peerDependencies": {
|
|
27
27
|
"react": ">=18.0.0",
|
|
28
|
-
"react-native": ">=0.73.0"
|
|
29
|
-
|
|
28
|
+
"react-native": ">=0.73.0",
|
|
29
|
+
"react-native-gesture-handler": ">=2.28.0"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
32
|
"@react-navigation/bottom-tabs": "^7.0.3",
|
package/types/hooks.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export declare const useNavigator: () => {
|
|
2
|
-
option:
|
|
2
|
+
option: NavigatorOption | undefined;
|
|
3
3
|
push: (name: string, params?: QueryParams) => void;
|
|
4
4
|
back: () => void;
|
|
5
5
|
redirect: (name: string, params?: QueryParams) => void;
|
|
6
|
-
|
|
6
|
+
onParams: (params?: QueryParams) => void;
|
|
7
7
|
key: string;
|
|
8
8
|
name: string;
|
|
9
9
|
path?: string;
|
package/types/index.d.ts
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { FC } from "react";
|
|
2
2
|
declare const NavigatorConnect: FC<NavigatorConnectProps>;
|
|
3
|
-
export
|
|
4
|
-
export interface NavigatorConnectProps {
|
|
5
|
-
stack?: NavigatorStack;
|
|
6
|
-
tabs?: NavigatorTabs;
|
|
3
|
+
export interface NavigatorConnectProps extends NavigatorConnectConfig {
|
|
7
4
|
afterEach?(to: NavigatorOption): void;
|
|
8
5
|
}
|
|
6
|
+
export * from "./hooks";
|
|
9
7
|
export default NavigatorConnect;
|
package/types/type.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
type QueryParams = Record<string, unknown>;
|
|
2
|
+
|
|
2
3
|
interface NavigatorOptionMeta {
|
|
3
4
|
title?: string;
|
|
4
5
|
tabBarIcon?: (props: {
|
|
@@ -16,13 +17,16 @@ interface NavigatorOption {
|
|
|
16
17
|
component: React.ComponentType<any>;
|
|
17
18
|
}
|
|
18
19
|
|
|
19
|
-
interface
|
|
20
|
-
|
|
20
|
+
interface NavigatorTabs {
|
|
21
|
+
list: NavigatorOption[];
|
|
22
|
+
name: string;
|
|
21
23
|
initial?: string;
|
|
22
24
|
}
|
|
23
25
|
|
|
24
|
-
interface
|
|
25
|
-
|
|
26
|
+
interface NavigatorConnectConfig {
|
|
27
|
+
initial?: string;
|
|
28
|
+
tabs?: NavigatorTabs;
|
|
29
|
+
stack: NavigatorOption[];
|
|
26
30
|
}
|
|
27
31
|
|
|
28
32
|
type FindNavigatorOptionType = {
|
|
@@ -30,4 +34,4 @@ type FindNavigatorOptionType = {
|
|
|
30
34
|
option: NavigatorOption;
|
|
31
35
|
} | null;
|
|
32
36
|
|
|
33
|
-
|
|
37
|
+
declare var $findNavigatorOption: (n: string) => FindNavigatorOptionType;
|