diff --git a/packages/drawer/.eslintrc b/packages/drawer/.eslintrc index 5870df7f..bb0e2567 100644 --- a/packages/drawer/.eslintrc +++ b/packages/drawer/.eslintrc @@ -5,11 +5,15 @@ "env": { "es6": true, - "react-native-globals/all": true, + "react-native-globals/all": true + }, + + "settings": { + "import/core-modules": ["react-native-screens"] }, "rules": { - "import/no-unresolved": "off", + "import/named": "off", "react-native/no-inline-styles": "off" } } diff --git a/packages/drawer/example/App.js b/packages/drawer/example/App.js index 47ca835b..f3c1ac6b 100644 --- a/packages/drawer/example/App.js +++ b/packages/drawer/example/App.js @@ -1,8 +1,12 @@ import * as React from 'react'; // eslint-disable-next-line no-unused-vars import { View, TouchableOpacity, FlatList, I18nManager } from 'react-native'; -import { ThemeContext, ThemeColors } from '@react-navigation/core'; -import { Themed, createAppContainer } from '@react-navigation/native'; +import { + ThemeContext, + ThemeColors, + Themed, + createAppContainer, +} from 'react-navigation'; import { createStackNavigator } from 'react-navigation-stack'; import { MaterialCommunityIcons } from '@expo/vector-icons'; import { List, Divider } from 'react-native-paper'; diff --git a/packages/drawer/example/metro.config.js b/packages/drawer/example/metro.config.js index 52219fb7..c734a605 100644 --- a/packages/drawer/example/metro.config.js +++ b/packages/drawer/example/metro.config.js @@ -22,10 +22,6 @@ module.exports = { providesModuleNodeModules: [ '@expo/vector-icons', '@babel/runtime', - '@react-navigation/core', - '@react-navigation/native', - 'react-native-gesture-handler', - 'react-native-reanimated', ...dependencies, ...peerDependencies, ], diff --git a/packages/drawer/example/package.json b/packages/drawer/example/package.json index b9a2d9c8..ff49cb68 100644 --- a/packages/drawer/example/package.json +++ b/packages/drawer/example/package.json @@ -10,8 +10,6 @@ }, "dependencies": { "@expo/vector-icons": "^10.0.0", - "@react-navigation/core": "^3.5.0", - "@react-navigation/native": "^3.6.0", "expo": "^34.0.0", "expo-asset": "^6.0.0", "expo-constants": "~6.0.0", @@ -22,6 +20,7 @@ "react-native-paper": "^2.2.0", "react-native-reanimated": "~1.1.0", "react-native-webview": "~5.12.0", + "react-navigation": "^4.0.1", "react-navigation-stack": "^1.4.0" }, "devDependencies": { diff --git a/packages/drawer/example/src/GestureInteraction.js b/packages/drawer/example/src/GestureInteraction.js index d200311a..f18565e1 100644 --- a/packages/drawer/example/src/GestureInteraction.js +++ b/packages/drawer/example/src/GestureInteraction.js @@ -1,6 +1,6 @@ import * as React from 'react'; import { Button, View } from 'react-native'; -import { withNavigation } from '@react-navigation/core'; +import { withNavigation } from 'react-navigation'; import { createDrawerNavigator, DrawerGestureContext, diff --git a/packages/drawer/example/src/ParallaxDrawer.js b/packages/drawer/example/src/ParallaxDrawer.js index ec5f9c31..bcf53c11 100644 --- a/packages/drawer/example/src/ParallaxDrawer.js +++ b/packages/drawer/example/src/ParallaxDrawer.js @@ -7,13 +7,11 @@ import { StyleSheet, View, } from 'react-native'; - +import { ThemeColors, useTheme, Themed, SafeAreaView } from 'react-navigation'; import { createStackNavigator } from 'react-navigation-stack'; -import { ThemeColors, useTheme } from '@react-navigation/core'; -import { Themed, SafeAreaView } from '@react-navigation/native'; -import MaterialIcons from 'react-native-vector-icons/MaterialIcons'; -import Animated from 'react-native-reanimated'; import { createDrawerNavigator } from 'react-navigation-drawer'; +import Animated from 'react-native-reanimated'; +import { MaterialIcons } from '@expo/vector-icons'; const SampleText = ({ children }) => {children}; diff --git a/packages/drawer/example/src/RTLDrawer.js b/packages/drawer/example/src/RTLDrawer.js index 1c86a4b0..1ea493ea 100644 --- a/packages/drawer/example/src/RTLDrawer.js +++ b/packages/drawer/example/src/RTLDrawer.js @@ -7,7 +7,7 @@ import { TouchableOpacity, } from 'react-native'; -import { Themed } from '@react-navigation/native'; +import { Themed } from 'react-navigation'; import { createStackNavigator } from 'react-navigation-stack'; import { createDrawerNavigator } from 'react-navigation-drawer'; diff --git a/packages/drawer/example/src/SimpleDrawer.js b/packages/drawer/example/src/SimpleDrawer.js index a21769b8..2a06229c 100644 --- a/packages/drawer/example/src/SimpleDrawer.js +++ b/packages/drawer/example/src/SimpleDrawer.js @@ -1,10 +1,9 @@ import React from 'react'; import { Button, ScrollView, StyleSheet, View } from 'react-native'; import { createStackNavigator } from 'react-navigation-stack'; -import { ThemeColors, useTheme } from '@react-navigation/core'; -import { Themed, SafeAreaView } from '@react-navigation/native'; -import MaterialIcons from 'react-native-vector-icons/MaterialIcons'; +import { ThemeColors, useTheme, Themed, SafeAreaView } from 'react-navigation'; import { createDrawerNavigator } from 'react-navigation-drawer'; +import { MaterialIcons } from '@expo/vector-icons'; const SampleText = ({ children }) => {children}; diff --git a/packages/drawer/example/src/StyledDrawer.js b/packages/drawer/example/src/StyledDrawer.js index 30329e22..b5f61f54 100644 --- a/packages/drawer/example/src/StyledDrawer.js +++ b/packages/drawer/example/src/StyledDrawer.js @@ -1,9 +1,9 @@ import React from 'react'; import { Button, ScrollView } from 'react-native'; import { createStackNavigator } from 'react-navigation-stack'; -import { Themed, SafeAreaView } from '@react-navigation/native'; -import MaterialIcons from 'react-native-vector-icons/MaterialIcons'; +import { Themed, SafeAreaView } from 'react-navigation'; import { createDrawerNavigator } from 'react-navigation-drawer'; +import { MaterialIcons } from '@expo/vector-icons'; const SampleText = ({ children }) => {children}; diff --git a/packages/drawer/example/yarn.lock b/packages/drawer/example/yarn.lock index 2b8d800d..d97c3b3c 100644 --- a/packages/drawer/example/yarn.lock +++ b/packages/drawer/example/yarn.lock @@ -918,7 +918,7 @@ query-string "^6.4.2" react-is "^16.8.6" -"@react-navigation/native@^3.6.0": +"@react-navigation/native@^3.6.2": version "3.6.2" resolved "https://registry.yarnpkg.com/@react-navigation/native/-/native-3.6.2.tgz#3634697b6350cc5189657ae4551f2d52b57fbbf0" integrity sha512-Cybeou6N82ZeRmgnGlu+wzlV3z5BZQR2dmYaNFV1TNLUGHqtvv8E7oNw9uYcz9Ox5LFbiX+FdNTn2d6ZPlK0kg== @@ -4352,9 +4352,9 @@ react-native-safe-area-view@^0.12.0: hoist-non-react-statics "^2.3.1" react-native-safe-area-view@^0.14.1: - version "0.14.7" - resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.14.7.tgz#e1dd1c4d25a90677df2c15347fdddb2306ba5971" - integrity sha512-fmuBYpvKDJK33bimo4JXrK2BN2CGw7nof1y1LDRgzqv+FZ3eADSDGshprN8WeQqSZjQ20hJx1CiWk28Edg/v4Q== + version "0.14.8" + resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.14.8.tgz#ef33c46ff8164ae77acad48c3039ec9c34873e5b" + integrity sha512-MtRSIcZNstxv87Jet+UsPhEd1tpGe8cVskDXlP657x6rHpSrbrc+y13ZNXrwAgGNNhqQNX7UJT68ZIq//ZRmvw== dependencies: hoist-non-react-statics "^2.3.1" @@ -4440,6 +4440,14 @@ react-navigation-stack@^1.4.0: dependencies: prop-types "^15.7.2" +react-navigation@^4.0.1: + version "4.0.1" + resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-4.0.1.tgz#96c17ac90afcf0a5bc957358152326211a79d183" + integrity sha512-6XzuqvhOnY6FA6tCErD6+vfZdnP+O/7hCQper9qDulxxW2ZVkCF4xWdzoVcv3DDR6P5CK6l1tcbJ1ku256AdFQ== + dependencies: + "@react-navigation/core" "^3.5.0" + "@react-navigation/native" "^3.6.2" + react-proxy@^1.1.7: version "1.1.8" resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a" diff --git a/packages/drawer/jest-setup.js b/packages/drawer/jest-setup.js index 06a9459f..1cacd29c 100644 --- a/packages/drawer/jest-setup.js +++ b/packages/drawer/jest-setup.js @@ -1,5 +1,6 @@ /* eslint-env jest */ +// eslint-disable-next-line import/no-unresolved import NativeModules from 'NativeModules'; Object.assign(NativeModules, { diff --git a/packages/drawer/package.json b/packages/drawer/package.json index 2d5e6a2f..40825a18 100644 --- a/packages/drawer/package.json +++ b/packages/drawer/package.json @@ -46,8 +46,6 @@ "@commitlint/config-conventional": "^7.5.0", "@expo/vector-icons": "^10.0.1", "@react-native-community/bob": "^0.3.4", - "@react-navigation/core": "^3.5.0", - "@react-navigation/native": "^3.6.2", "@release-it/conventional-changelog": "^1.1.0", "@types/jest": "^24.0.11", "@types/react": "^16.8.13", @@ -70,19 +68,19 @@ "react-native-reanimated": "^1.2.0", "react-native-screens": "^1.0.0-alpha.23", "react-native-testing-library": "^1.7.0", + "react-navigation": "^4.0.1", "react-test-renderer": "16.8.6", "release-it": "^12.3.6", "typescript": "^3.4.5" }, "dependencies": {}, "peerDependencies": { - "@react-navigation/core": "^3.5.0", - "@react-navigation/native": "^3.6.2", "react": "*", "react-native": "*", "react-native-gesture-handler": "^1.0.12", "react-native-reanimated": "^1.0.0", - "react-native-screens": "^1.0.0 || ^1.0.0-alpha" + "react-native-screens": "^1.0.0 || ^1.0.0-alpha", + "react-navigation": "^4.0.1" }, "jest": { "preset": "react-native", @@ -96,7 +94,7 @@ "/example/" ], "transformIgnorePatterns": [ - "node_modules/(?!(jest-)?react-native|react-clone-referenced-element|react-navigation-deprecated-tab-navigator|@react-navigation/core|@react-navigation/native)" + "node_modules/(?!(jest-)?react-native|react-navigation|@react-navigation/core|@react-navigation/native)" ], "testPathIgnorePatterns": [ "/node_modules/", diff --git a/packages/drawer/src/navigators/__tests__/createDrawerNavigator.test.tsx b/packages/drawer/src/navigators/__tests__/createDrawerNavigator.test.tsx index 630439d5..e8fbdc4f 100644 --- a/packages/drawer/src/navigators/__tests__/createDrawerNavigator.test.tsx +++ b/packages/drawer/src/navigators/__tests__/createDrawerNavigator.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { View } from 'react-native'; import { render } from 'react-native-testing-library'; -import { createAppContainer } from '@react-navigation/native'; +import { createAppContainer } from 'react-navigation'; import createDrawerNavigator from '../createDrawerNavigator'; diff --git a/packages/drawer/src/navigators/createDrawerNavigator.tsx b/packages/drawer/src/navigators/createDrawerNavigator.tsx index 8a6dbdef..b9a1b94a 100644 --- a/packages/drawer/src/navigators/createDrawerNavigator.tsx +++ b/packages/drawer/src/navigators/createDrawerNavigator.tsx @@ -1,7 +1,6 @@ import * as React from 'react'; import { Dimensions, Platform, ScrollView, I18nManager } from 'react-native'; -import { createNavigator, ThemeColors } from '@react-navigation/core'; -import { SafeAreaView } from '@react-navigation/native'; +import { createNavigator, ThemeColors, SafeAreaView } from 'react-navigation'; import DrawerRouter from '../routers/DrawerRouter'; import DrawerView from '../views/DrawerView'; import DrawerItems, { Props } from '../views/DrawerNavigatorItems'; @@ -53,6 +52,9 @@ const DefaultDrawerConfig = { const DrawerNavigator = (routeConfigs: object, config: any = {}) => { const mergedConfig = { ...DefaultDrawerConfig, ...config }; const drawerRouter = DrawerRouter(routeConfigs, mergedConfig); + + // TODO: don't have time to fix it right now + // @ts-ignore const navigator = createNavigator(DrawerView, drawerRouter, mergedConfig); return navigator; }; diff --git a/packages/drawer/src/routers/DrawerRouter.tsx b/packages/drawer/src/routers/DrawerRouter.tsx index d5676097..5984dc21 100644 --- a/packages/drawer/src/routers/DrawerRouter.tsx +++ b/packages/drawer/src/routers/DrawerRouter.tsx @@ -1,19 +1,12 @@ -import { SwitchRouter, NavigationActions } from '@react-navigation/core'; +import { + SwitchRouter, + NavigationActions, + NavigationAction, + NavigationRoute, +} from 'react-navigation'; import * as DrawerActions from './DrawerActions'; -type Route = { - key: string; - index?: number; - routes?: Route[]; -}; - -type Action = { - key: null; - type: string; - willShow: any; -}; - -type State = Route & { +type State = NavigationRoute & { isDrawerOpen?: any; }; @@ -28,7 +21,7 @@ function withDefaultValue(obj: object, key: string, defaultValue: any): any { return obj; } -const getActiveRouteKey = (route: Route): string => { +const getActiveRouteKey = (route: NavigationRoute): string => { if ( route.routes && typeof route.index === 'number' && @@ -61,7 +54,7 @@ export default ( return { ...switchRouter, - getActionCreators(route: Route, navStateKey: string) { + getActionCreators(route: NavigationRoute, navStateKey: string) { return { openDrawer: () => DrawerActions.openDrawer({ key: navStateKey }), closeDrawer: () => DrawerActions.closeDrawer({ key: navStateKey }), @@ -70,7 +63,7 @@ export default ( }; }, - getStateForAction(action: Action, state: State) { + getStateForAction(action: NavigationAction, state?: State) { // Set up the initial state if needed if (!state) { return { diff --git a/packages/drawer/src/routers/__tests__/DrawerRouter.test.tsx b/packages/drawer/src/routers/__tests__/DrawerRouter.test.tsx index c7fe062e..d29bdb94 100644 --- a/packages/drawer/src/routers/__tests__/DrawerRouter.test.tsx +++ b/packages/drawer/src/routers/__tests__/DrawerRouter.test.tsx @@ -3,11 +3,7 @@ import * as React from 'react'; import DrawerRouter from '../DrawerRouter'; -import { - NavigationActions, - SwitchRouter, - StackRouter, -} from '@react-navigation/core'; +import { NavigationActions, SwitchRouter, StackRouter } from 'react-navigation'; import * as DrawerActions from '../../routers/DrawerActions'; const INIT_ACTION = { type: NavigationActions.INIT }; diff --git a/packages/drawer/src/types.tsx b/packages/drawer/src/types.tsx index a077deb2..7079936a 100644 --- a/packages/drawer/src/types.tsx +++ b/packages/drawer/src/types.tsx @@ -1,4 +1,4 @@ -import { DrawerActionType } from './routers/DrawerActions'; +import { NavigationAction } from 'react-navigation'; export type Route = { key: string; @@ -21,9 +21,5 @@ export type Navigation = { }; openDrawer: () => void; closeDrawer: () => void; - dispatch: (action: { - type: DrawerActionType; - key: string; - willShow?: boolean; - }) => void; + dispatch: (action: NavigationAction) => boolean; }; diff --git a/packages/drawer/src/views/DrawerNavigatorItems.tsx b/packages/drawer/src/views/DrawerNavigatorItems.tsx index 9232dbad..026b107e 100644 --- a/packages/drawer/src/views/DrawerNavigatorItems.tsx +++ b/packages/drawer/src/views/DrawerNavigatorItems.tsx @@ -1,7 +1,6 @@ import * as React from 'react'; import { View, Text, StyleSheet, ViewStyle, TextStyle } from 'react-native'; -import { SafeAreaView } from '@react-navigation/native'; -import { ThemeContext } from '@react-navigation/core'; +import { SafeAreaView, ThemeContext } from 'react-navigation'; import TouchableItem from './TouchableItem'; import { Scene, Route } from '../types'; diff --git a/packages/drawer/src/views/DrawerSidebar.tsx b/packages/drawer/src/views/DrawerSidebar.tsx index 11eabc78..70003a46 100644 --- a/packages/drawer/src/views/DrawerSidebar.tsx +++ b/packages/drawer/src/views/DrawerSidebar.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { StyleSheet, View, Animated, ViewStyle } from 'react-native'; -import { NavigationActions } from '@react-navigation/core'; +import { NavigationActions } from 'react-navigation'; import { Props as DrawerNavigatorItemsProps } from './DrawerNavigatorItems'; import { Navigation, Scene, Route } from '../types'; diff --git a/packages/drawer/src/views/DrawerView.tsx b/packages/drawer/src/views/DrawerView.tsx index c496ad2c..89f4ade6 100644 --- a/packages/drawer/src/views/DrawerView.tsx +++ b/packages/drawer/src/views/DrawerView.tsx @@ -1,6 +1,11 @@ import * as React from 'react'; import { Dimensions, StyleSheet, ViewStyle } from 'react-native'; -import { SceneView, ThemeColors, ThemeContext } from '@react-navigation/core'; +import { + SceneView, + ThemeColors, + ThemeContext, + NavigationProp, +} from 'react-navigation'; import { ScreenContainer } from 'react-native-screens'; import * as DrawerActions from '../routers/DrawerActions'; @@ -35,7 +40,7 @@ type Props = { navigation: Navigation; descriptors: { [key: string]: { - navigation: {}; + navigation: NavigationProp; getComponent: () => React.ComponentType<{}>; options: DrawerOptions; }; diff --git a/packages/drawer/src/views/ResourceSavingScene.tsx b/packages/drawer/src/views/ResourceSavingScene.tsx index 6bc82895..f6541437 100644 --- a/packages/drawer/src/views/ResourceSavingScene.tsx +++ b/packages/drawer/src/views/ResourceSavingScene.tsx @@ -2,7 +2,6 @@ import * as React from 'react'; import { Platform, StyleSheet, View } from 'react-native'; - import { Screen, screensEnabled } from 'react-native-screens'; type Props = { diff --git a/packages/drawer/tsconfig.json b/packages/drawer/tsconfig.json index 829640d7..d3a92423 100644 --- a/packages/drawer/tsconfig.json +++ b/packages/drawer/tsconfig.json @@ -18,7 +18,6 @@ "noUnusedLocals": true, "noUnusedParameters": true, "resolveJsonModule": true, - "skipLibCheck": true, "strict": true, "target": "esnext", "plugins": [{ "name": "typescript-tslint-plugin" }] diff --git a/packages/drawer/types/@react-navigation/core.d.ts b/packages/drawer/types/@react-navigation/core.d.ts deleted file mode 100644 index 8e328bdb..00000000 --- a/packages/drawer/types/@react-navigation/core.d.ts +++ /dev/null @@ -1,50 +0,0 @@ -// TODO: properly export types from @react-navigation/core! -declare module '@react-navigation/core' { - import * as React from 'react'; - - export type SupportedThemes = 'light' | 'dark'; - export const ThemeContext: React.Context; - export const ThemeConsumer: ThemeContext.Consumer; - - export interface Theme { - header: string; - headerBorder: string; - body: string; - bodyBorder: string; - bodyContent: string; - bodyContentBorder: string; - label: string; - } - - export const ThemeColors: { [k in SupportedThemes]: Theme }; - - export const SceneView: React.ComponentType<{ - screenProps: unknown; - navigation: object; - component: React.ComponentType; - }>; - - export function createNavigator( - NavigationView: any, - router: any, - navigatorConfig: object - ): React.ComponentType & { router: any }; - - export function withNavigation( - Comp: React.ComponentType - ): React.ComponentType>>; - - export namespace NavigationActions { - export const BACK: any; - export const NAVIGATE: any; - export const INIT: any; - export const setParams: (options: any) => any; - export const navigate: (options: any) => any; - export const back: (options?: any) => any; - export const init: (options?: any) => any; - } - - export function StackRouter(routes: any, config?: any): any; - export function SwitchRouter(routes: any, config?: any): any; - export function TabRouter(routes: any, config?: any): any; -} diff --git a/packages/drawer/types/@react-navigation/native.d.ts b/packages/drawer/types/@react-navigation/native.d.ts deleted file mode 100644 index 91c23259..00000000 --- a/packages/drawer/types/@react-navigation/native.d.ts +++ /dev/null @@ -1 +0,0 @@ -declare module '@react-navigation/native'; diff --git a/packages/drawer/yarn.lock b/packages/drawer/yarn.lock index d56beab2..d33a8442 100644 --- a/packages/drawer/yarn.lock +++ b/packages/drawer/yarn.lock @@ -7349,6 +7349,14 @@ react-native@~0.59.10: xmldoc "^0.4.0" yargs "^9.0.0" +react-navigation@^4.0.1: + version "4.0.1" + resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-4.0.1.tgz#96c17ac90afcf0a5bc957358152326211a79d183" + integrity sha512-6XzuqvhOnY6FA6tCErD6+vfZdnP+O/7hCQper9qDulxxW2ZVkCF4xWdzoVcv3DDR6P5CK6l1tcbJ1ku256AdFQ== + dependencies: + "@react-navigation/core" "^3.5.0" + "@react-navigation/native" "^3.6.2" + react-proxy@^1.1.7: version "1.1.8" resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a"