fix: some issues on the nwui template

fix: tsc error

fix: changeset

Author: dannyhw

.changeset/loose-hotels-pump.md

@@ -0,0 +1,6 @@
+---
+'create-expo-stack': patch
+'rn-new': patch
+---
+
+adjustments the nwui template

cli/src/templates/packages/nativewindui/drawer/app/_layout.tsx.ejs

@@ -12,7 +12,7 @@ import { StatusBar } from 'expo-status-bar';
 <% if (props.stylingPackage?.options.selectedComponents.includes('bottom-sheet')) { %>
 import { GestureHandlerRootView } from 'react-native-gesture-handler';
 <% } %>
-
+import { ComponentProps } from 'react';
 import { ThemeToggle } from '~/components/ThemeToggle';
 import { useColorScheme, useInitialAndroidBarSync } from '~/lib/useColorScheme';
 import { NAV_THEME } from '~/theme';
@@ -61,15 +61,15 @@ export default function RootLayout() {
 
 const SCREEN_OPTIONS = {
   animation: 'ios_from_right', // for android
-} as const;
+} satisfies ComponentProps<typeof Stack>['screenOptions'];
 
 const DRAWER_OPTIONS = {
   headerShown: false,
-} as const;
+} satisfies ComponentProps<typeof Stack.Screen>['options'];
 
 const MODAL_OPTIONS = {
   presentation: 'modal',
   animation: 'fade_from_bottom', // for android
   title: 'Settings',
   headerRight: () => <ThemeToggle />,
-} as const;
+} satisfies ComponentProps<typeof Stack.Screen>['options'];

cli/src/templates/packages/nativewindui/tabs/app/(tabs)/_layout.tsx.ejs

@@ -6,10 +6,7 @@ import { TabBarIcon } from '../../components/TabBarIcon';
 
 export default function TabLayout() {
   return (
-    <Tabs
-      screenOptions={{
-        tabBarActiveTintColor: 'black',
-      }}>
+    <Tabs>
       <Tabs.Screen
         name='index'
         options={{

cli/src/templates/packages/nativewindui/tabs/app/(tabs)/index.tsx.ejs

@@ -264,8 +264,8 @@ const COMPONENTS: ComponentItem[] = [
     name: 'Progress Indicator',
     component: function ProgressIndicatorExample() {
       const [progress, setProgress] = React.useState(13);
-      let id: ReturnType<typeof setInterval> | null = null;
       React.useEffect(() => {
+        let id: ReturnType<typeof setInterval> | null = null;
         if (!id) {
           id = setInterval(() => {
             setProgress((prev) => (prev >= 99 ? 0 : prev + 5));
@@ -507,7 +507,7 @@ const COMPONENTS: ComponentItem[] = [
             title='Open Bottom Sheet'
             onPress={() => bottomSheetModalRef.current?.present()}
           />
-          <Sheet ref={bottomSheetModalRef} snapPoints={[200]}>
+          <Sheet ref={bottomSheetModalRef} snapPoints={[200]} enableDynamicSizing={false}>
             <View className='flex-1 justify-center items-center pb-8'>
               <Text>@gorhom/bottom-sheet 🎉</Text>
             </View>

cli/src/templates/packages/react-navigation/navigation/tab-navigator.tsx.ejs

@@ -5,16 +5,13 @@ import One from '../screens/one';
 import Two from '../screens/two';
 
 const Tab = createBottomTabNavigator({
+  <% if (props.navigationPackage?.options.type === 'drawer + tabs') { %>
   screenOptions: function ScreenOptions() {
     return {
-      <% if (props.stylingPackage?.name !== "unistyles") { %>
-        tabBarActiveTintColor: 'black',
-      <% } %>
-      <% if (props.navigationPackage?.options.type === 'drawer + tabs') { %>
         headerShown: false,
-      <% } %>
     }
   },
+  <% } %>
   screens: {
     One: {
       screen: One,