Skip to content

Commit 6b11032

Browse files
danstepanovdanstepanov
committed
remove restyle and tamagui
1 parent 4e535c4 commit 6b11032

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+153
-1181
lines changed

‎.changeset/tricky-rocks-check.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
'create-expo-stack': minor
3+
'rn-new': minor
4+
---
5+
6+
remove restyle and tamagui

‎README.md‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ Support this project by <a href="https://github.com/sponsors/roninoss" target="_
3939

4040
## Description
4141

42-
This CLI tool is designed to help you get started with React Native and Expo as quickly as possible. The CLI options allow you to configure your project with Typescript, file-based routing with Expo Router, configuration-based navigation via React-Navigation, styling with NativeWind, Restyle, StyleSheets, or Tamagui and authentication via Supabase or Firebase.
42+
This CLI tool is designed to help you get started with React Native and Expo as quickly as possible. The CLI options allow you to configure your project with Typescript, file-based routing with Expo Router, configuration-based navigation via React-Navigation, styling with NativeWind, Unistyles, or StyleSheets and authentication via Supabase or Firebase.
4343

4444
You can also use flags such as `--noInstall`, `--noGit`, and `--default` in order to customize your project. The CLI will attempt to automatically determine your package manager of choice but you can also pass in your preferred package manager via `--npm`, `--yarn`, `--pnpm`, or `--bun`. Roadmap coming soon...
4545

@@ -72,8 +72,6 @@ Each project is generated based on the results of the CLI, on a per-file basis.
7272
| Expo System UI | System UI Library | v5 | System UI support |
7373
| Expo Web Browser | Web Browser Library | v14 | Open links in the browser |
7474
| NativeWind | UI Framework | v4.1 | Tailwind CSS for React Native |
75-
| Restyle | UI Framework | v2 | Theme-based styling library for React Native |
76-
| Tamagui | UI Framework | v1 | Universal UI with a smart optimizing compiler |
7775
| Unistyles | UI Framework | v3 | Superset of StyleSheet |
7876
| Safe Area Context | Safe Area Library | v5 | Safe area support |
7977
| React Native Web | Web Support | v0.20 | React Native for Web |

‎cli/README.md‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ Support this project by <a href="https://github.com/sponsors/roninoss" target="_
3939

4040
## Description
4141

42-
This CLI tool is designed to help you get started with React Native and Expo as quickly as possible. The CLI options allow you to configure your project with Typescript, file-based routing with Expo Router, configuration-based navigation via React-Navigation, styling with NativeWind, Restyle, StyleSheets, or Tamagui and authentication via Supabase or Firebase.
42+
This CLI tool is designed to help you get started with React Native and Expo as quickly as possible. The CLI options allow you to configure your project with Typescript, file-based routing with Expo Router, configuration-based navigation via React-Navigation, styling with NativeWind, Unistyles, or StyleSheets and authentication via Supabase or Firebase.
4343

4444
You can also use flags such as `--noInstall`, `--noGit`, and `--default` in order to customize your project. The CLI will attempt to automatically determine your package manager of choice but you can also pass in your preferred package manager via `--npm`, `--yarn`, `--pnpm`, or `--bun`. Roadmap coming soon...
4545

@@ -72,8 +72,6 @@ Each project is generated based on the results of the CLI, on a per-file basis.
7272
| Expo System UI | System UI Library | v5 | System UI support |
7373
| Expo Web Browser | Web Browser Library | v14 | Open links in the browser |
7474
| NativeWind | UI Framework | v4.1 | Tailwind CSS for React Native |
75-
| Restyle | UI Framework | v2 | Theme-based styling library for React Native |
76-
| Tamagui | UI Framework | v1 | Universal UI with a smart optimizing compiler |
7775
| Unistyles | UI Framework | v3 | Superset of StyleSheet |
7876
| Safe Area Context | Safe Area Library | v5 | Safe area support |
7977
| React Native Web | Web Support | v0.20 | React Native for Web |

‎cli/__tests__/cli-integration.test.ts‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -69,20 +69,14 @@ test(`outputs help`, async () => {
6969
// const reactNavigationCombinations = [
7070
// ['--react-navigation', '--tabs', '--stylesheet'],
7171
// ['--react-navigation', '--tabs', '--nativewind'],
72-
// ['--react-navigation', '--tabs', '--tamagui'],
73-
// ['--react-navigation', '--tabs', '--restyle'],
7472
// ['--react-navigation', '--tabs', '--unistyles'],
7573

7674
// ['--react-navigation', '--drawer+tabs', '--stylesheet'],
7775
// ['--react-navigation', '--drawer+tabs', '--nativewind'],
78-
// ['--react-navigation', '--drawer+tabs', '--tamagui'],
79-
// ['--react-navigation', '--drawer+tabs', '--restyle'],
8076
// ['--react-navigation', '--drawer+tabs', '--unistyles'],
8177

8278
// ['--react-navigation', '--stack', '--stylesheet'],
8379
// ['--react-navigation', '--stack', '--nativewind'],
84-
// ['--react-navigation', '--stack', '--tamagui'],
85-
// ['--react-navigation', '--stack', '--restyle'],
8680
// ['--react-navigation', '--stack', '--unistyles']
8781
// ] as const;
8882

‎cli/src/commands/create-expo-stack.ts‎

Lines changed: 0 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -267,13 +267,6 @@ const command: GluegunCommand = {
267267
type: options.tabs ? 'tabs' : options['drawer+tabs'] ? 'drawer + tabs' : 'stack'
268268
}
269269
});
270-
} else if (options.tamagui) {
271-
cliResults = clearStylingPackages(cliResults);
272-
// Add tamagui package
273-
cliResults.packages.push({
274-
name: 'tamagui',
275-
type: 'styling'
276-
});
277270
} else if (options.unistyles) {
278271
cliResults = clearStylingPackages(cliResults);
279272
// Add unistyles package
@@ -288,17 +281,6 @@ const command: GluegunCommand = {
288281
name: 'stylesheet',
289282
type: 'styling'
290283
});
291-
} else if (options.restyle) {
292-
try {
293-
cliResults = clearStylingPackages(cliResults);
294-
// Add stylesheet package
295-
cliResults.packages.push({
296-
name: 'restyle',
297-
type: 'styling'
298-
});
299-
} catch (error) {
300-
console.log({ error });
301-
}
302284
}
303285
// if there is no style package, add stylesheet
304286
else if (cliResults.packages.find((p) => p.type === 'styling') === undefined) {

‎cli/src/templates/base/App.tsx.ejs‎

Lines changed: 12 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,6 @@ import { StatusBar } from 'expo-status-bar';
1414
<% } else if (props.stylingPackage?.name === "nativewinui") { %>
1515
import './global.css';
1616
import 'expo-dev-client';
17-
<% } else if (props.stylingPackage?.name === "restyle") { %>
18-
import { ThemeProvider } from '@shopify/restyle';
19-
import { theme } from 'theme';
20-
<% } else if (props.stylingPackage?.name === "tamagui") { %>
21-
<% if (!props.internalizationPackage) { %>
22-
import { Text } from 'react-native';
23-
<% } %>
24-
import { TamaguiProvider } from 'tamagui';
25-
import config from './tamagui.config';
2617
<% } %>
2718
2819
<% if (props.analyticsPackage?.name === "vexo-analytics") { %>
@@ -31,46 +22,16 @@ import { StatusBar } from 'expo-status-bar';
3122
vexo(process.env.EXPO_PUBLIC_VEXO_API_KEY);
3223
<% } %>
3324
34-
<% if (props.stylingPackage?.name === "restyle") {%>
35-
export default function App() {
36-
return (
37-
<ThemeProvider theme={theme}>
38-
<ScreenContent title="Home" path="App.tsx">
39-
<% if (props.internalizationPackage?.name === "i18next") { %>
40-
<InternalizationExample />
41-
<% } %>
42-
</ScreenContent>
43-
<StatusBar style="auto" />
44-
</ThemeProvider>
45-
);
46-
}
47-
<% } else if (props.stylingPackage?.name === "tamagui") {%>
48-
export default function App() {
49-
return (
50-
<TamaguiProvider config={config}>
51-
<ScreenContent title="Home" path="App.tsx">
52-
<% if (props.internalizationPackage?.name === "i18next") { %>
53-
<InternalizationExample />
54-
<% } else { %>
55-
<Text>Open up App.tsx to start working on your app!</Text>
56-
<% } %>
57-
</ScreenContent>
58-
<StatusBar style="auto" />
59-
</TamaguiProvider>
60-
);
61-
}
62-
<% } else { %>
63-
export default function App() {
64-
return (
65-
<>
66-
<ScreenContent title="Home" path="App.tsx">
67-
<% if (props.internalizationPackage?.name === "i18next") { %>
68-
<InternalizationExample />
69-
<% } %>
70-
</ScreenContent>
71-
<StatusBar style="auto" />
72-
</>
73-
);
74-
}
75-
<% } %>
25+
export default function App() {
26+
return (
27+
<>
28+
<ScreenContent title="Home" path="App.tsx">
29+
<% if (props.internalizationPackage?.name === "i18next") { %>
30+
<InternalizationExample />
31+
<% } %>
32+
</ScreenContent>
33+
<StatusBar style="auto" />
34+
</>
35+
);
36+
}
7637

