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 f895fec

Browse files
ScreenWithCallback for tabs navigators (#34)
1 parent a7d40f0 commit f895fec

File tree

7 files changed

+197
-70
lines changed

7 files changed

+197
-70
lines changed

‎src/BottomTabs.bs.js‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,14 +14,19 @@ function Make(M) {
1414
var $$Screen = {
1515
make: make
1616
};
17-
var make1ドル = bottomTabs.Navigator;
18-
var $$Navigator = {
17+
var make1ドル = bottomTabs.Screen;
18+
var ScreenWithCallback = {
1919
make: make1ドル
2020
};
21+
var make2ドル = bottomTabs.Navigator;
22+
var $$Navigator = {
23+
make: make2ドル
24+
};
2125
return {
2226
Navigation: Navigation,
2327
bottomTabs: bottomTabs,
2428
$$Screen: $$Screen,
29+
ScreenWithCallback: ScreenWithCallback,
2530
$$Navigator: $$Navigator
2631
};
2732
}

‎src/BottomTabs.re‎

Lines changed: 50 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ module BottomTabNavigationProp = (M: {
1616
};
1717

1818
module Make = (M: {type params;}) => {
19+
type nonrec route = route(M.params);
1920
module Navigation =
2021
BottomTabNavigationProp({
2122
include M;
@@ -55,9 +56,9 @@ module Make = (M: {type params;}) => {
5556

5657
type accessibilityRole = string;
5758
type accessibilityStates = array(string);
58-
type routeArgs = {route:route(M.params)};
59+
type routeArgs = {route};
5960
type renderIconArgs = {
60-
route:route(M.params),
61+
route,
6162
focused: bool,
6263
tintColor: string,
6364
horizontal: bool,
@@ -98,8 +99,7 @@ module Make = (M: {type params;}) => {
9899
~style: ReactNative.Style.t=?,
99100
unit
100101
) =>
101-
bottomTabBarOptions =
102-
"";
102+
bottomTabBarOptions;
103103

104104
type tabBarLabelArgs = {
105105
focused: bool,
@@ -123,27 +123,50 @@ module Make = (M: {type params;}) => {
123123
~tabBarButtonComponent: React.element=?,
124124
unit
125125
) =>
126-
options =
127-
"";
126+
options;
128127

129128
type optionsProps = {
130129
navigation,
131-
route:route(M.params),
130+
route,
132131
};
133132

134133
type optionsCallback = optionsProps => options;
135134

136-
type navigatorProps;
135+
type navigatorProps = {
136+
initialRouteName: option(string),
137+
screenOptions: option(optionsCallback),
138+
_lazy: option(bool),
139+
tabBar: option(React.component(Js.t(bottomTabBarProps))),
140+
tabBarOptions: option(bottomTabBarOptions),
141+
};
142+
143+
type renderCallbackProp = {
144+
navigation,
145+
route,
146+
};
137147

138-
type screenProps;
148+
type screenProps('params) = {
149+
name: string,
150+
options: option(optionsCallback),
151+
initialParams: option('params),
152+
component:
153+
option(
154+
React.component({
155+
.
156+
"navigation": navigation,
157+
"route": route,
158+
}),
159+
),
160+
children: option(renderCallbackProp => React.element),
161+
};
139162

140163
[@bs.module "@react-navigation/bottom-tabs"]
141164
external make:
142165
unit =>
143166
{
144167
.
145168
"Navigator": navigatorProps => React.element,
146-
"Screen": screenProps => React.element,
169+
"Screen": screenProps(M.params) => React.element,
147170
} =
148171
"createBottomTabNavigator";
149172

@@ -159,12 +182,25 @@ module Make = (M: {type params;}) => {
159182
~component: React.component({
160183
.
161184
"navigation": navigation,
162-
"route": route(M.params),
185+
"route": route,
163186
}),
164187
unit
165188
) =>
166-
screenProps =
167-
"";
189+
screenProps(M.params);
190+
let make = bottomTabs##"Screen";
191+
};
192+
193+
module ScreenWithCallback = {
194+
[@bs.obj]
195+
external makeProps:
196+
(
197+
~name: string,
198+
~options: optionsCallback=?,
199+
~initialParams: M.params=?,
200+
~children: renderCallbackProp => React.element,
201+
unit
202+
) =>
203+
screenProps(M.params);
168204
let make = bottomTabs##"Screen";
169205
};
170206

@@ -180,8 +216,7 @@ module Make = (M: {type params;}) => {
180216
~tabBarOptions: bottomTabBarOptions=?,
181217
unit
182218
) =>
183-
navigatorProps =
184-
"";
219+
navigatorProps;
185220

186221
let make = bottomTabs##"Navigator";
187222
};

‎src/MaterialBottomTabs.bs.js‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -28,20 +28,25 @@ function Make(M) {
2828
number: number,
2929
string: string
3030
};
31-
var stack = MaterialBottomTabs.createMaterialBottomTabNavigator();
32-
var make = stack.Screen;
31+
var materialBottomTabs = MaterialBottomTabs.createMaterialBottomTabNavigator();
32+
var make = materialBottomTabs.Screen;
3333
var $$Screen = {
3434
make: make
3535
};
36-
var make1ドル = stack.Navigator;
37-
var $$Navigator = {
36+
var make1ドル = materialBottomTabs.Screen;
37+
var ScreenWithCallback = {
3838
make: make1ドル
3939
};
40+
var make2ドル = materialBottomTabs.Navigator;
41+
var $$Navigator = {
42+
make: make2ドル
43+
};
4044
return {
4145
Navigation: Navigation,
4246
TabBarBadge: TabBarBadge,
43-
stack: stack,
47+
materialBottomTabs: materialBottomTabs,
4448
$$Screen: $$Screen,
49+
ScreenWithCallback: ScreenWithCallback,
4550
$$Navigator: $$Navigator
4651
};
4752
}

‎src/MaterialBottomTabs.re‎

Lines changed: 53 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ module MaterialBottomTabNavigationProp = (M: {
2020
};
2121

2222
module Make = (M: {type params;}) => {
23+
type nonrec route = route(M.params);
2324
module Navigation =
2425
MaterialBottomTabNavigationProp({
2526
include M;
@@ -30,7 +31,7 @@ module Make = (M: {type params;}) => {
3031

3132
type scene = {
3233
.
33-
"route": route(M.params),
34+
"route": route,
3435
"focused": bool,
3536
"tintColor": string,
3637
};
@@ -63,31 +64,57 @@ module Make = (M: {type params;}) => {
6364
~tabBarTestID: string=?,
6465
unit
6566
) =>
66-
options =
67-
"";
67+
options;
6868

6969
type optionsProps = {
7070
navigation,
71-
route:route(M.params),
71+
route,
7272
};
7373

7474
type optionsCallback = optionsProps => options;
7575

76-
type navigatorProps;
76+
type navigatorProps = {
77+
initialRouteName: option(string),
78+
screenOptions: option(optionsCallback),
79+
backBehavior: option(string),
80+
shifting: option(bool),
81+
labeled: option(bool),
82+
activeColor: option(string),
83+
inactiveColor: option(string),
84+
barStyle: option(ReactNative.Style.t),
85+
};
86+
87+
type renderCallbackProp = {
88+
navigation,
89+
route,
90+
};
7791

78-
type screenProps;
92+
type screenProps('params) = {
93+
name: string,
94+
options: option(optionsCallback),
95+
initialParams: option('params),
96+
component:
97+
option(
98+
React.component({
99+
.
100+
"navigation": navigation,
101+
"route": route,
102+
}),
103+
),
104+
children: option(renderCallbackProp => React.element),
105+
};
79106

80107
[@bs.module "@react-navigation/material-bottom-tabs"]
81108
external make:
82109
unit =>
83110
{
84111
.
85112
"Navigator": navigatorProps => React.element,
86-
"Screen": screenProps => React.element,
113+
"Screen": screenProps(M.params) => React.element,
87114
} =
88115
"createMaterialBottomTabNavigator";
89116

90-
let stack = make();
117+
let materialBottomTabs = make();
91118

92119
module Screen = {
93120
[@bs.obj]
@@ -99,9 +126,22 @@ module Make = (M: {type params;}) => {
99126
~component: React.component({. "navigation": navigation}),
100127
unit
101128
) =>
102-
screenProps =
103-
"";
104-
let make = stack##"Screen";
129+
screenProps(M.params);
130+
let make = materialBottomTabs##"Screen";
131+
};
132+
133+
module ScreenWithCallback = {
134+
[@bs.obj]
135+
external makeProps:
136+
(
137+
~name: string,
138+
~options: optionsCallback=?,
139+
~initialParams: M.params=?,
140+
~children: renderCallbackProp => React.element,
141+
unit
142+
) =>
143+
screenProps(M.params);
144+
let make = materialBottomTabs##"Screen";
105145
};
106146

107147
module Navigator = {
@@ -126,9 +166,8 @@ module Make = (M: {type params;}) => {
126166
//TODO: More? https://github.com/callstack/react-native-paper/blob/bd4296116d841ed355f3dbebb40cfbc3b87a79ff/src/components/BottomNavigation.tsx#L132-L196
127167
unit
128168
) =>
129-
navigatorProps =
130-
"";
169+
navigatorProps;
131170

132-
let make = stack##"Navigator";
171+
let make = materialBottomTabs##"Navigator";
133172
};
134173
};

‎src/MaterialTopTabs.bs.js‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,19 +9,24 @@ function Make(M) {
99
var M1ドル = { };
1010
var include = Core$ReactNavigation.NavigationScreenProp(M1ドル);
1111
var Navigation = include;
12-
var stack = MaterialTopTabs.createMaterialTopTabNavigator();
13-
var make = stack.Screen;
12+
var materialTopTabs = MaterialTopTabs.createMaterialTopTabNavigator();
13+
var make = materialTopTabs.Screen;
1414
var $$Screen = {
1515
make: make
1616
};
17-
var make1ドル = stack.Navigator;
18-
var $$Navigator = {
17+
var make1ドル = materialTopTabs.Screen;
18+
var ScreenWithCallback = {
1919
make: make1ドル
2020
};
21+
var make2ドル = materialTopTabs.Navigator;
22+
var $$Navigator = {
23+
make: make2ドル
24+
};
2125
return {
2226
Navigation: Navigation,
23-
stack: stack,
27+
materialTopTabs: materialTopTabs,
2428
$$Screen: $$Screen,
29+
ScreenWithCallback: ScreenWithCallback,
2530
$$Navigator: $$Navigator
2631
};
2732
}

0 commit comments

Comments
(0)

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