Function useMarkdownRenderers

This hook is pretty much an internal hook since it is used for the TokenRenderer component to render the tokens that marked has parsed. This can be used externally, but it's probably easier just to just import your components manually.

Example

Simple Example

function CustomHtmlRenderer({ text, raw }: HtmlRendererProps): ReactElement | null {
  const renderers = useMarkdownRenderers();
  const { codeblock: CodeBlock } = renderers;

  const rawCode = `\`\`\`html\n${raw}\n\`\`\``;
  return (
    <CodeBlock
      type="code"
      raw={rawCode}
      text={text}
      lang="html"
    >
      {text}
    </CodeBlock>
  );
}
Copy