diff --git a/src/components/Drawer/DrawerSection.js b/src/components/Drawer/DrawerSection.js index baf9ef307c..4afc17b5c2 100644 --- a/src/components/Drawer/DrawerSection.js +++ b/src/components/Drawer/DrawerSection.js @@ -2,11 +2,12 @@ import color from 'color'; import * as React from 'react'; -import { View } from 'react-native'; +import { View, StyleSheet } from 'react-native'; import Text from '../Typography/Text'; import Divider from '../Divider'; import { withTheme } from '../../core/theming'; import type { Theme } from '../../types'; +import type { ViewStyleProp } from 'react-native/Libraries/StyleSheet/StyleSheet'; type Props = React.ElementConfig & { /** @@ -17,6 +18,7 @@ type Props = React.ElementConfig & { * Content of the `Drawer.Section`. */ children: React.Node, + style?: ViewStyleProp, /** * @optional */ @@ -61,7 +63,7 @@ class DrawerSection extends React.Component { static displayName = 'Drawer.Section'; render() { - const { children, title, theme, ...rest } = this.props; + const { children, title, theme, style, ...rest } = this.props; const { colors, fonts } = theme; const titleColor = color(colors.text) .alpha(0.54) @@ -70,9 +72,9 @@ class DrawerSection extends React.Component { const font = fonts.medium; return ( - + {title && ( - + { )} {children} - + ); } } +const styles = StyleSheet.create({ + container: { + marginBottom: 4, + }, + titleContainer: { + height: 40, + justifyContent: 'center', + }, + divider: { + marginTop: 4, + }, +}); + export default withTheme(DrawerSection); diff --git a/src/components/__tests__/Drawer/DrawerSection.test.js b/src/components/__tests__/Drawer/DrawerSection.test.js new file mode 100644 index 0000000000..e6874f9895 --- /dev/null +++ b/src/components/__tests__/Drawer/DrawerSection.test.js @@ -0,0 +1,18 @@ +import React from 'react'; +import { View } from 'react-native'; +import renderer from 'react-test-renderer'; +import DrawerSection from '../../Drawer/DrawerSection'; + +describe('DrawerSection', () => { + it('renders properly', () => { + const tree = renderer + .create( + + + + ) + .toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/src/components/__tests__/Drawer/__snapshots__/DrawerSection.test.js.snap b/src/components/__tests__/Drawer/__snapshots__/DrawerSection.test.js.snap new file mode 100644 index 0000000000..98bb911c6d --- /dev/null +++ b/src/components/__tests__/Drawer/__snapshots__/DrawerSection.test.js.snap @@ -0,0 +1,30 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`DrawerSection renders properly 1`] = ` + + + + +`;