@brightlayer-ui/react-native-template-routing-typescript 2.1.0 → 2.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +17 -0
  3. package/dependencies.json +6 -6
  4. package/package.json +3 -3
  5. package/template/App.tsx +1 -0
  6. package/template/src/navigation/index.tsx +5 -3
  7. package/template/src/navigation/navigation-drawer.tsx +3 -2
  8. package/template/src/screens/home.tsx +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # Changelog
2
2
 
3
+ ## v2.2.0 (December 6, 2023)
4
+
5
+ ### Changed
6
+
7
+ - Update dependency package list to support latest `@react-native-reanimated` package.
8
+
3
9
  ## v2.1.0 (November 1, 2022)
4
10
 
5
11
  ### Changed
package/README.md CHANGED
@@ -24,4 +24,21 @@ Projects created using this template will start out with the following file stru
24
24
  └── /router
25
25
  |── index.tsx // sets up routing
26
26
  └── navigation-drawer.tsx // sets up Drawer
27
+ ```
28
+
29
+ ## Clear Metro bundler cache (recommended)
30
+
31
+ Run the command into the root of the created project.
32
+ ```sh
33
+ yarn start --reset-cache
34
+ ```
35
+
36
+ ### Android
37
+ This template supports the latest version of the react-native-reanimated package, which needs to reinstall the NDK module from Android Studio. You can do this via Android Studio: Go to Tools -> SDK Manager -> SDK Tools. And Reinstall or install `23.1.7779620` NDK version.
38
+
39
+ ### iOS
40
+
41
+ Make sure to install pods first before running the app.
42
+ ```sh
43
+ cd ios && pod install && cd ..
27
44
  ```
package/dependencies.json CHANGED
@@ -10,14 +10,14 @@
10
10
  "react-native-vector-icons@^9.2.0",
11
11
  "react-native-svg@^12.1.0",
12
12
  "react-native-svg-transformer@^0.14.3",
13
- "react-native-safe-area-context@^3.2.0",
13
+ "react-native-safe-area-context@^4.7.4",
14
14
  "@react-native-community/masked-view@^0.1.10",
15
- "@react-navigation/drawer@^5.12.3",
16
- "@react-navigation/native@^5.9.3",
15
+ "@react-navigation/drawer@^6.6.6",
16
+ "@react-navigation/native@^6.1.9",
17
17
  "@react-navigation/stack@^5.14.3",
18
- "react-native-gesture-handler@^1.10.3",
19
- "react-native-reanimated@^2.0.0",
20
- "react-native-screens@^3.0.0"
18
+ "react-native-gesture-handler@^2.13.4",
19
+ "react-native-reanimated@^3.5.4",
20
+ "react-native-screens@^3.27.0"
21
21
  ],
22
22
  "devDependencies": ["@types/react-native-vector-icons", "jest-transform-stub"]
23
23
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brightlayer-ui/react-native-template-routing-typescript",
3
- "version": "2.1.0",
3
+ "version": "2.2.0",
4
4
  "author": "brightlayer-ui <brightlayer-ui@eaton.com>",
5
5
  "keywords": [
6
6
  "react native",
@@ -11,7 +11,7 @@
11
11
  "description": "A template with pre-configured routing for React Native projects created with the Brightlayer UI CLI.",
12
12
  "repository": {
13
13
  "type": "git",
14
- "url": "https://github.com/brightlayer-ui/react-native-cli-templates.git"
14
+ "url": "https://github.com/etn-ccis/blui-react-native-cli-templates.git"
15
15
  },
16
16
  "scripts": {
17
17
  "publish:package": "set npm_config_yes=true && npx -p @brightlayer-ui/publish blui-publish",
@@ -22,6 +22,6 @@
22
22
  "node": ">=10"
23
23
  },
24
24
  "bugs": {
25
- "url": "https://github.com/brightlayer-ui/react-native-cli-templates/issues"
25
+ "url": "https://github.com/etn-ccis/blui-react-native-cli-templates/issues"
26
26
  }
27
27
  }
package/template/App.tsx CHANGED
@@ -5,6 +5,7 @@
5
5
 
6
6
  This code is licensed under the BSD-3 license found in the LICENSE file in the root directory of this source tree and at https://opensource.org/licenses/BSD-3-Clause.
7
7
  **/
8
+ import 'react-native-gesture-handler';
8
9
  import React from 'react';
9
10
  import { Provider as ThemeProvider } from 'react-native-paper';
10
11
  import { SafeAreaProvider } from 'react-native-safe-area-context';
package/template/src/navigation/index.tsx CHANGED
@@ -2,7 +2,7 @@ import React, { ReactNode } from 'react';
2
2
  import { NavigationContainer } from '@react-navigation/native';
3
3
  import { createDrawerNavigator } from '@react-navigation/drawer';
4
4
  import { View } from 'react-native';
5
- import { NavDrawerProps, NavigationDrawer } from './navigation-drawer';
5
+ import { NavigationDrawer } from './navigation-drawer';
6
6
  import { createStackNavigator } from '@react-navigation/stack';
7
7
  import Home from '../screens/home';
8
8
  import PageOne from '../screens/pageOne';
@@ -29,8 +29,10 @@ export const MainRouter = (): any => (
29
29
  <NavigationContainer>
30
30
  <Drawer.Navigator
31
31
  initialRouteName="Home"
32
- drawerStyle={{ backgroundColor: 'transparent', width: 300, maxWidth: '80%' }}
33
- drawerContent={(props: NavDrawerProps): ReactNode => <CustomDrawerContent {...props} />}
32
+ screenOptions={{
33
+ headerShown: false,
34
+ }}
35
+ drawerContent={(props: any): ReactNode => <CustomDrawerContent {...props} />}
34
36
  >
35
37
  <RootStack.Screen name="Home" component={Home} />
36
38
  <RootStack.Screen name="PageOne" component={PageOne} />
package/template/src/navigation/navigation-drawer.tsx CHANGED
@@ -3,6 +3,7 @@ import React, { useState, useCallback } from 'react';
3
3
  import * as Colors from '@brightlayer-ui/colors';
4
4
  import { StackNavigationProp } from '@react-navigation/stack';
5
5
  import { RootStackParamList } from './index';
6
+ import { DrawerActions } from '@react-navigation/native';
6
7
 
7
8
  export const navGroupItems: NavItem[] = [
8
9
  {
@@ -29,7 +30,7 @@ export type NavDrawerProps = {
29
30
  export const NavigationDrawer: React.FC<NavDrawerProps> = ({ navigation }) => {
30
31
  const [selected, setSelected] = useState('Home');
31
32
  const selectItem = useCallback(
32
- (id) => {
33
+ (id: any) => {
33
34
  navigation.navigate(id);
34
35
  setSelected(id);
35
36
  },
@@ -44,7 +45,7 @@ export const NavigationDrawer: React.FC<NavDrawerProps> = ({ navigation }) => {
44
45
  fontColor={Colors.white[50]}
45
46
  icon={{ name: 'menu' }}
46
47
  onIconPress={(): void => {
47
- navigation.closeDrawer();
48
+ navigation.dispatch(DrawerActions.closeDrawer());
48
49
  }}
49
50
  />
50
51
  <DrawerBody>
package/template/src/screens/home.tsx CHANGED
@@ -142,10 +142,10 @@ const Home: React.FC<AppProps> = ({ navigation }): JSX.Element => {
142
142
  title={'React Native Component Library'}
143
143
  url={'https://brightlayer-ui-components.github.io/react-native/'}
144
144
  />
145
- <OpenURLButton title={'Visit Us on GitHub'} url={'https://github.com/brightlayer-ui'} />
145
+ <OpenURLButton title={'Visit Us on GitHub'} url={'https://github.com/etn-ccis?q=blui'} />
146
146
  <OpenURLButton
147
147
  title={'Design Pattern Source on GitHub'}
148
- url={'https://github.com/brightlayer-ui/react-native-design-patterns'}
148
+ url={'https://github.com/etn-ccis/blui-react-native-design-patterns'}
149
149
  />
150
150
  <OpenURLButton title={'Release Roadmap'} url={'https://brightlayer-ui.github.io/roadmap'} />
151
151
  <OpenURLButton