style(gatsby-theme-docz): simplify the default config (#1203)

* style(gatsby-theme-docz): simplify the default config

* improvements

Author: Kerumen

core/docz/src/components/Playground.tsx

@@ -11,7 +11,6 @@ export interface PlaygroundProps {
   __position: number
   __code: string
   language?: string
-  showLivePreview?: boolean
 }
 
 export const Playground: SFC<PlaygroundProps> = ({
@@ -23,7 +22,6 @@ export const Playground: SFC<PlaygroundProps> = ({
   __position,
   __code,
   language,
-  showLivePreview = true,
 }) => {
   const components = useComponents()
   const PlaygroundComponent = components.playground
@@ -39,7 +37,6 @@ export const Playground: SFC<PlaygroundProps> = ({
       scope={__scope}
       position={__position}
       code={__code}
-      showLivePreview={showLivePreview}
       language={language}
     />
   )

core/docz/src/index.ts

@@ -1,5 +1,5 @@
 export { Link, LinkProps } from './components/Link'
-export { Playground } from './components/Playground'
+export { Playground, PlaygroundProps } from './components/Playground'
 export { Props, PropsComponentProps } from './components/Props'
 
 export * from './hooks'

core/gatsby-theme-docz/src/components/Playground/index.js

@@ -10,18 +10,9 @@ import { usePrismTheme } from '~utils/theme'
 import * as styles from './styles'
 import * as Icons from '../Icons'
 
-export const Playground = ({
-  code,
-  scope,
-  showLivePreview: userShowLivePreview = true,
-  language,
-}) => {
+export const Playground = ({ code, scope, language }) => {
   const {
-    themeConfig: {
-      showPlaygroundEditor,
-      showLiveError,
-      showLivePreview = userShowLivePreview,
-    },
+    themeConfig: { showPlaygroundEditor, showLiveError, showLivePreview },
   } = useConfig()
 
   const theme = usePrismTheme()

core/gatsby-theme-docz/src/index.js

@@ -17,19 +17,4 @@ const Theme = ({ children }) => {
   )
 }
 
-export const enhance = theme(
-  defaultTheme,
-  ({
-    mode = 'light',
-    showPlaygroundEditor = true,
-    showLiveError = true,
-    ...config
-  }) => ({
-    ...config,
-    showLiveError,
-    showPlaygroundEditor,
-    initialColorMode: mode,
-  })
-)
-
-export default enhance(Theme)
+export default theme(defaultTheme)(Theme)

core/gatsby-theme-docz/src/theme/index.js

@@ -10,8 +10,10 @@ moraga.headerWeight = 700
 const typography = toTheme(moraga)
 
 export default merge(typography, {
-  prism,
   initialColorMode: 'light',
+  showLiveError: true,
+  showLivePreview: true,
+  showPlaygroundEditor: true,
   colors: {
     ...modes.light,
     modes: {
@@ -42,4 +44,5 @@ export default merge(typography, {
     rounded: 10,
   },
   styles,
+  prism,
 })