From c5b538e57e9ee4d3cdd8d95c9755958cb1ad0e5f Mon Sep 17 00:00:00 2001 From: Satyajit Sahoo Date: Fri, 15 May 2026 08:08:48 +0200 Subject: [PATCH] chore: upgrade example to react navigation 8 alpha --- docs/docs/guides/02-theming.mdx | 7 +- .../08-theming-with-react-navigation.md | 6 +- docs/docs/guides/09-react-navigation.md | 12 +- example/package.json | 8 +- example/src/ExampleList.tsx | 4 +- example/src/Examples/AppbarExample.tsx | 4 +- .../Examples/BottomNavigationBarExample.tsx | 66 +++- .../src/Examples/BottomNavigationExample.tsx | 4 +- example/src/Examples/MenuExample.tsx | 4 +- example/src/Examples/SearchbarExample.tsx | 4 +- .../src/Examples/SegmentedButtonsExample.tsx | 4 +- example/src/Examples/TeamDetails.tsx | 4 +- example/src/Examples/TeamsList.tsx | 4 +- example/src/Examples/ThemeExample.tsx | 4 +- .../Examples/ThemingWithReactNavigation.tsx | 47 ++- example/src/Examples/TooltipExample.tsx | 4 +- example/src/RootNavigator.tsx | 12 +- example/utils/themes.ts | 12 +- package.json | 5 +- yarn.lock | 286 +++++++++--------- 20 files changed, 277 insertions(+), 224 deletions(-) diff --git a/docs/docs/guides/02-theming.mdx b/docs/docs/guides/02-theming.mdx index 3b24daf8d4..db65637b1b 100644 --- a/docs/docs/guides/02-theming.mdx +++ b/docs/docs/guides/02-theming.mdx @@ -307,16 +307,19 @@ Valid `themes` keys are: ```ts // App.tsx import { NavigationContainer, DefaultTheme } from '@react-navigation/native'; -import { createStackNavigator } from '@react-navigation/stack'; +import { createNativeStackNavigator } from '@react-navigation/native-stack'; import { PaperProvider, MD3LightTheme, adaptNavigationTheme, } from 'react-native-paper'; -const Stack = createStackNavigator(); + +const Stack = createNativeStackNavigator(); + const { LightTheme } = adaptNavigationTheme({ reactNavigationLight: DefaultTheme, }); + export default function App() { return ( diff --git a/docs/docs/guides/08-theming-with-react-navigation.md b/docs/docs/guides/08-theming-with-react-navigation.md index 272b0c08cd..67b360dbba 100644 --- a/docs/docs/guides/08-theming-with-react-navigation.md +++ b/docs/docs/guides/08-theming-with-react-navigation.md @@ -13,7 +13,7 @@ But how to make them work together? ### Material Design 3 -React Native Paper follows the Material Design 3 (Material You) color system, which differs from React Navigation’s default theme shape. +React Native Paper follows the Material Design 3 (Material You) color system, which differs from React Navigation’s default theme shape. However, to simplify adapting React Navigation theme colors, to use the ones from React Native Paper, it's worth using a utility called `adaptNavigationTheme` – it accepts navigation-compliant themes in both modes and returns their equivalents adjusted to Material Design 3. @@ -47,7 +47,7 @@ For React Native Paper theme to work, we need to use `PaperProvider` also at the ```js import { NavigationContainer } from '@react-navigation/native'; -import { createStackNavigator } from '@react-navigation/stack'; +import { createNativeStackNavigator } from '@react-navigation/native-stack'; import { TouchableOpacity } from 'react-native'; import { Card, @@ -56,7 +56,7 @@ import { PaperProvider, } from 'react-native-paper'; -const Stack = createStackNavigator(); +const Stack = createNativeStackNavigator(); const HomeScreen = ({ navigation }) => ( -That's all we need! We have app bar that contains everything we need to navigate through screens and access an additional menu on the main screen. As you can see, with Material design `Appbar` provided by `react-native-paper` used together with `react-navigation` we can easily create an app that looks and works great. +That's all we need! We have app bar that contains everything we need to navigate through screens and access an additional menu on the main screen. As you can see, with Material design `Appbar` provided by `react-native-paper` used together with `react-navigation` we can easily create an app that looks and works great. Grab the Expo [snack](https://snack.expo.dev/@react-native-paper/integrate-appbar-with-react-navigation) if you want to check the whole code! diff --git a/example/package.json b/example/package.json index cc726f4778..8edec0e291 100644 --- a/example/package.json +++ b/example/package.json @@ -13,10 +13,10 @@ "dependencies": { "@react-native-async-storage/async-storage": "2.2.0", "@react-native-masked-view/masked-view": "0.3.2", - "@react-navigation/bottom-tabs": "^7.3.10", - "@react-navigation/drawer": "^7.3.9", - "@react-navigation/native": "^7.1.6", - "@react-navigation/stack": "^7.2.10", + "@react-navigation/bottom-tabs": "^8.0.0-alpha.30", + "@react-navigation/drawer": "^8.0.0-alpha.31", + "@react-navigation/native": "^8.0.0-alpha.25", + "@react-navigation/native-stack": "^8.0.0-alpha.31", "expo": "~56.0.0-preview.11", "expo-crypto": "~56.0.3", "expo-dev-client": "~56.0.9", diff --git a/example/src/ExampleList.tsx b/example/src/ExampleList.tsx index c4bcfc599a..7b874d4906 100644 --- a/example/src/ExampleList.tsx +++ b/example/src/ExampleList.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { FlatList } from 'react-native'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { Divider, List, useTheme } from 'react-native-paper'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; @@ -115,7 +115,7 @@ export const examples: Record< }; type Props = { - navigation: StackNavigationProp<{ [key: string]: undefined }>; + navigation: NativeStackNavigationProp<{ [key: string]: undefined }>; }; type Item = { diff --git a/example/src/Examples/AppbarExample.tsx b/example/src/Examples/AppbarExample.tsx index b66c3c38cf..a8d07e581e 100644 --- a/example/src/Examples/AppbarExample.tsx +++ b/example/src/Examples/AppbarExample.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { Platform, StyleSheet, View } from 'react-native'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { Appbar, FAB, @@ -18,7 +18,7 @@ import { useSafeAreaInsets } from 'react-native-safe-area-context'; import ScreenWrapper from '../ScreenWrapper'; type Props = { - navigation: StackNavigationProp<{}>; + navigation: NativeStackNavigationProp<{}>; }; type AppbarModes = 'small' | 'medium' | 'large' | 'center-aligned'; diff --git a/example/src/Examples/BottomNavigationBarExample.tsx b/example/src/Examples/BottomNavigationBarExample.tsx index 5fe17759eb..083d6172fb 100644 --- a/example/src/Examples/BottomNavigationBarExample.tsx +++ b/example/src/Examples/BottomNavigationBarExample.tsx @@ -1,9 +1,13 @@ import React from 'react'; -import { View, StyleSheet } from 'react-native'; +import { View, StyleSheet, Image } from 'react-native'; import Icon from '@react-native-vector-icons/material-design-icons'; import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; -import { CommonActions } from '@react-navigation/native'; +import { + CommonActions, + SFSymbol, + MaterialSymbol, +} from '@react-navigation/native'; import { Text, BottomNavigation } from 'react-native-paper'; const Tab = createBottomTabNavigator(); @@ -30,10 +34,9 @@ export default function BottomNavigationBarExample() { screenOptions={{ headerShown: false, }} - tabBar={({ navigation, state, descriptors, insets }) => ( + tabBar={({ navigation, state, descriptors }) => ( { const event = navigation.emit({ type: 'tabPress', @@ -50,13 +53,54 @@ export default function BottomNavigationBarExample() { }); } }} - renderIcon={({ route, focused, color }) => - descriptors[route.key].options.tabBarIcon?.({ - focused, - color: typeof color === 'string' ? color : '', - size: 24, - }) || null - } + renderIcon={({ route, focused, color }) => { + const tabBarIcon = descriptors[route.key].options.tabBarIcon; + + const size = 24; + const icon = + typeof tabBarIcon === 'function' + ? tabBarIcon({ focused, color, size }) + : tabBarIcon; + + if (icon == null) { + return null; + } + + if (React.isValidElement(icon)) { + return icon; + } + + if (typeof icon === 'object' && icon !== null && 'type' in icon) { + switch (icon.type) { + case 'sfSymbol': + return ( + + ); + case 'materialSymbol': + return ( + + ); + case 'image': + return ( + + ); + } + } + + throw new Error( + 'Tab bar icon is not a valid React element, SFSymbol, MaterialSymbol, or Image.' + ); + }} getLabelText={({ route }) => descriptors[route.key].route.name} /> )} diff --git a/example/src/Examples/BottomNavigationExample.tsx b/example/src/Examples/BottomNavigationExample.tsx index 419aca0f9d..7a0e20c51d 100644 --- a/example/src/Examples/BottomNavigationExample.tsx +++ b/example/src/Examples/BottomNavigationExample.tsx @@ -8,7 +8,7 @@ import { View, } from 'react-native'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { Appbar, BottomNavigation, @@ -22,7 +22,7 @@ import ScreenWrapper from '../ScreenWrapper'; type Route = { route: { key: string } }; type Props = { - navigation: StackNavigationProp<{}>; + navigation: NativeStackNavigationProp<{}>; }; const MORE_ICON = Platform.OS === 'ios' ? 'dots-horizontal' : 'dots-vertical'; diff --git a/example/src/Examples/MenuExample.tsx b/example/src/Examples/MenuExample.tsx index b43fb04778..a263b7ee39 100644 --- a/example/src/Examples/MenuExample.tsx +++ b/example/src/Examples/MenuExample.tsx @@ -6,7 +6,7 @@ import { View, } from 'react-native'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { Appbar, Button, @@ -21,7 +21,7 @@ import ScreenWrapper from '../ScreenWrapper'; type ContextualMenuCoord = { x: number; y: number }; type Props = { - navigation: StackNavigationProp<{}>; + navigation: NativeStackNavigationProp<{}>; }; type MenuVisibility = { diff --git a/example/src/Examples/SearchbarExample.tsx b/example/src/Examples/SearchbarExample.tsx index 1dfe04b652..a293f2c85a 100644 --- a/example/src/Examples/SearchbarExample.tsx +++ b/example/src/Examples/SearchbarExample.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { Keyboard, StyleSheet } from 'react-native'; import type { DrawerNavigationProp } from '@react-navigation/drawer'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { Avatar, List, @@ -15,7 +15,7 @@ import { import ScreenWrapper from '../ScreenWrapper'; type Props = { - navigation: StackNavigationProp<{}>; + navigation: NativeStackNavigationProp<{}>; }; const SearchExample = ({ navigation }: Props) => { diff --git a/example/src/Examples/SegmentedButtonsExample.tsx b/example/src/Examples/SegmentedButtonsExample.tsx index ac40787c8a..5bfe3ba8b5 100644 --- a/example/src/Examples/SegmentedButtonsExample.tsx +++ b/example/src/Examples/SegmentedButtonsExample.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { List } from 'react-native-paper'; import { @@ -17,7 +17,7 @@ import { import ScreenWrapper from '../ScreenWrapper'; type Props = { - navigation: StackNavigationProp<{ [key: string]: undefined }>; + navigation: NativeStackNavigationProp<{ [key: string]: undefined }>; }; const SegmentedButtonExample = ({ navigation }: Props) => { diff --git a/example/src/Examples/TeamDetails.tsx b/example/src/Examples/TeamDetails.tsx index daf3681b61..a4b1f41a0b 100644 --- a/example/src/Examples/TeamDetails.tsx +++ b/example/src/Examples/TeamDetails.tsx @@ -8,7 +8,7 @@ import { View, } from 'react-native'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { Appbar, BottomNavigation, @@ -47,7 +47,7 @@ type Route = { }; type Props = { - navigation: StackNavigationProp<{}>; + navigation: NativeStackNavigationProp<{}>; route: Route; }; diff --git a/example/src/Examples/TeamsList.tsx b/example/src/Examples/TeamsList.tsx index 3024f372ae..69e07b93aa 100644 --- a/example/src/Examples/TeamsList.tsx +++ b/example/src/Examples/TeamsList.tsx @@ -2,13 +2,13 @@ import * as React from 'react'; import { StyleSheet } from 'react-native'; import type { ParamListBase } from '@react-navigation/native'; -import type { StackScreenProps } from '@react-navigation/stack'; +import type { NativeStackScreenProps } from '@react-navigation/native-stack'; import { DataTable } from 'react-native-paper'; import { teamsList } from '../../utils'; import ScreenWrapper from '../ScreenWrapper'; -type Props = StackScreenProps; +type Props = NativeStackScreenProps; const TeamsList = ({ navigation }: Props) => { return ( diff --git a/example/src/Examples/ThemeExample.tsx b/example/src/Examples/ThemeExample.tsx index c6729da4f5..54d4e9ba41 100644 --- a/example/src/Examples/ThemeExample.tsx +++ b/example/src/Examples/ThemeExample.tsx @@ -1,13 +1,13 @@ import * as React from 'react'; import { StyleSheet } from 'react-native'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { List, PaperProvider, Banner } from 'react-native-paper'; import ScreenWrapper from '../ScreenWrapper'; type Props = { - navigation: StackNavigationProp<{ [key: string]: undefined }>; + navigation: NativeStackNavigationProp<{ [key: string]: undefined }>; }; const ThemeExample = ({ navigation }: Props) => { diff --git a/example/src/Examples/ThemingWithReactNavigation.tsx b/example/src/Examples/ThemingWithReactNavigation.tsx index 126af0ac20..633af0bd76 100644 --- a/example/src/Examples/ThemingWithReactNavigation.tsx +++ b/example/src/Examples/ThemingWithReactNavigation.tsx @@ -1,13 +1,16 @@ import React from 'react'; -import { View, StyleSheet } from 'react-native'; +import { View, StyleSheet, Platform } from 'react-native'; import Icon from '@react-native-vector-icons/material-design-icons'; -import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; +import { + createBottomTabNavigator, + type BottomTabNavigationOptions, +} from '@react-navigation/bottom-tabs'; import { PlatformPressable } from '@react-navigation/elements'; -import { createStackNavigator } from '@react-navigation/stack'; +import { createNativeStackNavigator } from '@react-navigation/native-stack'; import { Text } from 'react-native-paper'; -const Stack = createStackNavigator(); +const Stack = createNativeStackNavigator(); const Tab = createBottomTabNavigator(); function HomeScreen() { @@ -43,18 +46,42 @@ const HomeTab = () => { name="Home" component={HomeScreen} options={{ - tabBarIcon: ({ color, size }) => { - return ; - }, + tabBarIcon: Platform.select( + { + android: { + type: 'materialSymbol', + name: 'home', + }, + ios: { + type: 'sfSymbol', + name: 'house', + }, + default: ({ color, size }) => { + return ; + }, + } + ), }} /> { - return ; - }, + tabBarIcon: Platform.select( + { + android: { + type: 'materialSymbol', + name: 'settings', + }, + ios: { + type: 'sfSymbol', + name: 'gear', + }, + default: ({ color, size }) => { + return ; + }, + } + ), }} /> diff --git a/example/src/Examples/TooltipExample.tsx b/example/src/Examples/TooltipExample.tsx index 011d7c6692..d499892e31 100644 --- a/example/src/Examples/TooltipExample.tsx +++ b/example/src/Examples/TooltipExample.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { Platform, StyleSheet, View, Image } from 'react-native'; -import type { StackNavigationProp } from '@react-navigation/stack'; +import type { NativeStackNavigationProp } from '@react-navigation/native-stack'; import { Appbar, Avatar, @@ -19,7 +19,7 @@ import { isWeb } from '../../utils'; import ScreenWrapper from '../ScreenWrapper'; type Props = { - navigation: StackNavigationProp<{}>; + navigation: NativeStackNavigationProp<{}>; }; const MORE_ICON = Platform.OS === 'ios' ? 'dots-horizontal' : 'dots-vertical'; diff --git a/example/src/RootNavigator.tsx b/example/src/RootNavigator.tsx index dee716b5c5..dcdbd73359 100644 --- a/example/src/RootNavigator.tsx +++ b/example/src/RootNavigator.tsx @@ -2,26 +2,18 @@ import * as React from 'react'; import { Platform, StyleSheet, View } from 'react-native'; import type { DrawerNavigationProp } from '@react-navigation/drawer'; -import { - CardStyleInterpolators, - createStackNavigator, -} from '@react-navigation/stack'; +import { createNativeStackNavigator } from '@react-navigation/native-stack'; import { Appbar } from 'react-native-paper'; import ExampleList, { examples } from './ExampleList'; -const Stack = createStackNavigator(); +const Stack = createNativeStackNavigator(); export default function Root() { - const cardStyleInterpolator = - Platform.OS === 'android' - ? CardStyleInterpolators.forFadeFromBottomAndroid - : CardStyleInterpolators.forHorizontalIOS; return ( ({ - cardStyleInterpolator, header: ({ navigation, route, options, back }) => ( {back ? ( diff --git a/example/utils/themes.ts b/example/utils/themes.ts index 956b383ab1..3bfc622e2c 100644 --- a/example/utils/themes.ts +++ b/example/utils/themes.ts @@ -1,12 +1,14 @@ import { DarkTheme as NavigationDarkTheme, DefaultTheme as NavigationDefaultTheme, + Theme as ReactNavigationTheme, } from '@react-navigation/native'; import { adaptNavigationTheme, DarkTheme, LightTheme, configureFonts, + Theme, } from 'react-native-paper'; const { LightTheme: NavLightTheme, DarkTheme: NavDarkTheme } = @@ -41,9 +43,9 @@ export const CombinedDarkTheme = { }, }; -type CombinedTheme = typeof CombinedDefaultTheme; - -export const createConfiguredFontTheme = (theme: CombinedTheme) => ({ +export const createConfiguredFontTheme = ( + theme: Theme & ReactNavigationTheme +) => ({ ...theme, fonts: configureFonts({ config: { @@ -52,7 +54,9 @@ export const createConfiguredFontTheme = (theme: CombinedTheme) => ({ }), }); -export const createConfiguredFontNavigationTheme = (theme: CombinedTheme) => ({ +export const createConfiguredFontNavigationTheme = ( + theme: Theme & ReactNavigationTheme +) => ({ ...theme, fonts: { ...theme.fonts, diff --git a/package.json b/package.json index 4caf92e9b6..6a8cffabb2 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,6 @@ "files": [ "src", "lib", - "react-navigation", "babel.js" ], "sideEffects": false, @@ -62,7 +61,7 @@ "@react-native-vector-icons/material-design-icons": "^12.0.0", "@react-native/babel-preset": "^0.85.3", "@react-native/jest-preset": "^0.85.3", - "@react-navigation/native": "^6.1.2", + "@react-navigation/native": "^8.0.0-alpha.25", "@release-it/conventional-changelog": "^1.1.0", "@testing-library/jest-native": "^5.4.1", "@testing-library/react-native": "11.5.0", @@ -137,7 +136,7 @@ "__fixtures__\\/[^/]+\\/(output|error)\\.js" ], "transformIgnorePatterns": [ - "node_modules/(?!(@react-navigation|@react-native|react-native(-.*)?)/)" + "node_modules/(?!(@react-native|react-native|@react-navigation|react-native-reanimated|react-native-worklets|react-native-safe-area-context|nanoid|query-string|decode-uri-component|filter-obj|split-on-first|escape-string-regexp)/)" ] }, "greenkeeper": { diff --git a/yarn.lock b/yarn.lock index 475bd6aafe..4f0e4a39ce 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5283,161 +5283,116 @@ __metadata: languageName: node linkType: hard -"@react-navigation/bottom-tabs@npm:^7.3.10": - version: 7.9.0 - resolution: "@react-navigation/bottom-tabs@npm:7.9.0" +"@react-navigation/bottom-tabs@npm:^8.0.0-alpha.30": + version: 8.0.0-alpha.30 + resolution: "@react-navigation/bottom-tabs@npm:8.0.0-alpha.30" dependencies: - "@react-navigation/elements": "npm:^2.9.3" - color: "npm:^4.2.3" - sf-symbols-typescript: "npm:^2.1.0" + "@react-navigation/elements": "npm:^3.0.0-alpha.28" peerDependencies: - "@react-navigation/native": ^7.1.26 - react: ">= 18.2.0" + "@react-navigation/native": ^8.0.0-alpha.25 + react: ">= 19.2.0" react-native: "*" - react-native-safe-area-context: ">= 4.0.0" - react-native-screens: ">= 4.0.0" - checksum: 10c0/98d56b517cb0e5ad5b7669b5f039cd9a7e23f44f561b0e11abc9834bbbc83152944628fe9badbdaf74f224c77b10e2b463af06aac53a6a89a07319d319c713ed + react-native-safe-area-context: ">= 5.5.0" + react-native-screens: ">= 4.25.0" + checksum: 10c0/e0c3399f1fc160667fe2c37b2a8ae72d65bdcd0fc2ea0009d3d1eeccaf4336f1c97db21af02f29b07d0ba9bd278a341ac8c6c3ab4b93d709eb0432e6fa0c40ff languageName: node linkType: hard -"@react-navigation/core@npm:^6.4.17": - version: 6.4.17 - resolution: "@react-navigation/core@npm:6.4.17" +"@react-navigation/core@npm:^8.0.0-alpha.16": + version: 8.0.0-alpha.16 + resolution: "@react-navigation/core@npm:8.0.0-alpha.16" dependencies: - "@react-navigation/routers": "npm:^6.1.9" - escape-string-regexp: "npm:^4.0.0" - nanoid: "npm:^3.1.23" - query-string: "npm:^7.1.3" - react-is: "npm:^16.13.0" - use-latest-callback: "npm:^0.2.1" - peerDependencies: - react: "*" - checksum: 10c0/f71fc10dd34d0bd13abd9c947833b9f5ac6aa18af58f74aa72bac45a5d348a4881924fec6534e7694d7084d940d7dac368a1b1fe7d86b260ff5cf475498e9d1b - languageName: node - linkType: hard - -"@react-navigation/core@npm:^7.13.7": - version: 7.13.7 - resolution: "@react-navigation/core@npm:7.13.7" - dependencies: - "@react-navigation/routers": "npm:^7.5.3" - escape-string-regexp: "npm:^4.0.0" + "@react-navigation/routers": "npm:^8.0.0-alpha.10" + escape-string-regexp: "npm:^5.0.0" fast-deep-equal: "npm:^3.1.3" - nanoid: "npm:^3.3.11" - query-string: "npm:^7.1.3" + nanoid: "npm:^5.1.7" + query-string: "npm:^9.3.1" react-is: "npm:^19.1.0" - use-latest-callback: "npm:^0.2.4" - use-sync-external-store: "npm:^1.5.0" + use-latest-callback: "npm:^0.3.3" + use-sync-external-store: "npm:^1.6.0" peerDependencies: - react: ">= 18.2.0" - checksum: 10c0/6d33e97a4fb72ffbb5fd135afb418b8d3411abbdbe7ce0fde026fcb0bc0ce7c96e8995a24c77314d6e5e4b689ba3b0311805cb619eedbafc2011aca5e26591fa + react: ">= 19.2.0" + checksum: 10c0/f376844b9d506200e74c53834d3246c935c932c335a764cedc5724bdf566d174bb0f8247f995447480ca0bad2a4d72e9d33506aa7b58076a69711171eef12928 languageName: node linkType: hard -"@react-navigation/drawer@npm:^7.3.9": - version: 7.7.10 - resolution: "@react-navigation/drawer@npm:7.7.10" +"@react-navigation/drawer@npm:^8.0.0-alpha.31": + version: 8.0.0-alpha.31 + resolution: "@react-navigation/drawer@npm:8.0.0-alpha.31" dependencies: - "@react-navigation/elements": "npm:^2.9.3" - color: "npm:^4.2.3" - react-native-drawer-layout: "npm:^4.2.1" - use-latest-callback: "npm:^0.2.4" + "@react-navigation/elements": "npm:^3.0.0-alpha.28" + react-native-drawer-layout: "npm:^5.0.0-alpha.10" + use-latest-callback: "npm:^0.3.3" peerDependencies: - "@react-navigation/native": ^7.1.26 - react: ">= 18.2.0" + "@react-navigation/native": ^8.0.0-alpha.25 + react: ">= 19.2.0" react-native: "*" react-native-gesture-handler: ">= 2.0.0" - react-native-reanimated: ">= 2.0.0" - react-native-safe-area-context: ">= 4.0.0" - react-native-screens: ">= 4.0.0" - checksum: 10c0/5da6055d318d7552eac97fd1ea7c657c673df29230532e0f27a42c4496ceaa461bcb359c3fc16c28b2ebc8680629c2a46a533870712f8d7d1db7f7007fad13c5 + react-native-reanimated: ">= 4.0.0" + react-native-safe-area-context: ">= 5.5.0" + react-native-screens: ">= 4.25.0" + react-native-worklets: ">= 0.4.0" + checksum: 10c0/4d7e6bb701475e918f50a78f5c88032bdc159ef7c1f7b3d7c33e3ba07be943a93a872d8dc32118d14bb04e9225df78eeff0bafb9c37c673c614af10ede1c734d languageName: node linkType: hard -"@react-navigation/elements@npm:^2.9.3": - version: 2.9.3 - resolution: "@react-navigation/elements@npm:2.9.3" +"@react-navigation/elements@npm:^3.0.0-alpha.28": + version: 3.0.0-alpha.28 + resolution: "@react-navigation/elements@npm:3.0.0-alpha.28" dependencies: - color: "npm:^4.2.3" - use-latest-callback: "npm:^0.2.4" - use-sync-external-store: "npm:^1.5.0" + sf-symbols-typescript: "npm:^2.2.0" + use-latest-callback: "npm:^0.3.3" + use-sync-external-store: "npm:^1.6.0" peerDependencies: - "@react-native-masked-view/masked-view": ">= 0.2.0" - "@react-navigation/native": ^7.1.26 - react: ">= 18.2.0" + "@callstack/liquid-glass": ">= 0.6.0" + "@react-navigation/native": ^8.0.0-alpha.25 + react: ">= 19.2.0" react-native: "*" - react-native-safe-area-context: ">= 4.0.0" - peerDependenciesMeta: - "@react-native-masked-view/masked-view": - optional: true - checksum: 10c0/50c30366507ca420e65b1a232edca8d64fbac1420d90d0a9aa16ec84d8c63719b9c626a24095943fd63283b4116c0ec888f6ccc6cb2317a4cba4d1b1c2c5021a + react-native-safe-area-context: ">= 5.5.0" + react-native-screens: ">= 4.25.0" + checksum: 10c0/b08b7d37fcdb08b3baa63491460576d808839b294d979c157ac7c26f5eab94901bba1d493cdfe83f65aab1995d2c08aaa4ac69edc425437b910878ec59a907b6 languageName: node linkType: hard -"@react-navigation/native@npm:^6.1.2": - version: 6.1.18 - resolution: "@react-navigation/native@npm:6.1.18" +"@react-navigation/native-stack@npm:^8.0.0-alpha.31": + version: 8.0.0-alpha.31 + resolution: "@react-navigation/native-stack@npm:8.0.0-alpha.31" dependencies: - "@react-navigation/core": "npm:^6.4.17" - escape-string-regexp: "npm:^4.0.0" - fast-deep-equal: "npm:^3.1.3" - nanoid: "npm:^3.1.23" + "@react-navigation/elements": "npm:^3.0.0-alpha.28" + warn-once: "npm:^0.1.1" peerDependencies: - react: "*" + "@react-navigation/native": ^8.0.0-alpha.25 + react: ">= 19.2.0" react-native: "*" - checksum: 10c0/1f7138da298067f537a22c5ab2e8e8529e83df8f87c5c61e84afdcd49d6ba1409f44a33bac3bd08bb11bcfba3f1c84574b7aa0a67b28531e4520d485bd4e3b9b + react-native-safe-area-context: ">= 5.5.0" + react-native-screens: ">= 4.25.0" + checksum: 10c0/4595225a7ad5b94563486ac331a3c6d1c9045591c9a258f7bafed6e140d1ba1b6a43bd03b2f0cc348baa160e30769879638f90baf256d106a045c9efa6b9bc52 languageName: node linkType: hard -"@react-navigation/native@npm:^7.1.6": - version: 7.1.26 - resolution: "@react-navigation/native@npm:7.1.26" +"@react-navigation/native@npm:^8.0.0-alpha.25": + version: 8.0.0-alpha.25 + resolution: "@react-navigation/native@npm:8.0.0-alpha.25" dependencies: - "@react-navigation/core": "npm:^7.13.7" - escape-string-regexp: "npm:^4.0.0" + "@react-navigation/core": "npm:^8.0.0-alpha.16" + escape-string-regexp: "npm:^5.0.0" fast-deep-equal: "npm:^3.1.3" - nanoid: "npm:^3.3.11" - use-latest-callback: "npm:^0.2.4" + nanoid: "npm:^5.1.7" + sf-symbols-typescript: "npm:^2.2.0" + use-latest-callback: "npm:^0.3.3" peerDependencies: - react: ">= 18.2.0" + react: ">= 19.2.0" react-native: "*" - checksum: 10c0/7aa1e3ff40b36fb13f615412465d48eaa115f95c9b4278c67c616f8aa3d86bab68656b2528827307dbdba1cd2f30b3614837a042cc19b4316baf78ec0ff3f4c8 - languageName: node - linkType: hard - -"@react-navigation/routers@npm:^6.1.9": - version: 6.1.9 - resolution: "@react-navigation/routers@npm:6.1.9" - dependencies: - nanoid: "npm:^3.1.23" - checksum: 10c0/5b58014cf29bb71c7dc01201e271d55f0ecfe6d38d064179eeff0fc0b5cb739d4d9906eb133f100d25fc674c72c24aa65d5f6bfc3d036d79f7c5d1936391c605 + checksum: 10c0/146d0c8b752b8bafb975892f2efb103ff75b58462adc9ae0bd54a9c2a286a878fdcb32fb9008252f56304387608e43e5f4d6e2924ea3797b2141648ed315412e languageName: node linkType: hard -"@react-navigation/routers@npm:^7.5.3": - version: 7.5.3 - resolution: "@react-navigation/routers@npm:7.5.3" +"@react-navigation/routers@npm:^8.0.0-alpha.10": + version: 8.0.0-alpha.10 + resolution: "@react-navigation/routers@npm:8.0.0-alpha.10" dependencies: - nanoid: "npm:^3.3.11" - checksum: 10c0/85f6cb9ac71e0492845aa87637c7c745d85aa15e4ad7e71a8d910080f5d5a469dd348f59ffaaed8c488cb92708fae56350a0bfc7bc5750c65e12da1f0d4eca70 - languageName: node - linkType: hard - -"@react-navigation/stack@npm:^7.2.10": - version: 7.6.13 - resolution: "@react-navigation/stack@npm:7.6.13" - dependencies: - "@react-navigation/elements": "npm:^2.9.3" - color: "npm:^4.2.3" - use-latest-callback: "npm:^0.2.4" - peerDependencies: - "@react-navigation/native": ^7.1.26 - react: ">= 18.2.0" - react-native: "*" - react-native-gesture-handler: ">= 2.0.0" - react-native-safe-area-context: ">= 4.0.0" - react-native-screens: ">= 4.0.0" - checksum: 10c0/2c6b7c8783a981c8316d79f3ac5dc563c6cdca3e15e8d5dcb4ef8f58f40e0d26c0a7c0903cc3793b73bfcfd03261045f5a848a54d34f11379f045c0fd723a307 + nanoid: "npm:^5.1.7" + checksum: 10c0/1ca44e6b0baccd802cd306c96bcd38ab7513856c2cbad457c146449349718ccecdedbdeeff77c490429b080f5fc92df7fd5e8e87a902b62bbec9a8e6e7a6ae14 languageName: node linkType: hard @@ -10372,13 +10327,20 @@ __metadata: languageName: node linkType: hard -"decode-uri-component@npm:^0.2.0, decode-uri-component@npm:^0.2.2": +"decode-uri-component@npm:^0.2.0": version: 0.2.2 resolution: "decode-uri-component@npm:0.2.2" checksum: 10c0/1f4fa54eb740414a816b3f6c24818fbfcabd74ac478391e9f4e2282c994127db02010ce804f3d08e38255493cfe68608b3f5c8e09fd6efc4ae46c807691f7a31 languageName: node linkType: hard +"decode-uri-component@npm:^0.4.1": + version: 0.4.1 + resolution: "decode-uri-component@npm:0.4.1" + checksum: 10c0/a180bbdb5398ec8270d236a3ac07cb988bbf6097428481780b85840f088951dc0318a8d8f9d56796e1a322b55b29859cea29982f22f9b03af0bc60974c54e591 + languageName: node + linkType: hard + "decompress-response@npm:^3.3.0": version: 3.3.0 resolution: "decompress-response@npm:3.3.0" @@ -12596,6 +12558,13 @@ __metadata: languageName: node linkType: hard +"filter-obj@npm:^5.1.0": + version: 5.1.0 + resolution: "filter-obj@npm:5.1.0" + checksum: 10c0/716e8ad2bc352e206556b3e5695b3cdff8aab80c53ea4b00c96315bbf467b987df3640575100aef8b84e812cf5ea4251db4cd672bbe33b1e78afea88400c67dd + languageName: node + linkType: hard + "finalhandler@npm:1.1.2": version: 1.1.2 resolution: "finalhandler@npm:1.1.2" @@ -17877,15 +17846,6 @@ __metadata: languageName: node linkType: hard -"nanoid@npm:^3.1.23": - version: 3.3.12 - resolution: "nanoid@npm:3.3.12" - bin: - nanoid: bin/nanoid.cjs - checksum: 10c0/ba142b7b39e11e80c16dd74b0365d407880c87c1cf7e1480956981ae940ee36060fa5b6f092cd1e315184dd19244c657bd017d03327bd3c62247d691c5e8edfb - languageName: node - linkType: hard - "nanoid@npm:^3.3.11": version: 3.3.11 resolution: "nanoid@npm:3.3.11" @@ -17895,6 +17855,15 @@ __metadata: languageName: node linkType: hard +"nanoid@npm:^5.1.7": + version: 5.1.11 + resolution: "nanoid@npm:5.1.11" + bin: + nanoid: bin/nanoid.js + checksum: 10c0/91580d18c29263ac0e871734f0d86e7f906f523f974d3c30fc65354ccf387ccffd606c2a6c28acc2977a3950146347e790ce9e3f514133a48995af5ccdb308ce + languageName: node + linkType: hard + "nanomatch@npm:^1.2.9": version: 1.2.13 resolution: "nanomatch@npm:1.2.13" @@ -20011,15 +19980,14 @@ __metadata: languageName: node linkType: hard -"query-string@npm:^7.1.3": - version: 7.1.3 - resolution: "query-string@npm:7.1.3" +"query-string@npm:^9.3.1": + version: 9.3.1 + resolution: "query-string@npm:9.3.1" dependencies: - decode-uri-component: "npm:^0.2.2" - filter-obj: "npm:^1.1.0" - split-on-first: "npm:^1.0.0" - strict-uri-encode: "npm:^2.0.0" - checksum: 10c0/a896c08e9e0d4f8ffd89a572d11f668c8d0f7df9c27c6f49b92ab31366d3ba0e9c331b9a620ee747893436cd1f2f821a6327e2bc9776bde2402ac6c270b801b2 + decode-uri-component: "npm:^0.4.1" + filter-obj: "npm:^5.1.0" + split-on-first: "npm:^3.0.0" + checksum: 10c0/47f62350be7ace6d2e03d12becf5d1985731d97577963a4d8b684e166f6708cb42f63f09aa4c92931f2ee1ff57c0800a25807b95f28fd98f7064b1d06b02b07e languageName: node linkType: hard @@ -20287,7 +20255,7 @@ __metadata: languageName: node linkType: hard -"react-is@npm:^16.13.0, react-is@npm:^16.13.1, react-is@npm:^16.6.0, react-is@npm:^16.7.0, react-is@npm:^16.8.3, react-is@npm:^16.8.4": +"react-is@npm:^16.13.1, react-is@npm:^16.6.0, react-is@npm:^16.7.0, react-is@npm:^16.8.3, react-is@npm:^16.8.4": version: 16.13.1 resolution: "react-is@npm:16.13.1" checksum: 10c0/33977da7a5f1a287936a0c85639fec6ca74f4f15ef1e59a6bc20338fc73dc69555381e211f7a3529b8150a1f71e4225525b41b60b52965bda53ce7d47377ada1 @@ -20381,18 +20349,18 @@ __metadata: languageName: node linkType: hard -"react-native-drawer-layout@npm:^4.2.1": - version: 4.2.1 - resolution: "react-native-drawer-layout@npm:4.2.1" +"react-native-drawer-layout@npm:^5.0.0-alpha.10": + version: 5.0.0-alpha.10 + resolution: "react-native-drawer-layout@npm:5.0.0-alpha.10" dependencies: - color: "npm:^4.2.3" - use-latest-callback: "npm:^0.2.4" + use-latest-callback: "npm:^0.3.3" peerDependencies: - react: ">= 18.2.0" + react: ">= 19.2.0" react-native: "*" react-native-gesture-handler: ">= 2.0.0" - react-native-reanimated: ">= 2.0.0" - checksum: 10c0/156960cf9947db0628e4ae5f4ba39c85c4fd75825326090eb9a3051aec94bd0b429e6f90e5983e3da64fe124ef41887e344cf08e5f40a27a2d6a81e0ebeec3b2 + react-native-reanimated: ">= 4.0.0" + react-native-worklets: ">= 0.4.0" + checksum: 10c0/00fa3bc90e8544342343497f6c70be2eb8577c18d2080dbfc58fe1db3f84fb09ab8c1c883c0a3c266d5b05f8d0bc032a9c0423bd36a7633fa38dceee766e3955 languageName: node linkType: hard @@ -20438,10 +20406,10 @@ __metadata: "@babel/core": "npm:^7.29.0" "@react-native-async-storage/async-storage": "npm:2.2.0" "@react-native-masked-view/masked-view": "npm:0.3.2" - "@react-navigation/bottom-tabs": "npm:^7.3.10" - "@react-navigation/drawer": "npm:^7.3.9" - "@react-navigation/native": "npm:^7.1.6" - "@react-navigation/stack": "npm:^7.2.10" + "@react-navigation/bottom-tabs": "npm:^8.0.0-alpha.30" + "@react-navigation/drawer": "npm:^8.0.0-alpha.31" + "@react-navigation/native": "npm:^8.0.0-alpha.25" + "@react-navigation/native-stack": "npm:^8.0.0-alpha.31" babel-preset-expo: "npm:~56.0.0" expo: "npm:~56.0.0-preview.11" expo-crypto: "npm:~56.0.3" @@ -20478,7 +20446,7 @@ __metadata: "@react-native-vector-icons/material-design-icons": "npm:^12.0.0" "@react-native/babel-preset": "npm:^0.85.3" "@react-native/jest-preset": "npm:^0.85.3" - "@react-navigation/native": "npm:^6.1.2" + "@react-navigation/native": "npm:^8.0.0-alpha.25" "@release-it/conventional-changelog": "npm:^1.1.0" "@testing-library/jest-native": "npm:^5.4.1" "@testing-library/react-native": "npm:11.5.0" @@ -22150,7 +22118,7 @@ __metadata: languageName: node linkType: hard -"sf-symbols-typescript@npm:^2.1.0": +"sf-symbols-typescript@npm:^2.2.0": version: 2.2.0 resolution: "sf-symbols-typescript@npm:2.2.0" checksum: 10c0/3f3bbf33aaad19e619d6f169899b39e9fe9c5fd21f0d6d511100e36887606ad349109ddc6ff82933f2b8cbf437dd7105c2ae6b0059b291dc47f143b30c2074cc @@ -22655,6 +22623,13 @@ __metadata: languageName: node linkType: hard +"split-on-first@npm:^3.0.0": + version: 3.0.0 + resolution: "split-on-first@npm:3.0.0" + checksum: 10c0/a1262eae12b68de235e1a08e011bf5b42c42621985ddf807e6221fb1e2b3304824913ae7019f18436b96b8fab8aef5f1ad80dedd2385317fdc51b521c3882cd0 + languageName: node + linkType: hard + "split-string@npm:^3.0.1, split-string@npm:^3.0.2": version: 3.1.0 resolution: "split-string@npm:3.1.0" @@ -24364,7 +24339,7 @@ __metadata: languageName: node linkType: hard -"use-latest-callback@npm:^0.2.1, use-latest-callback@npm:^0.2.3, use-latest-callback@npm:^0.2.4": +"use-latest-callback@npm:^0.2.3": version: 0.2.6 resolution: "use-latest-callback@npm:0.2.6" peerDependencies: @@ -24373,6 +24348,15 @@ __metadata: languageName: node linkType: hard +"use-latest-callback@npm:^0.3.3": + version: 0.3.4 + resolution: "use-latest-callback@npm:0.3.4" + peerDependencies: + react: ">=16.8" + checksum: 10c0/af4a4ae7c0a378023efc06f195eeb78420ae9f8c01221a88f73b36561a6561436dcda7e3a6bc37c382271ce247fc2331fd614ef66d9a2b5066ed303ea6c886f0 + languageName: node + linkType: hard + "use-latest@npm:^1.2.1": version: 1.3.0 resolution: "use-latest@npm:1.3.0" @@ -24387,7 +24371,7 @@ __metadata: languageName: node linkType: hard -"use-sync-external-store@npm:^1.2.0, use-sync-external-store@npm:^1.5.0": +"use-sync-external-store@npm:^1.2.0, use-sync-external-store@npm:^1.6.0": version: 1.6.0 resolution: "use-sync-external-store@npm:1.6.0" peerDependencies: @@ -24606,7 +24590,7 @@ __metadata: languageName: node linkType: hard -"warn-once@npm:^0.1.0": +"warn-once@npm:^0.1.0, warn-once@npm:^0.1.1": version: 0.1.1 resolution: "warn-once@npm:0.1.1" checksum: 10c0/f531e7b2382124f51e6d8f97b8c865246db8ab6ff4e53257a2d274e0f02b97d7201eb35db481843dc155815e154ad7afb53b01c4d4db15fb5aa073562496aff7