markdown-flow-ui 0.1.100-beta.12 → 0.1.100-beta.13

package/dist/components/Slide/Slide.es.js

@@ -1,41 +1,41 @@
 import { j as t } from "../../_virtual/jsx-runtime.es.js";
-import { memo as Ue, useRef as g, useMemo as L, useState as y, useCallback as i, useEffect as h } from "react";
-import { hasBrowserUserActivation as Ve } from "../../lib/browserUserActivation.es.js";
-import { isSandboxInteractionMessage as ze } from "../../lib/sandboxInteraction.es.js";
-import { cn as O } from "../../lib/utils.es.js";
-import Ge from "../ContentRender/ContentRender.es.js";
-import ge from "../ContentRender/IframeSandbox.es.js";
+import { memo as Ve, useRef as v, useMemo as O, useState as y, useCallback as i, useEffect as h } from "react";
+import { hasBrowserUserActivation as ze } from "../../lib/browserUserActivation.es.js";
+import { isSandboxInteractionMessage as Ge } from "../../lib/sandboxInteraction.es.js";
+import { cn as $ } from "../../lib/utils.es.js";
+import We from "../ContentRender/ContentRender.es.js";
+import ye from "../ContentRender/IframeSandbox.es.js";
 import "../ui/inputGroup/input-group.es.js";
-import { getInteractionDefaultValues as We, getInteractionDefaultSelectedValues as Ye } from "../../lib/interaction-defaults.es.js";
-import Je from "./Player.es.js";
-import Qe from "./useSlide.es.js";
-import Xe from "./useWakePlayerFromIframe.es.js";
+import { getInteractionDefaultValues as Ye, getInteractionDefaultSelectedValues as Je } from "../../lib/interaction-defaults.es.js";
+import Qe from "./Player.es.js";
+import Xe from "./useSlide.es.js";
+import Ze from "./useWakePlayerFromIframe.es.js";
 /* empty css             */
