File tree

8 files changed

+366
-25
lines changed

8 files changed

+366
-25
lines changed
Original file line numberDiff line numberDiff line change
@@ -116,4 +116,9 @@ module NavigationScreenProp = (M: {
116116
[@bs.send]
117117
external dangerouslyGetParent: navigation => Js.nullable(navigation) =
118118
"dangerouslyGetParent";
119+
120+
[@bs.send]
121+
external dangerouslyGetState:
122+
navigation => Js.nullable(navigationState('params)) =
123+
"dangerouslyGetState";
119124
};
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,7 @@ module Make = (M: {type params;}) => {
131131
//DrawerNavigationConfig
132132
~drawerBackgroundColor: string=?,
133133
~drawerPosition: [ | `left | `right]=?,
134-
~drawerType: [ | `front | `back | `slide]=?,
134+
~drawerType: [ | `front | `back | `slide | `permanent]=?,
135135
/*
136136
~drawerWidth: [@bs.unwrap] [
137137
| `Static(float)
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,6 @@ function Example$MainStackScreen(Props) {
4040
options: (function (props) {
4141
var params = props.route.params;
4242
return {
43-
title: params !== undefined ? params.name : "Reason",
4443
headerRight: (function (param) {
4544
return React.createElement(ReactNative.Button, {
4645
color: "#f00",
@@ -50,7 +49,8 @@ function Example$MainStackScreen(Props) {
5049
}),
5150
title: "Info"
5251
});
53-
})
52+
}),
53+
title: params !== undefined ? params.name : "Reason"
5454
};
5555
}),
5656
component: Example$HomeScreen
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,11 @@
33

44
var NavigationContainer = {};
55

6+
var ServerContainer = {};
7+
8+
var Link = {};
9+
610
exports.NavigationContainer = NavigationContainer;
11+
exports.ServerContainer = ServerContainer;
12+
exports.Link = Link;
713
/* No side effect */
Original file line numberDiff line numberDiff line change
@@ -92,6 +92,25 @@
9292
```
9393
*/
9494

95+
type themeColors = {
96+
primary: string,
97+
background: string,
98+
card: string,
99+
text: string,
100+
border: string,
101+
notification: string,
102+
};
103+
type theme = {
104+
dark: bool,
105+
colors: themeColors,
106+
};
107+
[@bs.module "@react-navigation/native"]
108+
external defaultTheme: theme = "DefaultTheme";
109+
[@bs.module "@react-navigation/native"]
110+
external darkTheme: theme = "DarkTheme";
111+
[@bs.module "@react-navigation/native"]
112+
external useTheme: unit => theme = "useTheme";
113+
95114
module NavigationContainer = {
96115
type state = Js.Json.t;
97116
type navigationState = state => unit;
@@ -102,11 +121,73 @@ module NavigationContainer = {
102121
~ref: ReactNative.Ref.t(Core.navigation)=?,
103122
~initialState: state=?,
104123
~onStateChange: navigationState=?,
124+
~onReady: unit => unit=?,
125+
~theme: theme=?,
105126
~children: React.element
106127
) =>
107128
React.element =
108129
"NavigationContainer";
109130
};
110131

132+
[@bs.module "@react-navigation/native"]
133+
external useNavigation: unit => Js.nullable(Core.navigation) =
134+
"useNavigation";
135+
136+
[@bs.module "@react-navigation/native"]
137+
external useRoute: unit => Js.nullable(Core.route('params)) = "useRoute";
138+
111139
[@bs.module "@react-navigation/native"]
112140
external useIsFocused: unit => bool = "useIsFocused";
141+
142+
type focusCallback = unit => unit;
143+
[@bs.module "@react-navigation/native"]
144+
external useFocusEffect: focusCallback => unit = "useFocusEffect";
145+
146+
[@bs.module "@react-navigation/native"]
147+
external useScrollToTop: React.ref('value) => unit = "useScrollToTop";
148+
149+
type serverContainer('a) = {getCurrentOptions: option('a)};
150+
type location = {
151+
pathname: string,
152+
search: string,
153+
};
154+
module ServerContainer = {
155+
[@bs.module "@react-navigation/native"] [@react.component]
156+
external make:
157+
(
158+
~ref: ReactNative.Ref.t(serverContainer('a))=?,
159+
~location: location=?,
160+
~children: React.element
161+
) =>
162+
React.element =
163+
"ServerContainer";
164+
};
165+
166+
[@bs.module "@react-navigation/native"]
167+
external useLinkTo: string => unit = "useLinkTo";
168+
169+
type linkPropsIn = {
170+
to_: string,
171+
action: unit => unit,
172+
};
173+
type linkPropsOut = {
174+
href: string,
175+
accessibilityRole: string,
176+
onPress: unit => unit,
177+
};
178+
179+
[@bs.module "@react-navigation/native"]
180+
external useLinkProps: linkPropsIn => linkPropsOut = "useLinkProps";
181+
182+
type linkBuilderOut('a) = (string, 'a) => string;
183+
184+
[@bs.module "@react-navigation/native"]
185+
external useLinkBuilder: unit => linkBuilderOut('a) = "useLinkBuilder";
186+
187+
module Link = {
188+
[@bs.module "@react-navigation/native"] [@react.component]
189+
external make:
190+
(~to_: string=?, ~action: unit => unit=?, ~children: React.element) =>
191+
React.element =
192+
"Link";
193+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
'use strict';
2+
3+
var Core$ReactNavigation = require("./Core.bs.js");
4+
var NativeStack = require("react-native-screens/native-stack");
5+
6+
var NativeStackNavigationScreenProp = Core$ReactNavigation.NavigationScreenProp;
7+
8+
function Make(M) {
9+
var M$1 = {};
10+
var include = Core$ReactNavigation.NavigationScreenProp(M$1);
11+
var Navigation = include;
12+
var stack = NativeStack.createNativeStackNavigator();
13+
var make = stack.Screen;
14+
var ScreenWithCallback = {
15+
make: make
16+
};
17+
var make$1 = stack.Screen;
18+
var $$Screen = {
19+
make: make$1
20+
};
21+
var make$2 = stack.Navigator;
22+
var $$Navigator = {
23+
make: make$2
24+
};
25+
return {
26+
Navigation: Navigation,
27+
stack: stack,
28+
ScreenWithCallback: ScreenWithCallback,
29+
$$Screen: $$Screen,
30+
$$Navigator: $$Navigator
31+
};
32+
}
33+
34+
exports.NativeStackNavigationScreenProp = NativeStackNavigationScreenProp;
35+
exports.Make = Make;
36+
/* react-native-screens/native-stack Not a pure module */
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,201 @@
1+
open Core
2+
3+
@module("react-native-screens")
4+
external enableScreens: unit => unit = "enableScreens"
5+
6+
type options
7+
8+
module NativeStackNavigationScreenProp = (
9+
M: {
10+
type params
11+
type options
12+
},
13+
) => {
14+
include NavigationScreenProp(M)
15+
16+
type t = navigation
17+
18+
@send external push: (t, string) => unit = "push"
19+
@send external pushWithParams: (t, string, M.params) => unit = "push"
20+
21+
@send external pop: (t, ~count: int=?, unit) => unit = "pop"
22+
23+
@send external popToTop: (t, unit) => unit = "popToTop"
24+
}
25+
26+
module Make = (
27+
M: {
28+
type params
29+
},
30+
) => {
31+
type route = route<M.params>
32+
module Navigation = NativeStackNavigationScreenProp({
33+
include M
34+
type options = options
35+
})
36+
37+
type headerBackTitleStyle = {fontFamily: option<string>, fontSize: option<float>}
38+
type headerLargeStyle = {backgroundColor: option<ReactNative.Color.t>}
39+
type headerLargeTitleStyle = {
40+
fontFamily: option<string>,
41+
fontSize: option<float>,
42+
color: option<ReactNative.Color.t>,
43+
}
44+
type blurEffect = [
45+
| #extraLight
46+
| #light
47+
| #dark
48+
| #regular
49+
| #prominent
50+
| #systemUltraThinMaterial
51+
| #systemThinMaterial
52+
| #systemMaterial
53+
| #systemThickMaterial
54+
| #systemChromeMaterial
55+
| #systemUltraThinMaterialLight
56+
| #systemThinMaterialLight
57+
| #systemMaterialLight
58+
| #systemThickMaterialLight
59+
| #systemChromeMaterialLight
60+
| #systemUltraThinMaterialDark
61+
| #systemThinMaterialDark
62+
| #systemMaterialDark
63+
| #systemThickMaterialDark
64+
| #systemChromeMaterialDark
65+
]
66+
type headerStyle = {
67+
backgroundColor: option<ReactNative.Color.t>,
68+
blurEffect: option<blurEffect>,
69+
}
70+
type headerTitleStyle = {
71+
fontFamily: option<string>,
72+
fontSize: option<float>,
73+
fontWeight: string, //ReactNative.Style.fontWeight,
74+
color: option<ReactNative.Color.t>,
75+
}
76+
77+
@obj
78+
external options: (
79+
~backButtonInCustomView: bool=?,
80+
~contentStyle: ReactNative.Style.t=?,
81+
~direction: [#rtl | #ltr]=?,
82+
~gestureEnabled: bool=?,
83+
~headerBackTitle: string=?,
84+
~headerBackTitleStyle: headerBackTitleStyle=?,
85+
~headerBackTitleVisible: bool=?,
86+
~headerCenter: unit => React.element=?,
87+
~headerHideBackButton: bool=?,
88+
~headerHideShadow: bool=?,
89+
~headerLargeStyle: headerLargeStyle=?,
90+
~headerLargeTitle: bool=?,
91+
~headerLargeTitleHideShadow: bool=?,
92+
~headerLargeTitleStyle: headerLargeTitleStyle=?,
93+
~headerLeft: unit => React.element=?,
94+
~headerRight: unit => React.element=?,
95+
~headerShown: bool=?,
96+
~headerStyle: headerStyle=?,
97+
~headerTintColor: ReactNative.Color.t=?,
98+
~headerTitle: string=?,
99+
~headerTitleStyle: headerTitleStyle=?,
100+
~headerTopInsetEnabled: bool=?,
101+
~headerTranslucent: bool=?,
102+
~replaceAnimation: [#push | #pop]=?,
103+
~stackAnimation: [#default | #fade | #flip | #slide_from_right | #slide_from_left | #none]=?,
104+
~stackPresentation: [
105+
| #push
106+
| #modal
107+
| #transparentModal
108+
| #containedModal
109+
| #containedTransparentModal
110+
| #fullScreenModal
111+
| #formSheet
112+
]=?,
113+
~statusBarStyle: [#auto | #inverted | #light | #dark]=?,
114+
~statusBarAnimation: [#fade | #none | #slide]=?,
115+
~statusBarHidden: bool=?,
116+
~screenOrientation: [
117+
| #default
118+
| #all
119+
| #portrait
120+
| #portrait_up
121+
| #portrait_down
122+
| #landscape
123+
| #landscape_left
124+
| #landscape_right
125+
]=?,
126+
~title: string=?,
127+
unit,
128+
) => options = ""
129+
130+
type optionsProps = {
131+
navigation: navigation,
132+
route: route,
133+
}
134+
type optionsCallback = optionsProps => options
135+
136+
type navigatorProps = {
137+
initialRouteName: option<string>,
138+
screenOptions: option<optionsCallback>,
139+
}
140+
type renderCallbackProp = {
141+
navigation: navigation,
142+
route: route,
143+
}
144+
type screenProps<'params> = {
145+
name: string,
146+
options: option<optionsCallback>,
147+
initialParams: option<'params>,
148+
component: option<React.component<{"navigation": navigation, "route": route}>>,
149+
children: option<renderCallbackProp => React.element>,
150+
}
151+
152+
@module("react-native-screens/native-stack")
153+
external make: unit => {
154+
"Navigator": navigatorProps => React.element,
155+
"Screen": screenProps<M.params> => React.element,
156+
} = "createNativeStackNavigator"
157+
158+
let stack = make()
159+
module ScreenWithCallback = {
160+
@obj
161+
external makeProps: (
162+
~name: string,
163+
~options: optionsCallback=?,
164+
~initialParams: M.params=?,
165+
~children: renderCallbackProp => React.element,
166+
~key: string=?,
167+
unit,
168+
) => screenProps<M.params> = ""
169+
let make = stack["Screen"]
170+
}
171+
module Screen = {
172+
type componentProps = {navigation: navigation}
173+
@obj
174+
external makeProps: (
175+
~name: string,
176+
~options: optionsCallback=?,
177+
~initialParams: M.params=?,
178+
~component: React.component<{"navigation": navigation, "route": route}>,
179+
~key: string=?,
180+
unit,
181+
) => screenProps<M.params> = ""
182+
183+
let make = stack["Screen"]
184+
}
185+
186+
module Navigator = {
187+
@obj
188+
external makeProps: (
189+
~initialRouteName: string=?,
190+
~screenOptions: optionsCallback=?,
191+
~children: React.element,
192+
~key: string=?,
193+
unit,
194+
) => navigatorProps = ""
195+
196+
let make = stack["Navigator"]
197+
}
198+
}
199+
200+
@val
201+
external mergeOptions: (options, options) => options = "Object.assign"

0 commit comments

Comments
 (0)