Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 49d5c87

Browse files
Added missing options props (#35)
* update bottomTabs options and props * update stack options and props * update materialTopTabs options and props * type MaterialTopTabBar * descriptors MaterialTopTabBar * SceneRendererProps MaterialTopTabBar * clean MaterialTopTabBar * fix tabBar as function * fix2 tabBar as function * fix3 tabBar as function * Stack headerBackgroundOptions * update peerdependencies
1 parent f895fec commit 49d5c87

File tree

5 files changed

+101
-50
lines changed

5 files changed

+101
-50
lines changed

‎package.json‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,12 @@
22
"name": "reason-react-navigation",
33
"version": "5.0.0-beta.0",
44
"peerDependencies": {
5-
"@react-navigation/core": "^5.0.0",
5+
"@react-navigation/native": "^5.0.0",
6+
"@react-navigation/bottom-tabs": "^5.0.0",
7+
"@react-navigation/stack": "^5.0.0",
8+
"@react-navigation/material-top-tabs": "^5.0.0",
9+
"@react-navigation/material-bottom-tabs": "^5.0.0",
10+
"@react-navigation/drawer": "^5.0.0",
611
"reason-react": "^0.7.0",
712
"reason-react-native": "^0.61.0"
813
},

‎src/BottomTabs.re‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,6 @@ module Make = (M: {type params;}) => {
3939
pub inactiveBackgroundColor: option(string);
4040
pub allowFontScaling: option(bool);
4141
pub showLabel: option(bool);
42-
pub showIcon: option(bool);
4342
pub labelStyle: option(ReactNative.Style.t);
4443
pub tabStyle: option(ReactNative.Style.t);
4544
pub labelPosition: option(labelPositionArgs => string);
@@ -120,7 +119,8 @@ module Make = (M: {type params;}) => {
120119
~tabBarAccessibilityLabel: string=?,
121120
~tabBarTestID: string=?,
122121
~tabBarVisible: bool=?,
123-
~tabBarButtonComponent: React.element=?,
122+
~tabBarButton: React.element=?,
123+
~unmountOnBlur: bool=?,
124124
unit
125125
) =>
126126
options;
@@ -135,8 +135,9 @@ module Make = (M: {type params;}) => {
135135
type navigatorProps = {
136136
initialRouteName: option(string),
137137
screenOptions: option(optionsCallback),
138+
backBehavior: option(string),
138139
_lazy: option(bool),
139-
tabBar: option(React.component(Js.t(bottomTabBarProps))),
140+
tabBar: option(Js.t(bottomTabBarProps) => React.element),
140141
tabBarOptions: option(bottomTabBarOptions),
141142
};
142143

@@ -211,8 +212,15 @@ module Make = (M: {type params;}) => {
211212
~initialRouteName: string=?,
212213
~screenOptions: optionsCallback=?,
213214
~children: React.element,
215+
~backBehavior: [@bs.string] [
216+
| `initialRoute
217+
| `order
218+
| `history
219+
| `none
220+
]
221+
=?,
214222
~_lazy: bool=?,
215-
~tabBar: React.component(Js.t(bottomTabBarProps))=?,
223+
~tabBar: Js.t(bottomTabBarProps) => React.element=?,
216224
~tabBarOptions: bottomTabBarOptions=?,
217225
unit
218226
) =>

‎src/MaterialTopTabs.bs.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,14 @@ function Make(M) {
2222
var $$Navigator = {
2323
make: make2ドル
2424
};
25+
var MaterialTopTabBar = { };
2526
return {
2627
Navigation: Navigation,
2728
materialTopTabs: materialTopTabs,
2829
$$Screen: $$Screen,
2930
ScreenWithCallback: ScreenWithCallback,
30-
$$Navigator: $$Navigator
31+
$$Navigator: $$Navigator,
32+
MaterialTopTabBar: MaterialTopTabBar
3133
};
3234
}
3335

‎src/MaterialTopTabs.re‎

Lines changed: 73 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -30,33 +30,25 @@ module Make = (M: {type params;}) => {
3030
type animatedNode = ReactNative.Animated.Value.t;
3131

3232
type scene = {
33-
.
34-
"route": route,
35-
"focused": bool,
36-
"tintColor": string,
33+
focused: bool,
34+
color: string,
3735
};
3836

37+
type descriptors;
38+
3939
class type virtual tabBar = {
4040
pub scrollEnabled: option(bool);
41-
pub bounces: option(bool);
4241
//pub navigationState: navigationState(M.params);
4342
//pub activeColor: option(string);
4443
//pub inactiveColor: option(string);
4544
pub pressColor: option(string);
4645
pub pressOpacity: option(float);
47-
//pub getLabelText: scene => Js.nullable(string);
48-
pub getAccessible: scene => Js.nullable(bool);
49-
//pub getAccessibilityLabel: scene => Js.nullable(string);
50-
//pub getTestID: scene => Js.nullable(string);
5146
//TODO: render: https://github.com/react-native-community/react-native-tab-view/blob/64e03bf14b0fac9c3bccd684bf31a04ecf19c50d/src/TabBar.tsx#L38-L51
52-
//pub onTabPress: option(scene => unit);
53-
//pub onTabLongPress: option(scene => unit);
5447
pub tabStyle: option(ReactNative.Style.t);
5548
pub indicatorStyle: option(ReactNative.Style.t);
56-
pub indicatorContainerStyle: option(ReactNative.Style.t);
5749
pub labelStyle: option(ReactNative.Style.t);
58-
pub contentContainerStyle: option(ReactNative.Style.t);
5950
pub style: option(ReactNative.Style.t);
51+
pub renderIndicator: option(React.component({. "route": route}));
6052
};
6153

6254
class type virtual materialTopTabBarOptions = {
@@ -67,7 +59,6 @@ module Make = (M: {type params;}) => {
6759
pub iconStyle: option(ReactNative.Style.t);
6860
pub showLabel: option(bool);
6961
pub showIcon: option(bool);
70-
pub upperCaseLabel: option(bool);
7162
pub allowFontScaling: option(bool);
7263
};
7364

@@ -81,21 +72,11 @@ module Make = (M: {type params;}) => {
8172
constraint 'self = #materialTopTabBarOptions;
8273
pub state: navigationState(M.params);
8374
pub navigation: navigation;
84-
//pub getLabelText: routeOptions => ...;
85-
pub getAccessibilityLabel: routeOptions => Js.nullable(string);
86-
pub getTestID: routeOptions => Js.nullable(string);
87-
pub onTabPress:
88-
{
89-
.
90-
"route": route,
91-
[@bs.meth] "preventDefault": unit => unit,
92-
} =>
93-
unit;
94-
pub onTabLongPress: routeOptions => unit;
95-
pub tabBarPosition: string; //`top | `bottom
96-
//SceneRendererProps
75+
pub descriptors: descriptors;
76+
// SceneRendererProps from react-native-tab-view
9777
pub layout: layout;
9878
pub position: animatedNode;
79+
pub jumpTo: string => unit;
9980
};
10081

10182
[@bs.obj]
@@ -106,19 +87,15 @@ module Make = (M: {type params;}) => {
10687
~iconStyle: ReactNative.Style.t=?,
10788
~showLabel: bool=?,
10889
~showIcon: bool=?,
109-
~upperCaseLabel: bool=?,
11090
~allowFontScaling: bool=?,
11191
~scrollEnabled: bool=?,
112-
~bounces: bool=?,
11392
~pressColor: string=?,
11493
~pressOpacity: float=?,
115-
~getAccessible: Js.nullable(bool)=?,
11694
~tabStyle: ReactNative.Style.t=?,
11795
~indicatorStyle: ReactNative.Style.t=?,
118-
~indicatorContainerStyle: ReactNative.Style.t=?,
11996
~labelStyle: ReactNative.Style.t=?,
120-
~contentContainerStyle: ReactNative.Style.t=?,
12197
~style: ReactNative.Style.t=?,
98+
~renderIndicator: React.component({. "route": route})=?,
12299
unit
123100
) =>
124101
materialTopTabBarOptions;
@@ -133,7 +110,6 @@ module Make = (M: {type params;}) => {
133110
~tabBarIcon: scene => React.element=?,
134111
~tabBarAccessibilityLabel: string=?,
135112
~tabBarTestID: string=?,
136-
~tabBarVisible: bool=?,
137113
unit
138114
) =>
139115
options;
@@ -148,16 +124,19 @@ module Make = (M: {type params;}) => {
148124
type navigatorProps = {
149125
initialRouteName: option(string),
150126
screenOptions: option(optionsCallback),
151-
lazyPlaceholderComponent: option(React.component({. "route": route})),
152-
tabBar: option(React.component(Js.t(materialTopTabBarProps))),
127+
_lazy: option(bool),
128+
lazyPreloadDistance: option(int),
129+
lazyPlaceholder: option(React.component({. "route": route})),
130+
tabBar: option(Js.t(materialTopTabBarProps) => React.element),
153131
tabBarOptions: option(materialTopTabBarOptions),
154132
tabBarPosition: option(string),
155133
backBehavior: option(string),
156-
shifting: option(bool),
157-
labeled: option(bool),
158-
activeColor: option(string),
159-
inactiveColor: option(string),
160-
barStyle: option(ReactNative.Style.t),
134+
removeClippedSubviews: option(bool),
135+
keyboardDismissMode: option(string),
136+
swipeEnabled: option(bool),
137+
swipeVelocityImpact: option(float),
138+
sceneContainerStyle: option(ReactNative.Style.t),
139+
style: option(ReactNative.Style.t),
161140
};
162141

163142
type renderCallbackProp = {
@@ -227,14 +206,66 @@ module Make = (M: {type params;}) => {
227206
~initialRouteName: string=?,
228207
~screenOptions: optionsCallback=?,
229208
~children: React.element,
230-
~lazyPlaceholderComponent: React.component({. "route": route})=?,
231-
~tabBar: React.component(Js.t(materialTopTabBarProps))=?,
209+
~backBehavior: [@bs.string] [
210+
| `initialRoute
211+
| `order
212+
| `history
213+
| `none
214+
]
215+
=?,
216+
~_lazy: bool=?,
217+
~lazyPreloadDistance: int=?,
218+
~lazyPlaceholder: React.component({. "route": route})=?,
219+
~tabBar: Js.t(materialTopTabBarProps) => React.element=?,
232220
~tabBarOptions: materialTopTabBarOptions=?,
233221
~tabBarPosition: [@bs.string] [ | `top | `bottom]=?,
222+
~removeClippedSubviews: bool=?,
223+
~keyboardDismissMode: [@bs.string] [
224+
| `auto
225+
| [@bs.as "on-drag"] `onDrag
226+
| `none
227+
]
228+
=?,
229+
~swipeEnabled: bool=?,
230+
~swipeVelocityImpact: float=?,
231+
~sceneContainerStyle: ReactNative.Style.t=?,
232+
~style: ReactNative.Style.t=?,
234233
unit
235234
) =>
236235
navigatorProps;
237236

238237
let make = materialTopTabs##"Navigator";
239238
};
239+
240+
module MaterialTopTabBar = {
241+
[@bs.module "@react-navigation/material-top-tabs"] [@react.component]
242+
external make:
243+
(
244+
~state: navigationState(M.params),
245+
~navigation: navigation,
246+
~descriptors: descriptors,
247+
// SceneRendererProps from react-native-tab-view
248+
~layout: layout,
249+
~position: animatedNode,
250+
~jumpTo: string => unit,
251+
// materialTopTabBarOptions
252+
~activeTintColor: string=?,
253+
~inactiveTintColor: string=?,
254+
~iconStyle: ReactNative.Style.t=?,
255+
~showLabel: bool=?,
256+
~showIcon: bool=?,
257+
~allowFontScaling: bool=?,
258+
~scrollEnabled: bool=?,
259+
~pressColor: string=?,
260+
~pressOpacity: float=?,
261+
~tabStyle: ReactNative.Style.t=?,
262+
~indicatorStyle: ReactNative.Style.t=?,
263+
~labelStyle: ReactNative.Style.t=?,
264+
~style: ReactNative.Style.t=?,
265+
~renderIndicator: React.component({. "route": route})=?,
266+
unit
267+
) =>
268+
React.element =
269+
"MaterialTopTabBar";
270+
};
240271
};

‎src/Stack.re‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -207,6 +207,7 @@ module Make = (M: {type params;}) => {
207207
};
208208

209209
type headerRightOptions = {tintColor: option(ReactNative.Color.t)};
210+
type headerBackgroundOptions = {style: option(ReactNative.Style.t)};
210211

211212
[@bs.obj]
212213
external options:
@@ -215,14 +216,17 @@ module Make = (M: {type params;}) => {
215216
~header: Header.t=?,
216217
~cardShadowEnabled: bool=?,
217218
~cardOverlayEnabled: bool=?,
218-
~cardTransparent: bool=?,
219+
~cardOverlay: unit => React.element=?,
219220
~cardStyle: ReactNative.Style.t=?,
220221
~animationEnabled: bool=?,
222+
~animationTypeForReplace: [@bs.string] [ | `push | `pop]=?,
221223
~gestureEnabled: bool=?,
222224
~gestureResponseDistance: gestureResponseDistance=?,
225+
~gestureVelocityImpact: float=?,
223226
// StackHeaderOptions
224227
~headerShown: bool=?,
225228
~headerTitle: HeaderTitle.t=?,
229+
~headerTitleAlign: [@bs.string] [ | `left | `center]=?,
226230
~headerTitleStyle: ReactNative.Style.t=?,
227231
~headerTitleContainerStyle: ReactNative.Style.t=?,
228232
~headerTintColor: ReactNative.Color.t=?,
@@ -238,7 +242,8 @@ module Make = (M: {type params;}) => {
238242
~headerRightContainerStyle: ReactNative.Style.t=?,
239243
~headerBackImage: backImage=?,
240244
~headerPressColorAndroid: ReactNative.Color.t=?,
241-
~headerBackground: unit => React.element=?,
245+
~headerBackground: headerBackgroundOptions => React.element=?,
246+
~headerStatusBarHeight: ReactNative.Style.size=?,
242247
~headerStyle: ReactNative.Style.t=?,
243248
~headerTransparent: bool=?,
244249
// TransitionPreset

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /