diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..5b130c8 --- /dev/null +++ b/.babelrc @@ -0,0 +1,15 @@ +{ + "presets": [ + "next/babel" + ], + "plugins": [ + [ + "styled-components", + { + "ssr": true, + "displayName": true, + "preprocess": false + } + ] + ] +} \ No newline at end of file diff --git a/components/FileSystem/index.tsx b/components/FileSystem/index.tsx index 38eb39b..58f8f0d 100644 --- a/components/FileSystem/index.tsx +++ b/components/FileSystem/index.tsx @@ -1,6 +1,9 @@ -import React, { useState } from 'react' +import React, { useState, useContext } from 'react' import Modal from 'react-modal' +import styled, { ThemeContext } from 'styled-components' +import { Theme } from '../../utils/types' import { slugify } from '../../utils/helpers' +import { SecondaryButton, PrimaryButton } from '../../utils/styles' const customStyle: ReactModal.Styles = { overlay: { @@ -20,6 +23,7 @@ const customStyle: ReactModal.Styles = { } const FileSystem = ({ files, activeFile, setActive, setFiles }) => { + const theme: Theme = useContext(ThemeContext) const [isModalOpen, setModalStatus] = useState(false) const [fileName, setFileName] = useState('') @@ -40,32 +44,28 @@ const FileSystem = ({ files, activeFile, setActive, setFiles }) => { return ( <> -
- - -
+ + setModalStatus(true)}> + Add Page +
- setFileName(e.target.value)} - className="filename_wrapper" placeholder="Please enter file name" /> - +
{files && Object.keys(files).length > 0 && Object.values(files).map(({ name, id }, index) => { return ( -
setActive(id)} style={{ @@ -74,43 +74,36 @@ const FileSystem = ({ files, activeFile, setActive, setFiles }) => { }} > {name} -
+ ) })} -
- - + ) } export default FileSystem + +const FilesWrapper = styled.section( + (props: Theme) => ` + width: 350px; + background-color: ${props.primaryBackground}; + padding: 0px 15px; +` +) + +const FileNameWrapper = styled.input` + font-size: 14px; + padding: 5px 15px; +` + +const FileIcon = styled.div` + font-size: 14px; + text-align: left; + text-transform: capitalize; + margin-bottom: 10px; + padding: 5px 10px; + border-radius: 4px; + border: 1px solid #ddd; + cursor: pointer; +` diff --git a/components/Header/index.tsx b/components/Header/index.tsx index 870609b..b568b4c 100644 --- a/components/Header/index.tsx +++ b/components/Header/index.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import React, { useContext } from 'react' import { createProjectPacker } from '@teleporthq/teleport-project-packer' import { createReactProjectGenerator, @@ -6,9 +6,11 @@ import { } from '@teleporthq/teleport-project-generator-react' import { createCodesandboxPublisher } from '@teleporthq/teleport-publisher-codesandbox' import { ProjectUIDL } from '@teleporthq/teleport-types' +import styled, { ThemeContext } from 'styled-components' import { exportJson } from '../../utils/helpers' -import { Files, BlogMeta, File } from '../../utils/types' +import { Files, BlogMeta, File, Theme } from '../../utils/types' import { generateProjectUIDL } from '../../utils/uidl-utils' +import { SecondaryButton } from '../../utils/styles' interface HeaderProps { files: Files @@ -17,6 +19,7 @@ interface HeaderProps { } const Header = ({ files, meta, activeFile }: HeaderProps) => { + const theme: Theme = useContext(ThemeContext) const { name } = activeFile || { name: `` } const downloadProjectUIDL = () => { const elm = document.getElementById('download_uidl') @@ -41,33 +44,27 @@ const Header = ({ files, meta, activeFile }: HeaderProps) => { return ( <> -
-
{name}
- - Download UIDL - - -
- + + ) } export default Header + +const HeaderWrapper = styled.section` + display: flex; + justify-content: space-around; + background-color: #2f3031; +` + +const FileName = styled.div` + color: #fff; + padding-top: 15px; + padding-left: 25px; + height: 35px; +` diff --git a/package.json b/package.json index 8b15224..d841320 100644 --- a/package.json +++ b/package.json @@ -40,12 +40,15 @@ "react-ace": "^8.0.0", "react-dom": "^16.12.0", "react-modal": "^3.11.1", - "rollup": "^1.31.0" + "rollup": "^1.31.0", + "styled-components": "^5.0.1" }, "devDependencies": { "@types/node": "^13.1.8", "@types/react": "^16.9.17", "@types/react-modal": "^3.10.4", + "@types/styled-components": "^4.4.2", + "babel-plugin-styled-components": "^1.10.7", "husky": "^4.2.1", "prettier": "^1.19.1", "tslint": "^6.0.0", diff --git a/pages/_document.tsx b/pages/_document.tsx index f7bd60f..bd83a57 100644 --- a/pages/_document.tsx +++ b/pages/_document.tsx @@ -1,15 +1,18 @@ import Document, { Html, Head, Main, NextScript } from 'next/document' +import { ServerStyleSheet } from 'styled-components' class MyDocument extends Document { + static getInitialProps({ renderPage }) { + const sheet = new ServerStyleSheet() + const page = renderPage((App) => (props) => sheet.collectStyles()) + const styleTags = sheet.getStyleElement() + return { ...page, styleTags } + } + render() { return ( - - - + {this.props.styleTags}
diff --git a/pages/blog_editor.tsx b/pages/blog_editor.tsx index c2e2421..da450b2 100644 --- a/pages/blog_editor.tsx +++ b/pages/blog_editor.tsx @@ -1,15 +1,14 @@ -import { ProjectUIDL } from '@teleporthq/teleport-types' import React, { useState, useEffect } from 'react' import dynamic from 'next/dynamic' import firebase from 'firebase' +import styled from 'styled-components' -import Header from '../components/Header' import FileSystem from '../components/FileSystem' import { File, Files, BlogMeta } from '../utils/types' -import { generateProjectUIDLTemplate } from '../utils/project' import preview from '../utils/bundler' import fb from '../firebase' +const Header = dynamic(import('../components/Header'), { ssr: false }) const CodeEditor = dynamic(import('../components/CodeEditor'), { ssr: false }) const BlogEditor = () => { @@ -115,17 +114,17 @@ const BlogEditor = () => { return ( <> -
- {user ? ( + {/*
*/} + {/* {user ? ( {fb.app.auth().currentUser.displayName} ({fb.app.auth().currentUser.email}){' '} ) : ( - )} -
-
+ )} */} + {/*
*/} + { />
-
Preview
-
+ Preview +
- - + ) } export default BlogEditor + +const GridWrapper = styled.section` + height: 100%; + display: grid; + grid-template-columns: 250px 50% 38%; +` + +const MarkdownRenderer = styled.div` + font-family: 'Roboto', sans-serif; + color: #2c3e50; + -webkit-font-smoothing: antialiased; + font-size: 16px; + padding: 5px; +` + +const MarkdownRendererHeading = styled.div` + margin: 10px; + padding-bottom: 5px; + text-align: left; + font-size: 20px; + border-bottom: 1px dotted #000; +` diff --git a/pages/index.tsx b/pages/index.tsx index 23cf6e4..b3e7141 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,10 +1,14 @@ -import React, { useEffect } from "react"; -import BlogEditor from "./blog_editor"; +import React from 'react' +import { ThemeProvider } from 'styled-components' +import BlogEditor from './blog_editor' +import { Dark } from '../utils/themes' const Home = () => { return ( <> - + + + - ); -}; + ) +} -export default Home; +export default Home diff --git a/public/teleport-logo-dark.svg b/public/teleport-logo-dark.svg deleted file mode 100644 index b87dd53..0000000 --- a/public/teleport-logo-dark.svg +++ /dev/null @@ -1,31 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/utils/styles.ts b/utils/styles.ts new file mode 100644 index 0000000..785cc7a --- /dev/null +++ b/utils/styles.ts @@ -0,0 +1,19 @@ +import styled from 'styled-components' +import { Theme } from '../utils/types' + +export const PrimaryButton = styled.button( + (props: Theme) => ` + cursor: pointer; + border: 1px solid #fff; + width: auto; + padding: 5px 15px; + background-color: ${props.primaryBackground}; + border-radius: 6px; + text-decoration: none; +` +) + +export const SecondaryButton = styled(PrimaryButton)` + cursor: pointer; + border: 1px solid #2f3031; +` diff --git a/utils/themes.ts b/utils/themes.ts new file mode 100644 index 0000000..b72410f --- /dev/null +++ b/utils/themes.ts @@ -0,0 +1,27 @@ +import { Theme } from './types' + +export const Dark: Theme = { + primaryBackground: '#2A2E30', + editorBackground: '#24272A', + highlighter: '#66696C', + hoverHighlighterBar: '#484B4E', + textPrimary: '#E2E3E3', + textSecondary: '#9FA2A3', + textHighlight: '#4CA9FF', + primaryButton: '#66696C', + primaryHoverButton: '#E2E3E3', + primaryButtonBorder: '#C4c4c4', +} + +export const Light: Theme = { + primaryBackground: '#F7F6F3', + editorBackground: '#FFFFFF', + highlighter: '#AAA9A5', + hoverHighlighterBar: '#D0CFCC', + textPrimary: '#676662', + textSecondary: '#66696C', + textHighlight: '#4CA9FF', + primaryButton: '#66696C', + primaryHoverButton: '#E2E3E3', + primaryButtonBorder: '#c4c4c4', +} diff --git a/utils/types.ts b/utils/types.ts index 684650e..6cdf5da 100644 --- a/utils/types.ts +++ b/utils/types.ts @@ -14,3 +14,16 @@ export interface BlogMeta { blogName: string blogDescription: string } + +export interface Theme { + primaryBackground: string + editorBackground: string + highlighter: string + hoverHighlighterBar: string + textPrimary: string + textSecondary: string + textHighlight: string + primaryButton: string + primaryHoverButton: string + primaryButtonBorder: string +} diff --git a/utils/uidl-utils.ts b/utils/uidl-utils.ts index 41502ae..00c8d11 100644 --- a/utils/uidl-utils.ts +++ b/utils/uidl-utils.ts @@ -68,7 +68,10 @@ export const generateProjectUIDL = (files: Files, meta: BlogMeta) => { const generateUIDLNdoes = (markdown: string) => { const uidlGenerator = markdownUIDLGenerator() + const tree = uidlGenerator.parser().parse(markdown) + console.log(tree) const uidlNodes = uidlGenerator.parse(markdown) + console.log(uidlNodes) return uidlNodes } diff --git a/yarn.lock b/yarn.lock index 0488006..83ffca1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -79,7 +79,7 @@ lodash "^4.17.13" source-map "^0.5.0" -"@babel/helper-annotate-as-pure@^7.8.3": +"@babel/helper-annotate-as-pure@^7.0.0", "@babel/helper-annotate-as-pure@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.8.3.tgz#60bc0bc657f63a0924ff9a4b4a0b24a13cf4deee" integrity sha512-6o+mJrZBxOoEX77Ezv9zwW7WV8DdluouRKNY/IR5u/YTMuKHgugHOzYWlYvYLpLA9nPsQCAAASpCIbjI9Mv+Uw== @@ -973,7 +973,7 @@ "@babel/parser" "^7.8.3" "@babel/types" "^7.8.3" -"@babel/traverse@^7.7.2", "@babel/traverse@^7.8.3", "@babel/traverse@^7.8.4": +"@babel/traverse@^7.4.5", "@babel/traverse@^7.7.2", "@babel/traverse@^7.8.3", "@babel/traverse@^7.8.4": version "7.8.4" resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.8.4.tgz#f0845822365f9d5b0e312ed3959d3f827f869e3c" integrity sha512-NGLJPZwnVEyBPLI+bl9y9aSnxMhsKz42so7ApAv9D+b4vAFPpY013FTS9LdKxcABoIYFU52HcYga1pPlx454mg== @@ -1002,6 +1002,28 @@ resolved "https://registry.yarnpkg.com/@csstools/convert-colors/-/convert-colors-1.4.0.tgz#ad495dc41b12e75d588c6db8b9834f08fa131eb7" integrity sha512-5a6wqoJV/xEdbRNKVo6I4hO3VjyDq//8q2f9I6PBAvMesJHFauXDorcNCsr9RzvsZnaWi5NYCcfyqP1QeFHFbw== +"@emotion/is-prop-valid@^0.8.3": + version "0.8.6" + resolved "https://registry.yarnpkg.com/@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.yarnpkg.com/@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.yarnpkg.com/@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.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed" + integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg== + "@firebase/analytics-types@0.2.5": version "0.2.5" resolved "https://registry.yarnpkg.com/@firebase/analytics-types/-/analytics-types-0.2.5.tgz#18f4400482a445504b69d6b64c7d98f11fd3ea5e" @@ -1430,7 +1452,7 @@ "@teleporthq/teleport-markdown-uidl-generator@https://github.pika.dev/teleporthq/teleport-markdown-uidl-generator/pr/2": version "0.0.0" - resolved "https://github.pika.dev/teleporthq/teleport-markdown-uidl-generator/pr/2#6b14bf438511c3816f7fda0f156a07acc97380ee" + resolved "https://github.pika.dev/teleporthq/teleport-markdown-uidl-generator/pr/2#7fd6f6ebdadca438b30d57f072c6f49a1ec636e2" dependencies: "@teleporthq/teleport-types" "^0.10.1" remark-parse "^7.0.2" @@ -1698,6 +1720,14 @@ dependencies: "@types/node" "*" +"@types/hoist-non-react-statics@*": + version "3.3.1" + resolved "https://registry.yarnpkg.com/@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/long@*", "@types/long@^4.0.0": version "4.0.1" resolved "https://registry.yarnpkg.com/@types/long/-/long-4.0.1.tgz#459c65fa1867dafe6a8f322c4c51695663cc55e9" @@ -1735,6 +1765,13 @@ dependencies: "@types/react" "*" +"@types/react-native@*": + version "0.61.10" + resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.61.10.tgz#d010b9093322bc781151638f74124f58fc87cc90" + integrity sha512-z+RWEFfdwHnOLpq70DO//4mjyNqoZypdR3uBqpBB82t2HJg2YbY4j6XIow7sFqeO/r8XibgV9UFEVG2tYIRlSA== + dependencies: + "@types/react" "*" + "@types/react@*", "@types/react@^16.9.17": version "16.9.19" resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.19.tgz#c842aa83ea490007d29938146ff2e4d9e4360c40" @@ -1743,6 +1780,16 @@ "@types/prop-types" "*" csstype "^2.2.0" +"@types/styled-components@^4.4.2": + version "4.4.2" + resolved "https://registry.yarnpkg.com/@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/unist@^2.0.0", "@types/unist@^2.0.2": version "2.0.3" resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.3.tgz#9c088679876f374eb5983f150d4787aa6fb32d7e" @@ -2250,7 +2297,17 @@ babel-plugin-dynamic-import-node@^2.3.0: dependencies: object.assign "^4.1.0" -babel-plugin-syntax-jsx@6.18.0: +"babel-plugin-styled-components@>= 1", babel-plugin-styled-components@^1.10.7: + version "1.10.7" + resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.7.tgz#3494e77914e9989b33cc2d7b3b29527a949d635c" + integrity sha512-MBMHGcIA22996n9hZRf/UJLVVgkEOITuR2SvjHLb5dSTUyR4ZRGn+ngITapes36FI3WLxZHfRhkA1ffHxihOrg== + 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, 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= @@ -2612,6 +2669,11 @@ camelcase@^2.0.1: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-2.1.1.tgz#7c1d16d679a1bbe59ca02cacecfb011e201f5a1f" integrity sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8= +camelize@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/camelize/-/camelize-1.0.0.tgz#164a5483e630fa4321e5af07020e531831b2609b" + integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs= + caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001017, caniuse-lite@^1.0.30001020, caniuse-lite@^1.0.30001023: version "1.0.30001025" resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001025.tgz#30336a8aca7f98618eb3cf38e35184e13d4e5fe6" @@ -3110,6 +3172,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.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05" + integrity sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU= + css-has-pseudo@^0.10.0: version "0.10.0" resolved "https://registry.yarnpkg.com/css-has-pseudo/-/css-has-pseudo-0.10.0.tgz#3c642ab34ca242c59c41a125df9105841f6966ee" @@ -3143,6 +3210,15 @@ css-prefers-color-scheme@^3.1.1: dependencies: postcss "^7.0.5" +css-to-react-native@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/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-vendor@^2.0.7: version "2.0.7" resolved "https://registry.yarnpkg.com/css-vendor/-/css-vendor-2.0.7.tgz#4e6d53d953c187981576d6a542acc9fb57174bda" @@ -4270,6 +4346,13 @@ hmac-drbg@^1.0.0: minimalistic-assert "^1.0.0" minimalistic-crypto-utils "^1.0.1" +hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0: + version "3.3.2" + resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" + integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== + dependencies: + react-is "^16.7.0" + hosted-git-info@^2.1.4: version "2.8.5" resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.5.tgz#759cfcf2c4d156ade59b0b2dfabddc42a6b9c70c" @@ -5797,7 +5880,7 @@ node-libs-browser@^2.2.1: util "^0.11.0" vm-browserify "^1.0.1" -node-pre-gyp@*, node-pre-gyp@^0.14.0: +node-pre-gyp@^0.14.0: version "0.14.0" resolved "https://registry.yarnpkg.com/node-pre-gyp/-/node-pre-gyp-0.14.0.tgz#9a0596533b877289bcad4e143982ca3d904ddc83" integrity sha512-+CvDC7ZttU/sSt9rFjix/P05iS43qHCOOGzcr3Ry99bXG7VX953+vFyEuph/tfqoYu8dttBkE86JSKBO2OzcxA== @@ -6966,7 +7049,7 @@ react-is@16.8.6: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.6.tgz#5bbc1e2d29141c9fbdfed456343fe2bc430a6a16" integrity sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA== -react-is@^16.8.1: +react-is@^16.7.0, react-is@^16.8.1: version "16.12.0" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c" integrity sha512-rPCkf/mWBtKc97aLL9/txD8DZdemK0vkA3JMLShjlJB3Pj3s+lpf1KaBzMfQrAmhMQB0n1cU/SUGgKKBCe837Q== @@ -7449,6 +7532,11 @@ shallow-clone@^3.0.0: dependencies: kind-of "^6.0.2" +shallowequal@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8" + integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ== + shell-quote@^1.6.1: version "1.7.2" resolved "https://registry.yarnpkg.com/shell-quote/-/shell-quote-1.7.2.tgz#67a7d02c76c9da24f99d20808fcaded0e0e04be2" @@ -7782,6 +7870,22 @@ style-loader@1.0.0: loader-utils "^1.2.3" schema-utils "^2.0.1" +styled-components@^5.0.1: + version "5.0.1" + resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.0.1.tgz#57782a6471031abefb2db5820a1876ae853bc619" + integrity sha512-E0xKTRIjTs4DyvC1MHu/EcCXIj6+ENCP8hP01koyoADF++WdBUOrSGwU1scJRw7/YaYOhDvvoad6VlMG+0j53A== + 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-jsx@3.2.4: version "3.2.4" resolved "https://registry.yarnpkg.com/styled-jsx/-/styled-jsx-3.2.4.tgz#cbcdedcfb81d717fd355c4a0d8443f8e74527b60" @@ -7811,7 +7915,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==