@inploi/plugin-chatbot 3.11.0 → 3.12.1

package/dist/{job-application-content-3cc77e28.js → chatbot-body-ed7bd24c.js}

@@ -1,29 +1,5 @@
-import { N, _, h as hasProp, i as invariant, o as o$1, c as clsx, a as _$1, p, b as parse, d as picklist, y, e as application, f as h, k, C as Cn, g as parseAsync, V as ValiError, j as object, t as transform, m as maxLength, l as minLength, r as record, n as boolean, s as string, q as email, u as url, v as regex, T, w as inputHeight, x as m, A as AnimatePresence, F, z as viewState, E as ERROR_MESSAGES } from "./index-5333c591.js";
+import { _, g as getHeadOrThrow, i as invariant, A as AbortedError, N, a as getFlowSubmissionsPayload, h as hasProp, k as kbToReadableSize, o as o$1, c as clsx, b as a$2, d as _$1, y, F, s as store, p, e as parse, f as picklist, j as h, l as k, m as isSubmissionOfType, C as Cn, n as parseAsync, V as ValiError, q as object, t as transform, r as maxLength, u as minLength, v as record, w as boolean, x as string, z as email, B as url, D as regex, T, E as m, G as AnimatePresence, H as ERROR_MESSAGES } from "./index-fc00a362.js";
 import "@inploi/sdk";
