create-expo-stack 2.7.0-next.2960d96 → 2.7.0-next.3029b3a
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -26,7 +26,9 @@
|
|
|
26
26
|
"clsx": "^2.1.0",
|
|
27
27
|
"expo-dev-client": "~3.3.8",
|
|
28
28
|
"tailwind-merge": "^2.2.1",
|
|
29
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('actionable-text')) { %>
|
|
29
30
|
"react-native-uitextview": "^1.1.4",
|
|
31
|
+
<% } %>
|
|
30
32
|
"react-native-pager-view": "6.2.3",
|
|
31
33
|
<% if (props.stylingPackage?.options.selectedComponents.includes('date-picker')) { %>
|
|
32
34
|
"@react-native-community/datetimepicker": "7.6.1",
|
|
@@ -2,6 +2,12 @@ import '~/global.css';
|
|
|
2
2
|
import 'expo-dev-client';
|
|
3
3
|
import { ThemeProvider as NavThemeProvider } from '@react-navigation/native';
|
|
4
4
|
import { Icon } from '@roninoss/icons';
|
|
5
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('action-sheet')) { %>
|
|
6
|
+
import { ActionSheetProvider } from '@expo/react-native-action-sheet';
|
|
7
|
+
<% } %>
|
|
8
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('bottom-sheet')) { %>
|
|
9
|
+
import { BottomSheetModalProvider } from '@gorhom/bottom-sheet';
|
|
10
|
+
<% } %>
|
|
5
11
|
import { Link, Stack } from 'expo-router';
|
|
6
12
|
import { StatusBar } from 'expo-status-bar';
|
|
7
13
|
import { Pressable, View } from 'react-native';
|
|
@@ -27,15 +33,24 @@ export default function RootLayout() {
|
|
|
27
33
|
style={isDarkColorScheme ? 'light' : 'dark'}
|
|
28
34
|
/>
|
|
29
35
|
<GestureHandlerRootView style={{ flex: 1 }}>
|
|
36
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('bottom-sheet')) { %>
|
|
37
|
+
<BottomSheetModalProvider>
|
|
38
|
+
<% } %>
|
|
39
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('action-sheet')) { %>
|
|
40
|
+
<ActionSheetProvider>
|
|
41
|
+
<% } %>
|
|
30
42
|
<NavThemeProvider value={NAV_THEME[colorScheme]}>
|
|
31
43
|
<Stack screenOptions={SCREEN_OPTIONS}>
|
|
32
44
|
<Stack.Screen name="index" options={INDEX_OPTIONS} />
|
|
33
|
-
<Stack.Screen name="top-tabs" options={TOP_TABS_OPTIONS} />
|
|
34
|
-
<Stack.Screen name="drawer" options={DEFAULT_OPTIONS} />
|
|
35
|
-
<Stack.Screen name="bottom-tabs" options={DEFAULT_OPTIONS} />
|
|
36
45
|
<Stack.Screen name="modal" options={MODAL_OPTIONS} />
|
|
37
46
|
</Stack>
|
|
38
47
|
</NavThemeProvider>
|
|
48
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('action-sheet')) { %>
|
|
49
|
+
</ActionSheetProvider>
|
|
50
|
+
<% } %>
|
|
51
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('bottom-sheet')) { %>
|
|
52
|
+
</BottomSheetModalProvider>
|
|
53
|
+
<% } %>
|
|
39
54
|
</GestureHandlerRootView>
|
|
40
55
|
</>
|
|
41
56
|
);
|
|
@@ -79,7 +94,3 @@ const MODAL_OPTIONS = {
|
|
|
79
94
|
title: 'Settings',
|
|
80
95
|
headerRight: () => <ThemeToggle />,
|
|
81
96
|
} as const;
|
|
82
|
-
|
|
83
|
-
const DEFAULT_OPTIONS = {
|
|
84
|
-
headerShown: false,
|
|
85
|
-
};
|
|
@@ -1,11 +1,19 @@
|
|
|
1
1
|
import { VariantProps, cva } from 'class-variance-authority';
|
|
2
2
|
import { cssInterop } from 'nativewind';
|
|
3
3
|
import * as React from 'react';
|
|
4
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('actionable-text')) { %>
|
|
4
5
|
import { UITextView } from 'react-native-uitextview';
|
|
6
|
+
<% } else { %>
|
|
7
|
+
import { Text as RNText } from 'react-native';
|
|
8
|
+
<% } %>
|
|
5
9
|
|
|
6
10
|
import { cn } from '~/lib/cn';
|
|
7
11
|
|
|
12
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('actionable-text')) { %>
|
|
8
13
|
cssInterop(UITextView, { className: 'style' });
|
|
14
|
+
<% } else { %>
|
|
15
|
+
cssInterop(RNText, { className: 'style' });
|
|
16
|
+
<% } %>
|
|
9
17
|
|
|
10
18
|
const textVariants = cva('text-foreground', {
|
|
11
19
|
variants: {
|
|
@@ -37,6 +45,7 @@ const textVariants = cva('text-foreground', {
|
|
|
37
45
|
|
|
38
46
|
const TextClassContext = React.createContext<string | undefined>(undefined);
|
|
39
47
|
|
|
48
|
+
<% if (props.stylingPackage?.options.selectedComponents.includes('actionable-text')) { %>
|
|
40
49
|
function Text({
|
|
41
50
|
className,
|
|
42
51
|
variant,
|
|
@@ -51,5 +60,22 @@ function Text({
|
|
|
51
60
|
/>
|
|
52
61
|
);
|
|
53
62
|
}
|
|
63
|
+
<% } else { %>
|
|
64
|
+
function Text({
|
|
65
|
+
className,
|
|
66
|
+
variant,
|
|
67
|
+
color,
|
|
68
|
+
...props
|
|
69
|
+
}: React.ComponentPropsWithoutRef<typeof RNText> & VariantProps<typeof textVariants>) {
|
|
70
|
+
const textClassName = React.useContext(TextClassContext);
|
|
71
|
+
return (
|
|
72
|
+
<RNText
|
|
73
|
+
className={cn(textVariants({ variant, color }), textClassName, className)}
|
|
74
|
+
{...props}
|
|
75
|
+
/>
|
|
76
|
+
);
|
|
77
|
+
}
|
|
78
|
+
<% } %>
|
|
79
|
+
|
|
54
80
|
|
|
55
81
|
export { Text, TextClassContext, textVariants };
|