@umituz/react-native-settings 3.0.1 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/package.json +13 -13
  2. package/src/index.ts +10 -0
  3. package/src/presentation/navigation/SettingsStackNavigator.tsx +95 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@umituz/react-native-settings",
3
- "version": "3.0.1",
3
+ "version": "4.0.0",
4
4
  "description": "Settings management for React Native apps - user preferences, theme, language, notifications",
5
5
  "main": "./src/index.ts",
6
6
  "types": "./src/index.ts",
@@ -26,19 +26,19 @@
26
26
  "url": "https://github.com/umituz/react-native-settings"
27
27
  },
28
28
  "peerDependencies": {
29
- "@react-navigation/native": "^6.1.18",
30
- "@umituz/react-native-appearance": "latest",
31
- "@umituz/react-native-design-system": "latest",
32
- "@umituz/react-native-design-system-atoms": "latest",
33
- "@umituz/react-native-design-system-molecules": "latest",
34
- "@umituz/react-native-design-system-organisms": "latest",
35
- "@umituz/react-native-design-system-responsive": "latest",
36
- "@umituz/react-native-design-system-theme": "latest",
37
- "@umituz/react-native-design-system-typography": "latest",
38
- "@umituz/react-native-localization": "latest",
39
- "@umituz/react-native-storage": "latest",
29
+ "@react-navigation/native": ">=6.0.0",
30
+ "@react-navigation/stack": ">=6.0.0",
31
+ "@umituz/react-native-appearance": "*",
32
+ "@umituz/react-native-design-system": "*",
33
+ "@umituz/react-native-design-system-atoms": "*",
34
+ "@umituz/react-native-design-system-molecules": "*",
35
+ "@umituz/react-native-design-system-organisms": "*",
36
+ "@umituz/react-native-design-system-responsive": "*",
37
+ "@umituz/react-native-design-system-theme": "*",
38
+ "@umituz/react-native-design-system-typography": "*",
39
+ "@umituz/react-native-localization": "*",
40
+ "@umituz/react-native-storage": "*",
40
41
  "@expo/vector-icons": ">=14.0.0",
41
- "expo-linear-gradient": "^15.0.7",
42
42
  "react": ">=18.2.0",
43
43
  "react-native": ">=0.74.0",
44
44
  "react-native-safe-area-context": "~5.6.0",
package/src/index.ts CHANGED
@@ -36,6 +36,16 @@ export { SettingsScreen } from './presentation/screens/SettingsScreen';
36
36
  export type { SettingsScreenProps } from './presentation/screens/SettingsScreen';
37
37
  export { AppearanceScreen } from './presentation/screens/AppearanceScreen';
38
38
 
39
+ // =============================================================================
40
+ // PRESENTATION LAYER - Navigation
41
+ // =============================================================================
42
+
43
+ export { SettingsStackNavigator } from './presentation/navigation/SettingsStackNavigator';
44
+ export type {
45
+ SettingsStackNavigatorProps,
46
+ SettingsStackParamList
47
+ } from './presentation/navigation/SettingsStackNavigator';
48
+
39
49
  // =============================================================================
40
50
  // PRESENTATION LAYER - Types
41
51
  // =============================================================================
package/src/presentation/navigation/SettingsStackNavigator.tsx ADDED
@@ -0,0 +1,95 @@
1
+ /**
2
+ * Settings Stack Navigator
3
+ *
4
+ * Base stack navigator for settings screens
5
+ * Can be extended by apps to add custom screens
6
+ */
7
+
8
+ import React from "react";
9
+ import { createStackNavigator } from "@react-navigation/stack";
10
+ import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
11
+ import { SettingsScreen } from "../screens/SettingsScreen";
12
+ import { AppearanceScreen } from "../screens/AppearanceScreen";
13
+ import type { SettingsConfig } from "../screens/types";
14
+
15
+ // Default param list - can be extended by apps
16
+ export type SettingsStackParamList = {
17
+ Settings: { config?: SettingsConfig };
18
+ Appearance: undefined;
19
+ // About and Legal screens will be handled by external packages
20
+ };
21
+
22
+ export interface SettingsStackNavigatorProps {
23
+ /**
24
+ * Settings configuration
25
+ */
26
+ config?: SettingsConfig;
27
+
28
+ /**
29
+ * Additional screens to register
30
+ * Apps can add their own screens here
31
+ */
32
+ additionalScreens?: Array<{
33
+ name: string;
34
+ component: React.ComponentType<any>;
35
+ options?: any;
36
+ }>;
37
+ }
38
+
39
+ const Stack = createStackNavigator<SettingsStackParamList>();
40
+
41
+ export const SettingsStackNavigator: React.FC<SettingsStackNavigatorProps> = ({
42
+ config = {},
43
+ additionalScreens = [],
44
+ }) => {
45
+ const tokens = useAppDesignTokens();
46
+
47
+ const screenOptions = {
48
+ headerStyle: {
49
+ backgroundColor: tokens.colors.surface,
50
+ borderBottomColor: tokens.colors.borderLight,
51
+ borderBottomWidth: 1,
52
+ },
53
+ headerTitleStyle: {
54
+ fontSize: 18,
55
+ fontWeight: "600" as const,
56
+ color: tokens.colors.textPrimary,
57
+ },
58
+ headerTintColor: tokens.colors.textPrimary,
59
+ };
60
+
61
+ return (
62
+ <Stack.Navigator screenOptions={screenOptions}>
63
+ <Stack.Screen
64
+ name="Settings"
65
+ options={{
66
+ headerShown: false,
67
+ title: "Settings",
68
+ }}
69
+ >
70
+ {() => <SettingsScreen config={config} />}
71
+ </Stack.Screen>
72
+
73
+ <Stack.Screen
74
+ name="Appearance"
75
+ component={AppearanceScreen}
76
+ options={{
77
+ headerShown: true,
78
+ headerTitle: "Appearance",
79
+ headerTitleAlign: "center",
80
+ headerBackTitle: "Settings",
81
+ }}
82
+ />
83
+
84
+ {/* Render additional screens */}
85
+ {additionalScreens.map((screen) => (
86
+ <Stack.Screen
87
+ key={screen.name}
88
+ name={screen.name as any}
89
+ component={screen.component}
90
+ options={screen.options}
91
+ />
92
+ ))}
93
+ </Stack.Navigator>
94
+ );
95
+ };