chore: move expo app to new expo architecture

examples/react-native/native-form-signals/.gitignore

@@ -7,6 +7,7 @@ node_modules/
 .expo/
 dist/
 web-build/
+expo-env.d.ts
 
 # Native
 *.orig.*
@@ -33,3 +34,5 @@ yarn-error.*
 
 # typescript
 *.tsbuildinfo
+
+app-example

examples/react-native/native-form-signals/app.json

@@ -1,27 +1,41 @@
 {
   "expo": {
-    "name": "native-form-signals",
-    "slug": "native-form-signals",
+    "name": "simple-form-signals",
+    "slug": "simple-form-signals",
     "version": "1.0.0",
     "orientation": "portrait",
-    "icon": "./assets/icon.png",
-    "userInterfaceStyle": "light",
-    "splash": {
-      "image": "./assets/splash.png",
-      "resizeMode": "contain",
-      "backgroundColor": "#ffffff"
-    },
+    "icon": "./assets/images/icon.png",
+    "scheme": "myapp",
+    "userInterfaceStyle": "automatic",
+    "newArchEnabled": true,
     "ios": {
       "supportsTablet": true
     },
     "android": {
       "adaptiveIcon": {
-        "foregroundImage": "./assets/adaptive-icon.png",
+        "foregroundImage": "./assets/images/adaptive-icon.png",
         "backgroundColor": "#ffffff"
       }
     },
     "web": {
-      "favicon": "./assets/favicon.png"
+      "bundler": "metro",
+      "output": "static",
+      "favicon": "./assets/images/favicon.png"
+    },
+    "plugins": [
+      "expo-router",
+      [
+        "expo-splash-screen",
+        {
+          "image": "./assets/images/splash-icon.png",
+          "imageWidth": 200,
+          "resizeMode": "contain",
+          "backgroundColor": "#ffffff"
+        }
+      ]
+    ],
+    "experiments": {
+      "typedRoutes": true
     }
   }
 }

examples/react-native/native-form-signals/app/_layout.tsx

@@ -0,0 +1,5 @@
+import { Stack } from "expo-router";
+
+export default function RootLayout() {
+  return <Stack />;
+}

examples/react-native/native-form-signals/app/index.tsx

@@ -0,0 +1,16 @@
+import { Text, View } from "react-native";
+import {UserForm} from "@/components/UserForm";
+
+export default function Index() {
+  return (
+    <View
+      style={{
+        flex: 1,
+        paddingHorizontal: 16,
+        paddingVertical: 16,
+      }}
+    >
+      <UserForm />
+    </View>
+  );
+}

examples/react-native/native-form-signals/babel.config.js

@@ -1,5 +1,5 @@
-module.exports = (api) => {
-  api.cache(true)
+module.exports = api => {
+  api.cache(true);
   return {
     presets: ['babel-preset-expo'],
     plugins: [
@@ -10,5 +10,5 @@ module.exports = (api) => {
         },
       ],
     ],
-  }
-}
+  };
+};

examples/react-native/native-form-signals/src/UserForm.tsx → examples/react-native/native-form-signals/components/UserForm.tsx

@@ -52,7 +52,7 @@ export function UserForm() {
         <FormInput secureTextEntry />
       </form.FieldProvider>
 
-      <Button title="Submit" onPress={() => form.handleSubmit()} />
+      <Button title="Submit" onPress={() => form.handleSubmit()} disabled={!form.canSubmit.value} />
     </form.FormProvider>
   )
 }