create-expo-stack 2.1.13 → 2.1.14

package/build/templates/base/.gitignore.ejs

@@ -12,6 +12,9 @@ web-build/
 <% if (props.navigationPackage?.name === "expo-router") { %>
 expo-env.d.ts 
 <% } %>
+<% if (props.navigationPackage?.name === "tamagui") { %>
+.tamagui/
+<% } %>
 
 # macOS
 .DS_Store

package/build/templates/base/package.json.ejs

@@ -19,6 +19,7 @@
       "@tamagui/shorthands": "1.74.8",
       "@tamagui/themes": "1.74.8",
       "@tamagui/react-native-media-driver": "1.74.8",
+      "expo-font": "~11.4.0",
     <% } %>
 
     <% if (props.navigationPackage?.type === "navigation") { %>
@@ -32,7 +33,11 @@
       "@react-navigation/stack": "^6.3.17",
     <% } %>
 
-    <% if (props.navigationPackage?.options === "tabs" && props.navigationPackage?.name === "react-navigation") { %>
+    <% if ((props.navigationPackage?.name === "react-navigation") && (props.stylingPackage?.name === "tamagui")) { %>
+      "expo-splash-screen": "~0.20.5",
+    <% } %>
+
+    <% if (props.navigationPackage?.options.type === "tabs" && props.navigationPackage?.name === "react-navigation") { %>
       "@react-navigation/bottom-tabs": "^6.5.8",
     <% } %>
     

package/build/templates/packages/expo-router/stack/app/_layout.tsx.ejs

@@ -1,12 +1,19 @@
 import { Feather } from "@expo/vector-icons";
-import { Stack, useRouter } from "expo-router";
 <% if (props.stylingPackage?.name === "nativewind") { %>
+  import { Stack, useRouter } from "expo-router";
   import { Text, TouchableOpacity, View } from "react-native";
 <% } else if (props.stylingPackage?.name === "tamagui") { %>
+  import React, { useEffect } from "react";
   import { TamaguiProvider, Button } from "tamagui";
+  import { useFonts } from "expo-font";
+  import { Stack, useRouter, SplashScreen } from "expo-router";
+
   import config from '../tamagui.config'
+
+  SplashScreen.preventAutoHideAsync();
 <% } else { %>
   import { StyleSheet, Text, TouchableOpacity, View } from "react-native";
+  import { Stack, useRouter } from "expo-router";
 <% } %>
 
 export default function Layout() {
@@ -21,6 +28,19 @@ export default function Layout() {
       </TouchableOpacity>
     );
   <% } else if (props.stylingPackage?.name === "tamagui") { %>
+    const [loaded] = useFonts({
+      Inter: require("@tamagui/font-inter/otf/Inter-Medium.otf"),
+      InterBold: require("@tamagui/font-inter/otf/Inter-Bold.otf")
+    });
+
+    useEffect(() => {
+      if (loaded) {
+        SplashScreen.hideAsync();
+      }
+    }, [loaded]);
+
+    if (!loaded) return null;
+
     const BackButton = () => (
       <Button onPress={router.back} icon={<Feather name="chevron-left" size={16} color="#007AFF" />}>Back</Button>
     )

package/build/templates/packages/expo-router/stack/app/details.tsx.ejs

@@ -21,7 +21,7 @@ export default function Details() {
   <% } else if (props.stylingPackage?.name === "tamagui") { %>
     return (
       <YStack flex={1} padding="$2">
-        <YStack flex={1} maxWidth={960}>
+        <YStack flex={1} maxWidth="100%">
           <H2>Details</H2>
           <Paragraph theme="alt1">Showing details for user {name}.</Paragraph>
         </YStack>

package/build/templates/packages/expo-router/stack/app/index.tsx.ejs

@@ -27,7 +27,7 @@ export default function Page() {
   <% } else if (props.stylingPackage?.name === "tamagui") { %>
     return (
       <YStack flex={1} padding="$3">
-        <YStack flex={1} maxWidth="{960}" justifyContent="space-between">
+        <YStack flex={1} maxWidth="100%" justifyContent="space-between">
           <YStack>
             <H2>Hello World</H2>
             <Paragraph>This is the first page of your app.</Paragraph>

package/build/templates/packages/expo-router/tabs/app/_layout.tsx.ejs

@@ -1,7 +1,15 @@
 import { Stack } from "expo-router";
 <% if (props.stylingPackage?.name === "tamagui") { %>
-import { TamaguiProvider } from 'tamagui'
-import config from './tamagui.config'
+  import React, { useEffect } from "react";
+  import { TamaguiProvider } from 'tamagui'
+  import { SplashScreen, Stack } from "expo-router";
+  import { useFonts } from "expo-font";
+
+  import config from '../tamagui.config'
+
+  SplashScreen.preventAutoHideAsync();
+<% } else { %>
+  import { Stack } from "expo-router";
 <% } %>
 
 export const unstable_settings = {
@@ -10,6 +18,21 @@ export const unstable_settings = {
 };
 
 export default function RootLayout() {
+  <% if (props.stylingPackage?.name === "tamagui") { %>
+    const [loaded] = useFonts({
+      Inter: require("@tamagui/font-inter/otf/Inter-Medium.otf"),
+      InterBold: require("@tamagui/font-inter/otf/Inter-Bold.otf")
+    });
+
+    useEffect(() => {
+      if (loaded) {
+        SplashScreen.hideAsync();
+      }
+    }, [loaded]);
+
+    if (!loaded) return null;
+  <% } %>
+
   return (
     <% if (props.stylingPackage?.name === "tamagui") { %>
     <TamaguiProvider config={config}>

package/build/templates/packages/nativewind/tailwind.config.js.ejs

@@ -2,7 +2,7 @@
 module.exports = {
     <% if (props.navigationPackage?.name === "react-navigation") { %>
       content: ["./App.{js,ts,tsx}", "./src/**/*.{js,ts,tsx}"],
-    <% } else if (props.navigationPackage?.name === "expo-router" && props.navigationPackage?.options === 'tabs') { %>
+    <% } else if (props.navigationPackage?.name === "expo-router" && props.navigationPackage?.options.type === 'tabs') { %>
       content: ["./index.{js,ts,tsx}", "./app/**/*.{js,ts,tsx}", "./components/**/*.{js,ts,tsx}"],
     <% } else if (props.navigationPackage?.name === "expo-router") { %>
       content: ["./index.{js,ts,tsx}", "./app/**/*.{js,ts,tsx}"],

package/build/templates/packages/react-navigation/App.tsx.ejs

@@ -1,17 +1,39 @@
 import "react-native-gesture-handler";
-import RootStack from "./src/navigation";
 <% if (props.stylingPackage?.name === "tamagui") { %>
-import { TamaguiProvider } from 'tamagui'
+import React, { useEffect } from "react";
+import { TamaguiProvider } from 'tamagui';
+import * as SplashScreen from 'expo-splash-screen';
+import { useFonts } from 'expo-font';
+
 import config from './tamagui.config'
+
+SplashScreen.preventAutoHideAsync();
 <% } %>
+import RootStack from "./src/navigation";
+
 export default function App() {
-  return (
-    <% if (props.stylingPackage?.name === "tamagui") { %>
-    <TamaguiProvider config={config}>
-    <% } %>
-      <RootStack />
-    <% if (props.stylingPackage?.name === "tamagui") { %>
-    </TamaguiProvider>
-    <% } %>
-  );
+  <% if (props.stylingPackage?.name === "tamagui") { %>
+    const [loaded] = useFonts({
+      Inter: require("@tamagui/font-inter/otf/Inter-Medium.otf"),
+      InterBold: require("@tamagui/font-inter/otf/Inter-Bold.otf"),
+    });
+
+    useEffect(() => {
+      if (loaded) {
+        SplashScreen.hideAsync();
+      }
+    }, [loaded])
+
+    if (!loaded) {
+      return null;
+    }
+
+    return (
+      <TamaguiProvider config={config}>
+        <RootStack />
+      </TamaguiProvider>
+    );
+  <% } else { %>
+    return <RootStack />;
+  <% } %>
 }

package/build/templates/packages/react-navigation/screens/details.tsx.ejs

@@ -24,7 +24,7 @@ export default function Details() {
   <% } else if (props.stylingPackage?.name === "tamagui") { %>
     return (
       <YStack flex={1} paddingTop="$2">
-        <YStack flex={1} maxWidth={960}>
+        <YStack flex={1} maxWidth="100%">
           <H2>Details</H2>
           <Paragraph>Showing details for user {router.params.name}.</Paragraph>
         </YStack>

package/build/templates/packages/react-navigation/screens/overview.tsx.ejs

@@ -30,7 +30,7 @@ export default function Overview() {
   <% } else if (props.stylingPackage?.name === "tamagui") { %>
     return (
       <YStack flex={1} padding="$3">
-        <YStack flex={1} maxWidth="{960}" justifyContent="space-between">
+        <YStack flex={1} maxWidth="100%" justifyContent="space-between">
           <YStack>
             <H2>Hello World</H2>
             <Paragraph>This is the first page of your app.</Paragraph>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-expo-stack",
-  "version": "2.1.13",
+  "version": "2.1.14",
   "description": "create-expo-stack CLI",
   "private": false,
   "types": "build/types/types.d.ts",