markdown-flow-ui 0.1.70-beta.0 → 0.1.70

package/dist/components/ContentRender/ContentRender.d.ts

@@ -3,16 +3,16 @@ import { CustomRenderBarProps, OnSendContentParams } from '../types';
 export interface ContentRenderProps {
     content: string;
     /**
-     * Callback invoked when the custom button after content is clicked.
-     * This button is rendered via the `<custom-button-after-content>` tag in markdown content.
-     * @example
-     * ```tsx
-     * <ContentRender
-     *   content="Hello <custom-button-after-content>Ask</custom-button-after-content>"
-     *   onClickCustomButtonAfterContent={() => console.log('Button clicked')}
-     * />
-     * ```
-     */
+  +   * Callback invoked when the custom button after content is clicked.
+  +   * This button is rendered via the `<custom-button-after-content>` tag in markdown content.
+  +   * @example
+  +   * ```tsx
+  +   * <ContentRender
+  +   *   content="Hello <custom-button-after-content>Ask</custom-button-after-content>"
+  +   *   onClickCustomButtonAfterContent={() => console.log('Button clicked')}
+  +   * />
+  +   * ```
+  +   */
     customRenderBar?: CustomRenderBarProps;
     onClickCustomButtonAfterContent?: () => void;
     onSend?: (content: OnSendContentParams) => void;
@@ -27,13 +27,7 @@ export interface ContentRenderProps {
     copyButtonText?: string;
     copiedButtonText?: string;
     dynamicInteractionFormat?: string;
-    fullscreenButtonText?: string;
     beforeSend?: (param: OnSendContentParams) => boolean;
-    contentHtmlPayload?: string;
-    contentType?: "default" | "blackboard";
-    renderNarrationAsCaption?: boolean;
-    maxVisibleStepNumber?: number;
-    visibleStepNumber?: number;
 }
 declare const ContentRender: React.FC<ContentRenderProps>;
 export default ContentRender;

package/dist/components/ContentRender/ContentRender.js

@@ -1,103 +1,95 @@
 import { j as t } from "../../_virtual/jsx-runtime.js";
-/* empty css                                                                                                                            */
+/* empty css                                                */
 /* empty css                                                                                                               */
-import P, { useRef as b, useEffect as i } from "react";
-import T from "../../_virtual/index.js";
-import G from "./ContentBlackboard.js";
+import S, { useRef as x, useEffect as i } from "react";
+import B from "../../_virtual/index.js";
 /* empty css                  */
 /* empty css                          */
-import H from "./CodeBlock.js";
-import K from "./plugins/CustomVariable.js";
-import j from "./plugins/MermaidChart.js";
-import { ContentHtml as k } from "./ContentHtml.js";
-import $ from "./useTypewriterStateMachine.js";
-import { preserveCustomVariableProperties as q, restoreCustomVariableProperties as D } from "./utils/custom-variable-props.js";
-import { subsetLanguages as F, highlightLanguages as J } from "./utils/highlight-languages.js";
-import { parseMarkdownSegments as O, mermaidBlockIsComplete as Q } from "./utils/mermaid-parse.js";
-import { Markdown as U } from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/react-markdown@10.1.0_@types_react@19.2.2_react@19.0.1/node_modules/react-markdown/lib/index.js";
-import W from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/rehype-raw@7.0.0/node_modules/rehype-raw/lib/index.js";
-import X from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/rehype-highlight@7.0.2/node_modules/rehype-highlight/lib/index.js";
-import Y from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/rehype-katex@7.0.1/node_modules/rehype-katex/lib/index.js";
-import Z from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/remark-gfm@4.0.1/node_modules/remark-gfm/lib/index.js";
-import ee from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/remark-math@6.0.0/node_modules/remark-math/lib/index.js";
-import te from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/remark-breaks@4.0.0/node_modules/remark-breaks/lib/index.js";
-const re = ({ svg: o }) => {
-  const n = b(null);
+import P from "./CodeBlock.js";
+import E from "./plugins/CustomVariable.js";
+import h from "./plugins/MermaidChart.js";
+import T from "./useTypewriterStateMachine.js";
+import { preserveCustomVariableProperties as V, restoreCustomVariableProperties as _ } from "./utils/custom-variable-props.js";
+import { subsetLanguages as z, highlightLanguages as A } from "./utils/highlight-languages.js";
+import { parseMarkdownSegments as H, mermaidBlockIsComplete as G } from "./utils/mermaid-parse.js";
+import { Markdown as K } from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/react-markdown@10.1.0_@types_react@19.2.2_react@19.0.1/node_modules/react-markdown/lib/index.js";
+import $ from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/rehype-raw@7.0.0/node_modules/rehype-raw/lib/index.js";
+import q from "../../node_modules/rehype-highlight/lib/index.js";
+import D from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/rehype-katex@7.0.1/node_modules/rehype-katex/lib/index.js";
+import F from "../../node_modules/remark-gfm/lib/index.js";
+import J from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/remark-math@6.0.0/node_modules/remark-math/lib/index.js";
+import O from "../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/remark-breaks@4.0.0/node_modules/remark-breaks/lib/index.js";
+const Q = ({ svg: s }) => {
+  const n = x(null);
   return i(() => {
-    const s = n.current;
-    if (!s) return;
-    const m = s.shadowRoot ?? s.attachShadow({ mode: "open" });
-    m.innerHTML = o;
-  }, [o]), /* @__PURE__ */ t.jsx("div", { className: "content-render-svg", ref: n });
-}, Ie = ({
-  content: o,
+    const a = n.current;
+    if (!a) return;
+    const m = a.shadowRoot ?? a.attachShadow({ mode: "open" });
+    m.innerHTML = s;
+  }, [s]), /* @__PURE__ */ t.jsx("div", { className: "content-render-svg", ref: n });
+}, ke = ({
+  content: s,
   customRenderBar: n,
-  onSend: s,
+  onSend: a,
   typingSpeed: m = 30,
-  enableTypewriter: g = !1,
-  defaultButtonText: y,
-  defaultInputText: N,
-  defaultSelectedValues: C,
-  readonly: v = !1,
-  onTypeFinished: u,
-  confirmButtonText: w,
-  copyButtonText: R,
-  copiedButtonText: M,
-  fullscreenButtonText: p,
-  onClickCustomButtonAfterContent: I,
-  beforeSend: L,
-  contentHtmlPayload: l,
-  contentType: S = "default",
-  renderNarrationAsCaption: B = !1,
-  maxVisibleStepNumber: E,
-  visibleStepNumber: V
+  enableTypewriter: j = !1,
+  defaultButtonText: k,
+  defaultInputText: b,
+  defaultSelectedValues: g,
+  readonly: N = !1,
+  onTypeFinished: l,
+  confirmButtonText: y,
+  copyButtonText: C,
+  copiedButtonText: v,
+  onClickCustomButtonAfterContent: w,
+  beforeSend: R
   // tooltipMinLength,
 }) => {
-  const { displayContent: f, isComplete: d } = $({
+  const { displayContent: u, isComplete: p } = T({
     // processMarkdownText will let code block printf("You win!\n") become printf("You win!<br/>");
     // content: processMarkdownText(content),
-    content: o,
+    content: s,
     typingSpeed: m,
-    disabled: !g
-  }), _ = {
+    disabled: !j
+  }), M = {
     "custom-button-after-content": ({
       children: e
     }) => /* @__PURE__ */ t.jsx(
       "button",
       {
         className: "content-render-custom-button-after-content",
-        onClick: I,
+        onClick: w,
         children: e
       }
     ),
     "custom-variable": (e) => /* @__PURE__ */ t.jsx(
-      K,
+      E,
       {
         ...e,
-        readonly: v,
-        defaultButtonText: y,
-        defaultInputText: N,
-        defaultSelectedValues: C,
-        onSend: s,
-        beforeSend: L,
-        confirmButtonText: w
+        readonly: N,
+        defaultButtonText: k,
+        defaultInputText: b,
+        defaultSelectedValues: g,
+        onSend: a,
+        beforeSend: R,
+        confirmButtonText: y
       }
     ),
     code: (e) => {
-      const { className: r, children: a, ...h } = e;
+      const { className: r, children: o, ...d } = e;
       if (/language-(\w+)/.exec(r || "")?.[1] === "mermaid") {
-        const x = a?.toString().replace(/\n$/, "") || "", A = Q(o, x);
-        return /* @__PURE__ */ t.jsx(j, { chart: x, frozen: A });
+        const f = o?.toString().replace(/\n$/, "") || "", L = G(s, f);
+        return /* @__PURE__ */ t.jsx(h, { chart: f, frozen: L });
       }
-      return /* @__PURE__ */ t.jsx("code", { className: r, ...h, children: a });
+      return /* @__PURE__ */ t.jsx("code", { className: r, ...d, children: o });
     },
     table: ({ ...e }) => /* @__PURE__ */ t.jsx("div", { className: "content-render-table-container", children: /* @__PURE__ */ t.jsx("table", { className: "content-render-table", ...e }) }),
     th: ({ ...e }) => /* @__PURE__ */ t.jsx("th", { className: "content-render-th", ...e }),
     td: ({ ...e }) => /* @__PURE__ */ t.jsx("td", { className: "content-render-td", ...e }),
     tr: ({ ...e }) => /* @__PURE__ */ t.jsx("tr", { className: "content-render-tr", ...e }),
     li: ({ node: e, ...r }) => {
-      const a = e?.properties?.className;
-      return typeof a == "string" && a.includes("task-list-item") || Array.isArray(a) && a.includes("task-list-item") ? /* @__PURE__ */ t.jsx("li", { className: "content-render-task-list-item", ...r }) : /* @__PURE__ */ t.jsx("li", { ...r });
+      const o = e?.properties?.className;
+      return typeof o == "string" && o.includes("task-list-item") || Array.isArray(o) && o.includes("task-list-item") ? /* @__PURE__ */ t.jsx("li", { className: "content-render-task-list-item", ...r }) : /* @__PURE__ */ t.jsx("li", { ...r });
     },
     ol: ({ ...e }) => /* @__PURE__ */ t.jsx("ol", { className: "content-render-ol", ...e }),
     ul: ({ ...e }) => /* @__PURE__ */ t.jsx("ul", { className: "content-render-ul", ...e }),
@@ -112,77 +104,62 @@ const re = ({ svg: o }) => {
     ) : /* @__PURE__ */ t.jsx("input", { ...e }),
     a: ({ children: e, ...r }) => /* @__PURE__ */ t.jsx("a", { target: "_blank", rel: "noopener noreferrer", ...r, children: e }),
     pre: (e) => /* @__PURE__ */ t.jsx(
-      H,
+      P,
       {
         ...e,
-        copyButtonText: R,
-        copiedButtonText: M
+        copyButtonText: C,
+        copiedButtonText: v
       }
     )
-  }, c = b(!1);
+  }, c = x(!1);
   i(() => {
-    d && !c.current && (c.current = !0, u?.());
-  }, [d, u]), i(() => {
+    p && !c.current && (c.current = !0, l?.());
+  }, [p, l]), i(() => {
     c.current = !1;
-  }, [o]);
-  const z = O(f);
+  }, [s]);
+  const I = H(u);
   return /* @__PURE__ */ t.jsxs("div", { className: "content-render markdown-body", children: [
-    z.map((e, r) => e.type === "text" ? /* @__PURE__ */ t.jsx(
-      U,
-      {
-        remarkPlugins: [Z, ee, T, te],
-        rehypePlugins: [
-          q,
-          W,
-          D,
-          [
-            X,
-            { languages: J, subset: F }
-          ],
-          Y
-        ],
-        components: _,
-        children: e.value
-      },
-      r
-    ) : e.type === "mermaid" ? /* @__PURE__ */ t.jsx(
-      j,
-      {
-        chart: e.value,
-        frozen: !e.complete
-      },
-      r
-    ) : e.type === "svg" ? /* @__PURE__ */ t.jsx(re, { svg: e.value }, r) : e.type === "html" ? /* @__PURE__ */ t.jsx(
-      k,
-      {
-        html: e.value,
-        fullscreenButtonText: p
-      },
-      r
-    ) : null),
-    l && (S === "blackboard" ? /* @__PURE__ */ t.jsx(
-      G,
-      {
-        payload: l,
-        renderNarrationAsCaption: B,
-        maxVisibleStepNumber: E,
-        visibleStepNumber: V
-      }
-    ) : /* @__PURE__ */ t.jsx(
-      k,
-      {
-        payload: l,
-        fullscreenButtonText: p
-      }
-    )),
-    n && P.createElement(n, {
-      content: o,
-      displayContent: f,
-      onSend: s
+    I.map((e, r) => {
+      if (e.type === "text")
+        return /* @__PURE__ */ t.jsx(
+          K,
+          {
+            remarkPlugins: [F, J, B, O],
+            rehypePlugins: [
+              V,
+              $,
+              _,
+              [
+                q,
+                { languages: A, subset: z }
+              ],
+              D
+            ],
+            components: M,
+            children: e.value
+          },
+          r
+        );
+      if (e.type === "mermaid")
+        return /* @__PURE__ */ t.jsx(
+          h,
+          {
+            chart: e.value,
+            frozen: !e.complete
+          },
+          r
+        );
+      if (e.type === "svg")
+        return /* @__PURE__ */ t.jsx(Q, { svg: e.value }, r);
+    }),
+    n && S.createElement(n, {
+      content: s,
+      displayContent: u,
+      onSend: a
     })
   ] });
 };
 export {
-  Ie as default
+  ke as default
 };
 //# sourceMappingURL=ContentRender.js.map

package/dist/components/ContentRender/ContentRender.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContentRender.js","sources":["../../../src/components/ContentRender/ContentRender.tsx"],"sourcesContent":["import \"highlight.js/styles/github.css\";\nimport \"katex/dist/katex.min.css\";\nimport React, { useEffect, useRef } from \"react\";\nimport ReactMarkdown from \"react-markdown\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeRaw from \"rehype-raw\";\nimport remarkBreaks from \"remark-breaks\";\nimport remarkFlow from \"remark-flow\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport { CustomRenderBarProps, OnSendContentParams } from \"../types\";\nimport ContentBlackboard from \"./ContentBlackboard\";\nimport \"./contentRender.css\";\nimport \"./github-markdown-light.css\";\nimport CodeBlock from \"./CodeBlock\";\nimport CustomButtonInputVariable, {\n  ComponentsWithCustomVariable,\n} from \"./plugins/CustomVariable\";\nimport MermaidChart from \"./plugins/MermaidChart\";\nimport ContentHtml from \"./ContentHtml\";\nimport useTypewriterStateMachine from \"./useTypewriterStateMachine\";\nimport {\n  preserveCustomVariableProperties,\n  restoreCustomVariableProperties,\n} from \"./utils/custom-variable-props\";\nimport {\n  highlightLanguages,\n  subsetLanguages,\n} from \"./utils/highlight-languages\";\n// import { processMarkdownText } from \"./utils/process-markdown\";\nimport {\n  parseMarkdownSegments,\n  mermaidBlockIsComplete,\n} from \"./utils/mermaid-parse\";\n// Define component Props type\nexport interface ContentRenderProps {\n  content: string;\n  /**\n   * Callback invoked when the custom button after content is clicked.\n   * This button is rendered via the `<custom-button-after-content>` tag in markdown content.\n   * @example\n   * ```tsx\n   * <ContentRender\n   *   content=\"Hello <custom-button-after-content>Ask</custom-button-after-content>\"\n   *   onClickCustomButtonAfterContent={() => console.log('Button clicked')}\n   * />\n   * ```\n   */\n  customRenderBar?: CustomRenderBarProps;\n  onClickCustomButtonAfterContent?: () => void;\n  onSend?: (content: OnSendContentParams) => void;\n  typingSpeed?: number;\n  enableTypewriter?: boolean;\n  defaultButtonText?: string;\n  defaultInputText?: string; // Text input by user\n  defaultSelectedValues?: string[]; // Default selected values for multi-select\n  readonly?: boolean;\n  onTypeFinished?: () => void;\n  // Multi-select confirm button text (i18n support)\n  confirmButtonText?: string;\n  // Copy button text (i18n support)\n  copyButtonText?: string;\n  // Copied state text (i18n support)\n  copiedButtonText?: string;\n  // Dynamic interaction format for multi-select support\n  dynamicInteractionFormat?: string;\n  // Fullscreen button text for iframe rendering\n  fullscreenButtonText?: string;\n  beforeSend?: (param: OnSendContentParams) => boolean;\n  // Raw payload for content_html stream messages\n  contentHtmlPayload?: string;\n  // Content render type, blackboard will use ContentBlackboard for streaming chunks\n  contentType?: \"default\" | \"blackboard\";\n  // Render narration as caption overlay for blackboard streaming mode\n  renderNarrationAsCaption?: boolean;\n  // Maximum visible step number when using blackboard streaming mode (manual stepping)\n  maxVisibleStepNumber?: number;\n  // Visible step number for single-step display (non-accumulated)\n  visibleStepNumber?: number;\n  // tooltipMinLength?: number; // Control minimum character length for tooltip display, default 10\n}\n\n// Render svg string via Shadow DOM to avoid markdown wrapping\nconst SvgBlockInShadow: React.FC<{ svg: string }> = ({ svg }) => {\n  const hostRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const host = hostRef.current;\n    if (!host) return;\n    const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: \"open\" });\n    shadowRoot.innerHTML = svg;\n  }, [svg]);\n\n  return <div className=\"content-render-svg\" ref={hostRef} />;\n};\n\n// Extended component interface\ntype CustomComponents = ComponentsWithCustomVariable & {\n  \"custom-button-after-content\"?: React.ComponentType<{\n    children: React.ReactNode;\n  }>;\n};\n\nconst ContentRender: React.FC<ContentRenderProps> = ({\n  content,\n  customRenderBar,\n  onSend,\n  typingSpeed = 30,\n  enableTypewriter = false,\n  defaultButtonText,\n  defaultInputText,\n  defaultSelectedValues,\n  readonly = false,\n  onTypeFinished,\n  confirmButtonText,\n  copyButtonText,\n  copiedButtonText,\n  fullscreenButtonText,\n  onClickCustomButtonAfterContent,\n  beforeSend,\n  contentHtmlPayload,\n  contentType = \"default\",\n  renderNarrationAsCaption = false,\n  maxVisibleStepNumber,\n  visibleStepNumber,\n  // tooltipMinLength,\n}) => {\n  // Use custom Hook to handle typewriter effect\n  const { displayContent, isComplete } = useTypewriterStateMachine({\n    // processMarkdownText will let code block printf(\"You win!\\n\") become printf(\"You win!<br/>\");\n    // content: processMarkdownText(content),\n    content: content,\n    typingSpeed,\n    disabled: !enableTypewriter,\n  });\n  const components: CustomComponents = {\n    \"custom-button-after-content\": ({\n      children,\n    }: {\n      children: React.ReactNode;\n    }) => {\n      return (\n        <button\n          className=\"content-render-custom-button-after-content\"\n          onClick={onClickCustomButtonAfterContent}\n        >\n          {children}\n        </button>\n      );\n    },\n    \"custom-variable\": (props) => (\n      <CustomButtonInputVariable\n        {...props}\n        readonly={readonly}\n        defaultButtonText={defaultButtonText}\n        defaultInputText={defaultInputText}\n        defaultSelectedValues={defaultSelectedValues}\n        onSend={onSend}\n        beforeSend={beforeSend}\n        confirmButtonText={confirmButtonText}\n        // tooltipMinLength={tooltipMinLength}\n      />\n    ),\n    code: (props) => {\n      const { className, children, ...rest } = props as {\n        className?: string;\n        children?: React.ReactNode;\n      };\n      const match = /language-(\\w+)/.exec(className || \"\");\n      const language = match?.[1];\n      if (language === \"mermaid\") {\n        const chartContent = children?.toString().replace(/\\n$/, \"\") || \"\";\n        const frozen = mermaidBlockIsComplete(content, chartContent);\n        return <MermaidChart chart={chartContent} frozen={frozen} />;\n      }\n\n      return (\n        <code className={className} {...rest}>\n          {children}\n        </code>\n      );\n    },\n    table: ({ ...props }) => (\n      <div className=\"content-render-table-container\">\n        <table className=\"content-render-table\" {...props} />\n      </div>\n    ),\n    th: ({ ...props }) => <th className=\"content-render-th\" {...props} />,\n    td: ({ ...props }) => <td className=\"content-render-td\" {...props} />,\n    tr: ({ ...props }) => <tr className=\"content-render-tr\" {...props} />,\n    li: ({ node, ...props }) => {\n      const className = node?.properties?.className;\n      const hasTaskListItem =\n        (typeof className === \"string\" &&\n          className.includes(\"task-list-item\")) ||\n        (Array.isArray(className) && className.includes(\"task-list-item\"));\n      if (hasTaskListItem) {\n        return <li className=\"content-render-task-list-item\" {...props} />;\n      }\n      return <li {...props} />;\n    },\n    ol: ({ ...props }) => <ol className=\"content-render-ol\" {...props} />,\n    ul: ({ ...props }) => <ul className=\"content-render-ul\" {...props} />,\n    input: ({ ...props }) => {\n      if (props.type === \"checkbox\") {\n        return (\n          <input\n            type=\"checkbox\"\n            className=\"content-render-checkbox\"\n            disabled\n            {...props}\n          />\n        );\n      }\n      return <input {...props} />;\n    },\n    a: ({ children, ...props }) => (\n      <a target=\"_blank\" rel=\"noopener noreferrer\" {...props}>\n        {children}\n      </a>\n    ),\n    pre: (props) => (\n      <CodeBlock\n        {...props}\n        copyButtonText={copyButtonText}\n        copiedButtonText={copiedButtonText}\n      />\n    ),\n  };\n\n  const hasCompleted = useRef(false);\n\n  useEffect(() => {\n    if (isComplete && !hasCompleted.current) {\n      hasCompleted.current = true; // Mark as completed\n      onTypeFinished?.(); // Call the passed callback\n    }\n  }, [isComplete, onTypeFinished]);\n  useEffect(() => {\n    hasCompleted.current = false; // Reset completion status when content changes\n  }, [content]);\n\n  const segments = parseMarkdownSegments(displayContent);\n\n  return (\n    <div className={`content-render markdown-body`}>\n      {segments.map((seg, index) => {\n        if (seg.type === \"text\") {\n          return (\n            <ReactMarkdown\n              key={index}\n              remarkPlugins={[remarkGfm, remarkMath, remarkFlow, remarkBreaks]}\n              rehypePlugins={[\n                preserveCustomVariableProperties,\n                rehypeRaw,\n                restoreCustomVariableProperties,\n                [\n                  rehypeHighlight,\n                  { languages: highlightLanguages, subset: subsetLanguages },\n                ],\n                rehypeKatex,\n              ]}\n              components={components}\n            >\n              {seg.value}\n            </ReactMarkdown>\n          );\n        }\n\n        if (seg.type === \"mermaid\") {\n          return (\n            <MermaidChart\n              key={index}\n              chart={seg.value}\n              frozen={!seg.complete}\n            />\n          );\n        }\n\n        if (seg.type === \"svg\") {\n          return <SvgBlockInShadow key={index} svg={seg.value} />;\n        }\n\n        if (seg.type === \"html\") {\n          return (\n            <ContentHtml\n              key={index}\n              html={seg.value}\n              fullscreenButtonText={fullscreenButtonText}\n            />\n          );\n        }\n\n        return null;\n      })}\n\n      {contentHtmlPayload &&\n        (contentType === \"blackboard\" ? (\n          <ContentBlackboard\n            payload={contentHtmlPayload}\n            renderNarrationAsCaption={renderNarrationAsCaption}\n            maxVisibleStepNumber={maxVisibleStepNumber}\n            visibleStepNumber={visibleStepNumber}\n          />\n        ) : (\n          <ContentHtml\n            payload={contentHtmlPayload}\n            fullscreenButtonText={fullscreenButtonText}\n          />\n        ))}\n\n      {customRenderBar &&\n        React.createElement(customRenderBar, {\n          content,\n          displayContent,\n          onSend,\n        })}\n    </div>\n  );\n};\n\nexport default ContentRender;\n"],"names":["SvgBlockInShadow","svg","hostRef","useRef","useEffect","host","shadowRoot","jsx","ContentRender","content","customRenderBar","onSend","typingSpeed","enableTypewriter","defaultButtonText","defaultInputText","defaultSelectedValues","readonly","onTypeFinished","confirmButtonText","copyButtonText","copiedButtonText","fullscreenButtonText","onClickCustomButtonAfterContent","beforeSend","contentHtmlPayload","contentType","renderNarrationAsCaption","maxVisibleStepNumber","visibleStepNumber","displayContent","isComplete","useTypewriterStateMachine","components","children","props","CustomButtonInputVariable","className","rest","chartContent","frozen","mermaidBlockIsComplete","MermaidChart","node","CodeBlock","hasCompleted","segments","parseMarkdownSegments","jsxs","seg","index","ReactMarkdown","remarkGfm","remarkMath","remarkFlow","remarkBreaks","preserveCustomVariableProperties","rehypeRaw","restoreCustomVariableProperties","rehypeHighlight","highlightLanguages","subsetLanguages","rehypeKatex","ContentHtml","ContentBlackboard","React"],"mappings":"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"}
+{"version":3,"file":"ContentRender.js","sources":["../../../src/components/ContentRender/ContentRender.tsx"],"sourcesContent":["import \"highlight.js/styles/github.css\";\nimport \"katex/dist/katex.min.css\";\nimport React, { useEffect, useRef } from \"react\";\nimport ReactMarkdown from \"react-markdown\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeRaw from \"rehype-raw\";\nimport remarkBreaks from \"remark-breaks\";\nimport remarkFlow from \"remark-flow\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport { CustomRenderBarProps, OnSendContentParams } from \"../types\";\nimport \"./contentRender.css\";\nimport \"./github-markdown-light.css\";\nimport CodeBlock from \"./CodeBlock\";\nimport CustomButtonInputVariable, {\n  ComponentsWithCustomVariable,\n} from \"./plugins/CustomVariable\";\nimport MermaidChart from \"./plugins/MermaidChart\";\nimport useTypewriterStateMachine from \"./useTypewriterStateMachine\";\nimport {\n  preserveCustomVariableProperties,\n  restoreCustomVariableProperties,\n} from \"./utils/custom-variable-props\";\nimport {\n  highlightLanguages,\n  subsetLanguages,\n} from \"./utils/highlight-languages\";\n// import { processMarkdownText } from \"./utils/process-markdown\";\nimport {\n  parseMarkdownSegments,\n  mermaidBlockIsComplete,\n} from \"./utils/mermaid-parse\";\n// Define component Props type\nexport interface ContentRenderProps {\n  content: string;\n  /**\n+   * Callback invoked when the custom button after content is clicked.\n+   * This button is rendered via the `<custom-button-after-content>` tag in markdown content.\n+   * @example\n+   * ```tsx\n+   * <ContentRender\n+   *   content=\"Hello <custom-button-after-content>Ask</custom-button-after-content>\"\n+   *   onClickCustomButtonAfterContent={() => console.log('Button clicked')}\n+   * />\n+   * ```\n+   */\n  customRenderBar?: CustomRenderBarProps;\n  onClickCustomButtonAfterContent?: () => void;\n  onSend?: (content: OnSendContentParams) => void;\n  typingSpeed?: number;\n  enableTypewriter?: boolean;\n  defaultButtonText?: string;\n  defaultInputText?: string; // Text input by user\n  defaultSelectedValues?: string[]; // Default selected values for multi-select\n  readonly?: boolean;\n  onTypeFinished?: () => void;\n  // Multi-select confirm button text (i18n support)\n  confirmButtonText?: string;\n  // Copy button text (i18n support)\n  copyButtonText?: string;\n  // Copied state text (i18n support)\n  copiedButtonText?: string;\n  // Dynamic interaction format for multi-select support\n  dynamicInteractionFormat?: string;\n  beforeSend?: (param: OnSendContentParams) => boolean;\n  // tooltipMinLength?: number; // Control minimum character length for tooltip display, default 10\n}\n\n// Render svg string via Shadow DOM to avoid markdown wrapping\nconst SvgBlockInShadow: React.FC<{ svg: string }> = ({ svg }) => {\n  const hostRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const host = hostRef.current;\n    if (!host) return;\n    const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: \"open\" });\n    shadowRoot.innerHTML = svg;\n  }, [svg]);\n\n  return <div className=\"content-render-svg\" ref={hostRef} />;\n};\n\n// Extended component interface\ntype CustomComponents = ComponentsWithCustomVariable & {\n  \"custom-button-after-content\"?: React.ComponentType<{\n    children: React.ReactNode;\n  }>;\n};\n\nconst ContentRender: React.FC<ContentRenderProps> = ({\n  content,\n  customRenderBar,\n  onSend,\n  typingSpeed = 30,\n  enableTypewriter = false,\n  defaultButtonText,\n  defaultInputText,\n  defaultSelectedValues,\n  readonly = false,\n  onTypeFinished,\n  confirmButtonText,\n  copyButtonText,\n  copiedButtonText,\n  onClickCustomButtonAfterContent,\n  beforeSend,\n  // tooltipMinLength,\n}) => {\n  // Use custom Hook to handle typewriter effect\n  const { displayContent, isComplete } = useTypewriterStateMachine({\n    // processMarkdownText will let code block printf(\"You win!\\n\") become printf(\"You win!<br/>\");\n    // content: processMarkdownText(content),\n    content: content,\n    typingSpeed,\n    disabled: !enableTypewriter,\n  });\n\n  const components: CustomComponents = {\n    \"custom-button-after-content\": ({\n      children,\n    }: {\n      children: React.ReactNode;\n    }) => {\n      return (\n        <button\n          className=\"content-render-custom-button-after-content\"\n          onClick={onClickCustomButtonAfterContent}\n        >\n          {children}\n        </button>\n      );\n    },\n    \"custom-variable\": (props) => (\n      <CustomButtonInputVariable\n        {...props}\n        readonly={readonly}\n        defaultButtonText={defaultButtonText}\n        defaultInputText={defaultInputText}\n        defaultSelectedValues={defaultSelectedValues}\n        onSend={onSend}\n        beforeSend={beforeSend}\n        confirmButtonText={confirmButtonText}\n        // tooltipMinLength={tooltipMinLength}\n      />\n    ),\n    code: (props) => {\n      const { className, children, ...rest } = props as {\n        className?: string;\n        children?: React.ReactNode;\n      };\n      const match = /language-(\\w+)/.exec(className || \"\");\n      const language = match?.[1];\n      if (language === \"mermaid\") {\n        const chartContent = children?.toString().replace(/\\n$/, \"\") || \"\";\n        const frozen = mermaidBlockIsComplete(content, chartContent);\n        return <MermaidChart chart={chartContent} frozen={frozen} />;\n      }\n\n      return (\n        <code className={className} {...rest}>\n          {children}\n        </code>\n      );\n    },\n    table: ({ ...props }) => (\n      <div className=\"content-render-table-container\">\n        <table className=\"content-render-table\" {...props} />\n      </div>\n    ),\n    th: ({ ...props }) => <th className=\"content-render-th\" {...props} />,\n    td: ({ ...props }) => <td className=\"content-render-td\" {...props} />,\n    tr: ({ ...props }) => <tr className=\"content-render-tr\" {...props} />,\n    li: ({ node, ...props }) => {\n      const className = node?.properties?.className;\n      const hasTaskListItem =\n        (typeof className === \"string\" &&\n          className.includes(\"task-list-item\")) ||\n        (Array.isArray(className) && className.includes(\"task-list-item\"));\n      if (hasTaskListItem) {\n        return <li className=\"content-render-task-list-item\" {...props} />;\n      }\n      return <li {...props} />;\n    },\n    ol: ({ ...props }) => <ol className=\"content-render-ol\" {...props} />,\n    ul: ({ ...props }) => <ul className=\"content-render-ul\" {...props} />,\n    input: ({ ...props }) => {\n      if (props.type === \"checkbox\") {\n        return (\n          <input\n            type=\"checkbox\"\n            className=\"content-render-checkbox\"\n            disabled\n            {...props}\n          />\n        );\n      }\n      return <input {...props} />;\n    },\n    a: ({ children, ...props }) => (\n      <a target=\"_blank\" rel=\"noopener noreferrer\" {...props}>\n        {children}\n      </a>\n    ),\n    pre: (props) => (\n      <CodeBlock\n        {...props}\n        copyButtonText={copyButtonText}\n        copiedButtonText={copiedButtonText}\n      />\n    ),\n  };\n\n  const hasCompleted = useRef(false);\n\n  useEffect(() => {\n    if (isComplete && !hasCompleted.current) {\n      hasCompleted.current = true; // Mark as completed\n      onTypeFinished?.(); // Call the passed callback\n    }\n  }, [isComplete, onTypeFinished]);\n  useEffect(() => {\n    hasCompleted.current = false; // Reset completion status when content changes\n  }, [content]);\n\n  const segments = parseMarkdownSegments(displayContent);\n\n  return (\n    <div className={`content-render markdown-body`}>\n      {segments.map((seg, index) => {\n        if (seg.type === \"text\") {\n          return (\n            <ReactMarkdown\n              key={index}\n              remarkPlugins={[remarkGfm, remarkMath, remarkFlow, remarkBreaks]}\n              rehypePlugins={[\n                preserveCustomVariableProperties,\n                rehypeRaw,\n                restoreCustomVariableProperties,\n                [\n                  rehypeHighlight,\n                  { languages: highlightLanguages, subset: subsetLanguages },\n                ],\n                rehypeKatex,\n              ]}\n              components={components}\n            >\n              {seg.value}\n            </ReactMarkdown>\n          );\n        }\n\n        if (seg.type === \"mermaid\") {\n          return (\n            <MermaidChart\n              key={index}\n              chart={seg.value}\n              frozen={!seg.complete}\n            />\n          );\n        }\n\n        if (seg.type === \"svg\") {\n          return <SvgBlockInShadow key={index} svg={seg.value} />;\n        }\n      })}\n\n      {customRenderBar &&\n        React.createElement(customRenderBar, {\n          content,\n          displayContent,\n          onSend,\n        })}\n    </div>\n  );\n};\n\nexport default ContentRender;\n"],"names":["SvgBlockInShadow","svg","hostRef","useRef","useEffect","host","shadowRoot","jsx","ContentRender","content","customRenderBar","onSend","typingSpeed","enableTypewriter","defaultButtonText","defaultInputText","defaultSelectedValues","readonly","onTypeFinished","confirmButtonText","copyButtonText","copiedButtonText","onClickCustomButtonAfterContent","beforeSend","displayContent","isComplete","useTypewriterStateMachine","components","children","props","CustomButtonInputVariable","className","rest","chartContent","frozen","mermaidBlockIsComplete","MermaidChart","node","CodeBlock","hasCompleted","segments","parseMarkdownSegments","jsxs","seg","index","ReactMarkdown","remarkGfm","remarkMath","remarkFlow","remarkBreaks","preserveCustomVariableProperties","rehypeRaw","restoreCustomVariableProperties","rehypeHighlight","highlightLanguages","subsetLanguages","rehypeKatex","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAsEA,MAAMA,IAA8C,CAAC,EAAE,KAAAC,QAAU;AAC/D,QAAMC,IAAUC,EAAuB,IAAI;AAE3C,SAAAC,EAAU,MAAM;AACd,UAAMC,IAAOH,EAAQ;AACrB,QAAI,CAACG,EAAM;AACX,UAAMC,IAAaD,EAAK,cAAcA,EAAK,aAAa,EAAE,MAAM,QAAQ;AACxE,IAAAC,EAAW,YAAYL;AAAA,EACzB,GAAG,CAACA,CAAG,CAAC,GAEDM,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAU,sBAAqB,KAAKL,GAAS;AAC3D,GASMM,KAA8C,CAAC;AAAA,EACnD,SAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,kBAAAC,IAAmB;AAAA,EACnB,mBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,uBAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,gBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,iCAAAC;AAAA,EACA,YAAAC;AAAA;AAEF,MAAM;AAEJ,QAAM,EAAE,gBAAAC,GAAgB,YAAAC,EAAA,IAAeC,EAA0B;AAAA;AAAA;AAAA,IAG/D,SAAAjB;AAAA,IACA,aAAAG;AAAA,IACA,UAAU,CAACC;AAAA,EAAA,CACZ,GAEKc,IAA+B;AAAA,IACnC,+BAA+B,CAAC;AAAA,MAC9B,UAAAC;AAAA,IAAA,MAKErB,gBAAAA,EAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,SAASe;AAAA,QAER,UAAAM;AAAA,MAAA;AAAA,IAAA;AAAA,IAIP,mBAAmB,CAACC,MAClBtB,gBAAAA,EAAAA;AAAAA,MAACuB;AAAA,MAAA;AAAA,QACE,GAAGD;AAAA,QACJ,UAAAZ;AAAA,QACA,mBAAAH;AAAA,QACA,kBAAAC;AAAA,QACA,uBAAAC;AAAA,QACA,QAAAL;AAAA,QACA,YAAAY;AAAA,QACA,mBAAAJ;AAAA,MAAA;AAAA,IAAA;AAAA,IAIJ,MAAM,CAACU,MAAU;AACf,YAAM,EAAE,WAAAE,GAAW,UAAAH,GAAU,GAAGI,MAASH;AAMzC,UAFc,iBAAiB,KAAKE,KAAa,EAAE,IAC1B,CAAC,MACT,WAAW;AAC1B,cAAME,IAAeL,GAAU,SAAA,EAAW,QAAQ,OAAO,EAAE,KAAK,IAC1DM,IAASC,EAAuB1B,GAASwB,CAAY;AAC3D,eAAO1B,gBAAAA,EAAAA,IAAC6B,GAAA,EAAa,OAAOH,GAAc,QAAAC,EAAA,CAAgB;AAAA,MAC5D;AAEA,aACE3B,gBAAAA,EAAAA,IAAC,QAAA,EAAK,WAAAwB,GAAuB,GAAGC,GAC7B,UAAAJ,GACH;AAAA,IAEJ;AAAA,IACA,OAAO,CAAC,EAAE,GAAGC,EAAA,MACXtB,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAU,kCACb,gCAAC,SAAA,EAAM,WAAU,wBAAwB,GAAGsB,GAAO,GACrD;AAAA,IAEF,IAAI,CAAC,EAAE,GAAGA,EAAA,MAAYtB,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,qBAAqB,GAAGsB,GAAO;AAAA,IACnE,IAAI,CAAC,EAAE,GAAGA,EAAA,MAAYtB,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,qBAAqB,GAAGsB,GAAO;AAAA,IACnE,IAAI,CAAC,EAAE,GAAGA,EAAA,MAAYtB,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,qBAAqB,GAAGsB,GAAO;AAAA,IACnE,IAAI,CAAC,EAAE,MAAAQ,GAAM,GAAGR,QAAY;AAC1B,YAAME,IAAYM,GAAM,YAAY;AAKpC,aAHG,OAAON,KAAc,YACpBA,EAAU,SAAS,gBAAgB,KACpC,MAAM,QAAQA,CAAS,KAAKA,EAAU,SAAS,gBAAgB,IAEzDxB,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,iCAAiC,GAAGsB,GAAO,IAE3DtB,gBAAAA,MAAC,MAAA,EAAI,GAAGsB,EAAA,CAAO;AAAA,IACxB;AAAA,IACA,IAAI,CAAC,EAAE,GAAGA,EAAA,MAAYtB,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,qBAAqB,GAAGsB,GAAO;AAAA,IACnE,IAAI,CAAC,EAAE,GAAGA,EAAA,MAAYtB,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,qBAAqB,GAAGsB,GAAO;AAAA,IACnE,OAAO,CAAC,EAAE,GAAGA,QACPA,EAAM,SAAS,aAEftB,gBAAAA,EAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,UAAQ;AAAA,QACP,GAAGsB;AAAA,MAAA;AAAA,IAAA,IAIHtB,gBAAAA,MAAC,SAAA,EAAO,GAAGsB,EAAA,CAAO;AAAA,IAE3B,GAAG,CAAC,EAAE,UAAAD,GAAU,GAAGC,EAAA,MACjBtB,gBAAAA,EAAAA,IAAC,KAAA,EAAE,QAAO,UAAS,KAAI,uBAAuB,GAAGsB,GAC9C,UAAAD,EAAA,CACH;AAAA,IAEF,KAAK,CAACC,MACJtB,gBAAAA,EAAAA;AAAAA,MAAC+B;AAAA,MAAA;AAAA,QACE,GAAGT;AAAA,QACJ,gBAAAT;AAAA,QACA,kBAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAIEkB,IAAepC,EAAO,EAAK;AAEjC,EAAAC,EAAU,MAAM;AACd,IAAIqB,KAAc,CAACc,EAAa,YAC9BA,EAAa,UAAU,IACvBrB,IAAA;AAAA,EAEJ,GAAG,CAACO,GAAYP,CAAc,CAAC,GAC/Bd,EAAU,MAAM;AACd,IAAAmC,EAAa,UAAU;AAAA,EACzB,GAAG,CAAC9B,CAAO,CAAC;AAEZ,QAAM+B,IAAWC,EAAsBjB,CAAc;AAErD,SACEkB,gBAAAA,EAAAA,KAAC,OAAA,EAAI,WAAW,gCACb,UAAA;AAAA,IAAAF,EAAS,IAAI,CAACG,GAAKC,MAAU;AAC5B,UAAID,EAAI,SAAS;AACf,eACEpC,gBAAAA,EAAAA;AAAAA,UAACsC;AAAAA,UAAA;AAAA,YAEC,eAAe,CAACC,GAAWC,GAAYC,GAAYC,CAAY;AAAA,YAC/D,eAAe;AAAA,cACbC;AAAA,cACAC;AAAA,cACAC;AAAA,cACA;AAAA,gBACEC;AAAA,gBACA,EAAE,WAAWC,GAAoB,QAAQC,EAAA;AAAA,cAAgB;AAAA,cAE3DC;AAAA,YAAA;AAAA,YAEF,YAAA7B;AAAA,YAEC,UAAAgB,EAAI;AAAA,UAAA;AAAA,UAdAC;AAAA,QAAA;AAmBX,UAAID,EAAI,SAAS;AACf,eACEpC,gBAAAA,EAAAA;AAAAA,UAAC6B;AAAA,UAAA;AAAA,YAEC,OAAOO,EAAI;AAAA,YACX,QAAQ,CAACA,EAAI;AAAA,UAAA;AAAA,UAFRC;AAAA,QAAA;AAOX,UAAID,EAAI,SAAS;AACf,eAAOpC,gBAAAA,EAAAA,IAACP,GAAA,EAA6B,KAAK2C,EAAI,SAAhBC,CAAuB;AAAA,IAEzD,CAAC;AAAA,IAEAlC,KACC+C,EAAM,cAAc/C,GAAiB;AAAA,MACnC,SAAAD;AAAA,MACA,gBAAAe;AAAA,MACA,QAAAb;AAAA,IAAA,CACD;AAAA,EAAA,GACL;AAEJ;"}

package/dist/components/ContentRender/ContentRender.stories.d.ts

@@ -1,8 +1,7 @@
 import { StoryObj } from '@storybook/nextjs-vite';
-import { default as React } from 'react';
 declare const meta: {
     title: string;
-    component: React.FC<import('./ContentRender').ContentRenderProps>;
+    component: import('react').FC<import('./ContentRender').ContentRenderProps>;
     parameters: {
         layout: string;
     };
@@ -12,10 +11,6 @@ declare const meta: {
             control: "text";
             description: string;
         };
-        fullscreenButtonText: {
-            control: "text";
-            description: string;
-        };
     };
     args: {
         content: string;
@@ -36,11 +31,5 @@ export declare const InteractiveMultiSelectDemo: Story;
 export declare const ChineseMultiSelectDemo: Story;
 export declare const NativeHtmlElements: Story;
 export declare const CodeBlockShowcase: Story;
-export declare const HtmlCodeBlockAsCode: Story;
 export declare const EnglishChineseTypographyPreview: Story;
 export declare const SVGDemo: Story;
-export declare const HtmlIframeDemo: Story;
-export declare const HtmlIframeWithLoading: Story;
-export declare const HtmlChunkStreaming: Story;
-export declare const HtmlChunkStreamingWithCaption: Story;
-export declare const HtmlChunkStreamingManual: Story;

package/dist/components/ContentRender/index.d.ts

@@ -4,5 +4,4 @@ export { default as ContentRender } from './ContentRender';
 export { default as MarkdownFlowInput } from './MarkdownFlowInput';
 export { default as useTypewriter } from './useTypewriter';
 export { default as useTypewriterStateMachine } from './useTypewriterStateMachine';
-export { default as ContentBlackboard } from './ContentBlackboard';
 export type { MarkdownFlowInputProps } from './MarkdownFlowInput';

package/dist/components/ContentRender/utils/highlight-languages.js

@@ -1,25 +1,25 @@
-import o from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/javascript.js";
-import m from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/typescript.js";
-import r from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/python.js";
-import i from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/java.js";
-import t from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/xml.js";
-import a from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/css.js";
-import f from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/json.js";
-import p from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/bash.js";
-import l from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/sql.js";
-import s from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/markdown.js";
-import h from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/c.js";
-import c from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/cpp.js";
-import e from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/go.js";
-import n from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/plaintext.js";
-import g from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/rust.js";
-import j from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/shell.js";
-import u from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/scss.js";
-import x from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/yaml.js";
-import y from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/vhdl.js";
-import v from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/latex.js";
-import d from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/lua.js";
-import b from "../../../Documents/ai-shifu/markdown-flow-ui/node_modules/.pnpm/highlight.js@11.11.1/node_modules/highlight.js/es/languages/php.js";
+import o from "../../../node_modules/highlight.js/es/languages/javascript.js";
+import m from "../../../node_modules/highlight.js/es/languages/typescript.js";
+import r from "../../../node_modules/highlight.js/es/languages/python.js";
+import i from "../../../node_modules/highlight.js/es/languages/java.js";
+import t from "../../../node_modules/highlight.js/es/languages/xml.js";
+import a from "../../../node_modules/highlight.js/es/languages/css.js";
+import f from "../../../node_modules/highlight.js/es/languages/json.js";
+import p from "../../../node_modules/highlight.js/es/languages/bash.js";
+import l from "../../../node_modules/highlight.js/es/languages/sql.js";
+import s from "../../../node_modules/highlight.js/es/languages/markdown.js";
+import h from "../../../node_modules/highlight.js/es/languages/c.js";
+import c from "../../../node_modules/highlight.js/es/languages/cpp.js";
+import e from "../../../node_modules/highlight.js/es/languages/go.js";
+import n from "../../../node_modules/highlight.js/es/languages/plaintext.js";
+import g from "../../../node_modules/highlight.js/es/languages/rust.js";
+import j from "../../../node_modules/highlight.js/es/languages/shell.js";
+import u from "../../../node_modules/highlight.js/es/languages/scss.js";
+import x from "../../../node_modules/highlight.js/es/languages/yaml.js";
+import y from "../../../node_modules/highlight.js/es/languages/vhdl.js";
+import v from "../../../node_modules/highlight.js/es/languages/latex.js";
+import d from "../../../node_modules/highlight.js/es/languages/lua.js";
+import b from "../../../node_modules/highlight.js/es/languages/php.js";
 const S = {
   javascript: o,
   js: o,

package/dist/components/ContentRender/utils/mermaid-parse.d.ts

@@ -9,10 +9,6 @@ export declare function parseMarkdownSegments(markdown: string): ({
     type: "svg";
     value: string;
     complete: boolean;
-} | {
-    type: "html";
-    value: string;
-    complete: boolean;
 })[];
 export declare function parseMermaidBlocks(fullMarkdown: string): {
     code: string;