4.0.0.beta.9 (#2025)

- Enhancement: support inheritance of scene props (useful for `headerMode` attribute for different RN StackNavigator animation) - Fix: attempt to fix react-navigation pushes instead of jumping when user taps the same tab (#2024) - Enhancement: use navBarButtonColor or tintColor or headerTintColor for image button tintcolor (#2028) - Fix: use backBehavior='initialRoute' by default (#2026) - Enhancement: allow right/leftTitle, right/leftButtonImage to be static functions within scene component - Enhancement: allow wrapping all screens and navbar buttons with `wrapBy` parameter for `Router`. It could be `observer` from MobX, or `connect` from Redux or any other function. - Fix: eslint formatting, fix CircleCI build
aksonov · Jul 14, 2017 · f7c45b5 · f7c45b5
1 parent 1526d24
commit f7c45b5
Show file tree

Hide file tree

Showing 12 changed files with 263 additions and 209 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,3 +1,8 @@
 {
-  "presets": ["react-native-stage-0/decorator-support"]
+  "presets": [
+    "react-native"
+  ],
+  "plugins": [
+    "transform-decorators-legacy"
+  ]
 }
diff --git a/Example/yarn.lock b/Example/yarn.lock
@@ -3233,7 +3233,18 @@ [email protected]:
   dependencies:
     react-native-dismiss-keyboard "1.0.0"
 
-react-native-router-flux@^4.0.0-beta.7:
+react-native-router-flux@../:
+  version "4.0.0-beta.9"
+  dependencies:
+    mobx "^3.1.16"
+    mobx-react "^4.2.1"
+    opencollective "^1.0.3"
+    prop-types "^15.5.10"
+    react-native-button "^2.0.0"
+    react-native-router-flux "4.0.0-beta.7"
+    react-navigation "^1.0.0-beta.11"
+
+[email protected]:
   version "4.0.0-beta.7"
   resolved "https://registry.yarnpkg.com/react-native-router-flux/-/react-native-router-flux-4.0.0-beta.7.tgz#51d61dfe6b70df7da97bf96d38b8b13d7ba1c52d"
   dependencies:

diff --git a/circle.yml b/circle.yml
@@ -4,3 +4,7 @@ machine:
 dependencies:
   override:
     - npm install --dev
+test:
+  override:
+    - npm run eslint
+    - npm test
diff --git a/dist/NavBar.js b/dist/NavBar.js
@@ -1,80 +1,4 @@
-Object.defineProperty(exports,"__esModule",{value:true});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};var _jsxFileName='src/NavBar.js';exports.
-
-
-
-
-
-
-
-
-
-
-
-
-renderBackButton=renderBackButton;exports.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-renderLeftButton=renderLeftButton;exports.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+Object.defineProperty(exports,"__esModule",{value:true});exports.RightButton=exports.LeftButton=undefined;var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};var _jsxFileName='src/NavBar.js';exports.
 
 
 
@@ -86,61 +10,134 @@ renderLeftButton=renderLeftButton;exports.
 
 
 
+renderBackButton=renderBackButton;var _react=require('react');var _react2=_interopRequireDefault(_react);var _reactNative=require('react-native');var _navigationStore=require('./navigationStore');var _navigationStore2=_interopRequireDefault(_navigationStore);var _back_chevron=require('../images/back_chevron.png');var _back_chevron2=_interopRequireDefault(_back_chevron);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function renderBackButton(state){
+var textButtonStyle=[
+styles.barBackButtonText,
+state.backButtonTextStyle];
 
+var style=[
+styles.backButton,
+state.leftButtonStyle];
 
+var buttonImage=state.backButtonImage||_back_chevron2.default;
+var onPress=state.onBack;
+if(onPress){
+onPress=onPress.bind(null,state);
+}else{
+onPress=_navigationStore2.default.pop;
+}
 
+var text=state.backTitle?
+_react2.default.createElement(_reactNative.Text,{style:textButtonStyle,__source:{fileName:_jsxFileName,lineNumber:31}},
+state.backTitle):
 
+null;
 
+return(
+_react2.default.createElement(_reactNative.TouchableOpacity,{
+testID:'backNavButton',
+style:{position:'absolute',top:0,left:0,height:50,width:70},
+onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:37}},
 
+_react2.default.createElement(_reactNative.View,{style:style,__source:{fileName:_jsxFileName,lineNumber:42}},
+buttonImage&&!state.hideBackImage&&_react2.default.createElement(_reactNative.Image,{
+source:buttonImage,
+style:[
+styles.backButtonImage,
+state.barButtonIconStyle,
+state.leftButtonIconStyle],__source:{fileName:_jsxFileName,lineNumber:43}}),
 
 
 
+text)));
 
 
 
