@umituz/react-native-design-system 2.9.3 → 2.9.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-design-system",
-  "version": "2.9.3",
+  "version": "2.9.5",
   "description": "Universal design system for React Native apps - Consolidated package with atoms, molecules, organisms, theme, typography, responsive, safe area, exception, infinite scroll, UUID, image, timezone, offline, and onboarding utilities",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/molecules/navigation/hooks/useAppNavigation.ts

@@ -1,23 +1,97 @@
 import { useNavigation } from "@react-navigation/native";
 import type { NavigationProp, ParamListBase } from "@react-navigation/native";
-import { AppNavigation } from "../utils/AppNavigation";
+import { useCallback, useMemo } from "react";
+
+/**
+ * Navigation result type - clean and simple
+ */
+export interface AppNavigationResult {
+  navigate: (screen: string, params?: Record<string, unknown>) => void;
+  push: (screen: string, params?: Record<string, unknown>) => void;
+  goBack: () => void;
+  reset: (screen: string, params?: Record<string, unknown>) => void;
+  replace: (screen: string, params?: Record<string, unknown>) => void;
+  pop: (count?: number) => void;
+  popToTop: () => void;
+  canGoBack: () => boolean;
+  getState: () => ReturnType<NavigationProp<ParamListBase>["getState"]>;
+  getParent: () => NavigationProp<ParamListBase> | undefined;
+}
 
 /**
  * useAppNavigation Hook
  *
- * A unified wrapper that returns the unified AppNavigation object 
- * but enriched with context-specific features from React Navigation.
- * 
- * Ensures components and non-component logic use the EXACT same navigation interface.
+ * Clean navigation API without complex type casting.
+ * Use: const navigation = useAppNavigation();
+ *      navigation.navigate("ScreenName", { param: value });
  */
-export function useAppNavigation<T extends ParamListBase>() {
-  const navigation = useNavigation<NavigationProp<T>>();
-
-  // We return a merge of the standard navigation object and our unified AppNavigation actions.
-  // This ensures that even if called via a hook, actions like goBack() go through our 
-  // unified implementation (including logging and safety checks).
-  return {
-    ...navigation,
-    ...AppNavigation,
-  } as NavigationProp<T> & typeof AppNavigation;
+export function useAppNavigation(): AppNavigationResult {
+  const navigation = useNavigation<NavigationProp<ParamListBase>>();
+
+  const navigate = useCallback(
+    (screen: string, params?: Record<string, unknown>) => {
+      (navigation.navigate as (name: string, params?: object) => void)(screen, params);
+    },
+    [navigation]
+  );
+
+  const push = useCallback(
+    (screen: string, params?: Record<string, unknown>) => {
+      navigation.dispatch({ type: "PUSH", payload: { name: screen, params } });
+    },
+    [navigation]
+  );
+
+  const goBack = useCallback(() => {
+    if (navigation.canGoBack()) {
+      navigation.goBack();
+    }
+  }, [navigation]);
+
+  const reset = useCallback(
+    (screen: string, params?: Record<string, unknown>) => {
+      navigation.reset({ index: 0, routes: [{ name: screen, params }] });
+    },
+    [navigation]
+  );
+
+  const replace = useCallback(
+    (screen: string, params?: Record<string, unknown>) => {
+      navigation.dispatch({ type: "REPLACE", payload: { name: screen, params } });
+    },
+    [navigation]
+  );
+
+  const pop = useCallback(
+    (count = 1) => {
+      navigation.dispatch({ type: "POP", payload: { count } });
+    },
+    [navigation]
+  );
+
+  const popToTop = useCallback(() => {
+    navigation.dispatch({ type: "POP_TO_TOP" });
+  }, [navigation]);
+
+  const canGoBack = useCallback(() => navigation.canGoBack(), [navigation]);
+
+  const getState = useCallback(() => navigation.getState(), [navigation]);
+
+  const getParent = useCallback(() => navigation.getParent(), [navigation]);
+
+  return useMemo(
+    () => ({
+      navigate,
+      push,
+      goBack,
+      reset,
+      replace,
+      pop,
+      popToTop,
+      canGoBack,
+      getState,
+      getParent,
+    }),
+    [navigate, push, goBack, reset, replace, pop, popToTop, canGoBack, getState, getParent]
+  );
 }

package/src/molecules/navigation/utils/NavigationValidator.ts

@@ -1,4 +1,4 @@
-import type { TabScreen, StackScreen } from "../types";
+import type { TabScreen, StackScreen, BaseScreen } from "../types";
 
 export class NavigationValidator {
   static validateScreens(screens: TabScreen[] | StackScreen[], type: "tab" | "stack"): void {
@@ -11,7 +11,7 @@ export class NavigationValidator {
     }
 
     const screenNames = new Set<string>();
-    
+
     screens.forEach((screen, index) => {
       if (!screen.name || typeof screen.name !== "string" || screen.name.trim() === "") {
         throw new Error(`Screen at index ${index} must have a valid non-empty name`);
@@ -23,8 +23,9 @@ export class NavigationValidator {
       }
       screenNames.add(screen.name);
 
-      if (!screen.component || typeof screen.component !== "function") {
-        throw new Error(`Screen '${screen.name}' must have a valid component`);
+      const baseScreen = screen as BaseScreen;
+      if (!baseScreen.component && !baseScreen.children) {
+        throw new Error(`Screen '${screen.name}' must have a valid component or children`);
       }
 
       if (type === "tab") {