@rdyl/react-native-navigator-connect 0.1.3 → 0.1.4

package/dist/hooks.js

@@ -1,14 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useNavigator = void 0;
-const react_1 = require("react");
 const native_1 = require("@react-navigation/native");
+const react_1 = require("react");
 const useNavigator = () => {
     const navigation = (0, native_1.useNavigation)();
     const route = (0, native_1.useRoute)();
     const option = (0, react_1.useMemo)(() => {
-        // @ts-ignore
-        const opt = global === null || global === void 0 ? void 0 : global.$findNavigatorOption(route.name);
+        if (!(global === null || global === void 0 ? void 0 : global.$findNavigatorOption))
+            return;
+        const opt = global.$findNavigatorOption(route.name);
         if (opt) {
             return opt.option;
         }
@@ -36,13 +37,13 @@ const useNavigator = () => {
             }
         }
     }, [navigation]);
-    const setParams = (0, react_1.useCallback)((params = {}) => {
+    const onParams = (0, react_1.useCallback)((params = {}) => {
         navigation.dispatch(Object.assign(Object.assign({}, native_1.CommonActions.setParams(params)), { source: route.key }));
     }, [navigation, route]);
     return Object.assign(Object.assign({}, route), { option,
         push,
         back,
         redirect,
-        setParams });
+        onParams });
 };
 exports.useNavigator = useNavigator;

package/dist/index.js

@@ -42,18 +42,18 @@ const stack_1 = require("@react-navigation/stack");
 const bottom_tabs_1 = require("@react-navigation/bottom-tabs");
 const Tab = (0, bottom_tabs_1.createBottomTabNavigator)();
 const Stack = (0, stack_1.createStackNavigator)();
