@umituz/react-native-settings 4.16.13 → 4.16.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "4.16.13",
+  "version": "4.16.15",
   "description": "Settings management for React Native apps - user preferences, theme, language, notifications",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -29,72 +29,41 @@
     "@expo/vector-icons": ">=14.0.0",
     "@react-navigation/native": ">=6.0.0",
     "@react-navigation/stack": ">=6.0.0",
-    "@umituz/react-native-about": "^1.11.3",
-    "@umituz/react-native-appearance": "*",
-    "@umituz/react-native-avatar": "*",
-    "@umituz/react-native-design-system": "*",
-    "@umituz/react-native-design-system-atoms": "*",
-    "@umituz/react-native-design-system-molecules": "*",
-    "@umituz/react-native-design-system-organisms": "*",
-    "@umituz/react-native-design-system-responsive": "*",
-    "@umituz/react-native-design-system-theme": "*",
-    "@umituz/react-native-design-system-typography": "*",
-    "@umituz/react-native-exception": "latest",
-    "@umituz/react-native-faqs": "^1.0.1",
-    "@umituz/react-native-feedback": "^1.3.0",
-    "@umituz/react-native-legal": "*",
-    "@umituz/react-native-localization": "*",
-    "@umituz/react-native-notifications": "*",
-    "@umituz/react-native-onboarding": "*",
-    "@umituz/react-native-rating": "*",
-    "@umituz/react-native-storage": "*",
-    "lucide-react-native": "*",
-    "react": ">=18.2.0",
-    "react-native": ">=0.74.0",
-    "react-native-safe-area-context": "~5.6.0",
-    "react-native-svg": "^15.0.0",
-    "zustand": "^5.0.2"
+    "@umituz/react-native-about": "latest",
+    "@umituz/react-native-appearance": "latest",
+    "@umituz/react-native-avatar": "latest",
+    "@umituz/react-native-faqs": "latest",
+    "@umituz/react-native-feedback": "latest",
+    "@umituz/react-native-legal": "latest",
+    "@umituz/react-native-localization": "latest",
+    "@umituz/react-native-notifications": "latest",
+    "@umituz/react-native-onboarding": "latest",
+    "@umituz/react-native-rating": "latest",
+    "@umituz/react-native-storage": "latest",
+    "react": ">=19.0.0",
+    "react-native": ">=0.81.0",
+    "react-native-safe-area-context": ">=4.0.0",
+    "zustand": ">=5.0.0"
   },
   "devDependencies": {
     "@babel/plugin-transform-runtime": "^7.28.5",
-    "@expo/vector-icons": "^14.0.0",
-    "@react-native/babel-preset": "^0.83.0",
-    "@react-navigation/native": "^6.1.17",
-    "@react-navigation/stack": "^7.6.12",
-    "@testing-library/jest-native": "^5.4.3",
-    "@testing-library/react-hooks": "^8.0.1",
-    "@testing-library/react-native": "^12.9.0",
+    "@expo/vector-icons": "^15.0.0",
     "@types/jest": "^29.5.14",
-    "@types/react": "^18.2.45",
-    "@types/react-native": "^0.73.0",
-    "@umituz/react-native-about": "^1.11.4",
-    "@umituz/react-native-alert": "latest",
-    "@umituz/react-native-appearance": "^2.0.2",
+    "@types/react": "~19.1.10",
+    "@umituz/react-native-about": "latest",
+    "@umituz/react-native-appearance": "latest",
     "@umituz/react-native-avatar": "latest",
-    "@umituz/react-native-design-system": "latest",
-    "@umituz/react-native-design-system-atoms": "latest",
-    "@umituz/react-native-design-system-molecules": "latest",
-    "@umituz/react-native-design-system-organisms": "latest",
-    "@umituz/react-native-design-system-responsive": "latest",
-    "@umituz/react-native-design-system-theme": "latest",
-    "@umituz/react-native-design-system-typography": "latest",
     "@umituz/react-native-faqs": "latest",
-    "@umituz/react-native-feedback": "^1.3.0",
-    "@umituz/react-native-legal": "^2.0.3",
+    "@umituz/react-native-feedback": "latest",
+    "@umituz/react-native-legal": "latest",
     "@umituz/react-native-localization": "latest",
     "@umituz/react-native-notifications": "latest",
-    "@umituz/react-native-onboarding": "^3.3.0",
-    "@umituz/react-native-rating": "^1.4.0",
+    "@umituz/react-native-onboarding": "latest",
+    "@umituz/react-native-rating": "latest",
     "@umituz/react-native-storage": "latest",
-    "babel-plugin-module-resolver": "^5.0.2",
-    "expo-constants": "^18.0.12",
-    "lucide-react-native": "^0.561.0",
-    "metro-react-native-babel-preset": "^0.77.0",
-    "react": "^18.2.0",
-    "react-native": "^0.74.0",
-    "react-native-svg": "^15.15.1",
-    "react-test-renderer": "^18.3.1",
-    "typescript": "^5.3.3"
+    "react": "19.1.0",
+    "react-native": "0.81.5",
+    "typescript": "^5.3.0"
   },
   "publishConfig": {
     "access": "public"
@@ -104,4 +73,4 @@
     "README.md",
     "LICENSE"
   ]
