@umituz/react-native-design-system 4.27.17 → 4.27.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-design-system",
-  "version": "4.27.17",
+  "version": "4.27.18",
   "description": "Universal design system for React Native apps - Consolidated package with atoms, molecules, organisms, theme, typography, responsive, safe area, exception, infinite scroll, UUID, image, timezone, offline, onboarding, and loading utilities - TanStack persistence and expo-image-manipulator now lazy loaded",
   "main": "./src/index.ts",
   "types": "./dist/index.d.ts",

package/src/atoms/image/AtomicImage.tsx

@@ -1,7 +1,8 @@
 import React from 'react';
-import { Image as RNImage, type StyleProp, type ImageStyle } from 'react-native';
+import { Image as RNImage, type StyleProp, type ImageStyle, ImageSourcePropType } from 'react-native';
 
 // Lazy-load expo-image (optional peer dep) — falls back to React Native Image
+// biome-ignore lint/suspicious/noExplicitAny: ExpoImage type is dynamic from optional peer dependency
 let ExpoImage: React.ComponentType<any> | null = null;
 try {
   // eslint-disable-next-line @typescript-eslint/no-require-imports
@@ -10,13 +11,18 @@ try {
   // expo-image not installed — using React Native Image fallback
 }
 
+/**
+ * Image source type compatible with both React Native and expo-image
+ * Supports: require() assets, URI strings, and image source objects
+ */
+export type ImageSource = ImageSourcePropType;
+
 export type AtomicImageProps = {
-  source?: any;
+  source?: ImageSource;
   style?: StyleProp<ImageStyle>;
   rounded?: boolean;
   contentFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
   cachePolicy?: 'none' | 'disk' | 'memory' | 'memory-disk';
-  [key: string]: any;
 };
 
 const RESIZE_MODE_MAP: Record<string, 'cover' | 'contain' | 'stretch' | 'center'> = {

package/src/infinite-scroll/presentation/components/infinite-scroll-list.tsx

@@ -93,11 +93,17 @@ function InfiniteScrollListComponent<T>({
     return emptyComponent || <Empty />;
   }
 
+  // Memoize renderItem wrapper to prevent unnecessary re-renders
+  const memoizedRenderItem = useCallback(
+    ({ item, index }: { item: T; index: number }) => renderItem(item, index),
+    [renderItem]
+  );
+
   // Render list
   return (
     <FlatList
       data={items}
-      renderItem={({ item, index }) => renderItem(item, index)}
+      renderItem={memoizedRenderItem}
       keyExtractor={(item, index) => getItemKey(item, index)}
       onEndReached={handleEndReached}
       onEndReachedThreshold={calculateEndReachedThreshold(config.threshold)}

package/src/molecules/filter-group/FilterGroup.tsx

@@ -32,16 +32,18 @@ export const FilterGroup = React.memo(function FilterGroup<T = string>({
   // Memoize selected items to prevent unnecessary re-renders
   const selectedSet = useMemo(() => {
     if (multiSelect && Array.isArray(selectedValue)) {
-      return new Set(selectedValue);
+      return new Set<T>(selectedValue);
     }
-    return new Set(selectedValue !== undefined ? [selectedValue] : []);
+    // Single selection: wrap in array if present
+    const singleValue = selectedValue !== undefined ? [selectedValue] : [];
+    return new Set<T>(singleValue as T[]);
   }, [selectedValue, multiSelect]);
 
   // Memoize isSelected calculation for each item
-  const isSelected = useCallback((value: any) => selectedSet.has(value), [selectedSet]);
+  const isSelected = useCallback((value: T) => selectedSet.has(value), [selectedSet]);
 
   // Memoized chip renderer
-  const renderChip = useCallback((item: any) => (
+  const renderChip = useCallback((item: { value: T; label: string; testID?: string }) => (
     <AtomicChip
       key={String(item.value)}
       variant={isSelected(item.value) ? 'filled' : 'outlined'}

package/src/molecules/navigation/types.ts

@@ -30,9 +30,9 @@ export interface BaseScreen<T extends ParamListBase = ParamListBase> {
   /** Unique name identifier for the screen */
   name: Extract<keyof T, string>;
   /** React component to render for this screen */
-  component?: React.ComponentType<any>;
+  component?: React.ComponentType<{ navigation: unknown; route: unknown }>;
   /** Render function for children (alternative to component) */
-  children?: (props: any) => React.ReactNode;
+  children?: (props: { navigation: unknown; route: unknown }) => React.ReactNode;
 }
 
 /**

package/src/onboarding/presentation/components/OnboardingBackground.tsx

@@ -55,13 +55,18 @@ const BackgroundContent: React.FC<BackgroundContentProps> = ({
   }
 
   if (slide.backgroundImage) {
+    // Normalize ImageSourceType to ImageSourcePropType
+    // ImageSourceType supports string URIs, but ImageSourcePropType requires { uri: string } objects
+    const normalizedSource = typeof slide.backgroundImage === 'string'
+      ? { uri: slide.backgroundImage }
+      : slide.backgroundImage;
+
     return (
       <AtomicImage
-        source={slide.backgroundImage}
+        source={normalizedSource}
         style={StyleSheet.absoluteFill}
         contentFit="cover"
         cachePolicy="memory-disk"
-        priority="high"
       />
     );
   }