@umituz/react-native-settings 1.4.0 → 1.4.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "1.4.0",
+  "version": "1.4.1",
   "description": "Settings management for React Native apps - user preferences, theme, language, notifications",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/presentation/screens/AppearanceScreen.tsx

@@ -13,7 +13,7 @@ import React from 'react';
 import { View, StyleSheet } from 'react-native';
 
 import { useNavigation } from '@react-navigation/native';
-import { useTheme, useAppDesignTokens, type DesignTokens } from '@umituz/react-native-design-system-theme';
+import { useDesignSystemTheme, useAppDesignTokens, type DesignTokens } from '@umituz/react-native-design-system-theme';
 import { AtomicText, ScreenLayout, SectionHeader, SectionContainer } from '@umituz/react-native-design-system';
 import { useLocalization, getLanguageByCode } from '@umituz/react-native-localization';
 import { SettingItem } from '../components/SettingItem';
@@ -21,7 +21,8 @@ import { SettingItem } from '../components/SettingItem';
 export const AppearanceScreen: React.FC = () => {
   const { t, currentLanguage } = useLocalization();
   const navigation = useNavigation();
-  const { themeMode, toggleTheme } = useTheme();
+  // Only read themeMode, no toggle logic here - theme logic belongs in theme package
+  const { themeMode } = useDesignSystemTheme();
   const tokens = useAppDesignTokens();
   const styles = getStyles(tokens);
 
@@ -34,7 +35,13 @@ export const AppearanceScreen: React.FC = () => {
   };
 
   const handleThemeToggle = () => {
-    toggleTheme();
+    // Theme toggle logic should be handled by app, not this package
+    // This screen only displays current theme mode
+    // App should provide toggle functionality via navigation params or event emitter
+    // For now, just navigate back - app can handle toggle in its own theme management
+    if (navigation.canGoBack()) {
+      navigation.goBack();
+    }
   };
 
   return (

package/src/presentation/screens/SettingsScreen.tsx

@@ -16,7 +16,7 @@ import { DeviceEventEmitter, Alert, View, TouchableOpacity, StyleSheet } from 'r
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
 import { useNavigation, CommonActions } from '@react-navigation/native';
-import { useTheme, useAppDesignTokens } from '@umituz/react-native-design-system-theme';
+import { useDesignSystemTheme, useAppDesignTokens } from '@umituz/react-native-design-system-theme';
 import { ScreenLayout, AtomicIcon, AtomicText, SectionHeader, SectionContainer, AtomicDivider } from '@umituz/react-native-design-system';
 import { SettingItem } from '../components/SettingItem';
 import { getLanguageByCode, useLocalization } from '@umituz/react-native-localization';
@@ -86,7 +86,8 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
   config = {} 
 }) => {
   const navigation = useNavigation();
-  const { theme, themeMode } = useTheme();
+  // Only read themeMode, no theme logic here - theme logic belongs in theme package
+  const { themeMode } = useDesignSystemTheme();
   const tokens = useAppDesignTokens();
   const insets = useSafeAreaInsets();
   const { currentLanguage, t } = useLocalization();
@@ -246,12 +247,12 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
       <View style={[
         styles.header, 
         { 
-          borderBottomColor: theme.colors.borderLight,
-          backgroundColor: theme.colors.surface,
+          borderBottomColor: tokens.colors.borderLight,
+          backgroundColor: tokens.colors.surface,
           paddingTop: insets.top,
         }
       ]}>
-        <AtomicText type="headlineLarge" style={{ color: theme.colors.textPrimary, flex: 1 }}>
+        <AtomicText type="headlineLarge" style={{ color: tokens.colors.textPrimary, flex: 1 }}>
           {t('navigation.settings') || 'Settings'}
         </AtomicText>
         <TouchableOpacity
@@ -270,7 +271,7 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
           <SectionHeader>{t('settings.sections.appearance')}</SectionHeader>
           <SettingItem
             icon="Palette"
-            iconGradient={theme.colors.settingGradients.themeLight as unknown as string[]}
+            iconGradient={((tokens.colors as any).settingGradients?.themeLight as unknown as string[]) || [tokens.colors.primary, tokens.colors.secondary]}
             title={t('settings.appearance.title')}
             description={t('settings.appearance.themeDescription')}
             onPress={handleAppearancePress}
@@ -285,7 +286,7 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
           <SectionHeader>{t('settings.sections.general')}</SectionHeader>
           <SettingItem
             icon="Bell"
-            iconGradient={theme.colors.settingGradients.notifications as unknown as string[]}
+            iconGradient={((tokens.colors as any).settingGradients?.notifications as unknown as string[]) || [tokens.colors.primary, tokens.colors.secondary]}
             title={t('settings.notifications.title')}
             description={t('settings.notifications.description')}
             onPress={handleNotificationsPress}
@@ -300,7 +301,7 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
           <SectionHeader>Development</SectionHeader>
           <SettingItem
             icon="Play"
-            iconGradient={theme.colors.settingGradients.info as unknown as string[]}
+            iconGradient={((tokens.colors as any).settingGradients?.info as unknown as string[]) || [tokens.colors.primary, tokens.colors.secondary]}
             title="Show Onboarding (Dev)"
             description="Navigate to onboarding screen"
             onPress={handleShowOnboarding}
@@ -316,7 +317,7 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
           {features.about && (
             <SettingItem
               icon="Info"
-              iconGradient={theme.colors.settingGradients.info as unknown as string[]}
+              iconGradient={((tokens.colors as any).settingGradients?.info as unknown as string[]) || [tokens.colors.primary, tokens.colors.secondary]}
               title={t('settings.about.title')}
               description={t('settings.about.description')}
               onPress={handleAboutPress}
@@ -327,7 +328,7 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
           {features.legal && (
             <SettingItem
               icon="FileText"
-              iconGradient={theme.colors.settingGradients.info as unknown as string[]}
+              iconGradient={((tokens.colors as any).settingGradients?.info as unknown as string[]) || [tokens.colors.primary, tokens.colors.secondary]}
               title={t('settings.legal.title')}
               description={t('settings.legal.description')}
               onPress={handleLegalPress}