create-expo-stack 2.5.0-next.738ca1b → 2.5.0-next.7acc023

package/README.md

@@ -12,14 +12,20 @@
 
 ## Sponsors
 
-NativeWind
-Restyle
-StyleSheets
-Tamagui
-
 Support this project by <a href="https://github.com/sponsors/danstepanov" target="_blank">becoming a sponsor</a>. Your logo will show up here with a link to your website.
 
-<a href="https://galaxies.dev/" target="_blank" style="margin-top: 10px;margin-right: 10px; margin-bottom: 10px;" ><img src="https://expostack.dev/galaxies-logo.svg"  style="border-radius: 50%;"></a> <a href="https://expo.dev/" target="_blank" style="margin: 10px;"><img src="https://expostack.dev/expo-logo.svg"  style="border-radius: 50%;"></a>
+<a href="https://galaxies.dev/" target="_blank" style="margin-top: 10px;margin-right: 10px; margin-bottom: 10px;" >
+  <img src="https://expostack.dev/galaxies-logo.svg"  style="border-radius: 50%;">
+</a>
+<a href="https://expo.dev/" target="_blank" style="margin: 10px;">
+  <img src="https://expostack.dev/expo-logo.svg"  style="border-radius: 50%;">
+</a>
+<a href="https://github.com/derkweijers" target="_blank" style="margin: 10px;">
+  <img src="https://avatars.githubusercontent.com/u/11644998?v=4" height="64" width="64" style="border-radius: 50%;">
+</a>
+<a href="https://paradigmpost.com" target="_blank" style="margin: 10px;">
+  <img src="https://expostack.dev/paradigmpost.png" height="64" width="64" style="border-radius: 50%;">
+</a>
 
 ## Description
 
@@ -84,153 +90,204 @@ If you'd like help with your React Native/Expo app or are just looking for a tec
 
 Thanks go to these wonderful people:
 
+<!-- readme: contributors -start -->
 <table>
