MDX runtime

[subhero24]

I have a question regarding using MDX runtime.
I want to use MDX at runtime to parse MDX to react elements.

The docs contain the following example

import React from 'react'
import MDX from '@mdx-js/runtime'
// Provide custom components for markdown elements
const components = {
  h1: props => <h1 style={{ color: 'tomato' }} {...props} />
}
// Provide custom components that will be referenced as JSX
// in the markdown string
const scope = {
  Demo: props => <h1>This is a demo component</h1>
}
const mdx = `
# Hello, world!
<Demo />
`
export default () => (
  <MDX components={components} scope={scope}>{mdx}</MDX>
)

Using this component results in an error message:

Component Demo was not imported, exported, or provided by MDXProvider as global scope

Is the example still correct? Do I need to always wrap it with an MDXProvider?

[johno]

Ah, nice catch. We should most likely update the docs so that they pass Demo in with components since that's what's passed to the MDXProvider. As of v1, scope is more intended for other variables rather than additional components.

[subhero24]

Putting Demo in the components object does indeed work. Thanks!

[johno]

The readme has been updated so I'm going to go ahead and close now, thanks for opening!