initial commit

src/components/Spinner/index.js

@@ -0,0 +1,18 @@
+/**
+ * @prettier
+ * @flow
+ */
+
+import React from 'react';
+import type { Node } from 'react';
+
+import { IProps } from './types';
+import { Wrapper, Circular } from './styles';
+
+const Spinner = ({ size = 50, centered = false }: IProps): Node => (
+  <Wrapper centered={centered}>
+    <Circular size={size} />
+  </Wrapper>
+);
+
+export default Spinner;

src/components/Spinner/styles.js

@@ -0,0 +1,30 @@
+/**
+ * @prettier
+ * @flow
+ */
+
+import styled, { css } from 'react-emotion';
+import CircularProgress from '@material-ui/core/CircularProgress/index';
+import colors from '../../utils/styles/colors';
+
+export const Wrapper = styled.div`
+  && {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    ${props =>
+      props.centered &&
+      css`
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+      `};
+  }
+`;
+
+export const Circular = styled(CircularProgress)`
+  && {
+    color: ${colors.primary};
+  }
+`;

src/components/Spinner/types.js

@@ -0,0 +1,9 @@
+/**
+ * @prettier
+ * @flow
+ */
+
+export interface IProps {
+  size?: number;
+  centered?: boolean;
+}