Skip to content

Commit f7c45b5

Browse files
authored
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
1 parent 1526d24 commit f7c45b5

File tree

12 files changed

+263
-209
lines changed

12 files changed

+263
-209
lines changed

.babelrc

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
11
{
2-
"presets": ["react-native-stage-0/decorator-support"]
2+
"presets": [
3+
"react-native"
4+
],
5+
"plugins": [
6+
"transform-decorators-legacy"
7+
]
38
}

Example/yarn.lock

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3233,7 +3233,18 @@ [email protected]:
32333233
dependencies:
32343234
react-native-dismiss-keyboard "1.0.0"
32353235

3236-
react-native-router-flux@^4.0.0-beta.7:
3236+
react-native-router-flux@../:
3237+
version "4.0.0-beta.9"
3238+
dependencies:
3239+
mobx "^3.1.16"
3240+
mobx-react "^4.2.1"
3241+
opencollective "^1.0.3"
3242+
prop-types "^15.5.10"
3243+
react-native-button "^2.0.0"
3244+
react-native-router-flux "4.0.0-beta.7"
3245+
react-navigation "^1.0.0-beta.11"
3246+
3247+
32373248
version "4.0.0-beta.7"
32383249
resolved "https://registry.yarnpkg.com/react-native-router-flux/-/react-native-router-flux-4.0.0-beta.7.tgz#51d61dfe6b70df7da97bf96d38b8b13d7ba1c52d"
32393250
dependencies:

circle.yml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,7 @@ machine:
44
dependencies:
55
override:
66
- npm install --dev
7+
test:
8+
override:
9+
- npm run eslint
10+
- npm test

dist/NavBar.js

Lines changed: 89 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,4 @@
1-
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.
2-
3-
4-
5-
6-
7-
8-
9-
10-
11-
12-
13-
14-
renderBackButton=renderBackButton;exports.
15-
16-
17-
18-
19-
20-
21-
22-
23-
24-
25-
26-
27-
28-
29-
30-
31-
32-
33-
34-
35-
36-
37-
38-
39-
40-
41-
42-
43-
44-
45-
46-
47-
48-
49-
50-
51-
52-
53-
54-
55-
56-
57-
58-
59-
renderLeftButton=renderLeftButton;exports.
60-
61-
62-
63-
64-
65-
66-
67-
68-
69-
70-
71-
72-
73-
74-
75-
76-
77-
1+
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.
782

793

804

@@ -86,61 +10,134 @@ renderLeftButton=renderLeftButton;exports.
8610

8711

8812

13+
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){
14+
var textButtonStyle=[
15+
styles.barBackButtonText,
16+
state.backButtonTextStyle];
8917

18+
var style=[
19+
styles.backButton,
20+
state.leftButtonStyle];
9021

22+
var buttonImage=state.backButtonImage||_back_chevron2.default;
23+
var onPress=state.onBack;
24+
if(onPress){
25+
onPress=onPress.bind(null,state);
26+
}else{
27+
onPress=_navigationStore2.default.pop;
28+
}
9129

30+
var text=state.backTitle?
31+
_react2.default.createElement(_reactNative.Text,{style:textButtonStyle,__source:{fileName:_jsxFileName,lineNumber:31}},
32+
state.backTitle):
9233

34+
null;
9335

36+
return(
37+
_react2.default.createElement(_reactNative.TouchableOpacity,{
38+
testID:'backNavButton',
39+
style:{position:'absolute',top:0,left:0,height:50,width:70},
40+
onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:37}},
9441

42+
_react2.default.createElement(_reactNative.View,{style:style,__source:{fileName:_jsxFileName,lineNumber:42}},
43+
buttonImage&&!state.hideBackImage&&_react2.default.createElement(_reactNative.Image,{
44+
source:buttonImage,
45+
style:[
46+
styles.backButtonImage,
47+
state.barButtonIconStyle,
48+
state.leftButtonIconStyle],__source:{fileName:_jsxFileName,lineNumber:43}}),
9549

9650

9751

52+
text)));
9853

9954

10055

56+
}
10157

58+
var LeftButton=exports.LeftButton=function LeftButton(state){
59+
var onPress=state.onLeft;
60+
var buttonImage=getValue(state.leftButtonImage,state);
61+
var menuIcon=state.drawerIcon;
62+
var style=[styles.leftButton,state.leftButtonStyle];
63+
var textStyle=[styles.barLeftButtonText,state.leftButtonTextStyle];
64+
var leftButtonStyle=[styles.defaultImageStyle,state.leftButtonIconStyle];
65+
var leftTitle=state.getLeftTitle?state.getLeftTitle(state):getValue(state.leftTitle,state);
66+
var tintColor=state.tintColor||state.navBarButtonColor||state.headerTintColor;
67+
68+
if(state.leftButton){
69+
var Button=state.leftButton||state.left;
70+
return(
71+
_react2.default.createElement(Button,_extends({},
72+
state,{
73+
key:'leftNavBarBtn',
74+
testID:'leftNavButton',
75+
style:[].concat(style,leftButtonStyle),
76+
textStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:71}})));
10277

10378

79+
}
10480

