chore: update nativewind@4.0.16

post-install hook compiles css:
```
"eas-build-post-install": "tailwindcss -i ./global.css -o ./node_modules/.cache/nativewind/global.css.native.css"
```

apps/mobile/app.json

@@ -2,6 +2,7 @@
   "expo": {
     "name": "expo-monorepo",
     "slug": "expo-monorepo",
+    "scheme": "expo-monorepo",
     "version": "1.0.0",
     "orientation": "portrait",
     "icon": "./assets/icon.png",

apps/mobile/app/(tabs)/_layout.tsx

@@ -1,6 +1,6 @@
 import FontAwesome from '@expo/vector-icons/FontAwesome';
 import { Link, Tabs } from 'expo-router';
-import { Pressable } from 'react-native';
+import { Pressable, useColorScheme } from 'react-native';
 
 // import Colors from "@/constants/Colors";
 
@@ -15,7 +15,7 @@ function TabBarIcon(props: {
 }
 
 export default function TabLayout() {
-  //const colorScheme = useColorScheme();
+  const colorScheme = useColorScheme();
 
   return (
     <Tabs

apps/mobile/app/(tabs)/index.tsx

@@ -1,20 +1,18 @@
 import { vars } from 'nativewind';
-import { Text, View } from 'react-native';
+import { Pressable, Text, View } from 'react-native';
 
 const theme = vars({
-  '--theme-fg': 'blue',
+  '--theme-fg': 'red',
 });
 
 const App = () => {
   return (
     <View className="flex-1 items-center justify-center" style={theme}>
-      <Text className="text-[16px] font-bold text-[--theme-fg] transition duration-[2s]">
-        Variables
-      </Text>
-      <Text className="text-base font-bold active:scale-150 active:text-[--theme-fg] transition duration-[500ms]">
+      <Text className="font-bold text-[--theme-fg]">Variables!</Text>
+      <Text className="font-bold active:scale-150 active:text-[--theme-fg] transition duration-[500ms]">
         Transitions
       </Text>
-      <Text className="text-[14px] font-bold animate-none active:animate-bounce">Animations</Text>
+      <Text className="font-bold animate-bounce placeholder:text-white">Animations</Text>
     </View>
   );
 };

apps/mobile/app/_layout.tsx

@@ -2,6 +2,7 @@ import '../global.css';
 import FontAwesome from '@expo/vector-icons/FontAwesome';
 import { useFonts } from 'expo-font';
 import { SplashScreen, Stack } from 'expo-router';
+import { vars } from 'nativewind';
 import { memo, useEffect } from 'react';
 import { View, StyleSheet } from 'react-native';
 

apps/mobile/package.json

@@ -11,7 +11,7 @@
     "ios": "expo start --ios",
     "web": "expo start --web",
     "eas-build-pre-install": "npm install --global pnpm@7.x",
-    "eas-build-post-install": "pnpm run -w build:mobile"
+    "eas-build-post-install": "tailwindcss -i ./global.css -o ./node_modules/.cache/nativewind/global.css.native.css"
   },
   "jest": {
     "preset": "jest-expo"
@@ -29,7 +29,7 @@
     "expo-status-bar": "~1.6.0",
     "expo-system-ui": "~2.4.0",
     "expo-web-browser": "~12.3.2",
-    "nativewind": "4.0.0-alpha.29",
+    "nativewind": "4.0.16",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-native": "0.72.6",

apps/mobile/tailwind.config.js

@@ -1,7 +1,7 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
   darkMode: 'class',
-  content: ['app/**/*.{js,jsx,ts,tsx}'],
+  content: ['app/**/*.{js,jsx,ts,tsx}', '../../packages/ui/**/*.{js,jsx,ts,tsx}'],
   presets: [require('nativewind/preset')],
   plugins: [],
 };