‎cli/src/templates/base/babel.config.js.ejs‎

Lines changed: 5 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,26 +2,16 @@ module.exports = function(api) {
22
api.cache(true);
33
let plugins = [];
44

5-
<% if (props.stylingPackage?.name === "tamagui") { %>
5+
<% if (props.stylingPackage?.name === "unistyles") { %>
66
plugins.push([
7-
'@tamagui/babel-plugin',
7+
'react-native-unistyles/plugin',
88
{
9-
components: ['tamagui'],
10-
config: './tamagui.config.ts',
11-
},
9+
autoProcessRoot: 'app',
10+
autoProcessImports: ['~/components']
11+
}
1212
]);
1313
<% } %>
1414
15-
<% if (props.stylingPackage?.name === "unistyles") { %>
16-
plugins.push([
17-
'react-native-unistyles/plugin',
18-
{
19-
autoProcessRoot: 'app',
20-
autoProcessImports: ['~/components']
21-
}
22-
]);
23-
<% } %>
24-
2515
plugins.push('react-native-worklets/plugin');
2616
2717
return {

‎cli/src/templates/base/package.json.ejs‎

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -63,20 +63,6 @@
6363
"zustand": "^4.5.1",
6464
<% } %>
6565
66-
<% if (props.stylingPackage?.name === "restyle") { %>
67-
"@shopify/restyle": "^2.4.2",
68-
<% } %>
69-
70-
<% if (props.stylingPackage?.name === "tamagui") { %>
71-
"@tamagui/font-inter": "^1.125.8",
72-
"@tamagui/react-native-media-driver": "^1.125.8",
73-
"@tamagui/shorthands": "^1.125.8",
74-
"@tamagui/themes": "^1.125.8",
75-
"tamagui": "^1.125.8",
76-
"@tamagui/animations-react-native": "^1.125.8",
77-
"expo-font": "~13.0.3",
78-
<% } %>
79-
8066
<% if (props.stylingPackage?.name === "unistyles") { %>
8167
"react-native-unistyles": "3.0.0-rc.4",
8268
"react-native-nitro-modules": "0.25.2",
@@ -98,10 +84,6 @@
9884
"vexo-analytics": "^1.3.15",
9985
<% } %>
10086
101-
<% if ((props.navigationPackage?.name === "react-navigation") && (props.stylingPackage?.name === "tamagui")) { %>
102-
"expo-splash-screen": "~31.0.9",
103-
<% } %>
104-
10587
<% if (props.navigationPackage?.options.type === "tabs" && props.navigationPackage?.name === "react-navigation") { %>
10688
"@react-navigation/bottom-tabs": "^7.0.5",
10789
<% } %>
@@ -163,9 +145,6 @@
163145
"tailwindcss": "^3.4.0",
164146
"prettier-plugin-tailwindcss": "^0.5.11",
165147
<% } %>
166-
<% if (props.stylingPackage?.name === "tamagui") { %>
167-
"@tamagui/babel-plugin": "^1.125.8",
168-
<% } %>
169148
"typescript": "~5.9.2"
170149
},
171150
<% if (props.navigationPackage?.name !== "expo-router") { %>

‎cli/src/templates/packages/expo-router/drawer/app/+not-found.tsx.ejs‎

Lines changed: 19 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -11,67 +11,33 @@ import { Link, Stack } from 'expo-router';
1111
<% } else if (props.stylingPackage?.name === "stylesheet") { %>
1212
import { StyleSheet, Text } from 'react-native';
1313
14-
import { Container } from '~/components/Container';
15-
<% } else if (props.stylingPackage?.name === "tamagui") { %>
16-
import { YStack } from "tamagui";
17-
import { Container, Main, Subtitle, Title } from "../tamagui.config";
18-
<% } else if (props.stylingPackage?.name === "restyle") { %>
19-
import { Box, Text, makeStyles } from 'theme';
20-
2114
import { Container } from '~/components/Container';
2215
<% } %>
2316
2417
export default function NotFoundScreen() {
25-
<% if (props.stylingPackage?.name === "restyle") { %>
26-
const styles = useStyles();
27-
<% } %>
2818
2919
return (
30-
<% if (props.stylingPackage?.name === "nativewind") {%>
31-
<>
32-
<Stack.Screen options={{ title: "Oops!" }} />
33-
<Container>
34-
<Text className={styles.title}>{"This screen doesn't exist."}</Text>
35-
<Link href="/" className={styles.link}>
36-
<Text className={styles.linkText}>Go to home screen!</Text>
37-
</Link>
38-
</Container>
39-
</>
40-
<% } else if (props.stylingPackage?.name === "tamagui") {%>
20+
<% if (props.stylingPackage?.name === "nativewind") {%>
21+
<>
22+
<Stack.Screen options={{ title: "Oops!" }} />
23+
<Container>
24+
<Text className={styles.title}>{"This screen doesn't exist."}</Text>
25+
<Link href="/" className={styles.link}>
26+
<Text className={styles.linkText}>Go to home screen!</Text>
27+
</Link>
28+
</Container>
29+
</>
30+
<% } else { %>
31+
<>
32+
<Stack.Screen options={{ title: "Oops!" }} />
4133
<Container>
42-
<Stack.Screen options={{ title: "Oops!" }} />
43-
<Main>
44-
<YStack>
45-
<Title>{"This screen doesn't exist."}</Title>
46-
<Link href="/">
47-
<Subtitle>Go to home screen!</Subtitle>
48-
</Link>
49-
</YStack>
50-
</Main>
34+
<Text style={styles.title}>{"This screen doesn't exist."}</Text>
35+
<Link href="/" style={styles.link}>
36+
<Text style={styles.linkText}>Go to home screen!</Text>
37+
</Link>
5138
</Container>
52-
<% } else if (props.stylingPackage?.name === "restyle") {%>
53-
<>
54-
<Stack.Screen options={{ title: 'Oops!' }} />
55-
<Container>
56-
<Text variant="title">{"This screen doesn't exist."}</Text>
57-
<Link href="/" style={styles.link}>
58-
<Text variant="body" color="blue">
59-
Go to home screen!
60-
</Text>
61-
</Link>
62-
</Container>
63-
</>
64-
<% } else { %>
65-
<>
66-
<Stack.Screen options={{ title: "Oops!" }} />
67-
<Container>
68-
<Text style={styles.title}>{"This screen doesn't exist."}</Text>
69-
<Link href="/" style={styles.link}>
70-
<Text style={styles.linkText}>Go to home screen!</Text>
71-
</Link>
72-
</Container>
73-
</>
74-
<% } %>
39+
</>
40+
<% } %>
7541
);
7642
}
7743
@@ -112,11 +78,4 @@ export default function NotFoundScreen() {
11278
color: '#2e78b7',
11379
},
11480
});
115-
<% } else if (props.stylingPackage?.name === "restyle") { %>
116-
const useStyles = makeStyles((theme) => ({
117-
link: {
118-
marginTop: theme.spacing.m_16,
119-
paddingVertical: theme.spacing.m_16,
120-
},
121-
}));
12281
<% } %>

0 commit comments

Comments
 (0)