-	<tbody>
-		<tr>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://onlydans.gg/">
-					<img src="https://pbs.twimg.com/profile_images/1689473757713514496/8fQrCrBx_400x400.jpg" width="100px;" alt="Dan Stepanov"/>
-					<br />
-					Dan Stepanov
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://twitter.com/ernestodotgg">
-					<img src="https://pbs.twimg.com/profile_images/1647055447931617285/RPeZJI3z_400x400.jpg" width="100px;" alt="Ernesto Resende"/>
-					<br />
-					Ernesto Resende
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/hqasmei">
-					<img src="https://avatars.githubusercontent.com/u/39573679?v=4" width="100px;" alt="Hosna Qasmei"/>
-					<br />
-					Hosna Qasmei
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/frankcalise/">
-					<img src="https://pbs.twimg.com/profile_images/1262363198839238662/uIfRNVBY_400x400.jpg" width="100px;" alt="Frank Calise"/>
-					<br />
-					Frank Calise
-				</a>
-			</td>
-		</tr>
-		<tr>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/sammoore">
-					<img src="https://avatars.githubusercontent.com/u/2035492?v=4" width="100px;" alt="Sam Moore"/>
-					<br />
-					Sam Moore
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://twitter.com/mironcatalin">
-					<img src="https://avatars.githubusercontent.com/u/2805320?v=4" width="100px;" alt="Catalin Miron"/>
-					<br />
-					Catalin Miron
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://twitter.com/PickleNik0864">
-					<img src="https://pbs.twimg.com/profile_images/1694518037385244672/eaS0RTwB_400x400.jpg" width="100px;" alt="catalinmiron"/>
-					<br />
-					PickleNik
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://twitter.com/trashh_dev">
-					<img src="https://pbs.twimg.com/profile_images/1598959528518643713/aWdwBYxv_400x400.jpg" width="100px;" alt="Chris Bautista"/>
-					<br />
-					Chris Bautista
-				</a>
-			</td>
-		</tr>
-		<tr>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://twitter.com/hugemathguy">
-					<img src="https://pbs.twimg.com/profile_images/1503470123763617796/49xDaART_400x400.jpg" width="100px;" alt="Andrew Levy"/>
-					<br />
-					Andrew Levy
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://twitter.com/alire74_">
-					<img src="https://pbs.twimg.com/profile_images/1680836863026765824/lrljy0sl_400x400.jpg" width="100px;" alt="Ali Zamani"/>
-					<br />
-					Ali Zamani
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/saimon24">
-					<img src="https://avatars.githubusercontent.com/u/2514208?v=4" width="100px;" alt="Simon Grimm"/>
-					<br />
-					Simon Grimm
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://twitter.com/mwarger">
-					<img src="https://avatars.githubusercontent.com/u/686823?v=4" width="100px;" alt="Mat Warger"/>
-					<br />
-					Mat Warger
-				</a>
-			</td>
-		</tr>
-		<tr>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/kratos-respawned">
-					<img src="https://avatars.githubusercontent.com/u/87561983?v=4" width="100px;" alt="kratos-respawned"/>
-					<br />
-					Gaurav Bhandari
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/b0iq">
-					<img src="https://avatars.githubusercontent.com/u/106549013?v=4" width="100px;" alt="b0iq"/>
-					<br />
-					b0iq
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://aodhan.netlify.app/">
-					<img src="https://pbs.twimg.com/profile_images/1472990183993888772/3X5J4d9__400x400.png" width="100px;" alt="Aodhan Hamilton"/>
-					<br />
-					Aodhan Hamilton
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/finnbayer">
-					<img src="https://avatars.githubusercontent.com/u/115630860?v=4" width="100px;" alt="finnbayer"/>
-					<br />
-					Finn Bayer
-				</a>
-			</td>
-		</tr>
-		<tr>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/todevmilen">
-					<img src="https://avatars.githubusercontent.com/u/78319110?v=4" width="100px;" alt="todevmilen"/>
-					<br />
-					Milen Todev
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/gialencar">
-					<img src="https://avatars.githubusercontent.com/u/11895696?v=4" width="100px;" alt="gialencar"/>
-					<br />
-					Gilson Alencar
-				</a>
-			</td>
-			<td align="center" valign="top" width="14.28%">
-				<a href="https://github.com/Joehoel">
-					<img src="https://avatars.githubusercontent.com/u/31251240?v=4" width="100px;" alt="joehoel"/>
-					<br />
-					Joël Kuijper
-				</a>
-			</td>
-		</tr>
-	</tbody>
+<tr>
+    <td align="center">
+        <a href="https://github.com/danstepanov">
+            <img src="https://avatars.githubusercontent.com/u/5482800?v=4" width="100;" alt="danstepanov"/>
+            <br />
+            <sub><b>Dan Stepanov</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/hqasmei">
+            <img src="https://avatars.githubusercontent.com/u/39573679?v=4" width="100;" alt="hqasmei"/>
+            <br />
+            <sub><b>Hosna Qasmei</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/sammoore">
+            <img src="https://avatars.githubusercontent.com/u/2035492?v=4" width="100;" alt="sammoore"/>
+            <br />
+            <sub><b>Sam Moore</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/ernestoresende">
+            <img src="https://avatars.githubusercontent.com/u/55156145?v=4" width="100;" alt="ernestoresende"/>
+            <br />
+            <sub><b>Ernesto Resende</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/frankcalise">
+            <img src="https://avatars.githubusercontent.com/u/374022?v=4" width="100;" alt="frankcalise"/>
+            <br />
+            <sub><b>Frank Calise</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/ludwig-pro">
+            <img src="https://avatars.githubusercontent.com/u/62896243?v=4" width="100;" alt="ludwig-pro"/>
+            <br />
+            <sub><b>Ludwig</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/PickleNik">
+            <img src="https://avatars.githubusercontent.com/u/31113245?v=4" width="100;" alt="PickleNik"/>
+            <br />
+            <sub><b>Null</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/kratos-respawned">
+            <img src="https://avatars.githubusercontent.com/u/87561983?v=4" width="100;" alt="kratos-respawned"/>
+            <br />
+            <sub><b>Gaurav Bhandari</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/finnbayer">
+            <img src="https://avatars.githubusercontent.com/u/115630860?v=4" width="100;" alt="finnbayer"/>
+            <br />
+            <sub><b>Finn Bayer</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/saimon24">
+            <img src="https://avatars.githubusercontent.com/u/2514208?v=4" width="100;" alt="saimon24"/>
+            <br />
+            <sub><b>Simon Grimm</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/todevmilen">
+            <img src="https://avatars.githubusercontent.com/u/78319110?v=4" width="100;" alt="todevmilen"/>
+            <br />
+            <sub><b>Milen Todev</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/alitnk">
+            <img src="https://avatars.githubusercontent.com/u/35243344?v=4" width="100;" alt="alitnk"/>
+            <br />
+            <sub><b>Alireza Zamani</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/dannyhw">
+            <img src="https://avatars.githubusercontent.com/u/3481514?v=4" width="100;" alt="dannyhw"/>
+            <br />
+            <sub><b>Daniel Williams</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/catalinmiron">
+            <img src="https://avatars.githubusercontent.com/u/2805320?v=4" width="100;" alt="catalinmiron"/>
+            <br />
+            <sub><b>Catalin Miron</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/b0iq">
+            <img src="https://avatars.githubusercontent.com/u/106549013?v=4" width="100;" alt="b0iq"/>
+            <br />
+            <sub><b>Null</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/coyksdev">
+            <img src="https://avatars.githubusercontent.com/u/19565694?v=4" width="100;" alt="coyksdev"/>
+            <br />
+            <sub><b>Gerald</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/andrew-levy">
+            <img src="https://avatars.githubusercontent.com/u/29075740?v=4" width="100;" alt="andrew-levy"/>
+            <br />
+            <sub><b>Andrew Levy</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/gialencar">
+            <img src="https://avatars.githubusercontent.com/u/11895696?v=4" width="100;" alt="gialencar"/>
+            <br />
+            <sub><b>Gilson Alencar</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/mwarger">
+            <img src="https://avatars.githubusercontent.com/u/686823?v=4" width="100;" alt="mwarger"/>
+            <br />
+            <sub><b>Mat Warger</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/gabimoncha">
+            <img src="https://avatars.githubusercontent.com/u/39256258?v=4" width="100;" alt="gabimoncha"/>
+            <br />
+            <sub><b>Gabimoncha</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/gwenoleR">
+            <img src="https://avatars.githubusercontent.com/u/10418241?v=4" width="100;" alt="gwenoleR"/>
+            <br />
+            <sub><b>Null</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/zamplyy">
+            <img src="https://avatars.githubusercontent.com/u/26258710?v=4" width="100;" alt="zamplyy"/>
+            <br />
+            <sub><b>Joar Karlsson</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/Joehoel">
+            <img src="https://avatars.githubusercontent.com/u/31251240?v=4" width="100;" alt="Joehoel"/>
+            <br />
+            <sub><b>Joël Kuijper</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/asapMaki">
+            <img src="https://avatars.githubusercontent.com/u/30200380?v=4" width="100;" alt="asapMaki"/>
+            <br />
+            <sub><b>Mahir Kadić</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/Hacksore">
+            <img src="https://avatars.githubusercontent.com/u/996134?v=4" width="100;" alt="Hacksore"/>
+            <br />
+            <sub><b>Sean Boult</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/bautistaaa">
+            <img src="https://avatars.githubusercontent.com/u/3660667?v=4" width="100;" alt="bautistaaa"/>
+            <br />
+            <sub><b>Null</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/debugtheworldbot">
+            <img src="https://avatars.githubusercontent.com/u/62830430?v=4" width="100;" alt="debugtheworldbot"/>
+            <br />
+            <sub><b>Pipizhu</b></sub>
+        </a>
+    </td></tr>
 </table>
