@burdenoff/website-sdk 2026.1104.3 → 2026.1105.1

package/dist/avatar-live-view/index.mjs

@@ -1,14 +1,16 @@
-import { turnstileSiteKeyOf, isAvatarLiveLocaleReviewed, isAvatarSite, isAvatarVersion } from '../chunk-7MSB3EUI.mjs';
-import { fill } from '../chunk-TT3MHN42.mjs';
+import { turnstileSiteKeyOf, isAvatarLiveLocaleReviewed, isAvatarSite, isAvatarVersion } from '../chunk-MVNN6LLO.mjs';
+import { answerDisplayText, fill } from '../chunk-JZS6FQT6.mjs';
 import { cn } from '../chunk-R7G6TWIS.mjs';
 import '../chunk-VNS5WDWO.mjs';
 import { useId, useState, useRef, useCallback, useEffect } from 'react';
+import { Square, Mic } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // src/components/explore-avatar-api.ts
 var AVAILABILITY_TIMEOUT_MS = 8e3;
 var CREATE_TIMEOUT_MS = 3e4;
 var MESSAGE_ID = /^[A-Za-z0-9_-]{1,64}$/;
+var STT_TOKEN = /^[A-Za-z0-9._~-]{1,4096}$/;
 var CONVERSATION_TOKEN = /^[A-Za-z0-9._~+/=-]{16,512}$/;
 var LOCALE = /^[A-Za-z0-9-]{1,16}$/;
 var SESSION_ID = /^avs_[0-9a-f]{32}$/;
@@ -56,6 +58,15 @@ function readQuestions(value) {
   if (typeof value !== "string" || !QUESTION_MODES.has(value)) return null;
   return value === "any" ? "any" : "suggested";
 }
+function readSttOffer(value) {
+  if (!isRecord(value)) return void 0;
+  const keys = Object.keys(value).sort();
+  const { token, expiresAt } = value;
+  if (keys.length !== 2 || keys[0] !== "expiresAt" || keys[1] !== "token" || typeof token !== "string" || !STT_TOKEN.test(token) || typeof expiresAt !== "number" || !Number.isSafeInteger(expiresAt) || expiresAt <= 0) {
+    return void 0;
+  }
+  return { token, expiresAt };
+}
 function readAvailability(status, body) {
   if (status !== 200 || !isRecord(body)) return INERT;
   const { available, reason } = body;
@@ -69,9 +80,16 @@ function readAvailability(status, body) {
     if (available !== true || typeof consentVersion !== "string" || !isAvatarVersion(consentVersion) || typeof maxSessionSeconds !== "number" || !Number.isInteger(maxSessionSeconds) || maxSessionSeconds < 1 || botCheck === null || questions === null) {
       return INERT;
     }
+    const stt = readSttOffer(body.stt);
     return {
       kind: "available",
-      offer: { consentVersion, maxSessionSeconds, botCheck, questions }
+      offer: {
+        consentVersion,
+        maxSessionSeconds,
+        botCheck,
+        questions,
+        ...stt === void 0 ? {} : { stt }
+      }
     };
   }
   const meaning = available ? void 0 : AVAILABILITY_REASONS.get(reason);
@@ -159,6 +177,13 @@ function deadline(timeoutMs, outer) {
   };
 }
 async function requestAvailability(target) {
+  try {
+    return await requestAvailabilityAnswer(target);
+  } catch {
+    return INERT;
+  }
+}
+async function requestAvailabilityAnswer(target) {
   if (!isAvatarSite(target.site) || !LOCALE.test(target.locale)) return INERT;
   const query = new URLSearchParams({
     site: target.site,
@@ -174,13 +199,11 @@ async function requestAvailability(target) {
       signal: timer.signal
     });
     return readAvailability(response.status, await readJson(response));
-  } catch {
-    return INERT;
   } finally {
     timer.done();
   }
 }