+}
 
+var LeftButton=exports.LeftButton=function LeftButton(state){
+var onPress=state.onLeft;
+var buttonImage=getValue(state.leftButtonImage,state);
+var menuIcon=state.drawerIcon;
+var style=[styles.leftButton,state.leftButtonStyle];
+var textStyle=[styles.barLeftButtonText,state.leftButtonTextStyle];
+var leftButtonStyle=[styles.defaultImageStyle,state.leftButtonIconStyle];
+var leftTitle=state.getLeftTitle?state.getLeftTitle(state):getValue(state.leftTitle,state);
+var tintColor=state.tintColor||state.navBarButtonColor||state.headerTintColor;
+
+if(state.leftButton){
+var Button=state.leftButton||state.left;
+return(
+_react2.default.createElement(Button,_extends({},
+state,{
+key:'leftNavBarBtn',
+testID:'leftNavButton',
+style:[].concat(style,leftButtonStyle),
+textStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:71}})));
 
 
+}
 
+if(onPress&&(leftTitle||buttonImage)){
+onPress=onPress.bind(null,state);
+return(
+_react2.default.createElement(_reactNative.TouchableOpacity,{
+key:'leftNavBarBtn',
+testID:'leftNavButton',
+style:style,
+onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:84}},
 
+leftTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:90}},
+leftTitle),
 
 
+!leftTitle&&buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-start'},__source:{fileName:_jsxFileName,lineNumber:94}},
+menuIcon||_react2.default.createElement(_reactNative.Image,{
+source:buttonImage,
+style:[state.leftButtonIconStyle||styles.defaultImageStyle,{tintColor:tintColor}],__source:{fileName:_jsxFileName,lineNumber:95}}))));
 
 
 
 
 
 
+}
+if(!!state.onLeft^!!(leftTitle||buttonImage)){
+console.warn('Both onLeft and leftTitle/leftButtonImage\n            must be specified for the scene: '+
 
+state.name);
 
+}
+return null;
+};
 
+function getValue(value,params){
+return value instanceof Function?value(params):value;
+}
 