+<!-- readme: contributors -end -->
 
 [downloads-image]: https://img.shields.io/npm/dm/create-expo-stack?color=364fc7&logoColor=364fc7
 [npm-url]: https://www.npmjs.com/package/create-expo-stack

package/build/templates/base/App.tsx.ejs

@@ -1,127 +1,61 @@
-<% if (props.stylingPackage?.name === "nativewind") { %>
-import './global.css';
-<% } %>
-import React from 'react';
-
-<% if (props.stylingPackage?.name === "nativewind") {%>
-  	import { Text, View } from 'react-native';
-<% } else if (props.stylingPackage?.name === "tamagui") {%>
-  	import { View } from 'react-native';
-	import { TamaguiProvider, Text, styled } from 'tamagui';
-	import config from './tamagui.config'
-<% } else if (props.stylingPackage?.name === "restyle") {%>
-  import { ThemeProvider } from '@shopify/restyle';
-  import {theme, Text} from './theme';
-<% } else if (props.stylingPackage?.name === "unistyles") {%>
-  import { createStyleSheet, useStyles } from 'react-native-unistyles'
-  import { Text, View } from 'react-native';
-<% } else {%>
-  	import { StyleSheet, Text, View } from 'react-native';
-<% } %>
+import { ScreenContent } from 'components/ScreenContent';
+import { StatusBar } from 'expo-status-bar';
 
 <% if (props.internalizationPackage?.name === "i18next") { %>
-  import { InternalizationExample } from 'components/InternalizationExample';
-
   import './translation';
+  import { InternalizationExample } from 'components/InternalizationExample';
 <% } %>
 
