Skip to content

components prop to allow using React component in Markdown #12

@yhatt

Description

@yhatt

By custom function binding in HTM, we might support React component written in HTML block of plain Markdown.

import { Chart } from 'someone-react-chart-component'

const markdown = `
# Hello

<Chart type="line" data="5,8,4,9,7,2,6" />
`

ReactDOM.render(
  <Marp markdown={markdown} components={{ Chart }} />,
  document.getElementById('app')
)

⚠️ It is different from MDX. Marp React is a runtime component to support for live rendering, but MDX has no runtime (Actually it is there but not recommended). There are difference to each Markdown architectures too (markdown-it vs remark), and using Marp parser in MDX would be difficult. Thus, we have no idea to support MDX for now.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions