markdown-flow-ui 0.2.29 → 0.2.30

package/dist/components/ContentRender/ContentRender.es.js

@@ -1,417 +1,438 @@
-import { jsx as r, jsxs as He } from "react/jsx-runtime";
-import Q, { useMemo as C, useState as be, useRef as v, useEffect as P } from "react";
-import qe from "../../_virtual/index.es.js";
+import { jsx as n, jsxs as je } from "react/jsx-runtime";
+import U, { useMemo as B, useState as Ne, useRef as g, useEffect as P } from "react";
+import Qe from "../../_virtual/index.es.js";
 import { sanitizeInvalidTagName as Pe } from "./utils/sanitize-invalid-tag-name.es.js";
-import { stripSvgTextLineBreaks as Qe } from "./utils/strip-svg-text-line-breaks.es.js";
+import { stripSvgTextLineBreaks as Ue } from "./utils/strip-svg-text-line-breaks.es.js";
 /* empty css                     */
 /* empty css                             */
 /* empty css                                                   */
 /* empty css                                             */
-import je, { CodeBlockContext as Ue } from "./CodeBlock.es.js";
-import Ke from "./plugins/CustomVariable.es.js";
-import ie from "./plugins/MermaidChart.es.js";
-import { preserveCustomVariableProperties as Oe, restoreCustomVariableProperties as Xe } from "./utils/custom-variable-props.es.js";
-import { subsetLanguages as Ye, highlightLanguages as Ze } from "./utils/highlight-languages.es.js";
-import { parseMarkdownSegments as Be, mermaidBlockIsComplete as Je } from "./utils/mermaid-parse.es.js";
-import { normalizeInlineHtml as Se } from "./utils/normalize-inline-html.es.js";
-import et from "./IframeSandbox.es.js";
-import { getTrailingTypewriterGrapheme as ae, appendContentAwareTypewriterQueue as Re, consumeContentAwareTypewriterQueue as tt, CONTENT_AWARE_TYPEWRITER_TICK_BUDGET as rt, isContentAwareTypewriterQueueEmpty as nt } from "./utils/typewriter-pacing.es.js";
-import { splitContentSegments as ot } from "./utils/split-content.es.js";
-import { getInteractionDefaultValues as st } from "../../lib/interaction-defaults.es.js";
-import { getMarkdownFlowDirection as at, getMarkdownFlowLanguage as it } from "../../lib/locale.es.js";
-import { getContentRenderLocaleTexts as Le } from "./contentRenderI18n.es.js";
-import { Markdown as ct } from "../../node_modules/react-markdown/lib/index.es.js";
-import lt from "../../node_modules/rehype-raw/lib/index.es.js";
-import ut from "../../node_modules/rehype-highlight/lib/index.es.js";
-import dt from "../../node_modules/rehype-katex/lib/index.es.js";
-import mt from "../../node_modules/remark-gfm/lib/index.es.js";
-import pt from "../../node_modules/remark-math/lib/index.es.js";
-import ht from "../../node_modules/remark-breaks/lib/index.es.js";
-const ft = /<(script|style|link|iframe|html|head|body|meta|title|base|template|div|section|article|main)\b/i, gt = 2, Ne = ({ svg: t }) => {
-  const n = v(null);
+import Ke, { CodeBlockContext as Oe } from "./CodeBlock.es.js";
+import Ye from "./plugins/CustomVariable.es.js";
+import le from "./plugins/MermaidChart.es.js";
+import { preserveCustomVariableProperties as Xe, restoreCustomVariableProperties as Ze } from "./utils/custom-variable-props.es.js";
+import { subsetLanguages as Je, highlightLanguages as et } from "./utils/highlight-languages.es.js";
+import { parseMarkdownSegments as Le, mermaidBlockIsComplete as tt } from "./utils/mermaid-parse.es.js";
+import { normalizeInlineHtml as Ae } from "./utils/normalize-inline-html.es.js";
+import nt from "./IframeSandbox.es.js";
+import { getTrailingTypewriterGrapheme as ue, appendContentAwareTypewriterQueue as Me, consumeContentAwareTypewriterQueue as rt, CONTENT_AWARE_TYPEWRITER_TICK_BUDGET as ot, isContentAwareTypewriterQueueEmpty as st } from "./utils/typewriter-pacing.es.js";
+import { splitContentSegments as at } from "./utils/split-content.es.js";
+import { getInteractionDefaultValues as it } from "../../lib/interaction-defaults.es.js";
+import { getMarkdownFlowDirection as ct, getMarkdownFlowLanguage as ut } from "../../lib/locale.es.js";
+import { getContentRenderLocaleTexts as De } from "./contentRenderI18n.es.js";
+import { Markdown as lt } from "../../node_modules/react-markdown/lib/index.es.js";
+import dt from "../../node_modules/rehype-raw/lib/index.es.js";
+import mt from "../../node_modules/rehype-highlight/lib/index.es.js";
+import pt from "../../node_modules/rehype-katex/lib/index.es.js";
+import ht from "../../node_modules/remark-gfm/lib/index.es.js";
+import ft from "../../node_modules/remark-math/lib/index.es.js";
+import gt from "../../node_modules/remark-breaks/lib/index.es.js";
+const vt = 2, $e = ({ svg: t }) => {
+  const r = g(null);
   return P(() => {
-    const o = n.current;
+    const o = r.current;
     if (!o) return;
-    const s = o.shadowRoot ?? o.attachShadow({ mode: "open" }), k = "content-render-svg-style";
-    let u = s.getElementById(k);
-    u || (u = document.createElement("style"), u.id = k, u.textContent = `
+    const a = o.shadowRoot ?? o.attachShadow({ mode: "open" }), T = "content-render-svg-style";
+    let m = a.getElementById(T);
+    m || (m = document.createElement("style"), m.id = T, m.textContent = `
         svg { height: auto; display: inline-block; }
         svg.content-render-svg-el--responsive { width: 100%; max-width: 100%; }
         svg.content-render-svg-el--fixed { max-width: none; }
-      `, s.appendChild(u)), Array.from(s.childNodes).filter(
-      (a) => a !== u
-    ).forEach((a) => s.removeChild(a));
-    const G = document.createElement("template"), D = Qe(t);
-    G.innerHTML = D, s.append(G.content.cloneNode(!0));
-    let d = !1, F = !1;
-    s.querySelectorAll("svg").forEach((a) => {
-      const z = a.getAttribute("viewBox");
-      if (!z) return;
-      const W = z.trim().split(/[\s,]+/).map((T) => Number(T));
-      if (W.length !== 4 || W.some(Number.isNaN)) return;
-      const [, , E, S] = W, L = a.getAttribute("width"), V = a.getAttribute("height"), j = (T) => {
-        if (!T) return !1;
-        const c = T.trim().toLowerCase();
-        return c === "auto" || c.endsWith("%");
-      }, U = (T) => {
-        if (!T) return null;
-        const c = T.trim().toLowerCase();
-        if (c === "auto" || c.endsWith("%"))
+      `, a.appendChild(m)), Array.from(a.childNodes).filter(
+      (i) => i !== m
+    ).forEach((i) => a.removeChild(i));
+    const G = document.createElement("template"), V = Ue(t);
+    G.innerHTML = V, a.append(G.content.cloneNode(!0));
+    let p = !1, z = !1;
+    a.querySelectorAll("svg").forEach((i) => {
+      const _ = i.getAttribute("viewBox");
+      if (!_) return;
+      const q = _.trim().split(/[\s,]+/).map((y) => Number(y));
+      if (q.length !== 4 || q.some(Number.isNaN)) return;
+      const [, , D, R] = q, A = i.getAttribute("width"), E = i.getAttribute("height"), K = (y) => {
+        if (!y) return !1;
+        const u = y.trim().toLowerCase();
+        return u === "auto" || u.endsWith("%");
+      }, O = (y) => {
+        if (!y) return null;
+        const u = y.trim().toLowerCase();
+        if (u === "auto" || u.endsWith("%"))
           return null;
-        const M = Number.parseFloat(c);
+        const M = Number.parseFloat(u);
         return Number.isNaN(M) ? null : M;
-      }, Y = j(L), Z = j(V), K = !L || L === "0", O = !V || V === "0", J = U(L), ee = U(V);
-      if (Y || Z || K && O || J === E && ee === S) {
-        d = !0, a.classList.add("content-render-svg-el--responsive"), a.classList.remove("content-render-svg-el--fixed"), a.style.width = "100%", a.style.height = "auto", !a.style.aspectRatio && S > 0 && (a.style.aspectRatio = `${E} / ${S}`);
+      }, ee = K(A), te = K(E), Y = !A || A === "0", X = !E || E === "0", ne = O(A), re = O(E);
+      if (ee || te || Y && X || ne === D && re === R) {
+        p = !0, i.classList.add("content-render-svg-el--responsive"), i.classList.remove("content-render-svg-el--fixed"), i.style.width = "100%", i.style.height = "auto", !i.style.aspectRatio && R > 0 && (i.style.aspectRatio = `${D} / ${R}`);
         return;
       }
-      F = !0, a.classList.add("content-render-svg-el--fixed"), a.classList.remove("content-render-svg-el--responsive"), K && E > 0 && a.setAttribute("width", `${E}`), O && S > 0 && a.setAttribute("height", `${S}`);
+      z = !0, i.classList.add("content-render-svg-el--fixed"), i.classList.remove("content-render-svg-el--responsive"), Y && D > 0 && i.setAttribute("width", `${D}`), X && R > 0 && i.setAttribute("height", `${R}`);
     });
-    const _ = d && !F;
-    o.classList.toggle("content-render-svg--responsive", _), o.classList.toggle("content-render-svg--fixed", !_);
-  }, [t]), /* @__PURE__ */ r("div", { className: "content-render-svg-scroll", children: /* @__PURE__ */ r("div", { className: "content-render-svg", ref: n }) });
-}, ce = Q.createContext(
+    const W = p && !z;
+    o.classList.toggle("content-render-svg--responsive", W), o.classList.toggle("content-render-svg--fixed", !W);
+  }, [t]), /* @__PURE__ */ n("div", { className: "content-render-svg-scroll", children: /* @__PURE__ */ n("div", { className: "content-render-svg", ref: r }) });
+}, de = U.createContext(
   null
 ), xt = (t) => {
-  const n = Q.useContext(ce), o = Q.useContext(Ue);
-  if (!n)
+  const r = U.useContext(de), o = U.useContext(Oe);
+  if (!r)
     throw new Error("Markdown code renderer requires ContentRender context.");
-  const { className: s, children: k, ...u } = t;
-  if (/language-(\w+)/.exec(s || "")?.[1] === "mermaid") {
-    const D = k?.toString().replace(/\n$/, "") || "", d = Je(
-      n.current.renderContent,
-      D
+  const { className: a, children: T, ...m } = t;
+  if (/language-(\w+)/.exec(a || "")?.[1] === "mermaid") {
+    const V = T?.toString().replace(/\n$/, "") || "", p = tt(
+      r.current.renderContent,
+      V
     );
-    return /* @__PURE__ */ r(
-      ie,
+    return /* @__PURE__ */ n(
+      le,
       {
-        chart: D,
-        frozen: d,
-        messages: n.current.mermaidMessages
+        chart: V,
+        frozen: p,
+        messages: r.current.mermaidMessages
       }
     );
   }
-  return /* @__PURE__ */ r(
+  return /* @__PURE__ */ n(
     "code",
     {
-      className: s,
-      ...u,
-      dir: u.dir ?? (o ? void 0 : "ltr"),
-      children: k
+      className: a,
+      ...m,
+      dir: m.dir ?? (o ? void 0 : "ltr"),
+      children: T
     }
   );
-}, vt = [
-  mt,
-  pt,
-  qe,
-  ht
-], Tt = [
-  Oe,
-  lt,
-  Pe,
+}, yt = [
+  ht,
+  ft,
+  Qe,
+  gt
+], Ct = [
   Xe,
-  [ut, { languages: Ze, subset: Ye }],
-  dt
-], Ae = ({ content: t, components: n, locale: o }) => {
-  const s = Le(o);
-  return /* @__PURE__ */ r("div", { className: "markdown-renderer", children: /* @__PURE__ */ r(
-    ct,
+  dt,
+  Pe,
+  Ze,
+  [mt, { languages: et, subset: Je }],
+  pt
+], Ve = ({ content: t, components: r, locale: o }) => {
+  const a = De(o);
+  return /* @__PURE__ */ n("div", { className: "markdown-renderer", children: /* @__PURE__ */ n(
+    lt,
     {
-      remarkPlugins: vt,
-      rehypePlugins: Tt,
+      remarkPlugins: yt,
+      rehypePlugins: Ct,
       remarkRehypeOptions: {
-        footnoteLabel: s.footnoteLabel,
-        footnoteBackLabel: (k, u) => {
-          const A = String(k + 1) + (u > 1 ? `-${u}` : "");
-          return s.footnoteBackLabel.replace("{reference}", A);
+        footnoteLabel: a.footnoteLabel,
+        footnoteBackLabel: (T, m) => {
+          const L = String(T + 1) + (m > 1 ? `-${m}` : "");
+          return a.footnoteBackLabel.replace("{reference}", L);
         }
       },
-      components: n,
+      components: r,
       children: t
     }
   ) });
-}, yt = (t) => {
+}, Tt = (t) => {
   if (t.length <= 1) return t;
-  const n = [];
+  const r = [];
   return t.forEach((o) => {
     if (o.type === "sandbox") {
-      n.push(o);
+      r.push(o);
       return;
     }
-    const s = n[n.length - 1];
-    if (s && s.type !== "sandbox") {
-      n[n.length - 1] = {
+    const a = r[r.length - 1];
+    if (a && a.type !== "sandbox") {
+      r[r.length - 1] = {
         type: "markdown",
-        value: `${s.value}${o.value}`
+        value: `${a.value}${o.value}`
       };
       return;
     }
-    n.push({ type: "markdown", value: o.value });
-  }), n;
-}, Ct = (t, n) => {
-  const o = Math.max(1, n), s = Array.from(t);
+    r.push({ type: "markdown", value: o.value });
+  }), r;
+}, kt = (t, r) => {
+  const o = Math.max(1, r), a = Array.from(t);
   return {
-    chunk: s.slice(0, o).join(""),
-    rest: s.slice(o).join("")
+    chunk: a.slice(0, o).join(""),
+    rest: a.slice(o).join("")
   };
-}, kt = (t, n) => t === n ? !0 : !t || !n || t.length !== n.length ? !1 : t.every((o, s) => o === n[s]), wt = (t) => {
-  const n = v(t);
-  return kt(n.current, t) || (n.current = t), n.current;
-}, tr = ({
+}, wt = (t, r) => t === r ? !0 : !t || !r || t.length !== r.length ? !1 : t.every((o, a) => o === r[a]), bt = (t) => {
+  const r = g(t);
+  return wt(r.current, t) || (r.current = t), r.current;
+}, nn = ({
   content: t,
-  contentType: n,
+  contentType: r,
   locale: o,
-  lang: s,
-  dir: k,
-  customRenderBar: u,
-  onSend: A,
+  lang: a,
+  dir: T,
+  customRenderBar: m,
+  onSend: L,
   typingSpeed: G = 30,
-  enableTypewriter: D = !1,
-  typewriterPacing: d = "fixed",
-  onTypeFinished: F,
-  onTypewriterStateChange: _,
-  userInput: a,
-  interactionDefaultValueOptions: z,
-  defaultButtonText: W,
-  defaultInputText: E,
-  defaultSelectedValues: S,
-  readonly: L = !1,
-  confirmButtonText: V,
-  copyButtonText: j,
-  copiedButtonText: U,
-  sandboxLoadingText: Y,
-  sandboxStyleLoadingText: Z,
-  sandboxScriptLoadingText: K,
-  disableSandboxLoadingOverlay: O = !1,
-  sandboxFullscreenButtonText: J,
-  sandboxExitFullscreenButtonText: ee,
-  sandboxMode: le = "content",
-  onClickCustomButtonAfterContent: te,
-  beforeSend: T
+  enableTypewriter: V = !1,
+  typewriterPacing: p = "fixed",
+  onTypeFinished: z,
+  onTypewriterStateChange: W,
+  userInput: i,
+  interactionDefaultValueOptions: _,
+  defaultButtonText: q,
+  defaultInputText: D,
+  defaultSelectedValues: R,
+  readonly: A = !1,
+  confirmButtonText: E,
+  copyButtonText: K,
+  copiedButtonText: O,
+  sandboxLoadingText: ee,
+  sandboxStyleLoadingText: te,
+  sandboxScriptLoadingText: Y,
+  disableSandboxLoadingOverlay: X = !1,
+  sandboxFullscreenButtonText: ne,
+  sandboxExitFullscreenButtonText: re,
+  sandboxMode: me = "content",
+  onClickCustomButtonAfterContent: oe,
+  beforeSend: y
   // tooltipMinLength,
 }) => {
-  const c = Le(o), M = C(
+  const u = De(o), M = B(
     () => ({
-      loading: c.mermaidLoadingText,
-      emptyChart: c.mermaidEmptyChartText,
-      error: c.mermaidErrorText
+      loading: u.mermaidLoadingText,
+      emptyChart: u.mermaidEmptyChartText,
+      error: u.mermaidErrorText
     }),
-    [c]
-  ), H = k ?? at(o), q = s ?? it(o), ue = V || c.confirmButtonText, de = j || c.copyButtonText, me = U || c.copiedButtonText, Me = J || c.sandboxFullscreenButtonText, $e = ee || c.sandboxExitFullscreenButtonText, m = !!D && (!n || n === "text"), pe = Math.max(0, G), De = d === "fixed" ? t : void 0, [w, he] = be(
-    () => m ? "" : t
-  ), X = v(w), h = v(""), g = v({
+    [u]
+  ), H = T ?? ct(o), j = a ?? ut(o), pe = E || u.confirmButtonText, he = K || u.copyButtonText, fe = O || u.copiedButtonText, Ee = ne || u.sandboxFullscreenButtonText, Ie = re || u.sandboxExitFullscreenButtonText, l = !!V && (!r || r === "text"), Z = B(
+    () => Tt(at(t, !0, !0)),
+    [t]
+  ), se = Z.some(
+    (e) => e.type === "sandbox"
+  ), c = se ? Z.filter((e) => e.type !== "sandbox").map((e) => e.value).join("") : t, ge = Math.max(0, G), Fe = p === "fixed" ? c : void 0, [v, ve] = Ne(
+    () => l ? "" : c
+  ), J = g(v), f = g(""), x = g({
     tokens: [],
     head: 0,
     trailingGrapheme: ""
-  }), R = v(0), fe = v(m), ge = v(d), xe = v(t), re = v(!1), [Ee, Ve] = be(0);
+  }), S = g(0), xe = g(l), ye = g(p), Ce = g(c), Te = g(t), ae = g(!1), [Ge, ze] = Ne(0);
   P(() => {
-    const e = fe.current, i = ge.current, p = xe.current, b = !!h.current;
-    fe.current = m, ge.current = d, xe.current = t, (t !== p || m !== e) && (re.current = !1);
-    const f = () => {
-      h.current = "", g.current = {
+    const e = xe.current, s = ye.current, h = Ce.current, k = !!f.current, C = Te.current !== t;
+    Te.current = t, xe.current = l, ye.current = p, Ce.current = c, (C || l !== e) && (ae.current = !1);
+    const Q = () => {
+      f.current = "", x.current = {
         tokens: [],
         head: 0,
         trailingGrapheme: ""
-      }, R.current = 0;
-    }, $ = (I) => {
-      X.current = I, he(I);
+      }, S.current = 0;
+    }, w = (F) => {
+      J.current = F, ve(F);
     };
-    if (!m) {
-      f(), $(t);
+    if (!l) {
+      Q(), w(c);
       return;
     }
-    e || (f(), $(""));
-    const x = e ? X.current : "";
-    if (!t.startsWith(x)) {
-      f(), $(t), d === "content-aware" && (g.current = {
+    e || (Q(), w(""));
+    const $ = e ? J.current : "";
+    if (!c.startsWith($)) {
+      Q(), w(c), p === "content-aware" && (x.current = {
         tokens: [],
         head: 0,
-        trailingGrapheme: ae(t)
+        trailingGrapheme: ue(c)
       });
       return;
     }
-    let N = t.slice(x.length);
+    let N = c.slice($.length);
     if (!N) {
-      h.current = "", R.current = 0, g.current = d === "content-aware" ? {
+      f.current = "", S.current = 0, x.current = p === "content-aware" ? {
         tokens: [],
         head: 0,
-        trailingGrapheme: ae(x)
+        trailingGrapheme: ue($)
       } : { tokens: [], head: 0, trailingGrapheme: "" };
       return;
     }
-    if (d === "content-aware") {
-      const I = p.slice(
-        x.length
+    if (p === "content-aware") {
+      const F = h.slice(
+        $.length
       );
-      if (e && i === "content-aware" && t.startsWith(p) && h.current === I) {
-        const B = Re(
-          g.current,
-          t.slice(p.length)
+      if (e && s === "content-aware" && c.startsWith(h) && f.current === F) {
+        const b = Me(
+          x.current,
+          c.slice(h.length)
         );
-        g.current = B.queue, B.immediateChunk && (N = N.slice(
-          B.immediateChunk.length
-        ), $(`${x}${B.immediateChunk}`));
+        x.current = b.queue, b.immediateChunk && (N = N.slice(
+          b.immediateChunk.length
+        ), w(`${$}${b.immediateChunk}`));
       } else {
-        const B = Re(
+        const b = Me(
           {
             tokens: [],
             head: 0,
-            trailingGrapheme: ae(x)
+            trailingGrapheme: ue($)
           },
           N
         );
-        g.current = B.queue, B.immediateChunk && (N = N.slice(
-          B.immediateChunk.length
-        ), $(`${x}${B.immediateChunk}`)), R.current = 0;
+        x.current = b.queue, b.immediateChunk && (N = N.slice(
+          b.immediateChunk.length
+        ), w(`${$}${b.immediateChunk}`)), S.current = 0;
       }
     } else
-      g.current = {
+      x.current = {
         tokens: [],
         head: 0,
         trailingGrapheme: ""
-      }, R.current = 0;
-    h.current = N, !b && N && Ve((I) => I + 1);
-  }, [t, m, d]), P(() => {
-    m && (re.current || h.current || w !== t || (re.current = !0, F?.()));
-  }, [t, w, m, F]), P(() => {
-    if (!m || !h.current)
+      }, S.current = 0;
+    f.current = N, !k && N && ze((F) => F + 1);
+  }, [t, c, l, p]), P(() => {
+    l && (ae.current || f.current || v !== c || (ae.current = !0, z?.()));
+  }, [
+    t,
+    c,
+    v,
+    l,
+    z
+  ]), P(() => {
+    if (!l || !f.current)
       return;
     const e = window.setTimeout(() => {
-      if (!h.current)
+      if (!f.current)
         return;
-      let i = "";
-      if (d === "content-aware") {
-        const b = tt(
-          g.current,
-          R.current + rt
+      let s = "";
+      if (p === "content-aware") {
+        const k = rt(
+          x.current,
+          S.current + ot
         );
-        i = b.chunk, g.current = b.queue, nt(b.queue) ? R.current = 0 : R.current = b.remainingBudget;
+        s = k.chunk, x.current = k.queue, st(k.queue) ? S.current = 0 : S.current = k.remainingBudget;
       } else
-        i = Ct(
-          h.current,
-          gt
+        s = kt(
+          f.current,
+          vt
         ).chunk;
-      if (!i)
+      if (!s)
         return;
-      h.current = h.current.slice(i.length), h.current || (g.current = d === "content-aware" ? {
+      f.current = f.current.slice(s.length), f.current || (x.current = p === "content-aware" ? {
         tokens: [],
         head: 0,
-        trailingGrapheme: g.current.trailingGrapheme
-      } : { tokens: [], head: 0, trailingGrapheme: "" }, R.current = 0);
-      const p = `${X.current}${i}`;
-      X.current = p, he(p);
-    }, pe);
+        trailingGrapheme: x.current.trailingGrapheme
+      } : { tokens: [], head: 0, trailingGrapheme: "" }, S.current = 0);
+      const h = `${J.current}${s}`;
+      J.current = h, ve(h);
+    }, ge);
     return () => window.clearTimeout(e);
   }, [
-    w,
-    De,
-    m,
-    d,
-    pe,
-    Ee
+    v,
+    Fe,
+    l,
+    p,
+    ge,
+    Ge
   ]);
-  const ve = C(
+  const ke = B(
     () => ({
-      isTypewriterEnabled: m,
-      isTyping: m && w !== t,
-      isComplete: w === t,
-      renderedLength: w.length,
+      isTypewriterEnabled: l,
+      isTyping: l && v !== c,
+      isComplete: v === c,
+      renderedLength: t.length - Math.max(0, c.length - v.length),
       totalLength: t.length
     }),
-    [t, w, m]
+    [t, c, v, l]
   );
   P(() => {
-    _?.(ve);
-  }, [_, ve]);
-  const y = m ? w : t, ne = C(
-    () => Se(y),
-    [y]
-  ), oe = C(
-    () => st(
-      y,
-      a,
-      z
+    W?.(ke);
+  }, [W, ke]);
+  const we = B(() => {
+    let e = 0;
+    return Z.map((s) => {
+      if (s.type === "sandbox" || !l) return s;
+      const h = v.slice(
+        e,
+        e + s.value.length
+      );
+      return e += s.value.length, { ...s, value: h };
+    });
+  }, [Z, v, l]), I = se ? we.map((e) => e.value).join("") : l ? v : t, ie = B(
+    () => Ae(I),
+    [I]
+  ), ce = B(
+    () => it(
+      I,
+      i,
+      _
     ),
-    [z, y, a]
-  ), Te = W?.trim() || oe.buttonText, ye = E?.trim() || oe.inputText, Ie = C(
-    () => a ? a.split(",").map((e) => e.trim()).filter(Boolean) : void 0,
-    [a]
-  ), Ge = S?.length ? S : oe.selectedValues || Ie, Ce = wt(
-    Ge
-  ), l = v({
+    [_, I, i]
+  ), be = q?.trim() || ce.buttonText, Be = D?.trim() || ce.inputText, We = B(
+    () => i ? i.split(",").map((e) => e.trim()).filter(Boolean) : void 0,
+    [i]
+  ), _e = R?.length ? R : ce.selectedValues || We, Re = bt(
+    _e
+  ), d = g({
     direction: H,
-    language: q,
+    language: j,
     mermaidMessages: M,
-    beforeSend: T,
+    beforeSend: y,
     locale: o,
-    onClickCustomButtonAfterContent: te,
-    onSend: A,
-    readonly: L,
-    renderContent: y,
-    resolvedConfirmButtonText: ue,
-    resolvedCopiedButtonText: me,
-    resolvedCopyButtonText: de,
-    resolvedDefaultButtonText: Te,
-    resolvedDefaultInputText: ye,
-    resolvedDefaultSelectedValues: Ce
+    onClickCustomButtonAfterContent: oe,
+    onSend: L,
+    readonly: A,
+    renderContent: I,
+    resolvedConfirmButtonText: pe,
+    resolvedCopiedButtonText: fe,
+    resolvedCopyButtonText: he,
+    resolvedDefaultButtonText: be,
+    resolvedDefaultInputText: Be,
+    resolvedDefaultSelectedValues: Re
   });
-  l.current = {
+  d.current = {
     direction: H,
-    language: q,
+    language: j,
     mermaidMessages: M,
-    beforeSend: T,
+    beforeSend: y,
     locale: o,
-    onClickCustomButtonAfterContent: te,
-    onSend: A,
-    readonly: L,
-    renderContent: y,
-    resolvedConfirmButtonText: ue,
-    resolvedCopiedButtonText: me,
-    resolvedCopyButtonText: de,
-    resolvedDefaultButtonText: Te,
-    resolvedDefaultInputText: ye,
-    resolvedDefaultSelectedValues: Ce
+    onClickCustomButtonAfterContent: oe,
+    onSend: L,
+    readonly: A,
+    renderContent: I,
+    resolvedConfirmButtonText: pe,
+    resolvedCopiedButtonText: fe,
+    resolvedCopyButtonText: he,
+    resolvedDefaultButtonText: be,
+    resolvedDefaultInputText: Be,
+    resolvedDefaultSelectedValues: Re
   };
-  const ke = C(
+  const Se = B(
     () => ({
       "custom-button-after-content": ({
         children: e
-      }) => /* @__PURE__ */ r(
+      }) => /* @__PURE__ */ n(
         "button",
         {
           className: "content-render-custom-button-after-content",
-          onClick: l.current.onClickCustomButtonAfterContent,
-          children: /* @__PURE__ */ r("span", { className: "content-render-custom-button-after-content-inner", children: e })
+          onClick: d.current.onClickCustomButtonAfterContent,
+          children: /* @__PURE__ */ n("span", { className: "content-render-custom-button-after-content-inner", children: e })
         }
       ),
-      "custom-variable": (e) => /* @__PURE__ */ r(
-        Ke,
+      "custom-variable": (e) => /* @__PURE__ */ n(
+        Ye,
         {
           ...e,
-          readonly: l.current.readonly,
-          defaultButtonText: l.current.resolvedDefaultButtonText,
-          defaultInputText: l.current.resolvedDefaultInputText,
-          defaultSelectedValues: l.current.resolvedDefaultSelectedValues,
-          onSend: l.current.onSend,
-          beforeSend: l.current.beforeSend,
-          locale: l.current.locale,
-          dir: l.current.direction,
-          lang: l.current.language,
-          confirmButtonText: l.current.resolvedConfirmButtonText
+          readonly: d.current.readonly,
+          defaultButtonText: d.current.resolvedDefaultButtonText,
+          defaultInputText: d.current.resolvedDefaultInputText,
+          defaultSelectedValues: d.current.resolvedDefaultSelectedValues,
+          onSend: d.current.onSend,
+          beforeSend: d.current.beforeSend,
+          locale: d.current.locale,
+          dir: d.current.direction,
+          lang: d.current.language,
+          confirmButtonText: d.current.resolvedConfirmButtonText
         }
       ),
       code: xt,
-      table: ({ ...e }) => /* @__PURE__ */ r("div", { className: "content-render-table-container", children: /* @__PURE__ */ r("table", { className: "content-render-table", ...e }) }),
-      th: ({ ...e }) => /* @__PURE__ */ r("th", { className: "content-render-th", ...e }),
-      td: ({ ...e }) => /* @__PURE__ */ r("td", { className: "content-render-td", ...e }),
-      tr: ({ ...e }) => /* @__PURE__ */ r("tr", { className: "content-render-tr", ...e }),
-      li: ({ node: e, ...i }) => {
-        const p = e?.properties?.className;
-        return typeof p == "string" && p.includes("task-list-item") || Array.isArray(p) && p.includes("task-list-item") ? /* @__PURE__ */ r("li", { className: "content-render-task-list-item", ...i }) : /* @__PURE__ */ r("li", { ...i });
+      table: ({ ...e }) => /* @__PURE__ */ n("div", { className: "content-render-table-container", children: /* @__PURE__ */ n("table", { className: "content-render-table", ...e }) }),
+      th: ({ ...e }) => /* @__PURE__ */ n("th", { className: "content-render-th", ...e }),
+      td: ({ ...e }) => /* @__PURE__ */ n("td", { className: "content-render-td", ...e }),
+      tr: ({ ...e }) => /* @__PURE__ */ n("tr", { className: "content-render-tr", ...e }),
+      li: ({ node: e, ...s }) => {
+        const h = e?.properties?.className;
+        return typeof h == "string" && h.includes("task-list-item") || Array.isArray(h) && h.includes("task-list-item") ? /* @__PURE__ */ n("li", { className: "content-render-task-list-item", ...s }) : /* @__PURE__ */ n("li", { ...s });
       },
-      ol: ({ ...e }) => /* @__PURE__ */ r("ol", { className: "content-render-ol", ...e }),
-      ul: ({ ...e }) => /* @__PURE__ */ r("ul", { className: "content-render-ul", ...e }),
-      input: ({ ...e }) => e.type === "checkbox" ? /* @__PURE__ */ r(
+      ol: ({ ...e }) => /* @__PURE__ */ n("ol", { className: "content-render-ol", ...e }),
+      ul: ({ ...e }) => /* @__PURE__ */ n("ul", { className: "content-render-ul", ...e }),
+      input: ({ ...e }) => e.type === "checkbox" ? /* @__PURE__ */ n(
         "input",
         {
           type: "checkbox",
@@ -419,70 +440,59 @@ const ft = /<(script|style|link|iframe|html|head|body|meta|title|base|template|d
           disabled: !0,
           ...e
         }
-      ) : /* @__PURE__ */ r("input", { ...e }),
-      a: ({ children: e, ...i }) => /* @__PURE__ */ r("a", { target: "_blank", rel: "noopener noreferrer", ...i, children: e }),
-      pre: (e) => /* @__PURE__ */ r(
-        je,
+      ) : /* @__PURE__ */ n("input", { ...e }),
+      a: ({ children: e, ...s }) => /* @__PURE__ */ n("a", { target: "_blank", rel: "noopener noreferrer", ...s, children: e }),
+      pre: (e) => /* @__PURE__ */ n(
+        Ke,
         {
           ...e,
-          copyButtonText: l.current.resolvedCopyButtonText,
-          copiedButtonText: l.current.resolvedCopiedButtonText
+          copyButtonText: d.current.resolvedCopyButtonText,
+          copiedButtonText: d.current.resolvedCopiedButtonText
         }
       )
     }),
     []
-  ), we = C(
-    () => ft.test(y),
-    [y]
-  ), se = C(
-    () => we ? ot(y, !0) : [],
-    [y, we]
-  ), Fe = se.some(
-    (e) => e.type === "sandbox"
-  ), _e = C(
-    () => yt(se),
-    [se]
-  ), ze = C(
-    () => Be(ne),
-    [ne]
-  ), We = (e, i) => {
-    const p = Se(e);
-    return Be(p).map((f, $) => {
-      const x = `${i}-${f.type}-${$}`;
-      return f.type === "text" ? /* @__PURE__ */ r(
-        ce.Provider,
+  ), qe = B(
+    () => Le(ie),
+    [ie]
+  ), He = (e, s) => {
+    const h = Ae(e);
+    return Le(h).map((C, Q) => {
+      const w = `${s}-${C.type}-${Q}`;
+      return C.type === "text" ? /* @__PURE__ */ n(
+        de.Provider,
         {
-          value: l,
-          children: /* @__PURE__ */ r(
-            Ae,
+          value: d,
+          children: /* @__PURE__ */ n(
+            Ve,
             {
               locale: o,
-              components: ke,
-              content: f.value
+              components: Se,
+              content: C.value
             }
           )
         },
-        x
-      ) : f.type === "mermaid" ? /* @__PURE__ */ r(
-        ie,
+        w
+      ) : C.type === "mermaid" ? /* @__PURE__ */ n(
+        le,
         {
-          chart: f.value,
-          frozen: !f.complete,
+          chart: C.value,
+          frozen: !C.complete,
           messages: M
         },
-        x
-      ) : f.type === "svg" ? /* @__PURE__ */ r(Ne, { svg: f.value }, x) : null;
+        w
+      ) : C.type === "svg" ? /* @__PURE__ */ n($e, { svg: C.value }, w) : null;
     });
   };
-  return Fe ? /* @__PURE__ */ r(
+  return se ? /* @__PURE__ */ n(
     "div",
     {
       className: "content-render markdown-body",
       dir: H,
-      lang: q,
-      children: _e.map(
-        (e, i) => e.type === "sandbox" ? /* @__PURE__ */ r(
-          et,
+      lang: j,
+      children: we.map(
+        (e, s) => e.type === "sandbox" ? /* @__PURE__ */ n(
+          nt,
           {
             hideFullScreen: !0,
             type: "sandbox",
@@ -490,67 +500,67 @@ const ft = /<(script|style|link|iframe|html|head|body|meta|title|base|template|d
             className: "content-render-iframe",
             locale: o,
             dir: H,
-            lang: q,
-            loadingText: Y,
-            styleLoadingText: Z,
-            scriptLoadingText: K,
-            disableLoadingOverlay: O,
-            fullScreenButtonText: Me,
-            exitFullScreenButtonText: $e,
-            mode: le
+            lang: j,
+            loadingText: ee,
+            styleLoadingText: te,
+            scriptLoadingText: Y,
+            disableLoadingOverlay: X,
+            fullScreenButtonText: Ee,
+            exitFullScreenButtonText: Ie,
+            mode: me
           },
-          `sandbox-${i}`
-        ) : /* @__PURE__ */ r(Q.Fragment, { children: We(e.value, `md-${i}`) }, `md-${i}`)
+          `sandbox-${s}`
+        ) : /* @__PURE__ */ n(U.Fragment, { children: He(e.value, `md-${s}`) }, `md-${s}`)
       )
     }
-  ) : /* @__PURE__ */ He(
+  ) : /* @__PURE__ */ je(
     "div",
     {
       className: "content-render markdown-body",
       dir: H,
-      lang: q,
+      lang: j,
       children: [
-        ze.map((e, i) => {
+        qe.map((e, s) => {
           if (e.type === "text")
-            return /* @__PURE__ */ r(
-              ce.Provider,
+            return /* @__PURE__ */ n(
+              de.Provider,
               {
-                value: l,
-                children: /* @__PURE__ */ r(
-                  Ae,
+                value: d,
+                children: /* @__PURE__ */ n(
+                  Ve,
                   {
                     locale: o,
-                    components: ke,
+                    components: Se,
                     content: e.value
                   }
                 )
               },
-              i
+              s
             );
           if (e.type === "mermaid")
-            return /* @__PURE__ */ r(
-              ie,
+            return /* @__PURE__ */ n(
+              le,
               {
                 chart: e.value,
                 frozen: !e.complete,
                 messages: M
               },
-              i
+              s
             );
           if (e.type === "svg")
-            return /* @__PURE__ */ r(Ne, { svg: e.value }, i);
+            return /* @__PURE__ */ n($e, { svg: e.value }, s);
         }),
-        u && /* @__PURE__ */ r("div", { className: "content-render-custom-bar", children: Q.createElement(u, {
+        m && /* @__PURE__ */ n("div", { className: "content-render-custom-bar", children: U.createElement(m, {
           content: t,
-          displayContent: ne,
-          onSend: A
+          displayContent: ie,
+          onSend: L
         }) })
       ]
     }
   );
 };
 export {
-  Ae as MarkdownRenderer,
-  tr as default
+  Ve as MarkdownRenderer,
+  nn as default
 };
 //# sourceMappingURL=ContentRender.es.js.map