-renderRightButton=renderRightButton;var _react=require('react');var _react2=_interopRequireDefault(_react);var _reactNative=require('react-native');var _navigationStore=require('./navigationStore');var _navigationStore2=_interopRequireDefault(_navigationStore);var _back_chevron=require('../images/back_chevron.png');var _back_chevron2=_interopRequireDefault(_back_chevron);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function renderBackButton(state){var textButtonStyle=[styles.barBackButtonText,state.backButtonTextStyle];var style=[styles.backButton,state.leftButtonStyle];var buttonImage=state.backButtonImage||_back_chevron2.default;var onPress=state.onBack;if(onPress){onPress=onPress.bind(null,state);}else{onPress=_navigationStore2.default.pop;}var text=state.backTitle?_react2.default.createElement(_reactNative.Text,{style:textButtonStyle,__source:{fileName:_jsxFileName,lineNumber:32}},state.backTitle):null;return _react2.default.createElement(_reactNative.TouchableOpacity,{testID:'backNavButton',style:{position:'absolute',top:0,left:0,height:50,width:70},onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:38}},_react2.default.createElement(_reactNative.View,{style:style,__source:{fileName:_jsxFileName,lineNumber:43}},buttonImage&&!state.hideBackImage&&_react2.default.createElement(_reactNative.Image,{source:buttonImage,style:[styles.backButtonImage,state.barButtonIconStyle,state.leftButtonIconStyle],__source:{fileName:_jsxFileName,lineNumber:44}}),text));}function renderLeftButton(state,wrapBy){var onPress=state.onLeft;var buttonImage=state.leftButtonImage;var menuIcon=state.drawerIcon;var style=[styles.leftButton,state.leftButtonStyle];var textStyle=[styles.barLeftButtonText,state.leftButtonTextStyle];var leftButtonStyle=[styles.defaultImageStyle,state.leftButtonIconStyle];var leftTitle=state.getLeftTitle?state.getLeftTitle(state):state.leftTitle;if(state.leftButton){var Button=state.leftButton;if(wrapBy){Button=wrapBy(Button);}return _react2.default.createElement(Button,_extends({},state,{key:'leftNavBarBtn',testID:'leftNavButton',style:[].concat(style,leftButtonStyle),textStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:74}}));}if(onPress&&(leftTitle||buttonImage)){onPress=onPress.bind(null,state);return _react2.default.createElement(_reactNative.TouchableOpacity,{key:'leftNavBarBtn',testID:'leftNavButton',style:style,onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:87}},leftTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:93}},leftTitle),!leftTitle&&buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-start'},__source:{fileName:_jsxFileName,lineNumber:97}},menuIcon||_react2.default.createElement(_reactNative.Image,{source:buttonImage,style:state.leftButtonIconStyle||styles.defaultImageStyle,__source:{fileName:_jsxFileName,lineNumber:98}})));}if(!!state.onLeft^!!(leftTitle||buttonImage)){console.warn('Both onLeft and leftTitle/leftButtonImage\n            must be specified for the scene: '+state.name);}return null;}function renderRightButton(state,wrapBy){
+var RightButton=exports.RightButton=function RightButton(state){
 var drawer=null;
 if(!state){
 return null;
 }
 
 var onPress=state.onRight;
-var buttonImage=state.rightButtonImage;
+var buttonImage=getValue(state.rightButtonImage,state);
 var menuIcon=state.drawerIcon;
 var style=[styles.rightButton,state.rightButtonStyle];
 var textStyle=[styles.barRightButtonText,state.rightButtonTextStyle];
 var rightButtonStyle=[styles.defaultImageStyle,state.rightButtonIconStyle];
-var rightTitle=state.getRightTitle?state.getRightTitle(state):state.rightTitle;
+var rightTitle=state.getRightTitle?state.getRightTitle(state):getValue(state.rightTitle,state);
 
-if(state.rightButton){
-var Button=state.rightButton;
-if(wrapBy){
-Button=wrapBy(Button);
-}
+if(state.rightButton||state.right){
+var Button=state.rightButton||state.right;
 return(
 _react2.default.createElement(Button,_extends({},
 state,{
 key:'rightNavBarBtn',
 testID:'rightNavButton',
 style:style,
-textButtonStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:138}})));
+textButtonStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:135}})));
 
 
 }
@@ -154,7 +151,7 @@ if(!menuIcon){
 menuIcon=
 _react2.default.createElement(_reactNative.Image,{
 source:buttonImage,
-style:rightButtonStyle,__source:{fileName:_jsxFileName,lineNumber:155}});
+style:rightButtonStyle,__source:{fileName:_jsxFileName,lineNumber:152}});
 
 
 }
@@ -167,16 +164,16 @@ _react2.default.createElement(_reactNative.TouchableOpacity,{
 key:'rightNavBarBtn',
 testID:'rightNavButton',
 style:style,
-onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:166}},
+onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:163}},
 
-rightTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:172}},
+rightTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:169}},
 rightTitle),
 
 
-buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-end'},__source:{fileName:_jsxFileName,lineNumber:176}},
+!rightTitle&&buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-end'},__source:{fileName:_jsxFileName,lineNumber:173}},
 menuIcon||_react2.default.createElement(_reactNative.Image,{
 source:buttonImage,
-style:state.rightButtonIconStyle||styles.defaultImageStyle,__source:{fileName:_jsxFileName,lineNumber:177}}))));
+style:state.rightButtonIconStyle||styles.defaultImageStyle,__source:{fileName:_jsxFileName,lineNumber:174}}))));
 
 
 
@@ -192,9 +189,7 @@ state.name);
 
 }
 return null;
-}
-
-
+};
 var styles=_reactNative.StyleSheet.create({
 title:{
 textAlign:'center',