license import React from 'react' ; import { ViewProps } from 'react-native' ; import { FalsyFC , RenderProp , } from '../../devsupport' ; import { styled , StyleType , } from '../../theme' ; import { Menu , MenuProps , } from '../menu/menu.component' ; export interface DrawerProps extends MenuProps { header ? : RenderProp < ViewProps > ; footer ? : RenderProp < ViewProps > ; } export type DrawerElement = React . ReactElement < DrawerProps > ; extends React . Component property property property property property property property overview-example overview-example overview-example overview-example overview-example overview-example overview-example overview-example @ styled ( 'Drawer' ) export class Drawer extends React . Component < DrawerProps > { private getComponentStyle = ( source ) => { const { headerPaddingHorizontal , headerPaddingVertical , footerPaddingHorizontal , footerPaddingVertical , ... containerParameters } = source ; return { container : containerParameters , header : { paddingHorizontal : headerPaddingHorizontal , paddingVertical : headerPaddingVertical , } , footer : { paddingHorizontal : footerPaddingHorizontal , paddingVertical : footerPaddingVertical , } , } ; } ; public render ( ) { const { eva , style , header , footer , ... menuProps } = this . props ; const evaStyle = this . getComponentStyle ( eva . style ) ; return ( < React . Fragment > < FalsyFC style = { evaStyle . header } component = { header } / > < Menu style = { [ evaStyle . container , style ] } showsVerticalScrollIndicator = { false } bounces = { false } { ... menuProps } /> < FalsyFC style = { evaStyle . footer } component = { footer } / > < /React.Fragment>); } }