/* =========================================================================== Docs assistant widget Answers questions from the docs themselves: the backend calls Claude with the MCP connector pointed at this site's own /mcp server, so every answer is grounded in a real page and ends with a link to it. Two things shape the code more than anything else: 1. Mintlify is a client-side app shell. This file runs ONCE, after interactivity - not per navigation. So the UI is appended to (which React does not own) rather than to the content subtree, and the conversation lives in sessionStorage so it survives a hard navigation too. Same reason custom.js patches pushState/replaceState. 2. The model narrates before it searches ("I'll look that up..."). Which text block is the actual answer isn't knowable until the stream ends, so the backend emits `tool_start` between blocks and we treat whatever came before it as the loading state. See answer_stream() in the backend. =========================================================================== */ (function () { "use strict"; // Set window.BB_CHAT_ENDPOINT before this file loads to point elsewhere. // On localhost, open any page with ?bb_chat=prod to use the production // backend instead of a local one; ?bb_chat=local switches back. The choice // is remembered across reloads. var PROD_ENDPOINT = "https://km75if5qfblapvfj4c35itydma0cfpiv.lambda-url.us-east-2.on.aws/api/chat"; var LOCAL_ENDPOINT = "http://localhost:8000/api/chat"; var isLocalHost = /^(localhost|127\.0\.0\.1)$/.test(location.hostname); var useProd = false; if (isLocalHost) { try { var choice = new URLSearchParams(location.search).get("bb_chat"); if (choice === "prod" || choice === "local") { localStorage.setItem("bb_chat", choice); } useProd = localStorage.getItem("bb_chat") === "prod"; } catch (e) {} } var ENDPOINT = window.BB_CHAT_ENDPOINT || (isLocalHost && !useProd ? LOCAL_ENDPOINT : PROD_ENDPOINT); var FEEDBACK_ENDPOINT = window.BB_CHAT_FEEDBACK_ENDPOINT || ENDPOINT.replace(/\/chat$/, "/feedback"); var TITLE = "Ask Bindbee AI"; var DOCS_HOST = "docs.bindbee.dev"; var ROOT_ID = "bb-chat-root"; var STORAGE_KEY = "bb-chat-v1"; var MAX_HISTORY = 6; var MAX_CHARS = 2000; var IDLE_TIMEOUT_MS = 45000; // Two Lottie avatars share one player: the orange one in the header (opens // with the panel) and the white one on the launcher button (visible on // every page). The player is ~1.4MB once its WASM renderer is counted, so // both draw from a single cached import() - see loadLottieModule() below - // rather than fetching it twice. JS and WASM are pinned to one version: a // mismatch between them fails without an error. // // Served from images.unifyx.dev rather than /images/*.lottie: .lottie isn't // in Mintlify's supported static-file-type list, so the local copies 404 in // production even though every other root asset here builds fine. The // window.BB_CHAT_LOTTIE* override still works for anyone overriding this // per-deployment. var LOTTIE_SRC = window.BB_CHAT_LOTTIE || "https://images.unifyx.dev/documentation_images/ai.lottie"; var LOTTIE_SRC_WHITE = window.BB_CHAT_LOTTIE_WHITE || "https://images.unifyx.dev/documentation_images/ai_white.lottie"; var LOTTIE_PLAYER = "https://cdn.jsdelivr.net/npm/@lottiefiles/dotlottie-web@0.80.0/dist/"; var DEFAULT_SUGGESTIONS = [ "What is Bindbee?", "How do I identify an employee termination?", "What's the difference between Development and Production?", ]; // Keyed by the first path segment of the page being read. Anything not // listed falls back to DEFAULT_SUGGESTIONS. var SUGGESTIONS_BY_SECTION = { "get-started": [ "What is Bindbee?", "How do I connect my customer's HRIS?", "What's the difference between Development and Production?", ], guides: [ "What should I check before going live?", "How do I add custom fields to a data model?", "How do I troubleshoot a failed sync?", ], hris: [ "How do I identify an employee termination?", "How do I read payroll runs for a company?", "How do I get an employee's time off balance?", ], ats: [ "How do I list candidates and their applications?", "How do I get open jobs and their interview stages?", "How do I read offers for a candidate?", ], lms: [ "How do I track course completions?", "How do I list enrollments for a user?", "What LMS data models are available?", ], sdk: [ "How do I create a link token?", "How do I get a connector token?", "How do I embed the connect flow in my app?", ], "api-reference": [ "How do I authenticate API requests?", "How do I subscribe to webhooks?", "When should I use passthrough requests?", ], }; var ICONS = { close: "M18 6 6 18M6 6l12 12", send: "M22 2 11 13M22 2l-7 20-4-9-9-4 20-7z", stop: "M6 6h12v12H6z", copy: [ "M10 8h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H10a2 2 0 0 1-2-2V10a2 2 0 0 1 2-2z", "M4 16a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2", ], check: "M20 6 9 17l-5-5", thumbsUp: [ "M7 10v12", "M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z", ], thumbsDown: [ "M17 14V2", "M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z", ], reset: [ "m16 22-1-4", "M19 14a1 1 0 0 0 1-1v-1a2 2 0 0 0-2-2h-3a1 1 0 0 1-1-1V4a2 2 0 0 0-4 0v5a1 1 0 0 1-1 1H6a2 2 0 0 0-2 2v1a1 1 0 0 0 1 1", "M19 14H5l-1.973 6.767A1 1 0 0 0 4 22h16a1 1 0 0 0 .973-1.233z", "m8 22 1-4", ], }; var state = { open: false, busy: false, turns: [] }; var els = {}; var activeController = null; var activeStop = null; var renderedSuggestions = null; /* --- persistence ------------------------------------------------------- */ function load() { try { var raw = sessionStorage.getItem(STORAGE_KEY); if (!raw) return; var saved = JSON.parse(raw); if (saved && Array.isArray(saved.turns)) { state.turns = saved.turns; state.open = !!saved.open; } } catch (e) { /* private mode, or blocked storage - start fresh */ } } function save() { try { sessionStorage.setItem( STORAGE_KEY, JSON.stringify({ turns: state.turns, open: state.open }) ); } catch (e) { /* not worth failing the widget over */ } } /* --- dom helpers ------------------------------------------------------- */ function el(tag, props, children) { var node = document.createElement(tag); Object.keys(props || {}).forEach(function (key) { if (key === "class") node.className = props[key]; else if (key === "text") node.textContent = props[key]; else node.setAttribute(key, props[key]); }); (children || []).forEach(function (child) { node.appendChild(child); }); return node; } function icon(paths) { var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.setAttribute("viewBox", "0 0 24 24"); svg.setAttribute("fill", "none"); svg.setAttribute("stroke", "currentColor"); svg.setAttribute("stroke-width", "2"); svg.setAttribute("stroke-linecap", "round"); svg.setAttribute("stroke-linejoin", "round"); svg.setAttribute("aria-hidden", "true"); (Array.isArray(paths) ? paths : [paths]).forEach(function (path) { var d = document.createElementNS("http://www.w3.org/2000/svg", "path"); d.setAttribute("d", path); svg.appendChild(d); }); return svg; } /* --- rendering model output ------------------------------------------- Never innerHTML. The text comes from a model reading documents it fetched over the network; it is untrusted input, and building nodes by hand is the only way to be sure a link is a link and nothing else. ---------------------------------------------------------------------- */ // Markdown links accept a site path as well as an absolute URL: the docs // search tool returns paths like /get-started/environments, and the model // often links those directly. Bare text is only auto-linked when absolute. // Groups: 1 code, 2 bold text, 3 link label, 4 link target, 5 bare URL. // A label may hold one level of [brackets], a target one level of // (parens), an form, and a trailing "title". var INLINE = new RegExp( [ "`([^`\\n]+)`", "\\*\\*([^*\\n]+)\\*\\*", "\\[((?:[^\\[\\]\\n]|\\[[^\\[\\]\\n]*\\])+)\\]" + "\$\\s*(<[^<>\\n]+>|(?:[^\\s()]|\\([^\\s()]*\$)+)(?:\\s+\"[^\"\\n]*\")?\\s*\\)", "(https?:\\/\\/[^\\s<>\"'`)\\]]+)", ].join("|"), "g" ); // Sentence punctuation right after a bare URL belongs to the sentence. var TRAILING_PUNCTUATION = /[.,;:!?]+$/; function isBindbeeUrl(href) { try { var url = new URL(href); return ( url.protocol === "https:" && (url.hostname === "bindbee.dev" || url.hostname.endsWith(".bindbee.dev")) ); } catch (e) { return false; } } // A Bindbee mailbox is the one non-http target worth linking, so "email // support" is clickable. The address has to be plain: a query string is // rejected, so a fetched document can't smuggle ?bcc= or ?body= into a // link the reader is about to click. var BINDBEE_MAILBOX = /^[a-z0-9._%+-]+@([a-z0-9-]+\.)*bindbee\.dev$/i; function resolveMailto(href) { var url; try { url = new URL(href); } catch (e) { return null; } if (url.protocol !== "mailto:" || url.search || url.hash) return null; return BINDBEE_MAILBOX.test(url.pathname) ? "mailto:" + url.pathname : null; } // A single leading slash is a path on this site, so it resolves against the // current origin and works on localhost as well as in production. "//host" // is excluded: that's protocol-relative and would leave the site. function resolveLink(href) { // Checked first: the allowlist below only admits https and same-origin // paths, so a mailto: would fall through it and be dropped. if (/^mailto:/i.test(href)) return resolveMailto(href); // Anything with no scheme ("get-started/environments") is also a docs // path; the model sometimes drops the leading slash. if (!/^([a-z][a-z0-9+.-]*:|\/\/|#)/i.test(href) && href.charAt(0) !== "/") { href = "/" + href; } var url; if (/^\/(?!\/)/.test(href)) { url = new URL(href, location.origin); } else if (isBindbeeUrl(href)) { url = new URL(href); } else { return null; } // OpenAI tags the links it writes; it's noise in the docs' analytics. if (url.searchParams.get("utm_source") === "openai") { url.searchParams.delete("utm_source"); } if (url.origin === location.origin) return url.href; // Docs links open in whichever copy of the docs is running (production, // a preview deploy, or localhost), so they can open in place. if (url.hostname === DOCS_HOST) { return new URL(url.pathname + url.search + url.hash, location.origin).href; } return url.href; } // Client-side navigation keeps the panel and conversation on screen. The // router is Next's (Mintlify's app shell), and not a public API, so a // normal same-tab load is the fallback. function openDocsPage(url) { var target = url.pathname + url.search + url.hash; var router = window.next && window.next.router; try { if (router && typeof router.push === "function") router.push(target); else location.assign(target); } catch (e) { location.assign(target); } // On phones the panel covers the page, so it has to get out of the way. if (window.matchMedia && window.matchMedia("(max-width: 640px)").matches) close(); } function link(href, label) { var resolved = resolveLink(href); if (!resolved) return document.createTextNode(label); // The mail client takes over from here; target="_blank" would only leave // a stray blank tab behind. if (resolved.lastIndexOf("mailto:", 0) === 0) { return el("a", { href: resolved, text: label }); } var url = new URL(resolved); var a = el("a", { href: resolved, text: label }); if (url.hostname !== location.hostname) { a.setAttribute("target", "_blank"); a.setAttribute("rel", "noopener noreferrer"); } else { a.addEventListener("click", function (e) { // Leave Cmd/Ctrl/Shift-click and middle-click to the browser. if (e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return; e.preventDefault(); openDocsPage(url); }); } return a; } function format(text) { var frag = document.createDocumentFragment(); var cursor = 0; var match; INLINE.lastIndex = 0; while ((match = INLINE.exec(text)) !== null) { if (match.index > cursor) { frag.appendChild( document.createTextNode(text.slice(cursor, match.index)) ); } var end = match.index + match[0].length; if (match[1]) { frag.appendChild(el("code", { text: match[1] })); } else if (match[2]) { // Bold often wraps a link ("**[Environments](...)**"). var strong = el("strong"); strong.appendChild(format(match[2])); frag.appendChild(strong); INLINE.lastIndex = end; } else if (match[3]) { var target = match[4].replace(/^<|>$/g, ""); frag.appendChild(link(target, match[3].replace(/\*\*|`/g, ""))); } else { var bare = match[5].replace(TRAILING_PUNCTUATION, ""); end = match.index + bare.length; INLINE.lastIndex = end; frag.appendChild(link(bare, bare)); } cursor = end; } if (cursor < text.length) { frag.appendChild(document.createTextNode(text.slice(cursor))); } return frag; } var PARTIAL_LINK = /\[[^\]\n]*(\]\([^)\n]*)?$/; var LIST_ITEM = /^\s*[-*•]\s+(.*)$/; var NUMBERED_ITEM = /^\s*(\d{1,4})[.)]\s+(.*)$/; var FENCE = /^\s*```/; function listItem(line) { var item = LIST_ITEM.exec(line); if (item) return { tag: "ul", text: item[1] }; item = NUMBERED_ITEM.exec(line); if (item) return { tag: "ol", text: item[2], number: parseInt(item[1], 10) }; return null; } // Line-level structure on top of format(): ``` fences become a

,
  // runs of "- item" / "1. item" lines become a real  / , and
  // everything else is joined with 
.
  function formatBlock(text) {
    var frag = document.createDocumentFragment();
    var lines = text.split("\n");
    var list = null;
    var code = null;
    var needBreak = false;

    // Blocks carry their own spacing, so a 
 or blank line beside one
    // would only add a gap.
    function startBlock(node) {
      if (frag.lastChild && frag.lastChild.nodeName === "BR") {
        frag.removeChild(frag.lastChild);
      }
      frag.appendChild(node);
      needBreak = false;
    }

    lines.forEach(function (line, i) {
      if (code) {
        if (FENCE.test(line)) {
          code = null;
        } else {
          code.lines.push(line);
          code.node.textContent = code.lines.join("\n");
        }
        return;
      }

      // The language after the fence ("```http") isn't shown or highlighted.
      // An unclosed fence (mid-stream) still renders as code.
      if (FENCE.test(line)) {
        list = null;
        var codeNode = el("code");
        startBlock(el("pre", { class: "bb-chat-code" }, [codeNode]));
        code = { node: codeNode, lines: [] };
        return;
      }

      var item = listItem(line);
      if (item) {
        if (!list || list.tag !== item.tag) {
          var attrs = { class: "bb-chat-list" };
          if (item.tag === "ol" && item.number !== 1) attrs.start = String(item.number);
          list = { tag: item.tag, node: el(item.tag, attrs) };
          startBlock(list.node);
        }
        var li = el("li");
        li.appendChild(format(item.text));
        list.node.appendChild(li);
        return;
      }

      if (!line.trim() && (list || (frag.lastChild && frag.lastChild.nodeName === "PRE"))) {
        // Models often put a blank line between numbered steps; keep the
        // list going when the next line is another item of the same kind.
        var next = lines.slice(i + 1).find(function (l) {
          return l.trim();
        });
        var nextItem = next && listItem(next);
        if (!list || !nextItem || nextItem.tag !== list.tag) list = null;
        return;
      }

      list = null;
      if (needBreak) frag.appendChild(el("br"));
      frag.appendChild(format(line));
      needBreak = true;
    });

    return frag;
  }

  /* --- conversation log -------------------------------------------------- */

  function nearBottom() {
    var log = els.log;
    return log.scrollHeight - log.scrollTop - log.clientHeight < 80;
  }

  function scrollDown(force) {
    if (force || nearBottom()) els.log.scrollTop = els.log.scrollHeight;
  }

  function addTurn(role) {
    var bubble = el("div", { class: "bb-chat-bubble" });
    var turn = el("div", { class: "bb-chat-turn", "data-role": role }, [bubble]);
    els.log.appendChild(turn);
    return { turn: turn, bubble: bubble };
  }

  function suggestionsFor(pathname) {
    var section = pathname.split("/").filter(Boolean)[0];
    return (
      (section && Object.prototype.hasOwnProperty.call(SUGGESTIONS_BY_SECTION, section)
        ? SUGGESTIONS_BY_SECTION[section]
        : null) || DEFAULT_SUGGESTIONS
    );
  }

  function renderIntro() {
    var intro = el("div", { id: "bb-chat-intro" }, [
      el("p", { text: "Ask anything about Bindbee API, SDKs, or integrations." }),
    ]);
    renderedSuggestions = suggestionsFor(location.pathname);
    renderedSuggestions.forEach(function (question) {
      var button = el("button", {
        class: "bb-chat-suggestion",
        type: "button",
        text: question,
      });
      button.addEventListener("click", function () {
        send(question);
      });
      intro.appendChild(button);
    });
    els.log.appendChild(intro);
  }

  function renderLog() {
    els.log.textContent = "";
    if (!state.turns.length) {
      renderIntro();
      return;
    }
    var last = state.turns.length - 1;
    state.turns.forEach(function (turn, i) {
      var node = addTurn(turn.role);
      if (turn.role === "assistant") {
        var question = i > 0 ? state.turns[i - 1].content : "";
        // Only the latest exchange can be retried: retry rewinds from the end.
        renderAnswer(node, question, turn.content, turn.incomplete, i === last);
      } else {
        node.bubble.textContent = turn.content;
      }
    });
    scrollDown(true);
  }

  // Suggestions depend on the page, so an untouched empty state follows the
  // visitor as they browse.
  function refreshIntro() {
    if (!els.log || state.turns.length || state.busy) return;
    if (suggestionsFor(location.pathname) !== renderedSuggestions) renderLog();
  }

  function renderAnswer(node, question, answer, incomplete, canRetry) {
    node.bubble.textContent = "";
    node.bubble.appendChild(formatBlock(answer));
    if (incomplete) {
      node.turn.appendChild(incompleteNotice(incomplete, question, node.turn, canRetry));
    }
    node.turn.appendChild(answerActions(question, answer));
  }

  function incompleteNotice(reason, question, turn, canRetry) {
    var wrap = el("div", {
      class: "bb-chat-incomplete",
      text: reason === "user_stop" ? "Stopped. " : "This answer was cut off. ",
    });
    if (canRetry) wrap.appendChild(retryButton(question, turn, true));
    return wrap;
  }

  function actionButton(paths, label) {
    return el("button", { class: "bb-chat-action", type: "button", "aria-label": label, title: label }, [
      icon(paths),
    ]);
  }

  function setIcon(button, paths) {
    button.textContent = "";
    button.appendChild(icon(paths));
  }

  function answerActions(question, answer) {
    var row = el("div", { class: "bb-chat-actions" });

    if (navigator.clipboard && navigator.clipboard.writeText) {
      var copy = actionButton(ICONS.copy, "Copy answer");
      var revert = null;
      copy.addEventListener("click", function () {
        try {
          navigator.clipboard.writeText(answer).then(function () {
            setIcon(copy, ICONS.check);
            copy.setAttribute("aria-label", "Copied");
            clearTimeout(revert);
            revert = setTimeout(function () {
              setIcon(copy, ICONS.copy);
              copy.setAttribute("aria-label", "Copy answer");
            }, 1500);
          }, function () {});
        } catch (e) {
          /* clipboard blocked - nothing useful to show */
        }
      });
      row.appendChild(copy);
    }

    var up = actionButton(ICONS.thumbsUp, "Helpful");
    var down = actionButton(ICONS.thumbsDown, "Not helpful");
    var thanks = el("span", { class: "bb-chat-thanks", text: "Thanks for the feedback" });
    thanks.hidden = true;

    [["up", up], ["down", down]].forEach(function (pair) {
      var rating = pair[0];
      var button = pair[1];
      button.setAttribute("aria-pressed", "false");
      button.addEventListener("click", function () {
        up.disabled = true;
        down.disabled = true;
        button.setAttribute("aria-pressed", "true");
        thanks.hidden = false;
        if (!question) return;
        try {
          fetch(FEEDBACK_ENDPOINT, {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({
              question: question.slice(0, MAX_CHARS),
              answer: answer.slice(0, 4000),
              rating: rating,
            }),
          }).catch(function () {});
        } catch (e) {
          /* feedback is best-effort */
        }
      });
      row.appendChild(button);
    });

    row.appendChild(thanks);
    return row;
  }

  /* --- SSE --------------------------------------------------------------- */

  /* EventSource can't POST, so the stream is parsed by hand. Frames are
     separated by a blank line; sse-starlette also sends `:` comment pings to
     keep the connection warm, which parse to no event and are ignored. */
  function parseFrames(chunk, onFrame) {
    chunk.split("\n\n").forEach(function (block) {
      var event = null;
      var data = "";
      block.split("\n").forEach(function (line) {
        if (line.indexOf("event:") === 0) event = line.slice(6).trim();
        else if (line.indexOf("data:") === 0) data += line.slice(5).trim();
      });
      if (!event) return;
      try {
        onFrame(event, data ? JSON.parse(data) : {});
      } catch (e) {
        /* a frame we can't parse is not worth tearing the stream down for */
      }
    });
  }

  // Not named `history` - that would shadow window.history for the whole
  // closure, and the pushState patch below would silently attach to this
  // function instead of the History object.
  function messagesFor(question) {
    var messages = state.turns
      .filter(function (t) {
        return t.content;
      })
      .map(function (t) {
        return { role: t.role, content: t.content.slice(0, MAX_CHARS) };
      });

    messages.push({ role: "user", content: question });

    while (messages.length > MAX_HISTORY) messages.shift();
    if (messages.length && messages[0].role !== "user") messages.shift();
    return messages;
  }

  function send(question) {
    question = (question || "").trim().slice(0, MAX_CHARS);
    if (!question || state.busy) return;

    // A failed exchange leaves its question unanswered. Sending on top of it
    // would put two user turns in a row, which the backend rejects.
    if (state.turns.length && state.turns[state.turns.length - 1].role === "user") {
      state.turns.pop();
    }
    // Retry rewinds from the end of the conversation, so it only applies to
    // the latest exchange.
    Array.prototype.forEach.call(els.log.querySelectorAll(".bb-chat-retry"), function (button) {
      button.remove();
    });

    if (!state.turns.length) els.log.textContent = "";

    var messages = messagesFor(question);
    state.turns.push({ role: "user", content: question });
    addTurn("user").bubble.textContent = question;

    setBusy(true);
    els.input.value = "";
    resizeInput();

    var node = addTurn("assistant");
    var status = el("div", { class: "bb-chat-status", text: "Searching the docs" });
    node.turn.insertBefore(status, node.bubble);
    scrollDown(true);

    var buffer = "";
    var finished = false;
    var searched = false;
    var stopped = false;

    var controller = new AbortController();
    activeController = controller;
    activeStop = function () {
      stopped = true;
      controller.abort();
    };

    var idle = setTimeout(function () {
      controller.abort();
    }, IDLE_TIMEOUT_MS);

    function touch() {
      clearTimeout(idle);
      idle = setTimeout(function () {
        controller.abort();
      }, IDLE_TIMEOUT_MS);
    }

    function fail(message) {
      if (finished) return;
      finished = true;
      clearTimeout(idle);
      status.remove();
      node.bubble.textContent = "";
      node.bubble.appendChild(failure(message, question, node.turn));
      setBusy(false);
      scrollDown(true);
    }

    function finish(info) {
      if (finished) return;
      finished = true;
      clearTimeout(idle);
      status.remove();

      var answer = buffer.trim();
      var reason = info.stop_reason;

      // Stopped before the answer started: text before the first search is
      // narration, so there's nothing worth keeping. Hand the question back.
      if (reason === "user_stop" && (!answer || !searched)) {
        node.turn.remove();
        state.turns.pop();
        var userTurns = els.log.querySelectorAll('.bb-chat-turn[data-role="user"]');
        if (userTurns.length) userTurns[userTurns.length - 1].remove();
        setBusy(false);
        if (!state.turns.length) renderLog();
        els.input.value = question;
        resizeInput();
        els.input.focus();
        return;
      }

      // An answer with no search behind it isn't grounded - better retried
      // than shown.
      if (!answer || (reason === "max_tokens" && !info.tool_calls)) {
        node.bubble.textContent = "";
        node.bubble.appendChild(
          failure("I couldn't finish that one.", question, node.turn)
        );
      } else {
        // A cut-off or stopped answer is often still useful, so it's kept -
        // but labeled, so it never passes for a complete one.
        var incomplete = reason === "max_tokens" || reason === "user_stop" ? reason : undefined;
        var saved = { role: "assistant", content: answer };
        if (incomplete) saved.incomplete = incomplete;
        state.turns.push(saved);
        save();
        renderAnswer(node, question, answer, incomplete, true);
      }
      setBusy(false);
      scrollDown();
    }

    fetch(ENDPOINT, {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({ messages: messages }),
      signal: controller.signal,
    })
      .then(function (response) {
        if (response.status === 429) throw new Error("Too many questions. Give it a minute.");
        if (!response.ok || !response.body) throw new Error("The assistant is unavailable right now.");

        var reader = response.body.getReader();
        var decoder = new TextDecoder();
        var pending = "";

        function handle(event, data) {
          if (event === "text_delta") {
            buffer += data.text;
            // A link still arriving would flash as raw "[Title](https://..."
            // so it's held back until its closing paren lands.
            node.bubble.textContent = "";
            node.bubble.appendChild(formatBlock(buffer.replace(PARTIAL_LINK, "")));
            scrollDown();
          } else if (event === "tool_start") {
            // Whatever was streaming was narration, not the answer.
            searched = true;
            if (buffer.trim()) status.textContent = buffer.trim();
            buffer = "";
            node.bubble.textContent = "";
          } else if (event === "error") {
            fail(data.message || "Something went wrong.");
          } else if (event === "done") {
            finish(data);
          }
        }

        function pump() {
          return reader.read().then(function (result) {
            if (result.done) {
              // A trailing frame can arrive without its final separator.
              if (pending.trim()) parseFrames(pending, handle);
              finish({});
              return;
            }
            touch();
            pending += decoder.decode(result.value, { stream: true });
            // SSE frames are CRLF-delimited per the spec. Normalise the whole
            // buffer, not each chunk: a \r\n routinely straddles two chunks,
            // and normalising them separately leaves that pair unconverted.
            pending = pending.replace(/\r\n/g, "\n");

            // Keep the last, possibly incomplete, frame in the buffer.
            var split = pending.lastIndexOf("\n\n");
            if (split !== -1) {
              var complete = pending.slice(0, split);
              pending = pending.slice(split + 2);
              parseFrames(complete, handle);
            }
            return finished ? undefined : pump();
          });
        }

        return pump();
      })
      .catch(function (error) {
        if (stopped) {
          finish({ stop_reason: "user_stop" });
          return;
        }
        fail(
          error && error.name === "AbortError"
            ? "That took too long."
            : error instanceof TypeError
            ? "Can't reach the server right now. Please try again later."
            : (error && error.message) || "Something went wrong."
        );
      });
  }

  // Rewinds the latest exchange and asks again. `answered` means an
  // (incomplete) answer was saved for it, so that comes off too - otherwise
  // the retry would send the same question twice.
  function retryButton(question, turn, answered) {
    var retry = el("button", { class: "bb-chat-retry", type: "button", text: "Retry" });
    retry.addEventListener("click", function () {
      turn.remove();
      var last = state.turns[state.turns.length - 1];
      if (answered && last && last.role === "assistant") state.turns.pop();
      last = state.turns[state.turns.length - 1];
      if (last && last.role === "user") state.turns.pop();
      var userTurns = els.log.querySelectorAll('.bb-chat-turn[data-role="user"]');
      if (userTurns.length) userTurns[userTurns.length - 1].remove();
      send(question);
    });
    return retry;
  }

  function failure(message, question, turn) {
    var wrap = el("div", { class: "bb-chat-error", text: message + " " });
    wrap.appendChild(retryButton(question, turn, false));
    return wrap;
  }

  /* --- Lottie avatars ------------------------------------------------------

     No static icon: each wrapper (the header avatar, the launcher icon) is
     empty - reserving its box's width/height so nothing reflows - until its
     animation has actually loaded, then the canvas fades in. A blocked CDN or
     a failed WASM compile leaves that box empty rather than falling back to
     anything else.

     prefers-reduced-motion is honored without leaving that empty gap forever:
     the animation still loads, but autoplay is off, so it renders and holds
     its first frame as a static image instead of playing.

     Both wrappers share one loadLottieModule() call: import() of the same URL
     resolves from the module cache on the second call rather than refetching,
     so whichever avatar loads first pays the network cost for both.
     ---------------------------------------------------------------------- */

  var lottieModule = null;

  function loadLottieModule() {
    if (!lottieModule) {
      lottieModule = import(LOTTIE_PLAYER + "index.js").then(function (module) {
        module.DotLottie.setWasmUrl(LOTTIE_PLAYER + "dotlottie-player.wasm");
        return module;
      });
    }
    return lottieModule;
  }

  function reducedMotion() {
    return !!(window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
  }

  // wrap is the element that carries data-animated and holds the canvas.
  function mountAvatar(wrap, canvas, src) {
    if (!wrap || !canvas || wrap._bbLottieRequested) return;
    wrap._bbLottieRequested = true;

    var motionOk = !reducedMotion();

    loadLottieModule()
      .then(function (module) {
        var instance = new module.DotLottie({
          canvas: canvas,
          src: src,
          // Always autoplay - that's the well-exercised path that reliably
          // paints a frame. Under reduced motion the load handler below pauses
          // it immediately after, rather than trusting an undocumented "does
          // autoplay:false still render frame 0" behavior for what would
          // otherwise be a permanently blank canvas.
          autoplay: true,
          loop: motionOk,
          // loopCount is "additional replays after the first play", so 2
          // here means 3 total plays, then the animation holds its last frame.
          loopCount: 2,
          renderConfig: {
            devicePixelRatio: window.devicePixelRatio || 1,
            autoResize: true,
            // Stops the render loop while off-screen - panel closed for the
            // header avatar, scrolled out of view for the launcher.
            freezeOnOffscreen: true,
          },
        });
        wrap._bbLottie = instance;
        instance.addEventListener("load", function () {
          wrap.setAttribute("data-animated", "true");
          if (!motionOk) instance.pause();
        });
        instance.addEventListener("loadError", function () {
          unmountAvatar(wrap);
        });
        instance.addEventListener("renderError", function () {
          unmountAvatar(wrap);
        });
      })
      .catch(function () {
        wrap._bbLottieRequested = false;
      });
  }

  function unmountAvatar(wrap) {
    if (!wrap) return;
    wrap.removeAttribute("data-animated");
    if (wrap._bbLottie) {
      wrap._bbLottie.destroy();
      wrap._bbLottie = null;
    }
    wrap._bbLottieRequested = false;
  }

  // The launcher sits on every page, so - unlike the header avatar, which only
  // loads once the panel is opened - this starts right on mount rather than
  // waiting for a click. The CDN serves the player immutable/cached, so after
  // a visitor's first-ever load this is near-instant; the cost is paid only
  // on that first visit, as a small amount of contention with the page's own
  // render.
  function scheduleLauncherAnimation() {
    mountAvatar(els.launcherIcon, els.launcherCanvas, LOTTIE_SRC_WHITE);
  }

  // The root page's inline CTA (index.mdx) carries the same wrap/canvas
  // markup as the launcher icon, marked with .bb-chat-cta-icon so it can be
  // found from here - it's rendered by Mintlify's own React tree, not built
  // by this file, so there's no `els` reference to it. Tracked by node
  // identity rather than a boolean flag: SPA navigation can swap in a new
  // element for the same page (a fresh mount, not the one last animated),
  // which needs the same load-once treatment as any first mount.
  var ctaIconWrap = null;

  function syncCtaIcon() {
    var wrap = document.querySelector(".bb-chat-cta-icon");
    if (wrap !== ctaIconWrap && ctaIconWrap) unmountAvatar(ctaIconWrap);
    ctaIconWrap = wrap;
    if (!wrap) return;
    // MDX's sanitizer strips a raw

Bindbee Documentation

Bindbee Docs MCP