@redocly/theme/lib/markdoc/components/Mermaid/Mermaid.js

Shared UI components lib

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Mermaid = Mermaid;
const react_1 = __importDefault(require("react"));
const styled_components_1 = __importDefault(require("styled-components"));
const utils_1 = require("../../../core/utils");
function Mermaid({ diagramHtml, 'data-source': dataSource, 'data-hash': dataHash, className, }) {
    return (react_1.default.createElement(Wrapper, { className: (0, utils_1.concatClassNames)('mermaid-wrapper', className), dangerouslySetInnerHTML: { __html: diagramHtml }, "data-component-name": "Markdoc/Mermaid/Mermaid", "data-source": dataSource, "data-hash": dataHash }));
}
const Wrapper = styled_components_1.default.div `
  background-color: var(--mermaid-bg-color);
  border-radius: var(--mermaid-border-radius);

  * {
    font-family: var(--mermaid-font-family) !important;
  }

  .mermaid > svg {
    font-size: var(--font-size-base) !important;
    max-width: 100%;
  }
`;
//# sourceMappingURL=Mermaid.js.map