Merge branch 'master' into v2-prototype

CHANGELOG.md

@@ -13,6 +13,10 @@
 - Removed `notes` language attribute for fenced code blocks
 - Refactored dev server
 
+## v1.10.0 2019-02-18
+
+- Update to Babel 7
+
 ## v1.9.0 2019-02-18
 
 - Fix for font size in nested lists #204

lib/config.js

@@ -15,7 +15,9 @@ const babel = {
   presets: ['@babel/preset-env', '@babel/preset-react'].map(require.resolve),
   plugins: [
     '@babel/plugin-proposal-class-properties',
+    '@babel/plugin-proposal-export-default-from',
     '@babel/plugin-proposal-export-namespace-from',
+    '@babel/plugin-syntax-dynamic-import',
     'babel-plugin-styled-components',
   ].map(require.resolve),
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdx-deck",
-  "version": "1.9.0",
+  "version": "1.10.0",
   "description": "MDX-based presentation decks",
   "main": "src/index.js",
   "bin": {
@@ -19,7 +19,9 @@
   "dependencies": {
     "@babel/core": "^7.2.2",
     "@babel/plugin-proposal-class-properties": "^7.3.0",
+    "@babel/plugin-proposal-export-default-from": "^7.0.0",
     "@babel/plugin-proposal-export-namespace-from": "^7.2.0",
+    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
     "@babel/preset-env": "^7.3.1",
     "@babel/preset-react": "^7.0.0",
     "@mdx-js/mdx": "^0.15.7",

src/layouts/FullScreenCode.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import styled from 'styled-components'
 
-const FullCode = styled.div([], {
+const FullCode = styled.div({
   width: '100vw',
   height: '100vh',
   textAlign: 'left',
@@ -14,4 +14,4 @@ const FullCode = styled.div([], {
   },
 })
 
-export default FullCode
+export default props => <FullCode {...props} />

src/layouts/Invert.js

@@ -1,20 +1,24 @@
+import React from 'react'
 import styled from 'styled-components'
 import { color } from 'styled-system'
 
-const Invert = styled.div([], {
+const Invert = styled.div(
+  {
     width: '100vw',
     height: '100vh',
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',
     '& a': {
-    color: 'inherit'
+      color: 'inherit',
-  }
+    },
-}, color)
+  },
+  color
+)
 
 Invert.defaultProps = {
   color: 'background',
-  bg: 'text'
+  bg: 'text',
 }
 
-export default Invert
+export default props => <Invert {...props} />

test/__snapshots__/components.js.snap

@@ -52,14 +52,10 @@ exports[`renders h1 1`] = `
 .c0 {
   line-height: 1.25;
   font-size: 24px;
-  margin-bottom: 16px;
-  margin-top: 16px;
-  color: heading;
 }
 
 <h1
-  className="c0"
+  className="-h1 c0"
-  color="heading"
   fontSize={4}
 />
 `;
@@ -68,14 +64,10 @@ exports[`renders h2 1`] = `
 .c0 {
   line-height: 1.25;
   font-size: 20px;
-  margin-bottom: 16px;
-  margin-top: 16px;
-  color: heading;
 }
 
 <h2
-  className="c0"
+  className="-h2 c0"
-  color="heading"
   fontSize={3}
 />
 `;
@@ -84,14 +76,10 @@ exports[`renders h3 1`] = `
 .c0 {
   line-height: 1.25;
   font-size: 16px;
-  margin-bottom: 16px;
-  margin-top: 16px;
-  color: heading;
 }
 
 <h3
-  className="c0"
+  className="-h3 c0"
-  color="heading"
   fontSize={2}
 />
 `;
@@ -99,21 +87,18 @@ exports[`renders h3 1`] = `
 exports[`renders h4 1`] = `
 <h4
   className=""
-  fontSize={2}
 />
 `;
 
 exports[`renders h5 1`] = `
 <h5
   className=""
-  fontSize={2}
 />
 `;
 
 exports[`renders h6 1`] = `
 <h6
   className=""
-  fontSize={2}
 />
 `;
 

test/__snapshots__/index.js.snap

@@ -429,13 +429,10 @@ Array [
       className="c1"
     />
   </div>,
-  .c1 {
+  .c0 {
   cursor: pointer;
   width: 64px;
   height: 100vh;
-}
-
-.c0 {
   position: fixed;
   top: 0;
   left: 0;
@@ -443,18 +440,15 @@ Array [
 }
 
 <div
-    className="c0 c1"
+    className="c0"
     onClick={[Function]}
     role="button"
     title="Previous Slide"
   />,
-  .c1 {
+  .c0 {
   cursor: pointer;
   width: 64px;
   height: 100vh;
-}
-
-.c0 {
   position: fixed;
   top: 0;
   right: 0;
@@ -462,7 +456,7 @@ Array [
 }
 
 <div
-    className="c0 c1"
+    className="c0"
     onClick={[Function]}
     role="button"
     title="Next Slide"