-const NavigatorConnect = ({ afterEach, stack = {}, tabs = {}, }) => {
+const NavigatorConnect = ({ afterEach, stack = [], initial, tabs, }) => {
     const navigatorRef = (0, native_1.useNavigationContainerRef)();
     const [routeName, setRouteName] = (0, react_1.useState)("");
     const findNavigatorOption = (0, react_1.useCallback)((name) => {
-        const tab = ((tabs === null || tabs === void 0 ? void 0 : tabs.items) || []).find(ele => ele.name === name);
+        const tab = ((tabs === null || tabs === void 0 ? void 0 : tabs.list) || []).find(ele => ele.name === name);
         if (tab) {
             return {
                 type: "tab",
                 option: tab,
             };
         }
-        const item = ((stack === null || stack === void 0 ? void 0 : stack.items) || []).find(ele => ele.name === name);
+        const item = stack.find(ele => ele.name === name);
         if (item) {
             return {
                 type: "stack",
@@ -61,42 +61,13 @@ const NavigatorConnect = ({ afterEach, stack = {}, tabs = {}, }) => {
             };
         }
         return null;
-    }, []);
+    }, [tabs, stack]);
     const option = (0, react_1.useMemo)(() => {
         const opt = findNavigatorOption(routeName);
         if (opt) {
             return opt.option;
         }
     }, [findNavigatorOption, routeName]);
-    const initialTabName = (0, react_1.useMemo)(() => {
-        const { initial, items = [] } = tabs;
-        if (initial) {
-            return initial;
-        }
-        if (items[0]) {
-            return items[0].name;
-        }
-    }, [tabs]);
-    const initialStackName = (0, react_1.useMemo)(() => {
-        const { initial, items = [] } = stack;
-        if (initial) {
-            return initial;
-        }
-        if (items[0]) {
-            return items[0].name;
-        }
-    }, [tabs]);
-    const TabsNavigator = (0, react_1.useMemo)(() => {
-        return () => (react_1.default.createElement(Tab.Navigator, { initialRouteName: initialTabName }, ((tabs === null || tabs === void 0 ? void 0 : tabs.items) || []).map(ele => {
-            const { component, name, meta: { title = "", tabBarIcon } = {}, } = ele;
-            return (react_1.default.createElement(Tab.Screen, { options: {
-                    headerShown: false,
-                    tabBarLabel: title,
-                    tabBarIcon,
-                    tabBarActiveTintColor: "#333",
-                }, key: name, name: name, component: component }));
-        })));
-    }, [tabs]);
     (0, react_1.useEffect)(() => {
         if (option && afterEach) {
             afterEach(option);
@@ -114,15 +85,22 @@ const NavigatorConnect = ({ afterEach, stack = {}, tabs = {}, }) => {
         return () => navigatorRef.removeListener("__unsafe_action__", callback);
     }, [navigatorRef.isReady]);
     (0, react_1.useEffect)(() => {
-        // @ts-ignore
         global.$findNavigatorOption = findNavigatorOption;
     }, [findNavigatorOption]);
     return (react_1.default.createElement(native_1.NavigationContainer, { ref: navigatorRef },
-        react_1.default.createElement(Stack.Navigator, { initialRouteName: initialStackName },
-            react_1.default.createElement(Stack.Screen, { key: "tabs", name: "tabs", options: {
+        react_1.default.createElement(Stack.Navigator, { initialRouteName: initial },
+            !!tabs && (react_1.default.createElement(Stack.Screen, { key: "tabs", name: tabs.name, options: {
                     headerShown: false,
-                }, component: TabsNavigator }),
-            ((stack === null || stack === void 0 ? void 0 : stack.items) || []).map(({ component, name }) => (react_1.default.createElement(Stack.Screen, { options: {
+                }, 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 => {
+                    const { component, name, meta: { title = "", tabBarIcon } = {}, } = ele;
+                    return (react_1.default.createElement(Tab.Screen, { options: {
+                            headerShown: false,
+                            tabBarLabel: title,
+                            tabBarIcon,
+                            tabBarActiveTintColor: "#333",
+                        }, key: name, name: name, component: component }));
+                }))) })),
+            stack.map(({ component, name }) => (react_1.default.createElement(Stack.Screen, { options: {
                     headerShown: false,
                 }, key: name, name: name, component: component }))))));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rdyl/react-native-navigator-connect",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "main": "./dist/index.js",
   "types": "./types/index.d.ts",
   "license": "MIT",

package/types/hooks.d.ts

@@ -1,9 +1,9 @@
 export declare const useNavigator: () => {
-    option: any;
+    option: NavigatorOption | undefined;
     push: (name: string, params?: QueryParams) => void;
     back: () => void;
     redirect: (name: string, params?: QueryParams) => void;
-    setParams: (params?: QueryParams) => void;
+    onParams: (params?: QueryParams) => void;
     key: string;
     name: string;
     path?: string;

package/types/index.d.ts

@@ -1,9 +1,7 @@
 import { FC } from "react";
 declare const NavigatorConnect: FC<NavigatorConnectProps>;
-export * from "./hooks";
-export interface NavigatorConnectProps {
-    stack?: NavigatorStack;
-    tabs?: NavigatorTabs;
+export interface NavigatorConnectProps extends NavigatorConnectConfig {
     afterEach?(to: NavigatorOption): void;
 }
+export * from "./hooks";
 export default NavigatorConnect;

package/types/type.d.ts

@@ -1,4 +1,5 @@
-/** @Navigator */
+type QueryParams = Record<string, unknown>;
+
 interface NavigatorOptionMeta {
   title?: string;
   tabBarIcon?: (props: {
@@ -16,13 +17,16 @@ interface NavigatorOption {
   component: React.ComponentType<any>;
 }
 
-interface NavigatorStack {
-  items?: NavigatorOption[];
+interface NavigatorTabs {
+  list: NavigatorOption[];
+  name: string;
   initial?: string;
 }
 
-interface NavigatorTabs extends NavigatorStack {
-  name?: string;
+interface NavigatorConnectConfig {
+  initial?: string;
+  tabs?: NavigatorTabs;
+  stack: NavigatorOption[];
 }
 
 type FindNavigatorOptionType = {
@@ -30,4 +34,4 @@ type FindNavigatorOptionType = {
   option: NavigatorOption;
 } | null;
 
-type QueryParams = Record<string, unknown>;
+declare var $findNavigatorOption: (n: string) => FindNavigatorOptionType;