Clean up gatsby-theme package

packages/components/src/Provider.js

@@ -7,7 +7,7 @@ import mdxComponents from './mdx-components'
 const DefaultProvider = props => <>{props.children}</>
 
 export const Provider = props => {
-  const { headTags, theme, mdx } = props
+  const { headTags, theme = {}, mdx } = props
   const {
     Provider: UserProvider = DefaultProvider,
     components: themeComponents = {},

packages/gatsby-theme/README.md

@@ -11,7 +11,7 @@ _Note:_ This theme **requires MDX v1** and will not work with previous versions
 ```js
 // gatsby-config.js
 module.exports = {
-  __experimentalThemes: ['@mdx-deck/gatsby-theme'],
+  plugins: ['@mdx-deck/gatsby-theme'],
 }
 ```
 
@@ -50,7 +50,7 @@ The following options can be passed to the gatsby theme.
 ```js
 // gatsby-config.js
 module.exports = {
-  __experimentalThemes: [
+  plugins: [
     {
       resolve: '@mdx-deck/gatsby-theme',
       options: {

packages/gatsby-theme/src/decks/hello.mdx

@@ -22,7 +22,7 @@ This is the MDX Deck Gatsby theme
 ```js
 // gatsby-config.js
 module.exports = {
-  __experimentalThemes: [
+  plugins: [
     '@mdx-deck/gatsby-theme',
   ]
 }

packages/gatsby-theme/src/layouts/footer.js

@@ -1 +0,0 @@
-export default () => false

packages/gatsby-theme/src/layouts/header.js

@@ -1 +0,0 @@
-export default () => false

packages/gatsby-theme/src/layouts/index.js

@@ -2,8 +2,6 @@ import React from 'react'
 import { navigate } from 'gatsby'
 import { Embed } from '@mdx-deck/components'
 import Root from './root'
-import Header from './header'
-import Footer from './footer'
 
 const Thumb = props => (
   <div
@@ -30,7 +28,6 @@ const Thumb = props => (
 
 export default props => (
   <Root>
-    <Header {...props} />
     <ul
       css={{
         listStyle: 'none',
@@ -57,6 +54,5 @@ export default props => (
         </li>
       ))}
     </ul>
-    <Footer {...props} />
   </Root>
 )

packages/gatsby-theme/src/splitter.js

@@ -1,29 +0,0 @@
-import React from 'react'
-
-export default props => {
-  const { basepath } = props.pageContext || {}
-  const { theme, themes } = props
-  const arr = React.Children.toArray(props.children)
-  const splits = []
-  const slides = []
-
-  arr.forEach((child, i) => {
-    if (child.props.mdxType === 'hr') splits.push(i)
-  })
-
-  let previousSplit = 0
-  splits.forEach(i => {
-    const children = [...arr.slice(previousSplit, i)]
-    slides.push(() => children)
-    previousSplit = i + 1
-  })
-  slides.push(() => [...arr.slice(previousSplit)])
-
-  return {
-    ...props,
-    theme,
-    themes,
-    slides,
-    basepath,
-  }
-}

packages/gatsby-theme/src/templates/deck.js

@@ -1,11 +1,11 @@
 import React from 'react'
-import MDXRenderer from 'gatsby-mdx/mdx-renderer'
+import { MDXRenderer } from 'gatsby-plugin-mdx'
 import { graphql } from 'gatsby'
 import Layout from '../layouts/deck'
 
 export default props => {
   const { mdx } = props.data
-  const Component = props => <MDXRenderer {...props} children={mdx.code.body} />
+  const Component = props => <MDXRenderer {...props} children={mdx.body} />
 
   return <Layout Component={Component} basepath={props.pageContext.basepath} />
 }
@@ -14,9 +14,7 @@ export const query = graphql`
   query($id: String!) {
     mdx(id: { eq: $id }) {
       id
-      code {
       body
     }
   }
-  }
 `

packages/gatsby-theme/src/templates/index.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { graphql } from 'gatsby'
-import MDXRenderer from 'gatsby-mdx/mdx-renderer'
+import { MDXRenderer } from 'gatsby-plugin-mdx'
 import get from 'lodash.get'
 import Layout from '../layouts/index'
 
@@ -15,8 +15,8 @@ export default props => {
       ...node,
       slug: node.fields.deck,
       title: getTitle(node),
-      children: <MDXRenderer children={node.code.body} />,
-      Component: props => <MDXRenderer {...props} children={node.code.body} />,
+      children: <MDXRenderer children={node.body} />,
+      Component: props => <MDXRenderer {...props} children={node.body} />,
     }))
     .filter(node => node.parent.sourceInstanceName === 'decks')
   return <Layout {...props} decks={decks} />
@@ -31,9 +31,7 @@ export const query = graphql`
           fields {
             deck
           }
-          code {
           body
-          }
           headings {
             depth
             value