-async function requestCreate(target) {
+function requestCreate(target) {
   const { body } = target;
   const payload = JSON.stringify({
     site: body.site,
@@ -190,27 +213,45 @@ async function requestCreate(target) {
     consentVersion: body.consentVersion,
     manifestVersion: body.manifestVersion
   });
-  const timer = deadline(CREATE_TIMEOUT_MS);
-  try {
-    const response = await fetch(`${target.base}/sessions`, {
-      method: "POST",
-      credentials: "omit",
-      cache: "no-store",
-      headers: {
-        ...target.headers,
-        "Content-Type": "application/json",
-        "Idempotency-Key": target.idempotencyKey,
-        ...target.botToken === void 0 ? {} : { "x-web-avatar-bot-token": target.botToken }
-      },
-      body: payload,
-      signal: timer.signal
+  const controller = new AbortController();
+  let answered = false;
+  const answer = (async () => {
+    try {
+      const response = await fetch(`${target.base}/sessions`, {
+        method: "POST",
+        credentials: "omit",
+        cache: "no-store",
+        headers: {
+          ...target.headers,
+          "Content-Type": "application/json",
+          "Idempotency-Key": target.idempotencyKey,
+          ...target.botToken === void 0 ? {} : { "x-web-avatar-bot-token": target.botToken }
+        },
+        body: payload,
+        signal: controller.signal
+      });
+      answered = true;
+      return readCreate(response.status, await readJson(response));
+    } catch {
+      return FAILED;
+    }
+  })();
+  return new Promise((resolve) => {
+    let late = false;
+    const timer = setTimeout(() => {
+      late = true;
+      if (!answered) controller.abort();
+      resolve(FAILED);
+    }, CREATE_TIMEOUT_MS);
+    void answer.then((result) => {
+      if (late) {
+        target.onLate?.(result);
+        return;
+      }
+      clearTimeout(timer);
+      resolve(result);
     });
-    return readCreate(response.status, await readJson(response));
-  } catch {
-    return INERT;
-  } finally {
-    timer.done();
-  }
+  });
 }
 function sendEnd(target) {
   try {
@@ -786,6 +827,318 @@ function avatarConsentCopy(version, locale) {
   if (!isAvatarLiveLocaleReviewed(locale)) return null;
   return CONSENT.get(version)?.[locale] ?? null;
 }
+var MIC_EN = {
+  micStart: "Ask by voice",
+  micStop: "Stop recording",
+  micAllow: "Use the microphone",
+  micNotNow: "Not now",
+  micStarting: "Starting the microphone\u2026",
+  micListening: "Listening\u2026",
+  micElapsed: "{elapsed} of {limit}",
+  micFinishing: "Getting the text\u2026",
+  micDone: "Check the text, then press Send.",
+  micDoneLimit: "The recording stopped at thirty seconds. Check the text, then press Send.",
+  micNoSpeech: "No words were heard. Try again, or type your question.",
+  micDenied: "The microphone is blocked in this browser. You can type your question instead.",
+  micUnsupported: "The microphone can't be used here. You can type your question instead.",
+  micUnavailable: "Voice questions aren't available right now. You can type your question instead.",
+  micLimit: "Voice questions have reached their limit for now. You can type your question instead.",
+  micBusy: "Voice questions are busy right now. Try again in a moment, or type your question.",
+  micFailed: "The microphone stopped before the text came. Try again, or type your question."
+};
+var MIC_STRINGS = { en: MIC_EN };
+function avatarMicStrings(locale) {
+  if (!isAvatarLiveLocaleReviewed(locale)) return null;
+  return MIC_STRINGS[locale] ?? null;
+}
+var AVATAR_MIC_NOTICE_VERSION = "web-mic-2026-11-05";
+var MIC_NOTICE = /* @__PURE__ */ new Map([
+  [
+    AVATAR_MIC_NOTICE_VERSION,
+    {
+      en: {
+        title: "Ask with your voice",
+        processing: "While you speak, your voice is streamed to our speech service, and Google Cloud Speech-to-Text turns it into text in Google's EU region.",
+        storage: "We don't store or log your audio, or the text made from it.",
+        text: "The text appears in the box and stays in this browser until you press Send. Nothing is sent by itself. Once you send it, it is a chat message, kept like any other.",
+        limits: "Each recording stops after thirty seconds, and voice questions have daily limits.",
+        privacyLink: "How we handle this"
+      }
+    }
+  ]
+]);
+function avatarMicNotice(version, locale) {
+  if (!isAvatarLiveLocaleReviewed(locale)) return null;
+  return MIC_NOTICE.get(version)?.[locale] ?? null;
+}
+var PRIVACY_HREF = "/privacy#live-avatar";
+var LIMIT_SECONDS = 30;
+var TICK_MS = 250;
+var IDLE = { name: "idle" };
+var FOR_GOOD = /* @__PURE__ */ new Set([
+  "unavailable",
+  "limit"
+]);
+var FAILURE_TEXT = {
+  denied: "micDenied",
+  unsupported: "micUnsupported",
+  unavailable: "micUnavailable",
+  limit: "micLimit",
+  busy: "micBusy",
+  failed: "micFailed"
+};
+function loadAvatarMic() {
+  return import('../avatar-mic/index.mjs').then((loaded) => ({
+    createAvatarMic: loaded.createAvatarMic
+  }));
+}
+function canUseAvatarMic() {
+  return typeof navigator !== "undefined" && typeof navigator.mediaDevices?.getUserMedia === "function" && typeof AudioContext !== "undefined" && typeof AudioWorkletNode !== "undefined" && typeof WebSocket !== "undefined";
+}
+function clock(seconds) {
+  const whole = Math.max(0, Math.floor(seconds));
+  return `${Math.floor(whole / 60)}:${String(whole % 60).padStart(2, "0")}`;
+}
+function withHeardText(current, heard, maxLength) {
+  const text = heard.trim();
+  if (text === "") return current;
+  const joined = current.trim() === "" ? text : `${current.replace(/\s+$/, "")} ${text}`;
+  return joined.slice(0, Math.max(0, maxLength));
+}
+function useAvatarMic({
+  enabled,
+  locale,
+  base,
+  offer,
+  refreshOffer,
+  onText
+}) {
+  const S = avatarMicStrings(locale);
+  const copy = avatarMicNotice(AVATAR_MIC_NOTICE_VERSION, locale);
+  const uid = useId();
+  const noticeTitleId = `${uid}-mic-notice`;
+  const [withdrawn, setWithdrawn] = useState(null);
+  const [supported, setSupported] = useState(false);
+  useEffect(() => setSupported(canUseAvatarMic()), []);
+  const possible = enabled && supported && base !== null && S !== null && copy !== null;
+  const offered = possible && withdrawn === null;
+  const [state, setState] = useState(IDLE);
+  const [noticeOpen, setNoticeOpen] = useState(false);
+  const agreedRef = useRef(false);
+  const [loading2, setLoading] = useState(false);
+  const [loadFailed, setLoadFailed] = useState(false);
+  const [now, setNow] = useState(() => Date.now());
+  const micRef = useRef(null);
+  const seqRef = useRef(0);
+  const buttonRef = useRef(null);
+  const allowRef = useRef(null);
+  const usedEpochRef = useRef(0);
+  const latest = useRef({ offer, refreshOffer, onText, base });
+  latest.current = { offer, refreshOffer, onText, base };
+  const cancel = useCallback(() => {
+    seqRef.current += 1;
+    setLoading(false);
+    setLoadFailed(false);
+    setNoticeOpen(false);
+    micRef.current?.mic.cancel();
+  }, []);
+  useEffect(() => {
+    if (!offered) cancel();
+  }, [offered, cancel]);
+  useEffect(
+    () => () => {
+      seqRef.current += 1;
+      micRef.current?.mic.cancel();
+    },
+    []
+  );
+  const micFor = useCallback(async (target) => {
+    const held = micRef.current;
+    if (held !== null && held.base === target) return held.mic;
+    held?.mic.cancel();
+    const loaded = await loadAvatarMic();
+    const mic = loaded.createAvatarMic({
+      base: target,
+      notice: AVATAR_MIC_NOTICE_VERSION,
+      offer: () => latest.current.offer,
+      refreshOffer: () => latest.current.refreshOffer(),
+      onState: setState
+    });
+    micRef.current = { base: target, mic };
+    return mic;
+  }, []);
+  const press = useCallback(() => {
+    const target = latest.current.base;
+    if (target === null) return;
+    seqRef.current += 1;
+    const seq = seqRef.current;
+    setLoadFailed(false);
+    setLoading(true);
+    void micFor(target).then(
+      (mic) => {
+        if (seqRef.current !== seq) return;
+        setLoading(false);
+        mic.start();
+      },
+      () => {
+        if (seqRef.current !== seq) return;
+        setLoading(false);
+        setLoadFailed(true);
+      }
+    );
+  }, [micFor]);
+  const recording = loading2 || state.name === "starting" || state.name === "listening";
+  const tap = useCallback(() => {
+    if (state.name === "listening" || state.name === "starting") {
+      micRef.current?.mic.stop();
+      return;
+    }
+    if (loading2) {
+      cancel();
+      return;
+    }
+    if (!agreedRef.current) {
+      setNoticeOpen(true);
+      void loadAvatarMic().catch(() => void 0);
+      return;
+    }
+    press();
+  }, [cancel, loading2, press, state.name]);
+  const allow = useCallback(() => {
+    agreedRef.current = true;
+    setNoticeOpen(false);
+    buttonRef.current?.focus();
+    press();
+  }, [press]);
+  const notNow = useCallback(() => {
+    setNoticeOpen(false);
+    buttonRef.current?.focus();
+  }, []);
+  useEffect(() => {
+    if (noticeOpen) allowRef.current?.focus();
+  }, [noticeOpen]);
+  const listeningSince = state.name === "listening" ? state.startedAt : null;
+  useEffect(() => {
+    if (listeningSince === null) return;
+    setNow(Date.now());
+    const timer = setInterval(() => setNow(Date.now()), TICK_MS);
+    return () => clearInterval(timer);
+  }, [listeningSince]);
+  useEffect(() => {
+    if (state.name === "done" && state.epoch !== usedEpochRef.current) {
+      usedEpochRef.current = state.epoch;
+      if (state.text !== "") latest.current.onText(state.text);
+    } else if (state.name === "failed" && FOR_GOOD.has(state.reason)) {
+      setWithdrawn(state.reason);
+    }
+  }, [state]);
+  if (!possible || S === null || copy === null) {
+    return { button: null, notice: null, lines: null, cancel };
+  }
+  const status = withdrawn !== null ? S[FAILURE_TEXT[withdrawn]] : loading2 ? S.micStarting : loadFailed ? S.micFailed : state.name === "starting" ? S.micStarting : state.name === "listening" ? S.micListening : state.name === "finishing" ? S.micFinishing : state.name === "done" ? state.text === "" ? S.micNoSpeech : state.limit ? S.micDoneLimit : S.micDone : state.name === "failed" ? S[FAILURE_TEXT[state.reason]] : "";
+  const heard = offered && (state.name === "listening" || state.name === "finishing") ? state.text : "";
+  const button = !offered ? null : /* @__PURE__ */ jsx(
+    "button",
+    {
+      ref: buttonRef,
+      type: "button",
+      "aria-label": recording ? S.micStop : S.micStart,
+      "aria-pressed": recording,
+      title: recording ? S.micStop : S.micStart,
+      "data-boff-explore": "avatar-live-mic",
+      "data-mic": loading2 ? "starting" : state.name,
+      className: cn(
+        "inline-flex h-11 w-11 shrink-0 items-center justify-center rounded-md border transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background motion-reduce:transition-none",
+        recording ? "border-primary bg-primary text-primary-foreground" : "border-border bg-background text-foreground hover:bg-accent hover:text-accent-foreground"
+      ),
+      onClick: tap,
+      children: recording ? /* @__PURE__ */ jsx(Square, { "aria-hidden": "true", className: "h-4 w-4" }) : /* @__PURE__ */ jsx(Mic, { "aria-hidden": "true", className: "h-4 w-4" })
+    }
+  );
+  const notice = offered && noticeOpen ? /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-labelledby": noticeTitleId,
+      "data-boff-explore": "avatar-live-mic-notice",
+      className: "w-full rounded-lg border border-border p-3 text-start",
+      children: [
+        /* @__PURE__ */ jsx("h3", { id: noticeTitleId, className: "text-sm font-semibold", children: copy.title }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: copy.processing }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: copy.storage }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: copy.text }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: copy.limits }),
+        /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: PRIVACY_HREF,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            "data-boff-explore": "avatar-live-mic-privacy",
+            className: "mt-1 inline-block text-xs font-medium text-primary underline underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+            children: copy.privacyLink
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "mt-2 flex flex-wrap gap-2", children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              ref: allowRef,
+              type: "button",
+              "data-boff-explore": "avatar-live-mic-allow",
+              className: "inline-flex min-h-11 items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground transition-opacity hover:opacity-90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background motion-reduce:transition-none",
+              onClick: allow,
+              children: S.micAllow
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "data-boff-explore": "avatar-live-mic-not-now",
+              className: "inline-flex min-h-11 items-center justify-center rounded-md border border-border bg-background px-4 py-2 text-sm font-medium text-foreground transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background motion-reduce:transition-none",
+              onClick: notNow,
+              children: S.micNotNow
+            }
+          )
+        ] })
+      ]
+    }
+  ) : null;
+  const listening = offered && state.name === "listening";
+  const lines = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
+      listening ? /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: "relative flex h-2 w-2 shrink-0", children: [
+        /* @__PURE__ */ jsx("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-primary opacity-75 motion-reduce:animate-none" }),
+        /* @__PURE__ */ jsx("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-primary" })
+      ] }) : null,
+      /* @__PURE__ */ jsx("p", { role: "status", "data-boff-explore": "avatar-live-mic-status", children: status }),
+      listening ? /* @__PURE__ */ jsx(
+        "span",
+        {
+          role: "timer",
+          "data-boff-explore": "avatar-live-mic-elapsed",
+          className: "tabular-nums",
+          children: fill(S.micElapsed, {
+            elapsed: clock(
+              Math.min(LIMIT_SECONDS, (now - (listeningSince ?? now)) / 1e3)
+            ),
+            limit: clock(LIMIT_SECONDS)
+          })
+        }
+      ) : null
+    ] }),
+    heard === "" ? null : /* @__PURE__ */ jsx(
+      "p",
+      {
+        "data-boff-explore": "avatar-live-mic-heard",
+        dir: "auto",
+        className: "line-clamp-3 break-words text-sm italic text-muted-foreground",
+        children: heard
+      }
+    )
+  ] });
+  return { button, notice, lines, cancel };
+}
 
 // src/components/explore-avatar-turnstile.ts
 var SCRIPT_SRC = "https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit";
