@lobehub/ui
Version:
Lobe UI is an open-source UI component library for building AIGC web apps
34 lines (33 loc) • 999 B
JavaScript
"use client";
import { renderMermaid, useCdnMermaidFallback } from "./useMermaid.mjs";
import { useEffect, useId, useMemo, useState } from "react";
//#region src/hooks/useStreamMermaid.ts
const EMPTY = { svg: "" };
const useStreamMermaid = (content, { enabled = true, theme: customTheme }) => {
const reactId = useId();
const scopeId = useMemo(() => `mermaid-${reactId.replaceAll(":", "")}`, [reactId]);
const [primary, setPrimary] = useState(EMPTY);
useEffect(() => {
if (!enabled || !content) {
setPrimary(EMPTY);
return;
}
const timer = setTimeout(() => {
setPrimary(renderMermaid(content, scopeId, customTheme));
}, 300);
return () => clearTimeout(timer);
}, [
enabled,
content,
scopeId,
customTheme
]);
const fallback = useCdnMermaidFallback(content, {
enabled: enabled && Boolean(primary.error),
theme: customTheme
});
return primary.error ? fallback : primary;
};
//#endregion
export { useStreamMermaid };
//# sourceMappingURL=useStreamMermaid.mjs.map