Merge branch 'master' of github.com:codesandbox/codesandbox-client into cleanup/components/base

Author: SaraVieira

.all-contributorsrc

@@ -1549,6 +1549,43 @@
       "contributions": [
         "doc"
       ]
+    },
+    {
+      "login": "akash-joshi",
+      "name": "Akash Joshi",
+      "avatar_url": "https://avatars0.githubusercontent.com/u/22196279?v=4",
+      "profile": "http://akashj.com",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "layershifter",
+      "name": "Oleksandr Fediashov",
+      "avatar_url": "https://avatars0.githubusercontent.com/u/14183168?v=4",
+      "profile": "https://twitter.com/layershifter",
+      "contributions": [
+        "bug",
+        "code"
+      ]
+    },
+    {
+      "login": "tehnuge",
+      "name": "John D.",
+      "avatar_url": "https://avatars1.githubusercontent.com/u/1928236?v=4",
+      "profile": "https://github.com/tehnuge",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "NinoMaj",
+      "name": "Nino",
+      "avatar_url": "https://avatars0.githubusercontent.com/u/20380632?v=4",
+      "profile": "https://github.com/NinoMaj",
+      "contributions": [
+        "doc"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.circleci/config.yml

@@ -27,12 +27,12 @@ aliases:
 
   - &restore_deps_cache
     keys:
-      - v36-dependency-cache-{{ .Branch }}-{{ checksum "yarn.lock" }}
-      - v36-dependency-cache-{{ .Branch }}
-      - v36-dependency-cache
+      - v37-dependency-cache-{{ .Branch }}-{{ checksum "yarn.lock" }}
+      - v37-dependency-cache-{{ .Branch }}
+      - v37-dependency-cache
 
   - &save_deps_cache
-    key: v36-dependency-cache-{{ .Branch }}-{{ checksum "yarn.lock" }}
+    key: v37-dependency-cache-{{ .Branch }}-{{ checksum "yarn.lock" }}
     paths:
       - node_modules
       - packages/app/node_modules
@@ -53,51 +53,51 @@ aliases:
 
   - &restore_standalone_deps_cache
     keys:
-      - v36-standalone-dependency-cache-{{ .Branch }}-{{ checksum
+      - v37-standalone-dependency-cache-{{ .Branch }}-{{ checksum
         "standalone-packages/codesandbox-browserfs/yarn.lock" }}
-      - v36-standalone-dependency-cache-{{ .Branch }}
-      - v36-standalone-dependency-cache
+      - v37-standalone-dependency-cache-{{ .Branch }}
+      - v37-standalone-dependency-cache
 
   - &save_standalone_deps_cache
     key:
-      v36-standalone-dependency-cache-{{ .Branch }}-{{ checksum
+      v37-standalone-dependency-cache-{{ .Branch }}-{{ checksum
       "standalone-packages/codesandbox-browserfs/yarn.lock" }}
     paths:
       - standalone-packages/codesandbox-browserfs/node_modules
 
   - &restore_prod_homepage_cache
-    key: v36-prod-homepage-build-cache-master
+    key: v37-prod-homepage-build-cache-master
 
   - &restore_prod_result
     key:
-      v36-prod-build-result-{{ .Environment.CIRCLE_BRANCH
+      v37-prod-build-result-{{ .Environment.CIRCLE_BRANCH
       }}-{{.Environment.CIRCLE_SHA1 }}
 
   - &save_prod_build_cache
     key:
-      v36-prod-build-cache-{{ .Environment.CIRCLE_BRANCH
+      v37-prod-build-cache-{{ .Environment.CIRCLE_BRANCH
       }}-{{.Environment.CIRCLE_SHA1 }}
     paths:
       - packages/app/node_modules/.cache
 
   - &restore_prod_build_cache
     keys:
-      - v36-prod-build-cache-{{ .Environment.CIRCLE_BRANCH
+      - v37-prod-build-cache-{{ .Environment.CIRCLE_BRANCH
         }}-{{.Environment.CIRCLE_SHA1 }}
-      - v36-prod-build-cache-{{ .Environment.CIRCLE_BRANCH }}-
-      - v36-prod-build-cache-master-
+      - v37-prod-build-cache-{{ .Environment.CIRCLE_BRANCH }}-
+      - v37-prod-build-cache-master-
 
   # To persist the images built by sharp
   - &save_prod_homepage_cache
     key:
-      v36-prod-homepage-build-cache-{{ .Environment.CIRCLE_BRANCH }}-{{
+      v37-prod-homepage-build-cache-{{ .Environment.CIRCLE_BRANCH }}-{{
       .Environment.CIRCLE_SHA1 }}
     paths:
       - ./packages/homepage/public
 
   - &save_prod_result
     key:
-      v36-prod-build-result-{{ .Environment.CIRCLE_BRANCH }}-{{
+      v37-prod-build-result-{{ .Environment.CIRCLE_BRANCH }}-{{
       .Environment.CIRCLE_SHA1 }}
     paths:
       - ./www
@@ -143,14 +143,14 @@ commands:
     steps:
       - restore_cache:
           keys:
-            - v36-source-cache-{{ .Branch }}-{{ .Revision }}
-            - v36-source-cache-{{ .Branch }}-
-            - v36-source-cache-
+            - v37-source-cache-{{ .Branch }}-{{ .Revision }}
+            - v37-source-cache-{{ .Branch }}-
+            - v37-source-cache-
 
       - checkout
 
       - save_cache:
-          key: v36-source-cache-{{ .Branch }}-{{ .Revision }}
+          key: v37-source-cache-{{ .Branch }}-{{ .Revision }}
           paths:
             - '.git'
   build_deps:

README.md

@@ -252,6 +252,12 @@ Thanks goes to these wonderful people
     <td align="center"><a href="http://anuraghazra.github.io"><img src="https://avatars3.githubusercontent.com/u/35374649?v=4" width="100px;" alt=""/><br /><sub><b>Anurag Hazra</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=anuraghazra" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/johansenja"><img src="https://avatars1.githubusercontent.com/u/43235608?v=4" width="100px;" alt=""/><br /><sub><b>johansenja</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=johansenja" title="Documentation">📖</a></td>
     <td align="center"><a href="https://shodipoayomide.com"><img src="https://avatars2.githubusercontent.com/u/20538832?v=4" width="100px;" alt=""/><br /><sub><b>Shodipo Ayomide</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=Developerayo" title="Documentation">📖</a></td>
+    <td align="center"><a href="http://akashj.com"><img src="https://avatars0.githubusercontent.com/u/22196279?v=4" width="100px;" alt=""/><br /><sub><b>Akash Joshi</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=akash-joshi" title="Code">💻</a></td>
+    <td align="center"><a href="https://twitter.com/layershifter"><img src="https://avatars0.githubusercontent.com/u/14183168?v=4" width="100px;" alt=""/><br /><sub><b>Oleksandr Fediashov</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/issues?q=author%3Alayershifter" title="Bug reports">🐛</a> <a href="https://github.com/codesandbox/codesandbox-client/commits?author=layershifter" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/tehnuge"><img src="https://avatars1.githubusercontent.com/u/1928236?v=4" width="100px;" alt=""/><br /><sub><b>John D.</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=tehnuge" title="Code">💻</a></td>
+  </tr>
+  <tr>
+    <td align="center"><a href="https://github.com/NinoMaj"><img src="https://avatars0.githubusercontent.com/u/20380632?v=4" width="100px;" alt=""/><br /><sub><b>Nino</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=NinoMaj" title="Documentation">📖</a></td>
   </tr>
 </table>
 

package.json

@@ -54,7 +54,8 @@
     "start:dynamic": "lerna run dev --scope dynamic-pages --stream",
     "start:fast": "cross-env NODE_ENV=development concurrently --raw \"cd packages/app && yarn start\" \"cd packages/common && yarn start\" \"cd packages/components && yarn start\"",
     "start:hot": "cross-env NODE_ENV=development APP_ONLY=true concurrently --raw \"cd packages/app && yarn start\" \"cd packages/common && yarn start\" \"cd packages/components && yarn start\"",
-    "start:fast:stream": "cross-env STAGING_API=1 NODE_ENV=development concurrently --raw \"cd packages/app && yarn start\" \"cd packages/common && yarn start\" \"cd packages/components && yarn start\"",
+    "start:fast:stream": "cross-env ENDPOINT=https://codesandbox.stream NODE_ENV=development concurrently --raw \"cd packages/app && yarn start\" \"cd packages/common && yarn start\" \"cd packages/components && yarn start\"",
+    "start:fast:local": "cross-env ENDPOINT=http://localhost:4000 NODE_ENV=development concurrently --raw \"cd packages/app && yarn start\" \"cd packages/common && yarn start\" \"cd packages/components && yarn start\"",
     "start:home": "yarn build:deps && yarn start:home:fast",
     "start:home:fast": "cd packages/homepage && yarn start",
     "start:overmind": "yarn build:deps && concurrently \"lerna run start --scope app --stream\" \"overmind-devtools\"",
@@ -76,7 +77,7 @@
   },
   "devDependencies": {
     "all-contributors-cli": "^6.9.2",
-    "babel-eslint": "^10.0.2",
+    "babel-eslint": "10.0.2",
     "concurrently": "^4.1.0",
     "cross-env": "^6.0.0",
     "eslint": "5.16.0",
@@ -94,7 +95,7 @@
     "lint-staged": "^9.2.5",
     "prettier": "1.19.1",
     "pretty-quick": "^2.0.1",
-    "typescript": "3.7.4",
+    "typescript": "3.9.2",
     "username": "^5.1.0"
   },
   "husky": {

packages/@styled-system/css/dist/index.esm.js renamed to packages/@styled-system/css/dist/index.js

@@ -1,7 +1,28 @@
 /* eslint-disable */
+'use strict';
+
+exports.__esModule = true;
+exports['default'] = exports.css = exports.responsive = exports.get = void 0;
+
+function _extends() {
+  _extends =
+    Object.assign ||
+    function(target) {
+      for (var i = 1; i < arguments.length; i++) {
+        var source = arguments[i];
+        for (var key in source) {
+          if (Object.prototype.hasOwnProperty.call(source, key)) {
+            target[key] = source[key];
+          }
+        }
+      }
+      return target;
+    };
+  return _extends.apply(this, arguments);
+}
 
 // based on https://github.com/developit/dlv
-export var get = function get(obj, key, def, p, undef) {
+var get = function get(obj, key, def, p, undef) {
   key = key && key.split ? key.split('.') : [key];
 
   for (p = 0; p < key.length; p++) {
@@ -10,10 +31,16 @@ export var get = function get(obj, key, def, p, undef) {
 
   return obj === undef ? def : obj;
 };
-const defaultBreakpoints = [40, 52, 64].map(function(n) {
+
+exports.get = get;
+var defaultBreakpoints = [40, 52, 64].map(function(n) {
   return n + 'em';
 });
-const aliases = {
+var defaultTheme = {
+  space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+  fontSizes: [12, 14, 16, 20, 24, 32, 48, 64, 72],
+};
+var aliases = {
   bg: 'backgroundColor',
   m: 'margin',
   mt: 'marginTop',
@@ -30,14 +57,14 @@ const aliases = {
   px: 'paddingX',
   py: 'paddingY',
 };
-const multiples = {
+var multiples = {
   marginX: ['marginLeft', 'marginRight'],
   marginY: ['marginTop', 'marginBottom'],
   paddingX: ['paddingLeft', 'paddingRight'],
   paddingY: ['paddingTop', 'paddingBottom'],
   size: ['width', 'height'],
 };
-const scales = {
+var scales = {
   color: 'colors',
   backgroundColor: 'colors',
   borderColor: 'colors',
@@ -111,18 +138,18 @@ const scales = {
   stroke: 'colors',
 };
 
-const positiveOrNegative = function positiveOrNegative(scale, value) {
+var positiveOrNegative = function positiveOrNegative(scale, value) {
   if (typeof value !== 'number' || value >= 0) {
     return get(scale, value, value);
   }
 
-  const absolute = Math.abs(value);
-  const n = get(scale, absolute, absolute);
+  var absolute = Math.abs(value);
+  var n = get(scale, absolute, absolute);
   if (typeof n === 'string') return '-' + n;
   return n * -1;
 };
 
-const transforms = [
+var transforms = [
   'margin',
   'marginTop',
   'marginRight',
@@ -135,25 +162,27 @@ const transforms = [
   'left',
   'right',
 ].reduce(function(acc, curr) {
-  let _extends2;
+  var _extends2;
 
-  return {
-    ...acc,
-    ...((_extends2 = {}), (_extends2[curr] = positiveOrNegative), _extends2),
-  };
+  return _extends(
+    {},
+    acc,
+    ((_extends2 = {}), (_extends2[curr] = positiveOrNegative), _extends2)
+  );
 }, {});
-export var responsive = function responsive(styles) {
+
+var responsive = function responsive(styles) {
   return function(theme) {
-    const next = {};
-    const breakpoints = get(theme, 'breakpoints', defaultBreakpoints);
-    const mediaQueries = [null].concat(
+    var next = {};
+    var breakpoints = get(theme, 'breakpoints', defaultBreakpoints);
+    var mediaQueries = [null].concat(
       breakpoints.map(function(n) {
         return '@media screen and (min-width: ' + n + ')';
       })
     );
 
-    for (const key in styles) {
-      const value =
+    for (var key in styles) {
+      var value =
         typeof styles[key] === 'function' ? styles[key](theme) : styles[key];
       if (value == null) continue;
 
@@ -162,8 +191,8 @@ export var responsive = function responsive(styles) {
         continue;
       }
 
-      for (let i = 0; i < value.slice(0, mediaQueries.length).length; i++) {
-        const media = mediaQueries[i];
+      for (var i = 0; i < value.slice(0, mediaQueries.length).length; i++) {
+        var media = mediaQueries[i];
 
         if (!media) {
           next[key] = value[i];
@@ -179,25 +208,28 @@ export var responsive = function responsive(styles) {
     return next;
   };
 };
-export var css = function css(args) {
+
+exports.responsive = responsive;
+
+var css = function css(args) {
   return function(props) {
     if (props === void 0) {
       props = {};
     }
 
-    const theme = props.theme || props;
+    var theme = props.theme || props;
 
-    let result = {};
-    const obj = typeof args === 'function' ? args(theme) : args;
-    const styles = responsive(obj)(theme);
+    var result = {};
+    var obj = typeof args === 'function' ? args(theme) : args;
+    var styles = responsive(obj)(theme);
 
-    for (const key in styles) {
-      const x = styles[key];
-      const val = typeof x === 'function' ? x(theme) : x;
+    for (var key in styles) {
+      var x = styles[key];
+      var val = typeof x === 'function' ? x(theme) : x;
 
       if (key === 'variant') {
-        const variant = css(get(theme, val))(theme);
-        result = { ...result, ...variant };
+        var variant = css(get(theme, val))(theme);
+        result = _extends({}, result, {}, variant);
         continue;
       }
 
@@ -206,16 +238,16 @@ export var css = function css(args) {
         continue;
       }
 
-      const prop = get(aliases, key, key);
-      const scaleName = get(scales, prop);
-      const scale = get(theme, scaleName, get(theme, prop, {}));
-      const transform = get(transforms, prop, get);
-      const value = transform(scale, val, val);
+      var prop = get(aliases, key, key);
+      var scaleName = get(scales, prop);
+      var scale = get(theme, scaleName, get(theme, prop, {}));
+      var transform = get(transforms, prop, get);
+      var value = transform(scale, val, val);
 
       if (multiples[prop]) {
-        const dirs = multiples[prop];
+        var dirs = multiples[prop];
 
-        for (let i = 0; i < dirs.length; i++) {
+        for (var i = 0; i < dirs.length; i++) {
           result[dirs[i]] = value;
         }
       } else {
@@ -226,4 +258,7 @@ export var css = function css(args) {
     return result;
   };
 };
-export default css;
+
+exports.css = css;
+var _default = css;
+exports['default'] = _default;