npm - markdown-flow-ui - Versions diffs - 0.1.100-beta.11 → 0.1.100-beta.13 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (31) hide show

package/dist/components/ContentRender/plugins/CustomVariable.es.js CHANGED Viewed

@@ -1,14 +1,14 @@
 import { j as s } from "../../../_virtual/jsx-runtime.es.js";
 import j from "react";
-import { Button as K } from "../../ui/button.es.js";
-import { Checkbox as F } from "../../ui/checkbox.es.js";
+import { Button as F } from "../../ui/button.es.js";
+import { Checkbox as G } from "../../ui/checkbox.es.js";
 import T from "../MarkdownFlowInput.es.js";
-import { InputGroup as G, InputGroupTextarea as O } from "../../ui/inputGroup/input-group.es.js";
-import { cn as R } from "../../../lib/utils.es.js";
+import { InputGroup as O, InputGroupTextarea as R } from "../../ui/inputGroup/input-group.es.js";
+import { cn as y } from "../../../lib/utils.es.js";
 const _ = ({
   node: e,
-  readonly: r,
-  selectedValues: l,
+  readonly: l,
+  selectedValues: r,
   inputValue: p,
   confirmButtonText: m,
   handleCheckboxChange: x,
@@ -16,13 +16,13 @@ const _ = ({
   handleKeyDown: o,
   handleConfirmClick: n
 }) => {
-  const u = e.properties?.placeholder, c = r || l.length === 0 && !p?.trim(), v = (i) => /* @__PURE__ */ s.jsx(
+  const u = e.properties?.placeholder, c = l || r.length === 0 && !p?.trim(), v = (a) => /* @__PURE__ */ s.jsx(
     "span",
     {
-      className: R(
+      className: y(
         "multi-select-confirm-wrapper flex flex-col items-center",
         c ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
-        i
+        a
       ),
       children: /* @__PURE__ */ s.jsx(
         "button",
@@ -37,14 +37,14 @@ const _ = ({
     }
   );
   return /* @__PURE__ */ s.jsxs("span", { className: "multi-select-container flex w-full flex-col", children: [
-    /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-6", children: e.properties?.buttonTexts?.map((i, N) => {
-      const b = e.properties?.buttonValues?.[N], f = b !== void 0 ? b : i;
+    /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-6", children: e.properties?.buttonTexts?.map((a, N) => {
+      const b = e.properties?.buttonValues?.[N], f = b !== void 0 ? b : a;
       return /* @__PURE__ */ s.jsx(
-        F,
+        G,
         {
-          label: i,
-          disabled: r,
-          checked: l.includes(f),
+          label: a,
+          disabled: l,
+          checked: r.includes(f),
           onCheckedChange: (d) => x(f, d),
           className: "text-sm"
         },
@@ -52,10 +52,10 @@ const _ = ({
       );
     }) }),
     u ? /* @__PURE__ */ s.jsx("span", { className: "block mb-1 w-full max-w-[500px]", children: /* @__PURE__ */ s.jsxs("span", { className: "multi-select-input-row flex w-full items-end gap-3", children: [
-      /* @__PURE__ */ s.jsx(G, { "data-disabled": r, className: "flex-1", children: /* @__PURE__ */ s.jsx(
-        O,
+      /* @__PURE__ */ s.jsx(O, { "data-disabled": l, className: "flex-1", children: /* @__PURE__ */ s.jsx(
+        R,
         {
-          disabled: r,
+          disabled: l,
           placeholder: u,
           value: p,
           onChange: h,
@@ -69,8 +69,8 @@ const _ = ({
   ] });
 }, z = ({
   node: e,
-  readonly: r,
-  resolvedDefaultButtonText: l,
+  readonly: l,
+  resolvedDefaultButtonText: r,
   handleButtonClick: p,
   inputValue: m,
   handleInputChange: x,
@@ -79,14 +79,18 @@ const _ = ({
   /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-2", children: e.properties?.buttonTexts?.map((o, n) => {
     const u = e.properties?.buttonValues?.[n], c = u !== void 0 ? u : o;
     return /* @__PURE__ */ s.jsx(
-      K,
+      F,
       {
-        disabled: r,
+        disabled: l,
         variant: "outline",
         type: "button",
         size: "sm",
         onClick: () => p(c),
-        className: `cursor-pointer h-8 text-sm hover:bg-gray-200 ${l === o ? "select" : ""}`,
+        className: y(
+          "max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5",
+          "hover:bg-gray-200",
+          r === o && "select"
+        ),
         children: o
       },
       n
@@ -95,7 +99,7 @@ const _ = ({
   e.properties?.placeholder && /* @__PURE__ */ s.jsx("span", { className: "mt-[9px] mb-1", children: /* @__PURE__ */ s.jsx(
     T,
     {
-      disabled: r,
+      disabled: l,
       placeholder: e.properties.placeholder,
       value: m,
       onChange: x,
@@ -105,24 +109,24 @@ const _ = ({
   ) })
 ] }), L = ({
   readonly: e,
-  placeholder: r,
-  value: l,
+  placeholder: l,
+  value: r,
   onChange: p,
   onSend: m
-}) => r ? /* @__PURE__ */ s.jsx(
+}) => l ? /* @__PURE__ */ s.jsx(
   T,
   {
     disabled: e,
-    placeholder: r,
-    value: l,
+    placeholder: l,
+    value: r,
     onChange: p,
     onSend: m,
-    title: r
+    title: l
   }
-) : null, Q = ({
+) : null, W = ({
   node: e,
-  readonly: r,
-  defaultButtonText: l,
+  readonly: l,
+  defaultButtonText: r,
   defaultInputText: p,
   defaultSelectedValues: m,
   onSend: x,
@@ -132,88 +136,88 @@ const _ = ({
 }) => {
   const [n, u] = j.useState(p || ""), [c, v] = j.useState(
     m || []
-  ), i = e.properties?.isMultiSelect ?? !1, N = e.properties?.buttonTexts || [], b = !i && N.length === 0 && !e.properties?.placeholder, f = e.properties?.variableName?.trim() || l || "Submit", d = j.useMemo(() => b ? {
+  ), a = e.properties?.isMultiSelect ?? !1, N = e.properties?.buttonTexts || [], b = !a && N.length === 0 && !e.properties?.placeholder, f = e.properties?.variableName?.trim() || r || "Submit", d = j.useMemo(() => b ? {
     ...e,
     properties: {
       ...e.properties || {},
       buttonTexts: [f],
       buttonValues: [f]
     }
-  } : e, [f, e, b]), g = d.properties?.buttonTexts || [], k = d.properties?.buttonValues || [], w = !i && g.length > 0, M = (t) => {
-    const a = {
+  } : e, [f, e, b]), g = d.properties?.buttonTexts || [], w = d.properties?.buttonValues || [], C = !a && g.length > 0, M = (t) => {
+    const i = {
       variableName: e.properties?.variableName || "",
       buttonText: t
     };
-    o?.(a) && x?.(a);
-  }, y = (t, a) => {
-    v((I) => a ? [...I, t] : I.filter((E) => E !== t));
+    o?.(i) && x?.(i);
+  }, B = (t, i) => {
+    v((I) => i ? [...I, t] : I.filter((K) => K !== t));
   }, V = () => {
-    const t = c.length === 0 && !n?.trim(), a = {
+    const t = c.length === 0 && !n?.trim(), i = {
       variableName: e.properties?.variableName || "",
       selectedValues: c,
       inputText: n?.trim() || void 0
     };
-    r || t || o?.(a) && x?.(a);
+    l || t || o?.(i) && x?.(i);
   }, S = (t) => {
     u(t.target.value);
-  }, B = (t) => {
-    t.nativeEvent.isComposing || t.keyCode === 229 || t.key === "Enter" && !t.shiftKey && (t.preventDefault(), i ? c.length === 0 && !n.trim() || V() : C());
-  }, C = () => {
+  }, D = (t) => {
+    t.nativeEvent.isComposing || t.keyCode === 229 || t.key === "Enter" && !t.shiftKey && (t.preventDefault(), a ? c.length === 0 && !n.trim() || V() : k());
+  }, k = () => {
     const t = {
       variableName: e.properties?.variableName || "",
       inputText: n
     };
     o?.(t) && x?.(t);
-  }, D = j.useMemo(() => {
-    if (!l)
+  }, E = j.useMemo(() => {
+    if (!r)
       return;
-    const t = k.indexOf(l);
+    const t = w.indexOf(r);
     if (t > -1)
-      return g[t] ?? l;
-    const a = g.indexOf(l);
-    if (a > -1)
-      return g[a];
-  }, [l, g, k]);
+      return g[t] ?? r;
+    const i = g.indexOf(r);
+    if (i > -1)
+      return g[i];
+  }, [r, g, w]);
   return /* @__PURE__ */ s.jsxs("span", { className: "custom-variable-container inline-flex items-center flex-wrap", children: [
-    i && /* @__PURE__ */ s.jsx(
+    a && /* @__PURE__ */ s.jsx(
       _,
       {
         node: e,
-        readonly: r,
+        readonly: l,
         selectedValues: c,
         inputValue: n,
         confirmButtonText: h,
-        handleCheckboxChange: y,
+        handleCheckboxChange: B,
         handleInputChange: S,
-        handleKeyDown: B,
+        handleKeyDown: D,
         handleConfirmClick: V
       }
     ),
-    !i && w && /* @__PURE__ */ s.jsx(
+    !a && C && /* @__PURE__ */ s.jsx(
       z,
       {
         node: d,
-        readonly: r,
-        resolvedDefaultButtonText: D,
+        readonly: l,
+        resolvedDefaultButtonText: E,
         handleButtonClick: M,
         inputValue: n,
         handleInputChange: S,
-        handleSendClick: C
+        handleSendClick: k
       }
     ),
-    !i && !w && e.properties?.placeholder && /* @__PURE__ */ s.jsx(
+    !a && !C && e.properties?.placeholder && /* @__PURE__ */ s.jsx(
       L,
       {
-        readonly: r,
+        readonly: l,
         placeholder: e.properties.placeholder,
         value: n,
         onChange: S,
-        onSend: C
+        onSend: k
       }
     )
   ] });
 };
 export {
-  Q as default
+  W as default
 };
 //# sourceMappingURL=CustomVariable.es.js.map

package/dist/components/ContentRender/plugins/CustomVariable.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomVariable.es.js","sources":["../../../../src/components/ContentRender/plugins/CustomVariable.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Components } from \"react-markdown\";\nimport { OnSendContentParams } from \"../../types\";\nimport { Button } from \"../../ui/button\";\nimport { Checkbox } from \"../../ui/checkbox\";\nimport MarkdownFlowInput from \"../MarkdownFlowInput\";\nimport {\n InputGroup,\n InputGroupTextarea,\n} from \"../../ui/inputGroup/input-group\";\nimport { cn } from \"../../../lib/utils\";\n\n// Define custom variable node type\ninterface CustomVariableNode {\n tagName: \"custom-variable\";\n properties?: {\n variableName?: string;\n buttonTexts?: string[];\n buttonValues?: string[];\n placeholder?: string;\n isMultiSelect?: boolean;\n };\n}\n\n// Define custom variable component Props type\ninterface CustomVariableProps {\n node: CustomVariableNode;\n defaultButtonText?: string;\n defaultInputText?: string;\n defaultSelectedValues?: string[];\n readonly?: boolean;\n onSend?: (content: OnSendContentParams) => void;\n // Multi-select confirm button text (i18n support)\n confirmButtonText?: string;\n beforeSend?: (param: OnSendContentParams) => boolean;\n}\n\ninterface ComponentsWithCustomVariable extends Components {\n \"custom-variable\"?: React.ComponentType<CustomVariableProps>;\n}\n\n// Multi select section( with checkboxes and input)\ninterface MultiSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n selectedValues: string[];\n inputValue: string;\n confirmButtonText: string;\n handleCheckboxChange: (value: string, checked: boolean) => void;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n handleConfirmClick: () => void;\n}\n\nconst MultiSelectSection = ({\n node,\n readonly,\n selectedValues,\n inputValue,\n confirmButtonText,\n handleCheckboxChange,\n handleInputChange,\n handleKeyDown,\n handleConfirmClick,\n}: MultiSelectSectionProps) => {\n const placeholder = node.properties?.placeholder;\n const confirmDisabled =\n readonly \|\| (selectedValues.length === 0 && !inputValue?.trim());\n\n const renderConfirmButton = (extraWrapperClassName?: string) => (\n <span\n className={cn(\n \"multi-select-confirm-wrapper flex flex-col items-center\",\n confirmDisabled ? \"opacity-50 cursor-not-allowed\" : \"cursor-pointer\",\n extraWrapperClassName\n )}\n >\n <button\n type=\"button\"\n className=\"multi-select-confirm-button text-sm font-medium text-primary\"\n disabled={confirmDisabled}\n onClick={handleConfirmClick}\n >\n {confirmButtonText}\n </button>\n </span>\n );\n\n return (\n <span className=\"multi-select-container flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-6\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Checkbox\n key={index}\n label={text}\n disabled={readonly}\n checked={selectedValues.includes(buttonValue)}\n onCheckedChange={(checked) =>\n handleCheckboxChange(buttonValue, checked)\n }\n className=\"text-sm\"\n />\n );\n })}\n </span>\n {placeholder ? (\n <span className=\"block mb-1 w-full max-w-[500px]\">\n <span className=\"multi-select-input-row flex w-full items-end gap-3\">\n <InputGroup data-disabled={readonly} className=\"flex-1\">\n <InputGroupTextarea\n disabled={readonly}\n placeholder={placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n className=\"text-sm px-3\"\n title={placeholder}\n />\n </InputGroup>\n {renderConfirmButton(\"shrink-0\")}\n </span>\n </span>\n ) : (\n renderConfirmButton(\"self-start multi-select-confirm-wrapper--stacked\")\n )}\n </span>\n );\n};\n\n// Single select section( with buttons and input)\ninterface SingleSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n resolvedDefaultButtonText?: string;\n handleButtonClick: (value: string) => void;\n inputValue: string;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleSendClick: () => void;\n}\n\nconst SingleSelectSection = ({\n node,\n readonly,\n resolvedDefaultButtonText,\n handleButtonClick,\n inputValue,\n handleInputChange,\n handleSendClick,\n}: SingleSelectSectionProps) => (\n <span className=\"single-select-container inline-flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-2\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Button\n key={index}\n disabled={readonly}\n variant=\"outline\"\n type=\"button\"\n size=\"sm\"\n onClick={() => handleButtonClick(buttonValue)}\n className={`cursor-pointer h-8 text-sm hover:bg-gray-200 ${resolvedDefaultButtonText === text ? \"select\" : \"\"}`}\n >\n {text}\n </Button>\n );\n })}\n </span>\n {node.properties?.placeholder && (\n <span className=\"mt-[9px] mb-1\">\n <MarkdownFlowInput\n disabled={readonly}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n title={node.properties.placeholder}\n />\n </span>\n )}\n </span>\n);\n\n// Pure input\ninterface InputSectionProps {\n readonly?: boolean;\n placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onSend: () => void;\n}\n\nconst InputSection = ({\n readonly,\n placeholder,\n value,\n onChange,\n onSend,\n}: InputSectionProps) => {\n if (!placeholder) {\n return null;\n }\n\n return (\n <MarkdownFlowInput\n disabled={readonly}\n placeholder={placeholder}\n value={value}\n onChange={onChange}\n onSend={onSend}\n title={placeholder}\n />\n );\n};\n\n// Define custom variable component\nconst CustomButtonInputVariable = ({\n node,\n readonly,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n onSend,\n confirmButtonText = \"Submit\", // Default to English, can be overridden\n beforeSend = () => true,\n}: CustomVariableProps) => {\n const [inputValue, setInputValue] = React.useState(defaultInputText \|\| \"\");\n const [selectedValues, setSelectedValues] = React.useState<string[]>(\n defaultSelectedValues \|\| []\n );\n const isMultiSelect = node.properties?.isMultiSelect ?? false;\n const baseButtonTexts = node.properties?.buttonTexts \|\| [];\n const shouldUseFallbackButton =\n !isMultiSelect &&\n baseButtonTexts.length === 0 &&\n !node.properties?.placeholder;\n const fallbackButtonLabel =\n node.properties?.variableName?.trim() \|\| defaultButtonText \|\| \"Submit\";\n\n const singleSelectNode = React.useMemo<CustomVariableNode>(() => {\n if (!shouldUseFallbackButton) {\n return node;\n }\n return {\n ...node,\n properties: {\n ...(node.properties \|\| {}),\n buttonTexts: [fallbackButtonLabel],\n buttonValues: [fallbackButtonLabel],\n },\n };\n }, [fallbackButtonLabel, node, shouldUseFallbackButton]);\n\n const singleSelectButtonTexts =\n singleSelectNode.properties?.buttonTexts \|\| [];\n const singleSelectButtonValues =\n singleSelectNode.properties?.buttonValues \|\| [];\n const isSingleSelect = !isMultiSelect && singleSelectButtonTexts.length > 0;\n\n const handleButtonClick = (value: string) => {\n const param = {\n variableName: node.properties?.variableName \|\| \"\",\n buttonText: value,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleCheckboxChange = (value: string, checked: boolean) => {\n setSelectedValues((prev) => {\n if (checked) {\n return [...prev, value];\n } else {\n return prev.filter((v) => v !== value);\n }\n });\n };\n\n const handleConfirmClick = () => {\n const noSelection = selectedValues.length === 0 && !inputValue?.trim();\n const param = {\n variableName: node.properties?.variableName \|\| \"\",\n selectedValues,\n inputText: inputValue?.trim() \|\| undefined,\n };\n if (readonly \|\| noSelection) return;\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setInputValue(e.target.value);\n };\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.nativeEvent.isComposing \|\| e.keyCode === 229) {\n return;\n }\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n if (isMultiSelect) {\n const noSelection = selectedValues.length === 0 && !inputValue.trim();\n if (!noSelection) handleConfirmClick();\n } else {\n handleSendClick();\n }\n }\n };\n const handleSendClick = () => {\n const param = {\n variableName: node.properties?.variableName \|\| \"\",\n inputText: inputValue,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const resolvedDefaultButtonText = React.useMemo(() => {\n if (!defaultButtonText) {\n return undefined;\n }\n const valueIndex = singleSelectButtonValues.indexOf(defaultButtonText);\n if (valueIndex > -1) {\n return singleSelectButtonTexts[valueIndex] ?? defaultButtonText;\n }\n const textIndex = singleSelectButtonTexts.indexOf(defaultButtonText);\n if (textIndex > -1) {\n return singleSelectButtonTexts[textIndex];\n }\n return undefined;\n }, [defaultButtonText, singleSelectButtonTexts, singleSelectButtonValues]);\n\n return (\n <span className=\"custom-variable-container inline-flex items-center flex-wrap\">\n {isMultiSelect && (\n <MultiSelectSection\n node={node}\n readonly={readonly}\n selectedValues={selectedValues}\n inputValue={inputValue}\n confirmButtonText={confirmButtonText}\n handleCheckboxChange={handleCheckboxChange}\n handleInputChange={handleInputChange}\n handleKeyDown={handleKeyDown}\n handleConfirmClick={handleConfirmClick}\n />\n )}\n\n {!isMultiSelect && isSingleSelect && (\n <SingleSelectSection\n node={singleSelectNode}\n readonly={readonly}\n resolvedDefaultButtonText={resolvedDefaultButtonText}\n handleButtonClick={handleButtonClick}\n inputValue={inputValue}\n handleInputChange={handleInputChange}\n handleSendClick={handleSendClick}\n />\n )}\n\n {!isMultiSelect && !isSingleSelect && node.properties?.placeholder && (\n <InputSection\n readonly={readonly}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n />\n )}\n </span>\n );\n};\n\nexport default CustomButtonInputVariable;\nexport type {\n ComponentsWithCustomVariable,\n CustomVariableNode,\n CustomVariableProps,\n};\n"],"names":["MultiSelectSection","node","readonly","selectedValues","inputValue","confirmButtonText","handleCheckboxChange","handleInputChange","handleKeyDown","handleConfirmClick","placeholder","confirmDisabled","renderConfirmButton","extraWrapperClassName","jsx","cn","jsxs","text","index","value","buttonValue","Checkbox","checked","InputGroup","InputGroupTextarea","SingleSelectSection","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","setInputValue","React","setSelectedValues","isMultiSelect","baseButtonTexts","shouldUseFallbackButton","fallbackButtonLabel","singleSelectNode","singleSelectButtonTexts","singleSelectButtonValues","isSingleSelect","param","prev","v","noSelection","e","valueIndex","textIndex"],"mappings":"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"}
1	+ {"version":3,"file":"CustomVariable.es.js","sources":["../../../../src/components/ContentRender/plugins/CustomVariable.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Components } from \"react-markdown\";\nimport { OnSendContentParams } from \"../../types\";\nimport { Button } from \"../../ui/button\";\nimport { Checkbox } from \"../../ui/checkbox\";\nimport MarkdownFlowInput from \"../MarkdownFlowInput\";\nimport {\n InputGroup,\n InputGroupTextarea,\n} from \"../../ui/inputGroup/input-group\";\nimport { cn } from \"../../../lib/utils\";\n\n// Define custom variable node type\ninterface CustomVariableNode {\n tagName: \"custom-variable\";\n properties?: {\n variableName?: string;\n buttonTexts?: string[];\n buttonValues?: string[];\n placeholder?: string;\n isMultiSelect?: boolean;\n };\n}\n\n// Define custom variable component Props type\ninterface CustomVariableProps {\n node: CustomVariableNode;\n defaultButtonText?: string;\n defaultInputText?: string;\n defaultSelectedValues?: string[];\n readonly?: boolean;\n onSend?: (content: OnSendContentParams) => void;\n // Multi-select confirm button text (i18n support)\n confirmButtonText?: string;\n beforeSend?: (param: OnSendContentParams) => boolean;\n}\n\ninterface ComponentsWithCustomVariable extends Components {\n \"custom-variable\"?: React.ComponentType<CustomVariableProps>;\n}\n\n// Multi select section( with checkboxes and input)\ninterface MultiSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n selectedValues: string[];\n inputValue: string;\n confirmButtonText: string;\n handleCheckboxChange: (value: string, checked: boolean) => void;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n handleConfirmClick: () => void;\n}\n\nconst MultiSelectSection = ({\n node,\n readonly,\n selectedValues,\n inputValue,\n confirmButtonText,\n handleCheckboxChange,\n handleInputChange,\n handleKeyDown,\n handleConfirmClick,\n}: MultiSelectSectionProps) => {\n const placeholder = node.properties?.placeholder;\n const confirmDisabled =\n readonly \|\| (selectedValues.length === 0 && !inputValue?.trim());\n\n const renderConfirmButton = (extraWrapperClassName?: string) => (\n <span\n className={cn(\n \"multi-select-confirm-wrapper flex flex-col items-center\",\n confirmDisabled ? \"opacity-50 cursor-not-allowed\" : \"cursor-pointer\",\n extraWrapperClassName\n )}\n >\n <button\n type=\"button\"\n className=\"multi-select-confirm-button text-sm font-medium text-primary\"\n disabled={confirmDisabled}\n onClick={handleConfirmClick}\n >\n {confirmButtonText}\n </button>\n </span>\n );\n\n return (\n <span className=\"multi-select-container flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-6\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Checkbox\n key={index}\n label={text}\n disabled={readonly}\n checked={selectedValues.includes(buttonValue)}\n onCheckedChange={(checked) =>\n handleCheckboxChange(buttonValue, checked)\n }\n className=\"text-sm\"\n />\n );\n })}\n </span>\n {placeholder ? (\n <span className=\"block mb-1 w-full max-w-[500px]\">\n <span className=\"multi-select-input-row flex w-full items-end gap-3\">\n <InputGroup data-disabled={readonly} className=\"flex-1\">\n <InputGroupTextarea\n disabled={readonly}\n placeholder={placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n className=\"text-sm px-3\"\n title={placeholder}\n />\n </InputGroup>\n {renderConfirmButton(\"shrink-0\")}\n </span>\n </span>\n ) : (\n renderConfirmButton(\"self-start multi-select-confirm-wrapper--stacked\")\n )}\n </span>\n );\n};\n\n// Single select section( with buttons and input)\ninterface SingleSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n resolvedDefaultButtonText?: string;\n handleButtonClick: (value: string) => void;\n inputValue: string;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleSendClick: () => void;\n}\n\nconst SingleSelectSection = ({\n node,\n readonly,\n resolvedDefaultButtonText,\n handleButtonClick,\n inputValue,\n handleInputChange,\n handleSendClick,\n}: SingleSelectSectionProps) => (\n <span className=\"single-select-container inline-flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-2\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Button\n key={index}\n disabled={readonly}\n variant=\"outline\"\n type=\"button\"\n size=\"sm\"\n onClick={() => handleButtonClick(buttonValue)}\n className={cn(\n \"max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5\",\n \"hover:bg-gray-200\",\n resolvedDefaultButtonText === text && \"select\"\n )}\n >\n {text}\n </Button>\n );\n })}\n </span>\n {node.properties?.placeholder && (\n <span className=\"mt-[9px] mb-1\">\n <MarkdownFlowInput\n disabled={readonly}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n title={node.properties.placeholder}\n />\n </span>\n )}\n </span>\n);\n\n// Pure input\ninterface InputSectionProps {\n readonly?: boolean;\n placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onSend: () => void;\n}\n\nconst InputSection = ({\n readonly,\n placeholder,\n value,\n onChange,\n onSend,\n}: InputSectionProps) => {\n if (!placeholder) {\n return null;\n }\n\n return (\n <MarkdownFlowInput\n disabled={readonly}\n placeholder={placeholder}\n value={value}\n onChange={onChange}\n onSend={onSend}\n title={placeholder}\n />\n );\n};\n\n// Define custom variable component\nconst CustomButtonInputVariable = ({\n node,\n readonly,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n onSend,\n confirmButtonText = \"Submit\", // Default to English, can be overridden\n beforeSend = () => true,\n}: CustomVariableProps) => {\n const [inputValue, setInputValue] = React.useState(defaultInputText \|\| \"\");\n const [selectedValues, setSelectedValues] = React.useState<string[]>(\n defaultSelectedValues \|\| []\n );\n const isMultiSelect = node.properties?.isMultiSelect ?? false;\n const baseButtonTexts = node.properties?.buttonTexts \|\| [];\n const shouldUseFallbackButton =\n !isMultiSelect &&\n baseButtonTexts.length === 0 &&\n !node.properties?.placeholder;\n const fallbackButtonLabel =\n node.properties?.variableName?.trim() \|\| defaultButtonText \|\| \"Submit\";\n\n const singleSelectNode = React.useMemo<CustomVariableNode>(() => {\n if (!shouldUseFallbackButton) {\n return node;\n }\n return {\n ...node,\n properties: {\n ...(node.properties \|\| {}),\n buttonTexts: [fallbackButtonLabel],\n buttonValues: [fallbackButtonLabel],\n },\n };\n }, [fallbackButtonLabel, node, shouldUseFallbackButton]);\n\n const singleSelectButtonTexts =\n singleSelectNode.properties?.buttonTexts \|\| [];\n const singleSelectButtonValues =\n singleSelectNode.properties?.buttonValues \|\| [];\n const isSingleSelect = !isMultiSelect && singleSelectButtonTexts.length > 0;\n\n const handleButtonClick = (value: string) => {\n const param = {\n variableName: node.properties?.variableName \|\| \"\",\n buttonText: value,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleCheckboxChange = (value: string, checked: boolean) => {\n setSelectedValues((prev) => {\n if (checked) {\n return [...prev, value];\n } else {\n return prev.filter((v) => v !== value);\n }\n });\n };\n\n const handleConfirmClick = () => {\n const noSelection = selectedValues.length === 0 && !inputValue?.trim();\n const param = {\n variableName: node.properties?.variableName \|\| \"\",\n selectedValues,\n inputText: inputValue?.trim() \|\| undefined,\n };\n if (readonly \|\| noSelection) return;\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setInputValue(e.target.value);\n };\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.nativeEvent.isComposing \|\| e.keyCode === 229) {\n return;\n }\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n if (isMultiSelect) {\n const noSelection = selectedValues.length === 0 && !inputValue.trim();\n if (!noSelection) handleConfirmClick();\n } else {\n handleSendClick();\n }\n }\n };\n const handleSendClick = () => {\n const param = {\n variableName: node.properties?.variableName \|\| \"\",\n inputText: inputValue,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const resolvedDefaultButtonText = React.useMemo(() => {\n if (!defaultButtonText) {\n return undefined;\n }\n const valueIndex = singleSelectButtonValues.indexOf(defaultButtonText);\n if (valueIndex > -1) {\n return singleSelectButtonTexts[valueIndex] ?? defaultButtonText;\n }\n const textIndex = singleSelectButtonTexts.indexOf(defaultButtonText);\n if (textIndex > -1) {\n return singleSelectButtonTexts[textIndex];\n }\n return undefined;\n }, [defaultButtonText, singleSelectButtonTexts, singleSelectButtonValues]);\n\n return (\n <span className=\"custom-variable-container inline-flex items-center flex-wrap\">\n {isMultiSelect && (\n <MultiSelectSection\n node={node}\n readonly={readonly}\n selectedValues={selectedValues}\n inputValue={inputValue}\n confirmButtonText={confirmButtonText}\n handleCheckboxChange={handleCheckboxChange}\n handleInputChange={handleInputChange}\n handleKeyDown={handleKeyDown}\n handleConfirmClick={handleConfirmClick}\n />\n )}\n\n {!isMultiSelect && isSingleSelect && (\n <SingleSelectSection\n node={singleSelectNode}\n readonly={readonly}\n resolvedDefaultButtonText={resolvedDefaultButtonText}\n handleButtonClick={handleButtonClick}\n inputValue={inputValue}\n handleInputChange={handleInputChange}\n handleSendClick={handleSendClick}\n />\n )}\n\n {!isMultiSelect && !isSingleSelect && node.properties?.placeholder && (\n <InputSection\n readonly={readonly}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n />\n )}\n </span>\n );\n};\n\nexport default CustomButtonInputVariable;\nexport type {\n ComponentsWithCustomVariable,\n CustomVariableNode,\n CustomVariableProps,\n};\n"],"names":["MultiSelectSection","node","readonly","selectedValues","inputValue","confirmButtonText","handleCheckboxChange","handleInputChange","handleKeyDown","handleConfirmClick","placeholder","confirmDisabled","renderConfirmButton","extraWrapperClassName","jsx","cn","jsxs","text","index","value","buttonValue","Checkbox","checked","InputGroup","InputGroupTextarea","SingleSelectSection","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","setInputValue","React","setSelectedValues","isMultiSelect","baseButtonTexts","shouldUseFallbackButton","fallbackButtonLabel","singleSelectNode","singleSelectButtonTexts","singleSelectButtonValues","isSingleSelect","param","prev","v","noSelection","e","valueIndex","textIndex"],"mappings":"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"}

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

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