[WIP] Fix rendering issues on iOS

examples/kitchen-sink/package.json

@@ -32,28 +32,28 @@
     ]
   },
   "dependencies": {
-    "expo": "^52.0.16",
-    "expo-constants": "~17.0.2",
-    "expo-linking": "~7.0.2",
-    "expo-router": "^4.0.2",
-    "expo-splash-screen": "~0.29.7",
+    "expo": "^53.0.0-canary-20250408-7f0ab53",
+    "expo-constants": "~17.1.3",
+    "expo-linking": "~7.1.3",
+    "expo-router": "5.0.2-preview.6",
+    "expo-splash-screen": "~0.30.6",
+    "expo-status-bar": "~2.2.2",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
+    "react-native": "0.79.1",
+    "react-native-gesture-handler": "2.24.0",
     "react-native-magic-modal": "workspace:*",
-    "expo-status-bar": "~2.0.0",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
-    "react-native": "0.76.5",
-    "react-native-gesture-handler": "2.20.2",
-    "react-native-reanimated": "~3.16.5",
-    "react-native-safe-area-context": "4.12.0",
-    "react-native-screens": "~4.1.0",
-    "react-native-web": "~0.19.13"
+    "react-native-reanimated": "~3.17.5",
+    "react-native-safe-area-context": "5.3.0",
+    "react-native-screens": "~4.10.0",
+    "react-native-web": "~0.20.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.20.0",
+    "@babel/core": "^7.26.10",
     "@magic/eslint-config": "workspace:*",
     "@magic/prettier-config": "workspace:*",
     "@magic/tsconfig": "workspace:*",
-    "expo-doctor": "1.12.4"
+    "expo-doctor": "1.13.0"
   },
   "prettier": "@magic/prettier-config"
 }

package.json

@@ -27,7 +27,7 @@
     "format": "turbo format",
     "format:fix": "turbo format:fix",
     "typecheck": "turbo typecheck",
-    "start": "turbo start",
+    "start": "pnpm --filter @magic/kitchen-sink start",
     "test": "turbo test",
     "build": "turbo build",
     "release": "turbo release",
@@ -40,6 +40,6 @@
     }
   },
   "devDependencies": {
-    "turbo": "^2.3.3"
+    "turbo": "^2.5.2"
   }
 }

packages/modal/package.json

@@ -74,28 +74,28 @@
     "react-native-reanimated": "*"
   },
   "devDependencies": {
-    "@types/react": "~18.3.12",
     "@magic/eslint-config": "workspace:*",
     "@magic/prettier-config": "workspace:*",
     "@magic/tsconfig": "workspace:*",
-    "@release-it/conventional-changelog": "^9.0.3",
-    "@testing-library/react-native": "^12.9.0",
+    "@release-it/conventional-changelog": "^10.0.1",
+    "@testing-library/react-native": "^13.2.0",
     "@types/jest": "^29.5.14",
-    "bunchee": "^6.0.3",
-    "react-native": "0.76.5",
+    "@types/react": "~19.0.14",
+    "bunchee": "^6.5.1",
     "cz-conventional-changelog": "^3.3.0",
     "husky": "^9.1.7",
     "jest": "^29.7.0",
-    "jest-expo": "^52.0.2",
+    "jest-expo": "^53.0.0",
     "jest-junit": "^16.0.0",
-    "pod-install": "^0.3.2",
-    "prettier": "3.4.2",
-    "react-test-renderer": "^18.2.0",
-    "release-it": "^17.10.0",
-    "shx": "^0.3.4",
-    "ts-jest": "^29.2.5",
+    "pod-install": "^0.3.7",
+    "prettier": "3.5.3",
+    "react-native": "0.79.1",
+    "react-test-renderer": "^19.1.0",
+    "release-it": "^19.0.1",
+    "shx": "^0.4.0",
+    "ts-jest": "^29.3.2",
     "ts-node-dev": "^2.0.0",
-    "typedoc": "^0.27.5",
-    "typescript": "^5.7.2"
+    "typedoc": "^0.28.3",
+    "typescript": "^5.8.3"
   }
 }

packages/modal/src/components/MagicModalPortal/MagicModalPortal.tsx

@@ -188,10 +188,12 @@ export const MagicModalPortal: React.FC = memo(() => {
     });
   }, [modals]);
 
-  const Overlay =
-    fullWindowOverlayEnabled && Platform.OS === "ios"
-      ? FullWindowOverlay
-      : React.Fragment;
+  const shouldRenderFullWindowOverlay =
+    fullWindowOverlayEnabled && Platform.OS === "ios" && modals.length > 0;
+
+  const Overlay = shouldRenderFullWindowOverlay
+    ? FullWindowOverlay
+    : React.Fragment;
 
   /* This needs to always be rendered, if we make it conditionally render based on ModalContent too,
      the modal will have zIndex issues on react-navigation modals. */