@ant-design/agentic-ui 2.1.0 → 2.2.0

package/dist/Plugins/chart/FunnelChart/index.js

@@ -53,7 +53,7 @@ import {
 import { defaultColorList } from "../const";
 import { findDataPointByXValue, isXValueEqual, toNumber } from "../utils";
 import { useStyle } from "./style";
-ChartJS.register(CategoryScale, LinearScale, BarElement, Tooltip, Legend);
+var funnelChartComponentsRegistered = false;
 var FunnelChart = (_a) => {
   var _b = _a, {
     title,
@@ -70,6 +70,7 @@ var FunnelChart = (_a) => {
     showPercent = true,
     toolbarExtra,
     renderFilterInToolbar = false,
+    bottomLayerMinWidth = 0,
     typeNames,
     statistic: statisticConfig
   } = _b, props = __objRest(_b, [
@@ -87,9 +88,21 @@ var FunnelChart = (_a) => {
     "showPercent",
     "toolbarExtra",
     "renderFilterInToolbar",
+    "bottomLayerMinWidth",
     "typeNames",
     "statistic"
   ]);
+  useMemo(() => {
+    if (funnelChartComponentsRegistered) {
+      return void 0;
+    }
+    if (typeof window === "undefined") {
+      return void 0;
+    }
+    ChartJS.register(CategoryScale, LinearScale, BarElement, Tooltip, Legend);
+    funnelChartComponentsRegistered = true;
+    return void 0;
+  }, []);
   const safeData = Array.isArray(data) ? data : [];
   const statistics = useMemo(() => {
     if (!statisticConfig)
@@ -100,7 +113,6 @@ var FunnelChart = (_a) => {
     typeof window !== "undefined" ? window.innerWidth : 768
   );
   const isMobile = windowWidth <= 768;
-  const responsiveWidth = isMobile ? "100%" : width;
   useEffect(() => {
     const handleResize = () => setWindowWidth(window.innerWidth);
     if (typeof window !== "undefined") {
@@ -170,6 +182,12 @@ var FunnelChart = (_a) => {
     }
     return chartHeight;
   }, [height, chartHeight]);
+  const originalValues = useMemo(() => {
+    return stages.map((x) => {
+      const dp = findDataPointByXValue(filteredData, x);
+      return toNumber(dp == null ? void 0 : dp.y, 0);
+    });
+  }, [filteredData, stages]);
   const processedData = useMemo(() => {
     const baseColor = color || defaultColorList[0];
     const labels = stages.map((x) => x.toString());
@@ -179,7 +197,25 @@ var FunnelChart = (_a) => {
       return n;
     });
     const typeName = (typeNames == null ? void 0 : typeNames.name) || "转化";
-    const datasetData = values.map(
+    const adjustedValues = (() => {
+      if (bottomLayerMinWidth <= 0 || bottomLayerMinWidth > 1 || values.length === 0) {
+        return values;
+      }
+      const maxValue = Math.max(...values);
+      const minValue = Math.min(...values);
+      if (minValue >= maxValue * bottomLayerMinWidth) {
+        return values;
+      }
+      const minWidth = bottomLayerMinWidth * maxValue;
+      const range = maxValue - minValue;
+      return values.map((v) => {
+        if (range === 0)
+          return maxValue;
+        const normalized = (v - minValue) / range;
+        return minWidth + normalized * (maxValue - minWidth);
+      });
+    })();
+    const datasetData = adjustedValues.map(
       (v) => [-v / 2, v / 2]
     );
     const hexToRgb = (hex) => {
@@ -223,7 +259,7 @@ var FunnelChart = (_a) => {
         }
       ]
     };
-  }, [filteredData, stages]);
+  }, [filteredData, stages, bottomLayerMinWidth, color, typeNames]);
   const ratioDisplay = useMemo(() => {
     const formatRaw = (v) => {
       if (v === null || v === void 0)
@@ -379,15 +415,14 @@ var FunnelChart = (_a) => {
             return (it == null ? void 0 : it.label) ? String(it.label) : "";
           },
           label: (ctx) => {
-            var _a2, _b2, _c;
-            const raw = ctx.raw;
-            const width2 = Array.isArray(raw) ? Math.abs(((_a2 = raw[1]) != null ? _a2 : 0) - ((_b2 = raw[0]) != null ? _b2 : 0)) : typeof raw === "number" ? Math.abs(raw) : 0;
-            const idx = (_c = ctx.dataIndex) != null ? _c : 0;
+            var _a2, _b2;
+            const idx = (_a2 = ctx.dataIndex) != null ? _a2 : 0;
+            const originalValue = (_b2 = originalValues == null ? void 0 : originalValues[idx]) != null ? _b2 : 0;
             const percentStr = ratioDisplay == null ? void 0 : ratioDisplay[idx];
             if (showPercent === false || !percentStr) {
-              return `${width2}`;
+              return `${originalValue}`;
             }
-            return `${width2}（${percentStr}）`;
+            return `${originalValue}（${percentStr}）`;
           }
         }
       }
@@ -517,7 +552,7 @@ var FunnelChart = (_a) => {
         const maxEnd = Math.max(...ends);
         const padding = 12;
         meta.data.forEach((el, i) => {
-          var _a3, _b3, _c;
+          var _a3, _b3, _c, _d;
           const raw = ds == null ? void 0 : ds[i];
           if (!raw || !Array.isArray(raw))
             return;
@@ -527,30 +562,46 @@ var FunnelChart = (_a) => {
           const start = Number((_b3 = raw[0]) != null ? _b3 : 0);
           const end = Number((_c = raw[1]) != null ? _c : 0);
           const mid = (start + end) / 2;
-          const value = Math.abs(end - start);
+          const originalValue = (_d = originalValues == null ? void 0 : originalValues[i]) != null ? _d : 0;
           const cx = (xScale == null ? void 0 : xScale.getPixelForValue) ? xScale.getPixelForValue(mid) : el.x;
           ctx.save();
           ctx.fillStyle = "#fff";
           ctx.textAlign = "center";
-          ctx.fillText(String(Math.round(value)), cx, y);
+          ctx.fillText(String(Math.round(originalValue)), cx, y);
           ctx.restore();
         });
         ctx.restore();
       }
     };
-  }, [isMobile, axisTextColor]);
+  }, [isMobile, axisTextColor, originalValues]);
+  const containerClassName = useMemo(() => {
+    if (isMobile)
+      return "w-full";
+    if (typeof width === "number")
+      return "";
+    if (typeof width === "string" && width === "100%")
+      return "w-full";
+    return "";
+  }, [isMobile, width]);
+  const containerStyle = useMemo(() => {
+    if (isMobile)
+      return void 0;
+    if (typeof width === "number")
+      return { width };
+    if (typeof width === "string" && width !== "100%")
+      return { width };
+    return void 0;
+  }, [isMobile, width]);
   return wrapSSR(
     /* @__PURE__ */ React.createElement(
       ChartContainer,
       {
         baseClassName,
-        className,
+        className: `${className || ""} ${containerClassName}`.trim(),
         theme,
         isMobile,
         variant: props.variant,
-        style: {
-          width: responsiveWidth
-        }
+        style: containerStyle
       },
       /* @__PURE__ */ React.createElement(
         ChartToolBar,

package/dist/Plugins/chart/LineChart/index.js

@@ -58,15 +58,7 @@ import {
   findDataPointByXValue
 } from "../utils";
 import { useStyle } from "./style";
-ChartJS.register(
-  CategoryScale,
-  LinearScale,
-  PointElement,
-  LineElement,
-  Filler,
-  Tooltip,
-  Legend
-);
+var lineChartComponentsRegistered = false;
 var LineChart = (_a) => {
   var _b = _a, {
     title,
@@ -109,6 +101,25 @@ var LineChart = (_a) => {
     "renderFilterInToolbar",
     "statistic"
   ]);
+  useMemo(() => {
+    if (lineChartComponentsRegistered) {
+      return void 0;
+    }
+    if (typeof window === "undefined") {
+      return void 0;
+    }
+    ChartJS.register(
+      CategoryScale,
+      LinearScale,
+      PointElement,
+      LineElement,
+      Filler,
+      Tooltip,
+      Legend
+    );
+    lineChartComponentsRegistered = true;
+    return void 0;
+  }, []);
   const safeData = Array.isArray(data) ? data : [];
   const [windowWidth, setWindowWidth] = useState(
     typeof window !== "undefined" ? window.innerWidth : 768

package/dist/Plugins/chart/RadarChart/index.js

@@ -53,14 +53,7 @@ import {
 } from "../components";
 import { defaultColorList } from "../const";
 import { useStyle } from "./style";
-ChartJS.register(
-  RadialLinearScale,
-  PointElement,
-  LineElement,
-  Filler,
-  Tooltip,
-  Legend
-);
+var radarChartComponentsRegistered = false;
 var RadarChart = (_a) => {
   var _b = _a, {
     data,
@@ -87,6 +80,24 @@ var RadarChart = (_a) => {
     "statistic",
     "textMaxWidth"
   ]);
+  useMemo(() => {
+    if (radarChartComponentsRegistered) {
+      return void 0;
+    }
+    if (typeof window === "undefined") {
+      return void 0;
+    }
+    ChartJS.register(
+      RadialLinearScale,
+      PointElement,
+      LineElement,
+      Filler,
+      Tooltip,
+      Legend
+    );
+    radarChartComponentsRegistered = true;
+    return void 0;
+  }, []);
   const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
   const prefixCls = getPrefixCls("radar-chart");
   const { wrapSSR, hashId } = useStyle(prefixCls);

package/dist/Plugins/chart/ScatterChart/index.js

@@ -52,7 +52,7 @@ import {
 } from "../components";
 import { defaultColorList } from "../const";
 import { useStyle } from "./style";
-ChartJS.register(LinearScale, PointElement, LineElement, Tooltip, Legend);
+var scatterChartComponentsRegistered = false;
 var ScatterChart = (_a) => {
   var _b = _a, {
     data,
@@ -97,6 +97,17 @@ var ScatterChart = (_a) => {
     "statistic",
     "textMaxWidth"
   ]);
+  useMemo(() => {
+    if (scatterChartComponentsRegistered) {
+      return void 0;
+    }
+    if (typeof window === "undefined") {
+      return void 0;
+    }
+    ChartJS.register(LinearScale, PointElement, LineElement, Tooltip, Legend);
+    scatterChartComponentsRegistered = true;
+    return void 0;
+  }, []);
   const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
   const prefixCls = getPrefixCls("scatter-chart");
   const { wrapSSR, hashId } = useStyle(prefixCls);

package/dist/Plugins/chart/loadChartRuntime.d.ts

@@ -0,0 +1,18 @@
+type AreaChartComponent = typeof import('./AreaChart').default;
+type BarChartComponent = typeof import('./BarChart').default;
+type DonutChartComponent = typeof import('./DonutChart').default;
+type FunnelChartComponent = typeof import('./FunnelChart').default;
+type LineChartComponent = typeof import('./LineChart').default;
+type RadarChartComponent = typeof import('./RadarChart').default;
+type ScatterChartComponent = typeof import('./ScatterChart').default;
+export interface ChartRuntime {
+    AreaChart: AreaChartComponent;
+    BarChart: BarChartComponent;
+    DonutChart: DonutChartComponent;
+    FunnelChart: FunnelChartComponent;
+    LineChart: LineChartComponent;
+    RadarChart: RadarChartComponent;
+    ScatterChart: ScatterChartComponent;
+}
+export declare const loadChartRuntime: () => Promise<ChartRuntime>;
+export {};

package/dist/Plugins/chart/loadChartRuntime.js

@@ -0,0 +1,91 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw new Error('Dynamic require of "' + x + '" is not supported');
+});
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// src/Plugins/chart/loadChartRuntime.ts
+var runtimeLoader = null;
+var loadChartRuntime = () => __async(void 0, null, function* () {
+  if (typeof window === "undefined") {
+    throw new Error("图表运行时仅在浏览器环境中可用");
+  }
+  if (!runtimeLoader) {
+    runtimeLoader = Promise.all([
+      Promise.resolve().then(() => __toESM(__require("./AreaChart"))),
+      Promise.resolve().then(() => __toESM(__require("./BarChart"))),
+      Promise.resolve().then(() => __toESM(__require("./DonutChart"))),
+      Promise.resolve().then(() => __toESM(__require("./FunnelChart"))),
+      Promise.resolve().then(() => __toESM(__require("./LineChart"))),
+      Promise.resolve().then(() => __toESM(__require("./RadarChart"))),
+      Promise.resolve().then(() => __toESM(__require("./ScatterChart")))
+    ]).then(([
+      areaModule,
+      barModule,
+      donutModule,
+      funnelModule,
+      lineModule,
+      radarModule,
+      scatterModule
+    ]) => ({
+      AreaChart: areaModule.default,
+      BarChart: barModule.default,
+      DonutChart: donutModule.default,
+      FunnelChart: funnelModule.default,
+      LineChart: lineModule.default,
+      RadarChart: radarModule.default,
+      ScatterChart: scatterModule.default
+    })).catch((error) => {
+      runtimeLoader = null;
+      throw error;
+    });
+  }
+  return runtimeLoader;
+});
+export {
+  loadChartRuntime
+};

package/dist/Plugins/defaultPlugins.d.ts

@@ -6,6 +6,9 @@ export declare const standardPlugins: {
         code: typeof CodeElement;
         chart: (props: import("slate-react").RenderElementProps) => import("react").JSX.Element;
         katex: typeof KatexElement;
+        mermaid: (props: {
+            element: import("..").CodeNode;
+        }) => import("react").JSX.Element | null;
         'inline-katex': ({ children, element, attributes, style, }: import("..").ElementProps<import("..").InlineKatexNode> & {
             style?: import("react").CSSProperties | undefined;
         }) => import("react").JSX.Element;

package/dist/Plugins/defaultPlugins.js

@@ -2,12 +2,14 @@
 import { ChartElement } from "./chart";
 import { CodeElement } from "./code";
 import { InlineKatex, KatexElement } from "./katex";
+import { Mermaid } from "./mermaid/Mermaid";
 var standardPlugins = [
   {
     elements: {
       code: CodeElement,
       chart: ChartElement,
       katex: KatexElement,
+      mermaid: Mermaid,
       "inline-katex": InlineKatex
     }
   }

package/dist/Plugins/mermaid/Mermaid.d.ts

@@ -1,5 +1,7 @@
 import React from 'react';
 import { CodeNode } from '../../MarkdownEditor/el';
+type MermaidApi = typeof import('mermaid').default;
+export declare const loadMermaid: () => Promise<MermaidApi>;
 /**
  * Mermaid 组件 - Mermaid图表渲染组件
  *
@@ -36,5 +38,6 @@ import { CodeNode } from '../../MarkdownEditor/el';
  * - 自动生成唯一ID
  */
 export declare const Mermaid: (props: {
-    el: CodeNode;
-}) => React.JSX.Element;
+    element: CodeNode;
+}) => React.JSX.Element | null;
+export {};

package/dist/Plugins/mermaid/Mermaid.js

@@ -1,3 +1,32 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw new Error('Dynamic require of "' + x + '" is not supported');
+});
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
     var fulfilled = (value) => {
@@ -20,61 +49,124 @@ var __async = (__this, __arguments, generator) => {
 };
 
 // src/Plugins/mermaid/Mermaid.tsx
-import mermaid from "mermaid";
-import React, { useCallback, useEffect, useMemo, useRef } from "react";
+import React, { useEffect, useMemo, useRef } from "react";
 import { useGetSetState } from "react-use";
+import { useIntersectionOnce } from "../../Hooks/useIntersectionOnce";
+var mermaidLoader = null;
+var loadMermaid = () => __async(void 0, null, function* () {
+  if (typeof window === "undefined") {
+    throw new Error("Mermaid 仅在浏览器环境中可用");
+  }
+  if (!mermaidLoader) {
+    mermaidLoader = Promise.resolve().then(() => __toESM(__require("mermaid"))).then((module) => {
+      const api = module.default;
+      if (api == null ? void 0 : api.initialize) {
+        api.initialize({ startOnLoad: false });
+      }
+      return api;
+    }).catch((error) => {
+      mermaidLoader = null;
+      throw error;
+    });
+  }
+  return mermaidLoader;
+});
 var Mermaid = (props) => {
+  var _a;
+  const isBrowser = typeof window !== "undefined";
   const [state, setState] = useGetSetState({
     code: "",
     error: ""
   });
+  const containerRef = useRef(null);
   const divRef = useRef(null);
-  const timer = useRef(0);
+  const timer = useRef(null);
+  const mermaidRef = useRef(null);
   const id = useMemo(
     () => "m" + (Date.now() + Math.ceil(Math.random() * 1e3)),
     []
   );
-  const render = useCallback(() => __async(void 0, null, function* () {
-    mermaid.render(id, state().code).then((res) => {
-      setState({ error: "" });
-      divRef.current.innerHTML = res.svg;
-    }).catch(() => {
-      mermaid.parse(state().code).catch((e) => {
-        setState({ error: e.toString(), code: "" });
-      });
-    }).finally(() => {
-      var _a;
-      (_a = document.querySelector("#d" + id)) == null ? void 0 : _a.classList.add("hidden");
-    });
-  }), []);
+  const isVisible = useIntersectionOnce(containerRef);
   useEffect(() => {
-    const code = props.el.value || "";
-    if (state().code !== code) {
-      clearTimeout(timer.current);
-      timer.current = window.setTimeout(
-        () => {
-          setState({ code });
-          if (state().code) {
-            render();
-          } else {
-            setState({ error: "" });
-          }
-        },
-        !state().code ? 0 : 300
-      );
+    if (!isBrowser) {
+      return void 0;
+    }
+    console.log("props---", props);
+    const nextCode = props.element.value || "";
+    const currentState = state();
+    if (!isVisible) {
+      return void 0;
+    }
+    if (currentState.code === nextCode && currentState.error === "") {
+      return void 0;
+    }
+    if (timer.current !== null) {
+      window.clearTimeout(timer.current);
+      timer.current = null;
+    }
+    if (!nextCode) {
+      timer.current = window.setTimeout(() => {
+        setState({ code: "", error: "" });
+        if (divRef.current) {
+          divRef.current.innerHTML = "";
+        }
+        timer.current = null;
+      }, 0);
+      return () => {
+        if (timer.current !== null) {
+          window.clearTimeout(timer.current);
+          timer.current = null;
+        }
+      };
     }
-    return () => window.clearTimeout(timer.current);
-  }, [props.el]);
+    const delay = currentState.code ? 300 : 0;
+    timer.current = window.setTimeout(() => __async(void 0, null, function* () {
+      var _a2, _b;
+      try {
+        const api = (_a2 = mermaidRef.current) != null ? _a2 : yield loadMermaid();
+        mermaidRef.current = api;
+        const { svg } = yield api.render(id, nextCode);
+        if (divRef.current) {
+          divRef.current.innerHTML = svg;
+        }
+        setState({ code: nextCode, error: "" });
+      } catch (error) {
+        const api = mermaidRef.current;
+        if (api) {
+          try {
+            yield api.parse(nextCode);
+          } catch (parseError) {
+            setState({ error: String(parseError), code: "" });
+            return;
+          }
+        }
+        setState({ error: String(error), code: "" });
+      } finally {
+        (_b = document.querySelector("#d" + id)) == null ? void 0 : _b.classList.add("hidden");
+      }
+      timer.current = null;
+    }), delay);
+    return () => {
+      if (timer.current !== null) {
+        window.clearTimeout(timer.current);
+        timer.current = null;
+      }
+    };
+  }, [isBrowser, (_a = props == null ? void 0 : props.element) == null ? void 0 : _a.value, id, isVisible, setState, state]);
+  if (!isBrowser) {
+    return null;
+  }
+  const snapshot = state();
   return /* @__PURE__ */ React.createElement(
     "div",
     {
+      ref: containerRef,
       style: {
         marginBottom: "0.75em",
         cursor: "default",
         userSelect: "none",
         padding: "0.75rem 0",
-        backgroundColor: "rgba(15, 17, 20, 0.05)",
-        borderRadius: "0.25em",
+        borderRadius: "1em",
         display: "flex",
         justifyContent: "center"
       },
@@ -89,14 +181,15 @@ var Mermaid = (props) => {
           width: "100%",
           display: "flex",
           justifyContent: "center",
-          visibility: state().code && !state().error ? "visible" : "hidden"
+          visibility: snapshot.code && !snapshot.error ? "visible" : "hidden"
         }
       }
     ),
-    state().error && /* @__PURE__ */ React.createElement("div", { style: { textAlign: "center", color: "rgba(239, 68, 68, 0.8)" } }, state().error),
-    !state().code && !state().error && /* @__PURE__ */ React.createElement("div", { style: { textAlign: "center", color: "#6B7280" } }, "Empty")
+    snapshot.error && /* @__PURE__ */ React.createElement("div", { style: { textAlign: "center", color: "rgba(239, 68, 68, 0.8)" } }, snapshot.error),
+    !snapshot.code && !snapshot.error && /* @__PURE__ */ React.createElement("div", { style: { textAlign: "center", color: "#6B7280" } }, "Empty")
   );
 };
 export {
-  Mermaid
+  Mermaid,
+  loadMermaid
 };

package/dist/Plugins/mermaid/index.js

@@ -157,7 +157,7 @@ function MermaidElement(props) {
       ),
       /* @__PURE__ */ React.createElement("div", { className: "ant-agentic-md-editor-hidden" }, props.children)
     ),
-    /* @__PURE__ */ React.createElement(Mermaid, { el: props.element })
+    /* @__PURE__ */ React.createElement(Mermaid, { element: props.element })
   );
 }
 export {