@umituz/react-native-design-system 2.6.69 → 2.6.71

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-design-system",
-  "version": "2.6.69",
+  "version": "2.6.71",
   "description": "Universal design system for React Native apps - Consolidated package with atoms, molecules, organisms, theme, typography, responsive and safe area utilities",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/layouts/ScreenLayout/ScreenLayout.tsx

@@ -8,7 +8,7 @@ import { View, ScrollView } from 'react-native';
 import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useAppDesignTokens } from '../../theme';
 import { getScreenLayoutConfig } from '../../responsive/responsiveLayout';
-import { ContentWrapper } from './components/ContentWrapper';
+import { AtomicKeyboardAvoidingView } from '../../atoms';
 import { getScreenLayoutStyles } from './styles/screenLayoutStyles';
 import type { ScreenLayoutProps } from './types';
 
@@ -24,7 +24,6 @@ export const ScreenLayout: React.FC<ScreenLayoutProps> = ({
   testID,
   hideScrollIndicator = false,
   keyboardAvoiding = false,
-  responsiveEnabled = true,
   maxWidth,
   refreshControl,
 }) => {
@@ -37,10 +36,10 @@ export const ScreenLayout: React.FC<ScreenLayoutProps> = ({
     [insets]
   );
 
-  // Use provided maxWidth or responsive default
-  const finalMaxWidth = maxWidth || (responsiveEnabled ? layoutConfig.maxContentWidth : undefined);
-  const horizontalPadding = responsiveEnabled ? layoutConfig.horizontalPadding : tokens.spacing.md;
-  const verticalPadding = responsiveEnabled ? layoutConfig.verticalPadding : tokens.spacing.lg;
+  // Use centralized layout config for consistency
+  const finalMaxWidth = maxWidth || layoutConfig.maxContentWidth;
+  const horizontalPadding = layoutConfig.horizontalPadding;
+  const verticalPadding = layoutConfig.verticalPadding;
 
   // Pre-compute styles
   const styles = useMemo(
@@ -49,50 +48,44 @@ export const ScreenLayout: React.FC<ScreenLayoutProps> = ({
   );
 
   const bgColor = backgroundColor || tokens.colors.backgroundPrimary;
+  
+  const content = (
+    <View style={styles.responsiveWrapper}>
+      {header}
+      {scrollable ? (
+        <ScrollView
+          style={styles.scrollView}
+          contentContainerStyle={[styles.scrollContent, contentContainerStyle]}
+          showsVerticalScrollIndicator={!hideScrollIndicator}
+          keyboardShouldPersistTaps={keyboardAvoiding ? 'handled' : 'never'}
+          refreshControl={refreshControl}
+        >
+          {children}
+        </ScrollView>
+      ) : (
+        <View style={[styles.content, contentContainerStyle]}>
+          {children}
+        </View>
+      )}
+      {footer}
+    </View>
+  );
 
-  // Non-scrollable layout
-  if (!scrollable) {
-    return (
-      <SafeAreaView
-        style={[styles.container, { backgroundColor: bgColor }, containerStyle]}
-        edges={edges}
-        testID={testID}
-      >
-        <ContentWrapper keyboardAvoiding={keyboardAvoiding}>
-          <View style={styles.responsiveWrapper}>
-            {header}
-            <View style={[styles.content, contentContainerStyle]}>
-              {children}
-            </View>
-            {footer}
-          </View>
-        </ContentWrapper>
-      </SafeAreaView>
-    );
-  }
-
-  // Scrollable layout (default)
   return (
     <SafeAreaView
       style={[styles.container, { backgroundColor: bgColor }, containerStyle]}
       edges={edges}
       testID={testID}
     >
-      <ContentWrapper keyboardAvoiding={keyboardAvoiding}>
-        <View style={styles.responsiveWrapper}>
-          {header}
-          <ScrollView
-            style={styles.scrollView}
-            contentContainerStyle={[styles.scrollContent, contentContainerStyle]}
-            showsVerticalScrollIndicator={!hideScrollIndicator}
-            keyboardShouldPersistTaps={keyboardAvoiding ? 'handled' : 'never'}
-            refreshControl={refreshControl}
-          >
-            {children}
-          </ScrollView>
-          {footer}
-        </View>
-      </ContentWrapper>
+      {keyboardAvoiding ? (
+         <AtomicKeyboardAvoidingView style={styles.keyboardAvoidingView}>
+           {content}
+         </AtomicKeyboardAvoidingView>
+      ) : (
+         <View style={styles.keyboardAvoidingView}>
+           {content}
+         </View>
+      )}
     </SafeAreaView>
   );
 };

package/src/layouts/ScreenLayout/types/index.ts

@@ -21,7 +21,7 @@ export interface ScreenLayoutProps {
   readonly accessibilityLabel?: string;
   readonly accessibilityHint?: string;
   readonly accessible?: boolean;
-  readonly responsiveEnabled?: boolean;
+
   readonly maxWidth?: number;
   readonly refreshControl?: React.ReactElement<RefreshControlProps>;
 }

package/src/layouts/ScreenLayout/components/ContentWrapper.tsx

@@ -1,31 +0,0 @@
-/**
- * ContentWrapper Component
- * Conditionally wraps content with KeyboardAvoidingView
- */
-
-import React from 'react';
-import { View } from 'react-native';
-import type { ViewStyle } from 'react-native';
-import { AtomicKeyboardAvoidingView } from '../../../atoms';
-
-export interface ContentWrapperProps {
-  readonly children: React.ReactNode;
-  readonly keyboardAvoiding?: boolean;
-  readonly style?: ViewStyle;
-}
-
-export const ContentWrapper: React.FC<ContentWrapperProps> = ({
-  children,
-  keyboardAvoiding = false,
-  style,
-}) => {
-  if (keyboardAvoiding) {
-    return (
-      <AtomicKeyboardAvoidingView style={style}>
-        {children}
-      </AtomicKeyboardAvoidingView>
-    );
-  }
-
-  return <View style={style}>{children}</View>;
-};

package/src/layouts/ScreenLayout/components/index.ts

@@ -1,6 +0,0 @@
-/**
- * ScreenLayout Components Export
- */
-
-export { ContentWrapper } from './ContentWrapper';
-export type { ContentWrapperProps } from './ContentWrapper';