@umituz/react-native-settings 1.6.2 → 1.7.0

package/package.json

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

package/src/index.ts

@@ -41,7 +41,7 @@ export { LanguageSelectionScreen } from './presentation/screens/LanguageSelectio
 // PRESENTATION LAYER - Types
 // =============================================================================
 
-export type { SettingsConfig } from './presentation/screens/types';
+export type { SettingsConfig, CustomSettingsSection } from './presentation/screens/types';
 
 // =============================================================================
 // PRESENTATION LAYER - Components

package/src/presentation/screens/SettingsScreen.tsx

@@ -24,7 +24,7 @@ import { SettingItem } from "../components/SettingItem";
 import { SettingsSection } from "../components/SettingsSection";
 import { SettingsFooter } from "../components/SettingsFooter";
 import { UserProfileHeader } from "../components/UserProfileHeader";
-import { SettingsConfig } from "./types";
+import { SettingsConfig, CustomSettingsSection } from "./types";
 
 // Optional notification service
 let notificationService: any = null;
@@ -92,6 +92,8 @@ export interface SettingsScreenProps {
   showFooter?: boolean;
   /** Custom footer text */
   footerText?: string;
+  /** Custom sections to render */
+  customSections?: CustomSettingsSection[];
 }
 
 export const SettingsScreen: React.FC<SettingsScreenProps> = ({
@@ -100,6 +102,7 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
   userProfile,
   showFooter = true,
   footerText,
+  customSections = [],
 }) => {
   const navigation = useNavigation();
   const { themeMode } = useDesignSystemTheme();
@@ -234,7 +237,16 @@ export const SettingsScreen: React.FC<SettingsScreenProps> = ({
           </SettingsSection>
         )}
 
-        {!hasAnyFeatures && (
+        {/* Custom Sections */}
+        {customSections
+          .sort((a, b) => (a.order ?? 999) - (b.order ?? 999))
+          .map((section, index) => (
+            <SettingsSection key={`custom-${index}`} title={section.title}>
+              {section.content}
+            </SettingsSection>
+          ))}
+
+        {!hasAnyFeatures && customSections.length === 0 && (
           <View style={styles.emptyContainer}>
             <SettingsSection
               title={t("settings.noOptionsAvailable") || "No settings available"}

package/src/presentation/screens/types.ts

@@ -33,3 +33,16 @@ export interface SettingsConfig {
   legal?: boolean | 'auto';
 }
 
+/**
+ * Custom Settings Section
+ * Allows apps to add custom sections to the settings screen
+ */
+export interface CustomSettingsSection {
+  /** Section title */
+  title: string;
+  /** Section content (React nodes) */
+  content: React.ReactNode;
+  /** Section order (lower = higher in list) */
+  order?: number;
+}
+