-}
+}

package/src/__tests__/integration.test.tsx

@@ -10,7 +10,7 @@ import { SettingsScreen } from '../../screens/SettingsScreen';
 import { useSettings } from '../../../infrastructure/storage/SettingsStore';
 
 // Mock all dependencies
-jest.mock('@umituz/react-native-design-system-theme', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   useDesignSystemTheme: () => ({
     themeMode: 'light',
   }),

package/src/__tests__/performance.test.tsx

@@ -11,7 +11,7 @@ import { DisclaimerSetting } from '../../components/DisclaimerSetting';
 import { SettingItem } from '../../components/SettingItem';
 
 // Mock dependencies
-jest.mock('@umituz/react-native-design-system-theme', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   useDesignSystemTheme: () => ({
     themeMode: 'light',
   }),

package/src/__tests__/setup.ts

@@ -7,7 +7,7 @@
 jest.mock('react-native/Libraries/Animated/NativeAnimatedHelper');
 
 // Mock design system packages
-jest.mock('@umituz/react-native-design-system-theme', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   useDesignSystemTheme: () => ({
     themeMode: 'light',
   }),
@@ -34,7 +34,7 @@ jest.mock('@umituz/react-native-design-system-theme', () => ({
   withAlpha: jest.fn((color: string, alpha: number) => `${color}${alpha}`),
 }));
 
-jest.mock('@umituz/react-native-design-system-atoms', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   AtomicText: ({ children, type, color, style, testID }: any) => {
     const React = require('react');
     const { Text } = require('react-native');

package/src/presentation/components/DevSettingsSection.tsx

@@ -10,7 +10,7 @@
 import React from "react";
 import { Alert } from "react-native";
 import { Feather } from "@expo/vector-icons";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
 import { storageRepository } from "@umituz/react-native-storage";
 import { SettingsSection } from "./SettingsSection";
 import { SettingItem } from "./SettingItem";

package/src/presentation/components/SettingItem.tsx

@@ -7,7 +7,7 @@
 import React from "react";
 import { View, Text, Pressable, StyleSheet, Switch } from "react-native";
 import { Feather } from "@expo/vector-icons";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
 
 export interface SettingItemProps {
   /** Icon component from @expo/vector-icons */

package/src/presentation/components/SettingsErrorBoundary.tsx

@@ -5,8 +5,8 @@
 
 import React, { Component, ReactNode } from 'react';
 import { View, StyleSheet } from 'react-native';
-import { useAppDesignTokens } from '@umituz/react-native-design-system-theme';
-import { AtomicText, AtomicIcon } from '@umituz/react-native-design-system-atoms';
+import { useAppDesignTokens } from '@umituz/react-native-design-system';
+import { AtomicText, AtomicIcon } from '@umituz/react-native-design-system';
 
 interface Props {
   children: ReactNode;

package/src/presentation/components/SettingsFooter.tsx

@@ -5,28 +5,29 @@
 
 import React from "react";
 import { View, Text, StyleSheet } from "react-native";
-import { useLocalization } from "@umituz/react-native-localization";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
 
 export interface SettingsFooterProps {
   /** Custom version text (optional) - should include version number from app config */
   versionText?: string;
   /** App version number from app config (e.g., "1.0.0") */
   appVersion?: string;
+  /** Label for version (e.g., "Version") */
+  versionLabel?: string;
 }
 
 export const SettingsFooter: React.FC<SettingsFooterProps> = ({
   versionText,
   appVersion,
+  versionLabel = "Version",
 }) => {
-  const { t } = useLocalization();
   const tokens = useAppDesignTokens();
   const colors = tokens.colors;
 
   // If versionText is provided, use it directly
-  // Otherwise build from translated label + appVersion
+  // Otherwise build from label + appVersion
   const displayText = versionText || (appVersion
-    ? `${t("settings.footer.version")} ${appVersion}`
+    ? `${versionLabel} ${appVersion}`
     : undefined);
 
   // Don't render if no version info available

package/src/presentation/components/SettingsSection.tsx

@@ -5,7 +5,7 @@
 
 import React from "react";
 import { View, Text, StyleSheet } from "react-native";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
 
 export interface SettingsSectionProps {
   /** Section title */

package/src/presentation/components/UserProfileHeader.tsx

@@ -7,8 +7,8 @@
 import React, { useCallback } from "react";
 import { View, TouchableOpacity, StyleSheet } from "react-native";
 import { Feather } from "@expo/vector-icons";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
-import { AtomicText } from "@umituz/react-native-design-system-atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { AtomicText } from "@umituz/react-native-design-system";
 import { useNavigation } from "@react-navigation/native";
 import { Avatar } from "@umituz/react-native-avatar";
 

package/src/presentation/components/__tests__/SettingItem.test.tsx

@@ -14,7 +14,7 @@ jest.mock('lucide-react-native', () => ({
 }));
 
 // Mock dependencies
-jest.mock('@umituz/react-native-design-system-theme', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   useAppDesignTokens: () => ({
     colors: {
       backgroundPrimary: '#ffffff',

package/src/presentation/components/__tests__/SettingsErrorBoundary.test.tsx

@@ -7,7 +7,7 @@ import { render, Text } from '@testing-library/react-native';
 import { SettingsErrorBoundary } from '../SettingsErrorBoundary';
 
 // Mock dependencies
-jest.mock('@umituz/react-native-design-system-theme', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   useAppDesignTokens: () => ({
     colors: {
       backgroundPrimary: '#ffffff',
@@ -16,7 +16,7 @@ jest.mock('@umituz/react-native-design-system-theme', () => ({
   }),
 }));
 
-jest.mock('@umituz/react-native-design-system-atoms', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   AtomicText: ({ children, type, color, style }: any) => (
     <Text style={style} testID={`atomic-text-${type}-${color}`}>
       {children}

package/src/presentation/navigation/SettingsStackNavigator.tsx

@@ -7,7 +7,7 @@
 
 import React from "react";
 import { createStackNavigator } from "@react-navigation/stack";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
 import { SettingsScreen } from "../screens/SettingsScreen";
 import { AppearanceScreen } from "../screens/AppearanceScreen";
 import type { SettingsConfig } from "../screens/types";

package/src/presentation/screens/SettingsScreen.tsx

@@ -9,7 +9,7 @@ import { useNavigation } from "@react-navigation/native";
 import {
   useDesignSystemTheme,
   useAppDesignTokens,
-} from "@umituz/react-native-design-system-theme";
+} from "@umituz/react-native-design-system";
 import { SettingsHeader } from "./components/SettingsHeader";
 import { SettingsContent } from "./components/SettingsContent";
 import { SettingsErrorBoundary } from "../components/SettingsErrorBoundary";

package/src/presentation/screens/__tests__/SettingsScreen.test.tsx

@@ -8,7 +8,7 @@ import { SettingsScreen } from '../SettingsScreen';
 import { NavigationContainer } from '@react-navigation/native';
 
 // Mock dependencies
-jest.mock('@umituz/react-native-design-system-theme', () => ({
+jest.mock('@umituz/react-native-design-system', () => ({
   useDesignSystemTheme: () => ({
     themeMode: 'light',
   }),

package/src/presentation/screens/components/SettingsContent.tsx

@@ -6,7 +6,7 @@
 import React, { useMemo } from "react";
 import { View, ScrollView, StyleSheet } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
 import { useLocalization } from "@umituz/react-native-localization";
 import { SettingsFooter } from "../../components/SettingsFooter";
 import { UserProfileHeader } from "../../components/UserProfileHeader";
@@ -144,6 +144,8 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
             onPress={userProfile?.onPress}
             anonymousDisplayName={userProfile?.anonymousDisplayName}
             avatarServiceUrl={userProfile?.avatarServiceUrl}
+            defaultUserDisplayName={t("settings.profile.defaultUserName")}
+            defaultAnonymousDisplayName={t("settings.profile.anonymousName")}
           />
         </View>
       )}
@@ -167,6 +169,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
               normalizedConfig.appearance.config?.description ||
               t("settings.appearance.description"),
           }}
+          sectionTitle={t("settings.appearance.title")}
         />
       )}
 
@@ -179,6 +182,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
               normalizedConfig.language.config?.description ||
               t("settings.languageSelection.description"),
           }}
+          sectionTitle={t("settings.languageSelection.title")}
         />
       )}
 
@@ -207,6 +211,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
               normalizedConfig.about.config?.description ||
               t("settings.about.description"),
           }}
+          sectionTitle={t("settings.about.title")}
         />
       )}
 
@@ -221,6 +226,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
               normalizedConfig.legal.config?.description ||
               t("settings.legal.description"),
           }}
+          sectionTitle={t("settings.legal.title")}
         />
       )}
 
@@ -295,7 +301,13 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
         />
       )}
 
-      {showFooter && <SettingsFooter versionText={footerText} appVersion={appVersion} />}
+      {showFooter && (
+        <SettingsFooter
+          versionText={footerText}
+          appVersion={appVersion}
+          versionLabel={t("settings.footer.version")}
+        />
+      )}
     </ScrollView>
   );
 };

package/src/presentation/screens/components/SettingsHeader.tsx

@@ -7,8 +7,8 @@ import React from "react";
 import { View, TouchableOpacity, StyleSheet } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { useNavigation } from "@react-navigation/native";
-import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
-import { AtomicIcon } from "@umituz/react-native-design-system-atoms";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { AtomicIcon } from "@umituz/react-native-design-system";
 
 interface SettingsHeaderProps {
   showCloseButton?: boolean;