// Type definitions for react-native-drawer-layout 1.3 // Project: https://github.com/react-native-community/react-native-drawer-layout // Definitions by: Justin Firth // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.8 import * as React from 'react'; import { ViewProps } from 'react-native'; export type DrawerLayoutOpenEventHandler = () => void; export type DrawerLayoutCloseEventHandler = () => void; export interface DrawerLayoutSlideEvent { nativeEvent: { offset: number; }; } export type DrawerLayoutSlideEventHandler = (event: DrawerLayoutSlideEvent) => void; export type DrawerLayoutStateChangeEventHandler = (state: string) => void; export interface DrawerLayoutProperties extends ViewProps { /** * Child content. */ children?: React.ReactNode; /** * Specifies the background color of the drawer. The default value is white. If you want to set * the opacity of the drawer, use rgba. */ drawerBackgroundColor?: string; /** * Specifies the lock mode of the drawer. The drawer can be locked in 3 states: * * - unlocked (default), meaning that the drawer will respond (open/close) to touch gestures. * - locked-closed, meaning that the drawer will stay closed and not respond to gestures. * - locked-open, meaning that the drawer will stay opened and not respond to gestures. * * The drawer may still be opened and closed programmatically (`openDrawer`/`closeDrawer`). */ drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open'; /** * Specifies the side of the screen from which the drawer will slide in. */ drawerPosition: 'left' | 'right'; /** * Specifies the width of the drawer, more precisely the width of the view that be pulled in from * the edge of the window. */ drawerWidth: number; /** * Determines whether the keyboard gets dismissed in response to a drag. * * - 'none' (the default), drags do not dismiss the keyboard. * - 'on-drag', the keyboard is dismissed when a drag begins. */ keyboardDismissMode?: 'none' | 'on-drag'; /** * Function called whenever the navigation view has been closed. */ onDrawerClose?: DrawerLayoutCloseEventHandler; /** * Function called whenever the navigation view has been opened. */ onDrawerOpen?: DrawerLayoutOpenEventHandler; /** * Function called whenever there is an interaction with the navigation view. */ onDrawerSlide?: DrawerLayoutSlideEventHandler; /** * Function called when the drawer state has changed. The drawer can be in 3 states: * * - idle, meaning there is no interaction with the navigation view happening at the time * - dragging, meaning there is currently an interaction with the navigation view * - settling, meaning that there was an interaction with the navigation view, and the navigation * view is now finishing its closing or opening animation */ onDrawerStateChanged?: DrawerLayoutStateChangeEventHandler; /** * The navigation view that will be rendered to the side of the screen and can be pulled in. */ renderNavigationView: React.ReactNode; /** * Make the drawer take the entire screen and draw the background of the status bar to allow it * to open over the status bar. It will only have an effect on API 21+. */ statusBarBackgroundColor?: string; /** * Use native driver animations. */ useNativeAnimations?: boolean; } export default class DrawerLayout extends React.Component { static positions: { Left: "left"; Right: "right"; }; /** * Opens the drawer. */ openDrawer(): void; /** * Closes the drawer. */ closeDrawer(): void; }