From d2f636cb6e79d392739614715a3f611eaa8f6c8b Mon Sep 17 00:00:00 2001 From: Christoph Knittel Date: Mon, 7 Apr 2025 16:51:37 +0200 Subject: [PATCH] ReScript 12 compatibility --- src/BottomTabs.bs.js | 22 +++++++-- src/BottomTabs.res | 80 ++++++++++++++++++--------------- src/Drawer.bs.js | 22 +++++++-- src/Drawer.res | 84 +++++++++++++++++++--------------- src/Interop.js | 10 ----- src/MaterialBottomTabs.bs.js | 24 ++++++++-- src/MaterialBottomTabs.res | 87 ++++++++++++++++++++---------------- src/MaterialTopTabs.bs.js | 22 +++++++-- src/MaterialTopTabs.res | 87 ++++++++++++++++++++---------------- src/NativeStack.bs.js | 22 +++++++-- src/NativeStack.res | 74 +++++++++++++++++------------- src/Stack.bs.js | 22 +++++++-- src/Stack.res | 76 +++++++++++++++++-------------- 13 files changed, 389 insertions(+), 243 deletions(-) delete mode 100644 src/Interop.js diff --git a/src/BottomTabs.bs.js b/src/BottomTabs.bs.js index 8312c87..fba16c4 100644 --- a/src/BottomTabs.bs.js +++ b/src/BottomTabs.bs.js @@ -1,12 +1,28 @@ 'use strict'; -var Interop = require("./Interop"); var BottomTabs = require("@react-navigation/bottom-tabs"); var TabBarBadge = {}; function Make($star) { - return Interop.adaptNavigatorModule(BottomTabs.createBottomTabNavigator()); + var internal = BottomTabs.createBottomTabNavigator(); + var make = internal.Navigator; + var $$Navigator = { + make: make + }; + var make$1 = internal.Screen; + var $$Screen = { + make: make$1 + }; + var make$2 = internal.Group; + var Group = { + make: make$2 + }; + return { + $$Navigator: $$Navigator, + $$Screen: $$Screen, + Group: Group + }; } var $$Navigation = {}; @@ -14,4 +30,4 @@ var $$Navigation = {}; exports.TabBarBadge = TabBarBadge; exports.Make = Make; exports.$$Navigation = $$Navigation; -/* ./Interop Not a pure module */ +/* @react-navigation/bottom-tabs Not a pure module */ diff --git a/src/BottomTabs.res b/src/BottomTabs.res index 3540214..e6ca1bc 100644 --- a/src/BottomTabs.res +++ b/src/BottomTabs.res @@ -96,55 +96,65 @@ and headerParams = { layout: layout, } +type navigatorProps = { + id?: string, + initialRouteName?: string, + screenOptions?: screenOptionsParams => options, + backBehavior?: backBehavior, + detachInactiveScreens?: bool, + tabBar?: unit => React.element, + layout?: layoutNavigatorParams => React.element, + children: React.element, +} + +type screenProps<'params> = { + name: string, + navigationKey?: string, + options?: screenOptionsParams => options, + initialParams?: 'params, + getId?: getIdOptions => option, + component?: React.component, + getComponent?: unit => React.component, + children?: screenProps => React.element, +} + +type groupProps = { + navigationKey?: string, + screenOptions?: screenOptionsParams => options, +} + module type NavigatorModule = { module Navigator: { - @react.component - let make: ( - ~id: string=?, - ~initialRouteName: string=?, - ~screenOptions: screenOptionsParams => options=?, - ~backBehavior: backBehavior=?, - ~detachInactiveScreens: bool=?, - ~tabBar: unit => React.element=?, - ~layout: layoutNavigatorParams => React.element=?, - ~children: React.element, - ) => React.element + let make: React.component } module Screen: { - @react.component - let make: ( - ~name: string, - ~navigationKey: string=?, - ~options: screenOptionsParams => options=?, - ~initialParams: 'params=?, - ~getId: getIdOptions => option=?, - ~component: React.component=?, - ~getComponent: unit => React.component=?, - ~children: screenProps => React.element=?, - ) => React.element + let make: React.component> } module Group: { - @react.component - let make: ( - ~navigationKey: string=?, - ~screenOptions: screenOptionsParams => options=?, - ) => React.element + let make: React.component } } -type navigatorModule - -%%private( +module Make = (): NavigatorModule => { @module("@react-navigation/bottom-tabs") - external createBottomTabNavigator: unit => navigatorModule = "createBottomTabNavigator" + external createBottomTabNavigator: unit => {..} = "createBottomTabNavigator" - @module("./Interop") - external adaptNavigatorModule: navigatorModule => module(NavigatorModule) = "adaptNavigatorModule" -) + let internal = createBottomTabNavigator() -module Make = () => unpack(createBottomTabNavigator()->adaptNavigatorModule) + module Navigator = { + let make = internal["Navigator"] + } + + module Screen = { + let make = internal["Screen"] + } + + module Group = { + let make = internal["Group"] + } +} module Navigation = { @send external jumpTo: (navigation, string, ~params: 'params=?) => unit = "jumpTo" diff --git a/src/Drawer.bs.js b/src/Drawer.bs.js index 3f9cac7..2f49aed 100644 --- a/src/Drawer.bs.js +++ b/src/Drawer.bs.js @@ -1,10 +1,26 @@ 'use strict'; -var Interop = require("./Interop"); var Drawer = require("@react-navigation/drawer"); function Make($star) { - return Interop.adaptNavigatorModule(Drawer.createDrawerNavigator()); + var internal = Drawer.createDrawerNavigator(); + var make = internal.Navigator; + var $$Navigator = { + make: make + }; + var make$1 = internal.Screen; + var $$Screen = { + make: make$1 + }; + var make$2 = internal.Group; + var Group = { + make: make$2 + }; + return { + $$Navigator: $$Navigator, + $$Screen: $$Screen, + Group: Group + }; } var $$Navigation = {}; @@ -14,4 +30,4 @@ var DrawerItemList = {}; exports.Make = Make; exports.$$Navigation = $$Navigation; exports.DrawerItemList = DrawerItemList; -/* ./Interop Not a pure module */ +/* @react-navigation/drawer Not a pure module */ diff --git a/src/Drawer.res b/src/Drawer.res index 2b73d22..fdd40c5 100644 --- a/src/Drawer.res +++ b/src/Drawer.res @@ -92,57 +92,67 @@ type contentComponentProps = { type drawerStatus = [#"open" | #closed] +type navigatorProps = { + id?: string, + initialRouteName?: string, + screenOptions?: screenOptionsParams => options, + backBehavior?: backBehavior, + defaultStatus?: drawerStatus, + detachInactiveScreens?: bool, + useLegacyImplementation?: bool, + drawerContent?: React.component, + layout?: layoutNavigatorParams => React.element, + children?: React.element, +} + +type screenProps<'params> = { + name: string, + navigationKey?: string, + options?: screenOptionsParams => options, + initialParams?: 'params, + getId?: getIdOptions => option, + component?: React.component, + getComponent?: unit => React.component, + children?: screenProps => React.element, +} + +type groupProps = { + navigationKey?: string, + screenOptions?: screenOptionsParams => options, +} + module type NavigatorModule = { module Navigator: { - @react.component - let make: ( - ~id: string=?, - ~initialRouteName: string=?, - ~screenOptions: screenOptionsParams => options=?, - ~backBehavior: backBehavior=?, - ~defaultStatus: drawerStatus=?, - ~detachInactiveScreens: bool=?, - ~useLegacyImplementation: bool=?, - ~drawerContent: React.component=?, - ~layout: layoutNavigatorParams => React.element=?, - ~children: React.element=?, - ) => React.element + let make: React.component } module Screen: { - @react.component - let make: ( - ~name: string, - ~navigationKey: string=?, - ~options: screenOptionsParams => options=?, - ~initialParams: 'params=?, - ~getId: getIdOptions => option=?, - ~component: React.component=?, - ~getComponent: unit => React.component=?, - ~children: screenProps => React.element=?, - ) => React.element + let make: React.component> } module Group: { - @react.component - let make: ( - ~navigationKey: string=?, - ~screenOptions: screenOptionsParams => options=?, - ) => React.element + let make: React.component } } -type navigatorModule - -%%private( +module Make = (): NavigatorModule => { @module("@react-navigation/drawer") - external createDrawerNavigator: unit => navigatorModule = "createDrawerNavigator" + external createDrawerNavigator: unit => {..} = "createDrawerNavigator" - @module("./Interop") - external adaptNavigatorModule: navigatorModule => module(NavigatorModule) = "adaptNavigatorModule" -) + let internal = createDrawerNavigator() -module Make = () => unpack(createDrawerNavigator()->adaptNavigatorModule) + module Navigator = { + let make = internal["Navigator"] + } + + module Screen = { + let make = internal["Screen"] + } + + module Group = { + let make = internal["Group"] + } +} module Navigation = { @send diff --git a/src/Interop.js b/src/Interop.js deleted file mode 100644 index 4b91e58..0000000 --- a/src/Interop.js +++ /dev/null @@ -1,10 +0,0 @@ -// Adapt the result of createXxxNavigator to return a module in the shape that ReScript expects. -// Navigator and Screen are escaped with `$$` prefix by ReScript. - -export function adaptNavigatorModule(m) { - return { - $$Navigator: { make: m.Navigator }, - $$Screen: { make: m.Screen }, - Group: { make: m.Group }, - }; -} diff --git a/src/MaterialBottomTabs.bs.js b/src/MaterialBottomTabs.bs.js index 3383cba..c0922e7 100644 --- a/src/MaterialBottomTabs.bs.js +++ b/src/MaterialBottomTabs.bs.js @@ -1,12 +1,28 @@ 'use strict'; -var Interop = require("./Interop"); -var ReactNavigation = require("react-native-paper/react-navigation"); +var MaterialBottomTabs = require("@react-navigation/material-bottom-tabs"); var TabBarBadge = {}; function Make($star) { - return Interop.adaptNavigatorModule(ReactNavigation.createMaterialBottomTabNavigator()); + var internal = MaterialBottomTabs.createMaterialBottomTabNavigator(); + var make = internal.Navigator; + var $$Navigator = { + make: make + }; + var make$1 = internal.Screen; + var $$Screen = { + make: make$1 + }; + var make$2 = internal.Group; + var Group = { + make: make$2 + }; + return { + $$Navigator: $$Navigator, + $$Screen: $$Screen, + Group: Group + }; } var $$Navigation = {}; @@ -14,4 +30,4 @@ var $$Navigation = {}; exports.TabBarBadge = TabBarBadge; exports.Make = Make; exports.$$Navigation = $$Navigation; -/* ./Interop Not a pure module */ +/* @react-navigation/material-bottom-tabs Not a pure module */ diff --git a/src/MaterialBottomTabs.res b/src/MaterialBottomTabs.res index 13cc189..485833f 100644 --- a/src/MaterialBottomTabs.res +++ b/src/MaterialBottomTabs.res @@ -35,59 +35,68 @@ type options = { tabBarTestID?: string, } +type navigatorProps = { + id?: string, + initialRouteName?: string, + screenOptions?: screenOptionsParams => options, + backBehavior?: backBehavior, + shifting?: bool, + labeled?: bool, + activeColor?: Color.t, + inactiveColor?: Color.t, + barStyle?: Style.t, + layout?: layoutNavigatorParams => React.element, + children: React.element, +} + +type screenProps<'params> = { + name: string, + navigationKey?: string, + options?: screenOptionsParams => options, + initialParams?: 'params, + getId?: getIdOptions => option, + component?: React.component, + getComponent?: unit => React.component, + children?: screenProps => React.element, +} + +type groupProps = { + navigationKey?: string, + screenOptions?: screenOptionsParams => options, +} + module type NavigatorModule = { module Navigator: { - @react.component - let make: ( - ~id: string=?, - ~initialRouteName: string=?, - ~screenOptions: screenOptionsParams => options=?, - ~backBehavior: backBehavior=?, - ~shifting: bool=?, - ~labeled: bool=?, - ~activeColor: Color.t=?, - ~inactiveColor: Color.t=?, - ~barStyle: Style.t=?, - ~layout: layoutNavigatorParams => React.element=?, - ~children: React.element, - ) => React.element + let make: React.component } module Screen: { - @react.component - let make: ( - ~name: string, - ~navigationKey: string=?, - ~options: screenOptionsParams => options=?, - ~initialParams: 'params=?, - ~getId: getIdOptions => option=?, - ~component: React.component=?, - ~getComponent: unit => React.component=?, - ~children: screenProps => React.element=?, - ) => React.element + let make: React.component> } module Group: { - @react.component - let make: ( - ~navigationKey: string=?, - ~screenOptions: screenOptionsParams => options=?, - ) => React.element + let make: React.component } } -type navigatorModule +module Make = (): NavigatorModule => { + @module("@react-navigation/material-bottom-tabs") + external createMaterialBottomTabNavigator: unit => {..} = "createMaterialBottomTabNavigator" -%%private( - @module("react-native-paper/react-navigation") - external createMaterialBottomTabNavigator: unit => navigatorModule = - "createMaterialBottomTabNavigator" + let internal = createMaterialBottomTabNavigator() - @module("./Interop") - external adaptNavigatorModule: navigatorModule => module(NavigatorModule) = "adaptNavigatorModule" -) + module Navigator = { + let make = internal["Navigator"] + } + + module Screen = { + let make = internal["Screen"] + } -module Make = () => unpack(createMaterialBottomTabNavigator()->adaptNavigatorModule) + module Group = { + let make = internal["Group"] + } +} module Navigation = { @send diff --git a/src/MaterialTopTabs.bs.js b/src/MaterialTopTabs.bs.js index 37c6f6c..60217d8 100644 --- a/src/MaterialTopTabs.bs.js +++ b/src/MaterialTopTabs.bs.js @@ -1,14 +1,30 @@ 'use strict'; -var Interop = require("./Interop"); var MaterialTopTabs = require("@react-navigation/material-top-tabs"); function Make($star) { - return Interop.adaptNavigatorModule(MaterialTopTabs.createMaterialTopTabNavigator()); + var internal = MaterialTopTabs.createMaterialTopTabNavigator(); + var make = internal.Navigator; + var $$Navigator = { + make: make + }; + var make$1 = internal.Screen; + var $$Screen = { + make: make$1 + }; + var make$2 = internal.Group; + var Group = { + make: make$2 + }; + return { + $$Navigator: $$Navigator, + $$Screen: $$Screen, + Group: Group + }; } var $$Navigation = {}; exports.Make = Make; exports.$$Navigation = $$Navigation; -/* ./Interop Not a pure module */ +/* @react-navigation/material-top-tabs Not a pure module */ diff --git a/src/MaterialTopTabs.res b/src/MaterialTopTabs.res index eed5490..4d27296 100644 --- a/src/MaterialTopTabs.res +++ b/src/MaterialTopTabs.res @@ -76,58 +76,69 @@ type tabBarProps = { jumpTo: string => unit, } +type navigatorProps = { + id?: string, + initialRouteName?: string, + screenOptions?: screenOptionsParams => options, + backBehavior?: backBehavior, + tabBarPosition?: tabBarPosition, + keyboardDismissMode?: keyboardDismissMode, + initialLayout?: layout, + sceneContainerStyle?: Style.t, + style?: Style.t, + tabBar?: tabBarProps => React.element, + layout?: layoutNavigatorParams => React.element, + children: React.element, +} + +type screenProps<'params> = { + name: string, + navigationKey?: string, + options?: screenOptionsParams => options, + initialParams?: 'params, + getId?: getIdOptions => option, + component?: React.component, + getComponent?: unit => React.component, + children?: screenProps => React.element, +} + +type groupProps = { + navigationKey?: string, + screenOptions?: screenOptionsParams => options, +} + module type NavigatorModule = { module Navigator: { - @react.component - let make: ( - ~id: string=?, - ~initialRouteName: string=?, - ~screenOptions: screenOptionsParams => options=?, - ~backBehavior: backBehavior=?, - ~tabBarPosition: tabBarPosition=?, - ~keyboardDismissMode: keyboardDismissMode=?, - ~initialLayout: layout=?, - ~style: Style.t=?, - ~tabBar: tabBarProps => React.element=?, - ~layout: layoutNavigatorParams => React.element=?, - ~children: React.element, - ) => React.element + let make: React.component } module Screen: { - @react.component - let make: ( - ~name: string, - ~navigationKey: string=?, - ~options: screenOptionsParams => options=?, - ~initialParams: 'params=?, - ~getId: getIdOptions => option=?, - ~component: React.component=?, - ~getComponent: unit => React.component=?, - ~children: screenProps => React.element=?, - ) => React.element + let make: React.component> } module Group: { - @react.component - let make: ( - ~navigationKey: string=?, - ~screenOptions: screenOptionsParams => options=?, - ) => React.element + let make: React.component } } -type navigatorModule - -%%private( +module Make = (): NavigatorModule => { @module("@react-navigation/material-top-tabs") - external createMaterialTopTabNavigator: unit => navigatorModule = "createMaterialTopTabNavigator" + external createMaterialTopTabNavigator: unit => {..} = "createMaterialTopTabNavigator" + + let internal = createMaterialTopTabNavigator() - @module("./Interop") - external adaptNavigatorModule: navigatorModule => module(NavigatorModule) = "adaptNavigatorModule" -) + module Navigator = { + let make = internal["Navigator"] + } -module Make = () => unpack(createMaterialTopTabNavigator()->adaptNavigatorModule) + module Screen = { + let make = internal["Screen"] + } + + module Group = { + let make = internal["Group"] + } +} module Navigation = { @send diff --git a/src/NativeStack.bs.js b/src/NativeStack.bs.js index fdedffa..752a071 100644 --- a/src/NativeStack.bs.js +++ b/src/NativeStack.bs.js @@ -1,14 +1,30 @@ 'use strict'; -var Interop = require("./Interop"); var NativeStack = require("@react-navigation/native-stack"); function Make($star) { - return Interop.adaptNavigatorModule(NativeStack.createNativeStackNavigator()); + var internal = NativeStack.createNativeStackNavigator(); + var make = internal.Navigator; + var $$Navigator = { + make: make + }; + var make$1 = internal.Screen; + var $$Screen = { + make: make$1 + }; + var make$2 = internal.Group; + var Group = { + make: make$2 + }; + return { + $$Navigator: $$Navigator, + $$Screen: $$Screen, + Group: Group + }; } var $$Navigation = {}; exports.Make = Make; exports.$$Navigation = $$Navigation; -/* ./Interop Not a pure module */ +/* @react-navigation/native-stack Not a pure module */ diff --git a/src/NativeStack.res b/src/NativeStack.res index dd19c2c..61a0734 100644 --- a/src/NativeStack.res +++ b/src/NativeStack.res @@ -171,52 +171,62 @@ and headerParams = { back: backOptions, } +type navigatorProps = { + id?: string, + initialRouteName?: string, + screenOptions?: screenOptionsParams => options, + layout?: layoutNavigatorParams => React.element, + children?: React.element, +} + +type screenProps<'params> = { + name: string, + navigationKey?: string, + options?: screenOptionsParams => options, + initialParams?: 'params, + getId?: getIdOptions => option, + component?: React.component, + getComponent?: unit => React.component, + children?: screenProps => React.element, +} + +type groupProps = { + navigationKey?: string, + screenOptions?: screenOptionsParams => options, +} + module type NavigatorModule = { module Navigator: { - @react.component - let make: ( - ~id: string=?, - ~initialRouteName: string=?, - ~screenOptions: screenOptionsParams => options=?, - ~layout: layoutNavigatorParams => React.element=?, - ~children: React.element=?, - ) => React.element + let make: React.component } module Screen: { - @react.component - let make: ( - ~name: string, - ~navigationKey: string=?, - ~options: screenOptionsParams => options=?, - ~initialParams: 'params=?, - ~getId: getIdOptions => option=?, - ~component: React.component=?, - ~getComponent: unit => React.component=?, - ~children: screenProps => React.element=?, - ) => React.element + let make: React.component> } module Group: { - @react.component - let make: ( - ~navigationKey: string=?, - ~screenOptions: screenOptionsParams => options=?, - ) => React.element + let make: React.component } } -type navigatorModule - -%%private( +module Make = (): NavigatorModule => { @module("@react-navigation/native-stack") - external createNativeStackNavigator: unit => navigatorModule = "createNativeStackNavigator" + external createNativeStackNavigator: unit => {..} = "createNativeStackNavigator" - @module("./Interop") - external adaptNavigatorModule: navigatorModule => module(NavigatorModule) = "adaptNavigatorModule" -) + let internal = createNativeStackNavigator() -module Make = () => unpack(createNativeStackNavigator()->adaptNavigatorModule) + module Navigator = { + let make = internal["Navigator"] + } + + module Screen = { + let make = internal["Screen"] + } + + module Group = { + let make = internal["Group"] + } +} type screenEventData = {closing: int} diff --git a/src/Stack.bs.js b/src/Stack.bs.js index 7a8b89c..4ad30aa 100644 --- a/src/Stack.bs.js +++ b/src/Stack.bs.js @@ -1,12 +1,28 @@ 'use strict'; -var Interop = require("./Interop"); var Stack = require("@react-navigation/stack"); var TransitionSpec = {}; function Make($star) { - return Interop.adaptNavigatorModule(Stack.createStackNavigator()); + var internal = Stack.createStackNavigator(); + var make = internal.Navigator; + var $$Navigator = { + make: make + }; + var make$1 = internal.Screen; + var $$Screen = { + make: make$1 + }; + var make$2 = internal.Group; + var Group = { + make: make$2 + }; + return { + $$Navigator: $$Navigator, + $$Screen: $$Screen, + Group: Group + }; } var $$Navigation = {}; @@ -26,4 +42,4 @@ exports.TransitionSpecs = TransitionSpecs; exports.CardStyleInterpolators = CardStyleInterpolators; exports.HeaderStyleInterpolators = HeaderStyleInterpolators; exports.TransitionPresets = TransitionPresets; -/* ./Interop Not a pure module */ +/* @react-navigation/stack Not a pure module */ diff --git a/src/Stack.res b/src/Stack.res index 5b3ddd5..cd37b06 100644 --- a/src/Stack.res +++ b/src/Stack.res @@ -154,53 +154,63 @@ and headerParams = { styleInterpolator: headerStyleInterpolator, } +type navigatorProps = { + id?: string, + initialRouteName?: string, + screenOptions?: screenOptionsParams => options, + detachInactiveScreens?: bool, + layout?: layoutNavigatorParams => React.element, + children?: React.element, +} + +type screenProps<'params> = { + name: string, + navigationKey?: string, + options?: screenOptionsParams => options, + initialParams?: 'params, + getId?: getIdOptions => option, + component?: React.component, + getComponent?: unit => React.component, + children?: screenProps => React.element, +} + +type groupProps = { + navigationKey?: string, + screenOptions?: screenOptionsParams => options, +} + module type NavigatorModule = { module Navigator: { - @react.component - let make: ( - ~id: string=?, - ~initialRouteName: string=?, - ~screenOptions: screenOptionsParams => options=?, - ~detachInactiveScreens: bool=?, - ~layout: layoutNavigatorParams => React.element=?, - ~children: React.element=?, - ) => React.element + let make: React.component } module Screen: { - @react.component - let make: ( - ~name: string, - ~navigationKey: string=?, - ~options: screenOptionsParams => options=?, - ~initialParams: 'params=?, - ~getId: getIdOptions => option=?, - ~component: React.component=?, - ~getComponent: unit => React.component=?, - ~children: screenProps => React.element=?, - ) => React.element + let make: React.component> } module Group: { - @react.component - let make: ( - ~navigationKey: string=?, - ~screenOptions: screenOptionsParams => options=?, - ) => React.element + let make: React.component } } -type navigatorModule - -%%private( +module Make = (): NavigatorModule => { @module("@react-navigation/stack") - external createStackNavigator: unit => navigatorModule = "createStackNavigator" + external createStackNavigator: unit => {..} = "createStackNavigator" - @module("./Interop") - external adaptNavigatorModule: navigatorModule => module(NavigatorModule) = "adaptNavigatorModule" -) + let internal = createStackNavigator() -module Make = () => unpack(createStackNavigator()->adaptNavigatorModule) + module Navigator = { + let make = internal["Navigator"] + } + + module Screen = { + let make = internal["Screen"] + } + + module Group = { + let make = internal["Group"] + } +} type screenEventData = {closing: int}