Move MDXProviderComponents from /theme-provider to /mdx

Author: hasparus

packages/mdx/src/index.ts

@@ -9,17 +9,15 @@ import {
   ElementType,
   ComponentProps,
 } from 'react'
-import styled, { CreateStyled, StyledComponent } from '@emotion/styled'
-import {
-  MDXProvider as _MDXProvider,
-  useMDXComponents,
-  MDXProviderComponents as BaseProviderComponents,
-} from '@mdx-js/react'
+import styled, { StyledComponent } from '@emotion/styled'
+import { MDXProvider as _MDXProvider, useMDXComponents } from '@mdx-js/react'
 
-interface MDXProviderComponents extends BaseProviderComponents {
-  [key: string]: Parameters<CreateStyled>[0] | ComponentType<any> | undefined
+type MDXProviderComponentsKnownKeys = {
+  [key in keyof IntrinsicSxElements]?: React.ComponentType<any> | string
+}
+export interface MDXProviderComponents extends MDXProviderComponentsKnownKeys {
+  [key: string]: React.ComponentType<any> | string | undefined
 }
-
 export type MdxAliases = {
   [key in keyof IntrinsicSxElements]: keyof JSX.IntrinsicElements
 }
@@ -88,7 +86,6 @@ export type StyledComponentName =
 const alias = (n: StyledComponentName): keyof JSX.IntrinsicElements =>
   isAlias(n) ? aliases[n] : n
 
-
 export const themed = (key: StyledComponentName) => (props: ThemedProps) =>
   css(get(props.theme, `styles.${key}`))(props.theme)
 

packages/theme-provider/src/index.ts

@@ -7,7 +7,7 @@ import {
 } from '@theme-ui/core'
 import { css, Theme } from '@theme-ui/css'
 import { ColorModeProvider } from '@theme-ui/color-modes'
-import { MDXProvider } from '@theme-ui/mdx'
+import { MDXProvider, MDXProviderComponents } from '@theme-ui/mdx'
 import { Global } from '@emotion/core'
 
 const BodyStyles = () =>
@@ -34,16 +34,11 @@ const BodyStyles = () =>
     },
   })
 
-type ProvidedComponentsKnownKeys = {
-  [key in keyof IntrinsicSxElements]?: React.ComponentType<any> | string
-}
-export interface ProvidedComponents extends ProvidedComponentsKnownKeys {
-  [key: string]: React.ComponentType<any> | string | undefined
-}
+
 
 interface ThemeProviderProps extends Pick<CoreThemeProviderProps, 'theme'> {
   children?: React.ReactNode
-  components?: ProvidedComponents
+  components?: MDXProviderComponents
 }
 
 export const ThemeProvider: React.FC<ThemeProviderProps> = ({