Consider how to align with the .mdx proposal about mdx

[johno]

Rather than having .jsx specific syntax (assuming inline JSX support), we should have different component contexts for different syntaxes. So when you pass in your component scope you can specify components like so:

import Markdown from '@c8r/markdown'
import {
  Text,
  Heading,
  CodeBlockJSX,
  CodeBlockHTML
} from './ui'

// ...

<Markdown
  text={md}
  components={{
    p: Text.p,
    h1: Heading.h1,
    codeBlock: {
      jsx: CodeBlockJSX,
      html: CodeBlockHTML
  }}
/>

[johno]

I wonder about the inlining js portion, perhaps that can be left out? Or perhaps it should be JSX {} syntax?

[johno]

If a markdown document is imported with a custom babel loader, we need to consider the best way to provide a component mapping to the core library. For example, a trivial component mapping might be:

{
  a: Link,
  p: Text,
  h1: Heading,
  // ...
}

One option could be using a context provider:

import React from 'react'
import { MdProvider } from '@compositor/markdown'

import Document from './document.mdx'
import * as ui from './ui'

export default () =>
  <MdProvider components={ui}>
    <Document />
  </MdProvider>

[johno]

Preliminary import, component mapping, and inlined jsx support completed ✅