+<% if (props.stylingPackage?.name === "nativewind") { %>
+  import './global.css';
+<% } else if (props.stylingPackage?.name === "restyle") { %>
+  import { ThemeProvider } from '@shopify/restyle';
+  import { theme } from 'theme';
+<% } else if (props.stylingPackage?.name === "tamagui") { %>
+  import { TamaguiProvider } from 'tamagui';
+  import config from './tamagui.config';
+<% } %>
 
-import { StatusBar } from 'expo-status-bar';
-
-<% if (props.stylingPackage?.name === "nativewind") {%>
-  export default function App() {
-		return (
-			<View className={styles.container}>
-      <% if (props.internalizationPackage?.name === "i18next") { %>
-        <InternalizationExample />
-      <% } else { %>
-        <Text>Open up App.tsx to start working on your app!</Text>
-      <% } %>
-        <StatusBar style="auto" />
-      </View >
-    );
-	}
-
-	const styles = {
-		container: 'flex flex-1 items-center justify-center bg-white',
-	};
-<% } else if (props.stylingPackage?.name === "tamagui") {%>
-  	const MyView = styled(View, {
-		name: "MyView",
-		flex: 1,
-		alignItems: 'center',
-		justifyContent: 'center',
-	});
-
-	export default function App() {
-		return (
-			<TamaguiProvider config={config}>
-				<MyView>
-          <Text>Open up App.tsx to start working on your app!</Text>
+<% if (props.stylingPackage?.name === "restyle") {%>
+  export default function App() {   
+    return (
+      <ThemeProvider theme={theme}>
+        <ScreenContent title="Home" path="App.tsx">
         <% if (props.internalizationPackage?.name === "i18next") { %>
           <InternalizationExample />
         <% } %>
-					<StatusBar style="auto" />
-				</MyView>
-			</TamaguiProvider >
-    	);
-	}
-<% } else if (props.stylingPackage?.name === "restyle") {%>
-    export default function App() {   
-      return (
-        <ThemeProvider theme={theme}>
+        </ScreenContent>
+        <StatusBar style="auto" />
+      </ThemeProvider>
+    );
+  }
+<% } else if (props.stylingPackage?.name === "tamagui") {%>
+  export default function App() {
+    return (
+      <TamaguiProvider config={config}>
+        <ScreenContent title="Home" path="App.tsx">
         <% if (props.internalizationPackage?.name === "i18next") { %>
           <InternalizationExample />
         <% } else { %>
-				  <Text>Open up App.tsx to start working on your app!</Text>
+          <Text>Open up App.tsx to start working on your app!</Text>
         <% } %>
-          <StatusBar style="auto" />
-        </ThemeProvider>
-      );
-    }
-<% } else if (props.stylingPackage?.name === "unistyles") {%>
-  	export default function App() {          
-    const {styles} = useStyles(stylesheet)
-		return (
-			<View style={styles.container}>
-      <% if (props.internalizationPackage?.name === "i18next") { %>
-        <InternalizationExample />
-      <% } else { %>
-        <Text>Open up App.tsx to start working on your app!</Text>
-      <% } %>
-				<StatusBar style="auto" />
-			</View >
-    	);
-	}
-
-	const stylesheet = createStyleSheet({
-		container: {
-			flex: 1,
-			backgroundColor: '#fff',
-			alignItems: 'center',
-			justifyContent: 'center',
-		},
-	});
-<% } else {%>
-  	export default function App() {
-		return (
-			<View style={styles.container}>
+        </ScreenContent>
+        <StatusBar style="auto" />
+      </TamaguiProvider>
+    );
+  }
+<% } else { %>
+  export default function App() {
+    return (
+      <>
+        <ScreenContent title="Home" path="App.tsx">
         <% if (props.internalizationPackage?.name === "i18next") { %>
           <InternalizationExample />
-        <% } else { %>
-				  <Text>Open up App.tsx to start working on your app!</Text>
         <% } %>
-				<StatusBar style="auto" />
-			</View >
-    	);
-	}
+        </ScreenContent>
+        <StatusBar style="auto" />
+      </>
+    );
+  }
+<% } %>
 
-	const styles = StyleSheet.create({
-		container: {
-			flex: 1,
-			backgroundColor: '#fff',
-			alignItems: 'center',
-			justifyContent: 'center',
-		},
-	});
-<% } %>