-const Ze = 1e3, ye = Ue(
+const et = 1e3, we = Ve(
   ({
     content: b,
     title: _,
-    defaultButtonText: c,
+    defaultButtonText: u,
     defaultInputText: j,
     defaultSelectedValues: w,
     confirmButtonText: T,
     copyButtonText: R,
     copiedButtonText: P,
-    onSend: $,
+    onSend: D,
     readonly: B = !1
   }) => /* @__PURE__ */ t.jsxs("div", { className: "slide-player__interaction-card", children: [
     /* @__PURE__ */ t.jsx("div", { className: "slide-player__interaction-header", children: /* @__PURE__ */ t.jsx("p", { className: "slide-player__interaction-title", children: _ }) }),
     /* @__PURE__ */ t.jsx("div", { className: "slide-player__interaction-body", children: /* @__PURE__ */ t.jsx(
-      Ge,
+      We,
       {
         content: b,
-        defaultButtonText: c,
+        defaultButtonText: u,
         defaultInputText: j,
         defaultSelectedValues: w,
         confirmButtonText: T,
         copyButtonText: R,
         copiedButtonText: P,
-        onSend: $,
+        onSend: D,
         readonly: B,
         enableTypewriter: !1,
         sandboxMode: "content"
@@ -44,178 +44,178 @@ const Ze = 1e3, ye = Ue(
     /* @__PURE__ */ t.jsx("div", { className: "slide-player__interaction-arrow" })
   ] })
 );
-ye.displayName = "InteractionOverlayCard";
-const et = (b, _) => b.length === _.length && b.every((c, j) => {
+we.displayName = "InteractionOverlayCard";
+const tt = (b, _) => b.length === _.length && b.every((u, j) => {
   const w = _[j];
-  return c.sequence_number === w?.sequence_number && c.type === w?.type && c.content === w?.content;
-}), ht = ({
+  return u.sequence_number === w?.sequence_number && u.type === w?.type && u.content === w?.content;
+}), xt = ({
   elementList: b = [],
   showPlayer: _ = !0,
-  playerAlwaysVisible: c = !1,
+  playerAlwaysVisible: u = !1,
   playerClassName: j,
   interactionTitle: w,
   interactionTexts: T,
   playerAutoHideDelay: R = 3e3,
   interactionDefaultValueOptions: P,
-  onSend: $,
+  onSend: D,
   onPlayerVisibilityChange: B,
-  onStepChange: se,
-  className: we,
-  onPointerDown: le,
-  ...Ie
+  onStepChange: oe,
+  className: Ie,
+  onPointerDown: se,
+  ...Se
 }) => {
-  const X = g(null), Z = g(null), ie = g(null), C = g(null), q = g(null), F = g(null), ae = g([]), D = g(!1), {
-    currentElementList: d,
-    stepElementLists: ce,
-    slideElementList: ee,
+  const ee = v(null), te = v(null), le = v(null), C = v(null), q = v(null), F = v(null), ie = v([]), H = v(!1), {
+    currentElementList: f,
+    stepElementLists: ae,
+    slideElementList: K,
     currentIndex: x,
-    audioList: ue,
+    audioList: ce,
     currentAudioSequenceIndexes: k,
     currentInteractionElement: M,
-    canGoPrev: Se,
+    canGoPrev: be,
     canGoNext: I,
-    handlePrev: de,
-    handleNext: v
-  } = Qe(b), fe = L(() => {
+    handlePrev: ue,
+    handleNext: g
+  } = Xe(b), de = O(() => {
     if (!(x < 0))
-      return ee[x];
-  }, [x, ee]), me = ee.filter(
+      return K[x];
+  }, [x, K]), _e = K.filter(
     (e) => e.is_renderable !== !1
-  ).length === 1, u = _ && (me || ue.length > 0 || !!M), [pe, H] = y(!0), [K, te] = y(!1), [be, ne] = y(!1), [_e] = y(() => Ve()), Te = _e || be, [Pe, U] = y(-1), [V, z] = y(-1), [n, re] = y(), [G, W] = y(!1), E = u && (c || pe), S = i(() => {
+  ).length === 1, d = _ && (K.length > 0 || ce.length > 0 || !!M), [fe, U] = y(!0), [V, L] = y(!1), [Te, ne] = y(!1), [Pe] = y(() => ze()), Ee = Pe || Te, [Ae, z] = y(-1), [G, W] = y(-1), [n, re] = y(), [Y, J] = y(!1), E = d && (u || fe), S = i(() => {
     C.current !== null && (window.clearTimeout(C.current), C.current = null);
-  }, []), f = i(() => {
+  }, []), m = i(() => {
     F.current !== null && (window.clearTimeout(F.current), F.current = null);
   }, []), A = i(() => {
     q.current !== null && (window.clearTimeout(q.current), q.current = null);
   }, []), N = i(() => {
-    A(), f(), U(-1), z(-1), re(void 0), W(!1);
-  }, [A, f]), Y = i(() => {
+    A(), m(), z(-1), W(-1), re(void 0), J(!1);
+  }, [A, m]), Q = i(() => {
     const e = k[0];
-    return typeof e != "number" ? !1 : (z(0), U(e), !0);
-  }, [k]), J = i(() => {
-    f(), W(!1), !Y() && I && v();
+    return typeof e != "number" ? !1 : (W(0), z(e), !0);
+  }, [k]), X = i(() => {
+    m(), J(!1), !Q() && I && g();
   }, [
     I,
-    f,
-    v,
-    Y
-  ]), m = i(
-    (e = K) => {
-      u && (H(!0), S(), !(c || !e || R <= 0) && (C.current = window.setTimeout(() => {
-        H(!1), C.current = null;
+    m,
+    g,
+    Q
+  ]), a = i(
+    (e = V) => {
+      d && (U(!0), S(), !(u || !e || R <= 0) && (C.current = window.setTimeout(() => {
+        U(!1), C.current = null;
       }, R)));
     },
     [
       S,
-      K,
-      c,
+      V,
+      u,
       R,
-      u
+      d
     ]
   );
   h(() => () => {
-    A(), S(), f();
+    A(), S(), m();
   }, [
     A,
-    f,
+    m,
     S
   ]), h(() => (B?.(E), () => {
     B?.(!1);
   }), [B, E]), h(() => {
-    se?.(fe, x);
-  }, [x, fe, se]), h(() => {
-    if (!u) {
-      S(), H(!1);
+    oe?.(de, x);
+  }, [x, de, oe]), h(() => {
+    if (!d) {
+      S(), U(!1);
       return;
     }
-    if (c) {
-      S(), H(!0);
+    if (u) {
+      S(), U(!0);
       return;
     }
-    K || m(!0);
+    V || a(!0);
   }, [
     S,
-    K,
-    c,
+    V,
     u,
-    m
+    d,
+    a
   ]), h(() => {
     if (typeof window > "u")
       return;
     const e = (r) => {
-      r.origin === window.location.origin && ze(r.data) && u && (te(!0), m(!0));
+      r.origin === window.location.origin && Ge(r.data) && d && (L(!0), a(!0));
     };
     return window.addEventListener("message", e), () => {
       window.removeEventListener("message", e);
     };
-  }, [u, m]), Xe({
-    sectionRef: X,
-    enabled: u,
+  }, [d, a]), Ze({
+    sectionRef: ee,
+    enabled: d,
     onWake: () => {
-      te(!0), m(!0);
+      L(!0), a(!0);
     }
   }), h(() => {
-    if (N(), !(d.length === 0 && !M)) {
+    if (N(), !(f.length === 0 && !M)) {
       if (M) {
-        re(M), W(!0);
+        re(M), J(!0);
         return;
       }
-      if (!Y() && I)
+      if (!Q() && I)
         return q.current = window.setTimeout(() => {
-          q.current = null, v();
-        }, Ze), () => {
+          q.current = null, g();
+        }, et), () => {
           A();
         };
     }
   }, [
     I,
     A,
-    d,
+    f,
     M,
-    v,
+    g,
     N,
-    Y
+    Q
   ]);
-  const he = L(() => n ? We(
+  const me = O(() => n ? Ye(
     typeof n.content == "string" ? n.content : void 0,
     n.user_input,
     P
-  ) : {}, [n, P]), Ee = L(() => {
+  ) : {}, [n, P]), Ne = O(() => {
     if (n)
-      return Ye(
+      return Je(
         typeof n.content == "string" ? n.content : void 0,
         n.user_input,
         P
       );
-  }, [n, P]), oe = !!n?.user_input?.trim(), Ae = !!n?.readonly || oe, Ne = i(
+  }, [n, P]), pe = !!n?.user_input?.trim(), he = !!n?.readonly || pe, xe = he || pe, je = i(
     (e) => {
       const s = [
         ...e.selectedValues ?? [],
         e.inputText?.trim() ?? "",
         e.buttonText?.trim() ?? ""
       ].filter(Boolean).join(", ");
-      re((a) => !a || !s ? a : {
-        ...a,
+      re((c) => !c || !s ? c : {
+        ...c,
         user_input: s
-      }), $?.(e, n), J();
+      }), D?.(e, n), X();
     },
-    [n, J, $]
+    [n, X, D]
   );
   h(() => {
-    if (f(), !(!G || !oe))
+    if (m(), !(!Y || !xe))
       return F.current = window.setTimeout(() => {
-        F.current = null, J();
+        F.current = null, X();
       }, 2e3), () => {
-        f();
+        m();
       };
   }, [
-    f,
-    J,
-    oe,
-    G
+    m,
+    X,
+    Y,
+    xe
   ]);
-  const je = (e) => e ? e.type === "slot" ? /* @__PURE__ */ t.jsx(t.Fragment, { children: e.content }) : e.type === "html" ? /* @__PURE__ */ t.jsx(
-    ge,
+  const Re = (e) => e ? e.type === "slot" ? /* @__PURE__ */ t.jsx(t.Fragment, { children: e.content }) : e.type === "html" ? /* @__PURE__ */ t.jsx(
+    ye,
     {
       className: "content-render-iframe",
       hideFullScreen: !0,
@@ -224,7 +224,7 @@ const et = (b, _) => b.length === _.length && b.every((c, j) => {
       content: e.content
     }
   ) : /* @__PURE__ */ t.jsx(
-    ge,
+    ye,
     {
       className: "content-render-iframe",
       hideFullScreen: !0,
@@ -232,12 +232,12 @@ const et = (b, _) => b.length === _.length && b.every((c, j) => {
       type: "markdown",
       content: e.content
     }
-  ) : null, Re = (e = [], r = !1) => {
+  ) : null, Be = (e = [], r = !1) => {
     if (e.length === 0)
       return null;
     const s = e.filter(
       (o) => o.is_renderable !== !1
-    ).length, a = e.reduce(
+    ).length, c = e.reduce(
       (o, l, p) => l.is_renderable !== !1 ? p : o,
       -1
     );
@@ -246,41 +246,41 @@ const et = (b, _) => b.length === _.length && b.every((c, j) => {
       return /* @__PURE__ */ t.jsx(
         "div",
         {
-          ref: r && l === a ? ie : null,
+          ref: r && l === c ? le : null,
           "aria-hidden": p || void 0,
-          className: O(
+          className: $(
             "w-full shrink-0",
             s === 1 && o.is_renderable !== !1 && "slide-element--single",
             p ? "pointer-events-none fixed left-[-200vw] top-0 -z-10 h-[100dvh] w-[100vw] overflow-hidden opacity-0" : o.is_renderable === !1 && "hidden"
           ),
-          children: je(o)
+          children: Re(o)
         },
         o.sequence_number ?? `${o.type}-${l}`
       );
     }) });
-  }, { mountedStepStates: Be, currentMountedStateIndex: Ce } = L(() => {
+  }, { mountedStepStates: Ce, currentMountedStateIndex: qe } = O(() => {
     const e = [], r = /* @__PURE__ */ new Map();
-    return ce.forEach((s, a) => {
+    return ae.forEach((s, c) => {
       const o = e.findIndex(
-        (l) => et(
+        (l) => tt(
           l.elementList,
           s
         )
       );
       if (o >= 0) {
-        e[o]?.sourceStepIndexes.push(a), r.set(a, o);
+        e[o]?.sourceStepIndexes.push(c), r.set(c, o);
         return;
       }
       e.push({
         elementList: s,
-        sourceStepIndexes: [a]
-      }), r.set(a, e.length - 1);
+        sourceStepIndexes: [c]
+      }), r.set(c, e.length - 1);
     }), {
       mountedStepStates: e,
       currentMountedStateIndex: x >= 0 ? r.get(x) ?? -1 : -1
     };
-  }, [x, ce]), qe = () => {
-    const e = X.current;
+  }, [x, ae]), Fe = () => {
+    const e = ee.current;
     if (e) {
       if (document.fullscreenElement) {
         document.exitFullscreen().catch(() => {
@@ -290,104 +290,104 @@ const et = (b, _) => b.length === _.length && b.every((c, j) => {
       e.requestFullscreen?.().catch(() => {
       });
     }
-  }, xe = i(() => {
-    const e = Z.current;
+  }, ge = i(() => {
+    const e = te.current;
     e && e.scrollTo({
       top: e.scrollHeight,
       behavior: "smooth"
     });
-  }, []), Fe = i(() => {
-    D.current = !0, ne(!0), N(), de();
-  }, [de, N]), ke = i(() => {
-    D.current = !0, ne(!0), N(), v();
-  }, [v, N]), Me = i(
+  }, []), ke = i(() => {
+    H.current = !0, L(!0), ne(!0), a(!0), N(), ue();
+  }, [ue, N, a]), Me = i(() => {
+    H.current = !0, L(!0), ne(!0), a(!0), N(), g();
+  }, [g, N, a]), Le = i(
     (e) => {
-      if (V < 0 || k[V] !== e)
+      if (G < 0 || k[G] !== e)
         return;
-      const r = V + 1, s = k[r];
+      const r = G + 1, s = k[r];
       if (typeof s == "number") {
-        z(r), U(s);
+        W(r), z(s);
         return;
       }
-      U(-1), z(-1), I && v();
+      z(-1), W(-1), I && g();
     },
     [
       I,
       k,
-      V,
-      v
+      G,
+      g
     ]
-  ), Le = i(() => {
-    n && W((e) => !e);
+  ), Oe = i(() => {
+    n && J((e) => !e);
   }, [n]), ve = i(
     (e) => {
-      e.stopPropagation(), E && m(!0);
+      e.stopPropagation(), E && a(!0);
     },
-    [pe, m]
-  ), Oe = i(
+    [fe, a]
+  ), $e = i(
     (e) => {
-      le?.(e), te(!0), m(!0);
+      se?.(e), L(!0), a(!0);
     },
-    [le, m]
-  ), $e = !!n && G, Q = L(
-    () => d.map(
+    [se, a]
+  ), De = !!n && Y, Z = O(
+    () => f.map(
       (e, r) => `${e.sequence_number ?? `${e.type}-${r}`}:${String(e.is_new ?? "")}`
     ),
-    [d]
+    [f]
   );
   return h(() => {
-    const e = ae.current, a = (e.length > 0 && e.length < Q.length && e.every((l, p) => l === Q[p]) ? d.slice(e.length) : []).some(
+    const e = ie.current, c = (e.length > 0 && e.length < Z.length && e.every((l, p) => l === Z[p]) ? f.slice(e.length) : []).some(
       (l) => l.is_new === !1
     );
-    if (ae.current = Q, !a)
+    if (ie.current = Z, !c)
       return;
     const o = window.requestAnimationFrame(() => {
-      const l = Z.current, p = ie.current;
+      const l = te.current, p = le.current;
       if (!l || !p)
         return;
-      const De = l.getBoundingClientRect(), He = p.getBoundingClientRect(), Ke = l.scrollTop + (He.top - De.top);
+      const He = l.getBoundingClientRect(), Ke = p.getBoundingClientRect(), Ue = l.scrollTop + (Ke.top - He.top);
       l.scrollTo({
-        top: Math.max(Ke, 0),
+        top: Math.max(Ue, 0),
         behavior: "smooth"
       });
     });
     return () => {
       window.cancelAnimationFrame(o);
     };
-  }, [d, Q]), h(() => {
-    if (!D.current || (D.current = !1, d.length === 0))
+  }, [f, Z]), h(() => {
+    if (!H.current || (H.current = !1, f.length === 0))
       return;
     const e = window.requestAnimationFrame(() => {
-      xe();
+      ge();
     });
     return () => {
       window.cancelAnimationFrame(e);
     };
-  }, [d, xe]), /* @__PURE__ */ t.jsxs(
+  }, [f, ge]), /* @__PURE__ */ t.jsxs(
     "section",
     {
-      ref: X,
-      className: O("relative h-full w-full", we),
-      onPointerDown: Oe,
-      ...Ie,
+      ref: ee,
+      className: $("relative h-full w-full", Ie),
+      onPointerDown: $e,
+      ...Se,
       children: [
         /* @__PURE__ */ t.jsx(
           "div",
           {
-            className: O(
+            className: $(
               "h-full min-h-0 w-full",
-              me ? "slide-content--single" : "grid gap-4"
+              _e ? "slide-content--single" : "grid gap-4"
             ),
-            children: d.length > 0 ? /* @__PURE__ */ t.jsx("div", { className: "slide-stage", children: /* @__PURE__ */ t.jsx("div", { ref: Z, className: "slide-stage__layer w-full", children: Be.map(
+            children: f.length > 0 ? /* @__PURE__ */ t.jsx("div", { className: "slide-stage", children: /* @__PURE__ */ t.jsx("div", { ref: te, className: "slide-stage__layer w-full", children: Ce.map(
               (e, r) => {
-                const s = r === Ce;
+                const s = r === qe;
                 return /* @__PURE__ */ t.jsx(
                   "div",
                   {
                     "aria-hidden": !s || void 0,
                     className: "w-full",
                     style: { display: s ? void 0 : "none" },
-                    children: Re(
+                    children: Be(
                       e.elementList,
                       s
                     )
@@ -398,53 +398,53 @@ const et = (b, _) => b.length === _.length && b.every((c, j) => {
             ) }) }) : null
           }
         ),
-        $e ? /* @__PURE__ */ t.jsx(
+        De ? /* @__PURE__ */ t.jsx(
           "div",
           {
-            className: O(
+            className: $(
               "slide-interaction-overlay",
-              E && u ? "slide-interaction-overlay--with-player" : "slide-interaction-overlay--standalone"
+              E && d ? "slide-interaction-overlay--with-player" : "slide-interaction-overlay--standalone"
             ),
             onClick: ve,
             onPointerDown: ve,
             children: /* @__PURE__ */ t.jsx(
-              ye,
+              we,
               {
                 content: String(n?.content ?? ""),
-                defaultButtonText: he.buttonText ?? "",
-                defaultInputText: he.inputText ?? "",
-                defaultSelectedValues: Ee,
+                defaultButtonText: me.buttonText ?? "",
+                defaultInputText: me.inputText ?? "",
+                defaultSelectedValues: Ne,
                 confirmButtonText: T?.confirmButtonText,
                 copyButtonText: T?.copyButtonText,
                 copiedButtonText: T?.copiedButtonText,
-                onSend: Ne,
-                readonly: Ae,
+                onSend: je,
+                readonly: he,
                 title: T?.title ?? w ?? "Submit the content below to continue."
               }
             )
           }
         ) : null,
-        u ? /* @__PURE__ */ t.jsx(
-          Je,
+        d ? /* @__PURE__ */ t.jsx(
+          Qe,
           {
-            audioList: ue,
-            className: O(
+            audioList: ce,
+            className: $(
               "absolute left-1/2 bottom-6 z-[2] -translate-x-1/2",
               j,
               !E && "pointer-events-none opacity-0"
             ),
-            currentAudioIndex: Pe,
-            defaultPlaying: Te,
+            currentAudioIndex: Ae,
+            defaultPlaying: Ee,
             hasInteraction: !!n,
-            isInteractionOpen: G,
+            isInteractionOpen: Y,
             nextDisabled: !I,
-            onEnded: Me,
-            onFullscreen: qe,
-            onInteractionToggle: Le,
+            onEnded: Le,
+            onFullscreen: Fe,
+            onInteractionToggle: Oe,
             onPlayRequest: () => ne(!0),
-            onNext: ke,
-            onPrev: Fe,
-            prevDisabled: !Se,
+            onNext: Me,
+            onPrev: ke,
+            prevDisabled: !be,
             showControls: E
           }
         ) : null
@@ -453,6 +453,6 @@ const et = (b, _) => b.length === _.length && b.every((c, j) => {
   );
 };
 export {
-  ht as default
+  xt as default
 };
 //# sourceMappingURL=Slide.es.js.map