@trustchex/react-native-sdk 1.250.0 → 1.253.0

package/lib/module/Screens/Static/VerificationSessionCheckScreen.js

@@ -8,8 +8,9 @@ import httpClient, { NotFoundError } from "../../Shared/Libs/http-client.js";
 import { useTranslation } from 'react-i18next';
 import LanguageSelector from "../../Shared/Components/LanguageSelector.js";
 import NavigationManager from "../../Shared/Components/NavigationManager.js";
-import { TextInput, useTheme } from 'react-native-paper';
 import StyledButton from "../../Shared/Components/StyledButton.js";
+import StyledTextInput from "../../Shared/Components/StyledTextInput.js";
+import { useTheme } from "../../Shared/Contexts/ThemeContext.js";
 import LottieView from 'lottie-react-native';
 import { getSimulatedDemoData, isDemoSession } from "../../Shared/Libs/demo.utils.js";
 import { useNavigation } from '@react-navigation/native';
@@ -28,9 +29,10 @@ const VerificationSessionCheckScreen = () => {
   } = useTranslation();
   const navigationManagerRef = React.useRef(null);
   const navigation = useNavigation();
-  const theme = useTheme();
   const initialized = useRef(false);
   const insets = useSafeAreaInsets();
+  const theme = useTheme();
+  const primaryColor = theme.colors.primary;
   const apiUrl = useMemo(() => `${appContext.baseUrl}/api/app/mobile`, [appContext.baseUrl]);
   const validateSessionCode = useCallback(value => {
     return SESSION_CODE_VALIDATION_PATTERN.test(value.toUpperCase());
@@ -109,9 +111,6 @@ const VerificationSessionCheckScreen = () => {
         appContext.workflowSteps = session?.workflowSteps;
         if (session?.branding) {
           appContext.branding = appContext.branding || session.branding;
-          theme.colors.primary = appContext.branding.primaryColor;
-          theme.colors.secondary = appContext.branding.secondaryColor;
-          theme.colors.tertiary = appContext.branding.tertiaryColor;
         }
         if (session?.sendOTP) {
           return sendOTPCode(session.id);
@@ -125,7 +124,7 @@ const VerificationSessionCheckScreen = () => {
         }, 1000);
       });
     }
