@umituz/react-native-design-system 2.5.9 → 2.5.10

package/README.md

@@ -23,7 +23,7 @@ npm install @umituz/react-native-design-system
 ### Peer Dependencies
 
 ```bash
-npm install react@18.3.1 react-native@0.76.3 react-native-reanimated@~3.10.1 react-native-svg@^15.0.0 lucide-react-native@^0.468.0
+npm install react@18.3.1 react-native@0.76.3 react-native-reanimated@~3.10.1 react-native-svg@^15.0.0
 ```
 
 > **v1.3.0 Breaking Change**: React Native Paper dependency removed! All components now use pure React Native implementation for lighter bundle size and full control over styling.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-design-system",
-  "version": "2.5.9",
+  "version": "2.5.10",
   "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/atoms/AtomicButton.tsx

@@ -41,9 +41,6 @@ export const AtomicButton: React.FC<AtomicButtonProps> = React.memo(({
 
   const handlePress = () => {
     if (!disabled) {
-      if (__DEV__) {
-        console.log('[AtomicButton] Button pressed:', { title, variant, disabled });
-      }
       onPress();
     }
   };
@@ -115,7 +112,7 @@ export const AtomicButton: React.FC<AtomicButtonProps> = React.memo(({
         return {
           container: {
             ...baseStyle,
-            backgroundColor: 'transparent',
+            backgroundColor: undefined,
             borderWidth: 1,
             borderColor: tokens.colors.border,
           },
@@ -129,7 +126,7 @@ export const AtomicButton: React.FC<AtomicButtonProps> = React.memo(({
         return {
           container: {
             ...baseStyle,
-            backgroundColor: 'transparent',
+            backgroundColor: undefined,
           },
           text: {
             ...baseTextStyle,

package/src/atoms/AtomicChip.tsx

@@ -108,37 +108,37 @@ export const AtomicChip: React.FC<AtomicChipProps> = React.memo(({
 
   const sizeConfig = sizeMap[size];
 
-  // Color mapping
+  // Color mapping - using undefined for transparent backgrounds
   const colorMap = {
     primary: {
       filled: { bg: tokens.colors.primary, text: tokens.colors.onPrimary, border: tokens.colors.primary },
-      outlined: { bg: 'transparent', text: tokens.colors.primary, border: tokens.colors.primary },
-      soft: { bg: tokens.colors.primaryContainer, text: tokens.colors.onPrimaryContainer, border: 'transparent' },
+      outlined: { bg: undefined, text: tokens.colors.primary, border: tokens.colors.primary },
+      soft: { bg: tokens.colors.primaryContainer, text: tokens.colors.onPrimaryContainer, border: undefined },
     },
     secondary: {
       filled: { bg: tokens.colors.secondary, text: tokens.colors.onSecondary, border: tokens.colors.secondary },
-      outlined: { bg: 'transparent', text: tokens.colors.secondary, border: tokens.colors.secondary },
-      soft: { bg: tokens.colors.secondaryContainer, text: tokens.colors.onSecondaryContainer, border: 'transparent' },
+      outlined: { bg: undefined, text: tokens.colors.secondary, border: tokens.colors.secondary },
+      soft: { bg: tokens.colors.secondaryContainer, text: tokens.colors.onSecondaryContainer, border: undefined },
     },
     success: {
       filled: { bg: tokens.colors.success, text: tokens.colors.onSuccess, border: tokens.colors.success },
-      outlined: { bg: 'transparent', text: tokens.colors.success, border: tokens.colors.success },
-      soft: { bg: tokens.colors.successContainer, text: tokens.colors.onSuccessContainer, border: 'transparent' },
+      outlined: { bg: undefined, text: tokens.colors.success, border: tokens.colors.success },
+      soft: { bg: tokens.colors.successContainer, text: tokens.colors.onSuccessContainer, border: undefined },
     },
     warning: {
       filled: { bg: tokens.colors.warning, text: tokens.colors.onWarning, border: tokens.colors.warning },
-      outlined: { bg: 'transparent', text: tokens.colors.warning, border: tokens.colors.warning },
-      soft: { bg: tokens.colors.warningContainer, text: tokens.colors.onWarningContainer, border: 'transparent' },
+      outlined: { bg: undefined, text: tokens.colors.warning, border: tokens.colors.warning },
+      soft: { bg: tokens.colors.warningContainer, text: tokens.colors.onWarningContainer, border: undefined },
     },
     error: {
       filled: { bg: tokens.colors.error, text: tokens.colors.onError, border: tokens.colors.error },
-      outlined: { bg: 'transparent', text: tokens.colors.error, border: tokens.colors.error },
-      soft: { bg: tokens.colors.errorContainer, text: tokens.colors.onErrorContainer, border: 'transparent' },
+      outlined: { bg: undefined, text: tokens.colors.error, border: tokens.colors.error },
+      soft: { bg: tokens.colors.errorContainer, text: tokens.colors.onErrorContainer, border: undefined },
     },
     info: {
       filled: { bg: tokens.colors.info, text: tokens.colors.onInfo, border: tokens.colors.info },
-      outlined: { bg: 'transparent', text: tokens.colors.info, border: tokens.colors.info },
-      soft: { bg: tokens.colors.infoContainer, text: tokens.colors.onInfoContainer, border: 'transparent' },
+      outlined: { bg: undefined, text: tokens.colors.info, border: tokens.colors.info },
+      soft: { bg: tokens.colors.infoContainer, text: tokens.colors.onInfoContainer, border: undefined },
     },
   };
 

package/src/atoms/AtomicIcon.tsx

@@ -122,17 +122,10 @@ export const AtomicIcon: React.FC<AtomicIconProps> = React.memo(({
       ? getSemanticColor(color, tokens)
       : tokens.colors.textPrimary;
 
-  // Validate icon
+  // Validate icon - use fallback silently if invalid
   const isValidIcon = name in Ionicons.glyphMap;
   const iconName = isValidIcon ? name : FALLBACK_ICON;
 
-  if (__DEV__ && !isValidIcon) {
-    console.warn(
-      `[AtomicIcon] Invalid icon name: "${name}". Using fallback icon "${FALLBACK_ICON}". ` +
-      `Available icons: https://icons.expo.fyi/`
-    );
-  }
-
   const iconElement = (
     <Ionicons
       name={iconName as keyof typeof Ionicons.glyphMap}

package/src/atoms/AtomicPicker.tsx

@@ -73,7 +73,7 @@ export const AtomicPicker: React.FC<AtomicPickerProps> = ({
   onChange,
   options,
   label,
-  placeholder = 'Select...',
+  placeholder,
   error,
   disabled = false,
   multiple = false,
@@ -82,9 +82,10 @@ export const AtomicPicker: React.FC<AtomicPickerProps> = ({
   autoClose = true,
   size = 'md',
   modalTitle,
-  emptyMessage = 'No options available',
-  clearAccessibilityLabel = 'Clear selection',
-  closeAccessibilityLabel = 'Close picker',
+  emptyMessage,
+  searchPlaceholder,
+  clearAccessibilityLabel,
+  closeAccessibilityLabel,
   style,
   labelStyle,
   testID,
@@ -294,7 +295,7 @@ export const AtomicPicker: React.FC<AtomicPickerProps> = ({
         filteredOptions={filteredOptions}
         multiple={multiple}
         emptyMessage={emptyMessage}
-        searchPlaceholder="Search..."
+        searchPlaceholder={searchPlaceholder}
         closeAccessibilityLabel={closeAccessibilityLabel}
         testID={testID}
       />

package/src/atoms/__tests__/AtomicIcon.test.tsx

@@ -18,12 +18,6 @@ jest.mock('@umituz/react-native-design-system-theme', () => ({
   }),
 }));
 
-// Mock Lucide icons
-jest.mock('lucide-react-native', () => ({
-  Settings: () => 'Settings-Icon',
-  Heart: () => 'Heart-Icon',
-}));
-
 describe('AtomicIcon', () => {
   it('renders with default props', () => {
     const { getByTestId } = render(

package/src/atoms/input/hooks/useInputState.ts

@@ -35,17 +35,11 @@ export const useInputState = ({
   const [isPasswordVisible, setIsPasswordVisible] = useState(!secureTextEntry);
 
   const handleTextChange = useCallback((text: string) => {
-    if (__DEV__) {
-      console.log('[useInputState] Text changed:', { text, length: text.length });
-    }
     setLocalValue(text);
     onChangeText?.(text);
   }, [onChangeText]);
 
   const togglePasswordVisibility = useCallback(() => {
-    if (__DEV__) {
-      console.log('[useInputState] Password visibility toggled');
-    }
     setIsPasswordVisible((prev) => !prev);
   }, []);
 

package/src/atoms/picker/components/PickerModal.tsx

@@ -38,6 +38,12 @@ import {
   getEmptyStateTextStyles,
 } from '../styles/pickerStyles';
 
+/**
+ * PickerModalProps
+ *
+ * IMPORTANT: String props are REQUIRED for proper i18n support.
+ * Pass translated strings from your app's i18n system.
+ */
 interface PickerModalProps {
   visible: boolean;
   onClose: () => void;
@@ -50,9 +56,12 @@ interface PickerModalProps {
   onSearchChange: (query: string) => void;
   filteredOptions: PickerOption[];
   multiple?: boolean;
-  emptyMessage?: string;
-  searchPlaceholder?: string;
-  closeAccessibilityLabel?: string;
+  /** Empty state message - REQUIRED for i18n */
+  emptyMessage: string;
+  /** Search placeholder - REQUIRED for i18n */
+  searchPlaceholder: string;
+  /** Close accessibility label - REQUIRED for i18n */
+  closeAccessibilityLabel: string;
   testID?: string;
 }
 
@@ -66,9 +75,9 @@ export const PickerModal: React.FC<PickerModalProps> = React.memo(({
   searchQuery,
   onSearchChange,
   filteredOptions,
-  emptyMessage = 'No options available',
-  searchPlaceholder = 'Search...',
-  closeAccessibilityLabel = 'Close picker',
+  emptyMessage,
+  searchPlaceholder,
+  closeAccessibilityLabel,
   testID,
 }) => {
   const tokens = useAppDesignTokens();

package/src/atoms/picker/types/index.ts

@@ -18,12 +18,20 @@ export interface PickerOption {
 
 export type PickerSize = 'sm' | 'md' | 'lg';
 
+/**
+ * AtomicPickerProps
+ *
+ * IMPORTANT: String props (placeholder, emptyMessage, etc.) are REQUIRED
+ * for proper i18n support. Pass translated strings from your app's i18n system.
+ * Do NOT rely on default English values.
+ */
 export interface AtomicPickerProps {
   value: string | string[];
   onChange: (value: string | string[]) => void;
   options: PickerOption[];
   label?: string;
-  placeholder?: string;
+  /** Placeholder text - REQUIRED for i18n, pass translated string */
+  placeholder: string;
   error?: string;
   disabled?: boolean;
   multiple?: boolean;
@@ -33,9 +41,14 @@ export interface AtomicPickerProps {
   color?: IconColor;
   size?: PickerSize;
   modalTitle?: string;
-  emptyMessage?: string;
-  clearAccessibilityLabel?: string;
-  closeAccessibilityLabel?: string;
+  /** Empty state message - REQUIRED for i18n, pass translated string */
+  emptyMessage: string;
+  /** Search placeholder text - REQUIRED for i18n, pass translated string */
+  searchPlaceholder: string;
+  /** Clear button accessibility label - REQUIRED for i18n, pass translated string */
+  clearAccessibilityLabel: string;
+  /** Close button accessibility label - REQUIRED for i18n, pass translated string */
+  closeAccessibilityLabel: string;
   style?: ViewStyle | ViewStyle[];
   labelStyle?: TextStyle | TextStyle[];
   testID?: string;

package/src/device/detection/deviceDetection.ts

@@ -13,20 +13,15 @@ import { validateScreenDimensions } from '../../responsive/validation';
  * Helper function for device detection with fallback
  * @param operation - Operation to perform
  * @param fallback - Fallback value if operation fails
- * @param warningMessage - Warning message for __DEV__
  * @returns Operation result or fallback
  */
 const withDeviceDetectionFallback = <T>(
   operation: () => T,
-  fallback: T,
-  warningMessage: string
+  fallback: T
 ): T => {
   try {
     return operation();
   } catch {
-    if (__DEV__) {
-      console.warn(`[DeviceDetection] ${warningMessage}`);
-    }
     return fallback;
   }
 };
@@ -53,9 +48,6 @@ export const getScreenDimensions = () => {
     validateScreenDimensions(width, height);
     return { width, height };
   } catch {
-    if (__DEV__) {
-      console.warn('[getScreenDimensions] Invalid screen dimensions detected, using fallback values');
-    }
     // Fallback to safe default dimensions
     return { width: 414, height: 896 };
   }
@@ -71,8 +63,7 @@ export const isSmallPhone = (): boolean => {
       const { width } = getScreenDimensions();
       return width <= DEVICE_BREAKPOINTS.SMALL_PHONE;
     },
-    false,
-    'Error detecting device type, assuming standard phone'
+    false
   );
 };
 
@@ -86,8 +77,7 @@ export const isTablet = (): boolean => {
       const { width } = getScreenDimensions();
       return width >= DEVICE_BREAKPOINTS.SMALL_TABLET;
     },
-    false,
-    'Error detecting device type, assuming phone'
+    false
   );
 };
 
@@ -101,8 +91,7 @@ export const isLandscape = (): boolean => {
       const { width, height } = getScreenDimensions();
       return width > height;
     },
-    false,
-    'Error detecting orientation, assuming portrait'
+    false
   );
 };
 
@@ -125,15 +114,14 @@ export const getDeviceType = (): DeviceType => {
 
       return DeviceType.TABLET;
     },
-    DeviceType.MEDIUM_PHONE,
-    'Error detecting device type, assuming medium phone'
+    DeviceType.MEDIUM_PHONE
   );
 };
 
 /**
  * Responsive spacing multiplier
  * Returns a multiplier for spacing based on device size
- * 
+ *
  * @returns Spacing multiplier (0.9-1.2)
  */
 export const getSpacingMultiplier = (): number => {
@@ -149,7 +137,6 @@ export const getSpacingMultiplier = (): number => {
 
       return LAYOUT_CONSTANTS.SPACING_MULTIPLIER_STANDARD;
     },
-    LAYOUT_CONSTANTS.SPACING_MULTIPLIER_STANDARD,
-    'Error calculating spacing multiplier, using fallback'
+    LAYOUT_CONSTANTS.SPACING_MULTIPLIER_STANDARD
   );
 };

package/src/layouts/ScreenHeader/ScreenHeader.tsx

@@ -74,9 +74,8 @@ const ScreenHeaderBackButton: React.FC<{
   const handleBackPress = React.useCallback(() => {
     if (onBackPress) {
       onBackPress();
-    } else if (__DEV__) {
-      console.warn('ScreenHeader: onBackPress is required when back button is visible');
     }
+    // If no onBackPress provided, do nothing silently
   }, [onBackPress]);
 
   if (hideBackButton) return null;

package/src/molecules/alerts/AlertToast.tsx

@@ -48,7 +48,7 @@ export function AlertToast({ alert }: AlertToastProps) {
                 return { backgroundColor: tokens.colors.backgroundPrimary };
             case 'secondary':
                 return {
-                    backgroundColor: 'transparent',
+                    backgroundColor: undefined,
                     borderWidth: 1,
                     borderColor: tokens.colors.textInverse,
                 };

package/src/molecules/animation/presentation/hooks/useFireworks.ts

@@ -38,9 +38,7 @@ export const useFireworks = (config: FireworksConfig) => {
   } = config;
 
   if (!colors || colors.length === 0) {
-    if (__DEV__) {
-      console.warn('useFireworks: colors array is required and cannot be empty');
-    }
+    // Return no-op when colors not provided
     return { particles: [], trigger: () => { }, isActive: false };
   }
 

package/src/molecules/animation/presentation/providers/AnimationThemeProvider.tsx

@@ -50,9 +50,7 @@ export const AnimationThemeProvider: React.FC<AnimationThemeProviderProps> = ({
 export const useAnimationTheme = (): ThemeContext => {
   const context = useContext(ThemeContext);
   if (!context) {
-    if (__DEV__) {
-      console.warn('useAnimationTheme must be used within AnimationThemeProvider');
-    }
+    // Return default theme if used outside provider
     return {
       theme: DEFAULT_ANIMATION_THEME,
       setTheme: () => {},

package/src/molecules/avatar/Avatar.tsx

@@ -129,7 +129,7 @@ export const Avatar: React.FC<AvatarProps> = ({
             styles.initials,
             {
               fontSize: config.fontSize,
-              color: '#FFFFFF',
+              color: tokens.colors.textInverse,
             },
           ]}
         >
@@ -143,7 +143,7 @@ export const Avatar: React.FC<AvatarProps> = ({
       <AtomicIcon
         name={icon}
         customSize={config.iconSize}
-        customColor="#FFFFFF"
+        customColor={tokens.colors.textInverse}
       />
     );
   };

package/src/molecules/bottom-sheet/components/BottomSheetModal.tsx

@@ -1,5 +1,3 @@
-declare const __DEV__: boolean;
-
 import React, { forwardRef, useCallback, useMemo, useImperativeHandle, useRef } from 'react';
 import { StyleSheet } from 'react-native';
 import {
@@ -78,10 +76,6 @@ export const BottomSheetModal = forwardRef<BottomSheetModalRef, BottomSheetModal
 
   useImperativeHandle(ref, () => ({
     present: () => {
-      if (__DEV__) {
-        console.log('[BottomSheetModal] present() called');
-        console.log('[BottomSheetModal] modalRef.current:', modalRef.current);
-      }
       modalRef.current?.present();
     },
     dismiss: () => modalRef.current?.dismiss(),

package/src/molecules/calendar/infrastructure/storage/CalendarStore.ts

@@ -11,8 +11,8 @@
  * - Timezone-aware via CalendarService
  */
 
-import { create, type StateCreator } from 'zustand';
-import { persist, createJSONStorage, type PersistOptions } from 'zustand/middleware';
+import { create } from 'zustand';
+import { persist, createJSONStorage } from 'zustand/middleware';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import type { CalendarEvent, CreateCalendarEventRequest, UpdateCalendarEventRequest } from '../../domain/entities/CalendarEvent.entity';
 import { CalendarService } from '../services/CalendarService';

package/src/molecules/navigation/StackNavigator.tsx

@@ -22,14 +22,12 @@ export interface StackNavigatorProps<T extends ParamListBase> {
 export function StackNavigator<T extends ParamListBase>({ config }: StackNavigatorProps<T>) {
     const tokens = useAppDesignTokens();
 
-    // Validate configuration
-    if (__DEV__) {
-        try {
-            NavigationValidator.validateScreens(config.screens, "stack");
-            NavigationValidator.validateInitialRoute(config.initialRouteName, config.screens);
-        } catch (error) {
-            if (__DEV__) console.error('[StackNavigator] Configuration validation failed:', error);
-        }
+    // Validate configuration silently
+    try {
+        NavigationValidator.validateScreens(config.screens, "stack");
+        NavigationValidator.validateInitialRoute(config.initialRouteName, config.screens);
+    } catch {
+        // Silent validation failure
     }
 
     const { screens } = config;
@@ -55,7 +53,6 @@ export function StackNavigator<T extends ParamListBase>({ config }: StackNavigat
     }), [tokens]);
 
     if (screens.length === 0) {
-        if (__DEV__) console.warn('[StackNavigator] No screens found');
         return null;
     }
 

package/src/molecules/navigation/TabsNavigator.tsx

@@ -24,18 +24,15 @@ export function TabsNavigator<T extends ParamListBase>({
 }: TabsNavigatorProps<T>) {
     const tokens = useAppDesignTokens();
 
-    // Validate configuration
-    if (__DEV__) {
-        try {
-            NavigationValidator.validateScreens(config.screens, "tab");
-            NavigationValidator.validateInitialRoute(
-                config.initialRouteName,
-                config.screens
-            );
-        } catch (error) {
-            if (__DEV__)
-                console.error("[TabsNavigator] Configuration validation failed:", error);
-        }
+    // Validate configuration silently
+    try {
+        NavigationValidator.validateScreens(config.screens, "tab");
+        NavigationValidator.validateInitialRoute(
+            config.initialRouteName,
+            config.screens
+        );
+    } catch {
+        // Silent validation failure
     }
 
     // Memoize filtered screens
@@ -74,7 +71,6 @@ export function TabsNavigator<T extends ParamListBase>({
     );
 
     if (visibleScreens.length === 0) {
-        if (__DEV__) console.warn("[TabsNavigator] No visible screens found");
         return null;
     }
 

package/src/molecules/navigation/utils/AppNavigation.ts

@@ -31,8 +31,6 @@ export class AppNavigation {
     static navigate(name: string, params?: object): void {
         if (this.navigationRef?.isReady()) {
             this.navigationRef.navigate(name, params);
-        } else if (__DEV__) {
-            console.warn('[AppNavigation] Navigation ref is not ready. Call setRef() first.');
         }
     }
 

package/src/molecules/navigation/utils/LabelProcessor.ts

@@ -28,10 +28,7 @@ export class LabelProcessor {
       try {
         const processedLabel = getLabel(label);
         result = typeof processedLabel === "string" ? processedLabel : label;
-      } catch (error) {
-        if (__DEV__) {
-          console.error(`[LabelProcessor] Error processing label: ${label}`, error);
-        }
+      } catch {
         result = label;
       }
     }
@@ -45,12 +42,6 @@ export class LabelProcessor {
     }
     this.labelCache.set(cacheKey, result);
     
-    // Log cache performance in development
-    if (__DEV__ && (this.cacheHits + this.cacheMisses) % 100 === 0) {
-      const hitRate = (this.cacheHits / (this.cacheHits + this.cacheMisses)) * 100;
-      console.log(`[LabelProcessor] Cache hit rate: ${hitRate.toFixed(1)}%`);
-    }
-    
     return result;
   }
 

package/src/molecules/navigation/utils/NavigationCleanup.ts

@@ -36,10 +36,8 @@ export class NavigationCleanupManager {
       unsubscribers.forEach(unsubscribe => {
         try {
           unsubscribe();
-        } catch (error) {
-          if (__DEV__) {
-            console.warn('[NavigationCleanupManager] Error during cleanup:', error);
-          }
+        } catch {
+          // Silent cleanup error handling
         }
       });
     };
@@ -52,10 +50,8 @@ export class NavigationCleanupManager {
     return () => {
       try {
         unsubscribe();
-      } catch (error) {
-        if (__DEV__) {
-          console.warn('[NavigationCleanupManager] Error during cleanup:', error);
-        }
+      } catch {
+        // Silent cleanup error handling
       }
     };
   }

package/src/molecules/navigation/utils/NavigationValidator.ts

@@ -7,9 +7,6 @@ export class NavigationValidator {
     }
 
     if (screens.length === 0) {
-      if (__DEV__) {
-        console.warn(`[NavigationValidator] No screens provided for ${type} navigator`);
-      }
       return;
     }
 
@@ -43,11 +40,8 @@ export class NavigationValidator {
           }
         }
 
-        if (tabScreen.icon !== undefined && (typeof tabScreen.icon !== "string" || tabScreen.icon.trim() === "")) {
-          if (__DEV__) {
-            console.warn(`[NavigationValidator] Tab screen '${screen.name}' has invalid icon, it will be ignored`);
-          }
-        }
+        // Invalid icon check - silently handled
+        void (tabScreen.icon !== undefined && (typeof tabScreen.icon !== "string" || tabScreen.icon.trim() === ""));
       }
     });
   }
@@ -55,9 +49,6 @@ export class NavigationValidator {
   static validateInitialRoute(initialRouteName: string | undefined, screens: TabScreen[] | StackScreen[]): void {
     if (initialRouteName && !screens.find(screen => screen.name === initialRouteName)) {
       const error = `Initial route '${initialRouteName}' not found in screens. Available screens: ${screens.map(s => s.name).join(", ")}`;
-      if (__DEV__) {
-        console.error(`[NavigationValidator] ${error}`);
-      }
       throw new Error(error);
     }
   }

package/src/presentation/utils/variants/compound.ts

@@ -18,10 +18,6 @@ export function createAdvancedVariants<T extends Record<string, Record<string, S
   return (props: VariantProps<T> = {}): Style => {
     let result = baseVariantFn(props);
 
-    if (__DEV__) {
-      console.log('[Design System] Creating advanced variant with compound conditions');
-    }
-
     if (config.compoundVariants) {
       config.compoundVariants.forEach(compound => {
         const conditionsMet = Object.entries(compound.conditions).every(

package/src/presentation/utils/variants/core.ts

@@ -18,10 +18,6 @@ export function createVariants<T extends Record<string, Record<string, Style>>>(
   return (props: VariantProps<T> = {}): Style => {
     let result: Style = { ...config.base };
 
-    if (__DEV__) {
-      console.log('[Design System] Creating variant with props:', props);
-    }
-
     // Apply default variants
     if (config.defaultVariants) {
       Object.entries(config.defaultVariants).forEach(([variantKey, defaultValue]) => {

package/src/presentation/utils/variants/helpers.ts

@@ -14,9 +14,6 @@ export function conditionalStyle<T extends Style>(
   trueStyle: T,
   falseStyle?: T
 ): T | undefined {
-  if (__DEV__) {
-    console.log('[Design System] Conditional style applied:', condition);
-  }
   return condition ? trueStyle : falseStyle;
 }
 
@@ -25,9 +22,6 @@ export function responsiveStyle<T extends Style>(
   medium?: T,
   large?: T
 ): T {
-  if (__DEV__) {
-    console.log('[Design System] Responsive style - using small breakpoint');
-  }
   void medium;
   void large;
   return small;

package/src/safe-area/components/SafeAreaProvider.tsx

@@ -36,16 +36,6 @@ export const SafeAreaProvider: React.FC<SafeAreaProviderProps> = ({
 }) => {
   const mergedConfig = { ...DEFAULT_CONFIG, ...config };
 
-  if (__DEV__) {
-    if (config) {
-      Object.entries(config).forEach(([key, value]) => {
-        if (typeof value !== 'number' && typeof value !== 'boolean') {
-          console.warn(`SafeAreaProvider: ${key} must be a number or boolean, got ${typeof value}`);
-        }
-      });
-    }
-  }
-
   return (
     <SafeAreaConfigContext.Provider value={mergedConfig}>
       <NativeSafeAreaProvider {...nativeProps}>

package/src/safe-area/utils/validation.ts

@@ -39,33 +39,9 @@ export const validateNumericInput = (
   return isValid;
 };
 
-// Throttled console warning to prevent spam
-// Uses requestAnimationFrame for better performance
-const warningTimes = new Map<string, number>();
-const WARNING_THROTTLE = 1000; // 1 second
-
-export const throttledWarn = (message: string): void => {
-  if (!__DEV__) {
-    return;
-  }
-  
-  const now = Date.now();
-  const lastTime = warningTimes.get(message) || 0;
-  
-  if (now - lastTime > WARNING_THROTTLE) {
-    console.warn(message);
-    warningTimes.set(message, now);
-    
-    // Clean up old entries to prevent memory leaks
-    if (warningTimes.size > 50) {
-      const cutoffTime = now - WARNING_THROTTLE * 10;
-      for (const [key, time] of warningTimes.entries()) {
-        if (time < cutoffTime) {
-          warningTimes.delete(key);
-        }
-      }
-    }
-  }
+export const throttledWarn = (_message: string): void => {
+  // Silent validation - no console output in production
+  void _message;
 };
 
 // Cleanup function to clear validation cache

package/src/theme/core/CustomColors.ts

@@ -31,16 +31,13 @@ export interface CustomThemeColors {
  */
 export const validateCustomColors = (customColors: CustomThemeColors): boolean => {
   const colorValues = Object.values(customColors).filter(Boolean) as string[];
-  
+
   for (const color of colorValues) {
     if (!isValidHexColor(color)) {
-      if (__DEV__) {
-        console.warn('[validateCustomColors] Invalid hex color:', color);
-      }
       return false;
     }
   }
-  
+
   return true;
 };
 
@@ -60,9 +57,6 @@ export const applyCustomColors = (
 
   // Validate custom colors
   if (!validateCustomColors(customColors)) {
-    if (__DEV__) {
-      console.error('[applyCustomColors] Invalid custom colors provided, using defaults');
-    }
     return palette;
   }
 

package/src/theme/core/colors/ColorUtils.ts

@@ -27,16 +27,10 @@ export const isValidHexColor = (hexColor: string): boolean => {
  */
 export const withAlpha = (hexColor: string, alpha: number): string => {
   if (!isValidHexColor(hexColor)) {
-    if (__DEV__) {
-      console.warn('[withAlpha] Invalid hex color format:', hexColor);
-    }
     return hexColor;
   }
 
   if (typeof alpha !== 'number' || alpha < 0 || alpha > 1) {
-    if (__DEV__) {
-      console.warn('[withAlpha] Invalid alpha value, must be 0-1:', alpha);
-    }
     return hexColor;
   }
 

package/src/theme/infrastructure/storage/ThemeStorage.ts

@@ -28,15 +28,8 @@ export class ThemeStorage {
         return value as ThemeMode;
       }
 
-      if (__DEV__) {
-        console.warn('[ThemeStorage] Invalid theme mode value stored:', value);
-      }
       return null;
-    } catch (error) {
-      const errorMessage = error instanceof Error ? error.message : 'Unknown error';
-      if (__DEV__) {
-        console.error('[ThemeStorage] Error getting theme mode:', errorMessage);
-      }
+    } catch {
       // Return null instead of throwing to prevent app crashes
       return null;
     }
@@ -55,9 +48,6 @@ export class ThemeStorage {
       await AsyncStorage.setItem(STORAGE_KEY, mode);
     } catch (error) {
       const errorMessage = error instanceof Error ? error.message : 'Unknown error';
-      if (__DEV__) {
-        console.error('[ThemeStorage] Error saving theme mode:', errorMessage);
-      }
       // Re-throw validation errors but swallow storage errors to prevent app crashes
       if (errorMessage.includes('Invalid theme mode')) {
         throw error;
@@ -71,11 +61,7 @@ export class ThemeStorage {
   static async clearThemeMode(): Promise<void> {
     try {
       await AsyncStorage.removeItem(STORAGE_KEY);
-    } catch (error) {
-      const errorMessage = error instanceof Error ? error.message : 'Unknown error';
-      if (__DEV__) {
-        console.error('[ThemeStorage] Error clearing theme mode:', errorMessage);
-      }
+    } catch {
       // Don't throw - clearing storage is not critical
     }
   }

package/src/typography/presentation/utils/textColorUtils.ts

@@ -123,9 +123,6 @@ class MaterialColorMapper implements ColorMapper {
         return tokens.colors.textSecondary;
 
       default:
-        if (__DEV__) {
-          console.warn(`Unknown color variant: ${color}`);
-        }
         return tokens.colors.textPrimary;
     }
   }

package/src/utilities/clipboard/ClipboardUtils.ts

@@ -28,7 +28,6 @@ export class ClipboardUtils {
         try {
             await Clipboard.setStringAsync(text);
         } catch (error) {
-            console.error('[ClipboardUtils] Failed to copy to clipboard:', error);
             throw error;
         }
     }
@@ -40,7 +39,6 @@ export class ClipboardUtils {
         try {
             return await Clipboard.getStringAsync();
         } catch (error) {
-            console.error('[ClipboardUtils] Failed to get from clipboard:', error);
             throw error;
         }
     }
@@ -51,8 +49,7 @@ export class ClipboardUtils {
     static async hasContent(): Promise<boolean> {
         try {
             return await Clipboard.hasStringAsync();
-        } catch (error) {
-            console.error('[ClipboardUtils] Failed to check clipboard:', error);
+        } catch {
             return false;
         }
     }
@@ -64,7 +61,6 @@ export class ClipboardUtils {
         try {
             await Clipboard.setStringAsync('');
         } catch (error) {
-            console.error('[ClipboardUtils] Failed to clear clipboard:', error);
             throw error;
         }
     }