-const kbToReadableSize = (kb) => N(kb).with(_.number.lte(1e3), () => `${Math.round(kb)}KB`).with(_.number.lt(1e3 * 10), () => `${(kb / 1e3).toFixed(1)}MB`).otherwise(() => `${Math.round(kb / 1e3)}MB`);
-const getHeadOrThrow = (nodes) => {
-  const head = nodes.find((n2) => n2.isHead);
-  if (!head)
-    throw new Error("No head node found");
-  return head;
-};
-const getApplicationSubmissionsPayload = (submissions) => {
-  const payload = Object.entries(submissions).reduce((acc, [key, submission]) => {
-    acc[key] = submission.value;
-    return acc;
-  }, {});
-  return payload;
-};
-const isSubmissionOfType = (type) => (submission) => {
-  if (!submission)
-    return false;
-  return submission.type === type;
-};
-class AbortedError extends Error {
-  constructor() {
-    super("Aborted");
-  }
-}
 const followNodes = ({
   node,
   nodes,
@@ -75,7 +51,7 @@ const createFlowInterpreter = ({
   onFlowEnd,
   onInterpret
 }) => {
-  const controller = new AbortController();
+  let controller = new AbortController();
   const interpretNode = async (node, prevNode) => {
     const submissions = getSubmissions();
     onInterpret == null ? void 0 : onInterpret(node, prevNode);
@@ -120,6 +96,27 @@ const createFlowInterpreter = ({
       const startNode = flow.find((node) => node.id === startFromNodeId) ?? getHeadOrThrow(flow);
       return interpretNode(startNode);
     },
+    undo: (nodeHistory) => {
+      let removed = 1;
+      const formerLastNode = flow.find((n2) => n2.id === nodeHistory[nodeHistory.length - 1]);
+      for (let i2 = nodeHistory.length - 2; i2 > 0; i2--) {
+        const nodeId = nodeHistory[i2];
+        const node = flow.find((n2) => n2.id === nodeId);
+        if (!node)
+          break;
+        removed++;
+        if (node.type.startsWith("question-"))
+          break;
+      }
+      controller.abort();
+      controller = new AbortController();
+      const newStartNode = flow.find((node) => node.id === nodeHistory[nodeHistory.length - removed]);
+      invariant(newStartNode, "Undo failed: new start node not found");
+      interpretNode(newStartNode, formerLastNode);
+      return {
+        removed
+      };
+    },
     abort: () => {
       controller.abort();
     }
@@ -198,22 +195,17 @@ async function interpretSubmitNode({
   analytics
 }) {
   await chat.userInput({
-    type: "multiple-choice",
+    type: "submit",
     key: void 0,
     config: {
-      options: [{
-        label: "Submit my application",
-        value: "submit"
-      }],
-      maxSelected: 1,
-      minSelected: 1
+      label: "Submit my application"
     }
   });
   const logApplyComplete = () => {
-    const contextJobId = typeof context.jobId === "string" ? context.jobId : void 0;
-    const contextFlowId = typeof context.flowId === "string" ? context.flowId : void 0;
-    invariant(contextJobId);
-    invariant(contextFlowId);
+    const contextJobId = typeof context.job_id === "string" ? context.job_id : void 0;
+    const contextFlowId = typeof context.flow_id === "string" ? context.flow_id : void 0;
+    if (!contextJobId || !contextFlowId)
+      return;
     if (contextJobId) {
       analytics.log({
         event: "APPLY_COMPLETE",
@@ -241,7 +233,7 @@ async function interpretSubmitNode({
       integration_id: node.data.integrationId,
       anonymous_id,
       session_id,
-      submissions: getApplicationSubmissionsPayload(submissions || {})
+      submissions: getFlowSubmissionsPayload(submissions || {})
     })
   }).catch((e) => e);
   await N(response).with({
@@ -812,6 +804,96 @@ const SendButton = ({
     })]
   })
 });
+const TYPING_SPEED_MS_PER_CHARACTER = 25;
+const scrollToEndFn$ = a$2({
+  instant: () => {
+  },
+  smooth: () => {
+  }
+});
+const chatStore = {
+  onSubmitSuccessFn$: a$2(() => {
+  }),
+  isBotTyping$: a$2(false),
+  scrollToEnd: {
+    instant: () => scrollToEndFn$.value.instant(),
+    smooth: () => scrollToEndFn$.value.smooth()
+  }
+};
+const useChatService = () => {
+  const chatRef = _$1(null);
+  y(() => {
+    scrollToEndFn$.value = {
+      instant: () => {
+        var _a;
+        return (_a = chatRef.current) == null ? void 0 : _a.scrollTo({
+          top: chatRef.current.scrollHeight,
+          behavior: "instant"
+        });
+      },
+      smooth: () => {
+        if (!chatRef.current)
+          return;
+        if (chatRef.current.scrollHeight - chatRef.current.scrollTop <= chatRef.current.clientHeight * 1.5) {
+          chatRef.current.scrollTo({
+            top: chatRef.current.scrollHeight,
+            behavior: "smooth"
+          });
+        }
+      }
+    };
+  }, [chatRef]);
+  const chatService = F(() => ({
+    send: async ({
+      message,
+      signal: signal2,
+      groupId
+    }) => {
+      await N(message).with({
+        author: "bot",
+        type: "text"
+      }, async (message2) => {
+        if (signal2 == null ? void 0 : signal2.aborted)
+          throw new AbortedError();
+        chatStore.isBotTyping$.value = true;
+        const typingTime = Math.min(Math.max(20, message2.text.length), 100) * TYPING_SPEED_MS_PER_CHARACTER;
+        await new Promise((resolve) => {
+          return setTimeout(resolve, typingTime, {
+            signal: signal2
+          });
+        });
+        chatStore.isBotTyping$.value = false;
+      }).otherwise(async () => void 0);
+      if (signal2 == null ? void 0 : signal2.aborted)
+        throw new AbortedError();
+      store.addMessage(message, groupId);
+    },
+    input: async ({
+      input,
+      signal: signal2
+    }) => {
+      if (signal2 == null ? void 0 : signal2.aborted)
+        throw new AbortedError();
+      store.setInput(input);
+      return await new Promise((resolve) => {
+        const submitFunction = (submission) => {
+          if (signal2 == null ? void 0 : signal2.aborted)
+            throw new AbortedError();
+          store.setInput(void 0);
+          if (input.key) {
+            store.setSubmission(input.key, submission);
+          }
+          resolve(submission);
+        };
+        chatStore.onSubmitSuccessFn$.value = submitFunction;
+      });
+    }
+  }), []);
+  return {
+    chatRef,
+    chatService
+  };
+};
 const SkipButton = ({
   class: className,
   ...props
@@ -1006,7 +1088,7 @@ const ChatInputFile = ({
   onHeightChange
 }) => {
   var _a;
-  const submission = (_a = application.current$.value.application) == null ? void 0 : _a.data.submissions[input.key];
+  const submission = (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key];
   const [files, setFiles] = h(isFileSubmission(submission) && submission.value !== null ? submission.value : []);
   const [error, setError] = h();
   const hiddenFileCount = files.length - FILENAMES_TO_SHOW_QTY;
@@ -2643,7 +2725,8 @@ const ChatInputMultipleChoice = ({
   onHeightChange
 }) => {
   var _a, _b;
-  const submission = input.key ? (_a = application.current$.value.application) == null ? void 0 : _a.data.submissions[input.key] : void 0;
+  const submission = input.key ? (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key] : void 0;
+  const isSingleChoice = (input.config.minSelected === 1 || input.config.minSelected === void 0) && input.config.maxSelected === 1;
   const {
     register,
     handleSubmit,
@@ -2652,12 +2735,11 @@ const ChatInputMultipleChoice = ({
     }
   } = useForm({
     defaultValues: {
-      checked: isMultipleChoiceSubmission(submission) ? Object.fromEntries(submission.value.map((key) => [key, true])) : {}
+      checked: isSingleChoice ? {} : isMultipleChoiceSubmission(submission) ? Object.fromEntries(submission.value.map((key) => [key, true])) : {}
     },
     resolver: getResolver$1(input.config)
   });
   const focusRef = useFocusOnMount();
-  const isSingleChoice = (input.config.minSelected === 1 || input.config.minSelected === void 0) && input.config.maxSelected === 1;
   return o$1("form", {
     noValidate: true,
     class: "flex flex-col gap-1 pr-2.5",
@@ -2722,6 +2804,41 @@ const ChatInputMultipleChoice = ({
     })]
   });
 };
+const ChatInputSubmit = ({
+  input,
+  onSubmitSuccess
+}) => {
+  return o$1("div", {
+    class: "flex flex-col items-center py-3",
+    children: o$1("button", {
+      class: "bg-accent-9 hover:bg-accent-10 active:bg-submit-bg-active hover:border-accent-10 active:border-submit-bg-active border-accent-9 ring-accent-6 focus-visible:outline-accent-8 ring-offset-neutral-1 group flex cursor-pointer rounded-full border border-solid px-5 py-3 pr-4 text-white shadow-[inset_0px_-6px_2px_-1px_oklch(100_0_0/.45),inset_0px_1px_1px_oklch(100_0_0/.3)] outline-none ring-1 ring-offset-[1.5px] transition-all duration-300 focus-visible:outline-2 active:shadow-[inset_0px_0px_2px_-1px_oklch(100_0_0/.45),inset_0px_3px_1px_.5px_oklch(0_0_0/.08)] active:ring-2 active:ring-offset-2",
+      name: input.key,
+      onClick: () => {
+        onSubmitSuccess(null);
+      },
+      children: o$1("span", {
+        class: "relative bottom-[2px] top-[-2px] flex items-center gap-1.5 transition-all duration-300 group-active:bottom-0 group-active:top-0",
+        children: [o$1("span", {
+          class: "inline-flex items-center text-sm font-medium",
+          children: input.config.label
+        }), o$1("svg", {
+          stroke: "currentColor",
+          "stroke-width": "1.5",
+          width: "16",
+          height: "16",
+          viewBox: "0 0 16 16",
+          fill: "none",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: [o$1("path", {
+            d: "M4 8L8 4L12 8"
+          }), o$1("path", {
+            d: "M8 4V13"
+          })]
+        })]
+      })
+    })
+  });
+};
 const errors = {
   empty: "Please enter some text",
   email: "That doesn’t look like a valid email address",
@@ -2764,7 +2881,7 @@ const ChatInputText = ({
   onHeightChange
 }) => {
   var _a;
-  const submission = input.key ? (_a = application.current$.value.application) == null ? void 0 : _a.data.submissions[input.key] : void 0;
+  const submission = input.key ? (_a = store.current$.value.flow) == null ? void 0 : _a.data.submissions[input.key] : void 0;
   const defaultValue = input.config.defaultValue;
   const {
     register,
@@ -2830,22 +2947,19 @@ const ChatInputText = ({
     })
   });
 };
-const ChatInput = ({
-  onSubmit,
-  onInputChange,
-  input
-}) => {
+const ChatInput = () => {
+  var _a;
+  const input = (_a = store.current$.value.flow) == null ? void 0 : _a.data.currentInput;
   const inputWrapperRef = _$1(null);
   const updateHeight = T(() => {
     if (inputWrapperRef.current) {
-      inputHeight.value = inputWrapperRef.current.getBoundingClientRect().height;
+      store.inputHeight$.value = inputWrapperRef.current.getBoundingClientRect().height;
     }
   }, []);
   p(() => {
     updateHeight();
-    onInputChange(input == null ? void 0 : input.type);
-  }, [input == null ? void 0 : input.type, onInputChange, updateHeight]);
-  const handleSubmitSuccess = (type) => (value) => onSubmit({
+  }, [input == null ? void 0 : input.type, updateHeight]);
+  const handleSubmitSuccess = (type) => (value) => chatStore.onSubmitSuccessFn$.value({
     type,
     value
   });
@@ -2854,18 +2968,19 @@ const ChatInput = ({
       height: 0
     },
     animate: {
-      height: inputHeight.value
+      height: store.inputHeight$.value
     },
     exit: {
       height: 0,
       opacity: 0
     },
+    onAnimationStart: chatStore.scrollToEnd.smooth,
+    onAnimationComplete: chatStore.scrollToEnd.smooth,
     class: "bg-statusbar absolute bottom-0 w-full overflow-hidden rounded-b-3xl backdrop-blur-md backdrop-saturate-150",
     children: o$1("div", {
       ref: inputWrapperRef,
       class: "border-divider border-t",
       children: N({
-        application,
         input,
         onHeightChange: updateHeight
       }).with({
@@ -2910,6 +3025,13 @@ const ChatInput = ({
       }, (props) => o$1(ChatInputFile, {
         onSubmitSuccess: handleSubmitSuccess(props.input.type),
         ...props
+      })).with({
+        input: {
+          type: "submit"
+        }
+      }, (props) => o$1(ChatInputSubmit, {
+        onSubmitSuccess: handleSubmitSuccess(props.input.type),
+        ...props
       })).exhaustive()
     })
   });
@@ -2958,7 +3080,7 @@ const cva = (base, config) => {
     return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);
   };
 };
-const chatBubbleVariants = cva("max-w-[min(100%,24rem)] [text-wrap:pretty] leading-snug flex-shrink min-w-[2rem] py-2 px-3 rounded-[18px] min-h-[36px] break-words", {
+const chatBubbleVariants = cva("max-w-[min(100%,24rem)] [text-wrap:pretty] leading-snug flex-shrink min-w-[2rem] py-2 px-3 rounded-[18px] min-h-[36px] break-words relative", {
   variants: {
     side: {
       left: "bg-bubble-weak-bg text-neutral-12 shadow-surface-sm outline outline-1 outline-bubble-weak rounded-bl-md",
@@ -3018,18 +3140,24 @@ const TypingIndicator = ({
   className,
   ...props
 }) => {
+  p(() => {
+    chatStore.scrollToEnd.smooth();
+  });
   return o$1("div", {
-    "aria-label": "Typing…",
-    class: clsx("flex gap-1 p-4", className),
-    ...props,
-    children: Array.from({
-      length: 3
-    }, (_2, i2) => o$1("div", {
-      class: "bg-accent-9 h-1.5 w-1.5 animate-bounce rounded-full",
-      style: {
-        animationDelay: `${-i2 * 200}ms`
-      }
-    }))
+    "aria-hidden": true,
+    children: chatStore.isBotTyping$.value === true ? o$1("div", {
+      "aria-label": "Typing…",
+      class: clsx("flex gap-1 p-4", className),
+      ...props,
+      children: Array.from({
+        length: 3
+      }, (_2, i2) => o$1("div", {
+        class: "bg-accent-9 h-1.5 w-1.5 animate-bounce rounded-full",
+        style: {
+          animationDelay: `${-i2 * 200}ms`
+        }
+      }))
+    }) : void 0
   });
 };
 const authorToSide = {
@@ -3047,213 +3175,131 @@ const systemMessageStyle = cva("w-full select-none py-2 text-wrap-balance text-c
   }
 });
 const Conversation = ({
-  messages,
-  isBotTyping
+  lastSentMessageFooter
 }) => {
+  var _a;
+  const messages = ((_a = store.current$.value.flow) == null ? void 0 : _a.data.messages) ?? [];
+  p(() => {
+    chatStore.scrollToEnd.smooth();
+  }, [messages.length]);
   return o$1("ol", {
     "aria-label": "Chat messages",
     class: "flex flex-col justify-end gap-2 p-2 pt-[calc(var(--header-height)+1rem)]",
     children: [o$1(AnimatePresence, {
       initial: false,
-      children: messages.map((message, i2) => o$1("li", {
-        class: "flex",
-        children: N(message).with({
-          type: "system"
-        }, (message2) => o$1("p", {
-          class: systemMessageStyle({
-            variant: message2.variant
-          }),
-          children: message2.text
-        })).with({
-          type: "text",
-          author: _.union("bot", "user")
-        }, (message2) => {
-          return o$1(ChatBubble, {
-            side: authorToSide[message2.author],
-            children: message2.text
-          }, i2);
-        }).with({
-          type: "link"
-        }, (message2) => {
-          return o$1("div", {
-            class: "bg-accent-3 flex w-full items-center justify-center overflow-hidden rounded-xl px-2 py-2",
-            children: o$1("a", {
-              class: "bg-lowest shadow-surface-sm ring-accent-6 hover:ring-accent-8 active:bg-accent-2 active:text-accent-10 text-accent-9 focus-visible:ring-accent-7/50 text-wrap-balance flex items-center gap-1.5 rounded-full py-2 pl-4 pr-2.5 text-center no-underline ring-1 transition-all focus:outline-none focus-visible:ring-4 focus-visible:ring-offset-2",
-              target: "_blank",
-              href: message2.href,
-              children: [message2.text, o$1("svg", {
-                class: "flex-none",
-                width: "15",
-                height: "15",
-                viewBox: "0 0 15 15",
-                fill: "none",
-                xmlns: "http://www.w3.org/2000/svg",
-                children: o$1("path", {
-                  d: "M3.64645 11.3536C3.45118 11.1583 3.45118 10.8417 3.64645 10.6465L10.2929 4L6 4C5.72386 4 5.5 3.77614 5.5 3.5C5.5 3.22386 5.72386 3 6 3L11.5 3C11.6326 3 11.7598 3.05268 11.8536 3.14645C11.9473 3.24022 12 3.36739 12 3.5L12 9.00001C12 9.27615 11.7761 9.50001 11.5 9.50001C11.2239 9.50001 11 9.27615 11 9.00001V4.70711L4.35355 11.3536C4.15829 11.5488 3.84171 11.5488 3.64645 11.3536Z",
-                  fill: "currentColor",
-                  "fill-rule": "evenodd",
-                  "clip-rule": "evenodd"
+      children: messages.map((message, i2) => {
+        return o$1(k, {
+          children: o$1("li", {
+            class: "flex",
+            children: N(message).with({
+              type: "system"
+            }, (message2) => o$1("p", {
+              class: systemMessageStyle({
+                variant: message2.variant
+              }),
+              children: message2.text
+            })).with({
+              type: "text",
+              author: _.union("bot", "user")
+            }, (message2) => {
+              const isLastSentMessage = message2.author === "user" && !messages.slice(i2 + 1).some((m2) => m2.type === "text" && m2.author === "user");
+              return o$1(ChatBubble, {
+                side: authorToSide[message2.author],
+                children: [message2.text, isLastSentMessage ? lastSentMessageFooter : null]
+              }, i2);
+            }).with({
+              type: "link"
+            }, (message2) => {
+              return o$1("div", {
+                class: "bg-accent-3 flex w-full items-center justify-center overflow-hidden rounded-xl px-2 py-2",
+                children: o$1("a", {
+                  class: "bg-lowest shadow-surface-sm ring-accent-6 hover:ring-accent-8 active:bg-accent-2 active:text-accent-10 text-accent-9 focus-visible:ring-accent-7/50 text-wrap-balance flex items-center gap-1.5 rounded-full py-2 pl-4 pr-2.5 text-center no-underline ring-1 transition-all focus:outline-none focus-visible:ring-4 focus-visible:ring-offset-2",
+                  target: "_blank",
+                  href: message2.href,
+                  children: [message2.text, o$1("svg", {
+                    class: "flex-none",
+                    width: "15",
+                    height: "15",
+                    viewBox: "0 0 15 15",
+                    fill: "none",
+                    xmlns: "http://www.w3.org/2000/svg",
+                    children: o$1("path", {
+                      d: "M3.64645 11.3536C3.45118 11.1583 3.45118 10.8417 3.64645 10.6465L10.2929 4L6 4C5.72386 4 5.5 3.77614 5.5 3.5C5.5 3.22386 5.72386 3 6 3L11.5 3C11.6326 3 11.7598 3.05268 11.8536 3.14645C11.9473 3.24022 12 3.36739 12 3.5L12 9.00001C12 9.27615 11.7761 9.50001 11.5 9.50001C11.2239 9.50001 11 9.27615 11 9.00001V4.70711L4.35355 11.3536C4.15829 11.5488 3.84171 11.5488 3.64645 11.3536Z",
+                      fill: "currentColor",
+                      "fill-rule": "evenodd",
+                      "clip-rule": "evenodd"
+                    })
+                  })]
                 })
-              })]
-            })
-          });
-        }).with({
-          type: "image"
-        }, (image) => o$1("img", {
-          class: "shadow-surface-md w-full max-w-[min(100%,24rem)] rounded-2xl",
-          src: image.url,
-          style: {
-            aspectRatio: image.width / image.height
-          }
-        })).with({
-          type: "file"
-        }, (file) => {
-          return o$1(FileThumbnail, {
-            class: file.author === "bot" ? "" : "ml-auto",
-            file: {
-              name: file.fileName,
-              sizeKb: file.fileSizeKb
-            }
-          });
-        }).exhaustive()
-      }, i2))
-    }), o$1("aside", {
-      "aria-hidden": true,
-      children: isBotTyping && o$1(TypingIndicator, {})
-    })]
+              });
+            }).with({
+              type: "image"
+            }, (image) => o$1("img", {
+              class: "shadow-surface-md w-full max-w-[min(100%,24rem)] rounded-2xl",
+              src: image.url,
+              style: {
+                aspectRatio: image.width / image.height
+              }
+            })).with({
+              type: "file"
+            }, (file) => {
+              return o$1(FileThumbnail, {
+                class: file.author === "bot" ? "" : "ml-auto",
+                file: {
+                  name: file.fileName,
+                  sizeKb: file.fileSizeKb
+                }
+              });
+            }).exhaustive()
+          })
+        }, i2);
+      })
+    }), o$1(TypingIndicator, {}, "typing")]
   });
 };
-const TYPING_SPEED_MS_PER_CHARACTER = 25;
-const useChatService = () => {
-  const chatRef = _$1(null);
-  const [isBotTyping, setIsBotTyping] = h(false);
-  const [onSubmitSuccessFn, setOnSubmitSuccessFn] = h(() => () => {
-  });
-  const scrollToEnd = F(() => (options2) => {
-    var _a;
-    return (_a = chatRef.current) == null ? void 0 : _a.scrollTo({
-      top: chatRef.current.scrollHeight,
-      ...options2
-    });
-  }, [chatRef]);
-  const chatService = F(() => ({
-    send: async ({
-      message,
-      signal,
-      groupId
-    }) => {
-      await N(message).with({
-        author: "bot",
-        type: "text"
-      }, async (message2) => {
-        if (signal == null ? void 0 : signal.aborted)
-          throw new AbortedError();
-        setIsBotTyping(true);
-        const typingTime = Math.min(Math.max(20, message2.text.length), 100) * TYPING_SPEED_MS_PER_CHARACTER;
-        await new Promise((resolve) => {
-          return setTimeout(resolve, typingTime, {
-            signal
-          });
-        });
-        setIsBotTyping(false);
-      }).otherwise(async () => void 0);
-      if (signal == null ? void 0 : signal.aborted)
-        throw new AbortedError();
-      application.addMessage(message, groupId);
-    },
-    input: async ({
-      input,
-      signal
-    }) => {
-      if (signal == null ? void 0 : signal.aborted)
-        throw new AbortedError();
-      application.setInput(input);
-      return await new Promise((resolve) => {
-        const submitFunction = (submission) => {
-          if (signal == null ? void 0 : signal.aborted)
-            throw new AbortedError();
-          application.setInput(void 0);
-          if (input.key) {
-            application.setSubmission;
-            application.setSubmission(input.key, submission);
-          }
-          resolve(submission);
-        };
-        setOnSubmitSuccessFn(() => submitFunction);
-      });
-    }
-  }), []);
-  return {
-    chatRef,
-    chatService,
-    isBotTyping,
-    onSubmitSuccessFn,
-    scrollToEnd
-  };
-};
-const JobApplicationContent = ({
-  currentApplication,
+const ChatbotBody = ({
   logger,
   apiClient,
   analytics
 }) => {
+  const {
+    flow
+  } = store.current$.value;
+  invariant(flow, "Flow is required to exist to show chatbot body");
+  const view = store.viewState$.value;
   const {
     chatRef,
-    chatService,
-    isBotTyping,
-    onSubmitSuccessFn,
-    scrollToEnd
+    chatService
   } = useChatService();
-  const view = viewState.value;
-  const flow = currentApplication.flow;
-  const job = currentApplication.job;
+  const [undoFn, setUndoFn] = h();
   y(() => {
     if (view === "maximised")
-      scrollToEnd({
-        behavior: "instant"
-      });
-  }, [scrollToEnd, view]);
-  p(() => {
-    scrollToEnd({
-      behavior: "smooth"
-    });
-  }, [currentApplication.data.messages, scrollToEnd]);
+      chatStore.scrollToEnd.instant();
+  }, [view]);
   y(() => {
     const {
       state,
-      application: currentApplication2
-    } = application.current$.peek();
+      flow: currentApplication
+    } = store.current$.peek();
     if (state !== "loaded")
       throw new Error(ERROR_MESSAGES.invalid_state);
-    let fromNodeId = currentApplication2.data.currentNodeId;
-    scrollToEnd({
-      behavior: "instant"
-    });
-    application.setInput(void 0);
-    if (currentApplication2.data.isFinished)
+    let fromNodeId = currentApplication.data.nodeHistory.at(-1);
+    chatStore.scrollToEnd.instant();
+    store.setInput(void 0);
+    if (currentApplication.data.isFinished)
       return;
-    if (fromNodeId === null) {
+    if (fromNodeId === void 0) {
       fromNodeId = getHeadOrThrow(flow.nodes).id;
-      application.setCurrentNodeId(fromNodeId);
-      analytics.log({
-        event: "APPLY_START",
-        attributionKey: `job_${job.id}`,
-        properties: {
-          job_id: job.id,
-          flow_id: flow.id
-        }
-      });
+      store.setCurrentNodeId(fromNodeId);
     } else {
-      application.removeLastGroupMessagesById(fromNodeId);
+      store.removeMessagesSentByNodeIds([fromNodeId]);
     }
     const {
       interpret: interpret2,
-      abort
+      abort,
+      undo
     } = createFlowInterpreter({
-      context: {
-        jobId: job.id,
-        flowId: flow.id
-      },
+      context: flow.context,
       analytics,
       apiClient,
       logger,
@@ -3262,59 +3308,89 @@ const JobApplicationContent = ({
       // We need to get fresh submissions, that’s why we call `peek` here.
       getSubmissions: () => {
         var _a;
-        return (_a = application.current$.peek().application) == null ? void 0 : _a.data.submissions;
+        return (_a = store.current$.peek().flow) == null ? void 0 : _a.data.submissions;
       },
       onInterpret: (node, prevNode) => {
-        const currentState = application.current$.peek().application;
+        const currentState = store.current$.peek().flow;
         invariant(currentState);
         if (prevNode) {
           currentState.data.sequence = currentState.data.sequence + 1;
           analytics.log({
             event: "FLOW_NODE",
-            attributionKey: `job_${job.id}`,
             properties: {
               flow_id: flow.id,
               flow_version: flow.version,
-              job_id: job.id,
               from_node_id: prevNode.id,
               to_node_id: node.id,
               sequence: currentState.data.sequence,
               flow_session_id: currentState.data.flowSessionId
-            }
+            },
+            customProperties: flow.context
           });
         }
-        application.setCurrentNodeId(node.id);
+        store.setCurrentNodeId(node.id);
       },
       onFlowEnd: async () => {
-        application.markAsFinished();
+        store.markAsFinished();
       }
     });
+    setUndoFn(() => undo);
     interpret2(fromNodeId);
     return abort;
-  }, [analytics, apiClient, chatService, logger, scrollToEnd, flow, job.id, currentApplication.startedAt]);
+  }, [analytics, apiClient, chatService, logger, flow]);
   return o$1(k, {
     children: [o$1("div", {
       ref: chatRef,
-      className: "hide-scrollbars relative flex max-w-full flex-grow flex-col overflow-y-scroll",
+      className: "hide-scrollbars relative flex w-full max-w-full flex-grow flex-col overflow-y-scroll",
       style: {
         WebkitOverflowScrolling: "touch",
-        paddingBottom: inputHeight.value
+        paddingBottom: store.inputHeight$.value
       },
-      children: o$1(AnimatePresence, {
-        children: o$1(Conversation, {
-          isBotTyping,
-          messages: currentApplication.data.messages
+      children: o$1(Conversation, {
+        lastSentMessageFooter: flow.data.isFinished || !undoFn ? null : o$1(UndoButton, {
+          undoFn
         })
       })
-    }), o$1(ChatInput, {
-      input: currentApplication.data.currentInput,
-      onInputChange: () => scrollToEnd({
-        behavior: "smooth"
-      }),
-      onSubmit: onSubmitSuccessFn
-    })]
+    }), o$1(ChatInput, {})]
+  });
+};
+const getNodeKeys = (node) => {
+  if ("key" in node.data && node.data.key)
+    return [node.data.key];
+  if ("keys" in node.data)
+    return Object.values(node.data.keys).filter((key) => typeof key === "string");
+  return [];
+};
+const UndoButton = ({
+  undoFn
+}) => {
+  return o$1("div", {
+    class: "absolute bottom-0 right-0 flex w-full translate-y-full justify-end",
+    children: o$1("button", {
+      class: "fr touch-hitbox text-neutral-9 hover:text-neutral-12 rounded-full p-1 text-right text-xs transition-all",
+      onClick: async () => {
+        const {
+          flow
+        } = store.current$.peek();
+        invariant(flow);
+        const {
+          removed
+        } = undoFn(flow.data.nodeHistory);
+        const removedNodeIds = flow.data.nodeHistory.splice(-removed);
+        if (removedNodeIds.length === 0)
+          return;
+        store.removeMessagesSentByNodeIds(removedNodeIds);
+        store.setInput(void 0);
+        removedNodeIds.pop();
+        removedNodeIds.map((nodeId) => flow.nodes.find((node) => node.id === nodeId)).filter(Boolean).flatMap(getNodeKeys).forEach((key) => delete flow.data.submissions[key]);
+        store.current$.value = {
+          ...store.current$.value
+        };
+      },
+      children: "Undo"
+    })
   });
 };
 export {
-  JobApplicationContent
+  ChatbotBody
 };