From b08e0065ddf8bf1db95054c0855e45cc4e7f9727 Mon Sep 17 00:00:00 2001
From: Nathan Marks <nathan.marks@instacart.com>
Date: Tue, 11 Jun 2019 16:01:23 -0400
Subject: [PATCH] Use emotion

---
 babel.config.js                               |   3 +-
 docs/components.md                            |  14 +
 lib/styleguide/Wrapper.js                     |  19 +-
 package.json                                  |   4 +-
 src/base/RadioCheckboxBase.js                 |  14 +-
 src/components/Buttons/Button.js              |   9 +-
 src/components/Buttons/Checkbox.js            |   2 +-
 src/components/Buttons/CircleButton.js        |   7 +-
 src/components/Buttons/Radio.js               |   2 +-
 src/components/Buttons/RadioGroup.js          |   2 +-
 src/components/Buttons/Switch.js              |   8 +-
 src/components/Forms/FloatingLabel.js         |  17 +-
 src/components/Forms/HelperText.js            |   2 +-
 src/components/Forms/MaskedTextField.js       |  15 +-
 src/components/Forms/Select.js                |  18 +-
 src/components/Forms/ServerError.js           |   4 +-
 src/components/Forms/TextField.js             |  13 +-
 src/components/Forms/TextFieldHint.js         |   4 +-
 src/components/Forms/ValidationError.js       |   4 +-
 src/components/Grid/Column.js                 |   5 +-
 src/components/Grid/Grid.js                   |   5 +-
 src/components/Grid/Row.js                    |   5 +-
 src/components/Icon/Icon.js                   |   5 +-
 src/components/Link/Link.js                   |   5 +-
 src/components/Loading/LoadingBox.js          |  42 +-
 src/components/Menus/DropdownMenu.js          |  10 +-
 src/components/Menus/Menu.js                  |   2 +-
 src/components/Menus/MenuDivider.js           |   2 +-
 src/components/Menus/MenuItem.js              |  14 +-
 .../NavigationPills/NavigationPill.js         |   7 +-
 .../NavigationPills/NavigationPills.js        |   9 +-
 src/components/Pill/Pill.js                   |   5 +-
 src/components/SVGIcon/SVGIcon.js             |   3 +-
 src/components/ScrollTrack/ScrollTrack.js     |  16 +-
 .../ScrollTrack/docs/ScrollTrack.md           |   2 +-
 src/components/Tooltip/InnerToolTip.js        |   2 +-
 src/components/Tooltip/Tooltip.js             |   2 +-
 src/components/Tooltip/TooltipArrow.js        |   2 +-
 src/components/Tooltip/TooltipPosition.js     |   2 +-
 src/components/Transitions/Fade.js            |   2 +-
 src/components/Transitions/Grow.js            |   2 +-
 src/components/Transitions/Slide.js           |   4 +-
 src/components/Typography/Text.js             |   5 +-
 src/styles/SetStyles.js                       |   5 +-
 styleguide.config.js                          | 113 ++-
 webpack.config.js                             |   3 +-
 webpack.release.config.js                     |  59 +-
 yarn.lock                                     | 669 ++++++++++++++++--
 48 files changed, 851 insertions(+), 317 deletions(-)

diff --git a/babel.config.js b/babel.config.js
index dd23a3de..cb140b2a 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -12,6 +12,7 @@ module.exports = api => {
         },
       ],
       '@babel/preset-react',
+      '@emotion/babel-preset-css-prop',
     ],
     plugins: [
       [
@@ -22,7 +23,7 @@ module.exports = api => {
       ],
       ['@babel/plugin-proposal-class-properties', { loose: true }],
       ['@babel/plugin-proposal-object-rest-spread', { loose: true }],
-      ['@babel/transform-runtime', { useESModules: isTest ? false : true }],
+      ['@babel/transform-runtime', { useESModules: !isTest }],
       '@babel/plugin-transform-react-constant-elements',
     ],
   }
