@syntrologie/adapt-chatbot 2.37.2 → 2.39.0

package/dist/runtime.js

@@ -23,7 +23,8 @@ import "./chunk-OIGVZGSX.js";
 import {
   DIVE_DEEPER_EVENT,
   TILE_MOUNTED_EVENT,
-  TILE_UNMOUNTED_EVENT
+  TILE_UNMOUNTED_EVENT,
+  stripMountPlumbing
 } from "./chunk-EACGDSJI.js";
 import "./chunk-UVKRO5ER.js";
 
@@ -265,6 +266,33 @@ var ChatSession = class {
     msg.toolCalls = [...msg.toolCalls ?? [], { ...toolCall }];
     this.notify();
   }
+  /**
+   * Create an empty, already-settled assistant message at `id` if one
+   * doesn't already exist. Idempotent — safe to call on every tool-call
+   * sighting.
+   *
+   * Exists for TOOL-ONLY turns: pydantic-ai's AG-UI adapter mints a fresh
+   * `parent_message_id` per model response regardless of content
+   * (`before_response` → `self.new_message_id()`) and stamps it on every
+   * `TOOL_CALL_START`, even when the response has no text. When the
+   * model's entire action is one or more tool calls with no narration
+   * (a parallel `mount_*` + `suggest_replies` batch, most commonly), no
+   * `TEXT_MESSAGE_START` is ever emitted for that id, so nothing would
+   * otherwise create the host message `addToolCall` needs — and the tool
+   * call (and any chips/receipts derived from it) silently vanishes
+   * (BUG-1786654199). Call this before `addToolCall` on a tool call's
+   * first sighting so it always has a message to land on.
+   *
+   * Deliberately status:'complete' (not 'streaming' via `receiveStart`):
+   * a tool-only message has no text to stream, so there's nothing for a
+   * later `receiveEnd` to settle — leaving it 'streaming' would paint
+   * the trail's streaming/typing visual state forever.
+   */
+  ensureAssistantMessage(id) {
+    if (this._messages.some((m) => m.id === id)) return;
+    this._messages.push({ id, role: "assistant", text: "", status: "complete" });
+    this.notify();
+  }
   /**
    * Partially update a tool call by id. Used by the transport to
    * advance status (args-streaming → running → done) as AG-UI events
@@ -1221,6 +1249,7 @@ var ChatTransport = class {
         if (!targetMessageId) return;
         const parsedArgs = parseToolCallArgs(event.toolCall);
         if (!existing) {
+          chatSession.ensureAssistantMessage(targetMessageId);
           chatSession.addToolCall(targetMessageId, {
             id: event.toolCall.id,
             name: event.toolCall.name,
@@ -1770,6 +1799,70 @@ function busEventToRawEvent(e) {
   return { event: e.name, timestamp: ts, properties: { ...e.props ?? {} } };
 }
 
+// src/support-chat/registry.ts
+var bridges = /* @__PURE__ */ new Map();
+function registerSupportChatBridge(bridge) {
+  bridges.set(bridge.vendor, bridge);
+}
+function getSupportChatBridge(vendor) {
+  return bridges.get(vendor);
+}
+
+// src/support-chat/crisp.ts
+function crisp() {
+  if (typeof window === "undefined") return void 0;
+  return window.$crisp;
+}
+function push(cmd) {
+  try {
+    crisp()?.push(cmd);
+  } catch (err) {
+    console.warn("supportChat.bridge: crisp push failed", cmd[0], cmd[1], err);
+  }
+}
+var crispBridge = {
+  vendor: "crisp",
+  detect: () => crisp() !== void 0,
+  hideNative: () => push(["do", "chat:hide"]),
+  setVisitorEmail: (email) => push(["set", "user:email", [email]]),
+  sendMessage: (text) => push(["do", "message:send", ["text", text]]),
+  onOperatorReply: (cb) => {
+    let active = true;
+    push([
+      "on",
+      "message:received",
+      (msg) => {
+        if (!active) return;
+        push(["do", "chat:hide"]);
+        if (msg?.from !== "operator") return;
+        if (typeof msg?.content === "string") cb(msg.content);
+      }
+    ]);
+    return () => {
+      active = false;
+    };
+  }
+};
+function registerCrispBridge() {
+  registerSupportChatBridge(crispBridge);
+}
+registerCrispBridge();
+
+// src/support-chat/boot.ts
+function bootSupportChat(cfg) {
+  if (!cfg?.vendor) return void 0;
+  registerCrispBridge();
+  const bridge = getSupportChatBridge(cfg.vendor);
+  if (!bridge || !bridge.detect()) {
+    console.warn(
+      `supportChat.bridge: vendor '${cfg.vendor}' not detected on this page \u2014 handoff disabled`
+    );
+    return void 0;
+  }
+  if (cfg.suppressNative) bridge.hideNative();
+  return bridge;
+}
+
 // src/AdaptiveChatBarMountable.ts
 var STATE_KEY = "__syntroChatBarMount";
 function getState(container) {
@@ -2060,6 +2153,7 @@ var AdaptiveChatBarMountable = {
   mount(container, mountConfig) {
     const cfg = mountConfig ?? {};
     configureTransportIfPossible(cfg);
+    bootSupportChat(cfg.supportChat);
     wireDiveDeeperListener();
     const bar = document.createElement("adaptive-chat-bar");
     applyPlaceholder(bar, cfg);
@@ -2196,6 +2290,266 @@ var AdaptiveChipsStripMountable = {
   }
 };
 
+// src/LeaveAMessageLit.ts
+import { html, LitElement, nothing } from "lit";
+import { styleMap } from "lit/directives/style-map.js";
+var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+var box = {
+  display: "flex",
+  flexDirection: "column",
+  gap: "var(--sc-content-item-gap, 10px)",
+  fontFamily: "var(--sc-font-family, system-ui)",
+  fontSize: "var(--sc-content-body-font-size, 13px)"
+};
+var fieldStyles = {
+  padding: "var(--sc-content-item-padding, 10px 12px)",
+  borderRadius: "var(--sc-content-border-radius, 8px)",
+  border: "var(--sc-content-bubble-border, 1px solid currentColor)",
+  background: "var(--sc-content-bubble-background, transparent)",
+  color: "inherit",
+  font: "inherit",
+  // The browser's default focus ring is a loud blue on a black-and-white
+  // brand — the one saturated pixel on the card. Suppress it and paint our
+  // own from the theme in the focus/blur handlers below.
+  outline: "none",
+  width: "100%",
+  boxSizing: "border-box",
+  // The drag grabber pokes out of the card's bottom-right corner and lets
+  // the visitor break the tile frame — the card owns its own geometry.
+  resize: "none"
+};
+var buttonStyles = {
+  padding: "11px 14px",
+  borderRadius: "var(--sc-border-radius, 8px)",
+  border: "none",
+  background: "var(--sc-color-primary, #000000)",
+  color: "var(--sc-accent-foreground, #ffffff)",
+  fontWeight: "600",
+  cursor: "pointer",
+  font: "inherit",
+  width: "100%",
+  boxSizing: "border-box"
+};
+var textStyles = {
+  margin: "0"
+};
+var mutedTextStyles = {
+  margin: "0",
+  // No opacity token exists in any publishable section — plain constant.
+  opacity: "0.8"
+};
+var PERSIST_NAMESPACE = "supportchat";
+var PERSIST_KEY = "leave-a-message";
+var LeaveAMessageLit = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.message = "";
+    this.contextSummary = "";
+    this.state = "form";
+    this._email = "";
+    this._reply = "";
+    this._operatorMessages = [];
+    /** Paint our own focus ring from the theme — see fieldStyles.outline. */
+    this._focusOn = (e) => {
+      const el = e.target;
+      el.style.outline = "2px solid var(--sc-color-primary, currentColor)";
+      el.style.outlineOffset = "1px";
+    };
+    this._focusOff = (e) => {
+      const el = e.target;
+      el.style.outline = "none";
+    };
+    this._onReply = (text) => {
+      this._operatorMessages = [...this._operatorMessages, text];
+      if (this.state !== "flipped") {
+        this.state = "mail";
+        this.runtime?.events.publish("supportchat:reply_received", { text });
+        this._toastReplyArrived();
+        this.dispatchEvent(
+          new CustomEvent("syntro:supportchat-reply", {
+            bubbles: true,
+            composed: true,
+            detail: { text }
+          })
+        );
+      }
+      this._persist();
+      this.requestUpdate();
+    };
+    this._submit = () => {
+      if (!this.bridge || !EMAIL_RE.test(this._email)) return;
+      this.bridge.setVisitorEmail(this._email);
+      const context = this.contextSummary ? `[Site assistant context: ${this.contextSummary}]
+` : "";
+      this.bridge.sendMessage(`${context}${this.message}`);
+      this.state = "sent";
+      this._persist();
+    };
+    this._flip = () => {
+      this.state = "flipped";
+      this._persist();
+    };
+    this._sendReply = () => {
+      if (!this.bridge || !this._reply.trim()) return;
+      this.bridge.sendMessage(this._reply.trim());
+      this._reply = "";
+      this.requestUpdate();
+    };
+  }
+  createRenderRoot() {
+    return this;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this._loadPersisted();
+  }
+  updated() {
+    if (this.state !== "form" && this.bridge && this.bridge.detect() && !this._unsubscribe) {
+      this._unsubscribe = this.bridge.onOperatorReply(this._onReply);
+    }
+  }
+  disconnectedCallback() {
+    this._unsubscribe?.();
+    this._unsubscribe = void 0;
+    super.disconnectedCallback();
+  }
+  /** Read the injected persistence store, if any (I2). */
+  _persistStore() {
+    return this.runtime?.state?.user?.ns?.(PERSIST_NAMESPACE);
+  }
+  /** Hydrate {state, operatorMessages, email} from a prior page's mount. */
+  _loadPersisted() {
+    const store = this._persistStore();
+    if (!store) return;
+    const saved = store.get(PERSIST_KEY);
+    if (!saved) return;
+    if (saved.state) this.state = saved.state;
+    if (Array.isArray(saved.operatorMessages)) this._operatorMessages = saved.operatorMessages;
+    if (typeof saved.email === "string") this._email = saved.email;
+  }
+  /** Snapshot {state, operatorMessages, email} so the NEXT mount (a fresh
+   *  page in the same session) can pick the thread back up. */
+  _persist() {
+    const store = this._persistStore();
+    if (!store) return;
+    const state = this.state;
+    const operatorMessages = this._operatorMessages;
+    const email = this._email;
+    const snapshot = { state, operatorMessages, email };
+    store.set(PERSIST_KEY, snapshot);
+  }
+  /**
+   * Raise the reply toast through the canvas element. Pierces shadow roots to
+   * find `<smart-canvas>` (same resolution AdaptiveChatBarMountable uses), and
+   * no-ops when no canvas is present — the tile's own "You got mail!" face is
+   * always the durable signal.
+   */
+  _toastReplyArrived() {
+    if (typeof document === "undefined") return;
+    const title = this.replyToast?.title?.trim();
+    if (!title) return;
+    const find = (root) => {
+      const direct = root.querySelector("smart-canvas");
+      if (direct) return direct;
+      for (const el of root.querySelectorAll("*")) {
+        const sr = el.shadowRoot;
+        if (sr) {
+          const found = find(sr);
+          if (found) return found;
+        }
+      }
+      return null;
+    };
+    try {
+      const canvas = find(document);
+      canvas?.previewNotification?.({ title, body: this.replyToast?.body });
+    } catch (err) {
+      console.warn("supportChat.widget: reply toast failed", err);
+    }
+  }
+  render() {
+    if (!this.bridge || !this.bridge.detect()) return nothing;
+    if (this.state === "form") {
+      return html`<div data-lam style=${styleMap(box)}>
+        <input
+          data-lam-email
+          type="email"
+          placeholder="Your email — so the team can reach you"
+          style=${styleMap(fieldStyles)}
+          @focus=${this._focusOn}
+          @blur=${this._focusOff}
+          @input=${(e) => {
+        this._email = e.target.value;
+        this.requestUpdate();
+      }}
+        />
+        <textarea
+          data-lam-message
+          rows="4"
+          style=${styleMap(fieldStyles)}
+          @focus=${this._focusOn}
+          @blur=${this._focusOff}
+          .value=${this.message}
+          @input=${(e) => {
+        this.message = e.target.value;
+      }}
+        ></textarea>
+        <button type="button" data-lam-send style=${styleMap(buttonStyles)} @click=${this._submit}>
+          Send to the team
+        </button>
+      </div>`;
+    }
+    if (this.state === "sent") {
+      return html`<div data-lam style=${styleMap(box)}>
+        <p style=${styleMap(mutedTextStyles)}>
+          Sent. The team will reply here — or by email if you step away.
+        </p>
+      </div>`;
+    }
+    if (this.state === "mail") {
+      return html`<div data-lam style=${styleMap(box)}>
+        <button type="button" data-lam-mail style=${styleMap(buttonStyles)} @click=${this._flip}>
+          📬 You got mail! — tap to read
+        </button>
+      </div>`;
+    }
+    return html`<div data-lam style=${styleMap(box)}>
+      ${this._operatorMessages.map(
+      (m) => html`<p data-lam-operator style=${styleMap(textStyles)}>${m}</p>`
+    )}
+      <input
+        data-lam-reply
+        type="text"
+        placeholder="Reply to the team…"
+        style=${styleMap(fieldStyles)}
+        @focus=${this._focusOn}
+        @blur=${this._focusOff}
+        .value=${this._reply}
+        @input=${(e) => {
+      this._reply = e.target.value;
+    }}
+      />
+      <button type="button" data-lam-reply-send style=${styleMap(buttonStyles)} @click=${this._sendReply}>
+        Send
+      </button>
+    </div>`;
+  }
+};
+LeaveAMessageLit.properties = {
+  bridge: { attribute: false },
+  message: { type: String },
+  contextSummary: { attribute: false },
+  state: { type: String },
+  runtime: { attribute: false },
+  replyToast: { attribute: false }
+};
+function registerLeaveAMessageLit() {
+  if (typeof customElements !== "undefined" && !customElements.get("syntro-leave-a-message")) {
+    customElements.define("syntro-leave-a-message", LeaveAMessageLit);
+  }
+}
+registerLeaveAMessageLit();
+
 // src/NavLinkMountable.ts
 var STATE_KEY3 = "__syntroNavLinkMount";
 var SAFE_NAVIGATION_PROTOCOLS = /* @__PURE__ */ new Set(["http:", "https:"]);
@@ -2317,6 +2671,58 @@ var TextAnswerMountable = {
 };
 
 // src/runtime.ts
+var LEAVE_A_MESSAGE_STATE_KEY = "__syntroLeaveAMessageMount";
+function getLeaveAMessageState(container) {
+  return container[LEAVE_A_MESSAGE_STATE_KEY] ?? null;
+}
+function setLeaveAMessageState(container, state) {
+  container[LEAVE_A_MESSAGE_STATE_KEY] = state;
+}
+var LeaveAMessageMountable = {
+  mount(container, config) {
+    registerLeaveAMessageLit();
+    const el = document.createElement("syntro-leave-a-message");
+    const incoming = config ?? null;
+    const stripped = stripMountPlumbing(incoming) ?? {};
+    const supportChat = stripped.supportChat;
+    const runtime2 = incoming?.runtime;
+    Object.assign(el, {
+      bridge: bootSupportChat(supportChat),
+      message: stripped.message ?? "",
+      contextSummary: stripped.context_summary ?? "",
+      // Visitor-facing toast copy from the workspace config — see
+      // LeaveAMessageLit#replyToast (presentation is configuration).
+      replyToast: stripped.replyToast,
+      runtime: runtime2
+    });
+    container.appendChild(el);
+    setLeaveAMessageState(container, { el });
+    return () => {
+      setLeaveAMessageState(container, null);
+      el.remove();
+    };
+  },
+  /**
+   * I1 (final-review fixes 2026-08-13): without this, `WidgetRegistry`
+   * falls back to unmount+remount on every config patch (e.g. the agent
+   * editing the prefilled `message` mid-conversation), which destroys the
+   * live element and with it the visitor's in-flight escalation state
+   * (email already captured, an operator reply already sitting in
+   * `mail`/`flipped`). Mirrors `AdaptiveChatBarMountable.update`'s
+   * pattern: patch the presentational props in place, touch nothing
+   * else. `state`, `bridge`, and the operator-message thread are NEVER
+   * reset here.
+   */
+  update(container, config) {
+    const mounted = getLeaveAMessageState(container);
+    if (!mounted) return;
+    const stripped = stripMountPlumbing(config ?? null) ?? {};
+    if (typeof stripped.message === "string") mounted.el.message = stripped.message;
+    if (typeof stripped.context_summary === "string") {
+      mounted.el.contextSummary = stripped.context_summary;
+    }
+  }
+};
 var runtime = {
   id: "adaptive-chatbot",
   version: "2.0.0",
@@ -2387,12 +2793,25 @@ var runtime = {
         description: "Same-origin navigation button \u2014 used as a chip payload for LLM-authored nav suggestions.",
         icon: "\u2192"
       }
+    },
+    // Escalation-only async human handoff: email + message into the site's
+    // own support-chat inbox (Crisp first); operator replies flip the tile
+    // ("You got mail!"). See docs/superpowers/specs/2026-08-13-async-handoff-crisp-design.md.
+    {
+      id: "adaptive-chatbot:leave-a-message",
+      component: LeaveAMessageMountable,
+      metadata: {
+        name: "Leave a Message",
+        description: `Escalation-only async human handoff: email + message into the site's own support-chat inbox; operator replies flip the tile ("You got mail!")`,
+        icon: "\u{1F4EC}"
+      }
     }
   ]
 };
 var runtime_default = runtime;
 export {
   ElementInstanceStore,
+  LeaveAMessageMountable,
   TileHandler,
   runtime_default as default,
   getElementInstanceStore,