@@ -901,7 +1254,7 @@ function runTurnstile(container, siteKey, action, cData) {
     }
   };
 }
-var PRIVACY_HREF = "/privacy#live-avatar";
+var PRIVACY_HREF2 = "/privacy#live-avatar";
 var SPEAKER_WAIT_MS = 3e4;
 var END_GRACE_MS = 1e4;
 var CLOCK_TOLERANCE_MS = 5e3;
@@ -914,7 +1267,7 @@ var ASK_MAX_LENGTH = 300;
 var MAX_REFERENCES = 64;
 var USED_ON_KEY = "boff.explore.avatarUsedOn";
 var PRIMARY = '[data-avatar-primary], [data-boff-explore="panel-continue-chat"]';
-var IDLE = { name: "idle" };
+var IDLE2 = { name: "idle" };
 var INERT2 = { name: "inert" };
 function stopAttending(handle) {
   if (handle.unheard !== null) clearTimeout(handle.unheard);
@@ -1004,6 +1357,12 @@ function firstExchange(messages, rules = SUGGESTED_RULES) {
 function inFlight(conversation) {
   return conversation?.phase === "sending" || conversation?.phase === "streaming";
 }
+function acceptsQuestion(slot) {
+  return slot.any && !slot.textMode && slot.phase === "needs-answer" && slot.kind === "empty" && slot.reason === null;
+}
+function micOfferOf(result) {
+  return result.kind === "available" && result.offer.stt !== void 0 ? { ...result.offer.stt, receivedAt: Date.now() } : null;
+}
 function utcToday() {
   return (/* @__PURE__ */ new Date()).toISOString().slice(0, 10);
 }
@@ -1073,7 +1432,7 @@ async function loadModule(load) {
   }
   return loaded;
 }
-function clock(seconds) {
+function clock2(seconds) {
   const whole = Math.max(0, Math.ceil(seconds));
   return `${Math.floor(whole / 60)}:${String(whole % 60).padStart(2, "0")}`;
 }
@@ -1126,7 +1485,7 @@ function AvatarLiveView({
   const shown = offeredAt(exchange, Date.now());
   const { answerId, startOver } = shown;
   const offerUntil = answerId === null ? null : exchange.offerUntil;
-  const [phase, setPhase] = useState(IDLE);
+  const [phase, setPhase] = useState(IDLE2);
   const [blocked, setBlocked] = useState(false);
   const [now, setNow] = useState(() => Date.now());
   const [draft, setDraft] = useState("");
@@ -1136,7 +1495,7 @@ function AvatarLiveView({
   const [usedToday, setUsedToday] = useState(false);
   const showing = active && !off;
   const behindChat = open && !active && !off;
-  const phaseRef = useRef(IDLE);
+  const phaseRef = useRef(IDLE2);
   const latest = useRef({
     live,
     locale,
@@ -1152,6 +1511,8 @@ function AvatarLiveView({
   const waitRef = useRef(null);
   const sendingRef = useRef(false);
   const textBoxRef = useRef(false);
+  const [micOffer, setMicOffer] = useState(null);
+  const micCancelRef = useRef(() => void 0);
   const checkRef = useRef(null);
   const askedLocale = useRef(locale);
   const startRef = useRef(null);
@@ -1272,6 +1633,7 @@ function AvatarLiveView({
   const applyAvailability = useCallback(
     (result, locale2) => {
       const { live: live2 } = latest.current;
+      setMicOffer(micOfferOf(result));
       if (result.kind === "inert") {
         setMode("suggested");
         go(INERT2);
@@ -1359,21 +1721,21 @@ function AvatarLiveView({
     [go]
   );
   const settle = useCallback(
-    (result, run, context) => {
+    (result, givenUp, context) => {
       const created = result.kind === "created" ? {
         sessionId: result.session.sessionId,
         secret: result.session.endSecret
       } : result.kind === "unusable" ? { sessionId: result.sessionId, secret: result.endSecret } : null;
       const claimed = created !== null || result.kind === "refused" && result.reason === "answer_claimed";
       if (claimed) claimedRef.current.add(context.messageId);
-      if (run.cancelled !== null) {
+      if (givenUp !== null) {
         if (created !== null) {
           sendEnd({
             base: context.base,
             headers: context.headers,
             sessionId: created.sessionId,
             secret: created.secret,
-            reason: run.cancelled
+            reason: givenUp
           });
         }
         const shown2 = phaseRef.current;
@@ -1482,21 +1844,21 @@ function AvatarLiveView({
           return;
         }
         if (turnstile !== null) go({ name: "creating" });
+        const context = { module: loaded, offer, messageId, base: base2, headers: headers2 };
         const result = await requestCreate({
           base: base2,
           headers: headers2,
           idempotencyKey,
           botToken,
-          body: body2
+          body: body2,
+          // An answer past the deadline, after the view has said the live avatar couldn't start: a session it made is
+          // ended at once with its own secret, and never joined. The reason is the visitor's own where they gave the
+          // start up first, else `client_error`. It reads `run` and never writes it, so the deadline's `failed` below is
+          // shown whichever of the two is handled first.
+          onLate: (late) => settle(late, run.cancelled ?? "client_error", context)
         });
         if (startRef.current === run) startRef.current = null;
-        settle(result, run, {
-          module: loaded,
-          offer,
-          messageId,
-          base: base2,
-          headers: headers2
-        });
+        settle(result, run.cancelled, context);
       })();
     },
     [exchangeNow, go, reoffer, settle]
@@ -1587,6 +1949,7 @@ function AvatarLiveView({
     [applyAvailability, bindingHolds, cancelWaiting, exchangeNow, launch]
   );
   const stop = useCallback(() => {
+    micCancelRef.current();
     const current = phaseRef.current;
     if (current.name === "waiting") {
       cancelWaiting(false);
@@ -1608,6 +1971,7 @@ function AvatarLiveView({
   }, [cancelStart, cancelWaiting, finish, go, reoffer]);
   const leave = useCallback(
     (event) => {
+      micCancelRef.current();
       const current = phaseRef.current;
       const reason = event === "user" || event === "chat" ? "user" : "page_hide";
       const how = reason === "user" ? "stopped" : "interrupted";
@@ -1618,7 +1982,7 @@ function AvatarLiveView({
           const controller = checkRef.current;
           checkRef.current = null;
           controller?.abort();
-          go(IDLE);
+          go(IDLE2);
           return;
         }
         case "waiting":
@@ -1626,7 +1990,7 @@ function AvatarLiveView({
           return;
         case "bot-check":
           cancelStart(reason);
-          go(reason === "user" ? IDLE : reoffer(current.offer));
+          go(reason === "user" ? IDLE2 : reoffer(current.offer));
           return;
         case "creating":
           if (keepsSession) return;
@@ -1688,7 +2052,7 @@ function AvatarLiveView({
     } else {
       checkRef.current?.abort();
       checkRef.current = null;
-      go(IDLE);
+      go(IDLE2);
     }
   }, [active, cancelWaiting, check, go, locale]);
   const kind = shown.kind;
@@ -1933,6 +2297,46 @@ function AvatarLiveView({
   const textMode = any && (usedToday && (phase.name === "needs-answer" || phase.name === "consent" || phase.name === "declined" || phase.name === "ended") || phase.name === "refused" && phase.reason === "limits");
   textBoxRef.current = textMode;
   const askState = !any ? void 0 : textMode ? "text" : phase.name === "needs-answer" ? kind === "empty" ? "ready" : kind : phase.name;
+  const askReason = inFlight(conversation) ? S.askBusy : conversation?.canSend ? null : S.askUnavailable;
+  const refreshMicOffer = useCallback(async () => {
+    const { live: live2, locale: locale2, base: base2, headers: headers2 } = latest.current;
+    if (base2 === null) return null;
+    const next = micOfferOf(
+      await requestAvailabilityAnswer({
+        base: base2,
+        headers: headers2,
+        site: live2.site,
+        locale: locale2
+      })
+    );
+    if (next !== null) setMicOffer(next);
+    return next;
+  }, []);
+  const onMicText = useCallback(
+    (text) => {
+      setDraft((current) => withHeardText(current, text, askMaxLength));
+      if (touchFirst) return;
+      rootRef.current?.querySelector(
+        '[data-boff-explore="avatar-live-ask-input"]'
+      )?.focus();
+    },
+    [askMaxLength, touchFirst]
+  );
+  const mic = useAvatarMic({
+    enabled: live.mic === true && micOffer !== null && !off && acceptsQuestion({
+      any,
+      phase: phase.name,
+      kind,
+      textMode,
+      reason: askReason
+    }),
+    locale,
+    base,
+    offer: micOffer,
+    refreshOffer: refreshMicOffer,
+    onText: onMicText
+  });
+  micCancelRef.current = mic.cancel;
   const notNow = useCallback(() => {
     const current = phaseRef.current;
     if ((current.name === "consent" || current.name === "needs-answer") && current.offer.questions === "any") {
@@ -2101,7 +2505,7 @@ function AvatarLiveView({
         /* @__PURE__ */ jsxs(
           "a",
           {
-            href: PRIVACY_HREF,
+            href: PRIVACY_HREF2,
             target: "_blank",
             rel: "noopener noreferrer",
             "data-boff-explore": "avatar-live-privacy",
@@ -2193,7 +2597,7 @@ function AvatarLiveView({
     /* @__PURE__ */ jsxs("p", { className: "text-sm tabular-nums text-muted-foreground", children: [
       S.timeLeft,
       " ",
-      /* @__PURE__ */ jsx("span", { role: "timer", "data-boff-explore": "avatar-live-countdown", children: clock(Math.max(0, (session.endsAt - now) / 1e3)) })
+      /* @__PURE__ */ jsx("span", { role: "timer", "data-boff-explore": "avatar-live-countdown", children: clock2(Math.max(0, (session.endsAt - now) / 1e3)) })
     ] })
   ] });
   const liveActions = (back) => /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-center gap-2", children: [
@@ -2275,14 +2679,21 @@ function AvatarLiveView({
             children: lastQuestion.content
           }
         ),
-        lastAnswer === void 0 ? unanswered === "waiting" ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: activity ?? S.gettingAnswer }) : unanswered === "failed" ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: S.answerFailed }) : null : lastAnswer.status === "PENDING" || lastAnswer.status === "RUNNING" ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: activity ?? S.gettingAnswer }) : lastAnswer.status === "FAILED" ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: S.answerFailed }) : /* @__PURE__ */ jsx(
-          "p",
-          {
-            "data-boff-explore": "avatar-live-text-answer",
-            dir: "auto",
-            className: "line-clamp-6 w-full max-w-sm whitespace-pre-wrap break-words text-start text-sm",
-            children: lastAnswer.content
-          }
+        lastAnswer === void 0 ? unanswered === "waiting" ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: activity ?? S.gettingAnswer }) : unanswered === "failed" ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: S.answerFailed }) : null : lastAnswer.status === "PENDING" || lastAnswer.status === "RUNNING" ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: activity ?? S.gettingAnswer }) : lastAnswer.status === "FAILED" ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: S.answerFailed }) : (
+          // The answer's words, not its markdown: `content` is written for the chat's renderer, and shown as it is
+          // here a link reads `[label](https://…)`. In its spoken form, as the chat's read-aloud says it: a link is its
+          // label (the address is in Chat, one tap away), a table its rows, and the markers of emphasis, headings,
+          // quotes and list items go (`answerDisplayText`). The words are the ones the chat shows, citation markers
+          // included, which the sources in Chat answer to.
+          /* @__PURE__ */ jsx(
+            "p",
+            {
+              "data-boff-explore": "avatar-live-text-answer",
+              dir: "auto",
+              className: "line-clamp-6 w-full max-w-sm whitespace-pre-wrap break-words text-start text-sm",
+              children: answerDisplayText(lastAnswer.content)
+            }
+          )
         )
       ] });
       const ended = phase.name === "ended";
@@ -2403,7 +2814,7 @@ function AvatarLiveView({
           break;
       }
     }
-    const reason = inFlight(conversation) ? S.askBusy : conversation?.canSend ? null : S.askUnavailable;
+    const reason = askReason;
     const chips = box !== null && shown.kind === "empty" && prompts.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
       /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground", children: tryAsking }),
       /* @__PURE__ */ jsx("div", { className: "flex max-h-28 flex-wrap gap-2 overflow-y-auto", children: prompts.map((prompt) => /* @__PURE__ */ jsx(
@@ -2450,6 +2861,7 @@ function AvatarLiveView({
               children: S.usedToday
             }
           ) : null,
+          box === "spoken" ? mic.notice : null,
           box === null ? null : /* @__PURE__ */ jsx(
             AskBox,
             {
@@ -2464,7 +2876,9 @@ function AvatarLiveView({
               footer: S.askFooter,
               noFiles: S.askNoFiles,
               hint: box === "spoken" ? S.needsAnswerAny : null,
-              touchFirst
+              touchFirst,
+              mic: box === "spoken" ? mic.button : null,
+              micLines: box === "spoken" ? mic.lines : null
             }
           )
         ]
@@ -2611,7 +3025,9 @@ function AskBox({
   footer,
   noFiles,
   hint,
-  touchFirst
+  touchFirst,
+  mic,
+  micLines
 }) {
   const uid = useId();
   const reasonId = `${uid}-reason`;
@@ -2676,6 +3092,7 @@ function AskBox({
               onDrop
             }
           ),
+          mic,
           /* @__PURE__ */ jsx(
             "button",
             {
@@ -2689,6 +3106,7 @@ function AskBox({
             }
           )
         ] }),
+        micLines,
         reason === null ? null : /* @__PURE__ */ jsx(
           "p",
           {