Added Tooltip

jxom · Dec 4, 2018 · b61ab76 · b61ab76
1 parent d3a53b0
commit b61ab76
Show file tree

Hide file tree

Showing 17 changed files with 771 additions and 733 deletions.
diff --git a/src/Button/Button.js b/src/Button/Button.js
@@ -1,26 +1,26 @@
 // @flow
-import React, { type Node } from 'react';
+import React, { Fragment, type Node } from 'react';
 import styled from 'reakit/styled';
 import Box from 'reakit/Box';
 
 import type { ButtonType, Palette, Size } from '../types';
 import Spinner from '../Spinner';
 import _Button from './styled';
 
+const Text = styled.span`
+  align-items: center;
+  display: inline-flex;
+`;
 export const SpinnerWrapper = styled(Box)`
   position: absolute;
   display: flex;
   align-items: center;
   justify-content: center;
 
-  & + span {
+  & + ${Text} {
     opacity: 0;
   }
 `;
-const Text = styled.span`
-  align-items: center;
-  display: inline-flex;
-`;
 
 type Props = {
   use?: any,
@@ -60,11 +60,15 @@ export const Button = ({
       {...props}
     >
       {isLoading ? (
-        <SpinnerWrapper>
-          <Spinner color={kind === 'default' ? `${palette || ''}Inverted` : palette} />
-        </SpinnerWrapper>
-      ) : null}
-      <Text>{children}</Text>
+        <Fragment>
+          <SpinnerWrapper>
+            <Spinner color={kind === 'default' ? `${palette || ''}Inverted` : palette} />
+          </SpinnerWrapper>
+          <Text>{children}</Text>
+        </Fragment>
+      ) : (
+        children
+      )}
     </_Button>
   );
 };