MarkdownViewer

const MarkdownViewerExample = () => {
  return (
    // eslint-disable-next-line github/unescaped-html-literal
    <MarkdownViewer dangerousRenderedHTML={{__html: '<strong>Lorem ipsum</strong> dolor sit amet.'}} />
  )
}

render(MarkdownViewerExample)

const MarkdownViewerExample = () => {
  return (
    <MarkdownViewer
      // eslint-disable-next-line github/unescaped-html-literal
      dangerousRenderedHTML={{__html: "<a href='https://example.com'>Example link</a>"}}
      onLinkClick={ev => console.log(ev)}
    />
  )
}

render(MarkdownViewerExample)

const markdownSource = `
text before list

- [ ] item 1
- [ ] item 2

text after list`

const renderedHtml = `
<p>text before list</p>
<ul class='contains-task-list'>
  <li class='task-list-item'><input type='checkbox' class='task-list-item-checkbox' disabled/> item 1</li>
  <li class='task-list-item'><input type='checkbox' class='task-list-item-checkbox' disabled/> item 2</li>
</ul>
<p>text after list</p>`

const MarkdownViewerExample = () => {
  return (
    <MarkdownViewer
      dangerousRenderedHTML={{__html: renderedHtml}}
      markdownValue={markdownSource}
      onChange={value => console.log(value) /* save the value to the server */}
      disabled={false}
    />
  )
}

render(MarkdownViewerExample)