-  }, [appContext, appContext.identificationInfo.sessionId, getSession, sendOTPCode, theme.colors, theme.colors.primary, theme.colors.secondary, theme.colors.tertiary]);
+  }, [appContext, appContext.identificationInfo.sessionId, getSession, sendOTPCode]);
   return /*#__PURE__*/_jsx(SafeAreaView, {
     style: styles.safeAreaContainer,
     children: /*#__PURE__*/_jsx(KeyboardAvoidingView, {
@@ -160,57 +159,50 @@ const VerificationSessionCheckScreen = () => {
             children: [/*#__PURE__*/_jsx(Text, {
               style: styles.mainText,
               children: t('verificationSessionCheckScreen.mainText')
-            }), /*#__PURE__*/_jsxs(View, {
-              style: styles.inputContainer,
-              children: [/*#__PURE__*/_jsx(TextInput, {
-                mode: "outlined",
-                autoCapitalize: "characters",
-                placeholder: "",
-                outlineColor: theme.colors.primary,
-                activeOutlineColor: theme.colors.primary,
-                style: styles.sessionCodeTextInput,
-                contentStyle: styles.sessionCodeInputWithText,
-                onChangeText: async text => {
-                  const alphanumericText = text.toUpperCase().replace(SESSION_CODE_CHARSET_PATTERN, '');
-                  if (alphanumericText.length <= 8) {
-                    setSessionCode(alphanumericText);
-                    if (validateSessionCode(alphanumericText) && alphanumericText.length === 8) {
-                      try {
-                        setIsCheckingSession(true);
-                        const session = await getSessionByCode(alphanumericText);
-                        if (session?.id) {
-                          appContext.identificationInfo.sessionId = session.id;
-                        } else {
-                          setSessionCode('');
-                        }
-                      } catch {
+            }), /*#__PURE__*/_jsx(StyledTextInput, {
+              autoCapitalize: "characters",
+              placeholder: t('verificationSessionCheckScreen.enterSessionCode'),
+              borderColor: primaryColor,
+              focusedBorderColor: primaryColor,
+              inputStyle: styles.sessionCodeTextInput,
+              placeholderStyle: styles.sessionCodeTextInputPlaceholder,
+              value: sessionCode.toUpperCase(),
+              onChangeText: async text => {
+                const alphanumericText = text.toUpperCase().replace(SESSION_CODE_CHARSET_PATTERN, '');
+                if (alphanumericText.length <= 8) {
+                  setSessionCode(alphanumericText);
+                  if (validateSessionCode(alphanumericText) && alphanumericText.length === 8) {
+                    try {
+                      setIsCheckingSession(true);
+                      const session = await getSessionByCode(alphanumericText);
+                      if (session?.id) {
+                        appContext.identificationInfo.sessionId = session.id;
+                      } else {
                         setSessionCode('');
-                      } finally {
-                        setTimeout(() => {
-                          setIsCheckingSession(false);
-                        }, 1000);
                       }
+                    } catch {
+                      setSessionCode('');
+                    } finally {
+                      setTimeout(() => {
+                        setIsCheckingSession(false);
+                      }, 1000);
                     }
                   }
-                },
-                value: sessionCode.toUpperCase(),
-                maxLength: 8
-              }), !sessionCode && /*#__PURE__*/_jsx(Text, {
-                style: styles.placeholderText,
-                children: t('verificationSessionCheckScreen.enterSessionCode')
-              })]
+                }
+              },
+              maxLength: 8
             }), /*#__PURE__*/_jsxs(View, {
               style: styles.horizontalLineContainer,
               children: [/*#__PURE__*/_jsx(View, {
                 style: [styles.horizontalLine, {
-                  backgroundColor: theme.colors.primary
+                  backgroundColor: primaryColor
                 }]
               }), /*#__PURE__*/_jsx(Text, {
                 style: styles.mainText,
                 children: t('verificationSessionCheckScreen.or')
               }), /*#__PURE__*/_jsx(View, {
                 style: [styles.horizontalLine, {
-                  backgroundColor: theme.colors.primary
+                  backgroundColor: primaryColor
                 }]
               })]
             }), /*#__PURE__*/_jsx(StyledButton, {
@@ -224,14 +216,12 @@ const VerificationSessionCheckScreen = () => {
             children: [/*#__PURE__*/_jsx(Text, {
               style: styles.mainText,
               children: t('verificationSessionCheckScreen.codeText')
-            }), /*#__PURE__*/_jsx(TextInput, {
-              mode: "outlined",
+            }), /*#__PURE__*/_jsx(StyledTextInput, {
               autoFocus: true,
               placeholder: "",
-              outlineColor: theme.colors.primary,
-              activeOutlineColor: theme.colors.primary,
-              style: styles.otpCodeTextInput,
-              contentStyle: styles.otpCodeInputWithText,
+              borderColor: primaryColor,
+              focusedBorderColor: primaryColor,
+              inputStyle: styles.otpCodeTextInput,
               keyboardType: "number-pad",
               textContentType: "oneTimeCode",
               autoComplete: "sms-otp",
@@ -313,7 +303,7 @@ const styles = StyleSheet.create({
   },
   horizontalLine: {
     flex: 1,
-    height: 2
+    height: 1
   },
   loadingAnimation: {
     width: '100%',
@@ -382,40 +372,21 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     position: 'absolute'
   },
-  inputContainer: {
-    position: 'relative',
-    width: '100%'
-  },
   sessionCodeTextInput: {
-    backgroundColor: 'white'
-  },
-  sessionCodeInputWithText: {
     textTransform: 'uppercase',
     fontWeight: '800',
     fontSize: 28,
     textAlign: 'center',
     letterSpacing: 8
   },
-  placeholderText: {
-    position: 'absolute',
-    top: 0,
-    left: 0,
-    right: 0,
-    height: '100%',
-    lineHeight: 56,
+  sessionCodeTextInputPlaceholder: {
     fontSize: 16,
-    color: '#666',
+    fontWeight: '400',
+    letterSpacing: 0,
     textAlign: 'center',
-    pointerEvents: 'none'
-  },
-  sessionCodeInputPlaceholder: {
-    fontSize: 16,
-    textAlign: 'center'
+    textTransform: 'none'
   },
   otpCodeTextInput: {
-    backgroundColor: 'white'
-  },
-  otpCodeInputWithText: {
     fontWeight: '800',
     fontSize: 28,
     textAlign: 'center',

package/lib/module/Shared/Components/FaceCamera.js

@@ -3,7 +3,7 @@
 import { useIsFocused } from '@react-navigation/native';
 import { useKeepAwake } from "../Libs/native-keep-awake.utils.js";
 import React, { useEffect, useState } from 'react';
-import { StyleSheet, Text, View, Platform, Linking, Dimensions } from 'react-native';
+import { StyleSheet, Text, View, Platform, Linking, Dimensions, ActivityIndicator } from 'react-native';
 import { useCameraDevice, useCameraPermission, Camera, useFrameProcessor, useCameraFormat, runAtTargetFps, useMicrophonePermission } from 'react-native-vision-camera';
 import { runAsync } from "../Libs/worklet.utils.js";
 import { useFaceDetector } from "../VisionCameraPlugins/FaceDetector/index.js";
@@ -11,8 +11,8 @@ import { Worklets, useSharedValue } from 'react-native-worklets-core';
 import { crop } from "../VisionCameraPlugins/Cropper/index.js";
 import { isFrameBright } from "../Libs/camera.utils.js";
 import { useTranslation } from 'react-i18next';
-import { ActivityIndicator } from 'react-native-paper';
 import StyledButton from "./StyledButton.js";
+import { useTheme } from "../Contexts/ThemeContext.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const VIDEO_WIDTH = 1280;
 const VIDEO_HEIGHT = 720;
@@ -23,6 +23,7 @@ const FaceCamera = ({
   onCameraInitialized
 }) => {
   useKeepAwake();
+  const theme = useTheme();
   const cameraPermission = useCameraPermission();
   const microphonePermission = useMicrophonePermission();
   const [permissionsRequested, setPermissionsRequested] = useState(false);
@@ -132,7 +133,8 @@ const FaceCamera = ({
     return /*#__PURE__*/_jsx(View, {
       style: styles.permissionContainer,
       children: /*#__PURE__*/_jsx(ActivityIndicator, {
-        size: "large"
+        size: "large",
+        color: theme.colors.primary
       })
     });
   }

package/lib/module/Shared/Components/IdentityDocumentCamera.js

@@ -2,7 +2,7 @@
 
 /* eslint-disable react-native/no-inline-styles */
 import React, { useEffect, useState } from 'react';
-import { View, StyleSheet, Text as TextView, Platform, Vibration, TouchableOpacity, Text, Linking, Image } from 'react-native';
+import { View, StyleSheet, Text as TextView, Platform, Vibration, TouchableOpacity, Text, Linking, Image, ActivityIndicator } from 'react-native';
 import { Camera, runAtTargetFps, useCameraDevice, useCameraFormat, useCameraPermission, useFrameProcessor } from 'react-native-vision-camera';
 import { runAsync } from "../Libs/worklet.utils.js";
 import { useRunOnJS, useSharedValue } from 'react-native-worklets-core';
@@ -17,11 +17,11 @@ import { AdaptiveThresholdTypes, ColorConversionCodes, DataTypes, ObjectType, Op
 import { getAverageBrightness } from "../Libs/camera.utils.js";
 import { useTranslation } from 'react-i18next';
 import LottieView from 'lottie-react-native';
-import { ActivityIndicator } from 'react-native-paper';
 import StyledButton from "./StyledButton.js";
 import { scanCodes } from "../VisionCameraPlugins/BarcodeScanner/index.js";
 import { speakWithDebounce } from "../Libs/tts.utils.js";
 import AppContext from "../Contexts/AppContext.js";
+import { useTheme } from "../Contexts/ThemeContext.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // const windowWidth = Dimensions.get('window').width;
 // const windowHeight = Dimensions.get('window').height;
@@ -38,6 +38,7 @@ const IdentityDocumentCamera = ({
   showDebugImages = false
 }) => {
   useKeepAwake();
+  const theme = useTheme();
   const appContext = React.useContext(AppContext);
   const cameraRef = React.useRef(null);
   const cameraPermission = useCameraPermission();
@@ -622,7 +623,8 @@ const IdentityDocumentCamera = ({
     return /*#__PURE__*/_jsx(View, {
       style: styles.permissionContainer,
       children: /*#__PURE__*/_jsx(ActivityIndicator, {
-        size: "large"
+        size: "large",
+        color: theme.colors.primary
       })
     });
   }

package/lib/module/Shared/Components/LanguageSelector.js

@@ -3,26 +3,32 @@
 import React from 'react';
 import { Pressable, StyleSheet, Text, View } from 'react-native';
 import i18n from "../../Translation/index.js";
-import AppContext from "../Contexts/AppContext.js";
+import { useTheme } from "../Contexts/ThemeContext.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const LanguageSelector = () => {
-  const appContext = React.useContext(AppContext);
+  const theme = useTheme();
+  const isEnglish = i18n.language.startsWith('en');
+  const isTurkish = i18n.language.startsWith('tr');
   return /*#__PURE__*/_jsxs(View, {
     style: styles.container,
     children: [/*#__PURE__*/_jsx(Pressable, {
       onPress: () => i18n.changeLanguage('en'),
       children: /*#__PURE__*/_jsx(Text, {
-        style: [styles.buttonText, i18n.language.startsWith('en') ? styles.buttonTextSelected : null, {
-          color: appContext.branding.primaryColor
+        style: [styles.buttonText, isEnglish && styles.buttonTextSelected, isEnglish && {
+          color: theme.colors.primary
         }],
         children: "EN"
       })
     }), /*#__PURE__*/_jsx(View, {
-      style: styles.verticalSeperator
+      style: [styles.verticalSeperator, {
+        borderColor: theme.colors.border
+      }]
     }), /*#__PURE__*/_jsx(Pressable, {
       onPress: () => i18n.changeLanguage('tr'),
       children: /*#__PURE__*/_jsx(Text, {
-        style: [styles.buttonText, i18n.language.startsWith('tr') ? styles.buttonTextSelected : null],
+        style: [styles.buttonText, isTurkish && styles.buttonTextSelected, isTurkish && {
+          color: theme.colors.primary
+        }],
         children: "TR"
       })
     })]
@@ -38,16 +44,14 @@ const styles = StyleSheet.create({
   },
   buttonText: {
     fontSize: 18,
-    color: 'black'
+    color: '#999999'
   },
   buttonTextSelected: {
-    color: '#000000',
     fontWeight: 'bold'
   },
   verticalSeperator: {
     borderLeftWidth: 1,
-    height: 24,
-    borderColor: 'black'
+    height: 24
   }
 });
 export default LanguageSelector;

package/lib/module/Shared/Components/NavigationManager.js

@@ -6,7 +6,7 @@ import { CommonActions, useNavigation, usePreventRemove } from '@react-navigatio
 import { View, StyleSheet, Alert } from 'react-native';
 import { useTranslation } from 'react-i18next';
 import i18n from "../../Translation/index.js";
-import { Button } from 'react-native-paper';
+import StyledButton from "./StyledButton.js";
 
 // Simple global navigation lock
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -150,7 +150,7 @@ const NavigationManager = /*#__PURE__*/forwardRef(({
   }));
   return appContext.currentWorkflowStep && (!appContext.currentWorkflowStep?.required || canSkipStep) && /*#__PURE__*/_jsx(View, {
     style: styles.container,
-    children: /*#__PURE__*/_jsx(Button, {
+    children: /*#__PURE__*/_jsx(StyledButton, {
       mode: "text",
       onPress: goToNextRouteWithAlert,
       children: t('navigationManager.skipStepLabel')

package/lib/module/Shared/Components/QrCodeScannerCamera.js

@@ -10,11 +10,13 @@ import { useTranslation } from 'react-i18next';
 import LottieView from 'lottie-react-native';
 import { scanCodes } from "../VisionCameraPlugins/BarcodeScanner/index.js";
 import StyledButton from "./StyledButton.js";
+import { useTheme } from "../Contexts/ThemeContext.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const QrCodeScannerCamera = ({
   onQrCodeScanned
 }) => {
   useKeepAwake();
+  const theme = useTheme();
   const cameraPermission = useCameraPermission();
   const [permissionsRequested, setPermissionsRequested] = React.useState(false);
   const [isActive, setIsActive] = React.useState(false);
@@ -123,7 +125,8 @@ const QrCodeScannerCamera = ({
     return /*#__PURE__*/_jsx(View, {
       style: styles.permissionContainer,
       children: /*#__PURE__*/_jsx(ActivityIndicator, {
-        size: "large"
+        size: "large",
+        color: theme.colors.primary
       })
     });
   }

package/lib/module/Shared/Components/StyledButton.js

@@ -1,18 +1,89 @@
 "use strict";
 
 import React from 'react';
-import { StyleSheet } from 'react-native';
-import { Button } from 'react-native-paper';
+import { StyleSheet, TouchableOpacity, Text, ActivityIndicator } from 'react-native';
+import { useTheme } from "../Contexts/ThemeContext.js";
+
+// Calculate if a color is light or dark to determine text color
 import { jsx as _jsx } from "react/jsx-runtime";
+const isLightColor = color => {
+  // Remove # if present
+  const hex = color.replace('#', '');
+
+  // Convert to RGB
+  const r = parseInt(hex.substring(0, 2), 16);
+  const g = parseInt(hex.substring(2, 4), 16);
+  const b = parseInt(hex.substring(4, 6), 16);
+
+  // Calculate relative luminance using WCAG formula
+  const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+
+  // Return true if light (luminance > 0.5)
+  return luminance > 0.5;
+};
 const StyledButton = ({
+  mode = 'contained',
+  onPress,
+  disabled = false,
+  loading = false,
+  children,
   style,
   labelStyle,
-  ...props
+  buttonColor,
+  textColor
 }) => {
-  return /*#__PURE__*/_jsx(Button, {
-    ...props,
-    style: [styles.button, style],
-    labelStyle: [styles.label, labelStyle]
+  const theme = useTheme();
+  const primaryColor = buttonColor || theme.colors.primary;
+
+  // Determine text color based on background color for contained mode
+  const getContainedTextColor = () => {
+    if (textColor) return textColor;
+    return isLightColor(primaryColor) ? '#000000' : '#FFFFFF';
+  };
+  const containedTextColor = getContainedTextColor();
+  const getButtonStyle = () => {
+    const baseStyle = [styles.button, style];
+    if (mode === 'contained') {
+      return [...baseStyle, styles.containedButton, {
+        backgroundColor: primaryColor
+      }, disabled && styles.disabledButton];
+    }
+    if (mode === 'outlined') {
+      return [...baseStyle, styles.outlinedButton, {
+        borderColor: primaryColor
+      }, disabled && styles.disabledButton];
+    }
+    return [...baseStyle, styles.textButton];
+  };
+  const getTextStyle = () => {
+    const baseStyle = [styles.label, labelStyle];
+    if (mode === 'contained') {
+      return [...baseStyle, styles.containedLabel, {
+        color: containedTextColor
+      }, disabled && styles.disabledLabel];
+    }
+    if (mode === 'outlined') {
+      return [...baseStyle, styles.outlinedLabel, {
+        color: primaryColor
+      }, disabled && styles.disabledLabel];
+    }
+    return [...baseStyle, styles.textLabel, {
+      color: primaryColor
+    }, disabled && styles.disabledLabel];
+  };
+  const loadingColor = mode === 'contained' ? containedTextColor : primaryColor;
+  return /*#__PURE__*/_jsx(TouchableOpacity, {
+    style: getButtonStyle(),
+    onPress: onPress,
+    disabled: disabled || loading,
+    activeOpacity: 0.7,
+    children: loading ? /*#__PURE__*/_jsx(ActivityIndicator, {
+      size: "small",
+      color: loadingColor
+    }) : /*#__PURE__*/_jsx(Text, {
+      style: getTextStyle(),
+      children: children
+    })
   });
 };
 const styles = StyleSheet.create({
@@ -20,11 +91,39 @@ const styles = StyleSheet.create({
     borderRadius: 8,
     height: 56,
     justifyContent: 'center',
-    elevation: 2
+    alignItems: 'center',
+    paddingHorizontal: 16
+  },
+  containedButton: {
+    elevation: 2,
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 2
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 3.84
+  },
+  outlinedButton: {
+    backgroundColor: 'transparent',
+    borderWidth: 2
+  },
+  textButton: {
+    backgroundColor: 'transparent'
+  },
+  disabledButton: {
+    opacity: 0.5
   },
   label: {
     fontWeight: 'bold',
-    fontSize: 16
+    fontSize: 16,
+    textAlign: 'center'
+  },
+  containedLabel: {},
+  outlinedLabel: {},
+  textLabel: {},
+  disabledLabel: {
+    opacity: 0.6
   }
 });
 export default StyledButton;

package/lib/module/Shared/Components/StyledTextInput.js

@@ -0,0 +1,87 @@
+"use strict";
+
+import React from 'react';
+import { StyleSheet, TextInput, View, Text } from 'react-native';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const StyledTextInput = /*#__PURE__*/React.forwardRef(({
+  containerStyle,
+  inputStyle,
+  placeholderStyle,
+  borderColor = '#DDDDDD',
+  focusedBorderColor,
+  backgroundColor = '#FFFFFF',
+  textColor = '#000000',
+  placeholderColor = '#999999',
+  style,
+  placeholderTextColor,
+  onFocus,
+  onBlur,
+  value,
+  ...props
+}, ref) => {
+  const [isFocused, setIsFocused] = React.useState(false);
+  const hasValue = value !== undefined && value !== '';
+  const handleFocus = e => {
+    setIsFocused(true);
+    onFocus?.(e);
+  };
+  const handleBlur = e => {
+    setIsFocused(false);
+    onBlur?.(e);
+  };
+  const currentBorderColor = isFocused ? focusedBorderColor || borderColor : borderColor;
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.container, containerStyle],
+    children: [/*#__PURE__*/_jsx(TextInput, {
+      ref: ref,
+      ...props,
+      value: value,
+      placeholder: "",
+      style: [styles.input, {
+        backgroundColor,
+        borderColor: currentBorderColor,
+        color: textColor
+      }, inputStyle, style],
+      onFocus: handleFocus,
+      onBlur: handleBlur
+    }), !hasValue && props.placeholder && /*#__PURE__*/_jsx(View, {
+      style: styles.placeholderContainer,
+      pointerEvents: "none",
+      children: /*#__PURE__*/_jsx(Text, {
+        style: [styles.placeholderText, {
+          color: placeholderColor || placeholderTextColor || '#999'
+        }, placeholderStyle],
+        children: props.placeholder
+      })
+    })]
+  });
+});
+StyledTextInput.displayName = 'StyledTextInput';
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    position: 'relative'
+  },
+  input: {
+    borderWidth: 2,
+    borderRadius: 8,
+    height: 56,
+    paddingHorizontal: 16,
+    fontSize: 16,
+    fontWeight: '400'
+  },
+  placeholderContainer: {
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    justifyContent: 'center',
+    paddingHorizontal: 16
+  },
+  placeholderText: {
+    fontSize: 16,
+    fontWeight: '400'
+  }
+});
+export default StyledTextInput;

package/lib/module/Shared/Contexts/ThemeContext.js

@@ -0,0 +1,40 @@
+"use strict";
+
+import React, { createContext, useContext, useMemo } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+const defaultColors = {
+  primary: '#000000',
+  secondary: '#CCCCCC',
+  tertiary: '#FF0000',
+  background: '#FFFFFF',
+  surface: '#F5F5F5',
+  text: '#000000',
+  textSecondary: '#666666',
+  border: '#DDDDDD',
+  error: '#E53935',
+  success: '#43A047'
+};
+const ThemeContext = /*#__PURE__*/createContext({
+  colors: defaultColors
+});
+export const useTheme = () => useContext(ThemeContext);
+export const ThemeProvider = ({
+  children,
+  primaryColor,
+  secondaryColor,
+  tertiaryColor
+}) => {
+  const colors = useMemo(() => ({
+    ...defaultColors,
+    primary: primaryColor || defaultColors.primary,
+    secondary: secondaryColor || defaultColors.secondary,
+    tertiary: tertiaryColor || defaultColors.tertiary
+  }), [primaryColor, secondaryColor, tertiaryColor]);
+  const value = useMemo(() => ({
+    colors
+  }), [colors]);
+  return /*#__PURE__*/_jsx(ThemeContext.Provider, {
+    value: value,
+    children: children
+  });
+};

package/lib/module/Translation/index.js

@@ -3,13 +3,20 @@
 import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import * as resources from "./Resources/index.js";
-import { Platform, NativeModules } from 'react-native';
 const getCurrentLanguage = () => {
-  let deviceLanguage = Platform.OS === 'ios' ? NativeModules?.SettingsManager?.settings?.AppleLocale : NativeModules?.I18nManager?.localeIdentifier;
-  if (!deviceLanguage) {
-    deviceLanguage = NativeModules?.SettingsManager?.settings?.AppleLanguages[0];
+  try {
+    if (typeof Intl !== 'undefined' && Intl.DateTimeFormat) {
+      const locale = Intl.DateTimeFormat().resolvedOptions().locale;
+      if (locale) {
+        // Extract language code from locale (e.g., "en-US" -> "en", "tr-TR" -> "tr")
+        return locale.split(/[-_]/)[0].toLowerCase();
+      }
+    }
+    return 'en';
+  } catch (error) {
+    console.error('Error detecting language:', error);
+    return 'en';
   }
-  return deviceLanguage;
 };
 i18n.use(initReactI18next).init({
   compatibilityJSON: 'v4',