diff --git a/examples/react-graphql/client/@types/rimble-ui.d.ts b/examples/react-graphql/client/@types/rimble-ui.d.ts
new file mode 100644
index 000000000..ed6c436d4
--- /dev/null
+++ b/examples/react-graphql/client/@types/rimble-ui.d.ts
@@ -0,0 +1 @@
+declare module 'rimble-ui'
diff --git a/examples/react-graphql/client/package.json b/examples/react-graphql/client/package.json
index 6ca9f8283..f1e480d33 100644
--- a/examples/react-graphql/client/package.json
+++ b/examples/react-graphql/client/package.json
@@ -11,6 +11,7 @@
     "@types/node": "^12.0.0",
     "@types/react": "^16.9.0",
     "@types/react-dom": "^16.9.0",
+    "@types/styled-components": "^4.4.2",
     "apollo-boost": "^0.4.7",
     "graphql": "^14.5.8",
     "react": "^16.12.0",
@@ -18,6 +19,7 @@
     "react-dom": "^16.12.0",
     "react-scripts": "3.3.0",
     "rimble-ui": "^0.11.1",
+    "styled-components": "^5.0.0",
     "typescript": "~3.7.2"
   },
   "scripts": {
diff --git a/examples/react-graphql/client/src/index.tsx b/examples/react-graphql/client/src/index.tsx
index 3f71d2b5d..da42e6e60 100644
--- a/examples/react-graphql/client/src/index.tsx
+++ b/examples/react-graphql/client/src/index.tsx
@@ -1,9 +1,13 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
-import App from './App'
+import Dashboard from './views/Dashboard/Dashboard'
 import ApolloClient from 'apollo-boost'
 import { ApolloProvider } from 'react-apollo'
 import * as serviceWorker from './serviceWorker'
+import { BaseStyles, theme } from 'rimble-ui'
+import { ThemeProvider } from 'styled-components'
+
+import '../src/styles/base.css'
 
 const client = new ApolloClient({
   uri: 'http://localhost:4000/',
@@ -22,7 +26,22 @@ const client = new ApolloClient({
 
 ReactDOM.render(
   <ApolloProvider client={client}>
-    <App />
+    <ThemeProvider
+      theme={Object.assign({}, theme, {
+        colors: {
+          ...theme.colors, // keeps existing colors
+          text: '#EEE', // sets color for text
+          background: '#222', // sets color for background
+          primary: '#3259D6', // sets primary color
+        },
+        fontSizes: [12, 14, 16, 20, 24, 32, 48, 64], // sets font scale
+        space: [0, 4, 8, 16, 32, 64, 128, 256], // sets spacing scale
+      })}
+    >
+      <BaseStyles id="base_styles_container">
+        <Dashboard />
+      </BaseStyles>
+    </ThemeProvider>
   </ApolloProvider>,
   document.getElementById('root'),
 )
diff --git a/examples/react-graphql/client/src/styles/base.css b/examples/react-graphql/client/src/styles/base.css
new file mode 100644
index 000000000..3beb4d84c
--- /dev/null
+++ b/examples/react-graphql/client/src/styles/base.css
@@ -0,0 +1,26 @@
+html {
+  background-color: #f5f5f5;
+  overflow: hidden;
+}
+body {
+  margin: 0;
+  padding: 0;
+  font-family: 'proxima-nova';
+  overflow: hidden;
+  font-size: 16px;
+}
+
+#root {
+  display: flex;
+  height: 100vh;
+}
+
+#base_styles_container {
+  display: flex;
+  flex: 1;
+}
+
+* {
+  box-sizing: border-box;
+  -webkit-font-smoothing: antialiased;
+}
diff --git a/examples/react-graphql/client/src/views/Dashboard/Dashboard.tsx b/examples/react-graphql/client/src/views/Dashboard/Dashboard.tsx
new file mode 100644
index 000000000..25d24aa89
--- /dev/null
+++ b/examples/react-graphql/client/src/views/Dashboard/Dashboard.tsx
@@ -0,0 +1,147 @@
+import React, { useState } from 'react'
+import { useQuery, useMutation } from '@apollo/react-hooks'
+
+import { Flex, Box, Text, Heading, Button, Icon } from 'rimble-ui'
+
+interface DashboardProps {}
+
+const Dashboard: React.FC<DashboardProps> = () => {
+  const [sidePanelOpen, toggleSidePanel] = useState(false)
+
+  return (
+    <Flex flexDirection={'row'} flex={1}>
+      <Box p={3} bg="#1C1C1C">
+        <Box borderRadius={1} width={40} height={40} bg="white"></Box>
+      </Box>
+      <Box p={3} width={220} bg="#28292B" borderRight={1} borderColor={'#4B4B4B'}>
+        <Box mb={32}>
+          <Heading as={'h3'}>Daf Dashboard</Heading>
+          <Text>Description</Text>
+        </Box>
+        <Box bg="#222222" mb={2} p={1} pl={3} borderRadius={1}>
+          <Text>Activity</Text>
+        </Box>
+        <Box bg="#983587" mb={2} p={1} pl={3} borderRadius={1}>
+          <Text>Explore</Text>
+        </Box>
+        <Box bg="#222222" mb={2} p={1} pl={3} borderRadius={1}>
+          <Text>Issue Credential</Text>
+        </Box>
+        <Box bg="#222222" mb={2} p={1} pl={3} borderRadius={1}>
+          <Text>Request</Text>
+        </Box>
+        <Box bg="#222222" mb={2} p={1} pl={3} borderRadius={1}>
+          <Text>Link 1</Text>
+        </Box>
+        <Box bg="#222222" mb={2} p={1} pl={3} borderRadius={1}>
+          <Text>Link 1</Text>
+        </Box>
+      </Box>
+      <Box flex={1} bg="#1C1C1C">
+        <Box
+          p={3}
+          bg="#1C1C1C"
+          borderBottom={1}
+          borderColor={'#4B4B4B'}
+          flexDirection={'row'}
+          display={'flex'}
+          justifyContent={'space-between'}
+        >
+          <Heading as={'h4'}>Page Header</Heading>
+          <Icon name={'Menu'} color={'#CCC'} size={35} onClick={() => toggleSidePanel(!sidePanelOpen)} />
+        </Box>
+
+        <Box p={3} flex={1} height={'100%'} overflow={'scroll'} pb={64}>
+          <Box borderRadius={1} bg="#2B2B2B" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+
+          <Box borderRadius={1} bg="#222222" flex={1} mb={32}>
+            <Box p={3} borderBottom={1} borderColor={'#4B4B4B'}>
+              <Heading as={'h5'}>Panel Header</Heading>
+            </Box>
+            <Box p={3}>Panel body</Box>
+          </Box>
+        </Box>
+      </Box>
+      {sidePanelOpen && (
+        <Box width={350} bg="#1C1C1C" borderLeft={1} borderColor={'#4B4B4B'}>
+          <Box p={3}>
+            <Heading as={'h4'}>Context Panel</Heading>
+          </Box>
+          <Box p={3}>
+            <Text>We can show contextual information here</Text>
+          </Box>
+        </Box>
+      )}
+    </Flex>
+  )
+}
+
+export default Dashboard
diff --git a/examples/react-graphql/client/src/views/__tests__/Dashboard.snapshot.test.tsx b/examples/react-graphql/client/src/views/__tests__/Dashboard.snapshot.test.tsx
new file mode 100644
index 000000000..e69de29bb
diff --git a/examples/react-graphql/client/tsconfig.json b/examples/react-graphql/client/tsconfig.json
index af10394b4..7fe756010 100644
--- a/examples/react-graphql/client/tsconfig.json
+++ b/examples/react-graphql/client/tsconfig.json
@@ -15,5 +15,5 @@
     "noEmit": true,
     "jsx": "react"
   },
-  "include": ["src"]
+  "include": ["./src/**/*", "@types"]
 }
diff --git a/examples/react-graphql/client/yarn.lock b/examples/react-graphql/client/yarn.lock
index 45089aa1a..2988f945a 100644
--- a/examples/react-graphql/client/yarn.lock
+++ b/examples/react-graphql/client/yarn.lock
@@ -105,6 +105,13 @@
     lodash "^4.17.13"
     source-map "^0.5.0"
 
+"@babel/helper-annotate-as-pure@^7.0.0":
+  version "7.8.3"
+  resolved "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.8.3.tgz#60bc0bc657f63a0924ff9a4b4a0b24a13cf4deee"
+  integrity sha512-6o+mJrZBxOoEX77Ezv9zwW7WV8DdluouRKNY/IR5u/YTMuKHgugHOzYWlYvYLpLA9nPsQCAAASpCIbjI9Mv+Uw==
+  dependencies:
+    "@babel/types" "^7.8.3"
+
 "@babel/helper-annotate-as-pure@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.7.4.tgz#bb3faf1e74b74bd547e867e48f551fa6b098b6ce"
@@ -239,6 +246,13 @@
   dependencies:
     "@babel/types" "^7.8.3"
 
+"@babel/helper-module-imports@^7.0.0":
+  version "7.8.3"
+  resolved "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.8.3.tgz#7fe39589b39c016331b6b8c3f441e8f0b1419498"
+  integrity sha512-R0Bx3jippsbAEtzkpZ/6FIiuzOURPcMjHp+Z6xPe6DtApDJx+w7UYyOLanZqO8+wKR9G10s/FmHXvxaMd9s6Kg==
+  dependencies:
+    "@babel/types" "^7.8.3"
+
 "@babel/helper-module-imports@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.7.4.tgz#e5a92529f8888bf319a6376abfbd1cebc491ad91"
@@ -1012,7 +1026,7 @@
     globals "^11.1.0"
     lodash "^4.17.13"
 
-"@babel/traverse@^7.8.3":
+"@babel/traverse@^7.4.5", "@babel/traverse@^7.8.3":
   version "7.8.3"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.8.3.tgz#a826215b011c9b4f73f3a893afbc05151358bf9a"
   integrity sha512-we+a2lti+eEImHmEXp7bM9cTxGzxPmBiVJlLVD+FuuQMeeO7RaDbutbgeheDkw+Xe3mCfJHnGOWLswT74m2IPg==
@@ -1072,6 +1086,28 @@
     prop-types "^15.6.2"
     recompose "^0.27.1"
 
+"@emotion/is-prop-valid@^0.8.3":
+  version "0.8.6"
+  resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.6.tgz#4757646f0a58e9dec614c47c838e7147d88c263c"
+  integrity sha512-mnZMho3Sq8BfzkYYRVc8ilQTnc8U02Ytp6J1AwM6taQStZ3AhsEJBX2LzhA/LJirNCwM2VtHL3VFIZ+sNJUgUQ==
+  dependencies:
+    "@emotion/memoize" "0.7.4"
+
+"@emotion/memoize@0.7.4":
+  version "0.7.4"
+  resolved "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
+  integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
+
+"@emotion/stylis@^0.8.4":
+  version "0.8.5"
+  resolved "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04"
+  integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==
+
+"@emotion/unitless@^0.7.4":
+  version "0.7.5"
+  resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"
+  integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==
+
 "@hapi/address@2.x.x":
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5"
@@ -1480,6 +1516,14 @@
     "@types/minimatch" "*"
     "@types/node" "*"
 
+"@types/hoist-non-react-statics@*":
+  version "3.3.1"
+  resolved "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
+  integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==
+  dependencies:
+    "@types/react" "*"
+    hoist-non-react-statics "^3.3.0"
+
 "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0":
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.1.tgz#42995b446db9a48a11a07ec083499a860e9138ff"
@@ -1554,6 +1598,14 @@
   dependencies:
     "@types/react" "*"
 
+"@types/react-native@*":
+  version "0.60.31"
+  resolved "https://registry.npmjs.org/@types/react-native/-/react-native-0.60.31.tgz#a7af12197f884ad8dd22cda2df9862ed72973ded"
+  integrity sha512-Y0Q+nv50KHnLL+jM0UH68gQQv7Wt6v2KuNepiHKwK1DoWGVd1oYun/GJCnvUje+/V8pMQQWW6QuBvHZz1pV7tQ==
+  dependencies:
+    "@types/prop-types" "*"
+    "@types/react" "*"
+
 "@types/react@*", "@types/react@^16.9.0":
   version "16.9.17"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.17.tgz#58f0cc0e9ec2425d1441dd7b623421a867aa253e"
@@ -1567,6 +1619,16 @@
   resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-1.0.1.tgz#0a851d3bd96498fa25c33ab7278ed3bd65f06c3e"
   integrity sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw==
 
+"@types/styled-components@^4.4.2":
+  version "4.4.2"
+  resolved "https://registry.npmjs.org/@types/styled-components/-/styled-components-4.4.2.tgz#709fa7afd7dc0963b8316a0159240f0fe19a026d"
+  integrity sha512-dngFx2PuGoy0MGE68eHayAmJvLSqWrnTe9w+DnQruu8PS+waWEsKmoBRhkzL2h2pK1OJhzJhVfuiz+oZa4etpA==
+  dependencies:
+    "@types/hoist-non-react-statics" "*"
+    "@types/react" "*"
+    "@types/react-native" "*"
+    csstype "^2.2.0"
+
 "@types/testing-library__dom@*", "@types/testing-library__dom@^6.0.0":
   version "6.11.1"
   resolved "https://registry.yarnpkg.com/@types/testing-library__dom/-/testing-library__dom-6.11.1.tgz#6058a6ac391db679f7c60dbb27b81f0620de2dd9"
@@ -2366,6 +2428,21 @@ babel-plugin-named-asset-import@^0.3.5:
   resolved "https://registry.yarnpkg.com/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.5.tgz#d3fa1a7f1f4babd4ed0785b75e2f926df0d70d0d"
   integrity sha512-sGhfINU+AuMw9oFAdIn/nD5sem3pn/WgxAfDZ//Q3CnF+5uaho7C7shh2rKLk6sKE/XkfmyibghocwKdVjLIKg==
 
+"babel-plugin-styled-components@>= 1":
+  version "1.10.6"
+  resolved "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.6.tgz#f8782953751115faf09a9f92431436912c34006b"
+  integrity sha512-gyQj/Zf1kQti66100PhrCRjI5ldjaze9O0M3emXRPAN80Zsf8+e1thpTpaXJXVHXtaM4/+dJEgZHyS9Its+8SA==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.0.0"
+    "@babel/helper-module-imports" "^7.0.0"
+    babel-plugin-syntax-jsx "^6.18.0"
+    lodash "^4.17.11"
+
+babel-plugin-syntax-jsx@^6.18.0:
+  version "6.18.0"
+  resolved "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
+  integrity sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=
+
 babel-plugin-syntax-object-rest-spread@^6.8.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"
@@ -2789,6 +2866,11 @@ camelcase@5.3.1, camelcase@^5.0.0, camelcase@^5.3.1:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320"
   integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
 
+camelize@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/camelize/-/camelize-1.0.0.tgz#164a5483e630fa4321e5af07020e531831b2609b"
+  integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=
+
 caniuse-api@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0"
@@ -3328,6 +3410,11 @@ css-blank-pseudo@^0.1.4:
   dependencies:
     postcss "^7.0.5"
 
+css-color-keywords@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
+  integrity sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=
+
 css-color-names@0.0.4, css-color-names@^0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0"
@@ -3399,6 +3486,15 @@ css-select@^2.0.0:
     domutils "^1.7.0"
     nth-check "^1.0.2"
 
+css-to-react-native@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.0.0.tgz#62dbe678072a824a689bcfee011fc96e02a7d756"
+  integrity sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==
+  dependencies:
+    camelize "^1.0.0"
+    css-color-keywords "^1.0.0"
+    postcss-value-parser "^4.0.2"
+
 css-tree@1.0.0-alpha.37:
   version "1.0.0-alpha.37"
   resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.37.tgz#98bebd62c4c1d9f960ec340cf9f7522e30709a22"
@@ -5126,7 +5222,7 @@ hoist-non-react-statics@^2.3.1:
   resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47"
   integrity sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==
 
-hoist-non-react-statics@^3.3.0:
+hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#101685d3aff3b23ea213163f6e8e12f4f111e19f"
   integrity sha512-wbg3bpgA/ZqWrZuMOeJi8+SKMhr7X9TesL/rXMjTzh0p0JUBo3II8DHboYbuIXWRlttrUFxwcu/5kygrCw8fJw==
@@ -9633,6 +9729,11 @@ shallow-clone@^3.0.0:
   dependencies:
     kind-of "^6.0.2"
 
+shallowequal@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
+  integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
+
 shebang-command@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
@@ -10109,6 +10210,22 @@ style-loader@1.0.0:
     loader-utils "^1.2.3"
     schema-utils "^2.0.1"
 
+styled-components@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.npmjs.org/styled-components/-/styled-components-5.0.0.tgz#fc59932c9b574571fa3cd462c862af1956114ff2"
+  integrity sha512-F7VhIXIbUXJ8KO3pU9wap2Hxdtqa6PZ1uHrx+YXTgRjyxGlwvBHb8LULXPabmDA+uEliTXRJM5WcZntJnKNn3g==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@babel/traverse" "^7.4.5"
+    "@emotion/is-prop-valid" "^0.8.3"
+    "@emotion/stylis" "^0.8.4"
+    "@emotion/unitless" "^0.7.4"
+    babel-plugin-styled-components ">= 1"
+    css-to-react-native "^3.0.0"
+    hoist-non-react-statics "^3.0.0"
+    shallowequal "^1.1.0"
+    supports-color "^5.5.0"
+
 styled-system@^2.0.0:
   version "2.3.6"
   resolved "https://registry.yarnpkg.com/styled-system/-/styled-system-2.3.6.tgz#a38c1ffa04a5c35adec46473984e463c48b16f7c"
@@ -10138,7 +10255,7 @@ supports-color@^2.0.0:
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
   integrity sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=
 
-supports-color@^5.3.0:
+supports-color@^5.3.0, supports-color@^5.5.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
   integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==