/useMermaid-hook

react hook for Mermaid

Primary LanguageJavaScript

useMermaid

A React hook for using Mermaid

usage

import React from "react";
import { useMermaid } from "./useMermaid";

const ExampleMermaid = () => {
  const graph = `
  graph TD;
      A-->B;
      A-->C;
      B-->D;
      C-->D;
  `;
  const svg = useMermaid("exampleID", graph);

  if (!svg) return <div>Loading...</div>;

  return <div dangerouslySetInnerHTML={{ __html: svg }} />;
};

class diagram working with my mermaid fix (look PR at mermaid)

Screenshot