81+
if(onPress&&(leftTitle||buttonImage)){
82+
onPress=onPress.bind(null,state);
83+
return(
84+
_react2.default.createElement(_reactNative.TouchableOpacity,{
85+
key:'leftNavBarBtn',
86+
testID:'leftNavButton',
87+
style:style,
88+
onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:84}},
10589

90+
leftTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:90}},
91+
leftTitle),
10692

10793

94+
!leftTitle&&buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-start'},__source:{fileName:_jsxFileName,lineNumber:94}},
95+
menuIcon||_react2.default.createElement(_reactNative.Image,{
96+
source:buttonImage,
97+
style:[state.leftButtonIconStyle||styles.defaultImageStyle,{tintColor:tintColor}],__source:{fileName:_jsxFileName,lineNumber:95}}))));
10898

10999

110100

111101

112102

113103

104+
}
105+
if(!!state.onLeft^!!(leftTitle||buttonImage)){
106+
console.warn('Both onLeft and leftTitle/leftButtonImage\n must be specified for the scene: '+
114107

108+
state.name);
115109

110+
}
111+
return null;
112+
};
116113

114+
function getValue(value,params){
115+
return value instanceof Function?value(params):value;
116+
}
117117

118-
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){
118+
var RightButton=exports.RightButton=function RightButton(state){
119119
var drawer=null;
120120
if(!state){
121121
return null;
122122
}
123123

124124
var onPress=state.onRight;
125-
var buttonImage=state.rightButtonImage;
125+
var buttonImage=getValue(state.rightButtonImage,state);
126126
var menuIcon=state.drawerIcon;
127127
var style=[styles.rightButton,state.rightButtonStyle];
128128
var textStyle=[styles.barRightButtonText,state.rightButtonTextStyle];
129129
var rightButtonStyle=[styles.defaultImageStyle,state.rightButtonIconStyle];
130-
var rightTitle=state.getRightTitle?state.getRightTitle(state):state.rightTitle;
130+
var rightTitle=state.getRightTitle?state.getRightTitle(state):getValue(state.rightTitle,state);
131131

132-
if(state.rightButton){
133-
var Button=state.rightButton;
134-
if(wrapBy){
135-
Button=wrapBy(Button);
136-
}
132+
if(state.rightButton||state.right){
133+
var Button=state.rightButton||state.right;
137134
return(
138135
_react2.default.createElement(Button,_extends({},
139136
state,{
140137
key:'rightNavBarBtn',
141138
testID:'rightNavButton',
142139
style:style,
143-
textButtonStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:138}})));
140+
textButtonStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:135}})));
144141

145142

146143
}
@@ -154,7 +151,7 @@ if(!menuIcon){
154151
menuIcon=
155152
_react2.default.createElement(_reactNative.Image,{
156153
source:buttonImage,
157-
style:rightButtonStyle,__source:{fileName:_jsxFileName,lineNumber:155}});
154+
style:rightButtonStyle,__source:{fileName:_jsxFileName,lineNumber:152}});
158155

159156

160157
}
@@ -167,16 +164,16 @@ _react2.default.createElement(_reactNative.TouchableOpacity,{
167164
key:'rightNavBarBtn',
168165
testID:'rightNavButton',
169166
style:style,
170-
onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:166}},
167+
onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:163}},
171168

172-
rightTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:172}},
169+
rightTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:169}},
173170
rightTitle),
174171

175172

176-
buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-end'},__source:{fileName:_jsxFileName,lineNumber:176}},
173+
!rightTitle&&buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-end'},__source:{fileName:_jsxFileName,lineNumber:173}},
177174
menuIcon||_react2.default.createElement(_reactNative.Image,{
178175
source:buttonImage,
179-
style:state.rightButtonIconStyle||styles.defaultImageStyle,__source:{fileName:_jsxFileName,lineNumber:177}}))));
176+
style:state.rightButtonIconStyle||styles.defaultImageStyle,__source:{fileName:_jsxFileName,lineNumber:174}}))));
180177

181178

182179

@@ -192,9 +189,7 @@ state.name);
192189

193190
}
194191
return null;
195-
}
196-
197-
192+
};
198193
var styles=_reactNative.StyleSheet.create({
199194
title:{
200195
textAlign:'center',

0 commit comments

Comments
 (0)