markdown-flow-ui 0.1.103-beta.0 → 0.1.103-beta.1

package/dist/_virtual/index.cjs10.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e={exports:{}};exports.__module=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e={};exports.__exports=e;
 //# sourceMappingURL=index.cjs10.js.map

package/dist/_virtual/index.cjs8.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../markdown-flow-ui/node_modules/.pnpm/@braintree_sanitize-url@7.1.1/node_modules/@braintree/sanitize-url/dist/index.cjs.js");var r=e.__require();exports.distExports=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e={exports:{}};exports.__module=e;
 //# sourceMappingURL=index.cjs8.js.map

package/dist/_virtual/index.cjs9.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e={};exports.__exports=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../markdown-flow-ui/node_modules/.pnpm/@braintree_sanitize-url@7.1.1/node_modules/@braintree/sanitize-url/dist/index.cjs.js");var r=e.__require();exports.distExports=r;
 //# sourceMappingURL=index.cjs9.js.map

package/dist/_virtual/index.es10.js

@@ -1,5 +1,5 @@
-var s = { exports: {} };
+var r = {};
 export {
-  s as __module
+  r as __exports
 };
 //# sourceMappingURL=index.es10.js.map

package/dist/_virtual/index.es8.js

@@ -1,6 +1,5 @@
-import { __require as r } from "../markdown-flow-ui/node_modules/.pnpm/@braintree_sanitize-url@7.1.1/node_modules/@braintree/sanitize-url/dist/index.es.js";
-var i = r();
+var s = { exports: {} };
 export {
-  i as d
+  s as __module
 };
 //# sourceMappingURL=index.es8.js.map

