fix: resolve TypeScript check-types CI errors

.gitignore

@@ -31,4 +31,4 @@ report.[0-9]_.[0-9]_.[0-9]_.[0-9]_.json
 .idea
 
 # Finder (MacOS) folder config
-.DS_Store
+.DS_Store

apps/expo/app/(app)/(tabs)/(home)/index.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import type { LargeTitleSearchBarRef, ListDataItem } from '@packrat/ui/nativewindui';
+import type { LargeTitleSearchBarMethods, ListDataItem } from '@packrat/ui/nativewindui';
 import {
   LargeTitleHeader,
   List,
@@ -167,7 +167,7 @@ function DemoIcon() {
 
 export default function DashboardScreen() {
   const [searchValue, setSearchValue] = useState('');
-  const searchBarRef = useRef<LargeTitleSearchBarRef>(null);
+  const searchBarRef = useRef<LargeTitleSearchBarMethods>(null);
   const { t } = useTranslation();
 
   const dashboardLayout = useRef([

apps/expo/app/(app)/(tabs)/profile/index.tsx

@@ -1,4 +1,4 @@
-import type { AlertRef } from '@packrat/ui/nativewindui';
+import type { AlertMethods } from '@packrat/ui/nativewindui';
 import {
   ActivityIndicator,
   Alert as AlertComponent,
@@ -11,7 +11,6 @@ import {
   type ListRenderItemInfo,
   ListSectionHeader,
   Text,
-  useColorScheme,
 } from '@packrat/ui/nativewindui';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import TabScreen from 'expo-app/components/TabScreen';
@@ -24,13 +23,14 @@ import { ProfileAuthWall } from 'expo-app/features/profile/components';
 import { useUpdateProfile } from 'expo-app/features/profile/hooks/useUpdateProfile';
 import { cn } from 'expo-app/lib/cn';
 import { hasUnsyncedChanges } from 'expo-app/lib/hasUnsyncedChanges';
+import { useColorScheme } from 'expo-app/lib/hooks/useColorScheme';
 import { useTranslation } from 'expo-app/lib/hooks/useTranslation';
 import { buildPackTemplateItemImageUrl } from 'expo-app/lib/utils/buildPackTemplateItemImageUrl';
 import * as FileSystem from 'expo-file-system/legacy';
 import { router, Stack } from 'expo-router';
 import * as Updates from 'expo-updates';
 import { useRef, useState } from 'react';
-import { Alert, Platform, TouchableOpacity, View } from 'react-native';
+import { Alert, Linking, Platform, TouchableOpacity, View } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
 const AVATAR_MAX_BYTES = 5 * 1024 * 1024; // 5 MB
@@ -137,8 +137,8 @@ function ListHeaderComponent() {
       if (!image) return;
 
       // Validate file size before uploading (5 MB limit)
-      const info = await FileSystem.getInfoAsync(image.uri, { size: true });
-      if (info.exists && info.size > AVATAR_MAX_BYTES) {
+      const info = await FileSystem.getInfoAsync(image.uri);
+      if (info.exists && 'size' in info && info.size > AVATAR_MAX_BYTES) {
         Alert.alert(t('errors.somethingWentWrong'), t('profile.imageTooLarge'));
         return;
       }
@@ -200,7 +200,7 @@ function ListFooterComponent() {
   const { colors } = useColorScheme();
   const { t } = useTranslation();
 
-  const alertRef = useRef<AlertRef>(null);
+  const alertRef = useRef<AlertMethods>(null);
   const [isSigningOut, setIsSigningOut] = useState(false);
 
   const handleSignOut = async () => {

apps/expo/app/(app)/(tabs)/profile/name.tsx

@@ -80,7 +80,7 @@ export default function NameScreen() {
         contentContainerStyle={{ paddingBottom: insets.bottom }}
       >
         <Form className="gap-5 px-4 pt-8">
-          <FormSection materialIconProps={{ name: 'account-circle' }}>
+          <FormSection materialIconProps={{ name: 'account-outline' }}>
             <FormItem>
               <TextField
                 textContentType="givenName"

apps/expo/app/(app)/(tabs)/profile/notifications.tsx

@@ -71,10 +71,7 @@ export default function NotificationsScreen() {
             </FormItem>
           </FormSection>
 
-          <FormSection
-            materialIconProps={{ name: 'weather-cloudy-alert' }}
-            title={t('profile.weatherAlerts')}
-          >
+          <FormSection materialIconProps={{ name: 'weather-cloudy-alert' }}>
             <FormItem className="ios:px-4 ios:pb-2 ios:pt-2 flex-row items-center justify-between px-2 pb-4">
               <View className="flex-1 flex-row items-center gap-2">
                 <View className="h-8 w-8 items-center justify-center rounded-lg bg-amber-500">
@@ -99,7 +96,7 @@ export default function NotificationsScreen() {
               >
                 <View className="flex-1 flex-row items-center gap-2">
                   <View className="h-8 w-8 items-center justify-center rounded-lg bg-blue-500">
-                    <Icon name="tune-vertical-variant" size={18} color="white" />
+                    <Icon name="wrench" size={18} color="white" />
                   </View>
                   <Text className="font-medium">{t('profile.configureAlertTypes')}</Text>
                 </View>

apps/expo/app/(app)/messages/chat.android.tsx

@@ -238,17 +238,17 @@ const CONTEXT_MENU_ITEMS = [
   createDropdownItem({
     actionKey: 'reply',
     title: 'Reply',
-    icon: { name: 'arrow-left-bold-outline' },
+    icon: { name: 'arrowshape.left' },
   }),
   createDropdownItem({
     actionKey: 'sticker',
     title: 'Sticker',
-    icon: { name: 'plus-box-outline' },
+    icon: { name: 'plus.app' },
   }),
   createDropdownItem({
     actionKey: 'copy',
     title: 'Copy',
-    icon: { name: 'clipboard-outline' },
+    icon: { name: 'clipboard' },
   }),
 ];
 

apps/expo/app/(app)/messages/chat.tsx

@@ -1,4 +1,4 @@
-import type { ContextMenuRef } from '@packrat/ui/nativewindui';
+import type { ContextMenuMethods } from '@packrat/ui/nativewindui';
 import {
   Avatar,
   AvatarFallback,
@@ -329,17 +329,17 @@ const CONTEXT_MENU_ITEMS = [
   createContextItem({
     actionKey: 'reply',
     title: 'Reply',
-    icon: { name: 'arrow-left-bold-outline' },
+    icon: { name: 'arrowshape.left' },
   }),
   createContextItem({
     actionKey: 'sticker',
     title: 'Sticker',
-    icon: { name: 'plus-box-outline' },
+    icon: { name: 'plus.app' },
   }),
   createContextItem({
     actionKey: 'copy',
     title: 'Copy',
-    icon: { name: 'clipboard-outline' },
+    icon: { name: 'clipboard' },
   }),
 ];
 
@@ -352,8 +352,8 @@ function ChatBubble({
   isSameNextSender: boolean;
   translateX: SharedValue<number>;
 }) {
-  const contextMenuRef = React.useRef<ContextMenuRef>(null);
-  const contextMenuRef2 = React.useRef<ContextMenuRef>(null);
+  const contextMenuRef = React.useRef<ContextMenuMethods>(null);
+  const contextMenuRef2 = React.useRef<ContextMenuMethods>(null);
   const { colors } = useColorScheme();
   const rootStyle = useAnimatedStyle(() => {
     return {

apps/expo/app/(app)/messages/conversations.android.tsx

@@ -85,7 +85,7 @@ export default function ConversationsAndroidScreen() {
         >
           <Toolbar
             leftView={<View className="flex-1" />}
-            rightView={<ToolbarCTA className="h-8 w-8" icon={{ name: 'pencil-box-outline' }} />}
+            rightView={<ToolbarCTA className="h-8 w-8" icon={{ name: 'square.and.pencil' }} />}
             iosBlurIntensity={30}
           />
         </Animated.View>
@@ -114,14 +114,13 @@ function LeftView() {
       createDropdownItem({
         actionKey: 'go-home',
         title: 'Go Home',
-        icon: { name: 'home' },
+        icon: { name: 'house.fill' },
       }),
       createDropdownItem({
         actionKey: 'toggle-theme',
         title: 'Toggle Theme',
         icon: {
           name: isDarkColorScheme ? 'moon.stars' : 'sun.min',
-          namingScheme: 'sfSymbol',
         },
       }),
     ];

apps/expo/app/(app)/messages/conversations.tsx

@@ -113,19 +113,18 @@ function LeftView({
       createDropdownItem({
         actionKey: 'go-home',
         title: 'Go Home',
-        icon: { name: 'home' },
+        icon: { name: 'house.fill' },
       }),
       createDropdownItem({
         actionKey: 'select-messages',
         title: 'Select messages',
-        icon: { name: 'checkmark.circle', namingScheme: 'sfSymbol' },
+        icon: { name: 'checkmark.circle' },
       }),
       createDropdownItem({
         actionKey: 'toggle-theme',
         title: 'Toggle Theme',
         icon: {
           name: isDarkColorScheme ? 'moon.stars' : 'sun.min',
-          namingScheme: 'sfSymbol',
         },
       }),
     ];
@@ -220,12 +219,12 @@ const CONTEXT_MENU_ITEMS = [
   createContextItem({
     actionKey: 'hide-alerts',
     title: 'Hide Alerts',
-    icon: { name: 'bell-outline' },
+    icon: { name: 'bell' },
   }),
   createContextItem({
     actionKey: 'delete',
     title: 'Delete',
-    icon: { name: 'trash-can-outline', color: 'red' },
+    icon: { name: 'trash', color: 'red' },
     destructive: true,
   }),
 ];

apps/expo/app/(app)/weather-alert-preferences.tsx

@@ -84,7 +84,7 @@ export default function WeatherAlertPreferencesScreen() {
             <FormItem className="ios:px-4 ios:pb-2 ios:pt-2 flex-row items-center justify-between px-2 pb-4">
               <View className="flex-1 flex-row items-center gap-3">
                 <View className="h-8 w-8 items-center justify-center rounded-lg bg-amber-500">
-                  <Icon name="bell-ring-outline" size={18} color="white" />
+                  <Icon name="bell-outline" size={18} color="white" />
                 </View>
                 <View className="flex-1">
                   <Text className="font-medium">{t('weather.weatherNotifications')}</Text>
@@ -132,7 +132,9 @@ export default function WeatherAlertPreferencesScreen() {
                   <View className="flex-1 flex-row items-center gap-3">
                     <View
                       className="h-8 w-8 items-center justify-center rounded-lg"
-                      style={{ backgroundColor: alertTypesDisabled ? colors.grey3 : iconColor }}
+                      style={{
+                        backgroundColor: alertTypesDisabled ? colors.grey3 : iconColor,
+                      }}
                     >
                       <Icon name={iconName as never} size={18} color="white" />
                     </View>

apps/expo/app/_layout.tsx

@@ -6,7 +6,7 @@ import { Stack } from 'expo-router';
 import { StatusBar } from 'expo-status-bar';
 import '../global.css';
 
-import { Alert, type AlertRef } from '@packrat-ai/nativewindui';
+import { Alert, type AlertMethods } from '@packrat-ai/nativewindui';
 import * as Sentry from '@sentry/react-native';
 import { userStore } from 'expo-app/features/auth/store';
 import { useColorScheme, useInitialAndroidBarSync } from 'expo-app/lib/hooks/useColorScheme';
@@ -31,12 +31,12 @@ export {
   ErrorBoundary,
 } from 'expo-router';
 
-export let appAlert: React.RefObject<AlertRef | null>;
+export let appAlert: React.RefObject<AlertMethods | null>;
 
 function RootLayout() {
   useInitialAndroidBarSync();
 
-  appAlert = useRef<AlertRef>(null);
+  appAlert = useRef<AlertMethods>(null);
 
   const { colorScheme, isDarkColorScheme } = useColorScheme();