feat(Divider): add noMargin prop

8base · Sep 9, 2020 · 23909da · 23909da
1 parent e7e3c72
commit 23909da
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/src/components/Divider/Divider.js b/src/components/Divider/Divider.js
@@ -6,10 +6,11 @@ import { DividerOuter, DividerInner, DividerTitle } from './Divider.theme';
 
 type DividerProps = {
   children?: React$Node,
+  noOffset?: boolean;
 };
 
-const Divider = ({ children, ...rest }: DividerProps) => (
-  <DividerOuter { ...rest }>
+const Divider = ({ children, noOffset = false, ...rest }: DividerProps) => (
+  <DividerOuter noOffset={ noOffset } { ...rest }>
     <Choose>
       <When condition={ !!children }>
         <DividerInner />

diff --git a/src/components/Divider/Divider.theme.js b/src/components/Divider/Divider.theme.js
@@ -3,15 +3,15 @@ import { createThemeTag } from '../../theme/createThemeTag';
 const name = 'divider';
 
 const [DividerOuter, themeOuter] = createThemeTag(name, () => ({
-  root: {
+  root: props => ({
     width: '100%',
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'stretch',
-    marginTop: '24px',
-    marginBottom: '24px',
+    marginTop: props.noOffset ? '0' : '24px',
+    marginBottom: props.noOffset ? '0' : '24px',
     height: '18px',
-  },
+  }),
 }));
 
 const [DividerInner, themeInner] = createThemeTag(`${name}Inner`, ({ COLORS }) => ({