From 28eb1730eb2daff1e1407a8d38471bd9cb6b460e Mon Sep 17 00:00:00 2001
From: zouxuoz <zouxuoz@gmail.com>
Date: Fri, 2 Nov 2018 18:00:54 +0300
Subject: [PATCH] fix(Dialog): limit max height for scrollable

---
 src/atoms/Dialog/DialogBody.js | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/atoms/Dialog/DialogBody.js b/src/atoms/Dialog/DialogBody.js
index bedb3cb4..8d9de9d7 100644
--- a/src/atoms/Dialog/DialogBody.js
+++ b/src/atoms/Dialog/DialogBody.js
@@ -1,28 +1,34 @@
 import React from 'react';
 
-import { createTheme } from '../../utils';
+import { createTheme, createStyledTag } from '../../utils';
 import { Card } from '../Card';
 import type { PropSizes } from '../../types';
 
 type DialogBodyProps = {|
   children?: React$Node,
   padding?: PropSizes,
+  scrollable?: boolean,
 |};
 
 const name = 'dialogBody';
 
 const theme = createTheme(name, {
   modifiers: {
+    scrollable: {
+      maxHeight: 'calc(60vh - 14rem)',
+    },
   },
   defaults: {
+    scrollable: false,
   },
 });
 
-function DialogBody({
-  children,
-  ...rest
-  }: DialogBodyProps) {
-  return <Card.Body { ...rest }>{ children }</Card.Body>;
-}
+const DialogBodyTag = createStyledTag(name, {});
+
+const DialogBody = ({ children, ...rest }: DialogBodyProps) => (
+  <DialogBodyTag tagName={ Card.Body } { ...rest }>
+    { children }
+  </DialogBodyTag>
+);
 
 export { DialogBody, theme };