@umituz/react-native-auth 3.6.44 → 3.6.46

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-auth",
-  "version": "3.6.44",
+  "version": "3.6.46",
   "description": "Authentication service for React Native apps - Secure, type-safe, and production-ready. Provider-agnostic design with dependency injection, configurable validation, and comprehensive error handling.",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -31,9 +31,7 @@
     "type": "git",
     "url": "git+https://github.com/umituz/react-native-auth.git"
   },
-  "dependencies": {
-    "@umituz/react-native-localization": "*"
-  },
+  "dependencies": {},
   "peerDependencies": {
     "@react-navigation/native": ">=6.0.0",
     "@react-navigation/stack": ">=6.0.0",
@@ -87,9 +85,7 @@
     "expo-video": "^3.0.15",
     "expo-web-browser": "^12.0.0",
     "firebase": "^11.0.0",
-    "i18next": "^25.7.3",
     "react": "~19.1.0",
-    "react-i18next": "^16.5.1",
     "react-native": "~0.81.5",
     "react-native-gesture-handler": "^2.0.0",
     "react-native-safe-area-context": "^4.0.0",

package/src/index.ts

@@ -129,6 +129,10 @@ export {
 export { AuthProvider } from './presentation/providers/AuthProvider';
 export { useAuth } from './presentation/hooks/useAuth';
 export type { UseAuthResult } from './presentation/hooks/useAuth';
+export { useLoginForm } from './presentation/hooks/useLoginForm';
+export type { LoginFormTranslations as UseLoginFormTranslations, UseLoginFormConfig, UseLoginFormResult } from './presentation/hooks/useLoginForm';
+export { useRegisterForm } from './presentation/hooks/useRegisterForm';
+export type { RegisterFormTranslations as UseRegisterFormTranslations, UseRegisterFormConfig, UseRegisterFormResult } from './presentation/hooks/useRegisterForm';
 export { useAuthRequired } from './presentation/hooks/useAuthRequired';
 export type { UseAuthRequiredResult } from './presentation/hooks/useAuthRequired';
 export { useRequireAuth, useUserId } from './presentation/hooks/useRequireAuth';
@@ -156,33 +160,39 @@ export type { MigrationConfig } from './domain/utils/migration';
 
 // SCREENS & NAVIGATION
 export { LoginScreen } from './presentation/screens/LoginScreen';
+export type { LoginScreenTranslations, LoginScreenProps } from './presentation/screens/LoginScreen';
 export { RegisterScreen } from './presentation/screens/RegisterScreen';
+export type { RegisterScreenTranslations, RegisterScreenProps } from './presentation/screens/RegisterScreen';
 export { AccountScreen } from './presentation/screens/AccountScreen';
 export type { AccountScreenConfig, AccountScreenProps } from './presentation/screens/AccountScreen';
 export { EditProfileScreen } from './presentation/screens/EditProfileScreen';
 export type { EditProfileConfig, EditProfileScreenProps } from './presentation/screens/EditProfileScreen';
 export { ChangePasswordScreen } from './presentation/screens/ChangePasswordScreen';
-export type { ChangePasswordScreenProps } from './presentation/screens/ChangePasswordScreen';
+export type { ChangePasswordTranslations, ChangePasswordScreenProps } from './presentation/screens/ChangePasswordScreen';
 export { AuthNavigator } from './presentation/navigation/AuthNavigator';
 export type {
   AuthStackParamList,
+  AuthNavigatorTranslations,
   AuthNavigatorProps,
 } from './presentation/navigation/AuthNavigator';
 
 // COMPONENTS
 export { AuthHeader } from './presentation/components/AuthHeader';
+export type { AuthHeaderProps } from './presentation/components/AuthHeader';
 export { LoginForm } from './presentation/components/LoginForm';
+export type { LoginFormTranslations, LoginFormProps } from './presentation/components/LoginForm';
 export { RegisterForm } from './presentation/components/RegisterForm';
+export type { RegisterFormTranslations, RegisterFormProps } from './presentation/components/RegisterForm';
 export { AuthLegalLinks } from './presentation/components/AuthLegalLinks';
-export type { AuthLegalLinksProps } from './presentation/components/AuthLegalLinks';
+export type { AuthLegalLinksTranslations, AuthLegalLinksProps } from './presentation/components/AuthLegalLinks';
 export { PasswordStrengthIndicator } from './presentation/components/PasswordStrengthIndicator';
-export type { PasswordStrengthIndicatorProps } from './presentation/components/PasswordStrengthIndicator';
+export type { PasswordStrengthTranslations, PasswordStrengthIndicatorProps } from './presentation/components/PasswordStrengthIndicator';
 export { PasswordMatchIndicator } from './presentation/components/PasswordMatchIndicator';
-export type { PasswordMatchIndicatorProps } from './presentation/components/PasswordMatchIndicator';
+export type { PasswordMatchTranslations, PasswordMatchIndicatorProps } from './presentation/components/PasswordMatchIndicator';
 export { AuthBottomSheet } from './presentation/components/AuthBottomSheet';
-export type { AuthBottomSheetProps } from './presentation/components/AuthBottomSheet';
+export type { AuthBottomSheetTranslations, AuthBottomSheetProps } from './presentation/components/AuthBottomSheet';
 export { SocialLoginButtons } from './presentation/components/SocialLoginButtons';
-export type { SocialLoginButtonsProps } from './presentation/components/SocialLoginButtons';
+export type { SocialLoginButtonsTranslations, SocialLoginButtonsProps } from './presentation/components/SocialLoginButtons';
 export { ProfileSection } from './presentation/components/ProfileSection';
 export type { ProfileSectionConfig, ProfileSectionProps } from './presentation/components/ProfileSection';
 export { AccountActions } from './presentation/components/AccountActions';

package/src/presentation/components/AccountActions.tsx

@@ -1,166 +1,157 @@
-/**
- * Account Actions Component
- * Provides logout and delete account functionality
- * Only shown for authenticated (non-anonymous) users
- */
-
 import React from "react";
 import { View, TouchableOpacity, StyleSheet } from "react-native";
 import { useAppDesignTokens, AtomicIcon, AtomicText, useAlert, AlertType, AlertMode } from "@umituz/react-native-design-system";
-import { useLocalization } from "@umituz/react-native-localization";
 
 export interface AccountActionsConfig {
-    logoutText: string;
-    deleteAccountText: string;
-    changePasswordText?: string;
-    logoutConfirmTitle: string;
-    logoutConfirmMessage: string;
-    deleteConfirmTitle: string;
-    deleteConfirmMessage: string;
-    deleteErrorTitle?: string;
-    deleteErrorMessage?: string;
-    onLogout: () => Promise<void>;
-    onDeleteAccount: () => Promise<void>;
-    onChangePassword?: () => void;
-    showChangePassword?: boolean;
+  logoutText: string;
+  deleteAccountText: string;
+  changePasswordText?: string;
+  logoutConfirmTitle: string;
+  logoutConfirmMessage: string;
+  deleteConfirmTitle: string;
+  deleteConfirmMessage: string;
+  deleteErrorTitle?: string;
+  deleteErrorMessage?: string;
+  cancelText: string;
+  onLogout: () => Promise<void>;
+  onDeleteAccount: () => Promise<void>;
+  onChangePassword?: () => void;
+  showChangePassword?: boolean;
 }
 
 export interface AccountActionsProps {
-    config: AccountActionsConfig;
+  config: AccountActionsConfig;
 }
 
 export const AccountActions: React.FC<AccountActionsProps> = ({ config }) => {
-    const tokens = useAppDesignTokens();
-    const alert = useAlert();
-    const { t } = useLocalization();
-    const {
-        logoutText,
-        deleteAccountText,
-        changePasswordText,
-        logoutConfirmTitle,
-        logoutConfirmMessage,
-        deleteConfirmTitle,
-        deleteConfirmMessage,
-        deleteErrorTitle = "Error",
-        deleteErrorMessage = "Failed to delete account. Please try again.",
-        onLogout,
-        onDeleteAccount,
-        onChangePassword,
-        showChangePassword = false,
-    } = config;
+  const tokens = useAppDesignTokens();
+  const alert = useAlert();
+  const {
+    logoutText,
+    deleteAccountText,
+    changePasswordText,
+    logoutConfirmTitle,
+    logoutConfirmMessage,
+    deleteConfirmTitle,
+    deleteConfirmMessage,
+    deleteErrorTitle = "Error",
+    deleteErrorMessage = "Failed to delete account. Please try again.",
+    cancelText,
+    onLogout,
+    onDeleteAccount,
+    onChangePassword,
+    showChangePassword = false,
+  } = config;
 
-    const handleLogout = () => {
-        alert.show(AlertType.WARNING, AlertMode.MODAL, logoutConfirmTitle, logoutConfirmMessage, {
-            actions: [
-                {
-                    id: "cancel",
-                    label: t("common.cancel"),
-                    style: "secondary",
-                    onPress: () => {},
-                },
-                {
-                    id: "confirm",
-                    label: logoutText,
-                    style: "destructive",
-                    onPress: async () => {
-                        try {
-                            await onLogout();
-                        } catch (error) {
-                            // Silent error handling
-                        }
-                    },
-                },
-            ],
-        });
-    };
+  const handleLogout = () => {
+    alert.show(AlertType.WARNING, AlertMode.MODAL, logoutConfirmTitle, logoutConfirmMessage, {
+      actions: [
+        {
+          id: "cancel",
+          label: cancelText,
+          style: "secondary",
+          onPress: () => {},
+        },
+        {
+          id: "confirm",
+          label: logoutText,
+          style: "destructive",
+          onPress: async () => {
+            try {
+              await onLogout();
+            } catch {
+              // Silent error handling
+            }
+          },
+        },
+      ],
+    });
+  };
 
-    const handleDeleteAccount = () => {
-        alert.show(AlertType.ERROR, AlertMode.MODAL, deleteConfirmTitle, deleteConfirmMessage, {
-            actions: [
-                {
-                    id: "cancel",
-                    label: t("common.cancel"),
-                    style: "secondary",
-                    onPress: () => {},
-                },
-                {
-                    id: "confirm",
-                    label: deleteAccountText,
-                    style: "destructive",
-                    onPress: async () => {
-                        try {
-                            await onDeleteAccount();
-                        } catch (error) {
-                            alert.showError(deleteErrorTitle, deleteErrorMessage, { mode: AlertMode.MODAL });
-                        }
-                    },
-                },
-            ],
-        });
-    };
+  const handleDeleteAccount = () => {
+    alert.show(AlertType.ERROR, AlertMode.MODAL, deleteConfirmTitle, deleteConfirmMessage, {
+      actions: [
+        {
+          id: "cancel",
+          label: cancelText,
+          style: "secondary",
+          onPress: () => {},
+        },
+        {
+          id: "confirm",
+          label: deleteAccountText,
+          style: "destructive",
+          onPress: async () => {
+            try {
+              await onDeleteAccount();
+            } catch {
+              alert.showError(deleteErrorTitle, deleteErrorMessage, { mode: AlertMode.MODAL });
+            }
+          },
+        },
+      ],
+    });
+  };
 
-    return (
-        <View style={styles.container}>
-            {/* Change Password */}
-            {showChangePassword && onChangePassword && changePasswordText && (
-                <TouchableOpacity
-                    style={[styles.actionButton, { borderColor: tokens.colors.border }]}
-                    onPress={onChangePassword}
-                    activeOpacity={0.7}
-                >
-                    <AtomicIcon name="key-outline" size="md" color="textPrimary" />
-                    <AtomicText style={styles.actionText} color="textPrimary">
-                        {changePasswordText}
-                    </AtomicText>
-                    <AtomicIcon name="chevron-forward" size="sm" color="textSecondary" />
-                </TouchableOpacity>
-            )}
+  return (
+    <View style={styles.container}>
+      {showChangePassword && onChangePassword && changePasswordText && (
+        <TouchableOpacity
+          style={[styles.actionButton, { borderColor: tokens.colors.border }]}
+          onPress={onChangePassword}
+          activeOpacity={0.7}
+        >
+          <AtomicIcon name="key-outline" size="md" color="textPrimary" />
+          <AtomicText style={styles.actionText} color="textPrimary">
+            {changePasswordText}
+          </AtomicText>
+          <AtomicIcon name="chevron-forward" size="sm" color="textSecondary" />
+        </TouchableOpacity>
+      )}
 
-            {/* Logout */}
-            <TouchableOpacity
-                style={[styles.actionButton, { borderColor: tokens.colors.border }]}
-                onPress={handleLogout}
-                activeOpacity={0.7}
-            >
-                <AtomicIcon name="log-out-outline" size="md" color="error" />
-                <AtomicText style={styles.actionText} color="error">
-                    {logoutText}
-                </AtomicText>
-                <AtomicIcon name="chevron-forward" size="sm" color="textSecondary" />
-            </TouchableOpacity>
+      <TouchableOpacity
+        style={[styles.actionButton, { borderColor: tokens.colors.border }]}
+        onPress={handleLogout}
+        activeOpacity={0.7}
+      >
+        <AtomicIcon name="log-out-outline" size="md" color="error" />
+        <AtomicText style={styles.actionText} color="error">
+          {logoutText}
+        </AtomicText>
+        <AtomicIcon name="chevron-forward" size="sm" color="textSecondary" />
+      </TouchableOpacity>
 
-            {/* Delete Account */}
-            <TouchableOpacity
-                style={[styles.actionButton, { borderColor: tokens.colors.border }]}
-                onPress={handleDeleteAccount}
-                activeOpacity={0.7}
-            >
-                <AtomicIcon name="trash-outline" size="md" color="error" />
-                <AtomicText style={styles.actionText} color="error">
-                    {deleteAccountText}
-                </AtomicText>
-                <AtomicIcon name="chevron-forward" size="sm" color="textSecondary" />
-            </TouchableOpacity>
-        </View>
-    );
+      <TouchableOpacity
+        style={[styles.actionButton, { borderColor: tokens.colors.border }]}
+        onPress={handleDeleteAccount}
+        activeOpacity={0.7}
+      >
+        <AtomicIcon name="trash-outline" size="md" color="error" />
+        <AtomicText style={styles.actionText} color="error">
+          {deleteAccountText}
+        </AtomicText>
+        <AtomicIcon name="chevron-forward" size="sm" color="textSecondary" />
+      </TouchableOpacity>
+    </View>
+  );
 };
 
 const styles = StyleSheet.create({
-    container: {
-        gap: 12,
-    },
-    actionButton: {
-        flexDirection: "row",
-        alignItems: "center",
-        paddingVertical: 16,
-        paddingHorizontal: 16,
-        borderRadius: 12,
-        borderWidth: 1,
-        gap: 12,
-    },
-    actionText: {
-        flex: 1,
-        fontSize: 16,
-        fontWeight: "500",
-    },
+  container: {
+    gap: 12,
+  },
+  actionButton: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingVertical: 16,
+    paddingHorizontal: 16,
+    borderRadius: 12,
+    borderWidth: 1,
+    gap: 12,
+  },
+  actionText: {
+    flex: 1,
+    fontSize: 16,
+    fontWeight: "500",
+  },
 });

package/src/presentation/components/AuthBottomSheet.tsx

@@ -1,8 +1,3 @@
-/**
- * AuthBottomSheet Component
- * Bottom sheet modal for authentication (Login/Register)
- */
-
 import React, { useEffect } from "react";
 import { View, TouchableOpacity, ScrollView } from "react-native";
 import {
@@ -12,31 +7,39 @@ import {
   AtomicKeyboardAvoidingView,
   BottomSheetModal,
 } from "@umituz/react-native-design-system";
-import { useLocalization } from "@umituz/react-native-localization";
 import { useAuthBottomSheet, type SocialAuthConfiguration } from "../hooks/useAuthBottomSheet";
-import { LoginForm } from "./LoginForm";
-import { RegisterForm } from "./RegisterForm";
-import { SocialLoginButtons } from "./SocialLoginButtons";
+import { LoginForm, type LoginFormTranslations } from "./LoginForm";
+import { RegisterForm, type RegisterFormTranslations } from "./RegisterForm";
+import { SocialLoginButtons, type SocialLoginButtonsTranslations } from "./SocialLoginButtons";
 import { styles } from "./AuthBottomSheet.styles";
 
 declare const __DEV__: boolean;
 
+export interface AuthBottomSheetTranslations {
+  close: string;
+  signIn: string;
+  signInSubtitle: string;
+  createAccount: string;
+  createAccountSubtitle: string;
+  loginForm: LoginFormTranslations;
+  registerForm: RegisterFormTranslations;
+  socialButtons: SocialLoginButtonsTranslations;
+}
+
 export interface AuthBottomSheetProps {
+  translations: AuthBottomSheetTranslations;
   termsUrl?: string;
   privacyUrl?: string;
   onTermsPress?: () => void;
   onPrivacyPress?: () => void;
-  /** Social auth configuration */
   socialConfig?: SocialAuthConfiguration;
-  /** Called when Google sign-in is requested (overrides internal behavior) */
   onGoogleSignIn?: () => Promise<void>;
-  /** Called when Apple sign-in is requested (overrides internal behavior) */
   onAppleSignIn?: () => Promise<void>;
-  /** Called when auth completes successfully (login or register) */
   onAuthSuccess?: () => void;
 }
 
 export const AuthBottomSheet: React.FC<AuthBottomSheetProps> = ({
+  translations,
   termsUrl,
   privacyUrl,
   onTermsPress,
@@ -47,7 +50,6 @@ export const AuthBottomSheet: React.FC<AuthBottomSheetProps> = ({
   onAuthSuccess,
 }) => {
   const tokens = useAppDesignTokens();
-  const { t } = useLocalization();
 
   const {
     modalRef,
@@ -93,7 +95,7 @@ export const AuthBottomSheet: React.FC<AuthBottomSheetProps> = ({
           style={styles.closeButton}
           onPress={handleClose}
           hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
-          accessibilityLabel={t("common.close")}
+          accessibilityLabel={translations.close}
           accessibilityRole="button"
         >
           <AtomicIcon name="close" size="md" color="textSecondary" />
@@ -104,40 +106,44 @@ export const AuthBottomSheet: React.FC<AuthBottomSheetProps> = ({
           showsVerticalScrollIndicator={false}
           keyboardShouldPersistTaps="handled"
         >
+          <View style={styles.header}>
+            <AtomicText type="headlineLarge" color="textPrimary" style={styles.title}>
+              {mode === "login" ? translations.signIn : translations.createAccount}
+            </AtomicText>
+            <AtomicText type="bodyLarge" color="textSecondary" style={styles.subtitle}>
+              {mode === "login" ? translations.signInSubtitle : translations.createAccountSubtitle}
+            </AtomicText>
+          </View>
 
-        <View style={styles.header}>
-          <AtomicText type="headlineLarge" color="textPrimary" style={styles.title}>
-            {mode === "login" ? t("auth.signIn") : t("auth.createAccount")}
-          </AtomicText>
-          <AtomicText type="bodyLarge" color="textSecondary" style={styles.subtitle}>
-            {mode === "login" ? t("auth.signInSubtitle") : t("auth.createAccountSubtitle")}
-          </AtomicText>
-        </View>
-
-        <View style={styles.formContainer}>
-          {mode === "login" ? (
-            <LoginForm onNavigateToRegister={handleNavigateToRegister} />
-          ) : (
-            <RegisterForm
-              onNavigateToLogin={handleNavigateToLogin}
-              termsUrl={termsUrl}
-              privacyUrl={privacyUrl}
-              onTermsPress={onTermsPress}
-              onPrivacyPress={onPrivacyPress}
-            />
-          )}
+          <View style={styles.formContainer}>
+            {mode === "login" ? (
+              <LoginForm
+                translations={translations.loginForm}
+                onNavigateToRegister={handleNavigateToRegister}
+              />
+            ) : (
+              <RegisterForm
+                translations={translations.registerForm}
+                onNavigateToLogin={handleNavigateToLogin}
+                termsUrl={termsUrl}
+                privacyUrl={privacyUrl}
+                onTermsPress={onTermsPress}
+                onPrivacyPress={onPrivacyPress}
+              />
+            )}
 
-          {providers.length > 0 && (
-            <SocialLoginButtons
-              enabledProviders={providers}
-              onGooglePress={() => { void handleGoogleSignIn(); }}
-              onApplePress={() => { void handleAppleSignIn(); }}
-              googleLoading={googleLoading}
-              appleLoading={appleLoading}
-            />
-          )}
-        </View>
-      </ScrollView>
+            {providers.length > 0 && (
+              <SocialLoginButtons
+                translations={translations.socialButtons}
+                enabledProviders={providers}
+                onGooglePress={() => { void handleGoogleSignIn(); }}
+                onApplePress={() => { void handleAppleSignIn(); }}
+                googleLoading={googleLoading}
+                appleLoading={appleLoading}
+              />
+            )}
+          </View>
+        </ScrollView>
     </AtomicKeyboardAvoidingView>
     </BottomSheetModal>
   );

package/src/presentation/components/AuthHeader.tsx

@@ -1,21 +1,14 @@
-/**
- * Auth Header Component
- * Reusable header for auth screens
- */
-
 import React from "react";
 import { View, StyleSheet } from "react-native";
 import { AtomicText, useAppDesignTokens } from "@umituz/react-native-design-system";
-import { useLocalization } from "@umituz/react-native-localization";
 
-interface AuthHeaderProps {
+export interface AuthHeaderProps {
   title: string;
   subtitle?: string;
 }
 
 export const AuthHeader: React.FC<AuthHeaderProps> = ({ title, subtitle }) => {
   const tokens = useAppDesignTokens();
-  const { t } = useLocalization();
 
   return (
     <View style={[styles.header, { marginBottom: tokens.spacing.xl, paddingHorizontal: tokens.spacing.md }]}>
@@ -26,7 +19,7 @@ export const AuthHeader: React.FC<AuthHeaderProps> = ({ title, subtitle }) => {
       >
         {title}
       </AtomicText>
-      {(subtitle || t("auth.subtitle")) && (
+      {subtitle && (
         <AtomicText
           type="bodyMedium"
           color="textSecondary"
@@ -35,7 +28,7 @@ export const AuthHeader: React.FC<AuthHeaderProps> = ({ title, subtitle }) => {
             marginTop: tokens.spacing.xs,
           }}
         >
-          {subtitle || t("auth.subtitle")}
+          {subtitle}
         </AtomicText>
       )}
     </View>
@@ -47,14 +40,3 @@ const styles = StyleSheet.create({
     alignItems: "center",
   },
 });
-
-
-
-
-
-
-
-
-
-
-