@umituz/react-native-design-system 4.28.20 → 4.28.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-design-system",
-  "version": "4.28.20",
+  "version": "4.28.22",
   "description": "Universal design system for React Native apps with safe navigation hooks - updated SKILL.md with navigation documentation",
   "main": "./src/index.ts",
   "types": "./dist/index.d.ts",

package/src/atoms/AtomicFab.tsx

@@ -62,11 +62,12 @@ export const AtomicFab: React.FC<AtomicFabProps> = ({
   const iconSize = useMemo(() => getFabIconSize(size as 'sm' | 'md' | 'lg') * tokens.spacingMultiplier, [size, tokens.spacingMultiplier]);
 
   const fabStyle = useMemo(() => {
-    const baseSizeConfig = FAB_SIZES[size as 'sm' | 'md' | 'lg'];
+    const baseSize = FAB_SIZES[size as 'sm' | 'md' | 'lg'];
+    const borderRadius = size === 'sm' ? 12 : size === 'md' ? 16 : 20;
     const sizeConfig = {
-      width: baseSizeConfig.width * tokens.spacingMultiplier,
-      height: baseSizeConfig.height * tokens.spacingMultiplier,
-      borderRadius: baseSizeConfig.borderRadius * tokens.spacingMultiplier,
+      width: baseSize * tokens.spacingMultiplier,
+      height: baseSize * tokens.spacingMultiplier,
+      borderRadius: borderRadius * tokens.spacingMultiplier,
     };
 
     return StyleSheet.flatten([

package/src/atoms/fab/styles/fabStyles.ts

@@ -10,6 +10,9 @@ import type { FabSizeConfig, FabVariantConfig } from '../types';
 import { FAB_SIZES as BASE_FAB_SIZES } from '../../../constants';
 import { calculateResponsiveSize } from '../../../responsive';
 
+// Re-export FAB_SIZES for convenience
+export const FAB_SIZES = BASE_FAB_SIZES;
+
 /**
  * Get responsive FAB sizes based on spacing multiplier
  * @param spacingMultiplier - Spacing multiplier from design tokens

package/src/safe-area/hooks/useSafeAreaInsets.ts

@@ -1,9 +1,34 @@
 /**
  * useSafeAreaInsets Hook
- * Get safe area insets
+ * Get safe area insets with fallback for race conditions
+ *
+ * This wrapper catches the case where the hook is called before
+ * SafeAreaProvider is fully initialized, returning safe default values
+ * instead of throwing an error.
  */
 
 import { useSafeAreaInsets as useNativeSafeAreaInsets } from 'react-native-safe-area-context';
+import type { EdgeInsets } from 'react-native-safe-area-context';
 
-export const useSafeAreaInsets = useNativeSafeAreaInsets;
+const DEFAULT_INSETS: EdgeInsets = {
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+};
+
+export const useSafeAreaInsets = (): EdgeInsets => {
+  try {
+    return useNativeSafeAreaInsets();
+  } catch (error) {
+    // Log in development only to help debugging
+    if (__DEV__) {
+      console.warn(
+        '[useSafeAreaInsets] SafeAreaProvider not available yet. Using default values (all zeros). ' +
+        'This is likely due to a timing issue during initialization and should resolve quickly.'
+      );
+    }
+    return DEFAULT_INSETS;
+  }
+};