feat: export types for ScreenProps amd ScreenComponent

packages/drawer/src/index.tsx

@@ -31,4 +31,7 @@ export {
   NavigationDrawerOptions,
   NavigationDrawerConfig,
   NavigationDrawerRouterConfig,
+  NavigationDrawerScreenProps,
+  NavigationDrawerScreenComponent,
+  DrawerContentComponentProps,
 } from './types';

packages/drawer/src/navigators/createDrawerNavigator.tsx

@@ -6,6 +6,7 @@ import {
   SafeAreaView,
   NavigationRouteConfigMap,
   CreateNavigatorConfig,
+  NavigationRoute,
 } from 'react-navigation';
 import DrawerRouter from '../routers/DrawerRouter';
 import DrawerView from '../views/DrawerView';
@@ -15,10 +16,10 @@ import {
   NavigationDrawerProp,
   NavigationDrawerConfig,
   NavigationDrawerRouterConfig,
-  ContentComponentProps,
+  DrawerContentComponentProps,
 } from '../types';
 
-const defaultContentComponent = (props: ContentComponentProps) => (
+const defaultContentComponent = (props: DrawerContentComponentProps) => (
   <ScrollView alwaysBounceVertical={false}>
     <SafeAreaView forceInset={{ top: 'always', horizontal: 'never' }}>
       <DrawerItems {...props} />
@@ -61,12 +62,13 @@ const DefaultDrawerConfig: NavigationDrawerConfig = {
 const DrawerNavigator = (
   routeConfigs: NavigationRouteConfigMap<
     NavigationDrawerOptions,
-    NavigationDrawerProp
+    NavigationDrawerProp<NavigationRoute, any>
   >,
   config: CreateNavigatorConfig<
     NavigationDrawerConfig,
     NavigationDrawerRouterConfig,
-    NavigationDrawerProp
+    NavigationDrawerOptions,
+    NavigationDrawerProp<NavigationRoute, any>
   > = {}
 ) => {
   const mergedConfig = { ...DefaultDrawerConfig, ...config };

packages/drawer/src/types.tsx

@@ -5,6 +5,8 @@ import {
   NavigationParams,
   NavigationProp,
   NavigationDescriptor,
+  SupportedThemes,
+  NavigationScreenConfig,
 } from 'react-navigation';
 import { StyleProp, ViewStyle, TextStyle } from 'react-native';
 import Animated from 'react-native-reanimated';
@@ -38,14 +40,17 @@ export type NavigationDrawerOptions = {
   drawerIcon?:
     | React.ReactNode
     | ((props: { tintColor?: string; focused: boolean }) => React.ReactNode);
-  drawerLockMode?: 'locked-closed' | 'locked-open';
+  drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open';
 };
 
 export type NavigationDrawerConfig = {
+  contentComponent?: React.ComponentType<DrawerContentComponentProps>;
+  edgeWidth?: number;
+  minSwipeDistance?: number;
   drawerWidth?: number | (() => number);
-  contentComponent?: React.ComponentType<ContentComponentProps>;
   drawerPosition?: 'left' | 'right';
   drawerType?: 'front' | 'back' | 'slide';
+  drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open';
   keyboardDismissMode?: 'none' | 'on-drag';
   swipeEdgeWidth?: number;
   swipeDistanceThreshold?: number;
@@ -54,20 +59,24 @@ export type NavigationDrawerConfig = {
   statusBarAnimation?: 'slide' | 'none' | 'fade';
   drawerBackgroundColor?: ThemedColor;
   overlayColor?: ThemedColor;
+  screenContainerStyle?: StyleProp<ViewStyle>;
 };
 
 export type NavigationDrawerRouterConfig = {
   unmountInactiveRoutes?: boolean;
   resetOnBlur?: boolean;
   initialRouteName?: string;
-  contentComponent?: React.ComponentType<ContentComponentProps>;
+  contentComponent?: React.ComponentType<DrawerContentComponentProps>;
   contentOptions?: object;
+  backBehavior?: 'none' | 'initialRoute' | 'history';
 };
 
-export type ThemedColor = {
-  light: string;
-  dark: string;
-};
+export type ThemedColor =
+  | string
+  | {
+      light: string;
+      dark: string;
+    };
 
 export type DrawerNavigatorItemsProps = {
   items: NavigationRoute[];
@@ -88,17 +97,36 @@ export type DrawerNavigatorItemsProps = {
   drawerPosition: 'left' | 'right';
 };
 
-export type ContentComponentProps = DrawerNavigatorItemsProps & {
+export type DrawerContentComponentProps = DrawerNavigatorItemsProps & {
   navigation: NavigationProp<NavigationDrawerState>;
-  descriptors: { [key: string]: any };
+  descriptors: SceneDescriptorMap;
   drawerOpenProgress: Animated.Node<number>;
   screenProps: unknown;
 };
 
+export type NavigationDrawerScreenProps<
+  Params = NavigationParams,
+  ScreenProps = unknown
+> = {
+  theme: SupportedThemes;
+  navigation: NavigationDrawerProp<NavigationRoute, Params>;
+  screenProps: ScreenProps;
+};
+
+export type NavigationDrawerScreenComponent<
+  Params = NavigationParams,
+  ScreenProps = unknown
+> = React.ComponentType<NavigationDrawerScreenProps<Params, ScreenProps>> & {
+  navigationOptions?: NavigationScreenConfig<
+    NavigationDrawerOptions,
+    NavigationDrawerProp<NavigationRoute, Params>
+  >;
+};
+
 export type SceneDescriptorMap = {
   [key: string]: NavigationDescriptor<
     NavigationParams,
     NavigationDrawerOptions,
-    NavigationDrawerProp
+    NavigationDrawerProp<NavigationRoute, any>
   >;
 };

packages/drawer/src/views/DrawerSidebar.tsx

@@ -9,12 +9,12 @@ import Animated from 'react-native-reanimated';
 import {
   Scene,
   NavigationDrawerState,
-  ContentComponentProps,
+  DrawerContentComponentProps,
   SceneDescriptorMap,
 } from '../types';
 
 type Props = {
-  contentComponent?: React.ComponentType<ContentComponentProps>;
+  contentComponent?: React.ComponentType<DrawerContentComponentProps>;
   contentOptions?: object;
   screenProps?: unknown;
   navigation: NavigationProp<NavigationDrawerState>;

packages/drawer/src/views/DrawerView.tsx

@@ -15,7 +15,7 @@ import ResourceSavingScene from './ResourceSavingScene';
 import Drawer from './Drawer';
 import {
   NavigationDrawerState,
-  ContentComponentProps,
+  DrawerContentComponentProps,
   SceneDescriptorMap,
 } from '../types';
 import { PanGestureHandler } from 'react-native-gesture-handler';
@@ -44,7 +44,7 @@ type Props = {
   navigation: NavigationProp<NavigationDrawerState>;
   descriptors: SceneDescriptorMap;
   navigationConfig: DrawerOptions & {
-    contentComponent?: React.ComponentType<ContentComponentProps>;
+    contentComponent?: React.ComponentType<DrawerContentComponentProps>;
     unmountInactiveRoutes?: boolean;
     contentOptions?: object;
   };