diff --git a/docs/components.md b/docs/components.md
index e69de29b..4a6a4720 100644
--- a/docs/components.md
+++ b/docs/components.md
@@ -0,0 +1,14 @@
+- [Buttons] (#/Components/Buttons)
+- [Forms] (#/Components/Forms)
+- [Typography] (#/Components/Typography)
+- [Grid] (#/Components/Grid)
+- [Icon] (#/Components/Icon)
+- [SVGIcon] (#/Components/SVGIcon)
+- [Link] (#/Components/Link)
+- [Loading] (#/Components/Loading)
+- [Menus] (#/Components/Menus)
+- [NavigationPills] (#/Components/NavigationPills)
+- [Pill] (#/Components/Pill)
+- [ScrollTrack] (#/Components/ScrollTrack)
+- [Tooltip] (#/Components/Tooltip)
+- [Transitions] (#/Components/Transitions)
diff --git a/lib/styleguide/Wrapper.js b/lib/styleguide/Wrapper.js
index 2f96d2b6..c19e4367 100644
--- a/lib/styleguide/Wrapper.js
+++ b/lib/styleguide/Wrapper.js
@@ -1,14 +1,11 @@
-import React, { Component } from 'react';
-import { StyleRoot } from 'radium'
+import React from 'react'
 import SetStyles from '../../src/styles/SetStyles'
 
-export default class Wrapper extends Component {
-  render() {
-    return (
-      <StyleRoot>
-        <SetStyles assetsUrl={'src/fonts'} />
-        { this.props.children }
-      </StyleRoot>
-    )
-  }
+export default function Wrapper(props) {
+  return (
+    <>
+      <SetStyles assetsUrl={'src/fonts'} />
+      {props.children}
+    </>
+  )
 }
diff --git a/package.json b/package.json
index 1d49e743..152557a2 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
     "@babel/plugin-transform-runtime": "7.4.4",
     "@babel/preset-env": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
+    "@emotion/babel-preset-css-prop": "10.0.9",
     "@instacart/eslint-config": "0.1.9",
     "@instacart/prettier-config": "0.1.1",
     "@svgr/cli": "4.3.0",
@@ -68,7 +69,6 @@
     "jest": "^24.8.0",
     "prettier": "1.16.4",
     "prompt": "^1.0.0",
-    "radium": "^0.22.0",
     "react": "16.4.2",
     "react-dom": "16.4.2",
     "react-styleguidist": "9.0.9",
@@ -83,6 +83,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.1.2",
+    "@emotion/core": "10.0.10",
     "js-yaml": "3.13.1",
     "lodash.isequal": "^4.5.0",
     "react-text-mask": "^5.3.0",
@@ -94,7 +95,6 @@
   },
   "peerDependencies": {
     "prop-types": "^15.0.0 || ^16.0.0",
-    "radium": ">=0.18.0",
     "react": "^15.0.0 || ^16.0.0",
     "react-dom": "^15.0.0 || ^16.0.0",
     "react-transition-group": "^2.2.1"
diff --git a/src/base/RadioCheckboxBase.js b/src/base/RadioCheckboxBase.js
index b25e87a2..46f8e99a 100644
--- a/src/base/RadioCheckboxBase.js
+++ b/src/base/RadioCheckboxBase.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import colors from '../styles/colors'
 import withTheme from '../styles/themer/withTheme'
 import { themePropTypes } from '../styles/themer/utils'
@@ -113,13 +112,13 @@ class RadioCheckboxBase extends React.PureComponent {
     const internalStyle = getStyles(this.props)
 
     return (
-      <div style={{ ...internalStyle.button, ...style.button }}>
+      <div css={{ ...internalStyle.button, ...style.button }}>
         {renderInputButton(isSelected, getInputStyles(this.props, this.state))}
         <input
           id={id}
           type={btnType}
           onChange={this.handleChange}
-          style={{ ...internalStyle.inputBtn, ...style.inputBtn }}
+          css={{ ...internalStyle.inputBtn, ...style.inputBtn }}
           value={value}
           checked={isSelected}
           disabled={isDisabled}
@@ -142,12 +141,9 @@ class RadioCheckboxBase extends React.PureComponent {
     // ensure both text and id are supplied so the button and label are correctly associated
     if (labelText && id) {
       return (
-        <Element style={{ ...internalStyle.wrapEl, ...style.wrapEl }}>
+        <Element css={{ ...internalStyle.wrapEl, ...style.wrapEl }}>
           {this.renderInputBtn()}
-          <label
-            htmlFor={id}
-            style={{ ...internalStyle.label, ...style.label, ...isDisabledStyle }}
-          >
+          <label htmlFor={id} css={{ ...internalStyle.label, ...style.label, ...isDisabledStyle }}>
             {labelText}
           </label>
         </Element>
@@ -158,4 +154,4 @@ class RadioCheckboxBase extends React.PureComponent {
   }
 }
 
-export default withTheme(Radium(RadioCheckboxBase))
+export default withTheme(RadioCheckboxBase)
diff --git a/src/components/Buttons/Button.js b/src/components/Buttons/Button.js
index ec6fe2e5..7941e441 100644
--- a/src/components/Buttons/Button.js
+++ b/src/components/Buttons/Button.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import Icon from '../Icon/Icon'
 import withTheme from '../../styles/themer/withTheme'
 import { themePropTypes } from '../../styles/themer/utils'
@@ -213,7 +212,7 @@ const Button = props => {
     disabled: props.disabled,
     tabIndex: props.tabIndex,
     type: props.type,
-    style: [
+    css: [
       baseStyles,
       sizeStyles[props.size],
       snacksStyles[props.snacksStyle][props.disabled ? 'disabled' : 'base'],
@@ -249,7 +248,7 @@ const Button = props => {
     return (
       <ElementType {...finalProps}>
         {icon}
-        <span style={{ ...spacing.MARGIN_RIGHT_XS }} />
+        <span css={{ ...spacing.MARGIN_RIGHT_XS }} />
         {props.children}
       </ElementType>
     )
@@ -259,7 +258,7 @@ const Button = props => {
     return (
       <ElementType {...finalProps}>
         {props.children}
-        <span style={{ ...spacing.MARGIN_LEFT_XS }} />
+        <span css={{ ...spacing.MARGIN_LEFT_XS }} />
         {icon}
       </ElementType>
     )
@@ -333,4 +332,4 @@ Button.defaultProps = {
   elementAttributes: {},
 }
 
-export default withTheme(Radium(Button))
+export default withTheme(Button)
diff --git a/src/components/Buttons/Checkbox.js b/src/components/Buttons/Checkbox.js
index 3f391069..85811d03 100644
--- a/src/components/Buttons/Checkbox.js
+++ b/src/components/Buttons/Checkbox.js
@@ -6,7 +6,7 @@ import checkboxSelectedSvg from '../../assets/checkboxSelected.svg'
 
 const renderInputButton = (isSelected, style) => {
   const SvgComponent = isSelected ? checkboxSelectedSvg : checkboxBaseSvg
-  return <SvgComponent aria-hidden="true" style={style} />
+  return <SvgComponent aria-hidden="true" css={style} />
 }
 
 const Checkbox = props => {
diff --git a/src/components/Buttons/CircleButton.js b/src/components/Buttons/CircleButton.js
index 2164480d..5ca80dcf 100644
--- a/src/components/Buttons/CircleButton.js
+++ b/src/components/Buttons/CircleButton.js
@@ -3,7 +3,6 @@
  *
  * @author [Dominic Cocchiarella ](https://github.com/docchia)
  */
-import Radium from 'radium'
 import React from 'react'
 import PropTypes from 'prop-types'
 import responsive from '../../styles/responsive'
@@ -34,6 +33,7 @@ const CircleButton = props => {
 
   return (
     <button
+      className={props.className}
       onClick={e => {
         if (props.onClick) {
           e.preventDefault()
@@ -41,7 +41,7 @@ const CircleButton = props => {
         }
       }}
       aria-label={props.ariaLabel}
-      style={[
+      css={[
         styles.default,
         {
           backgroundColor: action,
@@ -69,6 +69,7 @@ CircleButton.propTypes = {
   /** Label to be used by screen readers */
   ariaLabel: PropTypes.string,
   children: PropTypes.node,
+  className: PropTypes.string,
   /** Bool to disable click/touch listeners */
   disabled: PropTypes.bool,
   /** Callback function called after button click */
@@ -79,4 +80,4 @@ CircleButton.propTypes = {
   style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
 }
 
-export default withTheme(Radium(CircleButton))
+export default withTheme(CircleButton)
diff --git a/src/components/Buttons/Radio.js b/src/components/Buttons/Radio.js
index 620ae857..c3116246 100644
--- a/src/components/Buttons/Radio.js
+++ b/src/components/Buttons/Radio.js
@@ -6,7 +6,7 @@ import radioSelectedSvg from '../../assets/radioSelected.svg'
 
 const renderInputButton = (isSelected, style) => {
   const SvgComponent = isSelected ? radioSelectedSvg : radioBaseSvg
-  return <SvgComponent aria-hidden="true" style={style} />
+  return <SvgComponent aria-hidden="true" css={style} />
 }
 
 const Radio = props => {
diff --git a/src/components/Buttons/RadioGroup.js b/src/components/Buttons/RadioGroup.js
index ff043a51..bffe9945 100644
--- a/src/components/Buttons/RadioGroup.js
+++ b/src/components/Buttons/RadioGroup.js
@@ -66,7 +66,7 @@ class RadioGroup extends React.Component {
       })
     })
 
-    return <Element style={{ ...STYLE.wrapEl, ...style.wrapEl }}>{childrenWithProps}</Element>
+    return <Element css={{ ...STYLE.wrapEl, ...style.wrapEl }}>{childrenWithProps}</Element>
   }
 }
 
diff --git a/src/components/Buttons/Switch.js b/src/components/Buttons/Switch.js
index eaffc32c..846e5cc4 100644
--- a/src/components/Buttons/Switch.js
+++ b/src/components/Buttons/Switch.js
@@ -43,10 +43,10 @@ const STYLES = {
 
 const renderInputButton = (isSelected, style, displayOnOffLabel) => {
   return (
-    <div style={[style, { backgroundColor: style.fill }, STYLES.background]}>
-      {displayOnOffLabel && isSelected && <OneSvg style={STYLES.one} />}
-      {displayOnOffLabel && !isSelected && <ZeroSvg style={STYLES.zero} />}
-      <div style={[STYLES.toggle.default, isSelected && STYLES.toggle.selected]} />
+    <div css={[style, { backgroundColor: style.fill }, STYLES.background]}>
+      {displayOnOffLabel && isSelected && <OneSvg css={STYLES.one} />}
+      {displayOnOffLabel && !isSelected && <ZeroSvg css={STYLES.zero} />}
+      <div css={[STYLES.toggle.default, isSelected && STYLES.toggle.selected]} />
     </div>
   )
 }
diff --git a/src/components/Forms/FloatingLabel.js b/src/components/Forms/FloatingLabel.js
index 7ebb4467..df5f7e49 100644
--- a/src/components/Forms/FloatingLabel.js
+++ b/src/components/Forms/FloatingLabel.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import { colors } from '../../styles'
 import withTheme from '../../styles/themer/withTheme'
 import { themePropTypes } from '../../styles/themer/utils'
@@ -46,7 +45,6 @@ const getSnackStyles = snacksTheme => {
 }
 
 @withTheme
-@Radium
 class FloatingLabel extends Component {
   static propTypes = {
     /** Disabled styling for the label */
@@ -61,6 +59,7 @@ class FloatingLabel extends Component {
     isActive: PropTypes.bool,
     /** Override styles */
     style: PropTypes.object,
+    className: PropTypes.string,
     /** Label text */
     text: PropTypes.string,
     /** Snacks theme attributes provided by `Themer` */
@@ -72,7 +71,17 @@ class FloatingLabel extends Component {
   }
 
   render() {
-    const { float, disabled, hasError, htmlFor, isActive, style, text, snacksTheme } = this.props
+    const {
+      className,
+      float,
+      disabled,
+      hasError,
+      htmlFor,
+      isActive,
+      style,
+      text,
+      snacksTheme,
+    } = this.props
 
     const snacksStyles = getSnackStyles(snacksTheme)
 
@@ -86,7 +95,7 @@ class FloatingLabel extends Component {
     ]
 
     return (
-      <label htmlFor={htmlFor} style={inputStyles}>
+      <label htmlFor={htmlFor} css={inputStyles} className={className}>
         {text}
       </label>
     )
diff --git a/src/components/Forms/HelperText.js b/src/components/Forms/HelperText.js
index 4058507f..f8acf97b 100644
--- a/src/components/Forms/HelperText.js
+++ b/src/components/Forms/HelperText.js
@@ -10,7 +10,7 @@ const style = {
   width: '100%',
 }
 
-const HelperText = ({ helperText }) => (helperText ? <div style={style}>{helperText}</div> : null)
+const HelperText = ({ helperText }) => (helperText ? <div css={style}>{helperText}</div> : null)
 
 HelperText.propTypes = {
   /** Text */
diff --git a/src/components/Forms/MaskedTextField.js b/src/components/Forms/MaskedTextField.js
index 0677ea0e..ecaed3a3 100644
--- a/src/components/Forms/MaskedTextField.js
+++ b/src/components/Forms/MaskedTextField.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import MaskedTextInput from 'react-text-mask'
 import { colors } from '../../styles'
 import withTheme from '../../styles/themer/withTheme'
@@ -162,7 +161,6 @@ export const maskedTextFieldPropTypes = {
 
 @withTheme
 @FormComponent
-@Radium
 class MaskedTextField extends React.Component {
   static propTypes = maskedTextFieldPropTypes
 
@@ -256,16 +254,11 @@ class MaskedTextField extends React.Component {
 
     return (
       <div
-        style={[
-          styles.wrapper,
-          fullWidth && styles.fullWidth,
-          halfWidth && styles.halfWidth,
-          style,
-        ]}
+        css={[styles.wrapper, fullWidth && styles.fullWidth, halfWidth && styles.halfWidth, style]}
       >
         {serverError && !disabled && !isValid && <ServerError text={serverError} />}
 
-        <div style={styles.inputContainer}>
+        <div css={styles.inputContainer}>
           <FloatingLabel
             text={floatingLabelText}
             float={isFocused || hasValue}
@@ -273,7 +266,7 @@ class MaskedTextField extends React.Component {
             isActive={isFocused}
             hasError={hasError}
             htmlFor={inputId}
-            style={{ pointerEvents: 'none' }}
+            css={{ pointerEvents: 'none' }}
             snacksTheme={snacksTheme}
           />
 
@@ -309,7 +302,7 @@ class MaskedTextField extends React.Component {
                   this.input = input
                   ref(input)
                 }}
-                style={getInputSyles({
+                css={getInputSyles({
                   props: this.props,
                   theme: snacksTheme,
                   isFocused,
diff --git a/src/components/Forms/Select.js b/src/components/Forms/Select.js
index ede5ff11..b3141474 100644
--- a/src/components/Forms/Select.js
+++ b/src/components/Forms/Select.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import { colors } from '../../styles'
 import FormComponent from './FormComponent'
 import DropdownMenu from '../Menus/DropdownMenu'
@@ -124,7 +123,6 @@ const getSnackStyles = snacksTheme => {
 
 @withTheme
 @FormComponent
-@Radium
 class Select extends React.PureComponent {
   static propTypes = {
     /** Name of the field */
@@ -259,7 +257,7 @@ class Select extends React.PureComponent {
         ref={node => (this.trigger = node)}
       >
         <div
-          style={[
+          css={[
             styles.trigger,
             disabled && styles.triggerDisabled,
             (isOpen || isFocused) && !hasError && snacksStyles.highlight,
@@ -274,27 +272,27 @@ class Select extends React.PureComponent {
             disabled={disabled}
             isActive={isOpen || isFocused}
             hasError={hasError}
-            style={styles.floatingLabel}
+            css={styles.floatingLabel}
             snacksTheme={snacksTheme}
           />
 
-          <div style={styles.labelContainer}>
+          <div css={styles.labelContainer}>
             {hintText && (
               <TextFieldHint
                 text={hintText}
                 show={showHintText}
                 disabled={disabled}
-                style={styles.floatingLabel}
+                css={styles.floatingLabel}
               />
             )}
 
             {selectedOption && selectedOption.label}
           </div>
 
-          <div style={styles.iconContainer}>
+          <div css={styles.iconContainer}>
             <Icon
               name="arrowDownSmallBold"
-              style={[
+              css={[
                 styles.icon,
                 snacksStyles.icon,
                 isOpen && styles.iconOpen,
@@ -325,9 +323,7 @@ class Select extends React.PureComponent {
     const { isOpen } = this.state
 
     return (
-      <div
-        style={[styles.root, fullWidth && styles.fullWidth, halfWidth && styles.halfWidth, style]}
-      >
+      <div css={[styles.root, fullWidth && styles.fullWidth, halfWidth && styles.halfWidth, style]}>
         <div>
           {serverError && !disabled && !isValid && <ServerError text={serverError} />}
 
diff --git a/src/components/Forms/ServerError.js b/src/components/Forms/ServerError.js
index 8ac41b9d..739fa231 100644
--- a/src/components/Forms/ServerError.js
+++ b/src/components/Forms/ServerError.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import { colors } from '../../styles'
 
 const styles = {
@@ -17,7 +16,6 @@ const styles = {
   },
 }
 
-@Radium
 class ServerError extends Component {
   static propTypes = {
     /** Override styles */
@@ -30,7 +28,7 @@ class ServerError extends Component {
     const { style, text } = this.props
 
     return (
-      <div style={[styles.root, style]} aria-live={'assertive'} aria-atomic>
+      <div css={[styles.root, style]} aria-live={'assertive'} aria-atomic>
         {text}
       </div>
     )
diff --git a/src/components/Forms/TextField.js b/src/components/Forms/TextField.js
index d551181c..041b8275 100644
--- a/src/components/Forms/TextField.js
+++ b/src/components/Forms/TextField.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import { colors } from '../../styles'
 import FormComponent from './FormComponent'
 import ValidationError from './ValidationError'
@@ -72,7 +71,6 @@ const getSnackStyles = snacksTheme => {
 
 @withTheme
 @FormComponent
-@Radium
 class TextField extends React.Component {
   static propTypes = {
     /** Name of the field */
@@ -221,16 +219,11 @@ class TextField extends React.Component {
 
     return (
       <div
-        style={[
-          styles.wrapper,
-          fullWidth && styles.fullWidth,
-          halfWidth && styles.halfWidth,
-          style,
-        ]}
+        css={[styles.wrapper, fullWidth && styles.fullWidth, halfWidth && styles.halfWidth, style]}
       >
         {serverError && !disabled && !isValid && <ServerError text={serverError} />}
 
-        <div style={styles.inputContainer}>
+        <div css={styles.inputContainer}>
           {floatingLabelText && (
             <FloatingLabel
               text={floatingLabelText}
@@ -270,7 +263,7 @@ class TextField extends React.Component {
             ]
               .filter(Boolean)
               .join(' ')}
-            style={[
+            css={[
               styles.input,
               inputStyle,
               disabled && styles.inputDisabled,
diff --git a/src/components/Forms/TextFieldHint.js b/src/components/Forms/TextFieldHint.js
index d13a7173..bf11be3a 100644
--- a/src/components/Forms/TextFieldHint.js
+++ b/src/components/Forms/TextFieldHint.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import { colors } from '../../styles'
 
 const styles = {
@@ -27,7 +26,6 @@ const styles = {
   },
 }
 
-@Radium
 class TextFieldHint extends Component {
   static propTypes = {
     /** Hint Text */
@@ -52,7 +50,7 @@ class TextFieldHint extends Component {
     return (
       <div
         id={inputId}
-        style={[styles.root, style, disabled && styles.disabled, show && styles.show]}
+        css={[styles.root, style, disabled && styles.disabled, show && styles.show]}
       >
         {text}
       </div>
diff --git a/src/components/Forms/ValidationError.js b/src/components/Forms/ValidationError.js
index a319222f..da56d3a1 100644
--- a/src/components/Forms/ValidationError.js
+++ b/src/components/Forms/ValidationError.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import { colors } from '../../styles'
 
 const styles = {
@@ -21,7 +20,6 @@ const styles = {
   },
 }
 
-@Radium
 class ValidationError extends Component {
   static propTypes = {
     /** A uniq id */
@@ -37,7 +35,7 @@ class ValidationError extends Component {
 
     return (
       <div
-        style={[styles.root, show && styles.show]}
+        css={[styles.root, show && styles.show]}
         aria-live={'assertive'}
         aria-atomic
         id={`error_${inputId}`}
diff --git a/src/components/Grid/Column.js b/src/components/Grid/Column.js
index dcb1ea17..b071c772 100644
--- a/src/components/Grid/Column.js
+++ b/src/components/Grid/Column.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import responsive from '../../styles/responsive'
 import { supportsCSSGrid } from '../../utils/detectFeature'
 
@@ -75,7 +74,7 @@ const Column = props => {
 
   const styles = supportsCSSGrid() ? getSizedStyles(sizes) : getLecacySizedStyles(sizes)
 
-  return <div style={[styles, props.style]}>{props.children}</div>
+  return <div css={[styles, props.style]}>{props.children}</div>
 }
 
 Column.propTypes = {
@@ -97,4 +96,4 @@ Column.defaultProps = {
   sizes: {},
 }
 
-export default Radium(Column)
+export default Column
diff --git a/src/components/Grid/Grid.js b/src/components/Grid/Grid.js
index 9973a311..d345fce2 100644
--- a/src/components/Grid/Grid.js
+++ b/src/components/Grid/Grid.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import responsive from '../../styles/responsive'
 
 const styles = {
@@ -35,7 +34,7 @@ const styles = {
 }
 
 const Grid = props => {
-  return <div style={[styles, props.style]}>{props.children}</div>
+  return <div css={[styles, props.style]}>{props.children}</div>
 }
 
 Grid.propTypes = {
@@ -44,4 +43,4 @@ Grid.propTypes = {
   style: PropTypes.object,
 }
 
-export default Radium(Grid)
+export default Grid
diff --git a/src/components/Grid/Row.js b/src/components/Grid/Row.js
index fc1af5f9..e4d092d6 100644
--- a/src/components/Grid/Row.js
+++ b/src/components/Grid/Row.js
@@ -1,7 +1,6 @@
 /* eslint-disable react/no-unused-prop-types */
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import responsive from '../../styles/responsive'
 import { supportsCSSGrid } from '../../utils/detectFeature'
 
@@ -129,7 +128,7 @@ const Row = props => {
 
   return (
     <div
-      style={[
+      css={[
         {
           ...componentStyles,
           ...getMaxColumnsStyles(props),
@@ -157,4 +156,4 @@ Row.defaultProps = {
   maxColumns: 14,
 }
 
-export default Radium(Row)
+export default Row
diff --git a/src/components/Icon/Icon.js b/src/components/Icon/Icon.js
index a7963509..565a6b9e 100644
--- a/src/components/Icon/Icon.js
+++ b/src/components/Icon/Icon.js
@@ -1,5 +1,4 @@
 import React from 'react'
-import Radium from 'radium'
 import PropTypes from 'prop-types'
 import hexValues from './hexValues'
 
@@ -27,7 +26,7 @@ const Icon = props => {
   const { style, onClick } = props
   const icon = getIcon(props)
   return (
-    <i style={[baseStyles, style]} aria-hidden onClick={onClick}>
+    <i css={[baseStyles, style]} aria-hidden onClick={onClick}>
       {icon}
     </i>
   )
@@ -48,4 +47,4 @@ Icon.propTypes = {
   onClick: PropTypes.func,
 }
 
-export default Radium(Icon)
+export default Icon
diff --git a/src/components/Link/Link.js b/src/components/Link/Link.js
index 6a803347..1f74f665 100644
--- a/src/components/Link/Link.js
+++ b/src/components/Link/Link.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import withTheme from '../../styles/themer/withTheme'
 import { themePropTypes } from '../../styles/themer/utils'
 
@@ -27,7 +26,7 @@ const Link = props => {
   return (
     <a
       href={props.href}
-      style={[styles, props.style]}
+      css={[styles, props.style]}
       onClick={e => {
         props.onClick(e, props)
       }}
@@ -63,4 +62,4 @@ Link.defaultProps = {
   onClick: noop,
 }
 
-export default withTheme(Radium(Link))
+export default withTheme(Link)
diff --git a/src/components/Loading/LoadingBox.js b/src/components/Loading/LoadingBox.js
index 232c4577..f261a310 100644
--- a/src/components/Loading/LoadingBox.js
+++ b/src/components/Loading/LoadingBox.js
@@ -1,30 +1,37 @@
-import Radium from 'radium'
+import { keyframes } from '@emotion/core'
 import PropTypes from 'prop-types'
 import React, { PureComponent } from 'react'
 import { colors } from '../../styles'
 
-const buildKeyFramesStyles = (startColor, endColor, name) => ({
-  animationName: Radium.keyframes(
-    {
-      '0%': { backgroundColor: startColor },
-      '50%': { backgroundColor: endColor },
-      '100%': { backgroundColor: startColor },
-    },
-    name
-  ),
-  backgroundColor: startColor,
-})
+const buildKeyFrames = (startColor, endColor) =>
+  keyframes({
+    '0%': { backgroundColor: startColor },
+    '50%': { backgroundColor: endColor },
+    '100%': { backgroundColor: startColor },
+  })
+
+const animations = {
+  loading: buildKeyFrames(colors.GRAY_93, colors.GRAY_88),
+  darkLoading: buildKeyFrames(colors.GRAY_88, colors.GRAY_74),
+  lightLoading: buildKeyFrames(colors.GRAY_97, colors.GRAY_93),
+}
 
 const baseLoadingStyle = {
-  animation: 'x 3s ease-in-out infinite',
-  ...buildKeyFramesStyles(colors.GRAY_93, colors.GRAY_88, 'loading'),
+  animation: `${animations.loading} 3s ease-in-out infinite`,
+  background: colors.GRAY_93,
   width: '100%',
   height: '20px',
 }
 
 const backgroundStyles = {
-  dark: buildKeyFramesStyles(colors.GRAY_88, colors.GRAY_74, 'darkLoading'),
-  light: buildKeyFramesStyles(colors.GRAY_97, colors.GRAY_93, 'lightLoading'),
+  dark: {
+    animation: `${animations.darkLoading} 3s ease-in-out infinite`,
+    background: colors.GRAY_88,
+  },
+  light: {
+    animation: `${animations.lightLoading} 3s ease-in-out infinite`,
+    background: colors.GRAY_97,
+  },
 }
 
 const shapeStyles = {
@@ -54,7 +61,6 @@ const determineStyle = (background, shape, size) => {
   }
 }
 
-@Radium
 class LoadingBox extends PureComponent {
   static propTypes = {
     /** Use for rendering dark backgrounds. */
@@ -83,7 +89,7 @@ class LoadingBox extends PureComponent {
       ...style,
     }
 
-    return <div style={boxStyle} />
+    return <div css={boxStyle} />
   }
 }
 
diff --git a/src/components/Menus/DropdownMenu.js b/src/components/Menus/DropdownMenu.js
index 462a94ba..8c0168f8 100644
--- a/src/components/Menus/DropdownMenu.js
+++ b/src/components/Menus/DropdownMenu.js
@@ -1,7 +1,6 @@
 import React from 'react'
 import { findDOMNode } from 'react-dom'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import Menu from './Menu'
 import Slide from '../Transitions/Slide'
 import Fade from '../Transitions/Fade'
@@ -31,7 +30,6 @@ const styles = {
   },
 }
 
-@Radium
 class DropdownMenu extends React.Component {
   static propTypes = {
     /** MenuItems or Divider */
@@ -195,17 +193,17 @@ class DropdownMenu extends React.Component {
     const isOpen = this.state.open
 
     return (
-      <div onKeyDown={this.handleKeyDown} style={style}>
-        <div style={{ position: 'relative' }}>{this.renderTriggerElement()}</div>
+      <div onKeyDown={this.handleKeyDown} css={style}>
+        <div css={{ position: 'relative' }}>{this.renderTriggerElement()}</div>
         <div
-          style={[
+          css={[
             styles.menuContainer,
             menuContainerStyle,
             isOpen && styles.menuContainerOpen,
             !isOpen && styles.menuContainerClosed,
           ]}
         >
-          <Slide in={isOpen} axis="y" style={styles.transitionContainer} offset={30}>
+          <Slide in={isOpen} axis="y" css={styles.transitionContainer} offset={30}>
             <Fade in={isOpen} transitionTime={200}>
               <Menu
                 ref={node => (this.menu = node)}
diff --git a/src/components/Menus/Menu.js b/src/components/Menus/Menu.js
index 9ceaf4ba..1e291707 100644
--- a/src/components/Menus/Menu.js
+++ b/src/components/Menus/Menu.js
@@ -181,7 +181,7 @@ class Menu extends React.Component {
       <div
         ref={node => (this.menu = node)}
         role={role}
-        style={mergedStyles}
+        css={mergedStyles}
         onKeyDown={this.handleKeyDown}
         onBlur={this.handleBlur}
         aria-hidden={ariaHidden}
diff --git a/src/components/Menus/MenuDivider.js b/src/components/Menus/MenuDivider.js
index a63779d9..9036be36 100644
--- a/src/components/Menus/MenuDivider.js
+++ b/src/components/Menus/MenuDivider.js
@@ -16,7 +16,7 @@ const styles = {
 const MenuDivider = props => {
   const { style } = props
 
-  return <hr style={{ ...styles, ...style }} />
+  return <hr css={{ ...styles, ...style }} />
 }
 
 MenuDivider.propTypes = {
diff --git a/src/components/Menus/MenuItem.js b/src/components/Menus/MenuItem.js
index 4ce2f6ee..ca52bc3f 100644
--- a/src/components/Menus/MenuItem.js
+++ b/src/components/Menus/MenuItem.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import { colors } from '../../styles'
 import Icon from '../Icon/Icon'
 import spacing from '../../styles/spacing'
@@ -48,7 +47,6 @@ const styles = {
   },
 }
 
-@Radium
 class MenuItem extends React.Component {
   static propTypes = {
     /** Completely override the MenuItem rendering and create a custom MenuItem */
@@ -137,14 +135,14 @@ class MenuItem extends React.Component {
 
     const iconComponent =
       typeof leftIcon === 'string' ? (
-        <Icon name={leftIcon} style={[styles.leftIconStyles, leftIconStyles]} />
+        <Icon name={leftIcon} css={[styles.leftIconStyles, leftIconStyles]} />
       ) : (
         leftIcon
       )
 
     return (
-      <div style={styles.iconContainer}>
-        <div style={{ display: 'flex' }}>{iconComponent}</div>
+      <div css={styles.iconContainer}>
+        <div css={{ display: 'flex' }}>{iconComponent}</div>
       </div>
     )
   }
@@ -157,9 +155,9 @@ class MenuItem extends React.Component {
     }
 
     return (
-      <div style={styles.menuitem}>
+      <div css={styles.menuitem}>
         {this.renderLeftIcon()}
-        <div style={[styles.label, labelStyles]}>{label}</div>
+        <div css={[styles.label, labelStyles]}>{label}</div>
       </div>
     )
   }
@@ -171,7 +169,7 @@ class MenuItem extends React.Component {
       <div
         ref={node => (this.menuItem = node)}
         role={role}
-        style={[styles.root, style, disabled && styles.disabled]}
+        css={[styles.root, style, disabled && styles.disabled]}
         onClick={this.handleClick}
         onFocus={this.handleFocus}
         tabIndex={useTabIndex && !disabled ? tabIndex || 0 : undefined}
diff --git a/src/components/NavigationPills/NavigationPill.js b/src/components/NavigationPills/NavigationPill.js
index 16535136..23267097 100644
--- a/src/components/NavigationPills/NavigationPill.js
+++ b/src/components/NavigationPills/NavigationPill.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import colors from '../../styles/colors'
 import withTheme from '../../styles/themer/withTheme'
 import { themePropTypes } from '../../styles/themer/utils'
@@ -56,12 +55,12 @@ const NavigationPill = props => {
   }
 
   return (
-    <li style={styles.container} {...props.elementAttributes}>
+    <li css={styles.container} {...props.elementAttributes}>
       <a
         href={props.path || '#'}
         data-bypass
         onClick={e => props.onClick(e, props)}
-        style={[styles.main.default, { color: primaryForeground }, isActive && activeStyles]}
+        css={[styles.main.default, { color: primaryForeground }, isActive && activeStyles]}
         {...props.anchorItemAttributes}
         key={`pill-anchor-${text}`}
       >
@@ -98,4 +97,4 @@ NavigationPill.defaultProps = {
   isActive: false,
 }
 
-export default withTheme(Radium(NavigationPill))
+export default withTheme(NavigationPill)
diff --git a/src/components/NavigationPills/NavigationPills.js b/src/components/NavigationPills/NavigationPills.js
index 1dcb8d6e..9257625f 100644
--- a/src/components/NavigationPills/NavigationPills.js
+++ b/src/components/NavigationPills/NavigationPills.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import NavigationPill from './NavigationPill'
 import ScrollTrack from '../ScrollTrack/ScrollTrack'
 import colors from '../../styles/colors'
@@ -37,7 +36,7 @@ const NavigationPills = props => {
     }
 
     // eslint-disable-next-line jsx-a11y/label-has-associated-control
-    return <label style={styles.labelStyles}>{props.label}</label>
+    return <label css={styles.labelStyles}>{props.label}</label>
   }
 
   const renderPill = (pill, idx) => {
@@ -61,9 +60,9 @@ const NavigationPills = props => {
 
   return (
     <ScrollTrack>
-      <div style={wrapperStyles} ref="pillsTrack" {...props.elementAttributes}>
+      <div css={wrapperStyles} {...props.elementAttributes}>
         {renderLabel()}
-        <ul style={pillsContainerStyles} {...props.listItemAttributes}>
+        <ul css={pillsContainerStyles} {...props.listItemAttributes}>
           {props.pills.map(renderPill)}
         </ul>
       </div>
@@ -95,4 +94,4 @@ NavigationPills.defaultProps = {
   elementAttributes: {},
 }
 
-export default Radium(NavigationPills)
+export default NavigationPills
diff --git a/src/components/Pill/Pill.js b/src/components/Pill/Pill.js
index 6944b18f..24114267 100644
--- a/src/components/Pill/Pill.js
+++ b/src/components/Pill/Pill.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Radium from 'radium'
 import spacing from '../../styles/spacing'
 import withTheme from '../../styles/themer/withTheme'
 
@@ -26,7 +25,7 @@ const Pill = props => {
   const styles = getStyles(props)
 
   return (
-    <div style={[styles, props.style]} {...props.elementAttributes}>
+    <div css={[styles, props.style]} {...props.elementAttributes}>
       {props.children}
     </div>
   )
@@ -50,4 +49,4 @@ Pill.defaultProps = {
   color: '#CC0033',
 }
 
-export default withTheme(Radium(Pill))
+export default withTheme(Pill)
diff --git a/src/components/SVGIcon/SVGIcon.js b/src/components/SVGIcon/SVGIcon.js
index 130eb134..7dc8a8bf 100644
--- a/src/components/SVGIcon/SVGIcon.js
+++ b/src/components/SVGIcon/SVGIcon.js
@@ -1,5 +1,4 @@
 import React from 'react'
-import Radium from 'radium'
 import PropTypes from 'prop-types'
 import * as icons from './icons'
 
@@ -21,4 +20,4 @@ function SVGIcon({ color, name, size, ...props }) {
   return <Component aria-hidden fill={color} width={sizes[size]} height={sizes[size]} {...props} />
 }
 
-export default Radium(SVGIcon)
+export default SVGIcon
diff --git a/src/components/ScrollTrack/ScrollTrack.js b/src/components/ScrollTrack/ScrollTrack.js
index 7c3defb5..5bf898f3 100644
--- a/src/components/ScrollTrack/ScrollTrack.js
+++ b/src/components/ScrollTrack/ScrollTrack.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react'
 import isEqual from 'lodash.isequal'
-import Radium from 'radium'
 import PropTypes from 'prop-types'
 import componentStyles from './ScrollTrackStyles'
 import equalWidthTrack from './equalWidthTrack'
@@ -13,7 +12,6 @@ import Icon from '../Icon/Icon'
 
 const noOp = () => {} // eslint-disable-line no-empty-function
 
-@Radium
 class ScrollTrack extends Component {
   static equalWidthTrack = equalWidthTrack
 
@@ -364,7 +362,7 @@ class ScrollTrack extends Component {
       <CircleButton
         onClick={this.slideForward}
         ariaLabel="next"
-        style={[
+        css={[
           slideButtonStyles.default,
           slideButtonStyles.right,
           showRightArrow && { display: 'block' },
@@ -372,7 +370,7 @@ class ScrollTrack extends Component {
         ]}
         ref={node => (this.nextButton = node)}
       >
-        {nextButtonContent || <Icon name="arrowRightSmallBold" style={{ fontSize: '20px' }} />}
+        {nextButtonContent || <Icon name="arrowRightSmallBold" css={{ fontSize: '20px' }} />}
       </CircleButton>
     )
   }
@@ -389,7 +387,7 @@ class ScrollTrack extends Component {
       <CircleButton
         onClick={this.slideBack}
         ariaLabel="back"
-        style={[
+        css={[
           slideButtonStyles.default,
           slideButtonStyles.left,
           showLeftArrow && { display: 'block' },
@@ -397,7 +395,7 @@ class ScrollTrack extends Component {
         ]}
         ref={node => (this.backButton = node)}
       >
-        {backButtonContent || <Icon name="arrowLeftSmallBold" style={{ fontSize: '20px' }} />}
+        {backButtonContent || <Icon name="arrowLeftSmallBold" css={{ fontSize: '20px' }} />}
       </CircleButton>
     )
   }
@@ -418,10 +416,10 @@ class ScrollTrack extends Component {
 
     return (
       // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-      <div ref="container" style={{ ...containerStyles, ...style }} onKeyDown={this.onKeyDown}>
+      <div ref="container" css={{ ...containerStyles, ...style }} onKeyDown={this.onKeyDown}>
         {this.renderLeftArrow()}
         <div
-          style={[
+          css={[
             {
               transition: `transform ${scrollSpeed}ms ${scrollTimingFunction}`,
               transform: `translate3d(${this.state.left}px, 0, 0)`,
@@ -429,7 +427,7 @@ class ScrollTrack extends Component {
             innerContainerStyles,
           ]}
         >
-          <div ref="track" style={Track}>
+          <div ref="track" css={Track}>
             {this.childrenWithTrackProps}
           </div>
         </div>
diff --git a/src/components/ScrollTrack/docs/ScrollTrack.md b/src/components/ScrollTrack/docs/ScrollTrack.md
index 55389fa7..5bd453ec 100644
--- a/src/components/ScrollTrack/docs/ScrollTrack.md
+++ b/src/components/ScrollTrack/docs/ScrollTrack.md
@@ -144,7 +144,7 @@ const CustomComponent = ScrollTrack.equalWidthTrack(186)(({ startIndex, lastInde
     }
 
     return (
-      <div style={style}>Item</div>
+      <div key={`item_${index}`} style={style}>Item</div>
     )
   })
 
diff --git a/src/components/Tooltip/InnerToolTip.js b/src/components/Tooltip/InnerToolTip.js
index f8c93c3b..fa7be339 100644
--- a/src/components/Tooltip/InnerToolTip.js
+++ b/src/components/Tooltip/InnerToolTip.js
@@ -108,7 +108,7 @@ class InnerToolTip extends PureComponent {
     return (
       <Fade>
         {this.renderArrow()}
-        <div style={this.contentStyles}>{this.props.children}</div>
+        <div css={this.contentStyles}>{this.props.children}</div>
       </Fade>
     )
   }
diff --git a/src/components/Tooltip/Tooltip.js b/src/components/Tooltip/Tooltip.js
index 92c04a98..e7655099 100644
--- a/src/components/Tooltip/Tooltip.js
+++ b/src/components/Tooltip/Tooltip.js
@@ -92,7 +92,7 @@ class Tooltip extends PureComponent {
           show={isVisible || this.state.show}
           onRootClose={this.handleHideToolTip}
         >
-          <InnerToolTip size={size} style={style} arrowStyle={arrowStyle} snacksStyle={snacksStyle}>
+          <InnerToolTip size={size} css={style} arrowStyle={arrowStyle} snacksStyle={snacksStyle}>
             {children}
           </InnerToolTip>
         </TooltipOverlay>
diff --git a/src/components/Tooltip/TooltipArrow.js b/src/components/Tooltip/TooltipArrow.js
index dd2d5727..33a473c6 100644
--- a/src/components/Tooltip/TooltipArrow.js
+++ b/src/components/Tooltip/TooltipArrow.js
@@ -106,7 +106,7 @@ class TooltipArrow extends PureComponent {
   }
 
   render() {
-    return <div style={this.calculatedStyles} />
+    return <div css={this.calculatedStyles} />
   }
 }
 
diff --git a/src/components/Tooltip/TooltipPosition.js b/src/components/Tooltip/TooltipPosition.js
index d745a92f..b7ac72a2 100644
--- a/src/components/Tooltip/TooltipPosition.js
+++ b/src/components/Tooltip/TooltipPosition.js
@@ -140,7 +140,7 @@ class TooltipPosition extends PureComponent {
     })
 
     return (
-      <div style={computedStyles} ref={node => (this.overlay = node)}>
+      <div css={computedStyles} ref={node => (this.overlay = node)}>
         {child}
       </div>
     )
diff --git a/src/components/Transitions/Fade.js b/src/components/Transitions/Fade.js
index 0b2866e6..08f18057 100644
--- a/src/components/Transitions/Fade.js
+++ b/src/components/Transitions/Fade.js
@@ -98,7 +98,7 @@ class Fade extends PureComponent {
       ...this.initialStyles,
       ...this.transitionStyles[state],
     }
-    return <div style={styles}>{children}</div>
+    return <div css={styles}>{children}</div>
   }
 
   render() {
diff --git a/src/components/Transitions/Grow.js b/src/components/Transitions/Grow.js
index ebc11f87..8da52614 100644
--- a/src/components/Transitions/Grow.js
+++ b/src/components/Transitions/Grow.js
@@ -144,7 +144,7 @@ class Grow extends PureComponent {
       ...style,
     }
 
-    return <div style={styles}>{children}</div>
+    return <div css={styles}>{children}</div>
   }
 
   render() {
diff --git a/src/components/Transitions/Slide.js b/src/components/Transitions/Slide.js
index f450949f..cc74a898 100644
--- a/src/components/Transitions/Slide.js
+++ b/src/components/Transitions/Slide.js
@@ -103,8 +103,8 @@ class Slide extends PureComponent {
     }
 
     return (
-      <div style={topLevelStyle}>
-        <div style={styles}>{children}</div>
+      <div css={topLevelStyle}>
+        <div css={styles}>{children}</div>
       </div>
     )
   }
diff --git a/src/components/Typography/Text.js b/src/components/Typography/Text.js
index b781dce9..74402282 100644
--- a/src/components/Typography/Text.js
+++ b/src/components/Typography/Text.js
@@ -1,5 +1,4 @@
 import React from 'react'
-import Radium from 'radium'
 import PropTypes from 'prop-types'
 import { colors } from '../../styles'
 
@@ -140,7 +139,7 @@ function Text({ variant, style, children, elementType, fontWeight, ...restProps
   }
 
   return (
-    <ElementType style={finalStyles} {...restProps}>
+    <ElementType css={finalStyles} {...restProps}>
       {children}
     </ElementType>
   )
@@ -165,4 +164,4 @@ Text.propTypes = {
   style: PropTypes.shape({}),
 }
 
-export default Radium(Text)
+export default Text
diff --git a/src/styles/SetStyles.js b/src/styles/SetStyles.js
index 4be731b4..833c2ae7 100644
--- a/src/styles/SetStyles.js
+++ b/src/styles/SetStyles.js
@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
-import Radium, { Style } from 'radium'
+import { Global } from '@emotion/core'
 import { Normalize, GlobalTheme } from '../index'
 
 const getFonts = assetsUrl => {
@@ -82,7 +82,6 @@ const writeFonts = assetsUrl => {
   document.head.appendChild(style)
 }
 
-@Radium
 class Styles extends Component {
   static propTypes = {
     assetsUrl: PropTypes.string.isRequired,
@@ -98,7 +97,7 @@ class Styles extends Component {
   }
 
   render() {
-    return <Style rules={{ ...Normalize, ...GlobalTheme }} />
+    return <Global styles={{ ...Normalize, ...GlobalTheme }} />
   }
 }
 
diff --git a/styleguide.config.js b/styleguide.config.js
index eb22526e..e9cd2b91 100644
--- a/styleguide.config.js
+++ b/styleguide.config.js
@@ -1,57 +1,61 @@
-const path = require('path');
+const path = require('path')
 
-const webpackConfig = require('./webpack.config');
-webpackConfig.resolve = webpackConfig.resolve || {};
-webpackConfig.resolve.alias = webpackConfig.resolve.alias || {};
-webpackConfig.resolve.alias['ic-snacks'] = path.join(__dirname, 'dist', 'snacks.js');
+const webpackConfig = require('./webpack.config')
+webpackConfig.resolve = webpackConfig.resolve || {}
+webpackConfig.resolve.alias = webpackConfig.resolve.alias || {}
+webpackConfig.resolve.alias['ic-snacks'] =
+  process.env.NODE_ENV === 'development'
+    ? path.join(__dirname, 'src', 'index.js')
+    : path.join(__dirname, 'dist', 'snacks.js')
 
 module.exports = {
   getExampleFilename(componentPath) {
-    var parts = componentPath.split('/');
-    var componentName = parts[parts.length - 1];
-    return componentPath.replace(`/${componentName}`, `/docs/${componentName.replace('.js', '')}.md`);
+    var parts = componentPath.split('/')
+    var componentName = parts[parts.length - 1]
+    return componentPath.replace(
+      `/${componentName}`,
+      `/docs/${componentName.replace('.js', '')}.md`
+    )
   },
-  ignore: [
-    '**/*/*Styles.js',
-    '**/*.spec.js',
-  ],
+  ignore: ['**/*/*Styles.js', '**/*.spec.js'],
+  pagePerSection: true,
   sections: [
     {
       name: 'Introduction',
-      content: 'docs/introduction.md'
+      content: 'docs/introduction.md',
     },
     {
       name: 'Installation',
-      content: 'docs/installation.md'
+      content: 'docs/installation.md',
     },
     {
       name: 'Basic usage',
-      content: 'docs/basic_usage.md'
+      content: 'docs/basic_usage.md',
     },
     {
       name: 'Utilities',
       sections: [
         {
           name: 'Colors',
-          content: 'docs/colors.md'
+          content: 'docs/colors.md',
         },
         {
           name: 'Spacing',
-          content: 'docs/spacing.md'
+          content: 'docs/spacing.md',
         },
         {
           name: 'Responsive',
-          content: 'src/styles/docs/responsive.md'
+          content: 'src/styles/docs/responsive.md',
         },
-      ]
+      ],
     },
     {
       name: 'Icons',
-      content: 'docs/icons.md'
+      content: 'docs/icons.md',
     },
     {
       name: 'SVGIcons',
-      content: 'docs/svgIcons.md'
+      content: 'docs/svgIcons.md',
     },
     {
       name: 'Themes',
@@ -59,13 +63,13 @@ module.exports = {
       sections: [
         {
           name: 'Themer',
-          content: 'src/styles/themer/docs/themer.md'
+          content: 'src/styles/themer/docs/themer.md',
         },
         {
           name: 'withTheme HOC',
-          content: 'src/styles/themer/docs/withTheme.md'
-        }
-      ]
+          content: 'src/styles/themer/docs/withTheme.md',
+        },
+      ],
     },
     {
       name: 'Components',
@@ -73,83 +77,83 @@ module.exports = {
       sections: [
         {
           name: 'Buttons',
-          components: 'src/components/Buttons/[A-Z]*.js'
+          components: 'src/components/Buttons/[A-Z]*.js',
         },
         {
           name: 'Forms',
           content: 'docs/forms.md',
-          components: 'src/components/Forms/[A-Z]*.js'
+          components: 'src/components/Forms/[A-Z]*.js',
         },
         {
           name: 'Typography',
-          components: 'src/components/Typography/[A-Z]*.js'
+          components: 'src/components/Typography/[A-Z]*.js',
         },
         {
           name: 'Grid',
-          components: 'src/components/Grid/[A-Z]*.js'
+          components: 'src/components/Grid/[A-Z]*.js',
         },
         {
           name: 'Icon',
-          components: 'src/components/Icon/Icon.js'
+          components: 'src/components/Icon/Icon.js',
         },
         {
           name: 'SVGIcon',
-          components: 'src/components/SVGIcon/SVGIcon.js'
+          components: 'src/components/SVGIcon/SVGIcon.js',
         },
         {
           name: 'Link',
-          components: 'src/components/Link/Link.js'
+          components: 'src/components/Link/Link.js',
         },
         {
           name: 'Loading',
-          components: 'src/components/Loading/[A-Z]*.js'
+          components: 'src/components/Loading/[A-Z]*.js',
         },
         {
           name: 'Menus',
-          components: 'src/components/Menus/[A-Z]*.js'
+          components: 'src/components/Menus/[A-Z]*.js',
         },
         {
           name: 'NavigationPills',
-          components: 'src/components/NavigationPills/[A-Z]*.js'
+          components: 'src/components/NavigationPills/[A-Z]*.js',
         },
         {
           name: 'Pill',
-          components: 'src/components/Pill/Pill.js'
+          components: 'src/components/Pill/Pill.js',
         },
         {
           name: 'ScrollTrack',
-          components: 'src/components/ScrollTrack/[A-Z]*.js'
+          components: 'src/components/ScrollTrack/[A-Z]*.js',
         },
         {
           name: 'Tooltip',
-          components: 'src/components/Tooltip/Tooltip.js'
+          components: 'src/components/Tooltip/Tooltip.js',
         },
         {
           name: 'Transitions',
-          components: 'src/components/Transitions/[A-Z]*.js'
-        }
-      ]
-
-    }
+          components: 'src/components/Transitions/[A-Z]*.js',
+        },
+      ],
+      sectionDepth: 1,
+    },
   ],
   showCode: true,
   showUsage: true,
   styles: {
     StyleGuide: {
       content: {
-        maxWidth: '1600px'
-      }
+        maxWidth: '1600px',
+      },
     },
     ReactComponent: {
       root: {
         marginBottom: '48px',
         backgroundColor: '#fff',
-        padding: '16px'
-      }
-    }
+        padding: '16px',
+      },
+    },
   },
   styleguideComponents: {
-    Wrapper: path.join(__dirname, 'lib/styleguide/Wrapper')
+    Wrapper: path.join(__dirname, 'lib/styleguide/Wrapper'),
   },
   styleguideDir: path.join(__dirname, 'docs'),
   theme: {
@@ -169,14 +173,9 @@ module.exports = {
       sidebarBackground: '#fff',
     },
     fontFamily: {
-      base: [
-        'Open Sans',
-        'Helvetica Neue',
-        'Helvetica',
-        'sans-serif'
-      ]
-    }
+      base: ['Open Sans', 'Helvetica Neue', 'Helvetica', 'sans-serif'],
+    },
   },
   title: 'Snacks',
-  webpackConfig: webpackConfig
+  webpackConfig: webpackConfig,
 }
diff --git a/webpack.config.js b/webpack.config.js
index aad4bc5e..bea71f0a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,6 +1,6 @@
 const path = require('path')
 const webpack = require('webpack')
-const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
+const {BundleAnalyzerPlugin} = require('webpack-bundle-analyzer')
 
 const anaylzerEnabled = process.env.analyze || false
 
@@ -40,7 +40,6 @@ module.exports = {
   externals: {
     react: 'react',
     'react-dom': 'react-dom',
-    radium: 'radium',
     'prop-types': 'prop-types',
   },
   devtool: 'cheap-module-eval-source-map',
diff --git a/webpack.release.config.js b/webpack.release.config.js
index c086dc47..97a98bb4 100644
--- a/webpack.release.config.js
+++ b/webpack.release.config.js
@@ -1,28 +1,28 @@
-const path = require("path");
-const UglifyJSPlugin = require("uglifyjs-webpack-plugin");
-const webpack = require("webpack");
+const path = require('path')
+const UglifyJSPlugin = require('uglifyjs-webpack-plugin')
+const webpack = require('webpack')
 
 module.exports = {
-  mode: "production",
+  mode: 'production',
   module: {
     rules: [
-      { test: /\.js$/, loaders: ["babel-loader"], exclude: /node_modules/ },
+      { test: /\.js$/, loaders: ['babel-loader'], exclude: /node_modules/ },
       {
         test: /\.svg/,
         exclude: /node_modules/,
         use: [
-          "babel-loader",
+          'babel-loader',
           {
-            loader: "@svgr/webpack",
+            loader: '@svgr/webpack',
             options: {
-              babel: false
-            }
-          }
-        ]
-      }
-    ]
+              babel: false,
+            },
+          },
+        ],
+      },
+    ],
   },
-  entry: "./src/index.js",
+  entry: './src/index.js',
   optimization: {
     minimizer: [
       new UglifyJSPlugin({
@@ -30,26 +30,25 @@ module.exports = {
         parallel: true,
         uglifyOptions: {
           keep_classnames: true,
-          keep_fnames: true
-        }
-      })
-    ]
+          keep_fnames: true,
+        },
+      }),
+    ],
   },
   plugins: [
     new webpack.DefinePlugin({
-      __DEV__: JSON.stringify(false)
-    })
+      __DEV__: JSON.stringify(false),
+    }),
   ],
   output: {
-    library: "Snacks",
-    libraryTarget: "umd",
-    filename: "snacks.js",
-    globalObject: "typeof self !== 'undefined' ? self : this"
+    library: 'Snacks',
+    libraryTarget: 'umd',
+    filename: 'snacks.js',
+    globalObject: "typeof self !== 'undefined' ? self : this",
   },
   externals: {
-    react: "react",
-    "react-dom": "react-dom",
-    radium: "radium",
-    "prop-types": "prop-types"
-  }
-};
+    react: 'react',
+    'react-dom': 'react-dom',
+    'prop-types': 'prop-types',
+  },
+}
diff --git a/yarn.lock b/yarn.lock
index 278986a4..5c45ea12 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -382,7 +382,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-object-rest-spread@^7.0.0", "@babel/plugin-syntax-object-rest-spread@^7.2.0":
+"@babel/plugin-syntax-object-rest-spread@^7.2.0":
   version "7.2.0"
   resolved "https://registry.npmjs.org/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.2.0.tgz#3b7a3e733510c57e820b9142a6579ac8b0dfad2e"
   integrity sha512-t0JKGgqk2We+9may3t0xDdmneaXmyxq0xieYcKHxIsrJO64n1OiMWNUtc5gQK1PA0NpdCRrtZp4z+IUaKugrSA==
@@ -610,7 +610,7 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-jsx" "^7.2.0"
 
-"@babel/plugin-transform-react-jsx@^7.0.0":
+"@babel/plugin-transform-react-jsx@^7.0.0", "@babel/plugin-transform-react-jsx@^7.1.6":
   version "7.3.0"
   resolved "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.3.0.tgz#f2cab99026631c767e2745a5368b331cfe8f5290"
   integrity sha512-a/+aRb7R06WcKvQLOu4/TpjKOdvVEKRLWFpKcNuHhiREPgGRB4TQJxq07+EZLS8LFVYpfq1a5lDUnuMdcCpBKg==
@@ -781,7 +781,7 @@
   dependencies:
     regenerator-runtime "^0.13.2"
 
-"@babel/runtime@^7.1.2":
+"@babel/runtime@^7.1.2", "@babel/runtime@^7.4.2":
   version "7.4.5"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.4.5.tgz#582bb531f5f9dc67d2fcb682979894f75e253f12"
   integrity sha512-TuI4qpWZP6lGOGIuGWtp9sPluqYICmbk8T/1vpSysqJxRPkudh/ofFWyqdcMsDf2s7KvDL4/YHgKyvcS3g9CJQ==
@@ -877,6 +877,99 @@
     exec-sh "^0.3.2"
     minimist "^1.2.0"
 
+"@emotion/babel-plugin-jsx-pragmatic@^0.1.2":
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/@emotion/babel-plugin-jsx-pragmatic/-/babel-plugin-jsx-pragmatic-0.1.2.tgz#bb98bbef8effe83418307563c34e784deae57a1a"
+  integrity sha512-BapTL0I1flAB+qrfOmltOdLORBtz8dvtKjcHZmYYWdiGsn+2bZxaZDra+S0jDLd1tnhvPvhHoGv3140WR8PAow==
+  dependencies:
+    "@babel/plugin-syntax-jsx" "^7.2.0"
+
+"@emotion/babel-preset-css-prop@10.0.9":
+  version "10.0.9"
+  resolved "https://registry.yarnpkg.com/@emotion/babel-preset-css-prop/-/babel-preset-css-prop-10.0.9.tgz#70386bd88fe4d8896e1b9729364daf3a6051f726"
+  integrity sha512-fETOWFEe734RlJZTuq6+NeHTzl+Kge4yRm3yrQC+Y2I+KxZjYiU5XUPdbylr0EATbkSzFXgVGKppciZfA5j1mw==
+  dependencies:
+    "@babel/plugin-transform-react-jsx" "^7.1.6"
+    "@emotion/babel-plugin-jsx-pragmatic" "^0.1.2"
+    babel-plugin-emotion "^10.0.9"
+    object-assign "^4.1.1"
+
+"@emotion/cache@^10.0.9":
+  version "10.0.9"
+  resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.9.tgz#e0c7b7a289f7530edcfad4dcf3858bd2e5700a6f"
+  integrity sha512-f7MblpE2xoimC4fCMZ9pivmsIn7hyWRIvY75owMDi8pdOSeh+w5tH3r4hBJv/LLrwiMM7cTQURqTPcYoL5pWnw==
+  dependencies:
+    "@emotion/sheet" "0.9.2"
+    "@emotion/stylis" "0.8.3"
+    "@emotion/utils" "0.11.1"
+    "@emotion/weak-memoize" "0.2.2"
+
+"@emotion/core@10.0.10":
+  version "10.0.10"
+  resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.10.tgz#8d3114e5a2f8b178a7067c603a2937516f180b08"
+  integrity sha512-U1aE2cOWUscjc8ZJ3Cx32udOzLeRoJwGxBH93xQD850oQFpwPKZARzdUtdc9SByUOwzSFYxhDhrpXnV34FJmWg==
+  dependencies:
+    "@emotion/cache" "^10.0.9"
+    "@emotion/css" "^10.0.9"
+    "@emotion/serialize" "^0.11.6"
+    "@emotion/sheet" "0.9.2"
+    "@emotion/utils" "0.11.1"
+
+"@emotion/css@^10.0.9":
+  version "10.0.12"
+  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-10.0.12.tgz#b358168afcb151899bda5cfd778c01dc37801c24"
+  integrity sha512-esET/v6AwYIw5YVo0e1L/bUik7bIMWyK32BudsC/PE5O1rLK3rjiLCOoMVv5GY6+ssuwWVzooGbz79hPvkkmsw==
+  dependencies:
+    "@emotion/serialize" "^0.11.7"
+    "@emotion/utils" "0.11.1"
+    babel-plugin-emotion "^10.0.9"
+
+"@emotion/hash@0.7.1":
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.7.1.tgz#9833722341379fb7d67f06a4b00ab3c37913da53"
+  integrity sha512-OYpa/Sg+2GDX+jibUfpZVn1YqSVRpYmTLF2eyAfrFTIJSbwyIrc+YscayoykvaOME/wV4BV0Sa0yqdMrgse6mA==
+
+"@emotion/memoize@0.7.1":
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.1.tgz#e93c13942592cf5ef01aa8297444dc192beee52f"
+  integrity sha512-Qv4LTqO11jepd5Qmlp3M1YEjBumoTHcHFdgPTQ+sFlIL5myi/7xu/POwP7IRu6odBdmLXdtIs1D6TuW6kbwbbg==
+
+"@emotion/serialize@^0.11.6", "@emotion/serialize@^0.11.7":
+  version "0.11.7"
+  resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.7.tgz#dd9583dbf753002738676fa8c1eb8df77f95fb53"
+  integrity sha512-GfzJIMue9eIEPFgBL340hBbjfki11vjYkfmY2LXoCDAFPuG6S+hkOlfinRXLnPVlXnKu7WWp587cVa6/xQriNQ==
+  dependencies:
+    "@emotion/hash" "0.7.1"
+    "@emotion/memoize" "0.7.1"
+    "@emotion/unitless" "0.7.3"
+    "@emotion/utils" "0.11.1"
+    csstype "^2.5.7"
+
+"@emotion/sheet@0.9.2":
+  version "0.9.2"
+  resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-0.9.2.tgz#74e5c6b5e489a1ba30ab246ab5eedd96916487c4"
+  integrity sha512-pVBLzIbC/QCHDKJF2E82V2H/W/B004mDFQZiyo/MSR+VC4pV5JLG0TF/zgQDFvP3fZL/5RTPGEmXlYJBMUuJ+A==
+
+"@emotion/stylis@0.8.3":
+  version "0.8.3"
+  resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.3.tgz#3ca7e9bcb31b3cb4afbaeb66156d86ee85e23246"
+  integrity sha512-M3nMfJ6ndJMYloSIbYEBq6G3eqoYD41BpDOxreE8j0cb4fzz/5qvmqU9Mb2hzsXcCnIlGlWhS03PCzVGvTAe0Q==
+
+"@emotion/unitless@0.7.3":
+  version "0.7.3"
+  resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.3.tgz#6310a047f12d21a1036fb031317219892440416f"
+  integrity sha512-4zAPlpDEh2VwXswwr/t8xGNDGg8RQiPxtxZ3qQEXyQsBV39ptTdESCjuBvGze1nLMVrxmTIKmnO/nAV8Tqjjzg==
+
+"@emotion/utils@0.11.1":
+  version "0.11.1"
+  resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-0.11.1.tgz#8529b7412a6eb4b48bdf6e720cc1b8e6e1e17628"
+  integrity sha512-8M3VN0hetwhsJ8dH8VkVy7xo5/1VoBsDOk/T4SJOeXwTO1c4uIqVNx2qyecLFnnUWD5vvUqHQ1gASSeUN6zcTg==
+
+"@emotion/weak-memoize@0.2.2":
+  version "0.2.2"
+  resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.2.tgz#63985d3d8b02530e0869962f4da09142ee8e200e"
+  integrity sha512-n/VQ4mbfr81aqkx/XmVicOLjviMuy02eenSdJY33SVA7S2J42EU0P1H0mOogfYedb3wXA0d/LVtBrgTSm04WEA==
+
 "@instacart/eslint-config@0.1.9":
   version "0.1.9"
   resolved "https://registry.yarnpkg.com/@instacart/eslint-config/-/eslint-config-0.1.9.tgz#025127b39a1efa5f487d6404724399e5374c4143"
@@ -1215,7 +1308,7 @@
     "@babel/parser" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@types/babel__traverse@*", "@types/babel__traverse@^7.0.6":
+"@types/babel__traverse@*":
   version "7.0.7"
   resolved "https://registry.yarnpkg.com/@types/babel__traverse/-/babel__traverse-7.0.7.tgz#2496e9ff56196cc1429c72034e07eab6121b6f3f"
   integrity sha512-CeBpmX1J8kWLcDEnI3Cl2Eo6RfbGvzUctA+CjZUhOKDFbLfcr7fc4usEqLNWetrlJd7RhAkyYe2czXop4fICpw==
@@ -1629,6 +1722,11 @@ ansi-regex@^4.0.0, ansi-regex@^4.1.0:
   resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-4.1.0.tgz#8b9f8f08cf1acb843756a839ca8c7e3168c51997"
   integrity sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==
 
+ansi-styles@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"
+  integrity sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=
+
 ansi-styles@^3.1.0, ansi-styles@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.0.tgz#c159b8d5be0f9e5a6f346dab94f16ce022161b88"
@@ -1677,11 +1775,18 @@ aria-query@^3.0.0:
     ast-types-flow "0.0.7"
     commander "^2.11.0"
 
+arr-diff@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-2.0.0.tgz#8f3b827f955a8bd669697e4a4256ac3ceae356cf"
+  integrity sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=
+  dependencies:
+    arr-flatten "^1.0.1"
+
 arr-diff@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
 
-arr-flatten@^1.1.0:
+arr-flatten@^1.0.1, arr-flatten@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/arr-flatten/-/arr-flatten-1.1.0.tgz#36048bbff4e7b47e136644316c99669ea5ae91f1"
 
@@ -1741,10 +1846,20 @@ array-uniq@^1.0.1:
   resolved "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz#af6ac877a25cc7f74e058894753858dfdb24fdb6"
   integrity sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=
 
+array-unique@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.2.1.tgz#a1d97ccafcbc2625cc70fadceb36a50c58b01a53"
+  integrity sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=
+
 array-unique@^0.3.2:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
 
+arrify@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
+  integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=
+
 asap@~2.0.3:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
@@ -1862,6 +1977,15 @@ axobject-query@^2.0.2:
   dependencies:
     ast-types-flow "0.0.7"
 
+babel-code-frame@^6.22.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
+  integrity sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=
+  dependencies:
+    chalk "^1.1.3"
+    esutils "^2.0.2"
+    js-tokens "^3.0.2"
+
 babel-eslint@10.0.1:
   version "10.0.1"
   resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.0.1.tgz#919681dc099614cd7d31d45c8908695092a1faed"
@@ -1874,6 +1998,20 @@ babel-eslint@10.0.1:
     eslint-scope "3.7.1"
     eslint-visitor-keys "^1.0.0"
 
+babel-generator@^6.18.0:
+  version "6.26.1"
+  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.26.1.tgz#1844408d3b8f0d35a404ea7ac180f087a601bd90"
+  integrity sha512-HyfwY6ApZj7BYTcJURpM5tznulaBvyio7/0d4zFOeMPUmfxkCjHocCuoLa2SAGzBI8AREcH3eP3758F672DppA==
+  dependencies:
+    babel-messages "^6.23.0"
+    babel-runtime "^6.26.0"
+    babel-types "^6.26.0"
+    detect-indent "^4.0.0"
+    jsesc "^1.3.0"
+    lodash "^4.17.4"
+    source-map "^0.5.7"
+    trim-right "^1.0.1"
+
 babel-jest@^24.8.0:
   version "24.8.0"
   resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-24.8.0.tgz#5c15ff2b28e20b0f45df43fe6b7f2aae93dba589"
@@ -1897,6 +2035,29 @@ babel-loader@^8.0.0:
     mkdirp "^0.5.1"
     pify "^4.0.1"
 
+babel-messages@^6.23.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e"
+  integrity sha1-8830cDhYA1sqKVHG7F7fbGLyYw4=
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-emotion@^10.0.9:
+  version "10.0.13"
+  resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.13.tgz#c4faa1ba8c0fd74a13226ced32876b314ef1d8ab"
+  integrity sha512-w8yukWIYDw2ZUzBo7B9t5jh7wsM4NQWqvuZadW4MhVokgw5wsoBRJ59Sa1hMc3UZiatwb0iBNufmRQZVl77I5Q==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@emotion/hash" "0.7.1"
+    "@emotion/memoize" "0.7.1"
+    "@emotion/serialize" "^0.11.6"
+    babel-plugin-macros "^2.0.0"
+    babel-plugin-syntax-jsx "^6.18.0"
+    convert-source-map "^1.5.0"
+    escape-string-regexp "^1.0.5"
+    find-root "^1.1.0"
+    source-map "^0.5.7"
+
 babel-plugin-istanbul@^5.1.0:
   version "5.1.4"
   resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-5.1.4.tgz#841d16b9a58eeb407a0ddce622ba02fe87a752ba"
@@ -1906,12 +2067,23 @@ babel-plugin-istanbul@^5.1.0:
     istanbul-lib-instrument "^3.3.0"
     test-exclude "^5.2.3"
 
-babel-plugin-jest-hoist@^24.6.0:
-  version "24.6.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-24.6.0.tgz#f7f7f7ad150ee96d7a5e8e2c5da8319579e78019"
-  integrity sha512-3pKNH6hMt9SbOv0F3WVmy5CWQ4uogS3k0GY5XLyQHJ9EGpAT9XWkFd2ZiXXtkwFHdAHa5j7w7kfxSP5lAIwu7w==
+babel-plugin-macros@^2.0.0:
+  version "2.6.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.6.1.tgz#41f7ead616fc36f6a93180e89697f69f51671181"
+  integrity sha512-6W2nwiXme6j1n2erPOnmRiWfObUhWH7Qw1LMi9XZy8cj+KtESu3T6asZvtk5bMQQjX8te35o7CFueiSdL/2NmQ==
   dependencies:
-    "@types/babel__traverse" "^7.0.6"
+    "@babel/runtime" "^7.4.2"
+    cosmiconfig "^5.2.0"
+    resolve "^1.10.0"
+
+babel-plugin-syntax-jsx@^6.18.0:
+  version "6.18.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
+  integrity sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=
+
+babel-plugin-syntax-object-rest-spread@^6.13.0:
+  version "6.13.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
 
 babel-preset-jest@^24.6.0:
   version "24.6.0"
@@ -1921,6 +2093,72 @@ babel-preset-jest@^24.6.0:
     "@babel/plugin-syntax-object-rest-spread" "^7.0.0"
     babel-plugin-jest-hoist "^24.6.0"
 
+babel-runtime@^6.22.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.23.0.tgz#0a9489f144de70efb3ce4300accdb329e2fc543b"
+  dependencies:
+    core-js "^2.4.0"
+    regenerator-runtime "^0.10.0"
+
+babel-runtime@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
+  integrity sha1-llxwWGaOgrVde/4E/yM3vItWR/4=
+  dependencies:
+    core-js "^2.4.0"
+    regenerator-runtime "^0.11.0"
+
+babel-template@^6.16.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.25.0.tgz#665241166b7c2aa4c619d71e192969552b10c071"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-traverse "^6.25.0"
+    babel-types "^6.25.0"
+    babylon "^6.17.2"
+    lodash "^4.2.0"
+
+babel-traverse@^6.18.0, babel-traverse@^6.25.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.25.0.tgz#2257497e2fcd19b89edc13c4c91381f9512496f1"
+  dependencies:
+    babel-code-frame "^6.22.0"
+    babel-messages "^6.23.0"
+    babel-runtime "^6.22.0"
+    babel-types "^6.25.0"
+    babylon "^6.17.2"
+    debug "^2.2.0"
+    globals "^9.0.0"
+    invariant "^2.2.0"
+    lodash "^4.2.0"
+
+babel-types@^6.18.0, babel-types@^6.25.0:
+  version "6.25.0"
+  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.25.0.tgz#70afb248d5660e5d18f811d91c8303b54134a18e"
+  dependencies:
+    babel-runtime "^6.22.0"
+    esutils "^2.0.2"
+    lodash "^4.2.0"
+    to-fast-properties "^1.0.1"
+
+babel-types@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.26.0.tgz#a3b073f94ab49eb6fa55cd65227a334380632497"
+  integrity sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=
+  dependencies:
+    babel-runtime "^6.26.0"
+    esutils "^2.0.2"
+    lodash "^4.17.4"
+    to-fast-properties "^1.0.3"
+
+babylon@^6.17.2:
+  version "6.17.4"
+  resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.17.4.tgz#3e8b7402b88d22c3423e137a1577883b15ff869a"
+
+babylon@^6.18.0:
+  version "6.18.0"
+  resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.18.0.tgz#af2f3b88fa6f5c1e4c634d1a0f8eac4f55b395e3"
+
 bail@^1.0.0:
   version "1.0.3"
   resolved "https://registry.npmjs.org/bail/-/bail-1.0.3.tgz#63cfb9ddbac829b02a3128cd53224be78e6c21a3"
@@ -2050,10 +2288,6 @@ boom@5.x.x:
   dependencies:
     hoek "4.x.x"
 
-bowser@^1.7.3:
-  version "1.9.2"
-  resolved "https://registry.yarnpkg.com/bowser/-/bowser-1.9.2.tgz#d66fc868ca5f4ba895bee1363c343fe7b37d3394"
-
 brace-expansion@^1.1.7:
   version "1.1.8"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.8.tgz#c07b211c7c952ec1f8efd51a77ef0d1d3990a292"
@@ -2061,6 +2295,15 @@ brace-expansion@^1.1.7:
     balanced-match "^1.0.0"
     concat-map "0.0.1"
 
+braces@^1.8.2:
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/braces/-/braces-1.8.5.tgz#ba77962e12dff969d6b76711e914b737857bf6a7"
+  integrity sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=
+  dependencies:
+    expand-range "^1.8.1"
+    preserve "^0.2.0"
+    repeat-element "^1.1.2"
+
 braces@^2.3.0, braces@^2.3.1:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/braces/-/braces-2.3.1.tgz#7086c913b4e5a08dbe37ac0ee6a2500c4ba691bb"
@@ -2375,6 +2618,17 @@ chalk@2.4.1, chalk@^2.4.1:
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
+chalk@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
+  integrity sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=
+  dependencies:
+    ansi-styles "^2.2.1"
+    escape-string-regexp "^1.0.2"
+    has-ansi "^2.0.0"
+    strip-ansi "^3.0.0"
+    supports-color "^2.0.0"
+
 chalk@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.1.0.tgz#ac5becf14fa21b99c6c92ca7a7d7cfd5b17e743e"
@@ -2818,6 +3072,13 @@ convert-source-map@^1.1.0, convert-source-map@^1.4.0:
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.5.0.tgz#9acd70851c6d5dfdd93d9282e5edf94a03ff46b5"
 
+convert-source-map@^1.5.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.6.0.tgz#51b537a8c43e0f04dec1993bffcdd504e758ac20"
+  integrity sha512-eFu7XigvxdZ1ETfbgPBohgyQ/Z++C0eEhTor0qRwBw9unw+L0/6V8wkSuGgzdThkiS5lSpdptOQPD8Ak40a+7A==
+  dependencies:
+    safe-buffer "~5.1.1"
+
 cookie-signature@1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c"
@@ -2877,7 +3138,7 @@ core-js@^1.0.0:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
 
-core-js@^2.6.5:
+core-js@^2.4.0, core-js@^2.6.5:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.9.tgz#6b4b214620c834152e179323727fc19741b084f2"
   integrity sha512-HOpZf6eXmnl7la+cUdMnLvUxKNqLUzJvgIziQ0DiF3JwSImNphIqdGqzj6hIKyX04MmV0poclQ7+wjWvxQyR2A==
@@ -2978,12 +3239,6 @@ crypto-browserify@^3.11.0:
     public-encrypt "^4.0.0"
     randombytes "^2.0.0"
 
-css-in-js-utils@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/css-in-js-utils/-/css-in-js-utils-2.0.0.tgz#5af1dd70f4b06b331f48d22a3d86e0786c0b9435"
-  dependencies:
-    hyphenate-style-name "^1.0.2"
-
 css-initials@^0.2.0:
   version "0.2.0"
   resolved "https://registry.npmjs.org/css-initials/-/css-initials-0.2.0.tgz#14c225bd8656255a6baee07231ef82fa55aacaa3"
@@ -3060,6 +3315,11 @@ cssom@0.3.x, "cssom@>= 0.3.2 < 0.4.0":
   dependencies:
     cssom "0.3.x"
 
+csstype@^2.5.7:
+  version "2.6.5"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.5.tgz#1cd1dff742ebf4d7c991470ae71e12bb6751e034"
+  integrity sha512-JsTaiksRsel5n7XwqPAfB0l3TFKdpjW/kgAELf9vrb5adGA7UCPLajKK5s3nFrcFm3Rkyp/Qkgl73ENc1UY3cA==
+
 cycle@1.0.x:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/cycle/-/cycle-1.0.3.tgz#21e80b2be8580f98b468f379430662b046c34ad2"
@@ -3248,6 +3508,13 @@ destroy@~1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/destroy/-/destroy-1.0.4.tgz#978857442c44749e4206613e37946205826abd80"
 
+detect-indent@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-4.0.0.tgz#f76d064352cdf43a1cb6ce619c4ee3a9475de208"
+  integrity sha1-920GQ1LN9Docts5hnE7jqUdd4gg=
+  dependencies:
+    repeating "^2.0.0"
+
 detect-libc@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b"
@@ -3646,7 +3913,7 @@ escape-html@~1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
 
-escape-string-regexp@1.0.5, escape-string-regexp@^1.0.5:
+escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
 
@@ -3959,14 +4226,17 @@ execa@^1.0.0:
     signal-exit "^3.0.0"
     strip-eof "^1.0.0"
 
-exenv@^1.2.1:
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/exenv/-/exenv-1.2.2.tgz#2ae78e85d9894158670b03d47bec1f03bd91bb9d"
-
 exit@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/exit/-/exit-0.1.2.tgz#0632638f8d877cc82107d30a0fff1a17cba1cd0c"
 
+expand-brackets@^0.1.4:
+  version "0.1.5"
+  resolved "https://registry.yarnpkg.com/expand-brackets/-/expand-brackets-0.1.5.tgz#df07284e342a807cd733ac5af72411e581d1177b"
+  integrity sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=
+  dependencies:
+    is-posix-bracket "^0.1.0"
+
 expand-brackets@^2.1.4:
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/expand-brackets/-/expand-brackets-2.1.4.tgz#b77735e315ce30f6b6eff0f83b04151a22449622"
@@ -3979,6 +4249,13 @@ expand-brackets@^2.1.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
+expand-range@^1.8.1:
+  version "1.8.2"
+  resolved "https://registry.yarnpkg.com/expand-range/-/expand-range-1.8.2.tgz#a299effd335fe2721ebae8e257ec79644fc85337"
+  integrity sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=
+  dependencies:
+    fill-range "^2.1.0"
+
 expand-tilde@^2.0.0, expand-tilde@^2.0.2:
   version "2.0.2"
   resolved "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz#97e801aa052df02454de46b02bf621642cdc8502"
@@ -4107,6 +4384,13 @@ external-editor@^3.0.3:
     iconv-lite "^0.4.24"
     tmp "^0.0.33"
 
+extglob@^0.3.1:
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/extglob/-/extglob-0.3.2.tgz#2e18ff3d2f49ab2765cec9023f011daa8d8349a1"
+  integrity sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=
+  dependencies:
+    is-extglob "^1.0.0"
+
 extglob@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/extglob/-/extglob-2.0.4.tgz#ad00fe4dc612a9232e8718711dc5cb5ab0285543"
@@ -4211,10 +4495,26 @@ file-entry-cache@^5.0.1:
   dependencies:
     flat-cache "^2.0.1"
 
+filename-regex@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/filename-regex/-/filename-regex-2.0.1.tgz#c1c4b9bee3e09725ddb106b75c1e301fe2f18b26"
+  integrity sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=
+
 filesize@3.6.1, filesize@^3.6.1:
   version "3.6.1"
   resolved "https://registry.yarnpkg.com/filesize/-/filesize-3.6.1.tgz#090bb3ee01b6f801a8a8be99d31710b3422bb317"
 
+fill-range@^2.1.0:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-2.2.4.tgz#eb1e773abb056dcd8df2bfdf6af59b8b3a936565"
+  integrity sha512-cnrcCbj01+j2gTG921VZPnHbjmdAf8oQV/iGeV2kZxGSyfYjjTyY79ErsK1WJWMpw6DaApEX72binqJE+/d+5Q==
+  dependencies:
+    is-number "^2.1.0"
+    isobject "^2.0.0"
+    randomatic "^3.0.0"
+    repeat-element "^1.1.2"
+    repeat-string "^1.5.2"
+
 fill-range@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-4.0.0.tgz#d544811d428f98eb06a63dc402d2403c328c38f7"
@@ -4277,6 +4577,14 @@ find-up@3.0.0, find-up@^3.0.0:
   dependencies:
     locate-path "^3.0.0"
 
+find-up@^1.0.0:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/find-up/-/find-up-1.1.2.tgz#6b2e9822b1a2ce0a60ab64d610eccad53cb24d0f"
+  integrity sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=
+  dependencies:
+    path-exists "^2.0.0"
+    pinkie-promise "^2.0.0"
+
 find-up@^2.0.0, find-up@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"
@@ -4328,7 +4636,7 @@ for-in@^1.0.1, for-in@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"
 
-for-own@^0.1.3:
+for-own@^0.1.3, for-own@^0.1.4:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/for-own/-/for-own-0.1.5.tgz#5265c681a4f294dabbf17c9509b6763aa84510ce"
   dependencies:
@@ -4504,6 +4812,21 @@ github-slugger@^1.2.1:
   dependencies:
     emoji-regex ">=6.0.0 <=6.1.1"
 
+glob-base@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/glob-base/-/glob-base-0.3.0.tgz#dbb164f6221b1c0b1ccf82aea328b497df0ea3c4"
+  integrity sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=
+  dependencies:
+    glob-parent "^2.0.0"
+    is-glob "^2.0.0"
+
+glob-parent@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-2.0.0.tgz#81383d72db054fcccf5336daa902f182f6edbb28"
+  integrity sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=
+  dependencies:
+    is-glob "^2.0.0"
+
 glob-parent@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-3.1.0.tgz#9e6af6299d8d3bd2bd40430832bd113df906c5ae"
@@ -4584,6 +4907,11 @@ globals@^11.7.0:
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.11.0.tgz#dcf93757fa2de5486fbeed7118538adf789e9c2e"
   integrity sha512-WHq43gS+6ufNOEqlrDBxVEbb8ntfXrfAUU2ZOpCxrBdGKW3gyv8mCxAfIBD0DroPKGrJ2eSsXsLtY9MPntsyTw==
 
+globals@^9.0.0:
+  version "9.18.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-9.18.0.tgz#aa3896b3e69b487f17e31ed2143d69a8e30c2d8a"
+  integrity sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==
+
 globby@8.0.1:
   version "8.0.1"
   resolved "https://registry.npmjs.org/globby/-/globby-8.0.1.tgz#b5ad48b8aa80b35b814fc1281ecc851f1d2b5b50"
@@ -4701,6 +5029,13 @@ har-validator@~5.1.0:
     ajv "^5.3.0"
     har-schema "^2.0.0"
 
+has-ansi@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
+  integrity sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=
+  dependencies:
+    ansi-regex "^2.0.0"
+
 has-flag@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-2.0.0.tgz#e8207af1cc7b30d446cc70b734b5e8be18f88d51"
@@ -5070,13 +5405,6 @@ ini@~1.3.0:
   version "1.3.4"
   resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.4.tgz#0537cb79daf59b59a1a517dff706c86ec039162e"
 
-inline-style-prefixer@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/inline-style-prefixer/-/inline-style-prefixer-4.0.0.tgz#30a03df1b346ba6b1fb8a812bc3c9dabef48022d"
-  dependencies:
-    bowser "^1.7.3"
-    css-in-js-utils "^2.0.0"
-
 inquirer@6.2.0:
   version "6.2.0"
   resolved "https://registry.npmjs.org/inquirer/-/inquirer-6.2.0.tgz#51adcd776f661369dc1e894859c2560a224abdd8"
@@ -5150,19 +5478,19 @@ interpret@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
 
-invariant@^2.2.2:
-  version "2.2.3"
-  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.3.tgz#1a827dfde7dcbd7c323f0ca826be8fa7c5e9d688"
-  dependencies:
-    loose-envify "^1.0.0"
-
-invariant@^2.2.4:
+invariant@^2.2.0, invariant@^2.2.4:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
   integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
   dependencies:
     loose-envify "^1.0.0"
 
+invariant@^2.2.2:
+  version "2.2.3"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.3.tgz#1a827dfde7dcbd7c323f0ca826be8fa7c5e9d688"
+  dependencies:
+    loose-envify "^1.0.0"
+
 invert-kv@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-1.0.0.tgz#104a8e4aaca6d3d8cd157a8ef8bfab2d7a3ffdb6"
@@ -5309,6 +5637,18 @@ is-directory@^0.3.1:
   resolved "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz#61339b6f2475fc772fd9c9d83f5c8575dc154ae1"
   integrity sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE=
 
+is-dotfile@^1.0.0:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/is-dotfile/-/is-dotfile-1.0.3.tgz#a6a2f32ffd2dfb04f5ca25ecd0f6b83cf798a1e1"
+  integrity sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=
+
+is-equal-shallow@^0.1.3:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz#2238098fc221de0bcfa5d9eac4c45d638aa1c534"
+  integrity sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=
+  dependencies:
+    is-primitive "^2.0.0"
+
 is-extendable@^0.1.0, is-extendable@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89"
@@ -5319,10 +5659,22 @@ is-extendable@^1.0.1:
   dependencies:
     is-plain-object "^2.0.4"
 
+is-extglob@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-1.0.0.tgz#ac468177c4943405a092fc8f29760c6ffc6206c0"
+  integrity sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=
+
 is-extglob@^2.1.0, is-extglob@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
 
+is-finite@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/is-finite/-/is-finite-1.0.2.tgz#cc6677695602be550ef11e8b4aa6305342b6d0aa"
+  integrity sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko=
+  dependencies:
+    number-is-nan "^1.0.0"
+
 is-fullwidth-code-point@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz#ef9e31386f031a7f0d643af82fde50c457ef00cb"
@@ -5338,6 +5690,13 @@ is-generator-fn@^2.0.0:
   resolved "https://registry.yarnpkg.com/is-generator-fn/-/is-generator-fn-2.1.0.tgz#7d140adc389aaf3011a8f2a2a4cfa6faadffb118"
   integrity sha512-cTIB4yPYL/Grw0EaSzASzg6bBy9gqCofvWN8okThAYIxKJZC+udlRAmGbM0XLeniEJSs8uEgHPGuHSe1XsOLSQ==
 
+is-glob@^2.0.0, is-glob@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-2.0.1.tgz#d096f926a3ded5600f3fdfd91198cb0888c2d863"
+  integrity sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=
+  dependencies:
+    is-extglob "^1.0.0"
+
 is-glob@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-3.1.0.tgz#7ba5ae24217804ac70707b96922567486cc3e84a"
@@ -5364,6 +5723,13 @@ is-number-object@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.3.tgz#f265ab89a9f445034ef6aff15a8f00b00f551799"
 
+is-number@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/is-number/-/is-number-2.1.0.tgz#01fcbbb393463a548f2f466cce16dece49db908f"
+  integrity sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=
+  dependencies:
+    kind-of "^3.0.2"
+
 is-number@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195"
@@ -5414,6 +5780,16 @@ is-plain-object@^2.0.1, is-plain-object@^2.0.3, is-plain-object@^2.0.4:
   dependencies:
     isobject "^3.0.1"
 
+is-posix-bracket@^0.1.0:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz#3334dc79774368e92f016e6fbc0a88f5cd6e6bc4"
+  integrity sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=
+
+is-primitive@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/is-primitive/-/is-primitive-2.0.0.tgz#207bab91638499c07b2adf240a41a87210034575"
+  integrity sha1-IHurkWOEmcB7Kt8kCkGochADRXU=
+
 is-promise@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.1.0.tgz#79a2a9ece7f096e80f36d2b2f3bc16c1ff4bf3fa"
@@ -5461,6 +5837,11 @@ is-typedarray@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"
 
+is-utf8@^0.2.0:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/is-utf8/-/is-utf8-0.2.1.tgz#4b0da1442104d1b336340e80797e865cf39f7d72"
+  integrity sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=
+
 is-whitespace-character@^1.0.0:
   version "1.0.2"
   resolved "https://registry.npmjs.org/is-whitespace-character/-/is-whitespace-character-1.0.2.tgz#ede53b4c6f6fb3874533751ec9280d01928d03ed"
@@ -5513,11 +5894,29 @@ isstream@0.1.x, isstream@~0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
 
+istanbul-lib-coverage@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/istanbul-lib-coverage/-/istanbul-lib-coverage-1.2.1.tgz#ccf7edcd0a0bb9b8f729feeb0930470f9af664f0"
+  integrity sha512-PzITeunAgyGbtY1ibVIUiV679EFChHjoMNRibEIobvmrCRaIgwLxNucOSimtNWUhEib/oO7QY2imD75JVgCJWQ==
+
 istanbul-lib-coverage@^2.0.2, istanbul-lib-coverage@^2.0.5:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.5.tgz#675f0ab69503fad4b1d849f736baaca803344f49"
   integrity sha512-8aXznuEPCJvGnMSRft4udDRDtb1V3pkQkMMI5LI+6HuQz5oQ4J2UFn1H82raA3qJtyOLkkwVqICBQkjnGtn5mA==
 
+istanbul-lib-instrument@^1.10.1:
+  version "1.10.2"
+  resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-1.10.2.tgz#1f55ed10ac3c47f2bdddd5307935126754d0a9ca"
+  integrity sha512-aWHxfxDqvh/ZlxR8BBaEPVSWDPUkGD63VjGQn3jcw8jCp7sHEMKcrj4xfJn/ABzdMEHiQNyvDQhqm5o8+SQg7A==
+  dependencies:
+    babel-generator "^6.18.0"
+    babel-template "^6.16.0"
+    babel-traverse "^6.18.0"
+    babel-types "^6.18.0"
+    babylon "^6.18.0"
+    istanbul-lib-coverage "^1.2.1"
+    semver "^5.3.0"
+
 istanbul-lib-instrument@^3.0.1, istanbul-lib-instrument@^3.3.0:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-3.3.0.tgz#a5f63d91f0bbc0c3e479ef4c5de027335ec6d630"
@@ -5920,7 +6319,7 @@ js-levenshtein@^1.1.3:
   resolved "https://registry.npmjs.org/js-levenshtein/-/js-levenshtein-1.1.6.tgz#c6cee58eb3550372df8deb85fad5ce66ce01d59d"
   integrity sha512-X2BB11YZtrRqY4EnQcLX5Rh373zbK4alC1FW7D7MBhL2gtcC17cTnr6DmfHZeS0s2rTHjUTMMHfG7gO8SSdw+g==
 
-js-tokens@^3.0.0:
+js-tokens@^3.0.0, js-tokens@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
 
@@ -5986,6 +6385,11 @@ jsdom@^11.5.1:
     ws "^4.0.0"
     xml-name-validator "^3.0.0"
 
+jsesc@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-1.3.0.tgz#46c3fec8c1892b12b0833db9bc7622176dbab34b"
+  integrity sha1-RsP+yMGJKxKwgz25vHYiF226s0s=
+
 jsesc@^2.5.1:
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.1.tgz#e421a2a8e20d6b0819df28908f782526b96dd1fe"
@@ -6206,6 +6610,17 @@ listify@^1.0.0:
   resolved "https://registry.npmjs.org/listify/-/listify-1.0.0.tgz#03ca7ba2d150d4267773f74e57558d1053d2bee3"
   integrity sha1-A8p7otFQ1CZ3c/dOV1WNEFPSvuM=
 
+load-json-file@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0"
+  integrity sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=
+  dependencies:
+    graceful-fs "^4.1.2"
+    parse-json "^2.2.0"
+    pify "^2.0.0"
+    pinkie-promise "^2.0.0"
+    strip-bom "^2.0.0"
+
 load-json-file@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-2.0.0.tgz#7947e42149af80d696cbf797bcaabcfe1fe29ca8"
@@ -6291,7 +6706,7 @@ lodash@^4.17.10, lodash@^4.17.5:
   version "4.17.10"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
 
-lodash@^4.17.11:
+lodash@^4.17.11, lodash@^4.2.0:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
   integrity sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==
@@ -6423,6 +6838,11 @@ markdown-to-jsx@^6.9.3:
     prop-types "^15.6.2"
     unquote "^1.1.0"
 
+math-random@^1.0.1:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/math-random/-/math-random-1.0.4.tgz#5dd6943c938548267016d4e34f057583080c514c"
+  integrity sha512-rUxjysqif/BZQH2yhd5Aaq7vXMSx9NdEsQcyA07uEzIvxgI7zIr33gGsh+RU0/XjmQpCW7RsVof1vlkvQVCK5A==
+
 mdast-util-compact@^1.0.0:
   version "1.0.2"
   resolved "https://registry.npmjs.org/mdast-util-compact/-/mdast-util-compact-1.0.2.tgz#c12ebe16fffc84573d3e19767726de226e95f649"
@@ -6499,6 +6919,25 @@ methods@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
 
+micromatch@^2.3.11:
+  version "2.3.11"
+  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-2.3.11.tgz#86677c97d1720b363431d04d0d15293bd38c1565"
+  integrity sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=
+  dependencies:
+    arr-diff "^2.0.0"
+    array-unique "^0.2.1"
+    braces "^1.8.2"
+    expand-brackets "^0.1.4"
+    extglob "^0.3.1"
+    filename-regex "^2.0.0"
+    is-extglob "^1.0.0"
+    is-glob "^2.0.1"
+    kind-of "^3.0.2"
+    normalize-path "^2.0.1"
+    object.omit "^2.0.0"
+    parse-glob "^3.0.4"
+    regex-cache "^0.4.2"
+
 micromatch@^3.1.10, micromatch@^3.1.8:
   version "3.1.10"
   resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-3.1.10.tgz#70859bc95c9840952f359a068a3fc49f9ecfac23"
@@ -7001,7 +7440,7 @@ normalize-package-data@^2.3.2:
     semver "2 || 3 || 4 || 5"
     validate-npm-package-license "^3.0.1"
 
-normalize-path@^2.1.1:
+normalize-path@^2.0.1, normalize-path@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-2.1.1.tgz#1ab28b556e198363a8c1a6f7e6fa20137fe6aed9"
   dependencies:
@@ -7145,6 +7584,14 @@ object.getownpropertydescriptors@^2.0.3:
     define-properties "^1.1.2"
     es-abstract "^1.5.1"
 
+object.omit@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/object.omit/-/object.omit-2.0.1.tgz#1a9c744829f39dbb858c76ca3579ae2a54ebd1fa"
+  integrity sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=
+  dependencies:
+    for-own "^0.1.4"
+    is-extendable "^0.1.1"
+
 object.pick@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/object.pick/-/object.pick-1.3.0.tgz#87a10ac4c1694bd2e1cbf53591a66141fb5dd747"
@@ -7427,6 +7874,16 @@ parse-entities@^1.0.2, parse-entities@^1.1.0:
     is-decimal "^1.0.0"
     is-hexadecimal "^1.0.0"
 
+parse-glob@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/parse-glob/-/parse-glob-3.0.4.tgz#b2c376cfb11f35513badd173ef0bb6e3a388391c"
+  integrity sha1-ssN2z7EfNVE7rdFz7wu246OIORw=
+  dependencies:
+    glob-base "^0.3.0"
+    is-dotfile "^1.0.0"
+    is-extglob "^1.0.0"
+    is-glob "^2.0.0"
+
 parse-json@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-2.2.0.tgz#f480f40434ef80741f8469099f8dea18f55a4dc9"
@@ -7481,6 +7938,13 @@ path-dirname@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/path-dirname/-/path-dirname-1.0.2.tgz#cc33d24d525e099a5388c0336c6e32b9160609e0"
 
+path-exists@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-2.1.0.tgz#0feb6c64f0fc518d9a754dd5efb62c7022761f4b"
+  integrity sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=
+  dependencies:
+    pinkie-promise "^2.0.0"
+
 path-exists@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"
@@ -7512,6 +7976,15 @@ path-to-regexp@^1.7.0:
   dependencies:
     isarray "0.0.1"
 
+path-type@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/path-type/-/path-type-1.1.0.tgz#59c44f7ee491da704da415da5a4070ba4f8fe441"
+  integrity sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=
+  dependencies:
+    graceful-fs "^4.1.2"
+    pify "^2.0.0"
+    pinkie-promise "^2.0.0"
+
 path-type@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/path-type/-/path-type-2.0.0.tgz#f012ccb8415b7096fc2daa1054c3d72389594c73"
@@ -7619,6 +8092,11 @@ prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
 
+preserve@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
+  integrity sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=
+
 prettier-linter-helpers@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz#d23d41fe1375646de2d0104d3454a3008802cf7b"
@@ -7867,14 +8345,6 @@ querystringify@^2.0.0, querystringify@^2.1.1:
   resolved "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz#60e5a5fd64a7f8bfa4d2ab2ed6fdf4c85bad154e"
   integrity sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==
 
-radium@^0.22.0:
-  version "0.22.0"
-  resolved "https://registry.yarnpkg.com/radium/-/radium-0.22.0.tgz#0127708896a7dc592bdae4768e17054c8f4b29f9"
-  dependencies:
-    exenv "^1.2.1"
-    inline-style-prefixer "^4.0.0"
-    prop-types "^15.5.8"
-
 raf@^3.4.0:
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/raf/-/raf-3.4.0.tgz#a28876881b4bc2ca9117d4138163ddb80f781575"
@@ -7892,6 +8362,15 @@ randexp@0.4.6:
     discontinuous-range "1.0.0"
     ret "~0.1.10"
 
+randomatic@^3.0.0:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.1.tgz#b776efc59375984e36c537b2f51a1f0aff0da1ed"
+  integrity sha512-TuDE5KxZ0J461RVjrJZCJc+J+zCkTb1MbH9AQUq68sMhOMcy9jLcb3BrZKgp9q9Ncltdg4QVqWrH02W2EFFVYw==
+  dependencies:
+    is-number "^4.0.0"
+    kind-of "^6.0.0"
+    math-random "^1.0.1"
+
 randombytes@^2.0.0, randombytes@^2.0.1:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/randombytes/-/randombytes-2.0.5.tgz#dc009a246b8d09a177b4b7a0ae77bc570f4b1b79"
@@ -8156,6 +8635,14 @@ react@16.4.2:
     object-assign "^4.1.1"
     prop-types "^15.6.0"
 
+read-pkg-up@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-1.0.1.tgz#9d63c13276c065918d57f002a57f40a1b643fb02"
+  integrity sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=
+  dependencies:
+    find-up "^1.0.0"
+    read-pkg "^1.0.0"
+
 read-pkg-up@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-2.0.0.tgz#6b72a8048984e0c41e79510fd5e9fa99b3b549be"
@@ -8172,6 +8659,15 @@ read-pkg-up@^4.0.0:
     find-up "^3.0.0"
     read-pkg "^3.0.0"
 
+read-pkg@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/read-pkg/-/read-pkg-1.1.0.tgz#f5ffaa5ecd29cb31c0474bca7d756b6bb29e3f28"
+  integrity sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=
+  dependencies:
+    load-json-file "^1.0.0"
+    normalize-package-data "^2.3.2"
+    path-type "^1.0.0"
+
 read-pkg@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/read-pkg/-/read-pkg-2.0.0.tgz#8ef1c0623c6a6db0dc6713c4bfac46332b2368f8"
@@ -8293,6 +8789,16 @@ regenerate@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.0.tgz#4a856ec4b56e4077c557589cae85e7a4c8869a11"
 
+regenerator-runtime@^0.10.0:
+  version "0.10.5"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz#336c3efc1220adcedda2c9fab67b5a7955a33658"
+  integrity sha1-M2w+/BIgrc7dosn6tntaeVWjNlg=
+
+regenerator-runtime@^0.11.0:
+  version "0.11.1"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
+  integrity sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==
+
 regenerator-runtime@^0.13.2:
   version "0.13.2"
   resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.2.tgz#32e59c9a6fb9b1a4aff09b4930ca2d4477343447"
@@ -8305,6 +8811,13 @@ regenerator-transform@^0.14.0:
   dependencies:
     private "^0.1.6"
 
+regex-cache@^0.4.2:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/regex-cache/-/regex-cache-0.4.4.tgz#75bdc58a2a1496cec48a12835bc54c8d562336dd"
+  integrity sha512-nVIZwtCjkC9YgvWkpM55B5rBhBYRZhAaJbgcFYXXsHnbZ9UZI9nnVWYZpBlCqv9ho2eZryPnWrZGsOdPwVWXWQ==
+  dependencies:
+    is-equal-shallow "^0.1.3"
+
 regex-not@^1.0.0, regex-not@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/regex-not/-/regex-not-1.0.2.tgz#1f4ece27e00b0b65e0247a6810e6a85d83a5752c"
@@ -8413,10 +8926,17 @@ repeat-element@^1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.2.tgz#ef089a178d1483baae4d93eb98b4f9e4e11d990a"
 
-repeat-string@^1.5.4, repeat-string@^1.6.1:
+repeat-string@^1.5.2, repeat-string@^1.5.4, repeat-string@^1.6.1:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.6.1.tgz#8dcae470e1c88abc2d600fff4a776286da75e637"
 
+repeating@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/repeating/-/repeating-2.0.1.tgz#5214c53a926d3552707527fbab415dbc08d06dda"
+  integrity sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo=
+  dependencies:
+    is-finite "^1.0.0"
+
 replace-ext@1.0.0:
   version "1.0.0"
   resolved "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz#de63128373fcbf7c3ccfa4de5a480c45a67958eb"
@@ -8541,6 +9061,13 @@ resolve@1.1.7:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
 
+resolve@^1.10.0:
+  version "1.11.1"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.11.1.tgz#ea10d8110376982fef578df8fc30b9ac30a07a3e"
+  integrity sha512-vIpgF6wfuJOZI7KKKSP+HmiKggadPQAdsp5HiC1mvqnfp0gF1vdwgBWZIdrVft9pgqoMFQN+R7BSWZiBxx+BBw==
+  dependencies:
+    path-parse "^1.0.6"
+
 resolve@^1.3.2:
   version "1.10.1"
   resolved "https://registry.npmjs.org/resolve/-/resolve-1.10.1.tgz#664842ac960795bbe758221cdccda61fb64b5f18"
@@ -9037,14 +9564,14 @@ source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, source-map@~0.5.3:
   version "0.5.6"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412"
 
+source-map@^0.5.7, source-map@~0.5.6:
+  version "0.5.7"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
+
 source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
 
-source-map@~0.5.6:
-  version "0.5.7"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
-
 sourcemap-codec@^1.4.4:
   version "1.4.4"
   resolved "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.4.tgz#c63ea927c029dd6bd9a2b7fa03b3fec02ad56e9f"
@@ -9313,6 +9840,13 @@ strip-ansi@^5.0.0, strip-ansi@^5.1.0, strip-ansi@^5.2.0:
   dependencies:
     ansi-regex "^4.1.0"
 
+strip-bom@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-2.0.0.tgz#6219a85616520491f35788bdbf1447a99c7e6b0e"
+  integrity sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=
+  dependencies:
+    is-utf8 "^0.2.0"
+
 strip-bom@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
@@ -9325,6 +9859,11 @@ strip-json-comments@^2.0.1, strip-json-comments@~2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
 
+supports-color@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
+  integrity sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=
+
 supports-color@^4.0.0:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-4.2.1.tgz#65a4bb2631e90e02420dba5554c375a4754bb836"
@@ -9433,6 +9972,17 @@ terser@^3.16.1:
     source-map "~0.6.1"
     source-map-support "~0.5.10"
 
+test-exclude@^4.2.1:
+  version "4.2.3"
+  resolved "https://registry.yarnpkg.com/test-exclude/-/test-exclude-4.2.3.tgz#a9a5e64474e4398339245a0a769ad7c2f4a97c20"
+  integrity sha512-SYbXgY64PT+4GAL2ocI3HwPa4Q4TBKm0cwAVeKOt/Aoc0gSpNRjJX8w0pA1LMKZ3LBmd8pYBqApFNQLII9kavA==
+  dependencies:
+    arrify "^1.0.1"
+    micromatch "^2.3.11"
+    object-assign "^4.1.0"
+    read-pkg-up "^1.0.1"
+    require-main-filename "^1.0.1"
+
 test-exclude@^5.2.3:
   version "5.2.3"
   resolved "https://registry.yarnpkg.com/test-exclude/-/test-exclude-5.2.3.tgz#c3d3e1e311eb7ee405e092dac10aefd09091eac0"
@@ -9519,6 +10069,11 @@ to-ast@^1.0.0:
     ast-types "^0.7.2"
     esprima "^2.1.0"
 
+to-fast-properties@^1.0.1, to-fast-properties@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.3.tgz#b83571fa4d8c25b82e231b06e3a3055de4ca1a47"
+  integrity sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=
+
 to-fast-properties@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"