package/build/templates/base/components/BackButton.tsx.ejs

@@ -0,0 +1,23 @@
+import { Feather } from '@expo/vector-icons';
+import { Text, View, StyleSheet } from 'react-native';
+
+export const BackButton = ({ onPress }: { onPress: () => void }) => {
+  return (
+    <View style={styles.backButton}>
+      <Feather name="chevron-left" size={16} color="#007AFF" />
+      <Text style={styles.backButtonText} onPress={onPress}>
+        Back
+      </Text>
+    </View>
+  );
+};
+const styles = StyleSheet.create({
+  backButton: {
+    flexDirection: 'row',
+    paddingLeft: 20,
+  },
+  backButtonText: {
+    color: '#007AFF',
+    marginLeft: 4,
+  },
+});

package/build/templates/base/components/Button.tsx.ejs

@@ -0,0 +1,40 @@
+import { forwardRef } from 'react';
+import { StyleSheet, Text, TouchableOpacity, TouchableOpacityProps } from 'react-native';
+
+type ButtonProps = {
+  onPress?: TouchableOpacityProps['onPress'];
+  title?: string;
+} & TouchableOpacityProps;
+
+export const Button = forwardRef<TouchableOpacity, ButtonProps>(({ onPress, title }, ref) => {
+  return (
+    <TouchableOpacity ref={ref} style={styles.button} onPress={onPress}>
+      <Text style={styles.buttonText}>{title}</Text>
+    </TouchableOpacity>
+  );
+});
+
+const styles = StyleSheet.create({
+  button: {
+    alignItems: 'center',
+    backgroundColor: '#6366F1',
+    borderRadius: 24,
+    elevation: 5,
+    flexDirection: 'row',
+    justifyContent: 'center',
+    padding: 16,
+    shadowColor: '#000',
+    shadowOffset: {
+      height: 2,
+      width: 0,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 3.84,
+  },
+  buttonText: {
+    color: '#FFFFFF',
+    fontSize: 16,
+    fontWeight: '600',
+    textAlign: 'center',
+  },
+});