Update snapshots

package.json

@@ -68,7 +68,7 @@
     "puppeteer": "^1.12.2",
     "querystring": "^0.2.0",
     "react": "^16.8.2",
-    "react-dev-utils": "^6.1.1",
+    "react-dev-utils": "^7.0.3",
     "react-dom": "^16.8.2",
     "react-swipeable": "^4.3.2",
     "react-syntax-highlighter": "^8.1.0",
@@ -76,7 +76,7 @@
     "remark-unwrap-images": "^0.1.0",
     "rimraf": "^2.6.3",
     "stringify-object": "^3.3.0",
-    "styled-components": "^3.4.10",
+    "styled-components": "^4.1.3",
     "styled-system": "^3.2.1",
     "superbox": "^2.1.0",
     "webpack": "^4.29.5",
@@ -87,11 +87,10 @@
   "peerDependencies": {},
   "devDependencies": {
     "@babel/cli": "^7.0.0",
-    "babel-core": "^7.0.0-bridge.0",
-    "babel-jest": "^23.4.2",
+    "babel-jest": "^24.1.0",
     "husky": "^1.3.1",
-    "jest": "^23.6.0",
-    "jest-styled-components": "^5.0.1",
+    "jest": "^24.1.0",
+    "jest-styled-components": "^6.3.1",
     "lint-staged": "^7.3.0",
     "mdx-deck-code-surfer": "^0.4.1",
     "prettier": "^1.16.4",

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"
-  color="heading"
+  className="-h1 c0"
   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"
-  color="heading"
+  className="-h2 c0"
   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"
-  color="heading"
+  className="-h3 c0"
   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"