@umituz/react-native-settings 4.17.14 → 4.17.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-settings",
-  "version": "4.17.14",
+  "version": "4.17.15",
   "description": "Settings management for React Native apps - user preferences, theme, language, notifications",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -76,5 +76,8 @@
     "src",
     "README.md",
     "LICENSE"
-  ]
-}
+  ],
+  "dependencies": {
+    "@umituz/react-native-design-system": "^2.2.0"
+  }
+}

package/src/presentation/components/DevSettingsSection.tsx

@@ -9,7 +9,7 @@
 
 import React from "react";
 import { Alert } from "react-native";
-import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { useResponsiveDesignTokens } from "@umituz/react-native-design-system";
 import { storageRepository } from "@umituz/react-native-storage";
 import { SettingsSection } from "./SettingsSection";
 import { SettingItem } from "./SettingItem";
@@ -46,7 +46,7 @@ export const DevSettingsSection: React.FC<DevSettingsProps> = ({
   texts = {},
   customDevComponents = [],
 }) => {
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
 
   // Merge custom texts with defaults
   const t = { ...DEFAULT_TEXTS, ...texts };

package/src/presentation/components/SettingItem.tsx

@@ -6,7 +6,7 @@
 
 import React from "react";
 import { View, Text, Pressable, StyleSheet, Switch } from "react-native";
-import { AtomicIcon, useAppDesignTokens } from "@umituz/react-native-design-system";
+import { AtomicIcon, useResponsiveDesignTokens } from "@umituz/react-native-design-system";
 
 export interface SettingItemProps {
   /** Icon name (Ionicons) */
@@ -58,7 +58,7 @@ export const SettingItem: React.FC<SettingItemProps> = ({
   switchThumbColor,
   switchTrackColors,
 }) => {
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
   const colors = tokens.colors;
 
   return (

package/src/presentation/components/SettingsErrorBoundary.tsx

@@ -5,7 +5,7 @@
 
 import React, { Component, ReactNode } from 'react';
 import { View, StyleSheet } from 'react-native';
-import { useAppDesignTokens } from '@umituz/react-native-design-system';
+import { useResponsiveDesignTokens } from '@umituz/react-native-design-system';
 import { AtomicText, AtomicIcon } from '@umituz/react-native-design-system';
 import { useLocalization } from '@umituz/react-native-localization';
 
@@ -67,7 +67,7 @@ const ErrorBoundaryFallback: React.FC<ErrorBoundaryFallbackProps> = ({
   fallbackTitle,
   fallbackMessage
 }) => {
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
   const { t } = useLocalization();
 
   const title = __DEV__ && error?.message

package/src/presentation/components/SettingsFooter.tsx

@@ -5,7 +5,7 @@
 
 import React from "react";
 import { View, Text, StyleSheet } from "react-native";
-import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { useResponsiveDesignTokens } from "@umituz/react-native-design-system";
 
 export interface SettingsFooterProps {
   /** Custom version text (optional) - should include version number from app config */
@@ -21,7 +21,7 @@ export const SettingsFooter: React.FC<SettingsFooterProps> = ({
   appVersion,
   versionLabel = "Version",
 }) => {
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
   const colors = tokens.colors;
 
   // If versionText is provided, use it directly

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";
+import { useResponsiveDesignTokens } from "@umituz/react-native-design-system";
 
 export interface SettingsSectionProps {
   /** Section title */
@@ -18,7 +18,7 @@ export const SettingsSection: React.FC<SettingsSectionProps> = ({
   title,
   children,
 }) => {
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
   const colors = tokens.colors;
 
   return (

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";
+import { useResponsiveDesignTokens } from "@umituz/react-native-design-system";
 import { SettingsScreen } from "../screens/SettingsScreen";
 import { AppearanceScreen } from "../screens/AppearanceScreen";
 import type { SettingsConfig } from "../screens/types";
@@ -76,7 +76,7 @@ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = ({
     additionalScreens = [],
     devSettings,
 }) => {
-    const tokens = useAppDesignTokens();
+    const tokens = useResponsiveDesignTokens();
 
     const screenOptions = {
         headerStyle: {

package/src/presentation/screens/SettingsScreen.tsx

@@ -8,7 +8,7 @@ import { View, StatusBar, StyleSheet } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import {
   useDesignSystemTheme,
-  useAppDesignTokens,
+  useResponsiveDesignTokens,
 } from "@umituz/react-native-design-system";
 import { SettingsHeader } from "./components/SettingsHeader";
 import { SettingsContent } from "./components/SettingsContent";
@@ -68,7 +68,7 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
 }) => {
   const navigation = useNavigation();
   const { themeMode } = useDesignSystemTheme();
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
 
   const isDark = themeMode === "dark";
   const colors = tokens.colors;

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";
+import { useResponsiveDesignTokens } from "@umituz/react-native-design-system";
 import { useLocalization } from "@umituz/react-native-localization";
 import { SettingsFooter } from "../../components/SettingsFooter";
 import { ProfileSection } from "@umituz/react-native-auth";
@@ -107,7 +107,7 @@ export const SettingsContent: React.FC<SettingsContentProps> = ({
   showCloseButton = false,
   devSettings,
 }) => {
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
   const insets = useSafeAreaInsets();
   const { t } = useLocalization();
 

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

@@ -7,7 +7,7 @@ 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";
+import { useResponsiveDesignTokens } from "@umituz/react-native-design-system";
 import { AtomicIcon } from "@umituz/react-native-design-system";
 
 interface SettingsHeaderProps {
@@ -20,7 +20,7 @@ export const SettingsHeader: React.FC<SettingsHeaderProps> = ({
   onClose,
 }) => {
   const navigation = useNavigation();
-  const tokens = useAppDesignTokens();
+  const tokens = useResponsiveDesignTokens();
   const insets = useSafeAreaInsets();
 
   const handleClose = () => {