package/dist/_virtual/index.es8.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es8.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
+{"version":3,"file":"index.es8.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/_virtual/index.es9.js

@@ -1,5 +1,6 @@
-var r = {};
+import { __require as r } from "../markdown-flow-ui/node_modules/.pnpm/@braintree_sanitize-url@7.1.1/node_modules/@braintree/sanitize-url/dist/index.es.js";
+var i = r();
 export {
-  r as __exports
+  i as d
 };
 //# sourceMappingURL=index.es9.js.map

package/dist/_virtual/index.es9.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es9.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index.es9.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/components/ContentRender/SandboxApp.cjs.js

@@ -1,5 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const A=require("../../_virtual/jsx-runtime.cjs.js"),r=require("react"),P=require("../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/loader-circle.cjs.js"),Q=["src","srcset","sizes","alt","class","width","height","style","loading","decoding","crossorigin","referrerpolicy","fetchpriority"],D=a=>Q.map(t=>`${t}:${a.getAttribute(t)||""}`).join("|"),J=a=>{const t=new Map;return a.querySelectorAll("img").forEach(l=>{const c=l,s=D(c),f=t.get(s)||[];f.push(c),t.set(s,f)}),t},X=(a,t)=>{const l=Array.from(a.attributes),c=new Set(l.map(s=>s.name));Array.from(t.attributes).forEach(s=>{c.has(s.name)||t.removeAttribute(s.name)}),l.forEach(s=>{t.setAttribute(s.name,s.value)})},Y=(a,t)=>{t.size&&a.querySelectorAll("img").forEach(l=>{const c=l,s=D(c),f=t.get(s),h=f?.shift();h&&(X(c,h),c.replaceWith(h),f&&f.length===0&&t.delete(s))})},Z=({html:a,styleLoadingText:t,scriptLoadingText:l,resetToken:c=0,mode:s="content",hasRootVhHeight:f=!1,stretchRootHeight:h=!1})=>{const C=r.useRef(null),[F,w]=r.useState(!1),[W,j]=r.useState(!1),I=r.useRef([]),N=r.useRef([]),k=r.useRef(0),q=r.useRef(0),g=r.useRef(null),x=r.useRef(null),b=r.useRef(!1),E=r.useRef(!1),_=r.useRef(!1),G=r.useRef(c),H=200,d=n=>{n.current&&(clearTimeout(n.current),n.current=null)},L=(n,i,u,T)=>{const m=performance.now()-u.current,v=Math.max(0,H-m);d(i),i.current=window.setTimeout(()=>{n(!1),T?.(),i.current=null},v)};r.useEffect(()=>{const n=C.current?.ownerDocument;if(!n)return;const i="sandbox-spinner-style";let u=n.getElementById(i);u||(u=n.createElement("style"),u.id=i,n.head?.appendChild(u)),u.textContent=`
-      @keyframes sandbox-spin { from { transform: rotate(0deg);} to { transform: rotate(360deg);} }
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const A=require("../../_virtual/jsx-runtime.cjs.js"),s=require("react"),P=require("../ui/loading-overlay-card.cjs.js"),Q=["src","srcset","sizes","alt","class","width","height","style","loading","decoding","crossorigin","referrerpolicy","fetchpriority"],F=a=>Q.map(t=>`${t}:${a.getAttribute(t)||""}`).join("|"),J=a=>{const t=new Map;return a.querySelectorAll("img").forEach(l=>{const c=l,r=F(c),f=t.get(r)||[];f.push(c),t.set(r,f)}),t},X=(a,t)=>{const l=Array.from(a.attributes),c=new Set(l.map(r=>r.name));Array.from(t.attributes).forEach(r=>{c.has(r.name)||t.removeAttribute(r.name)}),l.forEach(r=>{t.setAttribute(r.name,r.value)})},Y=(a,t)=>{t.size&&a.querySelectorAll("img").forEach(l=>{const c=l,r=F(c),f=t.get(r),h=f?.shift();h&&(X(c,h),c.replaceWith(h),f&&f.length===0&&t.delete(r))})},Z=({html:a,styleLoadingText:t,scriptLoadingText:l,resetToken:c=0,mode:r="content",hasRootVhHeight:f=!1,stretchRootHeight:h=!1})=>{const C=s.useRef(null),[z,w]=s.useState(!1),[H,j]=s.useState(!1),I=s.useRef([]),N=s.useRef([]),q=s.useRef(0),_=s.useRef(0),g=s.useRef(null),x=s.useRef(null),b=s.useRef(!1),E=s.useRef(!1),G=s.useRef(!1),L=s.useRef(c),O=200,d=n=>{n.current&&(clearTimeout(n.current),n.current=null)},k=(n,i,u,T)=>{const p=performance.now()-u.current,S=Math.max(0,O-p);d(i),i.current=window.setTimeout(()=>{n(!1),T?.(),i.current=null},S)};s.useEffect(()=>{const n=C.current?.ownerDocument;if(!n)return;const i="sandbox-spinner-style";let u=n.getElementById(i);u||(u=n.createElement("style"),u.id=i,n.head?.appendChild(u)),u.textContent=`
       .sandbox-wrapper { align-items: center; }
       .sandbox-container { position: relative; width: 100%; }
       .sandbox-container svg,
@@ -7,5 +6,5 @@
       .justify-\\[safe_center\\]{
         justify-content: safe center;
       }
-    `},[]),r.useEffect(()=>{c!==G.current&&(_.current=!1,G.current=c),d(g),d(x),b.current=!1,E.current=!1;const n=C.current;if(!n)return;const i=n.ownerDocument,u=i?.body;if(!u)return;const T=J(n);I.current.forEach(e=>e.remove()),I.current=[],N.current.forEach(e=>e.remove()),N.current=[],w(!1),j(!1);const m=i.createElement("div");m.innerHTML=a;const v=(a.match(/<script[\s>]/gi)||[]).length,V=(a.match(/<\/script>/gi)||[]).length,$=v>0&&v===V,y=[];Array.from(m.querySelectorAll("style, script")).forEach(e=>{if(e.tagName.toLowerCase()==="style"){const o=i.createElement("style");o.textContent=e.textContent||"",Array.from(e.attributes).forEach(p=>{o.setAttribute(p.name,p.value)}),y.push(o)}else{const o=i.createElement("script");Array.from(e.attributes).forEach(p=>{o.setAttribute(p.name,p.value)}),o.textContent=e.textContent||"",y.push(o)}e.remove()}),Y(m,T);const z=y.some(e=>e.tagName.toLowerCase()==="style"),B=y.some(e=>e.tagName.toLowerCase()==="script");z&&(b.current=!0,k.current=performance.now(),d(g),w(!0)),B&&(E.current=!0,q.current=performance.now(),d(x),j(!0)),!!m.firstElementChild&&(_.current=!0);const K=Array.from(m.childNodes);n.replaceChildren(...K),y.forEach(e=>{if(e.tagName.toLowerCase()==="style"){i.head?.appendChild(e),I.current.push(e);return}if($){const o=e,p=o.textContent||"";if(!o.src)try{new Function(p)}catch{o.remove();return}try{u.appendChild(o),N.current.push(o)}catch{o.remove()}}else e.remove()}),requestAnimationFrame(()=>{z&&L(w,g,k,()=>{b.current=!1}),B&&L(j,x,q,()=>{E.current=!1})})},[a,c]),r.useEffect(()=>()=>{d(g),d(x)},[]);const R=W||E.current?l||"Building scripts cache...":F||b.current?t||"Building styles...":null,M=s==="blackboard",S=M&&h,O={position:"relative",width:"100%",height:"100%",display:"flex",flexDirection:"column",justifyContent:S?"flex-start":M?"space-around":"flex-start"},U={pointerEvents:R?"none":void 0,margin:M?void 0:"auto 0",width:"100%",height:S?"100%":void 0,minHeight:S?0:void 0,flex:S?"1 1 auto":void 0};return A.jsxRuntimeExports.jsxs("div",{"data-root-vh":f?"true":"false",className:"sandbox-wrapper",style:O,"aria-busy":!!R,children:[A.jsxRuntimeExports.jsx("div",{ref:C,className:"sandbox-container",style:U}),R&&A.jsxRuntimeExports.jsxs("div",{style:{position:"absolute",inset:0,display:"flex",alignItems:"center",justifyContent:"center",background:"rgba(51, 51, 51, 0.80)",color:"#ffffff",fontSize:16,fontWeight:700,gap:10,pointerEvents:"auto",zIndex:20},children:[A.jsxRuntimeExports.jsx(P.default,{"aria-hidden":!0,size:20,style:{animation:"sandbox-spin 1s linear infinite"}}),R]})]})};exports.default=Z;
+    `},[]),s.useEffect(()=>{c!==L.current&&(G.current=!1,L.current=c),d(g),d(x),b.current=!1,E.current=!1;const n=C.current;if(!n)return;const i=n.ownerDocument,u=i?.body;if(!u)return;const T=J(n);I.current.forEach(e=>e.remove()),I.current=[],N.current.forEach(e=>e.remove()),N.current=[],w(!1),j(!1);const p=i.createElement("div");p.innerHTML=a;const S=(a.match(/<script[\s>]/gi)||[]).length,V=(a.match(/<\/script>/gi)||[]).length,$=S>0&&S===V,y=[];Array.from(p.querySelectorAll("style, script")).forEach(e=>{if(e.tagName.toLowerCase()==="style"){const o=i.createElement("style");o.textContent=e.textContent||"",Array.from(e.attributes).forEach(m=>{o.setAttribute(m.name,m.value)}),y.push(o)}else{const o=i.createElement("script");Array.from(e.attributes).forEach(m=>{o.setAttribute(m.name,m.value)}),o.textContent=e.textContent||"",y.push(o)}e.remove()}),Y(p,T);const B=y.some(e=>e.tagName.toLowerCase()==="style"),D=y.some(e=>e.tagName.toLowerCase()==="script");B&&(b.current=!0,q.current=performance.now(),d(g),w(!0)),D&&(E.current=!0,_.current=performance.now(),d(x),j(!0)),!!p.firstElementChild&&(G.current=!0);const K=Array.from(p.childNodes);n.replaceChildren(...K),y.forEach(e=>{if(e.tagName.toLowerCase()==="style"){i.head?.appendChild(e),I.current.push(e);return}if($){const o=e,m=o.textContent||"";if(!o.src)try{new Function(m)}catch{o.remove();return}try{u.appendChild(o),N.current.push(o)}catch{o.remove()}}else e.remove()}),requestAnimationFrame(()=>{B&&k(w,g,q,()=>{b.current=!1}),D&&k(j,x,_,()=>{E.current=!1})})},[a,c]),s.useEffect(()=>()=>{d(g),d(x)},[]);const R=H||E.current?l||"Building scripts cache...":z||b.current?t||"Building styles...":null,M=r==="blackboard",v=M&&h,W={position:"relative",width:"100%",height:"100%",display:"flex",flexDirection:"column",justifyContent:v?"flex-start":M?"space-around":"flex-start"},U={pointerEvents:R?"none":void 0,margin:M?void 0:"auto 0",width:"100%",height:v?"100%":void 0,minHeight:v?0:void 0,flex:v?"1 1 auto":void 0};return A.jsxRuntimeExports.jsxs("div",{"data-root-vh":f?"true":"false",className:"sandbox-wrapper",style:W,"aria-busy":!!R,children:[A.jsxRuntimeExports.jsx("div",{ref:C,className:"sandbox-container",style:U}),R&&A.jsxRuntimeExports.jsx("div",{style:{position:"absolute",inset:0,zIndex:20,display:"flex",alignItems:"center",justifyContent:"center",pointerEvents:"none"},children:A.jsxRuntimeExports.jsx(P.default,{message:R})})]})};exports.default=Z;
 //# sourceMappingURL=SandboxApp.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SandboxApp.cjs.js","sources":["../../../src/components/ContentRender/SandboxApp.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { Loader2 } from \"lucide-react\";\n\nexport interface SandboxAppProps {\n  html: string;\n  styleLoadingText?: string;\n  scriptLoadingText?: string;\n  resetToken?: number;\n  mode?: \"content\" | \"blackboard\";\n  hasRootVhHeight?: boolean;\n  stretchRootHeight?: boolean;\n}\n\nconst IMAGE_REUSE_ATTRIBUTES = [\n  \"src\",\n  \"srcset\",\n  \"sizes\",\n  \"alt\",\n  \"class\",\n  \"width\",\n  \"height\",\n  \"style\",\n  \"loading\",\n  \"decoding\",\n  \"crossorigin\",\n  \"referrerpolicy\",\n  \"fetchpriority\",\n];\n\nconst getImageReuseKey = (image: HTMLImageElement) =>\n  IMAGE_REUSE_ATTRIBUTES.map(\n    (attribute) => `${attribute}:${image.getAttribute(attribute) || \"\"}`\n  ).join(\"|\");\n\nconst collectReusableImages = (root: ParentNode) => {\n  const imageMap = new Map<string, HTMLImageElement[]>();\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const image = node as HTMLImageElement;\n    const key = getImageReuseKey(image);\n    const bucket = imageMap.get(key) || [];\n    bucket.push(image);\n    imageMap.set(key, bucket);\n  });\n  return imageMap;\n};\n\nconst syncImageAttributes = (\n  sourceImage: HTMLImageElement,\n  targetImage: HTMLImageElement\n) => {\n  const sourceAttributes = Array.from(sourceImage.attributes);\n  const sourceAttributeNames = new Set(\n    sourceAttributes.map((attribute) => attribute.name)\n  );\n\n  Array.from(targetImage.attributes).forEach((attribute) => {\n    if (!sourceAttributeNames.has(attribute.name)) {\n      targetImage.removeAttribute(attribute.name);\n    }\n  });\n\n  sourceAttributes.forEach((attribute) => {\n    targetImage.setAttribute(attribute.name, attribute.value);\n  });\n};\n\nconst reuseRenderedImages = (\n  root: ParentNode,\n  imageMap: Map<string, HTMLImageElement[]>\n) => {\n  if (!imageMap.size) return;\n\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const nextImage = node as HTMLImageElement;\n    const key = getImageReuseKey(nextImage);\n    const bucket = imageMap.get(key);\n    const preservedImage = bucket?.shift();\n    if (!preservedImage) return;\n\n    syncImageAttributes(nextImage, preservedImage);\n    nextImage.replaceWith(preservedImage);\n\n    if (bucket && bucket.length === 0) {\n      imageMap.delete(key);\n    }\n  });\n};\n\nconst SandboxApp: React.FC<SandboxAppProps> = ({\n  html,\n  styleLoadingText,\n  scriptLoadingText,\n  resetToken = 0,\n  mode = \"content\",\n  hasRootVhHeight = false,\n  stretchRootHeight = false,\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [isGeneratingStyles, setIsGeneratingStyles] = useState(false);\n  const [isGeneratingScripts, setIsGeneratingScripts] = useState(false);\n  const appendedStylesRef = useRef<HTMLStyleElement[]>([]);\n  const appendedScriptsRef = useRef<HTMLScriptElement[]>([]);\n  const styleStartRef = useRef(0);\n  const scriptStartRef = useRef(0);\n  const styleTimerRef = useRef<number | null>(null);\n  const scriptTimerRef = useRef<number | null>(null);\n  const hasStylesRef = useRef(false);\n  const hasScriptsRef = useRef(false);\n  const hasRenderedContentRef = useRef(false);\n  const prevResetTokenRef = useRef(resetToken);\n  const MIN_LOADING_MS = 200;\n\n  const clearTimer = (timerRef: React.MutableRefObject<number | null>) => {\n    if (timerRef.current) {\n      clearTimeout(timerRef.current);\n      timerRef.current = null;\n    }\n  };\n\n  const settleStateWithMinimumDelay = (\n    setter: React.Dispatch<React.SetStateAction<boolean>>,\n    timerRef: React.MutableRefObject<number | null>,\n    startRef: React.MutableRefObject<number>,\n    onDone?: () => void\n  ) => {\n    const elapsed = performance.now() - startRef.current;\n    const delay = Math.max(0, MIN_LOADING_MS - elapsed);\n    clearTimer(timerRef);\n    timerRef.current = window.setTimeout(() => {\n      setter(false);\n      onDone?.();\n      timerRef.current = null;\n    }, delay);\n  };\n\n  useEffect(() => {\n    const doc = containerRef.current?.ownerDocument;\n    if (!doc) return;\n    const styleId = \"sandbox-spinner-style\";\n    let styleEl = doc.getElementById(styleId) as HTMLStyleElement | null;\n    if (!styleEl) {\n      styleEl = doc.createElement(\"style\");\n      styleEl.id = styleId;\n      doc.head?.appendChild(styleEl);\n    }\n    styleEl.textContent = `\n      @keyframes sandbox-spin { from { transform: rotate(0deg);} to { transform: rotate(360deg);} }\n      .sandbox-wrapper { align-items: center; }\n      .sandbox-container { position: relative; width: 100%; }\n      .sandbox-container svg,\n      .sandbox-container img { display: block; margin-left: auto; margin-right: auto; }\n      .justify-\\\\[safe_center\\\\]{\n        justify-content: safe center;\n      }\n    `;\n  }, []);\n\n  useEffect(() => {\n    if (resetToken !== prevResetTokenRef.current) {\n      hasRenderedContentRef.current = false;\n      prevResetTokenRef.current = resetToken;\n    }\n    clearTimer(styleTimerRef);\n    clearTimer(scriptTimerRef);\n    hasStylesRef.current = false;\n    hasScriptsRef.current = false;\n\n    const container = containerRef.current;\n    if (!container) return;\n    const doc = container.ownerDocument;\n    const body = doc?.body;\n    if (!body) return;\n    const reusableImages = collectReusableImages(container);\n\n    appendedStylesRef.current.forEach((node) => node.remove());\n    appendedStylesRef.current = [];\n    appendedScriptsRef.current.forEach((node) => node.remove());\n    appendedScriptsRef.current = [];\n\n    // const hasRenderedBefore = hasRenderedContentRef.current;\n    setIsGeneratingStyles(false);\n    setIsGeneratingScripts(false);\n    const wrapper = doc.createElement(\"div\");\n    wrapper.innerHTML = html;\n\n    const openScriptCount = (html.match(/<script[\\s>]/gi) || []).length;\n    const closeScriptCount = (html.match(/<\\/script>/gi) || []).length;\n    const shouldExecuteScripts =\n      openScriptCount > 0 && openScriptCount === closeScriptCount;\n\n    const resourceQueue: HTMLElement[] = [];\n\n    Array.from(wrapper.querySelectorAll(\"style, script\")).forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        const cloned = doc.createElement(\"style\");\n        cloned.textContent = node.textContent || \"\";\n        Array.from(node.attributes).forEach((attr) => {\n          cloned.setAttribute(attr.name, attr.value);\n        });\n        resourceQueue.push(cloned);\n      } else {\n        const replacement = doc.createElement(\"script\");\n        Array.from(node.attributes).forEach((attr) => {\n          replacement.setAttribute(attr.name, attr.value);\n        });\n        replacement.textContent = node.textContent || \"\";\n        resourceQueue.push(replacement);\n      }\n      node.remove();\n    });\n    reuseRenderedImages(wrapper, reusableImages);\n\n    const hasStyles = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"style\"\n    );\n    const hasScripts = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"script\"\n    );\n    if (hasStyles) {\n      hasStylesRef.current = true;\n      styleStartRef.current = performance.now();\n      clearTimer(styleTimerRef);\n      setIsGeneratingStyles(true);\n    }\n    if (hasScripts) {\n      hasScriptsRef.current = true;\n      scriptStartRef.current = performance.now();\n      clearTimer(scriptTimerRef);\n      setIsGeneratingScripts(true);\n    }\n\n    const hasFirstElement = !!wrapper.firstElementChild;\n    if (hasFirstElement) {\n      hasRenderedContentRef.current = true;\n    }\n\n    const contentNodes = Array.from(wrapper.childNodes);\n    container.replaceChildren(...contentNodes);\n\n    resourceQueue.forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        doc.head?.appendChild(node);\n        appendedStylesRef.current.push(node as HTMLStyleElement);\n        return;\n      }\n\n      if (shouldExecuteScripts) {\n        const scriptNode = node as HTMLScriptElement;\n        const scriptText = scriptNode.textContent || \"\";\n        const shouldValidate = !scriptNode.src;\n\n        if (shouldValidate) {\n          try {\n            // Validate script is syntactically complete before executing\n\n            new Function(scriptText);\n          } catch {\n            scriptNode.remove();\n            return;\n          }\n        }\n\n        try {\n          body.appendChild(scriptNode);\n          appendedScriptsRef.current.push(scriptNode);\n        } catch {\n          scriptNode.remove();\n        }\n      } else {\n        // Defer execution until all script tags are fully received\n        node.remove();\n      }\n    });\n    requestAnimationFrame(() => {\n      if (hasStyles) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingStyles,\n          styleTimerRef,\n          styleStartRef,\n          () => {\n            hasStylesRef.current = false;\n          }\n        );\n      }\n      if (hasScripts) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingScripts,\n          scriptTimerRef,\n          scriptStartRef,\n          () => {\n            hasScriptsRef.current = false;\n          }\n        );\n      }\n    });\n  }, [html, resetToken]);\n\n  useEffect(\n    () => () => {\n      clearTimer(styleTimerRef);\n      clearTimer(scriptTimerRef);\n    },\n    []\n  );\n\n  const overlayMessage = (() => {\n    if (isGeneratingScripts || hasScriptsRef.current)\n      return scriptLoadingText || \"Building scripts cache...\";\n    if (isGeneratingStyles || hasStylesRef.current)\n      return styleLoadingText || \"Building styles...\";\n    return null;\n  })();\n\n  const isBlackboard = mode === \"blackboard\";\n  const shouldStretchRootHeight = isBlackboard && stretchRootHeight;\n  const sandboxWrapperStyle: React.CSSProperties = {\n    position: \"relative\",\n    width: \"100%\",\n    height: \"100%\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    // Keep blackboard scroll behavior while centering content in non-blackboard mode\n    justifyContent: shouldStretchRootHeight\n      ? \"flex-start\"\n      : isBlackboard\n        ? \"space-around\"\n        : \"flex-start\",\n  };\n  const sandboxContainerStyle: React.CSSProperties = {\n    pointerEvents: overlayMessage ? \"none\" : undefined,\n    margin: isBlackboard ? undefined : \"auto 0\",\n    width: \"100%\",\n    height: shouldStretchRootHeight ? \"100%\" : undefined,\n    minHeight: shouldStretchRootHeight ? 0 : undefined,\n    flex: shouldStretchRootHeight ? \"1 1 auto\" : undefined,\n  };\n\n  return (\n    <div\n      data-root-vh={hasRootVhHeight ? \"true\" : \"false\"}\n      className=\"sandbox-wrapper\"\n      style={sandboxWrapperStyle}\n      aria-busy={!!overlayMessage}\n    >\n      <div\n        ref={containerRef}\n        className=\"sandbox-container\"\n        style={sandboxContainerStyle}\n      />\n      {overlayMessage && (\n        <div\n          style={{\n            position: \"absolute\",\n            inset: 0,\n            display: \"flex\",\n            alignItems: \"center\",\n            justifyContent: \"center\",\n            background: \"rgba(51, 51, 51, 0.80)\",\n            color: \"#ffffff\",\n            fontSize: 16,\n            fontWeight: 700,\n            gap: 10,\n            pointerEvents: \"auto\",\n            zIndex: 20,\n          }}\n        >\n          <Loader2\n            aria-hidden\n            size={20}\n            style={{ animation: \"sandbox-spin 1s linear infinite\" }}\n          />\n          {overlayMessage}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default SandboxApp;\n"],"names":["IMAGE_REUSE_ATTRIBUTES","getImageReuseKey","image","attribute","collectReusableImages","root","imageMap","node","key","bucket","syncImageAttributes","sourceImage","targetImage","sourceAttributes","sourceAttributeNames","reuseRenderedImages","nextImage","preservedImage","SandboxApp","html","styleLoadingText","scriptLoadingText","resetToken","mode","hasRootVhHeight","stretchRootHeight","containerRef","useRef","isGeneratingStyles","setIsGeneratingStyles","useState","isGeneratingScripts","setIsGeneratingScripts","appendedStylesRef","appendedScriptsRef","styleStartRef","scriptStartRef","styleTimerRef","scriptTimerRef","hasStylesRef","hasScriptsRef","hasRenderedContentRef","prevResetTokenRef","MIN_LOADING_MS","clearTimer","timerRef","settleStateWithMinimumDelay","setter","startRef","onDone","elapsed","delay","useEffect","doc","styleId","styleEl","container","body","reusableImages","wrapper","openScriptCount","closeScriptCount","shouldExecuteScripts","resourceQueue","cloned","attr","replacement","hasStyles","hasScripts","contentNodes","scriptNode","scriptText","overlayMessage","isBlackboard","shouldStretchRootHeight","sandboxWrapperStyle","sandboxContainerStyle","jsxs","jsx","Loader2"],"mappings":"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"}
+{"version":3,"file":"SandboxApp.cjs.js","sources":["../../../src/components/ContentRender/SandboxApp.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport LoadingOverlayCard from \"../ui/loading-overlay-card\";\n\nexport interface SandboxAppProps {\n  html: string;\n  styleLoadingText?: string;\n  scriptLoadingText?: string;\n  resetToken?: number;\n  mode?: \"content\" | \"blackboard\";\n  hasRootVhHeight?: boolean;\n  stretchRootHeight?: boolean;\n}\n\nconst IMAGE_REUSE_ATTRIBUTES = [\n  \"src\",\n  \"srcset\",\n  \"sizes\",\n  \"alt\",\n  \"class\",\n  \"width\",\n  \"height\",\n  \"style\",\n  \"loading\",\n  \"decoding\",\n  \"crossorigin\",\n  \"referrerpolicy\",\n  \"fetchpriority\",\n];\n\nconst getImageReuseKey = (image: HTMLImageElement) =>\n  IMAGE_REUSE_ATTRIBUTES.map(\n    (attribute) => `${attribute}:${image.getAttribute(attribute) || \"\"}`\n  ).join(\"|\");\n\nconst collectReusableImages = (root: ParentNode) => {\n  const imageMap = new Map<string, HTMLImageElement[]>();\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const image = node as HTMLImageElement;\n    const key = getImageReuseKey(image);\n    const bucket = imageMap.get(key) || [];\n    bucket.push(image);\n    imageMap.set(key, bucket);\n  });\n  return imageMap;\n};\n\nconst syncImageAttributes = (\n  sourceImage: HTMLImageElement,\n  targetImage: HTMLImageElement\n) => {\n  const sourceAttributes = Array.from(sourceImage.attributes);\n  const sourceAttributeNames = new Set(\n    sourceAttributes.map((attribute) => attribute.name)\n  );\n\n  Array.from(targetImage.attributes).forEach((attribute) => {\n    if (!sourceAttributeNames.has(attribute.name)) {\n      targetImage.removeAttribute(attribute.name);\n    }\n  });\n\n  sourceAttributes.forEach((attribute) => {\n    targetImage.setAttribute(attribute.name, attribute.value);\n  });\n};\n\nconst reuseRenderedImages = (\n  root: ParentNode,\n  imageMap: Map<string, HTMLImageElement[]>\n) => {\n  if (!imageMap.size) return;\n\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const nextImage = node as HTMLImageElement;\n    const key = getImageReuseKey(nextImage);\n    const bucket = imageMap.get(key);\n    const preservedImage = bucket?.shift();\n    if (!preservedImage) return;\n\n    syncImageAttributes(nextImage, preservedImage);\n    nextImage.replaceWith(preservedImage);\n\n    if (bucket && bucket.length === 0) {\n      imageMap.delete(key);\n    }\n  });\n};\n\nconst SandboxApp: React.FC<SandboxAppProps> = ({\n  html,\n  styleLoadingText,\n  scriptLoadingText,\n  resetToken = 0,\n  mode = \"content\",\n  hasRootVhHeight = false,\n  stretchRootHeight = false,\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [isGeneratingStyles, setIsGeneratingStyles] = useState(false);\n  const [isGeneratingScripts, setIsGeneratingScripts] = useState(false);\n  const appendedStylesRef = useRef<HTMLStyleElement[]>([]);\n  const appendedScriptsRef = useRef<HTMLScriptElement[]>([]);\n  const styleStartRef = useRef(0);\n  const scriptStartRef = useRef(0);\n  const styleTimerRef = useRef<number | null>(null);\n  const scriptTimerRef = useRef<number | null>(null);\n  const hasStylesRef = useRef(false);\n  const hasScriptsRef = useRef(false);\n  const hasRenderedContentRef = useRef(false);\n  const prevResetTokenRef = useRef(resetToken);\n  const MIN_LOADING_MS = 200;\n\n  const clearTimer = (timerRef: React.MutableRefObject<number | null>) => {\n    if (timerRef.current) {\n      clearTimeout(timerRef.current);\n      timerRef.current = null;\n    }\n  };\n\n  const settleStateWithMinimumDelay = (\n    setter: React.Dispatch<React.SetStateAction<boolean>>,\n    timerRef: React.MutableRefObject<number | null>,\n    startRef: React.MutableRefObject<number>,\n    onDone?: () => void\n  ) => {\n    const elapsed = performance.now() - startRef.current;\n    const delay = Math.max(0, MIN_LOADING_MS - elapsed);\n    clearTimer(timerRef);\n    timerRef.current = window.setTimeout(() => {\n      setter(false);\n      onDone?.();\n      timerRef.current = null;\n    }, delay);\n  };\n\n  useEffect(() => {\n    const doc = containerRef.current?.ownerDocument;\n    if (!doc) return;\n    const styleId = \"sandbox-spinner-style\";\n    let styleEl = doc.getElementById(styleId) as HTMLStyleElement | null;\n    if (!styleEl) {\n      styleEl = doc.createElement(\"style\");\n      styleEl.id = styleId;\n      doc.head?.appendChild(styleEl);\n    }\n    styleEl.textContent = `\n      .sandbox-wrapper { align-items: center; }\n      .sandbox-container { position: relative; width: 100%; }\n      .sandbox-container svg,\n      .sandbox-container img { display: block; margin-left: auto; margin-right: auto; }\n      .justify-\\\\[safe_center\\\\]{\n        justify-content: safe center;\n      }\n    `;\n  }, []);\n\n  useEffect(() => {\n    if (resetToken !== prevResetTokenRef.current) {\n      hasRenderedContentRef.current = false;\n      prevResetTokenRef.current = resetToken;\n    }\n    clearTimer(styleTimerRef);\n    clearTimer(scriptTimerRef);\n    hasStylesRef.current = false;\n    hasScriptsRef.current = false;\n\n    const container = containerRef.current;\n    if (!container) return;\n    const doc = container.ownerDocument;\n    const body = doc?.body;\n    if (!body) return;\n    const reusableImages = collectReusableImages(container);\n\n    appendedStylesRef.current.forEach((node) => node.remove());\n    appendedStylesRef.current = [];\n    appendedScriptsRef.current.forEach((node) => node.remove());\n    appendedScriptsRef.current = [];\n\n    // const hasRenderedBefore = hasRenderedContentRef.current;\n    setIsGeneratingStyles(false);\n    setIsGeneratingScripts(false);\n    const wrapper = doc.createElement(\"div\");\n    wrapper.innerHTML = html;\n\n    const openScriptCount = (html.match(/<script[\\s>]/gi) || []).length;\n    const closeScriptCount = (html.match(/<\\/script>/gi) || []).length;\n    const shouldExecuteScripts =\n      openScriptCount > 0 && openScriptCount === closeScriptCount;\n\n    const resourceQueue: HTMLElement[] = [];\n\n    Array.from(wrapper.querySelectorAll(\"style, script\")).forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        const cloned = doc.createElement(\"style\");\n        cloned.textContent = node.textContent || \"\";\n        Array.from(node.attributes).forEach((attr) => {\n          cloned.setAttribute(attr.name, attr.value);\n        });\n        resourceQueue.push(cloned);\n      } else {\n        const replacement = doc.createElement(\"script\");\n        Array.from(node.attributes).forEach((attr) => {\n          replacement.setAttribute(attr.name, attr.value);\n        });\n        replacement.textContent = node.textContent || \"\";\n        resourceQueue.push(replacement);\n      }\n      node.remove();\n    });\n    reuseRenderedImages(wrapper, reusableImages);\n\n    const hasStyles = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"style\"\n    );\n    const hasScripts = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"script\"\n    );\n    if (hasStyles) {\n      hasStylesRef.current = true;\n      styleStartRef.current = performance.now();\n      clearTimer(styleTimerRef);\n      setIsGeneratingStyles(true);\n    }\n    if (hasScripts) {\n      hasScriptsRef.current = true;\n      scriptStartRef.current = performance.now();\n      clearTimer(scriptTimerRef);\n      setIsGeneratingScripts(true);\n    }\n\n    const hasFirstElement = !!wrapper.firstElementChild;\n    if (hasFirstElement) {\n      hasRenderedContentRef.current = true;\n    }\n\n    const contentNodes = Array.from(wrapper.childNodes);\n    container.replaceChildren(...contentNodes);\n\n    resourceQueue.forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        doc.head?.appendChild(node);\n        appendedStylesRef.current.push(node as HTMLStyleElement);\n        return;\n      }\n\n      if (shouldExecuteScripts) {\n        const scriptNode = node as HTMLScriptElement;\n        const scriptText = scriptNode.textContent || \"\";\n        const shouldValidate = !scriptNode.src;\n\n        if (shouldValidate) {\n          try {\n            // Validate script is syntactically complete before executing\n\n            new Function(scriptText);\n          } catch {\n            scriptNode.remove();\n            return;\n          }\n        }\n\n        try {\n          body.appendChild(scriptNode);\n          appendedScriptsRef.current.push(scriptNode);\n        } catch {\n          scriptNode.remove();\n        }\n      } else {\n        // Defer execution until all script tags are fully received\n        node.remove();\n      }\n    });\n    requestAnimationFrame(() => {\n      if (hasStyles) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingStyles,\n          styleTimerRef,\n          styleStartRef,\n          () => {\n            hasStylesRef.current = false;\n          }\n        );\n      }\n      if (hasScripts) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingScripts,\n          scriptTimerRef,\n          scriptStartRef,\n          () => {\n            hasScriptsRef.current = false;\n          }\n        );\n      }\n    });\n  }, [html, resetToken]);\n\n  useEffect(\n    () => () => {\n      clearTimer(styleTimerRef);\n      clearTimer(scriptTimerRef);\n    },\n    []\n  );\n\n  const overlayMessage = (() => {\n    if (isGeneratingScripts || hasScriptsRef.current)\n      return scriptLoadingText || \"Building scripts cache...\";\n    if (isGeneratingStyles || hasStylesRef.current)\n      return styleLoadingText || \"Building styles...\";\n    return null;\n  })();\n\n  const isBlackboard = mode === \"blackboard\";\n  const shouldStretchRootHeight = isBlackboard && stretchRootHeight;\n  const sandboxWrapperStyle: React.CSSProperties = {\n    position: \"relative\",\n    width: \"100%\",\n    height: \"100%\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    // Keep blackboard scroll behavior while centering content in non-blackboard mode\n    justifyContent: shouldStretchRootHeight\n      ? \"flex-start\"\n      : isBlackboard\n        ? \"space-around\"\n        : \"flex-start\",\n  };\n  const sandboxContainerStyle: React.CSSProperties = {\n    pointerEvents: overlayMessage ? \"none\" : undefined,\n    margin: isBlackboard ? undefined : \"auto 0\",\n    width: \"100%\",\n    height: shouldStretchRootHeight ? \"100%\" : undefined,\n    minHeight: shouldStretchRootHeight ? 0 : undefined,\n    flex: shouldStretchRootHeight ? \"1 1 auto\" : undefined,\n  };\n\n  return (\n    <div\n      data-root-vh={hasRootVhHeight ? \"true\" : \"false\"}\n      className=\"sandbox-wrapper\"\n      style={sandboxWrapperStyle}\n      aria-busy={!!overlayMessage}\n    >\n      <div\n        ref={containerRef}\n        className=\"sandbox-container\"\n        style={sandboxContainerStyle}\n      />\n      {overlayMessage && (\n        <div\n          style={{\n            position: \"absolute\",\n            inset: 0,\n            zIndex: 20,\n            display: \"flex\",\n            alignItems: \"center\",\n            justifyContent: \"center\",\n            pointerEvents: \"none\",\n          }}\n        >\n          <LoadingOverlayCard message={overlayMessage} />\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default SandboxApp;\n"],"names":["IMAGE_REUSE_ATTRIBUTES","getImageReuseKey","image","attribute","collectReusableImages","root","imageMap","node","key","bucket","syncImageAttributes","sourceImage","targetImage","sourceAttributes","sourceAttributeNames","reuseRenderedImages","nextImage","preservedImage","SandboxApp","html","styleLoadingText","scriptLoadingText","resetToken","mode","hasRootVhHeight","stretchRootHeight","containerRef","useRef","isGeneratingStyles","setIsGeneratingStyles","useState","isGeneratingScripts","setIsGeneratingScripts","appendedStylesRef","appendedScriptsRef","styleStartRef","scriptStartRef","styleTimerRef","scriptTimerRef","hasStylesRef","hasScriptsRef","hasRenderedContentRef","prevResetTokenRef","MIN_LOADING_MS","clearTimer","timerRef","settleStateWithMinimumDelay","setter","startRef","onDone","elapsed","delay","useEffect","doc","styleId","styleEl","container","body","reusableImages","wrapper","openScriptCount","closeScriptCount","shouldExecuteScripts","resourceQueue","cloned","attr","replacement","hasStyles","hasScripts","contentNodes","scriptNode","scriptText","overlayMessage","isBlackboard","shouldStretchRootHeight","sandboxWrapperStyle","sandboxContainerStyle","jsxs","jsx","LoadingOverlayCard"],"mappings":"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"}

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

@@ -1,6 +1,6 @@
 import { j as C } from "../../_virtual/jsx-runtime.es.js";
-import { useRef as i, useState as F, useEffect as L } from "react";
-import P from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/loader-circle.es.js";
+import { useRef as i, useState as z, useEffect as M } from "react";
+import P from "../ui/loading-overlay-card.es.js";
 const X = [
   "src",
   "srcset",
@@ -15,12 +15,12 @@ const X = [
   "crossorigin",
   "referrerpolicy",
   "fetchpriority"
-], W = (c) => X.map(
+], H = (c) => X.map(
   (t) => `${t}:${c.getAttribute(t) || ""}`
 ).join("|"), Y = (c) => {
   const t = /* @__PURE__ */ new Map();
   return c.querySelectorAll("img").forEach((u) => {
-    const o = u, r = W(o), f = t.get(r) || [];
+    const o = u, r = H(o), f = t.get(r) || [];
     f.push(o), t.set(r, f);
   }), t;
 }, Z = (c, t) => {
@@ -34,7 +34,7 @@ const X = [
   });
 }, ee = (c, t) => {
   t.size && c.querySelectorAll("img").forEach((u) => {
-    const o = u, r = W(o), f = t.get(r), h = f?.shift();
+    const o = u, r = H(o), f = t.get(r), h = f?.shift();
     h && (Z(o, h), o.replaceWith(h), f && f.length === 0 && t.delete(r));
   });
 }, ce = ({
@@ -46,21 +46,20 @@ const X = [
   hasRootVhHeight: f = !1,
   stretchRootHeight: h = !1
 }) => {
-  const w = i(null), [H, R] = F(!1), [U, I] = F(!1), N = i([]), j = i([]), M = i(0), G = i(0), g = i(null), x = i(null), b = i(!1), S = i(!1), z = i(!1), B = i(o), V = 200, d = (n) => {
-    n.current && (clearTimeout(n.current), n.current = null);
-  }, D = (n, a, l, k) => {
-    const m = performance.now() - l.current, A = Math.max(0, V - m);
+  const w = i(null), [W, R] = z(!1), [O, I] = z(!1), N = i([]), j = i([]), G = i(0), k = i(0), g = i(null), x = i(null), b = i(!1), v = i(!1), B = i(!1), D = i(o), U = 200, d = (s) => {
+    s.current && (clearTimeout(s.current), s.current = null);
+  }, _ = (s, a, l, L) => {
+    const m = performance.now() - l.current, A = Math.max(0, U - m);
     d(a), a.current = window.setTimeout(() => {
-      n(!1), k?.(), a.current = null;
+      s(!1), L?.(), a.current = null;
     }, A);
   };
-  L(() => {
-    const n = w.current?.ownerDocument;
-    if (!n) return;
+  M(() => {
+    const s = w.current?.ownerDocument;
+    if (!s) return;
     const a = "sandbox-spinner-style";
-    let l = n.getElementById(a);
-    l || (l = n.createElement("style"), l.id = a, n.head?.appendChild(l)), l.textContent = `
-      @keyframes sandbox-spin { from { transform: rotate(0deg);} to { transform: rotate(360deg);} }
+    let l = s.getElementById(a);
+    l || (l = s.createElement("style"), l.id = a, s.head?.appendChild(l)), l.textContent = `
       .sandbox-wrapper { align-items: center; }
       .sandbox-container { position: relative; width: 100%; }
       .sandbox-container svg,
@@ -69,142 +68,127 @@ const X = [
         justify-content: safe center;
       }
     `;
-  }, []), L(() => {
-    o !== B.current && (z.current = !1, B.current = o), d(g), d(x), b.current = !1, S.current = !1;
-    const n = w.current;
-    if (!n) return;
-    const a = n.ownerDocument, l = a?.body;
+  }, []), M(() => {
+    o !== D.current && (B.current = !1, D.current = o), d(g), d(x), b.current = !1, v.current = !1;
+    const s = w.current;
+    if (!s) return;
+    const a = s.ownerDocument, l = a?.body;
     if (!l) return;
-    const k = Y(n);
+    const L = Y(s);
     N.current.forEach((e) => e.remove()), N.current = [], j.current.forEach((e) => e.remove()), j.current = [], R(!1), I(!1);
     const m = a.createElement("div");
     m.innerHTML = c;
-    const A = (c.match(/<script[\s>]/gi) || []).length, O = (c.match(/<\/script>/gi) || []).length, Q = A > 0 && A === O, y = [];
+    const A = (c.match(/<script[\s>]/gi) || []).length, K = (c.match(/<\/script>/gi) || []).length, Q = A > 0 && A === K, y = [];
     Array.from(m.querySelectorAll("style, script")).forEach((e) => {
       if (e.tagName.toLowerCase() === "style") {
-        const s = a.createElement("style");
-        s.textContent = e.textContent || "", Array.from(e.attributes).forEach((p) => {
-          s.setAttribute(p.name, p.value);
-        }), y.push(s);
+        const n = a.createElement("style");
+        n.textContent = e.textContent || "", Array.from(e.attributes).forEach((p) => {
+          n.setAttribute(p.name, p.value);
+        }), y.push(n);
       } else {
-        const s = a.createElement("script");
+        const n = a.createElement("script");
         Array.from(e.attributes).forEach((p) => {
-          s.setAttribute(p.name, p.value);
-        }), s.textContent = e.textContent || "", y.push(s);
+          n.setAttribute(p.name, p.value);
+        }), n.textContent = e.textContent || "", y.push(n);
       }
       e.remove();
-    }), ee(m, k);
-    const _ = y.some(
+    }), ee(m, L);
+    const q = y.some(
       (e) => e.tagName.toLowerCase() === "style"
-    ), q = y.some(
+    ), F = y.some(
       (e) => e.tagName.toLowerCase() === "script"
     );
-    _ && (b.current = !0, M.current = performance.now(), d(g), R(!0)), q && (S.current = !0, G.current = performance.now(), d(x), I(!0)), !!m.firstElementChild && (z.current = !0);
+    q && (b.current = !0, G.current = performance.now(), d(g), R(!0)), F && (v.current = !0, k.current = performance.now(), d(x), I(!0)), !!m.firstElementChild && (B.current = !0);
     const J = Array.from(m.childNodes);
-    n.replaceChildren(...J), y.forEach((e) => {
+    s.replaceChildren(...J), y.forEach((e) => {
       if (e.tagName.toLowerCase() === "style") {
         a.head?.appendChild(e), N.current.push(e);
         return;
       }
       if (Q) {
-        const s = e, p = s.textContent || "";
-        if (!s.src)
+        const n = e, p = n.textContent || "";
+        if (!n.src)
           try {
             new Function(p);
           } catch {
-            s.remove();
+            n.remove();
             return;
           }
         try {
-          l.appendChild(s), j.current.push(s);
+          l.appendChild(n), j.current.push(n);
         } catch {
-          s.remove();
+          n.remove();
         }
       } else
         e.remove();
     }), requestAnimationFrame(() => {
-      _ && D(
+      q && _(
         R,
         g,
-        M,
+        G,
         () => {
           b.current = !1;
         }
-      ), q && D(
+      ), F && _(
         I,
         x,
-        G,
+        k,
         () => {
-          S.current = !1;
+          v.current = !1;
         }
       );
     });
-  }, [c, o]), L(
+  }, [c, o]), M(
     () => () => {
       d(g), d(x);
     },
     []
   );
-  const v = U || S.current ? u || "Building scripts cache..." : H || b.current ? t || "Building styles..." : null, T = r === "blackboard", E = T && h, $ = {
+  const E = O || v.current ? u || "Building scripts cache..." : W || b.current ? t || "Building styles..." : null, T = r === "blackboard", S = T && h, V = {
     position: "relative",
     width: "100%",
     height: "100%",
     display: "flex",
     flexDirection: "column",
     // Keep blackboard scroll behavior while centering content in non-blackboard mode
-    justifyContent: E ? "flex-start" : T ? "space-around" : "flex-start"
-  }, K = {
-    pointerEvents: v ? "none" : void 0,
+    justifyContent: S ? "flex-start" : T ? "space-around" : "flex-start"
+  }, $ = {
+    pointerEvents: E ? "none" : void 0,
     margin: T ? void 0 : "auto 0",
     width: "100%",
-    height: E ? "100%" : void 0,
-    minHeight: E ? 0 : void 0,
-    flex: E ? "1 1 auto" : void 0
+    height: S ? "100%" : void 0,
+    minHeight: S ? 0 : void 0,
+    flex: S ? "1 1 auto" : void 0
   };
   return /* @__PURE__ */ C.jsxs(
     "div",
     {
       "data-root-vh": f ? "true" : "false",
       className: "sandbox-wrapper",
-      style: $,
-      "aria-busy": !!v,
+      style: V,
+      "aria-busy": !!E,
       children: [
         /* @__PURE__ */ C.jsx(
           "div",
           {
             ref: w,
             className: "sandbox-container",
-            style: K
+            style: $
           }
         ),
-        v && /* @__PURE__ */ C.jsxs(
+        E && /* @__PURE__ */ C.jsx(
           "div",
           {
             style: {
               position: "absolute",
               inset: 0,
+              zIndex: 20,
               display: "flex",
               alignItems: "center",
               justifyContent: "center",
-              background: "rgba(51, 51, 51, 0.80)",
-              color: "#ffffff",
-              fontSize: 16,
-              fontWeight: 700,
-              gap: 10,
-              pointerEvents: "auto",
-              zIndex: 20
+              pointerEvents: "none"
             },
-            children: [
-              /* @__PURE__ */ C.jsx(
-                P,
-                {
-                  "aria-hidden": !0,
-                  size: 20,
-                  style: { animation: "sandbox-spin 1s linear infinite" }
-                }
-              ),
-              v
-            ]
+            children: /* @__PURE__ */ C.jsx(P, { message: E })
           }
         )
       ]

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

@@ -1 +1 @@
-{"version":3,"file":"SandboxApp.es.js","sources":["../../../src/components/ContentRender/SandboxApp.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { Loader2 } from \"lucide-react\";\n\nexport interface SandboxAppProps {\n  html: string;\n  styleLoadingText?: string;\n  scriptLoadingText?: string;\n  resetToken?: number;\n  mode?: \"content\" | \"blackboard\";\n  hasRootVhHeight?: boolean;\n  stretchRootHeight?: boolean;\n}\n\nconst IMAGE_REUSE_ATTRIBUTES = [\n  \"src\",\n  \"srcset\",\n  \"sizes\",\n  \"alt\",\n  \"class\",\n  \"width\",\n  \"height\",\n  \"style\",\n  \"loading\",\n  \"decoding\",\n  \"crossorigin\",\n  \"referrerpolicy\",\n  \"fetchpriority\",\n];\n\nconst getImageReuseKey = (image: HTMLImageElement) =>\n  IMAGE_REUSE_ATTRIBUTES.map(\n    (attribute) => `${attribute}:${image.getAttribute(attribute) || \"\"}`\n  ).join(\"|\");\n\nconst collectReusableImages = (root: ParentNode) => {\n  const imageMap = new Map<string, HTMLImageElement[]>();\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const image = node as HTMLImageElement;\n    const key = getImageReuseKey(image);\n    const bucket = imageMap.get(key) || [];\n    bucket.push(image);\n    imageMap.set(key, bucket);\n  });\n  return imageMap;\n};\n\nconst syncImageAttributes = (\n  sourceImage: HTMLImageElement,\n  targetImage: HTMLImageElement\n) => {\n  const sourceAttributes = Array.from(sourceImage.attributes);\n  const sourceAttributeNames = new Set(\n    sourceAttributes.map((attribute) => attribute.name)\n  );\n\n  Array.from(targetImage.attributes).forEach((attribute) => {\n    if (!sourceAttributeNames.has(attribute.name)) {\n      targetImage.removeAttribute(attribute.name);\n    }\n  });\n\n  sourceAttributes.forEach((attribute) => {\n    targetImage.setAttribute(attribute.name, attribute.value);\n  });\n};\n\nconst reuseRenderedImages = (\n  root: ParentNode,\n  imageMap: Map<string, HTMLImageElement[]>\n) => {\n  if (!imageMap.size) return;\n\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const nextImage = node as HTMLImageElement;\n    const key = getImageReuseKey(nextImage);\n    const bucket = imageMap.get(key);\n    const preservedImage = bucket?.shift();\n    if (!preservedImage) return;\n\n    syncImageAttributes(nextImage, preservedImage);\n    nextImage.replaceWith(preservedImage);\n\n    if (bucket && bucket.length === 0) {\n      imageMap.delete(key);\n    }\n  });\n};\n\nconst SandboxApp: React.FC<SandboxAppProps> = ({\n  html,\n  styleLoadingText,\n  scriptLoadingText,\n  resetToken = 0,\n  mode = \"content\",\n  hasRootVhHeight = false,\n  stretchRootHeight = false,\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [isGeneratingStyles, setIsGeneratingStyles] = useState(false);\n  const [isGeneratingScripts, setIsGeneratingScripts] = useState(false);\n  const appendedStylesRef = useRef<HTMLStyleElement[]>([]);\n  const appendedScriptsRef = useRef<HTMLScriptElement[]>([]);\n  const styleStartRef = useRef(0);\n  const scriptStartRef = useRef(0);\n  const styleTimerRef = useRef<number | null>(null);\n  const scriptTimerRef = useRef<number | null>(null);\n  const hasStylesRef = useRef(false);\n  const hasScriptsRef = useRef(false);\n  const hasRenderedContentRef = useRef(false);\n  const prevResetTokenRef = useRef(resetToken);\n  const MIN_LOADING_MS = 200;\n\n  const clearTimer = (timerRef: React.MutableRefObject<number | null>) => {\n    if (timerRef.current) {\n      clearTimeout(timerRef.current);\n      timerRef.current = null;\n    }\n  };\n\n  const settleStateWithMinimumDelay = (\n    setter: React.Dispatch<React.SetStateAction<boolean>>,\n    timerRef: React.MutableRefObject<number | null>,\n    startRef: React.MutableRefObject<number>,\n    onDone?: () => void\n  ) => {\n    const elapsed = performance.now() - startRef.current;\n    const delay = Math.max(0, MIN_LOADING_MS - elapsed);\n    clearTimer(timerRef);\n    timerRef.current = window.setTimeout(() => {\n      setter(false);\n      onDone?.();\n      timerRef.current = null;\n    }, delay);\n  };\n\n  useEffect(() => {\n    const doc = containerRef.current?.ownerDocument;\n    if (!doc) return;\n    const styleId = \"sandbox-spinner-style\";\n    let styleEl = doc.getElementById(styleId) as HTMLStyleElement | null;\n    if (!styleEl) {\n      styleEl = doc.createElement(\"style\");\n      styleEl.id = styleId;\n      doc.head?.appendChild(styleEl);\n    }\n    styleEl.textContent = `\n      @keyframes sandbox-spin { from { transform: rotate(0deg);} to { transform: rotate(360deg);} }\n      .sandbox-wrapper { align-items: center; }\n      .sandbox-container { position: relative; width: 100%; }\n      .sandbox-container svg,\n      .sandbox-container img { display: block; margin-left: auto; margin-right: auto; }\n      .justify-\\\\[safe_center\\\\]{\n        justify-content: safe center;\n      }\n    `;\n  }, []);\n\n  useEffect(() => {\n    if (resetToken !== prevResetTokenRef.current) {\n      hasRenderedContentRef.current = false;\n      prevResetTokenRef.current = resetToken;\n    }\n    clearTimer(styleTimerRef);\n    clearTimer(scriptTimerRef);\n    hasStylesRef.current = false;\n    hasScriptsRef.current = false;\n\n    const container = containerRef.current;\n    if (!container) return;\n    const doc = container.ownerDocument;\n    const body = doc?.body;\n    if (!body) return;\n    const reusableImages = collectReusableImages(container);\n\n    appendedStylesRef.current.forEach((node) => node.remove());\n    appendedStylesRef.current = [];\n    appendedScriptsRef.current.forEach((node) => node.remove());\n    appendedScriptsRef.current = [];\n\n    // const hasRenderedBefore = hasRenderedContentRef.current;\n    setIsGeneratingStyles(false);\n    setIsGeneratingScripts(false);\n    const wrapper = doc.createElement(\"div\");\n    wrapper.innerHTML = html;\n\n    const openScriptCount = (html.match(/<script[\\s>]/gi) || []).length;\n    const closeScriptCount = (html.match(/<\\/script>/gi) || []).length;\n    const shouldExecuteScripts =\n      openScriptCount > 0 && openScriptCount === closeScriptCount;\n\n    const resourceQueue: HTMLElement[] = [];\n\n    Array.from(wrapper.querySelectorAll(\"style, script\")).forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        const cloned = doc.createElement(\"style\");\n        cloned.textContent = node.textContent || \"\";\n        Array.from(node.attributes).forEach((attr) => {\n          cloned.setAttribute(attr.name, attr.value);\n        });\n        resourceQueue.push(cloned);\n      } else {\n        const replacement = doc.createElement(\"script\");\n        Array.from(node.attributes).forEach((attr) => {\n          replacement.setAttribute(attr.name, attr.value);\n        });\n        replacement.textContent = node.textContent || \"\";\n        resourceQueue.push(replacement);\n      }\n      node.remove();\n    });\n    reuseRenderedImages(wrapper, reusableImages);\n\n    const hasStyles = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"style\"\n    );\n    const hasScripts = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"script\"\n    );\n    if (hasStyles) {\n      hasStylesRef.current = true;\n      styleStartRef.current = performance.now();\n      clearTimer(styleTimerRef);\n      setIsGeneratingStyles(true);\n    }\n    if (hasScripts) {\n      hasScriptsRef.current = true;\n      scriptStartRef.current = performance.now();\n      clearTimer(scriptTimerRef);\n      setIsGeneratingScripts(true);\n    }\n\n    const hasFirstElement = !!wrapper.firstElementChild;\n    if (hasFirstElement) {\n      hasRenderedContentRef.current = true;\n    }\n\n    const contentNodes = Array.from(wrapper.childNodes);\n    container.replaceChildren(...contentNodes);\n\n    resourceQueue.forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        doc.head?.appendChild(node);\n        appendedStylesRef.current.push(node as HTMLStyleElement);\n        return;\n      }\n\n      if (shouldExecuteScripts) {\n        const scriptNode = node as HTMLScriptElement;\n        const scriptText = scriptNode.textContent || \"\";\n        const shouldValidate = !scriptNode.src;\n\n        if (shouldValidate) {\n          try {\n            // Validate script is syntactically complete before executing\n\n            new Function(scriptText);\n          } catch {\n            scriptNode.remove();\n            return;\n          }\n        }\n\n        try {\n          body.appendChild(scriptNode);\n          appendedScriptsRef.current.push(scriptNode);\n        } catch {\n          scriptNode.remove();\n        }\n      } else {\n        // Defer execution until all script tags are fully received\n        node.remove();\n      }\n    });\n    requestAnimationFrame(() => {\n      if (hasStyles) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingStyles,\n          styleTimerRef,\n          styleStartRef,\n          () => {\n            hasStylesRef.current = false;\n          }\n        );\n      }\n      if (hasScripts) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingScripts,\n          scriptTimerRef,\n          scriptStartRef,\n          () => {\n            hasScriptsRef.current = false;\n          }\n        );\n      }\n    });\n  }, [html, resetToken]);\n\n  useEffect(\n    () => () => {\n      clearTimer(styleTimerRef);\n      clearTimer(scriptTimerRef);\n    },\n    []\n  );\n\n  const overlayMessage = (() => {\n    if (isGeneratingScripts || hasScriptsRef.current)\n      return scriptLoadingText || \"Building scripts cache...\";\n    if (isGeneratingStyles || hasStylesRef.current)\n      return styleLoadingText || \"Building styles...\";\n    return null;\n  })();\n\n  const isBlackboard = mode === \"blackboard\";\n  const shouldStretchRootHeight = isBlackboard && stretchRootHeight;\n  const sandboxWrapperStyle: React.CSSProperties = {\n    position: \"relative\",\n    width: \"100%\",\n    height: \"100%\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    // Keep blackboard scroll behavior while centering content in non-blackboard mode\n    justifyContent: shouldStretchRootHeight\n      ? \"flex-start\"\n      : isBlackboard\n        ? \"space-around\"\n        : \"flex-start\",\n  };\n  const sandboxContainerStyle: React.CSSProperties = {\n    pointerEvents: overlayMessage ? \"none\" : undefined,\n    margin: isBlackboard ? undefined : \"auto 0\",\n    width: \"100%\",\n    height: shouldStretchRootHeight ? \"100%\" : undefined,\n    minHeight: shouldStretchRootHeight ? 0 : undefined,\n    flex: shouldStretchRootHeight ? \"1 1 auto\" : undefined,\n  };\n\n  return (\n    <div\n      data-root-vh={hasRootVhHeight ? \"true\" : \"false\"}\n      className=\"sandbox-wrapper\"\n      style={sandboxWrapperStyle}\n      aria-busy={!!overlayMessage}\n    >\n      <div\n        ref={containerRef}\n        className=\"sandbox-container\"\n        style={sandboxContainerStyle}\n      />\n      {overlayMessage && (\n        <div\n          style={{\n            position: \"absolute\",\n            inset: 0,\n            display: \"flex\",\n            alignItems: \"center\",\n            justifyContent: \"center\",\n            background: \"rgba(51, 51, 51, 0.80)\",\n            color: \"#ffffff\",\n            fontSize: 16,\n            fontWeight: 700,\n            gap: 10,\n            pointerEvents: \"auto\",\n            zIndex: 20,\n          }}\n        >\n          <Loader2\n            aria-hidden\n            size={20}\n            style={{ animation: \"sandbox-spin 1s linear infinite\" }}\n          />\n          {overlayMessage}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default SandboxApp;\n"],"names":["IMAGE_REUSE_ATTRIBUTES","getImageReuseKey","image","attribute","collectReusableImages","root","imageMap","node","key","bucket","syncImageAttributes","sourceImage","targetImage","sourceAttributes","sourceAttributeNames","reuseRenderedImages","nextImage","preservedImage","SandboxApp","html","styleLoadingText","scriptLoadingText","resetToken","mode","hasRootVhHeight","stretchRootHeight","containerRef","useRef","isGeneratingStyles","setIsGeneratingStyles","useState","isGeneratingScripts","setIsGeneratingScripts","appendedStylesRef","appendedScriptsRef","styleStartRef","scriptStartRef","styleTimerRef","scriptTimerRef","hasStylesRef","hasScriptsRef","hasRenderedContentRef","prevResetTokenRef","MIN_LOADING_MS","clearTimer","timerRef","settleStateWithMinimumDelay","setter","startRef","onDone","elapsed","delay","useEffect","doc","styleId","styleEl","container","body","reusableImages","wrapper","openScriptCount","closeScriptCount","shouldExecuteScripts","resourceQueue","cloned","attr","replacement","hasStyles","hasScripts","contentNodes","scriptNode","scriptText","overlayMessage","isBlackboard","shouldStretchRootHeight","sandboxWrapperStyle","sandboxContainerStyle","jsxs","jsx","Loader2"],"mappings":"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"}
+{"version":3,"file":"SandboxApp.es.js","sources":["../../../src/components/ContentRender/SandboxApp.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport LoadingOverlayCard from \"../ui/loading-overlay-card\";\n\nexport interface SandboxAppProps {\n  html: string;\n  styleLoadingText?: string;\n  scriptLoadingText?: string;\n  resetToken?: number;\n  mode?: \"content\" | \"blackboard\";\n  hasRootVhHeight?: boolean;\n  stretchRootHeight?: boolean;\n}\n\nconst IMAGE_REUSE_ATTRIBUTES = [\n  \"src\",\n  \"srcset\",\n  \"sizes\",\n  \"alt\",\n  \"class\",\n  \"width\",\n  \"height\",\n  \"style\",\n  \"loading\",\n  \"decoding\",\n  \"crossorigin\",\n  \"referrerpolicy\",\n  \"fetchpriority\",\n];\n\nconst getImageReuseKey = (image: HTMLImageElement) =>\n  IMAGE_REUSE_ATTRIBUTES.map(\n    (attribute) => `${attribute}:${image.getAttribute(attribute) || \"\"}`\n  ).join(\"|\");\n\nconst collectReusableImages = (root: ParentNode) => {\n  const imageMap = new Map<string, HTMLImageElement[]>();\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const image = node as HTMLImageElement;\n    const key = getImageReuseKey(image);\n    const bucket = imageMap.get(key) || [];\n    bucket.push(image);\n    imageMap.set(key, bucket);\n  });\n  return imageMap;\n};\n\nconst syncImageAttributes = (\n  sourceImage: HTMLImageElement,\n  targetImage: HTMLImageElement\n) => {\n  const sourceAttributes = Array.from(sourceImage.attributes);\n  const sourceAttributeNames = new Set(\n    sourceAttributes.map((attribute) => attribute.name)\n  );\n\n  Array.from(targetImage.attributes).forEach((attribute) => {\n    if (!sourceAttributeNames.has(attribute.name)) {\n      targetImage.removeAttribute(attribute.name);\n    }\n  });\n\n  sourceAttributes.forEach((attribute) => {\n    targetImage.setAttribute(attribute.name, attribute.value);\n  });\n};\n\nconst reuseRenderedImages = (\n  root: ParentNode,\n  imageMap: Map<string, HTMLImageElement[]>\n) => {\n  if (!imageMap.size) return;\n\n  root.querySelectorAll(\"img\").forEach((node) => {\n    const nextImage = node as HTMLImageElement;\n    const key = getImageReuseKey(nextImage);\n    const bucket = imageMap.get(key);\n    const preservedImage = bucket?.shift();\n    if (!preservedImage) return;\n\n    syncImageAttributes(nextImage, preservedImage);\n    nextImage.replaceWith(preservedImage);\n\n    if (bucket && bucket.length === 0) {\n      imageMap.delete(key);\n    }\n  });\n};\n\nconst SandboxApp: React.FC<SandboxAppProps> = ({\n  html,\n  styleLoadingText,\n  scriptLoadingText,\n  resetToken = 0,\n  mode = \"content\",\n  hasRootVhHeight = false,\n  stretchRootHeight = false,\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [isGeneratingStyles, setIsGeneratingStyles] = useState(false);\n  const [isGeneratingScripts, setIsGeneratingScripts] = useState(false);\n  const appendedStylesRef = useRef<HTMLStyleElement[]>([]);\n  const appendedScriptsRef = useRef<HTMLScriptElement[]>([]);\n  const styleStartRef = useRef(0);\n  const scriptStartRef = useRef(0);\n  const styleTimerRef = useRef<number | null>(null);\n  const scriptTimerRef = useRef<number | null>(null);\n  const hasStylesRef = useRef(false);\n  const hasScriptsRef = useRef(false);\n  const hasRenderedContentRef = useRef(false);\n  const prevResetTokenRef = useRef(resetToken);\n  const MIN_LOADING_MS = 200;\n\n  const clearTimer = (timerRef: React.MutableRefObject<number | null>) => {\n    if (timerRef.current) {\n      clearTimeout(timerRef.current);\n      timerRef.current = null;\n    }\n  };\n\n  const settleStateWithMinimumDelay = (\n    setter: React.Dispatch<React.SetStateAction<boolean>>,\n    timerRef: React.MutableRefObject<number | null>,\n    startRef: React.MutableRefObject<number>,\n    onDone?: () => void\n  ) => {\n    const elapsed = performance.now() - startRef.current;\n    const delay = Math.max(0, MIN_LOADING_MS - elapsed);\n    clearTimer(timerRef);\n    timerRef.current = window.setTimeout(() => {\n      setter(false);\n      onDone?.();\n      timerRef.current = null;\n    }, delay);\n  };\n\n  useEffect(() => {\n    const doc = containerRef.current?.ownerDocument;\n    if (!doc) return;\n    const styleId = \"sandbox-spinner-style\";\n    let styleEl = doc.getElementById(styleId) as HTMLStyleElement | null;\n    if (!styleEl) {\n      styleEl = doc.createElement(\"style\");\n      styleEl.id = styleId;\n      doc.head?.appendChild(styleEl);\n    }\n    styleEl.textContent = `\n      .sandbox-wrapper { align-items: center; }\n      .sandbox-container { position: relative; width: 100%; }\n      .sandbox-container svg,\n      .sandbox-container img { display: block; margin-left: auto; margin-right: auto; }\n      .justify-\\\\[safe_center\\\\]{\n        justify-content: safe center;\n      }\n    `;\n  }, []);\n\n  useEffect(() => {\n    if (resetToken !== prevResetTokenRef.current) {\n      hasRenderedContentRef.current = false;\n      prevResetTokenRef.current = resetToken;\n    }\n    clearTimer(styleTimerRef);\n    clearTimer(scriptTimerRef);\n    hasStylesRef.current = false;\n    hasScriptsRef.current = false;\n\n    const container = containerRef.current;\n    if (!container) return;\n    const doc = container.ownerDocument;\n    const body = doc?.body;\n    if (!body) return;\n    const reusableImages = collectReusableImages(container);\n\n    appendedStylesRef.current.forEach((node) => node.remove());\n    appendedStylesRef.current = [];\n    appendedScriptsRef.current.forEach((node) => node.remove());\n    appendedScriptsRef.current = [];\n\n    // const hasRenderedBefore = hasRenderedContentRef.current;\n    setIsGeneratingStyles(false);\n    setIsGeneratingScripts(false);\n    const wrapper = doc.createElement(\"div\");\n    wrapper.innerHTML = html;\n\n    const openScriptCount = (html.match(/<script[\\s>]/gi) || []).length;\n    const closeScriptCount = (html.match(/<\\/script>/gi) || []).length;\n    const shouldExecuteScripts =\n      openScriptCount > 0 && openScriptCount === closeScriptCount;\n\n    const resourceQueue: HTMLElement[] = [];\n\n    Array.from(wrapper.querySelectorAll(\"style, script\")).forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        const cloned = doc.createElement(\"style\");\n        cloned.textContent = node.textContent || \"\";\n        Array.from(node.attributes).forEach((attr) => {\n          cloned.setAttribute(attr.name, attr.value);\n        });\n        resourceQueue.push(cloned);\n      } else {\n        const replacement = doc.createElement(\"script\");\n        Array.from(node.attributes).forEach((attr) => {\n          replacement.setAttribute(attr.name, attr.value);\n        });\n        replacement.textContent = node.textContent || \"\";\n        resourceQueue.push(replacement);\n      }\n      node.remove();\n    });\n    reuseRenderedImages(wrapper, reusableImages);\n\n    const hasStyles = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"style\"\n    );\n    const hasScripts = resourceQueue.some(\n      (node) => node.tagName.toLowerCase() === \"script\"\n    );\n    if (hasStyles) {\n      hasStylesRef.current = true;\n      styleStartRef.current = performance.now();\n      clearTimer(styleTimerRef);\n      setIsGeneratingStyles(true);\n    }\n    if (hasScripts) {\n      hasScriptsRef.current = true;\n      scriptStartRef.current = performance.now();\n      clearTimer(scriptTimerRef);\n      setIsGeneratingScripts(true);\n    }\n\n    const hasFirstElement = !!wrapper.firstElementChild;\n    if (hasFirstElement) {\n      hasRenderedContentRef.current = true;\n    }\n\n    const contentNodes = Array.from(wrapper.childNodes);\n    container.replaceChildren(...contentNodes);\n\n    resourceQueue.forEach((node) => {\n      if (node.tagName.toLowerCase() === \"style\") {\n        doc.head?.appendChild(node);\n        appendedStylesRef.current.push(node as HTMLStyleElement);\n        return;\n      }\n\n      if (shouldExecuteScripts) {\n        const scriptNode = node as HTMLScriptElement;\n        const scriptText = scriptNode.textContent || \"\";\n        const shouldValidate = !scriptNode.src;\n\n        if (shouldValidate) {\n          try {\n            // Validate script is syntactically complete before executing\n\n            new Function(scriptText);\n          } catch {\n            scriptNode.remove();\n            return;\n          }\n        }\n\n        try {\n          body.appendChild(scriptNode);\n          appendedScriptsRef.current.push(scriptNode);\n        } catch {\n          scriptNode.remove();\n        }\n      } else {\n        // Defer execution until all script tags are fully received\n        node.remove();\n      }\n    });\n    requestAnimationFrame(() => {\n      if (hasStyles) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingStyles,\n          styleTimerRef,\n          styleStartRef,\n          () => {\n            hasStylesRef.current = false;\n          }\n        );\n      }\n      if (hasScripts) {\n        settleStateWithMinimumDelay(\n          setIsGeneratingScripts,\n          scriptTimerRef,\n          scriptStartRef,\n          () => {\n            hasScriptsRef.current = false;\n          }\n        );\n      }\n    });\n  }, [html, resetToken]);\n\n  useEffect(\n    () => () => {\n      clearTimer(styleTimerRef);\n      clearTimer(scriptTimerRef);\n    },\n    []\n  );\n\n  const overlayMessage = (() => {\n    if (isGeneratingScripts || hasScriptsRef.current)\n      return scriptLoadingText || \"Building scripts cache...\";\n    if (isGeneratingStyles || hasStylesRef.current)\n      return styleLoadingText || \"Building styles...\";\n    return null;\n  })();\n\n  const isBlackboard = mode === \"blackboard\";\n  const shouldStretchRootHeight = isBlackboard && stretchRootHeight;\n  const sandboxWrapperStyle: React.CSSProperties = {\n    position: \"relative\",\n    width: \"100%\",\n    height: \"100%\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    // Keep blackboard scroll behavior while centering content in non-blackboard mode\n    justifyContent: shouldStretchRootHeight\n      ? \"flex-start\"\n      : isBlackboard\n        ? \"space-around\"\n        : \"flex-start\",\n  };\n  const sandboxContainerStyle: React.CSSProperties = {\n    pointerEvents: overlayMessage ? \"none\" : undefined,\n    margin: isBlackboard ? undefined : \"auto 0\",\n    width: \"100%\",\n    height: shouldStretchRootHeight ? \"100%\" : undefined,\n    minHeight: shouldStretchRootHeight ? 0 : undefined,\n    flex: shouldStretchRootHeight ? \"1 1 auto\" : undefined,\n  };\n\n  return (\n    <div\n      data-root-vh={hasRootVhHeight ? \"true\" : \"false\"}\n      className=\"sandbox-wrapper\"\n      style={sandboxWrapperStyle}\n      aria-busy={!!overlayMessage}\n    >\n      <div\n        ref={containerRef}\n        className=\"sandbox-container\"\n        style={sandboxContainerStyle}\n      />\n      {overlayMessage && (\n        <div\n          style={{\n            position: \"absolute\",\n            inset: 0,\n            zIndex: 20,\n            display: \"flex\",\n            alignItems: \"center\",\n            justifyContent: \"center\",\n            pointerEvents: \"none\",\n          }}\n        >\n          <LoadingOverlayCard message={overlayMessage} />\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default SandboxApp;\n"],"names":["IMAGE_REUSE_ATTRIBUTES","getImageReuseKey","image","attribute","collectReusableImages","root","imageMap","node","key","bucket","syncImageAttributes","sourceImage","targetImage","sourceAttributes","sourceAttributeNames","reuseRenderedImages","nextImage","preservedImage","SandboxApp","html","styleLoadingText","scriptLoadingText","resetToken","mode","hasRootVhHeight","stretchRootHeight","containerRef","useRef","isGeneratingStyles","setIsGeneratingStyles","useState","isGeneratingScripts","setIsGeneratingScripts","appendedStylesRef","appendedScriptsRef","styleStartRef","scriptStartRef","styleTimerRef","scriptTimerRef","hasStylesRef","hasScriptsRef","hasRenderedContentRef","prevResetTokenRef","MIN_LOADING_MS","clearTimer","timerRef","settleStateWithMinimumDelay","setter","startRef","onDone","elapsed","delay","useEffect","doc","styleId","styleEl","container","body","reusableImages","wrapper","openScriptCount","closeScriptCount","shouldExecuteScripts","resourceQueue","cloned","attr","replacement","hasStyles","hasScripts","contentNodes","scriptNode","scriptText","overlayMessage","isBlackboard","shouldStretchRootHeight","sandboxWrapperStyle","sandboxContainerStyle","jsxs","jsx","LoadingOverlayCard"],"mappings":"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"}

package/dist/components/Slide/Slide.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../_virtual/jsx-runtime.cjs.js"),t=require("react"),ht=require("../../lib/sandboxInteraction.cjs.js"),G=require("../../lib/utils.cjs.js"),gt=require("../ContentRender/ContentRender.cjs.js"),ze=require("../ContentRender/IframeSandbox.cjs.js");require("../ui/inputGroup/input-group.cjs.js");const De=require("../../lib/interaction-defaults.cjs.js"),yt=require("./Player.cjs.js"),vt=require("./useSlide.cjs.js"),St=require("./useWakePlayerFromIframe.cjs.js"),bt=require("./utils/interactionPlayback.cjs.js"),Et=require("./utils/playbackSequence.cjs.js"),$e=require("./utils/playerCustomActions.cjs.js"),Rt=require("./utils/playerToggleMode.cjs.js");;/* empty css               */const It=require("../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/loader-circle.cjs.js"),At=2e3,Ve=t.memo(({content:P,title:_,defaultButtonText:x,defaultInputText:O,defaultSelectedValues:y,confirmButtonText:U,copyButtonText:ue,copiedButtonText:le,onSend:k,readonly:H=!1})=>s.jsxRuntimeExports.jsxs("div",{className:"slide-player__interaction-card",children:[s.jsxRuntimeExports.jsx("div",{className:"slide-player__interaction-header",children:s.jsxRuntimeExports.jsx("p",{className:"slide-player__interaction-title",children:_})}),s.jsxRuntimeExports.jsx("div",{className:"slide-player__interaction-body",children:s.jsxRuntimeExports.jsx(gt.default,{content:P,defaultButtonText:x,defaultInputText:O,defaultSelectedValues:y,confirmButtonText:U,copyButtonText:ue,copiedButtonText:le,onSend:k,readonly:H,enableTypewriter:!1,sandboxMode:"content"})}),s.jsxRuntimeExports.jsx("div",{className:"slide-player__interaction-arrow"})]}));Ve.displayName="InteractionOverlayCard";const Ct=(P,_)=>P.length===_.length&&P.every((x,O)=>{const y=_[O];return x.sequence_number===y?.sequence_number&&x.type===y?.type&&x.content===y?.content}),jt=({elementList:P=[],showPlayer:_=!0,playerAlwaysVisible:x=!1,playerClassName:O,playerCustomActions:y,playerCustomActionPauseOnActive:U=!0,bufferingText:ue="Buffering...",interactionTitle:le,interactionTexts:k,playerAutoHideDelay:H=3e3,markerAutoAdvanceDelay:ye=At,interactionDefaultValueOptions:Y,onSend:ve,onPlayerVisibilityChange:ie,onStepChange:Se,className:We,onPointerDown:be,...Ge})=>{const ae=t.useRef(null),ce=t.useRef(null),Ee=t.useRef(null),z=t.useRef(null),D=t.useRef(null),$=t.useRef(null),Re=t.useRef([]),J=t.useRef(!1),T=t.useRef(null),Ie=t.useRef(null),{currentElementList:b,stepElementLists:Ae,slideElementList:q,currentIndex:a,audioList:f,currentAudioSequenceIndexes:Q,currentStepHasSpeakableElement:p,currentInteractionElement:i,canGoPrev:Ye,canGoNext:E,handlePrev:Ce,handleNext:I}=vt.default(P),V=t.useMemo(()=>{if(!(a<0))return q[a]},[a,q]),Je=q.filter(e=>e.is_renderable!==!1).length===1,v=_&&(q.length>0||f.length>0||!!i),S=t.useMemo(()=>Q.map(e=>f[e]?.audioKey).filter(e=>!!e),[f,Q]),[je,X]=t.useState(!0),[Z,W]=t.useState(!1),[de,we]=t.useState(!0),[m,M]=t.useState(null),[Qe,h]=t.useState(!1),[A,Pe]=t.useState(!1),[fe,me]=t.useState(!1),[r,ee]=t.useState(),[te,ne]=t.useState(!1),B=v&&(x||je),_e=t.useCallback(e=>{me(e)},[]),ke=t.useCallback(()=>{me(e=>!e)},[]),{mountedStepStates:Xe,currentMountedStateIndex:Ze}=t.useMemo(()=>{const e=[],n=new Map;return Ae.forEach((l,c)=>{const o=e.findIndex(u=>Ct(u.elementList,l));if(o>=0){e[o]?.sourceStepIndexes.push(c),n.set(c,o);return}e.push({elementList:l,sourceStepIndexes:[c]}),n.set(c,e.length-1)}),{mountedStepStates:e,currentMountedStateIndex:a>=0?n.get(a)??-1:-1}},[a,Ae]),Te=t.useMemo(()=>String(a),[a]),C=t.useMemo(()=>m?f.findIndex(e=>(e.audioKey??"")===m):-1,[f,m]),re=t.useMemo(()=>S[0]??"none",[S]),xe=t.useMemo(()=>({currentElement:$e.resolvePlayerCustomActionElement({currentAudioIndex:C,currentAudioSequenceIndexes:Q,audioList:f,currentInteractionElement:r,currentStepElement:V}),currentIndex:a,currentStepElement:V,isActive:fe,setActive:_e,toggleActive:ke}),[r,f,C,Q,a,V,fe,_e,ke]),qe=t.useMemo(()=>$e.getPlayerCustomActionCount(y,xe),[xe,y]),et=t.useMemo(()=>({"--slide-player-custom-action-count":String(qe)}),[qe]),Me=S.length>0,Be=t.useMemo(()=>i?`${i.sequence_number??"none"}:${String(i.content??"")}`:"none",[i]),pe=t.useMemo(()=>[Te,Be].join("|"),[Be,Te]),Ne=!!t.useMemo(()=>!re||re==="none"?"":f.find(n=>n.audioKey===re)?.audioUrl?.trim()??"",[f,re]),j=U&&!!y&&fe,he=t.useMemo(()=>Rt.shouldUseAutoAdvanceToggle({canGoNext:E,currentAudioIndex:C,currentStepHasSpeakableElement:p,hasInteraction:!!i}),[E,C,i,p]),w=t.useCallback(()=>{z.current!==null&&(window.clearTimeout(z.current),z.current=null)},[]),R=t.useCallback(()=>{$.current!==null&&(window.clearTimeout($.current),$.current=null)},[]),N=t.useCallback(()=>{D.current!==null&&(window.clearTimeout(D.current),D.current=null)},[]),K=t.useCallback(()=>{N(),R(),M(null),h(!1),Pe(!1),ee(void 0),ne(!1)},[N,R]),F=t.useCallback(()=>{const e=S[0];return e?(M(e),!0):!1},[S]),se=t.useCallback(()=>{R(),ne(!1),!F()&&E&&I()},[E,R,I,F]),d=t.useCallback((e=Z)=>{v&&(X(!0),w(),!(x||!e||H<=0)&&(z.current=window.setTimeout(()=>{X(!1),z.current=null},H)))},[w,Z,x,H,v]),ge=!!(i?.readonly||i?.user_input?.trim()),L=!!i&&!ge;t.useEffect(()=>{we(!0),U&&me(!1)},[a,U]),t.useEffect(()=>()=>{N(),w(),R()},[N,R,w]),t.useEffect(()=>(ie?.(B),()=>{ie?.(!1)}),[ie,B]),t.useEffect(()=>{Se?.(V,a)},[a,V,Se]),t.useEffect(()=>{if(!v){w(),X(!1);return}if(x){w(),X(!0);return}Z||d(!0)},[w,Z,x,v,d]),t.useEffect(()=>{if(typeof window>"u")return;const e=n=>{n.origin===window.location.origin&&ht.isSandboxInteractionMessage(n.data)&&v&&(W(!0),d(!0))};return window.addEventListener("message",e),()=>{window.removeEventListener("message",e)}},[v,d]),St.default({sectionRef:ae,enabled:v,onWake:()=>{W(!0),d(!0)}}),t.useEffect(()=>{const{hasPlaybackContextChanged:e,shouldInitializeAudioSequence:n}=Et.getPlaybackSequenceTransition({previousResetKey:Ie.current,nextResetKey:pe,currentAudioKey:m,hasCompletedCurrentStepAudio:A});Ie.current=pe;const l=T.current===a&&!!i,c=bt.shouldPresentInteractionOverlay({hasInteraction:!!i,shouldBlockPlaybackForInteraction:L,shouldOpenInteractionOverlayAfterAudio:l,hasPlaybackContextChanged:e,hasResolvedCurrentInteraction:ge,currentStepHasSpeakableElement:p});if(e&&K(),!(b.length===0&&!i)&&!j){if(c){ee(i),ne(!0),T.current=null;return}if(i&&(ee(i),T.current=null),!!n&&!F()){if(p){h(!0);return}if(E&&!(he&&!de))return D.current=window.setTimeout(()=>{D.current=null,I()},ye),()=>{N()}}}},[E,N,b.length,i,m,pe,p,ye,I,A,de,ge,L,K,F,j,he]),t.useEffect(()=>{if(j||!p||L){h(!1);return}if(A){h(!1);return}if(Me){h(!1);return}h(!0)},[Me,p,A,j,L]),t.useEffect(()=>{m||S.length===0||j||!p||L||A||F()},[m,S,p,A,j,L,F]),t.useEffect(()=>{!m||C>=0||M(null)},[C,m]);const Ke=t.useMemo(()=>{if(!r)return{};const e=!!r.user_input?.trim();return De.getInteractionDefaultValues(typeof r.content=="string"?r.content:void 0,r.user_input,e?void 0:Y)},[r,Y]),tt=t.useMemo(()=>{if(!r)return;const e=!!r.user_input?.trim();return De.getInteractionDefaultSelectedValues(typeof r.content=="string"?r.content:void 0,r.user_input,e?void 0:Y)},[r,Y]),Fe=!!r?.user_input?.trim(),Le=!!r?.readonly||Fe,Oe=Le||Fe,nt=t.useCallback(e=>{const l=[...e.selectedValues??[],e.inputText?.trim()??"",e.buttonText?.trim()??""].filter(Boolean).join(", ");ee(c=>!c||!l?c:{...c,user_input:l}),ve?.(e,r),se()},[r,se,ve]);t.useEffect(()=>{if(R(),!(!te||!Oe))return $.current=window.setTimeout(()=>{$.current=null,se()},2e3),()=>{R()}},[R,se,te,Oe]);const rt=(e,n={})=>e?e.type==="slot"?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:e.content}):e.type==="html"?s.jsxRuntimeExports.jsx(ze.default,{className:"content-render-iframe",hideFullScreen:!0,mode:"blackboard",replaceRootScreenHeightWithFull:n.replaceRootScreenHeightWithFull,type:"sandbox",content:e.content}):s.jsxRuntimeExports.jsx(ze.default,{className:"content-render-iframe",hideFullScreen:!0,mode:"blackboard",type:"markdown",content:e.content}):null,st=(e=[],n=!1)=>{if(e.length===0)return null;const l=e.filter(o=>o.is_renderable!==!1).length,c=e.reduce((o,u,g)=>u.is_renderable!==!1?g:o,-1);return s.jsxRuntimeExports.jsx("div",{className:"slide-stage__content flex w-full flex-col gap-4",children:e.map((o,u)=>{const g=o.type==="html"&&o.is_renderable===!1;return s.jsxRuntimeExports.jsx("div",{ref:n&&u===c?Ee:null,"aria-hidden":g||void 0,className:G.cn("w-full shrink-0",l===1&&o.is_renderable!==!1&&"slide-element--single",g?"pointer-events-none fixed left-[-200vw] top-0 -z-10 h-[100dvh] w-[100vw] overflow-hidden opacity-0":o.is_renderable===!1&&"hidden"),children:rt(o,{replaceRootScreenHeightWithFull:l===1&&o.type==="html"&&o.is_renderable!==!1})},o.sequence_number??`${o.type}-${u}`)})})},ot=()=>{const e=ae.current;if(e){if(document.fullscreenElement){document.exitFullscreen().catch(()=>{});return}e.requestFullscreen?.().catch(()=>{})}},Ue=t.useCallback(()=>{const e=ce.current;e&&e.scrollTo({top:e.scrollHeight,behavior:"smooth"})},[]),ut=t.useCallback(()=>{J.current=!0,T.current=null,W(!0),h(!1),d(!0),K(),Ce()},[Ce,K,d]),lt=t.useCallback(()=>{J.current=!0,T.current=null,W(!0),h(!1),d(!0),K(),I()},[I,K,d]),it=t.useCallback(e=>{if(!p||A){h(!1);return}h(e)},[p,A]),at=t.useCallback(e=>{const n=f[e]?.audioKey;if(!n||!m||n!==m)return;const l=S.findIndex(u=>u===n);if(l<0){M(null);return}const c=l+1,o=S[c];if(o){M(o);return}if(M(null),Pe(!0),h(!1),E){const u=a+1,g=q[u];Ne&&g?.type==="interaction"&&(T.current=u),I()}},[f,E,a,m,S,I,Ne,q]),ct=t.useCallback(()=>{r&&ne(e=>!e)},[r]),He=t.useCallback(e=>{e.stopPropagation(),B&&d(!0)},[je,d]),dt=t.useCallback(e=>{be?.(e),W(!0),d(!0)},[be,d]),ft=!!r&&te,oe=t.useMemo(()=>b.map((e,n)=>`${e.sequence_number??`${e.type}-${n}`}:${String(e.is_new??"")}`),[b]);return t.useEffect(()=>{const e=Re.current,c=(e.length>0&&e.length<oe.length&&e.every((u,g)=>u===oe[g])?b.slice(e.length):[]).some(u=>u.is_new===!1);if(Re.current=oe,!c)return;const o=window.requestAnimationFrame(()=>{const u=ce.current,g=Ee.current;if(!u||!g)return;const mt=u.getBoundingClientRect(),xt=g.getBoundingClientRect(),pt=u.scrollTop+(xt.top-mt.top);u.scrollTo({top:Math.max(pt,0),behavior:"smooth"})});return()=>{window.cancelAnimationFrame(o)}},[b,oe]),t.useEffect(()=>{if(!J.current||(J.current=!1,b.length===0))return;const e=window.requestAnimationFrame(()=>{Ue()});return()=>{window.cancelAnimationFrame(e)}},[b,Ue]),s.jsxRuntimeExports.jsxs("section",{ref:ae,className:G.cn("relative h-full w-full",We),onPointerDown:dt,...Ge,children:[s.jsxRuntimeExports.jsx("div",{className:G.cn("h-full min-h-0 w-full",Je?"slide-content--single":"grid gap-4"),children:b.length>0?s.jsxRuntimeExports.jsx("div",{className:"slide-stage",children:s.jsxRuntimeExports.jsx("div",{ref:ce,className:"slide-stage__layer w-full",children:Xe.map((e,n)=>{const l=n===Ze;return s.jsxRuntimeExports.jsx("div",{"aria-hidden":!l||void 0,className:"w-full h-full",style:{display:l?void 0:"none"},children:st(e.elementList,l)},e.sourceStepIndexes[0]??n)})})}):null}),Qe?s.jsxRuntimeExports.jsxs("div",{className:"pointer-events-none absolute left-1/2 top-1/2 z-[3] flex size-28 -translate-x-1/2 -translate-y-1/2 flex-col items-center justify-center gap-2 rounded-2xl bg-foreground/65 px-3 py-4 text-center text-xs leading-4 font-medium text-background shadow-lg backdrop-blur-sm",children:[s.jsxRuntimeExports.jsx(It.default,{className:"size-5 animate-spin text-background"}),s.jsxRuntimeExports.jsx("span",{children:ue})]}):null,ft?s.jsxRuntimeExports.jsx("div",{className:G.cn("slide-interaction-overlay",B&&v?"slide-interaction-overlay--with-player":"slide-interaction-overlay--standalone"),onClick:He,onPointerDown:He,style:et,children:s.jsxRuntimeExports.jsx(Ve,{content:String(r?.content??""),defaultButtonText:Ke.buttonText??"",defaultInputText:Ke.inputText??"",defaultSelectedValues:tt,confirmButtonText:k?.confirmButtonText,copyButtonText:k?.copyButtonText,copiedButtonText:k?.copiedButtonText,onSend:nt,readonly:Le,title:k?.title??le??"Submit the content below to continue."})}):null,v?s.jsxRuntimeExports.jsx(yt.default,{audioList:f,className:G.cn("absolute left-1/2 bottom-6 z-[2] -translate-x-1/2",O,!B&&"pointer-events-none opacity-0"),currentAudioIndex:C,defaultPlaying:!0,isPlaybackPaused:j,isAutoAdvanceEnabled:de,hasInteraction:!!r,isInteractionOpen:te,onAutoAdvanceToggle:we,onLoadingChange:it,nextDisabled:!E,onEnded:at,onFullscreen:ot,onInteractionToggle:ct,onNext:lt,onPrev:ut,prevDisabled:!Ye,showControls:B,customActionContext:xe,customActions:y,useAutoAdvanceToggle:he}):null]})};exports.default=jt;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../_virtual/jsx-runtime.cjs.js"),t=require("react"),ht=require("../../lib/sandboxInteraction.cjs.js"),G=require("../../lib/utils.cjs.js"),gt=require("../ui/loading-overlay-card.cjs.js"),yt=require("../ContentRender/ContentRender.cjs.js"),De=require("../ContentRender/IframeSandbox.cjs.js");require("../ui/inputGroup/input-group.cjs.js");const $e=require("../../lib/interaction-defaults.cjs.js"),St=require("./Player.cjs.js"),vt=require("./useSlide.cjs.js"),bt=require("./useWakePlayerFromIframe.cjs.js"),Et=require("./utils/interactionPlayback.cjs.js"),Rt=require("./utils/playbackSequence.cjs.js"),Ve=require("./utils/playerCustomActions.cjs.js"),It=require("./utils/playerToggleMode.cjs.js");;/* empty css               */const At=2e3,We=t.memo(({content:P,title:_,defaultButtonText:p,defaultInputText:O,defaultSelectedValues:y,confirmButtonText:U,copyButtonText:ue,copiedButtonText:le,onSend:T,readonly:H=!1})=>s.jsxRuntimeExports.jsxs("div",{className:"slide-player__interaction-card",children:[s.jsxRuntimeExports.jsx("div",{className:"slide-player__interaction-header",children:s.jsxRuntimeExports.jsx("p",{className:"slide-player__interaction-title",children:_})}),s.jsxRuntimeExports.jsx("div",{className:"slide-player__interaction-body",children:s.jsxRuntimeExports.jsx(yt.default,{content:P,defaultButtonText:p,defaultInputText:O,defaultSelectedValues:y,confirmButtonText:U,copyButtonText:ue,copiedButtonText:le,onSend:T,readonly:H,enableTypewriter:!1,sandboxMode:"content"})}),s.jsxRuntimeExports.jsx("div",{className:"slide-player__interaction-arrow"})]}));We.displayName="InteractionOverlayCard";const Ct=(P,_)=>P.length===_.length&&P.every((p,O)=>{const y=_[O];return p.sequence_number===y?.sequence_number&&p.type===y?.type&&p.content===y?.content}),wt=({elementList:P=[],showPlayer:_=!0,playerAlwaysVisible:p=!1,playerClassName:O,playerCustomActions:y,playerCustomActionPauseOnActive:U=!0,bufferingText:ue="Buffering...",interactionTitle:le,interactionTexts:T,playerAutoHideDelay:H=3e3,markerAutoAdvanceDelay:ye=At,interactionDefaultValueOptions:Y,onSend:Se,onPlayerVisibilityChange:ie,onStepChange:ve,className:ze,onPointerDown:be,...Ge})=>{const ae=t.useRef(null),ce=t.useRef(null),Ee=t.useRef(null),D=t.useRef(null),$=t.useRef(null),V=t.useRef(null),Re=t.useRef([]),J=t.useRef(!1),k=t.useRef(null),Ie=t.useRef(null),{currentElementList:b,stepElementLists:Ae,slideElementList:q,currentIndex:a,audioList:f,currentAudioSequenceIndexes:Q,currentStepHasSpeakableElement:x,currentInteractionElement:i,canGoPrev:Ye,canGoNext:E,handlePrev:Ce,handleNext:I}=vt.default(P),W=t.useMemo(()=>{if(!(a<0))return q[a]},[a,q]),Je=q.filter(e=>e.is_renderable!==!1).length===1,S=_&&(q.length>0||f.length>0||!!i),v=t.useMemo(()=>Q.map(e=>f[e]?.audioKey).filter(e=>!!e),[f,Q]),[we,X]=t.useState(!0),[Z,z]=t.useState(!1),[de,je]=t.useState(!0),[m,M]=t.useState(null),[Qe,h]=t.useState(!1),[A,Pe]=t.useState(!1),[fe,me]=t.useState(!1),[r,ee]=t.useState(),[te,ne]=t.useState(!1),B=S&&(p||we),_e=t.useCallback(e=>{me(e)},[]),Te=t.useCallback(()=>{me(e=>!e)},[]),{mountedStepStates:Xe,currentMountedStateIndex:Ze}=t.useMemo(()=>{const e=[],n=new Map;return Ae.forEach((l,c)=>{const o=e.findIndex(u=>Ct(u.elementList,l));if(o>=0){e[o]?.sourceStepIndexes.push(c),n.set(c,o);return}e.push({elementList:l,sourceStepIndexes:[c]}),n.set(c,e.length-1)}),{mountedStepStates:e,currentMountedStateIndex:a>=0?n.get(a)??-1:-1}},[a,Ae]),ke=t.useMemo(()=>String(a),[a]),C=t.useMemo(()=>m?f.findIndex(e=>(e.audioKey??"")===m):-1,[f,m]),re=t.useMemo(()=>v[0]??"none",[v]),pe=t.useMemo(()=>({currentElement:Ve.resolvePlayerCustomActionElement({currentAudioIndex:C,currentAudioSequenceIndexes:Q,audioList:f,currentInteractionElement:r,currentStepElement:W}),currentIndex:a,currentStepElement:W,isActive:fe,setActive:_e,toggleActive:Te}),[r,f,C,Q,a,W,fe,_e,Te]),qe=t.useMemo(()=>Ve.getPlayerCustomActionCount(y,pe),[pe,y]),et=t.useMemo(()=>({"--slide-player-custom-action-count":String(qe)}),[qe]),Me=v.length>0,Be=t.useMemo(()=>i?`${i.sequence_number??"none"}:${String(i.content??"")}`:"none",[i]),xe=t.useMemo(()=>[ke,Be].join("|"),[Be,ke]),Ne=!!t.useMemo(()=>!re||re==="none"?"":f.find(n=>n.audioKey===re)?.audioUrl?.trim()??"",[f,re]),w=U&&!!y&&fe,he=t.useMemo(()=>It.shouldUseAutoAdvanceToggle({canGoNext:E,currentAudioIndex:C,currentStepHasSpeakableElement:x,hasInteraction:!!i}),[E,C,i,x]),j=t.useCallback(()=>{D.current!==null&&(window.clearTimeout(D.current),D.current=null)},[]),R=t.useCallback(()=>{V.current!==null&&(window.clearTimeout(V.current),V.current=null)},[]),N=t.useCallback(()=>{$.current!==null&&(window.clearTimeout($.current),$.current=null)},[]),K=t.useCallback(()=>{N(),R(),M(null),h(!1),Pe(!1),ee(void 0),ne(!1)},[N,R]),F=t.useCallback(()=>{const e=v[0];return e?(M(e),!0):!1},[v]),oe=t.useCallback(()=>{R(),ne(!1),!F()&&E&&I()},[E,R,I,F]),d=t.useCallback((e=Z)=>{S&&(X(!0),j(),!(p||!e||H<=0)&&(D.current=window.setTimeout(()=>{X(!1),D.current=null},H)))},[j,Z,p,H,S]),ge=!!(i?.readonly||i?.user_input?.trim()),L=!!i&&!ge;t.useEffect(()=>{je(!0),U&&me(!1)},[a,U]),t.useEffect(()=>()=>{N(),j(),R()},[N,R,j]),t.useEffect(()=>(ie?.(B),()=>{ie?.(!1)}),[ie,B]),t.useEffect(()=>{ve?.(W,a)},[a,W,ve]),t.useEffect(()=>{if(!S){j(),X(!1);return}if(p){j(),X(!0);return}Z||d(!0)},[j,Z,p,S,d]),t.useEffect(()=>{if(typeof window>"u")return;const e=n=>{n.origin===window.location.origin&&ht.isSandboxInteractionMessage(n.data)&&S&&(z(!0),d(!0))};return window.addEventListener("message",e),()=>{window.removeEventListener("message",e)}},[S,d]),bt.default({sectionRef:ae,enabled:S,onWake:()=>{z(!0),d(!0)}}),t.useEffect(()=>{const{hasPlaybackContextChanged:e,shouldInitializeAudioSequence:n}=Rt.getPlaybackSequenceTransition({previousResetKey:Ie.current,nextResetKey:xe,currentAudioKey:m,hasCompletedCurrentStepAudio:A});Ie.current=xe;const l=k.current===a&&!!i,c=Et.shouldPresentInteractionOverlay({hasInteraction:!!i,shouldBlockPlaybackForInteraction:L,shouldOpenInteractionOverlayAfterAudio:l,hasPlaybackContextChanged:e,hasResolvedCurrentInteraction:ge,currentStepHasSpeakableElement:x});if(e&&K(),!(b.length===0&&!i)&&!w){if(c){ee(i),ne(!0),k.current=null;return}if(i&&(ee(i),k.current=null),!!n&&!F()){if(x){h(!0);return}if(E&&!(he&&!de))return $.current=window.setTimeout(()=>{$.current=null,I()},ye),()=>{N()}}}},[E,N,b.length,i,m,xe,x,ye,I,A,de,ge,L,K,F,w,he]),t.useEffect(()=>{if(w||!x||L){h(!1);return}if(A){h(!1);return}if(Me){h(!1);return}h(!0)},[Me,x,A,w,L]),t.useEffect(()=>{m||v.length===0||w||!x||L||A||F()},[m,v,x,A,w,L,F]),t.useEffect(()=>{!m||C>=0||M(null)},[C,m]);const Ke=t.useMemo(()=>{if(!r)return{};const e=!!r.user_input?.trim();return $e.getInteractionDefaultValues(typeof r.content=="string"?r.content:void 0,r.user_input,e?void 0:Y)},[r,Y]),tt=t.useMemo(()=>{if(!r)return;const e=!!r.user_input?.trim();return $e.getInteractionDefaultSelectedValues(typeof r.content=="string"?r.content:void 0,r.user_input,e?void 0:Y)},[r,Y]),Fe=!!r?.user_input?.trim(),Le=!!r?.readonly||Fe,Oe=Le||Fe,nt=t.useCallback(e=>{const l=[...e.selectedValues??[],e.inputText?.trim()??"",e.buttonText?.trim()??""].filter(Boolean).join(", ");ee(c=>!c||!l?c:{...c,user_input:l}),Se?.(e,r),oe()},[r,oe,Se]);t.useEffect(()=>{if(R(),!(!te||!Oe))return V.current=window.setTimeout(()=>{V.current=null,oe()},2e3),()=>{R()}},[R,oe,te,Oe]);const rt=(e,n={})=>e?e.type==="slot"?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:e.content}):e.type==="html"?s.jsxRuntimeExports.jsx(De.default,{className:"content-render-iframe",hideFullScreen:!0,mode:"blackboard",replaceRootScreenHeightWithFull:n.replaceRootScreenHeightWithFull,type:"sandbox",content:e.content}):s.jsxRuntimeExports.jsx(De.default,{className:"content-render-iframe",hideFullScreen:!0,mode:"blackboard",type:"markdown",content:e.content}):null,ot=(e=[],n=!1)=>{if(e.length===0)return null;const l=e.filter(o=>o.is_renderable!==!1).length,c=e.reduce((o,u,g)=>u.is_renderable!==!1?g:o,-1);return s.jsxRuntimeExports.jsx("div",{className:"slide-stage__content flex w-full flex-col gap-4",children:e.map((o,u)=>{const g=o.type==="html"&&o.is_renderable===!1;return s.jsxRuntimeExports.jsx("div",{ref:n&&u===c?Ee:null,"aria-hidden":g||void 0,className:G.cn("w-full shrink-0",l===1&&o.is_renderable!==!1&&"slide-element--single",g?"pointer-events-none fixed left-[-200vw] top-0 -z-10 h-[100dvh] w-[100vw] overflow-hidden opacity-0":o.is_renderable===!1&&"hidden"),children:rt(o,{replaceRootScreenHeightWithFull:l===1&&o.type==="html"&&o.is_renderable!==!1})},o.sequence_number??`${o.type}-${u}`)})})},st=()=>{const e=ae.current;if(e){if(document.fullscreenElement){document.exitFullscreen().catch(()=>{});return}e.requestFullscreen?.().catch(()=>{})}},Ue=t.useCallback(()=>{const e=ce.current;e&&e.scrollTo({top:e.scrollHeight,behavior:"smooth"})},[]),ut=t.useCallback(()=>{J.current=!0,k.current=null,z(!0),h(!1),d(!0),K(),Ce()},[Ce,K,d]),lt=t.useCallback(()=>{J.current=!0,k.current=null,z(!0),h(!1),d(!0),K(),I()},[I,K,d]),it=t.useCallback(e=>{if(!x||A){h(!1);return}h(e)},[x,A]),at=t.useCallback(e=>{const n=f[e]?.audioKey;if(!n||!m||n!==m)return;const l=v.findIndex(u=>u===n);if(l<0){M(null);return}const c=l+1,o=v[c];if(o){M(o);return}if(M(null),Pe(!0),h(!1),E){const u=a+1,g=q[u];Ne&&g?.type==="interaction"&&(k.current=u),I()}},[f,E,a,m,v,I,Ne,q]),ct=t.useCallback(()=>{r&&ne(e=>!e)},[r]),He=t.useCallback(e=>{e.stopPropagation(),B&&d(!0)},[we,d]),dt=t.useCallback(e=>{be?.(e),z(!0),d(!0)},[be,d]),ft=!!r&&te,se=t.useMemo(()=>b.map((e,n)=>`${e.sequence_number??`${e.type}-${n}`}:${String(e.is_new??"")}`),[b]);return t.useEffect(()=>{const e=Re.current,c=(e.length>0&&e.length<se.length&&e.every((u,g)=>u===se[g])?b.slice(e.length):[]).some(u=>u.is_new===!1);if(Re.current=se,!c)return;const o=window.requestAnimationFrame(()=>{const u=ce.current,g=Ee.current;if(!u||!g)return;const mt=u.getBoundingClientRect(),pt=g.getBoundingClientRect(),xt=u.scrollTop+(pt.top-mt.top);u.scrollTo({top:Math.max(xt,0),behavior:"smooth"})});return()=>{window.cancelAnimationFrame(o)}},[b,se]),t.useEffect(()=>{if(!J.current||(J.current=!1,b.length===0))return;const e=window.requestAnimationFrame(()=>{Ue()});return()=>{window.cancelAnimationFrame(e)}},[b,Ue]),s.jsxRuntimeExports.jsxs("section",{ref:ae,className:G.cn("relative h-full w-full",ze),onPointerDown:dt,...Ge,children:[s.jsxRuntimeExports.jsx("div",{className:G.cn("h-full min-h-0 w-full",Je?"slide-content--single":"grid gap-4"),children:b.length>0?s.jsxRuntimeExports.jsx("div",{className:"slide-stage",children:s.jsxRuntimeExports.jsx("div",{ref:ce,className:"slide-stage__layer w-full",children:Xe.map((e,n)=>{const l=n===Ze;return s.jsxRuntimeExports.jsx("div",{"aria-hidden":!l||void 0,className:"w-full h-full",style:{display:l?void 0:"none"},children:ot(e.elementList,l)},e.sourceStepIndexes[0]??n)})})}):null}),Qe?s.jsxRuntimeExports.jsx(gt.default,{message:ue,className:"absolute left-1/2 top-1/2 z-[3] -translate-x-1/2 -translate-y-1/2"}):null,ft?s.jsxRuntimeExports.jsx("div",{className:G.cn("slide-interaction-overlay",B&&S?"slide-interaction-overlay--with-player":"slide-interaction-overlay--standalone"),onClick:He,onPointerDown:He,style:et,children:s.jsxRuntimeExports.jsx(We,{content:String(r?.content??""),defaultButtonText:Ke.buttonText??"",defaultInputText:Ke.inputText??"",defaultSelectedValues:tt,confirmButtonText:T?.confirmButtonText,copyButtonText:T?.copyButtonText,copiedButtonText:T?.copiedButtonText,onSend:nt,readonly:Le,title:T?.title??le??"Submit the content below to continue."})}):null,S?s.jsxRuntimeExports.jsx(St.default,{audioList:f,className:G.cn("absolute left-1/2 bottom-6 z-[2] -translate-x-1/2",O,!B&&"pointer-events-none opacity-0"),currentAudioIndex:C,defaultPlaying:!0,isPlaybackPaused:w,isAutoAdvanceEnabled:de,hasInteraction:!!r,isInteractionOpen:te,onAutoAdvanceToggle:je,onLoadingChange:it,nextDisabled:!E,onEnded:at,onFullscreen:st,onInteractionToggle:ct,onNext:lt,onPrev:ut,prevDisabled:!Ye,showControls:B,customActionContext:pe,customActions:y,useAutoAdvanceToggle:he}):null]})};exports.default=wt;
 //# sourceMappingURL=Slide.cjs.js.map