react-native-material-bottom-navigation - npm Package Compare versions

Comparing version 0.3.0 to 0.3.1

lib/NavigationComponent.js

@@ -22,3 +22,5 @@ /**
   style?: any,
-  bottomNavigationOptions: any
+  bottomNavigationOptions: any,
+  activeTintColor?: string,
+  inactiveTintColor?: string
 }
@@ -31,2 +33,4 @@
     const {
+      activeTintColor,
+      inactiveTintColor,
       navigationState,
@@ -41,2 +45,4 @@ bottomNavigationOptions,
 
+    const bnOptions = bottomNavigationOptions || {}
+
     // Support for earlier version of react-navigation (up to 1.0.0-beta5)
@@ -46,12 +52,12 @@ const getLabel = navigationGetLabel || navigationGetLabelOld
     // BottomNavigation's style
-    const { style: bnStyle } = bottomNavigationOptions
+    const { style: bnStyle } = bnOptions
 
     // Builded props for BottomNavigation
     const bnProps = {
-      labelColor: bottomNavigationOptions.labelColor,
-      activeLabelColor: bottomNavigationOptions.activeLabelColor,
-      rippleColor: bottomNavigationOptions.rippleColor,
-      backgroundColor: bottomNavigationOptions.backgroundColor,
+      labelColor: bnOptions.labelColor,
+      activeLabelColor: bnOptions.activeLabelColor,
+      rippleColor: bnOptions.rippleColor,
+      backgroundColor: bnOptions.backgroundColor,
       __hideWarningForUsingTooManyTabs:
-        bottomNavigationOptions.__hideWarningForUsingTooManyTabs
+        bnOptions.__hideWarningForUsingTooManyTabs
     }
@@ -74,3 +80,8 @@
           // scene object for `getLabel` and `renderIcon`
-          const scene = { route, index, focused }
+          const scene = {
+            route,
+            index,
+            focused,
+            tintColor: focused ? activeTintColor : inactiveTintColor
+          }
           const label = getLabel(scene)
@@ -80,3 +91,3 @@ const icon = renderIcon(scene)
           // Prepare props for the tabs
-          const tabs = bottomNavigationOptions.tabs || {}
+          const tabs = bnOptions.tabs || {}
           const tabOptions = tabs[route.key] || {}
@@ -83,0 +94,0 @@ const tabProps = {

package.json

 {
   "name": "react-native-material-bottom-navigation",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "JS Implementation of the Material Design Guidelines' Bottom Navigation for react-native",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -197,3 +197,3 @@ # Material Design Bottom Navigation for react-native
           barBackgroundColor: '#EEEEEE',
-          rippleColor: 'black', // like in the standalone version, this will override the already specified `rippleColor` for this tab
+          labelColor: '#434343', // like in the standalone version, this will override the already specified `labelColor` for this tab
           activeLabelColor: '#212121',
@@ -200,0 +200,0 @@ activeIcon: <Icon size={24} color="#212121" name="newsstand" />

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

40581

increased by0.44%

Lines of code

863

increased by1.17%

No dependency changes