@helpai/elements 0.51.5 → 0.51.7

package/index.mjs

@@ -29,7 +29,7 @@ var BRAND = {
 };
 
 // src/core/version.ts
-var ELEMENTS_VERSION = true ? "0.51.5" : "0.0.0-dev";
+var ELEMENTS_VERSION = true ? "0.51.7" : "0.0.0-dev";
 var ELEMENTS_VERSION_PARAM = "_ev";
 
 // src/i18n/strings.ts
@@ -2840,6 +2840,9 @@ function wireHasNoVisibleAnswer(w) {
 function isResumeOwnedWireTurn(w) {
   return w.role === "assistant" && w.status != null && !TERMINAL_WIRE_STATUS.has(w.status) && wireHasNoVisibleAnswer(w);
 }
+function hydrateWireMessages(messages) {
+  return messages.filter((w) => !isResumeOwnedWireTurn(w)).map(fromWireMessage);
+}
 function fromReactive(m) {
   return {
     id: m.id,
@@ -6015,12 +6018,17 @@ function MessageList({
     return () => obs.disconnect();
   }, [messages.value]);
   const activeFormId = form?.form.id;
+  const inlineForm = !!form && (formMarkers ?? []).some((m) => m.formId === form.form.id);
   useLayoutEffect2(() => {
     const el = ref.current;
     if (!el || !activeFormId || detachedRef.current) return;
     if (!messages.value.some((m) => m.role === "user")) return;
-    pinBottom(el);
-  }, [activeFormId]);
+    if (inlineForm) {
+      el.querySelector(`[data-testid="${TID.formGate}"]`)?.scrollIntoView({ block: "nearest" });
+    } else {
+      pinBottom(el);
+    }
+  }, [activeFormId, inlineForm]);
   useEffect7(() => {
     const el = ref.current;
     if (!el) return;
@@ -6093,15 +6101,29 @@ function MessageList({
   const pendingMarkers = [...formMarkers ?? []].toSorted(
     (a, b) => (a.createdAt ?? Infinity) - (b.createdAt ?? Infinity)
   );
-  const markerRow = (marker) => /* @__PURE__ */ jsx19(
-    FormDoneMarker,
-    {
-      marker,
-      strings,
-      onFill: !form && onFillForm ? () => onFillForm(marker.formId) : void 0
-    },
-    marker.key
-  );
+  const markerRow = (marker) => {
+    if (form && marker.formId === form.form.id) {
+      return /* @__PURE__ */ jsx19(
+        FormGate,
+        {
+          form: form.form,
+          strings,
+          onSubmit: form.onSubmit,
+          onSkip: form.onSkip
+        },
+        `gate:${marker.formId}`
+      );
+    }
+    return /* @__PURE__ */ jsx19(
+      FormDoneMarker,
+      {
+        marker,
+        strings,
+        onFill: !form && onFillForm ? () => onFillForm(marker.formId) : void 0
+      },
+      marker.key
+    );
+  };
   const flushMarkersBefore = (createdAt) => {
     for (let next = pendingMarkers[0]; next?.createdAt !== void 0; next = pendingMarkers[0]) {
       if (createdAt !== void 0 && next.createdAt > createdAt) break;
@@ -6154,7 +6176,7 @@ function MessageList({
         children: [
           loading && messages.value.length === 0 ? /* @__PURE__ */ jsx19("div", { class: `${p18}-list-loading`, role: "status", children: strings.conversationLoading }) : null,
           rows,
-          form ? /* @__PURE__ */ jsx19(FormGate, { form: form.form, strings, onSubmit: form.onSubmit, onSkip: form.onSkip }) : null
+          form && !inlineForm ? /* @__PURE__ */ jsx19(FormGate, { form: form.form, strings, onSubmit: form.onSubmit, onSkip: form.onSkip }) : null
         ]
       }
     ),
@@ -7776,7 +7798,7 @@ function App({ options, hostElement, bus }) {
       try {
         const [chat, markers] = await Promise.all([transport.loadConversation(conversationId), fetchFormMarkers()]);
         if (isStale()) return;
-        const loaded = (chat.messages ?? []).filter((w) => !isResumeOwnedWireTurn(w)).map(fromWireMessage);
+        const loaded = hydrateWireMessages(chat.messages ?? []);
         setFormMarkers(markers);
         const tail = resumeBubbleRef.current ? [resumeBubbleRef.current] : [];
         if (loaded.length || tail.length) {
@@ -8490,7 +8512,7 @@ function App({ options, hostElement, bus }) {
           transport.loadConversation(targetConversationId),
           fetchFormMarkers(targetConversationId)
         ]);
-        const hydrated = res.messages.filter((w) => !isResumeOwnedWireTurn(w)).map(fromWireMessage);
+        const hydrated = hydrateWireMessages(res.messages);
         batch(() => {
           messagesSig.value = withWelcomeRows(hydrated, markers);
           conversationIdSig.value = res.conversationId;

package/package.json

@@ -80,5 +80,5 @@
   ],
   "type": "module",
   "types": "./index.d.ts",
-  "version": "0.51.5"
+  "version": "0.51.7"
 }

package/web-component.mjs

@@ -1794,7 +1794,7 @@ function createAuth(opts) {
 }
 
 // src/core/version.ts
-var ELEMENTS_VERSION = true ? "0.51.5" : "0.0.0-dev";
+var ELEMENTS_VERSION = true ? "0.51.7" : "0.0.0-dev";
 var ELEMENTS_VERSION_PARAM = "_ev";
 
 // src/stream/types.ts
@@ -2799,6 +2799,9 @@ function wireHasNoVisibleAnswer(w) {
 function isResumeOwnedWireTurn(w) {
   return w.role === "assistant" && w.status != null && !TERMINAL_WIRE_STATUS.has(w.status) && wireHasNoVisibleAnswer(w);
 }
+function hydrateWireMessages(messages) {
+  return messages.filter((w) => !isResumeOwnedWireTurn(w)).map(fromWireMessage);
+}
 function fromReactive(m) {
   return {
     id: m.id,
@@ -5974,12 +5977,17 @@ function MessageList({
     return () => obs.disconnect();
   }, [messages.value]);
   const activeFormId = form?.form.id;
+  const inlineForm = !!form && (formMarkers ?? []).some((m) => m.formId === form.form.id);
   useLayoutEffect2(() => {
     const el = ref.current;
     if (!el || !activeFormId || detachedRef.current) return;
     if (!messages.value.some((m) => m.role === "user")) return;
-    pinBottom(el);
-  }, [activeFormId]);
+    if (inlineForm) {
+      el.querySelector(`[data-testid="${TID.formGate}"]`)?.scrollIntoView({ block: "nearest" });
+    } else {
+      pinBottom(el);
+    }
+  }, [activeFormId, inlineForm]);
   useEffect7(() => {
     const el = ref.current;
     if (!el) return;
@@ -6052,15 +6060,29 @@ function MessageList({
   const pendingMarkers = [...formMarkers ?? []].toSorted(
     (a, b) => (a.createdAt ?? Infinity) - (b.createdAt ?? Infinity)
   );
-  const markerRow = (marker) => /* @__PURE__ */ jsx19(
-    FormDoneMarker,
-    {
-      marker,
-      strings,
-      onFill: !form && onFillForm ? () => onFillForm(marker.formId) : void 0
-    },
-    marker.key
-  );
+  const markerRow = (marker) => {
+    if (form && marker.formId === form.form.id) {
+      return /* @__PURE__ */ jsx19(
+        FormGate,
+        {
+          form: form.form,
+          strings,
+          onSubmit: form.onSubmit,
+          onSkip: form.onSkip
+        },
+        `gate:${marker.formId}`
+      );
+    }
+    return /* @__PURE__ */ jsx19(
+      FormDoneMarker,
+      {
+        marker,
+        strings,
+        onFill: !form && onFillForm ? () => onFillForm(marker.formId) : void 0
+      },
+      marker.key
+    );
+  };
   const flushMarkersBefore = (createdAt) => {
     for (let next = pendingMarkers[0]; next?.createdAt !== void 0; next = pendingMarkers[0]) {
       if (createdAt !== void 0 && next.createdAt > createdAt) break;
@@ -6113,7 +6135,7 @@ function MessageList({
         children: [
           loading && messages.value.length === 0 ? /* @__PURE__ */ jsx19("div", { class: `${p18}-list-loading`, role: "status", children: strings.conversationLoading }) : null,
           rows,
-          form ? /* @__PURE__ */ jsx19(FormGate, { form: form.form, strings, onSubmit: form.onSubmit, onSkip: form.onSkip }) : null
+          form && !inlineForm ? /* @__PURE__ */ jsx19(FormGate, { form: form.form, strings, onSubmit: form.onSubmit, onSkip: form.onSkip }) : null
         ]
       }
     ),
@@ -7735,7 +7757,7 @@ function App({ options, hostElement, bus }) {
       try {
         const [chat, markers] = await Promise.all([transport.loadConversation(conversationId), fetchFormMarkers()]);
         if (isStale()) return;
-        const loaded = (chat.messages ?? []).filter((w) => !isResumeOwnedWireTurn(w)).map(fromWireMessage);
+        const loaded = hydrateWireMessages(chat.messages ?? []);
         setFormMarkers(markers);
         const tail = resumeBubbleRef.current ? [resumeBubbleRef.current] : [];
         if (loaded.length || tail.length) {
@@ -8449,7 +8471,7 @@ function App({ options, hostElement, bus }) {
           transport.loadConversation(targetConversationId),
           fetchFormMarkers(targetConversationId)
         ]);
-        const hydrated = res.messages.filter((w) => !isResumeOwnedWireTurn(w)).map(fromWireMessage);
+        const hydrated = hydrateWireMessages(res.messages);
         batch(() => {
           messagesSig.value = withWelcomeRows(hydrated, markers);
           conversationIdSig.value = res.conversationId;