@mrrocket/sdk 0.17.0 → 0.21.0

package/dist/react-native/index.js

@@ -31,7 +31,9 @@ __export(native_exports, {
   SDK_VERSION: () => SDK_VERSION,
   activeRouteName: () => activeRouteName,
   createMRRocket: () => createMRRocket,
+  currentLocale: () => currentLocale,
   getMRRocket: () => getMRRocket,
+  setLocale: () => setLocale,
   useCancelFlow: () => useCancelFlow,
   useExpoRouterTracking: () => useExpoRouterTracking,
   useFeedback: () => useFeedback,
@@ -48,10 +50,70 @@ __export(native_exports, {
   useVariant: () => useVariant
 });
 module.exports = __toCommonJS(native_exports);
-var import_react3 = require("react");
+var import_react4 = require("react");
+
+// src/i18n.ts
+var g = globalThis;
+var s = g.__mrrocketI18n ?? (g.__mrrocketI18n = { version: 0, onWords: /* @__PURE__ */ new Set(), onLocale: /* @__PURE__ */ new Set() });
+var tell = (listeners) => {
+  for (const fn of [...listeners]) {
+    try {
+      fn();
+    } catch {
+    }
+  }
+};
+var t = (word) => s.words?.[word] || word;
+var tf = (word, vars) => t(word).replace(/\{(\w+)\}/g, (all, k) => k in vars ? String(vars[k]) : all);
+var setWords = (words, lang) => {
+  const same2 = s.lang === lang && JSON.stringify(s.words ?? {}) === JSON.stringify(words ?? {});
+  s.words = words;
+  s.lang = lang;
+  if (same2) return;
+  s.version++;
+  tell(s.onWords);
+};
+var tidy = (locale) => {
+  const tag = locale?.trim().replace(/_/g, "-");
+  if (!tag) return void 0;
+  try {
+    return Intl.getCanonicalLocales(tag)[0];
+  } catch (e) {
+    return e instanceof RangeError ? void 0 : tag;
+  }
+};
+var setLocale = (locale) => {
+  const next = tidy(locale);
+  if (next === s.locale) return;
+  s.locale = next;
+  s.version++;
+  tell(s.onWords);
+  tell(s.onLocale);
+};
+var setDeviceLocale = (locale) => {
+  s.device = tidy(locale);
+};
+var currentLocale = () => s.locale ?? s.device ?? (typeof navigator !== "undefined" && navigator.language || void 0);
+var langParam = () => {
+  const l = currentLocale();
+  return l ? `&lang=${encodeURIComponent(l)}` : "";
+};
+var wordsVersion = () => s.version;
+var onWords = (fn) => {
+  s.onWords.add(fn);
+  return () => {
+    s.onWords.delete(fn);
+  };
+};
+var onLocale = (fn) => {
+  s.onLocale.add(fn);
+  return () => {
+    s.onLocale.delete(fn);
+  };
+};
 
 // src/core.ts
-var SDK_VERSION = "0.17.0";
+var SDK_VERSION = "0.21.0";
 var propOf = (person, name) => {
   const want = name.trim().toLowerCase();
   for (const [k, v] of Object.entries(person)) if (k.toLowerCase() === want) return v;
@@ -77,7 +139,7 @@ var matchesCondition = (c, person) => {
 var evaluateFlag = (flag, distinctId, person = {}) => {
   if (!flag.on) return false;
   const subject = { id: distinctId, ...person };
-  const set = flag.sets.length ? flag.sets.find((s) => s.conditions.every((c) => matchesCondition(c, subject))) : { conditions: [], rollout: 100 };
+  const set = flag.sets.length ? flag.sets.find((s2) => s2.conditions.every((c) => matchesCondition(c, subject))) : { conditions: [], rollout: 100 };
   if (!set) return false;
   if (flagUnit(`${flag.key}:rollout:${distinctId}`) * 100 >= set.rollout) return false;
   if (!flag.variants?.length) return true;
@@ -108,11 +170,11 @@ var parseQuery = (url) => {
   const q = url.split("#")[0];
   const at = q.indexOf("?");
   if (at < 0) return out;
-  const dec = (s) => {
+  const dec = (s2) => {
     try {
-      return decodeURIComponent(s.replace(/\+/g, " "));
+      return decodeURIComponent(s2.replace(/\+/g, " "));
     } catch {
-      return s;
+      return s2;
     }
   };
   for (const pair of q.slice(at + 1).split("&")) {
@@ -173,12 +235,52 @@ var textChanges = (config, distinctId, preview) => {
 };
 var newDistinctId = () => typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `ck_${Math.random().toString(36).slice(2)}${Date.now().toString(36)}`;
 
+// src/onboarding-state.ts
+var import_react = require("react");
+var none = [];
+var useOnboardingItem = (flows, id, start) => {
+  const [state, setState] = (0, import_react.useState)(() => flows && id ? flows.onboarding.item(id) : null);
+  (0, import_react.useEffect)(() => {
+    if (!flows || !id) {
+      setState(null);
+      return;
+    }
+    const up = () => {
+      const s2 = flows.onboarding.item(id);
+      setState(s2);
+      if (s2 && !s2.done && !s2.dismissed) flows.onboarding.seen(id);
+    };
+    up();
+    return flows.subscribe(up);
+  }, [flows, id]);
+  return (0, import_react.useMemo)(
+    () => ({
+      item: state?.item ?? null,
+      steps: state?.steps ?? none,
+      done: !!state?.done,
+      dismissed: !!state?.dismissed,
+      eligible: !!state?.eligible,
+      complete: (stepId) => {
+        if (flows && id) flows.onboarding.complete(id, stepId);
+      },
+      dismiss: () => {
+        if (flows && id) flows.onboarding.dismissItem(id);
+      },
+      answer: (question, value) => {
+        if (flows && id) flows.onboarding.answerItem(id, question, value);
+      },
+      start
+    }),
+    [state, flows, id, start]
+  );
+};
+
 // src/identity.ts
 var UNSIGNED_HELP = "401: sign the user id on your server with userHash(id) from @mrrocket/sdk/next/server and pass identify(id, props, { hash }).";
 var warnUnsigned = (status, log = (m) => console.warn(m)) => {
-  const g = globalThis;
-  if (status !== 401 || g.__mrrocketUnsigned) return;
-  g.__mrrocketUnsigned = true;
+  const g2 = globalThis;
+  if (status !== 401 || g2.__mrrocketUnsigned) return;
+  g2.__mrrocketUnsigned = true;
   log(`[MRRocket] ${UNSIGNED_HELP}`);
 };
 var nextSigned = (signed, id, hash, log = (m) => console.warn(m)) => {
@@ -202,11 +304,11 @@ var BRAND_URL = "https://mrrocket.dev/?utm_source=messenger&utm_medium=powered-b
 var inkOn = (hex) => {
   const m = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i.exec(hex);
   if (!m) return "#ffffff";
-  const [r, g, b] = [m[1], m[2], m[3]].map((x) => {
+  const [r, g2, b] = [m[1], m[2], m[3]].map((x) => {
     const c = parseInt(x, 16) / 255;
     return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
   });
-  return 0.2126 * r + 0.7152 * g + 0.0722 * b > 0.45 ? "#111214" : "#ffffff";
+  return 0.2126 * r + 0.7152 * g2 + 0.0722 * b > 0.45 ? "#111214" : "#ffffff";
 };
 var ApiError = class extends Error {
   constructor(message, status) {
@@ -215,7 +317,11 @@ var ApiError = class extends Error {
     this.status = status;
   }
 };
-var qs = (params) => Object.entries(params).filter((e) => !!e[1]).map(([k, v]) => `${encodeURIComponent(k)}=${encodeURIComponent(v)}`).join("&");
+var qs = (params, lang = currentLocale()) => Object.entries({ ...params, lang }).filter((e) => !!e[1]).map(([k, v]) => `${encodeURIComponent(k)}=${encodeURIComponent(v)}`).join("&");
+var withLang = (url) => {
+  const q = qs({});
+  return q ? `${url}?${q}` : url;
+};
 var call = async (url, init, signal) => {
   let res;
   try {
@@ -227,7 +333,7 @@ var call = async (url, init, signal) => {
     });
   } catch (e) {
     if (e.name === "AbortError") throw e;
-    throw new ApiError("Could not reach the server. Check your connection and try again.", 0);
+    throw new ApiError(t("Could not reach the server. Check your connection and try again."), 0);
   }
   if (!res.ok) {
     warnUnsigned(res.status);
@@ -236,7 +342,7 @@ var call = async (url, init, signal) => {
       detail = (await res.json()).error ?? "";
     } catch {
     }
-    throw new ApiError(detail || (res.status === 429 ? "Too many requests. Try again in a minute." : "Something went wrong. Please try again."), res.status);
+    throw new ApiError(detail || (res.status === 429 ? t("Too many requests. Try again in a minute.") : t("Something went wrong. Please try again.")), res.status);
   }
   return await res.json();
 };
@@ -244,7 +350,7 @@ var createApi = (c) => {
   const base = `${c.host}/api/sdk`;
   const who2 = { key: c.apiKey, distinctId: c.distinctId, user: c.user, userHash: c.userHash };
   const me = { key: c.apiKey, distinctId: c.distinctId, userHash: c.userHash };
-  const post = (path, body, signal) => call(`${base}${path}`, { method: "POST", body: JSON.stringify({ ...who2, ...body }) }, signal);
+  const post = (path, body, signal) => call(withLang(`${base}${path}`), { method: "POST", body: JSON.stringify({ ...who2, ...body }) }, signal);
   return {
     list: (o, signal) => call(`${base}/feedback?${qs({ ...me, board: o.board, sort: o.sort, q: o.q })}`, void 0, signal),
     post: (id, signal) => call(`${base}/feedback/${encodeURIComponent(id)}?${qs(me)}`, void 0, signal),
@@ -257,8 +363,12 @@ var createApi = (c) => {
     survey: (url, signal) => call(`${base}/surveys?${qs({ ...me, url })}`, void 0, signal),
     seen: (id) => post(`/surveys/${encodeURIComponent(id)}/seen`, { user: void 0 }),
     respond: (id, r) => post(`/surveys/${encodeURIComponent(id)}/respond`, r),
-    chat: (signal) => call(`${base}/messages?${qs(me)}`, void 0, signal),
-    /** A message; `attachments` are upload ids from `uploadChatFile` (then the body may be empty). */
+    /** One chat by id, else the visitor's newest; `conversations` lists them all. */
+    chat: (signal, conversation) => call(`${base}/messages?${qs({ ...me, conversation })}`, void 0, signal),
+    /**
+     * A message; `attachments` are upload ids from `uploadChatFile` (then the body may be empty). `conversation` is
+     * the chat it answers, or "new" to start one; without it, the running chat or else a new one.
+     */
     sendChat: (m) => post("/messages", m),
     /** Uploads one picked file for the next message (pictures and PDFs, at most 10 MB); answers its upload id. */
     uploadChatFile: (file, signal) => {
@@ -268,10 +378,10 @@ var createApi = (c) => {
       if (c.userHash) form.append("userHash", c.userHash);
       if ("uri" in file) form.append("file", file);
       else form.append("file", file, file.name || "file");
-      return call(`${base}/messages/attachments`, { method: "POST", body: form }, signal);
+      return call(withLang(`${base}/messages/attachments`), { method: "POST", body: form }, signal);
     },
     /** Where a sent file of this visitor's chat is read (an image's src, a PDF's link). */
-    attachmentUrl: (id) => `${base}/messages/attachments/${encodeURIComponent(id)}?${qs(me)}`,
+    attachmentUrl: (id) => `${base}/messages/attachments/${encodeURIComponent(id)}?${qs(me, "")}`,
     articles: (q, signal) => call(`${base}/articles?${qs({ key: c.apiKey, q })}`, void 0, signal),
     article: (id, signal) => call(`${base}/articles/${encodeURIComponent(id)}?${qs(me)}`, void 0, signal),
     messengerLook: (signal) => call(`${base}/messenger?${qs({ key: c.apiKey })}`, void 0, signal),
@@ -282,13 +392,13 @@ var createApi = (c) => {
 // src/batch.ts
 var MAX_BATCH = 100;
 var MAX_BYTES = 6e4;
-var byteLength = (s) => {
+var byteLength = (s2) => {
   let n = 0;
-  for (let i = 0; i < s.length; i++) {
-    const c = s.charCodeAt(i);
+  for (let i = 0; i < s2.length; i++) {
+    const c = s2.charCodeAt(i);
     if (c < 128) n += 1;
     else if (c < 2048) n += 2;
-    else if (c >= 55296 && c <= 56319 && i + 1 < s.length && (s.charCodeAt(i + 1) & 64512) === 56320) {
+    else if (c >= 55296 && c <= 56319 && i + 1 < s2.length && (s2.charCodeAt(i + 1) & 64512) === 56320) {
       n += 4;
       i++;
     } else n += 3;
@@ -323,7 +433,7 @@ var batchRequests = (key, events, sdk, userHash) => {
 
 // src/errors.ts
 var MAX_STACK = 8 * 1024;
-var clip = (s, n) => s.length > n ? `${s.slice(0, n - 1)}\u2026` : s;
+var clip = (s2, n) => s2.length > n ? `${s2.slice(0, n - 1)}\u2026` : s2;
 var describeError = (error) => {
   if (error instanceof Error) return { type: error.name || "Error", message: clip(error.message || String(error), 1e3), stack: error.stack ? clip(error.stack, MAX_STACK) : void 0 };
   if (typeof error === "string") return { type: "Error", message: clip(error, 1e3) };
@@ -344,22 +454,52 @@ var PLAIN_CANCEL = {
   question: "",
   reasons: [],
   offers: {},
-  confirm: { title: "Cancel your subscription?", body: "You keep access until the end of the billing period.", button: "Cancel subscription" },
+  // Read when it is shown, so it follows the visitor's language.
+  get confirm() {
+    return { title: t("Cancel your subscription?"), body: t("You keep access until the end of the billing period."), button: t("Cancel subscription") };
+  },
   offersFor: "business"
 };
-var FAILED = "Something went wrong. Please try again.";
 var PROGRESS_KEY = "mrrocket:onboarding";
-var eventSlug = (s) => s.trim().toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_+|_+$/g, "");
+var eventSlug = (s2) => s2.trim().toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_+|_+$/g, "");
 var SIGNUP = /* @__PURE__ */ new Set(["signed_up", "signup", "sign_up", "registered", "account_created", "user_signed_up"]);
 var matchesTrigger = (trigger, event) => {
-  const t = eventSlug(trigger);
+  const t2 = eventSlug(trigger);
   const e = eventSlug(event);
-  if (!t || !e) return false;
-  return t === e || SIGNUP.has(t) && SIGNUP.has(e);
+  if (!t2 || !e) return false;
+  return t2 === e || SIGNUP.has(t2) && SIGNUP.has(e);
 };
 var startsOnLoad = (trigger) => /^(first (launch|visit|open|session|login|sign ?in|app open)|app (opened|launched)|on load|every visit|always)?$/i.test(trigger.trim());
 var isPageTrigger = (trigger) => trigger.trim().startsWith("/");
-var manual = (trigger) => eventSlug(trigger) === "from_a_checklist";
+var NEEDS_NEWER = "Needs tracking code 0.18.0";
+var momentOf = (f) => f.when ?? f.trigger;
+var manual = (trigger) => eventSlug(trigger) === "from_a_checklist" || eventSlug(trigger) === "from_your_code" || eventSlug(trigger) === eventSlug(NEEDS_NEWER);
+var AFTER_PREFIX = "after:";
+var afterOf = (trigger) => {
+  const t2 = (trigger ?? "").trim();
+  return t2.toLowerCase().startsWith(AFTER_PREFIX) ? t2.slice(AFTER_PREFIX.length).trim() || null : null;
+};
+var opensOf = (step) => step.opens ?? (step.startsTour ? { kind: "tour", id: step.startsTour } : void 0);
+var OTHER_PREFIX = "other:";
+var scaleOf = (q) => {
+  const min = q?.min ?? 0;
+  const max = q?.max ?? 10;
+  return Array.from({ length: Math.max(0, Math.min(max - min, 20) + 1) }, (_, i) => min + i);
+};
+var answerOk = (q, value) => {
+  if (!q || value == null) return false;
+  if (q.type === "choice") {
+    if (q.other && value.startsWith(OTHER_PREFIX)) return value.slice(OTHER_PREFIX.length).trim().length > 0;
+    return (q.options ?? []).some((o) => o.id === value);
+  }
+  if (q.type === "scale") return scaleOf(q).some((n) => String(n) === value);
+  return value.trim().length > 0 && value.length <= 500;
+};
+var answerLabel = (q, value) => {
+  if (q?.type !== "choice") return value.trim();
+  if (q.other && value.startsWith(OTHER_PREFIX)) return value.slice(OTHER_PREFIX.length).trim();
+  return q.options?.find((o) => o.id === value)?.label ?? value;
+};
 var videoEmbed = (url) => {
   const u = (url ?? "").trim();
   if (!/^https?:\/\//i.test(u)) return null;
@@ -381,12 +521,14 @@ var runId = () => `cf_${Math.random().toString(36).slice(2, 10)}${Date.now().toS
 var discounted = (amount, percent) => Math.round(amount * (1 - percent / 100) * 100) / 100;
 var money = (amount, currency) => {
   try {
-    return new Intl.NumberFormat(void 0, { style: "currency", currency }).format(amount);
+    return new Intl.NumberFormat(currentLocale(), { style: "currency", currency }).format(amount);
   } catch {
     return `${amount.toFixed(2)} ${currency}`;
   }
 };
-var offerButton = (o) => o.kind === "contact" ? "Send to the team" : o.kind === "pause" ? "Pause instead" : o.kind === "downgrade" ? "Switch plan" : "Accept offer";
+var offerButton = (o) => o.kind === "contact" ? t("Send to the team") : o.kind === "pause" ? t("Pause instead") : o.kind === "downgrade" ? t("Switch plan") : t("Accept offer");
+var monthsWord = (n) => n === 1 ? t("1 month") : tf("{n} months", { n });
+var forMonths = (n) => tf("for {months}", { months: monthsWord(n) });
 var safeUrl = (url) => {
   const u = (url ?? "").trim();
   return /^https?:\/\//i.test(u) || /^\/(?!\/)/.test(u) ? u : void 0;
@@ -425,7 +567,12 @@ var createFlows = (env) => {
   const now = () => env.now?.() ?? Date.now();
   let timer = null;
   let returnTo = null;
+  const answers = /* @__PURE__ */ new Map();
+  const drafts = /* @__PURE__ */ new Map();
+  const celebrated = /* @__PURE__ */ new Set();
+  let finaleNow = null;
   const flows = () => config?.onboarding ?? [];
+  const drawn = () => flows().filter((f) => f.shownBy !== "code");
   const flowById = (id) => id ? flows().find((f) => f.id === id) : void 0;
   const prog = (id) => {
     let p = progress.get(id);
@@ -499,6 +646,14 @@ var createFlows = (env) => {
   };
   const keyOf = (pid) => `${PROGRESS_KEY}:${pid ?? "visitor"}`;
   const eventsKeyOf = (pid) => `${PROGRESS_KEY}:events:${pid ?? "visitor"}`;
+  const answersKeyOf = (pid) => `${PROGRESS_KEY}:answers:${pid ?? "visitor"}`;
+  const celebrate = (f) => {
+    if (!f.finish || f.finish === "none" || f.shownBy === "code" || celebrated.has(f.id)) return;
+    const p = progress.get(f.id);
+    if (!p || p.dismissed || walkLine(f, nodesOf(f), p, false).at !== "end") return;
+    celebrated.add(f.id);
+    finaleNow = { kind: f.finish, key: `${f.id}:${now()}` };
+  };
   const save = () => {
     dirty = false;
     const store = env.storage?.();
@@ -514,18 +669,19 @@ var createFlows = (env) => {
       };
     try {
       store.set(keyOf(env.personId()), JSON.stringify(out));
+      if (answers.size) store.set(answersKeyOf(env.personId()), JSON.stringify(Object.fromEntries(answers)));
       if (seenEvents.size) store.set(eventsKeyOf(env.personId()), JSON.stringify([...seenEvents].slice(-200)));
     } catch {
     }
   };
   const merge = (state) => {
-    for (const [id, s] of Object.entries(state ?? {})) {
+    for (const [id, s2] of Object.entries(state ?? {})) {
       const p = prog(id);
-      for (const d of s.done ?? []) p.done.add(d);
-      if (s.dismissed) p.dismissed = true;
-      for (const [k, v] of Object.entries(s.answers ?? {})) if (!p.answers.has(k)) p.answers.set(k, v === "yes");
-      for (const [k, v] of Object.entries(s.at ?? {})) if (typeof v === "number" && !p.at.has(k)) p.at.set(k, v);
-      for (const [k, v] of Object.entries(s.reached ?? {})) if (typeof v === "number" && (!p.reached.has(k) || v < p.reached.get(k))) p.reached.set(k, v);
+      for (const d of s2.done ?? []) p.done.add(d);
+      if (s2.dismissed) p.dismissed = true;
+      for (const [k, v] of Object.entries(s2.answers ?? {})) if (!p.answers.has(k)) p.answers.set(k, v === "yes");
+      for (const [k, v] of Object.entries(s2.at ?? {})) if (typeof v === "number" && !p.at.has(k)) p.at.set(k, v);
+      for (const [k, v] of Object.entries(s2.reached ?? {})) if (typeof v === "number" && (!p.reached.has(k) || v < p.reached.get(k))) p.reached.set(k, v);
     }
   };
   const wakeAt = (until) => {
@@ -565,9 +721,18 @@ var createFlows = (env) => {
       return {
         type: "checklist",
         flow,
-        items: items.map((s) => {
-          const tour = s.startsTour && s.startsTour !== flow.id ? flowById(s.startsTour) : void 0;
-          return { step: s, done: p.done.has(s.id), ...tour && nodesOf(tour).length ? { tour } : {} };
+        items: items.map((s2) => {
+          const o = opensOf(s2);
+          const t2 = o && (o.kind === "tour" || o.kind === "modal") && o.id !== flow.id ? flowById(o.id) : void 0;
+          const target = t2 && t2.shownBy !== "code" && nodesOf(t2).length ? t2 : void 0;
+          const opens = o && (o.kind === "page" ? !!o.target.trim() : o.kind === "code" || !!target) ? o : void 0;
+          return {
+            step: s2,
+            done: p.done.has(s2.id),
+            ...target && o?.kind === "tour" ? { tour: target } : {},
+            ...opens ? { opens } : {},
+            ...target ? { target } : {}
+          };
         })
       };
     }
@@ -578,7 +743,16 @@ var createFlows = (env) => {
     const rest = line.slice(index + 1);
     const fork = rest.findIndex((n) => n.kind === "condition");
     const ahead = (fork < 0 ? rest : rest.slice(0, fork)).filter(isStep).length;
-    return { type: "step", flow, step, index: w.before, total: w.before + 1 + ahead, last: !ahead && fork < 0 };
+    return {
+      type: "step",
+      flow,
+      step,
+      index: w.before,
+      total: w.before + 1 + ahead,
+      last: !ahead && fork < 0,
+      // 0.18.0: a question's answer so far, and whether there is one before it to go back to.
+      ...step.kind === "question" ? { answer: drafts.get(step.id) ?? (step.question ? answers.get(step.question.key) : void 0), back: w.before > 0 } : {}
+    };
   };
   const view = () => {
     if (cancel) {
@@ -605,23 +779,25 @@ var createFlows = (env) => {
     if (ob) return ob;
     if (active && !holding) {
       const back = returnTo;
-      const ended = active;
+      const ended2 = active;
       returnTo = null;
       active = null;
       const list = back ? flowById(back.flow) : void 0;
       if (back && list) {
-        const item = stepsIn(nodesOf(list)).find((s) => s.id === back.step);
+        const item = stepsIn(nodesOf(list)).find((s2) => s2.id === back.step);
         const p = prog(list.id);
-        if (item && !item.event && !progress.get(ended)?.dismissed && !p.done.has(item.id)) {
+        if (item && !item.event && !progress.get(ended2)?.dismissed && !p.done.has(item.id)) {
           markDone(p, item.id);
           record({ flow: list.id, step: item.id, kind: "checklist", action: "completed" });
+          celebrate(list);
         }
         active = list.id;
         const again = onboardingView();
         if (again) return again;
         if (!holding) active = null;
       } else if (known) {
-        const after = flowById(ended)?.trigger;
+        const was = flowById(ended2);
+        const after = was ? momentOf(was) : void 0;
         Promise.resolve().then(() => autoStart(after));
       }
     }
@@ -649,22 +825,64 @@ var createFlows = (env) => {
     emit();
     return true;
   };
-  const allowed = (f) => f.audience !== "signed_in" || !!env.personId();
+  const allowed = (f) => f.audience === "answered" ? !!f.answered && answers.get(f.answered.question) === f.answered.option : f.audience !== "signed_in" || !!env.personId();
+  const predecessorEnded = (id) => {
+    const g2 = flowById(id);
+    return !g2 || finished(g2);
+  };
+  const due = (f, trigger = momentOf(f)) => {
+    const path = env.path?.();
+    const pred = afterOf(trigger);
+    if (pred) return predecessorEnded(pred);
+    if (manual(trigger)) return false;
+    if (isPageTrigger(trigger)) return path !== void 0 && pageMatches(trigger, path);
+    if (startsOnLoad(trigger)) return true;
+    for (const e of seenEvents) if (matchesTrigger(trigger, e)) return true;
+    return false;
+  };
   const autoStart = (after) => {
     if (!auto || active || !known) return;
     if (!env.personId() && !env.storage?.()) return;
     const path = env.path?.();
     const same2 = after && !manual(after) ? eventSlug(after) : "";
-    const next = flows().find(
-      (f) => (isPageTrigger(f.trigger) ? path !== void 0 && pageMatches(f.trigger, path) : startsOnLoad(f.trigger) || !!same2 && eventSlug(f.trigger) === same2) && allowed(f) && nodesOf(f).length && !finished(f)
+    const next = drawn().find(
+      (f) => (afterOf(momentOf(f)) ? predecessorEnded(afterOf(momentOf(f))) : isPageTrigger(momentOf(f)) ? path !== void 0 && pageMatches(momentOf(f), path) : startsOnLoad(momentOf(f)) || !!same2 && eventSlug(momentOf(f)) === same2) && allowed(f) && nodesOf(f).length && !finished(f)
     );
     if (next) start(next);
   };
+  const openItem = (list, stepId, target) => {
+    const p = prog(target.id);
+    p.done.clear();
+    p.at.clear();
+    p.dismissed = false;
+    returnTo = { flow: list.id, step: stepId };
+    active = target.id;
+    env.track(ONBOARDING_EVENT, { flow: target.id, action: "started", from: list.id });
+    save();
+    emit();
+  };
+  const answerStep = (flow, step, raw) => {
+    const q = step.question;
+    const value = q.type === "text" ? raw.trim().slice(0, 500) : raw.startsWith(OTHER_PREFIX) ? OTHER_PREFIX + raw.slice(OTHER_PREFIX.length).trim().slice(0, 490) : raw;
+    answers.set(q.key, value);
+    drafts.delete(step.id);
+    markDone(prog(flow.id), step.id);
+    env.track(ONBOARDING_EVENT, { flow: flow.id, step: step.id, kind: "question", action: "completed", question: q.key, answer: value, label: answerLabel(q, value) });
+    celebrate(flow);
+    save();
+  };
+  const ended = (f) => {
+    save();
+    if (finished(f)) Promise.resolve().then(() => autoStart());
+    emit();
+  };
   const refresh = () => {
     const pid = env.personId();
     if (progressFor !== null && progressFor !== pid) {
       progress.clear();
       seenEvents.clear();
+      answers.clear();
+      drafts.clear();
       handled.clear();
       active = null;
       returnTo = null;
@@ -681,6 +899,10 @@ var createFlows = (env) => {
           if (seen) {
             for (const e of JSON.parse(seen)) if (typeof e === "string") seenEvents.add(e);
           }
+          const said = await store.get(answersKeyOf(pid));
+          if (said) {
+            for (const [k, v] of Object.entries(JSON.parse(said))) if (typeof v === "string") answers.set(k, v);
+          }
         } catch {
         }
       }
@@ -691,6 +913,7 @@ var createFlows = (env) => {
         if (state && env.personId() === pid) {
           merge(state.onboarding);
           for (const e of state.events ?? []) if (typeof e === "string") seenEvents.add(eventSlug(e));
+          for (const [k, v] of Object.entries(state.answers ?? {})) if (typeof v === "string" && !answers.has(k)) answers.set(k, v);
           messages = (state.messages ?? []).filter((m) => m && m.id && m.title);
         }
       }
@@ -751,7 +974,7 @@ var createFlows = (env) => {
       () => finish(c, r),
       () => {
         c.busy = false;
-        c.error = FAILED;
+        c.error = t("Something went wrong. Please try again.");
         emit();
       }
     );
@@ -784,27 +1007,33 @@ var createFlows = (env) => {
       if (fresh) seenEvents.add(slug);
       const flow = flowById(active);
       let ticked = false;
-      if (flow) {
-        const p = prog(flow.id);
-        for (const s of stepsIn(nodesOf(flow)))
-          if (s.kind === "checklist" && s.event && !p.done.has(s.id) && matchesTrigger(s.event, name)) {
-            markDone(p, s.id);
-            ticked = true;
-            env.track(ONBOARDING_EVENT, { flow: flow.id, step: s.id, kind: s.kind, action: "completed" });
+      const lists = [...flow ? [flow] : [], ...flows().filter((f) => f.shownBy === "code" && f.id !== flow?.id)];
+      for (const l of lists) {
+        const p = prog(l.id);
+        let here = false;
+        for (const s2 of stepsIn(nodesOf(l)))
+          if (s2.kind === "checklist" && s2.event && !p.done.has(s2.id) && matchesTrigger(s2.event, name)) {
+            markDone(p, s2.id);
+            here = true;
+            env.track(ONBOARDING_EVENT, { flow: l.id, step: s2.id, kind: s2.kind, action: "completed" });
           }
+        if (here) {
+          ticked = true;
+          celebrate(l);
+        }
       }
-      if (ticked || fresh && flow) {
+      if (ticked || fresh && (flow || lists.length)) {
         save();
         emit();
       } else if (fresh) save();
       if (!auto || !env.personId() && !env.storage?.()) return;
-      const next = flows().find((f) => nodesOf(f).length && !manual(f.trigger) && matchesTrigger(f.trigger, name) && allowed(f) && !finished(f));
+      const next = drawn().find((f) => nodesOf(f).length && !manual(momentOf(f)) && matchesTrigger(momentOf(f), name) && allowed(f) && !finished(f));
       if (next) start(next);
     },
     openCancelFlow,
     startOnboarding: (id) => {
-      const f = id ? flowById(id) : flows().find((x) => nodesOf(x).length && !manual(x.trigger) && !finished(x));
-      if (!f || !nodesOf(f).length) return false;
+      const f = id ? flowById(id) : drawn().find((x) => nodesOf(x).length && !manual(momentOf(x)) && !afterOf(momentOf(x)) && !finished(x));
+      if (!f || !nodesOf(f).length || f.shownBy === "code") return false;
       const p = prog(f.id);
       p.dismissed = false;
       return start(f);
@@ -825,8 +1054,8 @@ var createFlows = (env) => {
       answer: (text2) => {
         const c = cancel;
         if (!c || c.busy || c.screen !== "followup") return;
-        const t = text2.slice(0, 500);
-        c.answer = t.trim() ? t : void 0;
+        const t2 = text2.slice(0, 500);
+        c.answer = t2.trim() ? t2 : void 0;
         emit();
       },
       next: () => {
@@ -895,8 +1124,17 @@ var createFlows = (env) => {
       next: () => {
         const v = onboardingView();
         if (v?.type !== "step") return;
+        if (v.step.kind === "question") {
+          const q = v.step.question;
+          const a = drafts.get(v.step.id) ?? (q ? answers.get(q.key) : void 0);
+          if (!q || !answerOk(q, a)) return;
+          answerStep(v.flow, v.step, a);
+          emit();
+          return;
+        }
         markDone(prog(v.flow.id), v.step.id);
         env.track(ONBOARDING_EVENT, { flow: v.flow.id, step: v.step.id, kind: v.step.kind, action: "completed" });
+        celebrate(v.flow);
         save();
         emit();
         const url = v.step.kind === "modal" ? safeUrl(v.step.url) : void 0;
@@ -909,6 +1147,7 @@ var createFlows = (env) => {
         if (!item || item.done) return;
         markDone(prog(v.flow.id), stepId);
         env.track(ONBOARDING_EVENT, { flow: v.flow.id, step: stepId, kind: "checklist", action: "completed" });
+        celebrate(v.flow);
         save();
         emit();
       },
@@ -925,20 +1164,123 @@ var createFlows = (env) => {
       startTour: (stepId) => {
         const v = onboardingView();
         if (v?.type !== "checklist") return false;
-        const tour = v.items.find((i) => i.step.id === stepId)?.tour;
-        if (!tour) return false;
-        const p = prog(tour.id);
-        p.done.clear();
-        p.at.clear();
-        p.dismissed = false;
-        returnTo = { flow: v.flow.id, step: stepId };
-        active = tour.id;
-        env.track(ONBOARDING_EVENT, { flow: tour.id, action: "started", from: v.flow.id });
+        const target = v.items.find((i) => i.step.id === stepId)?.target;
+        if (!target) return false;
+        openItem(v.flow, stepId, target);
+        return true;
+      },
+      open: (stepId) => {
+        const v = onboardingView();
+        if (v?.type !== "checklist") return false;
+        const it = v.items.find((i) => i.step.id === stepId);
+        const o = it?.opens;
+        if (!it || !o) return false;
+        env.track(ONBOARDING_EVENT, { flow: v.flow.id, step: stepId, kind: "checklist", action: "opened", opens: o.kind });
+        if ((o.kind === "tour" || o.kind === "modal") && it.target) {
+          openItem(v.flow, stepId, it.target);
+          return true;
+        }
+        if (!it.done && !it.step.event) {
+          markDone(prog(v.flow.id), stepId);
+          env.track(ONBOARDING_EVENT, { flow: v.flow.id, step: stepId, kind: "checklist", action: "completed" });
+          celebrate(v.flow);
+        }
         save();
         emit();
+        if (o.kind === "page") env.navigate?.(o.target.trim());
+        else env.task?.(stepId, v.flow);
         return true;
+      },
+      answer: (value) => {
+        const v = onboardingView();
+        if (v?.type !== "step" || v.step.kind !== "question") return;
+        drafts.set(v.step.id, String(value).slice(0, 500));
+        emit();
+      },
+      skip: () => {
+        const v = onboardingView();
+        const q = v?.type === "step" && v.step.kind === "question" ? v.step.question : void 0;
+        if (v?.type !== "step" || !q?.optional) return;
+        drafts.delete(v.step.id);
+        markDone(prog(v.flow.id), v.step.id);
+        env.track(ONBOARDING_EVENT, { flow: v.flow.id, step: v.step.id, kind: "question", action: "completed", question: q.key, skipped: true });
+        celebrate(v.flow);
+        save();
+        emit();
+      },
+      back: () => {
+        const v = onboardingView();
+        if (v?.type !== "step" || v.step.kind !== "question" || !v.back) return;
+        const line = stepsIn(nodesOf(v.flow));
+        const at = line.findIndex((s2) => s2.id === v.step.id);
+        const p = prog(v.flow.id);
+        for (let i = at - 1; i >= 0; i--)
+          if (p.done.has(line[i].id)) {
+            p.done.delete(line[i].id);
+            p.at.delete(line[i].id);
+            break;
+          }
+        save();
+        emit();
+      },
+      item: (id) => {
+        const f = flowById(id);
+        if (!f) return null;
+        const p = progress.get(f.id);
+        const steps = stepsIn(nodesOf(f)).map((s2) => {
+          const a = s2.question ? answers.get(s2.question.key) : void 0;
+          return { ...s2, done: !!p?.done.has(s2.id), ...a !== void 0 ? { answer: a } : {} };
+        });
+        const done = steps.length > 0 && steps.every((s2) => s2.done);
+        const dismissed = !!p?.dismissed;
+        return { item: f, steps, done, dismissed, eligible: !done && !dismissed && allowed(f) && due(f) };
+      },
+      seen: (id) => {
+        const f = flowById(id);
+        if (!f || f.shownBy !== "code" || !known) return;
+        if (!shown.has(`f:${f.id}`)) {
+          shown.add(`f:${f.id}`);
+          env.track(ONBOARDING_EVENT, { flow: f.id, action: "started" });
+        }
+        const p = progress.get(f.id);
+        for (const s2 of stepsIn(nodesOf(f)))
+          if (!p?.done.has(s2.id) && !shown.has(`s:${s2.id}`)) {
+            shown.add(`s:${s2.id}`);
+            env.track(ONBOARDING_EVENT, { flow: f.id, step: s2.id, kind: s2.kind, action: "shown" });
+            if (s2.kind !== "checklist") break;
+          }
+      },
+      complete: (id, stepId) => {
+        const f = flowById(id);
+        const s2 = f && stepsIn(nodesOf(f)).find((x) => x.id === stepId);
+        if (!f || !s2 || s2.kind === "question") return;
+        const p = prog(f.id);
+        if (p.done.has(s2.id)) return;
+        markDone(p, s2.id);
+        env.track(ONBOARDING_EVENT, { flow: f.id, step: s2.id, kind: s2.kind, action: "completed" });
+        ended(f);
+      },
+      dismissItem: (id) => {
+        const f = flowById(id);
+        if (!f) return;
+        const p = prog(f.id);
+        if (p.dismissed) return;
+        p.dismissed = true;
+        env.track(ONBOARDING_EVENT, { flow: f.id, action: "dismissed" });
+        if (active === f.id) active = null;
+        ended(f);
+      },
+      answerItem: (id, question, value) => {
+        const f = flowById(id);
+        const s2 = f && stepsIn(nodesOf(f)).find((x) => x.kind === "question" && (x.id === question || x.question?.key === question));
+        if (!f || !s2?.question || !answerOk(s2.question, value)) return;
+        answerStep(f, s2, value);
+        ended(f);
       }
     },
+    finale: () => finaleNow,
+    accent: () => config?.onboardingAccent,
+    answers: () => Object.fromEntries(answers),
     message: {
       click: () => {
         const v = view();
@@ -1020,7 +1362,7 @@ var createPaywallHost = (env) => {
       },
       () => {
         c.busy = false;
-        c.error = "The purchase did not go through. Please try again.";
+        c.error = t("The purchase did not go through. Please try again.");
         emit();
       }
     );
@@ -1095,10 +1437,10 @@ var RageDetector = class {
     __publicField(this, "clicks", []);
     __publicField(this, "fired", false);
   }
-  push(x, y, t) {
-    const near = this.clicks.filter((c) => t - c.t <= this.windowMs && Math.hypot(c.x - x, c.y - y) <= this.radius);
+  push(x, y, t2) {
+    const near = this.clicks.filter((c) => t2 - c.t <= this.windowMs && Math.hypot(c.x - x, c.y - y) <= this.radius);
     if (near.length !== this.clicks.length) this.fired = false;
-    this.clicks = [...near, { x, y, t }];
+    this.clicks = [...near, { x, y, t: t2 }];
     if (this.clicks.length >= this.count && !this.fired) {
       this.fired = true;
       return true;
@@ -1114,9 +1456,9 @@ var BUFFER_MS = 6e4;
 var CHUNK_FRAMES = 12;
 var CHUNK_CHARS = 7e5;
 var MAX_MS = 30 * 6e4;
-var shareOf = (s) => {
+var shareOf = (s2) => {
   let h3 = 2166136261;
-  for (let i = 0; i < s.length; i++) h3 = Math.imul(h3 ^ s.charCodeAt(i), 16777619);
+  for (let i = 0; i < s2.length; i++) h3 = Math.imul(h3 ^ s2.charCodeAt(i), 16777619);
   return (h3 >>> 0) / 4294967296;
 };
 var createRecorder = (deps, st) => {
@@ -1241,14 +1583,14 @@ var measureMasks = () => Promise.all(
     (ref) => new Promise((resolve) => {
       const v = ref.current;
       if (!v) return resolve("none");
-      const t = setTimeout(() => resolve("failed"), 100);
+      const t2 = setTimeout(() => resolve("failed"), 100);
       try {
         v.measureInWindow((x, y, w, h3) => {
-          clearTimeout(t);
+          clearTimeout(t2);
           resolve(w > 0 && h3 > 0 ? [x, y, w, h3] : "none");
         });
       } catch {
-        clearTimeout(t);
+        clearTimeout(t2);
         resolve("failed");
       }
     })
@@ -1285,7 +1627,7 @@ var MAX_CRUMBS = 20;
 var MAX_BACKOFF_MS = 5 * 60 * 1e3;
 var REQUEST_TIMEOUT_MS = 15e3;
 var EAGER_COUNT = 20;
-var clip2 = (s, n) => s.length > n ? `${s.slice(0, n - 1)}\u2026` : s;
+var clip2 = (s2, n) => s2.length > n ? `${s2.slice(0, n - 1)}\u2026` : s2;
 var createClient = (options, deps) => {
   const apiKey = (options.apiKey ?? "").trim();
   const host = (options.host ?? DEFAULT_HOST).trim().replace(/\/+$/, "");
@@ -1313,6 +1655,8 @@ var createClient = (options, deps) => {
     context = deps.context();
   } catch {
   }
+  setDeviceLocale(context.locale);
+  if (options.locale) setLocale(options.locale);
   const appId = (deps.appId || "app").replace(/[^A-Za-z0-9._-]/g, "") || "app";
   const release = options.release ?? (context.appVersion ? `${context.appVersion}${context.build ? ` (${context.build})` : ""}` : void 0);
   const sdk = { v: SDK_VERSION, errors: errorsOn, platform: context.platform };
@@ -1358,7 +1702,7 @@ var createClient = (options, deps) => {
   const fetchInApp = async (id) => {
     if (!apiKey) return null;
     const hash = hashOf(id);
-    const r = await deps.fetch(`${host}/api/sdk/inapp?key=${encodeURIComponent(apiKey)}&distinctId=${encodeURIComponent(id)}${hash ? `&userHash=${hash}` : ""}`, { method: "GET" });
+    const r = await deps.fetch(`${host}/api/sdk/inapp?key=${encodeURIComponent(apiKey)}&distinctId=${encodeURIComponent(id)}${hash ? `&userHash=${hash}` : ""}${langParam()}`, { method: "GET" });
     warnUnsigned(r.status, deps.log);
     return r.ok ? await r.json() : null;
   };
@@ -1372,7 +1716,14 @@ var createClient = (options, deps) => {
       set: (k, v) => void set(k, v)
     } : null,
     openUrl: deps.openUrl,
-    fetchInApp: (id) => fetchInApp(id)
+    fetchInApp: (id) => fetchInApp(id),
+    // 0.18.0: a task's page or screen goes to the app's navigator; without one only a link with a scheme opens.
+    navigate: (target) => {
+      if (options.onNavigate) return options.onNavigate(target);
+      if (/^[a-z][a-z0-9+.-]*:/i.test(target) && !/^(javascript|data|vbscript):/i.test(target)) deps.openUrl?.(target);
+      else warn(`A checklist task opens "${target}": pass onNavigate to MRRocketProvider to open screens and paths.`);
+    },
+    task: (taskId, item) => options.onTask?.(taskId, item)
   });
   const refreshFlows = () => {
     if (!isReady || closed) return;
@@ -1437,9 +1788,9 @@ var createClient = (options, deps) => {
   const sendId = () => consent === "persistent" ? distinctId() : identified;
   const hashOf = (id) => hashFor(signed, id);
   const touchSession = () => {
-    const t = now();
-    if (!session || t - session.last >= SESSION_TIMEOUT_MS) session = { id: newDistinctId(), last: t };
-    else session.last = t;
+    const t2 = now();
+    if (!session || t2 - session.last >= SESSION_TIMEOUT_MS) session = { id: newDistinctId(), last: t2 };
+    else session.last = t2;
     return session.id;
   };
   const urlOf = (path = currentScreen) => `app://${appId}${path ?? "/"}`;
@@ -1628,7 +1979,7 @@ var createClient = (options, deps) => {
   const fetchConfig = async () => {
     if (!apiKey) return;
     try {
-      const r = await deps.fetch(`${host}/api/sdk/config?key=${encodeURIComponent(apiKey)}`, { method: "GET" });
+      const r = await deps.fetch(`${host}/api/sdk/config?key=${encodeURIComponent(apiKey)}${langParam()}`, { method: "GET" });
       if (!r.ok) {
         warn(`Config request answered ${r.status}. Check the public key and the host.`);
         return;
@@ -1636,6 +1987,7 @@ var createClient = (options, deps) => {
       const c = await r.json();
       if (c && Array.isArray(c.experiments)) {
         config = c;
+        setWords(c.words, c.lang);
         if (consent !== "off") await set(KEYS.config, JSON.stringify(c));
         changed();
       }
@@ -1754,7 +2106,10 @@ var createClient = (options, deps) => {
       }
       try {
         const c = cached ? JSON.parse(cached) : null;
-        if (c && Array.isArray(c.experiments) && !config) config = c;
+        if (c && Array.isArray(c.experiments) && !config) {
+          config = c;
+          setWords(c.words, c.lang);
+        }
       } catch {
         await remove(KEYS.config);
       }
@@ -1810,6 +2165,9 @@ var createClient = (options, deps) => {
     await fetchConfig();
     markReady();
     refreshFlows();
+    onLocale(() => {
+      void fetchConfig().then(refreshFlows);
+    });
   };
   void start().catch(() => {
     loaded = true;
@@ -1998,42 +2356,227 @@ var createClient = (options, deps) => {
   return client;
 };
 var activeRouteName = (state) => {
-  let s = state;
+  let s2 = state;
   let name;
-  for (let depth = 0; s && Array.isArray(s.routes) && s.routes.length && depth < 20; depth++) {
-    const route = s.routes[typeof s.index === "number" ? s.index : s.routes.length - 1];
+  for (let depth = 0; s2 && Array.isArray(s2.routes) && s2.routes.length && depth < 20; depth++) {
+    const route = s2.routes[typeof s2.index === "number" ? s2.index : s2.routes.length - 1];
     if (!route) break;
     name = route.name ?? name;
-    s = route.state;
+    s2 = route.state;
   }
   return name;
 };
 
 // src/native/flows-view.ts
-var import_react = require("react");
+var import_react2 = require("react");
+
+// src/icons.ts
+var FLOW_ICONS = {
+  check: { label: "Check", paths: ["M5 12.5l4.5 4.5L19 7.5"], emoji: "\u2705" },
+  star: { label: "Star", paths: ["M12 3.5l2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.9l-5.2 2.7 1-5.8-4.3-4.1 5.9-.9z"], emoji: "\u2B50" },
+  rocket: {
+    label: "Rocket",
+    paths: ["M12 3c3 2 4.5 5.5 4 10l-2 3h-4l-2-3c-.5-4.5 1-8 4-10z", "M8 13.5l-3 3 3.5.5", "M16 13.5l3 3-3.5.5", "M13.5 9.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z", "M11 19.5v1.5M13 19.5v1.5"],
+    emoji: "\u{1F680}"
+  },
+  user: { label: "Person", paths: ["M15.5 8a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0z", "M5 20c.8-3.5 3.6-5.5 7-5.5s6.2 2 7 5.5"], emoji: "\u{1F464}" },
+  users: {
+    label: "Team",
+    paths: ["M13 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z", "M3.5 19c.6-3 3-4.8 6.5-4.8s5.9 1.8 6.5 4.8", "M16 5.2a3 3 0 0 1 0 5.6", "M18 14.6c1.5.6 2.4 2 2.7 4.4"],
+    emoji: "\u{1F465}"
+  },
+  settings: {
+    label: "Settings",
+    paths: ["M12 2.8v2.4M12 18.8v2.4M2.8 12h2.4M18.8 12h2.4M5.5 5.5l1.7 1.7M16.8 16.8l1.7 1.7M5.5 18.5l1.7-1.7M16.8 7.2l1.7-1.7", "M17 12a5 5 0 1 1-10 0 5 5 0 0 1 10 0z", "M14 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"],
+    emoji: "\u2699\uFE0F"
+  },
+  bell: { label: "Bell", paths: ["M6 16v-5a6 6 0 0 1 12 0v5l1.5 2h-15z", "M10 20.5a2 2 0 0 0 4 0"], emoji: "\u{1F514}" },
+  mail: { label: "Mail", paths: ["M4 6h16v12H4z", "M4 7l8 6 8-6"], emoji: "\u2709\uFE0F" },
+  chat: { label: "Chat", paths: ["M4 5h16v11H9l-5 4z"], emoji: "\u{1F4AC}" },
+  heart: { label: "Heart", paths: ["M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z"], emoji: "\u2764\uFE0F" },
+  flag: { label: "Flag", paths: ["M5 21V4", "M5 4h11l-2 4 2 4H5"], emoji: "\u{1F6A9}" },
+  bolt: { label: "Bolt", paths: ["M13 3L5 13.5h6L10 21l8-10.5h-6z"], emoji: "\u26A1" },
+  book: { label: "Book", paths: ["M4 5.5C6.5 4 9.5 4 12 6c2.5-2 5.5-2 8-.5V19c-2.5-1.5-5.5-1.5-8 .5-2.5-2-5.5-2-8-.5z", "M12 6v13.5"], emoji: "\u{1F4D6}" },
+  calendar: { label: "Calendar", paths: ["M4 6h16v14H4z", "M4 10h16", "M8 3.5v4M16 3.5v4"], emoji: "\u{1F4C5}" },
+  camera: { label: "Camera", paths: ["M4 8h3.5L9 5.5h6L16.5 8H20v11H4z", "M15.5 13a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0z"], emoji: "\u{1F4F7}" },
+  cart: { label: "Cart", paths: ["M3.5 4.5H6l2 10h10l2-7H7", "M9.5 19.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z", "M18.5 19.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"], emoji: "\u{1F6D2}" },
+  chart: { label: "Chart", paths: ["M4 20h16", "M7 16v-4M12 16V8M17 16V9"], emoji: "\u{1F4CA}" },
+  gift: { label: "Gift", paths: ["M4 10h16v10H4z", "M3 7h18v3H3z", "M12 7v13", "M12 7c-1.5-3-5-3-5-1s3.5 1 5 1z", "M12 7c1.5-3 5-3 5-1s-3.5 1-5 1z"], emoji: "\u{1F381}" },
+  home: { label: "Home", paths: ["M4 11l8-7 8 7", "M6 9.5V20h12V9.5", "M10 20v-6h4v6"], emoji: "\u{1F3E0}" },
+  link: { label: "Link", paths: ["M10 14a4 4 0 0 0 5.7 0l3-3a4 4 0 0 0-5.7-5.7l-1 1", "M14 10a4 4 0 0 0-5.7 0l-3 3a4 4 0 0 0 5.7 5.7l1-1"], emoji: "\u{1F517}" },
+  lock: { label: "Lock", paths: ["M6 11h12v9H6z", "M8.5 11V8a3.5 3.5 0 0 1 7 0v3"], emoji: "\u{1F512}" },
+  pencil: { label: "Pencil", paths: ["M4 20l1-4L16 5l3 3L8 19z", "M14 7l3 3"], emoji: "\u270F\uFE0F" },
+  plus: { label: "Plus", paths: ["M12 5v14M5 12h14"], emoji: "\u2795" },
+  search: { label: "Search", paths: ["M16 10.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z", "M14.5 14.5L20 20"], emoji: "\u{1F50D}" },
+  upload: { label: "Upload", paths: ["M12 15V4", "M7.5 8.5L12 4l4.5 4.5", "M4 15v5h16v-5"], emoji: "\u2B06\uFE0F" },
+  play: { label: "Play", paths: ["M8 5l11 7-11 7z"], emoji: "\u25B6\uFE0F" },
+  sparkle: { label: "Sparkle", paths: ["M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8z", "M19 16l.7 2 2 .7-2 .7-.7 2-.7-2-2-.7 2-.7z"], emoji: "\u2728" },
+  globe: {
+    label: "Globe",
+    paths: ["M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0z", "M4 12h16", "M12 4c2.2 2.2 3.3 4.9 3.3 8s-1.1 5.8-3.3 8c-2.2-2.2-3.3-4.9-3.3-8S9.8 6.2 12 4z"],
+    emoji: "\u{1F310}"
+  }
+};
+var FLOW_ICON_NAMES = Object.keys(FLOW_ICONS);
+var iconOf = (icon) => {
+  if (!icon) return void 0;
+  if (icon.kind === "builtin") return icon.name && FLOW_ICONS[icon.name] ? icon : void 0;
+  if (icon.kind === "emoji") return icon.value && icon.value.trim() && [...icon.value.trim()].length <= 8 ? icon : void 0;
+  if (icon.kind === "image") return icon.url && /^https?:\/\//i.test(icon.url) ? icon : void 0;
+  return void 0;
+};
+
+// src/native/flows-view.ts
 var RN = require("react-native");
+var svg = (() => {
+  try {
+    return require("react-native-svg");
+  } catch {
+    return null;
+  }
+})();
+var iconNode = (icon, size, color) => {
+  const i = iconOf(icon);
+  if (!i) return null;
+  if (i.kind === "image")
+    return RN.Image ? (0, import_react2.createElement)(RN.Image, { source: { uri: i.url }, accessibilityElementsHidden: true, style: { width: size, height: size, borderRadius: size / 4 } }) : null;
+  const Svg = svg?.Svg ?? svg?.default;
+  if (i.kind === "builtin" && Svg && svg?.Path)
+    return (0, import_react2.createElement)(
+      Svg,
+      { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" },
+      ...FLOW_ICONS[i.name].paths.map((d, k) => (0, import_react2.createElement)(svg.Path, { key: k, d }))
+    );
+  return (0, import_react2.createElement)(RN.Text, { style: { fontSize: size * 0.8, lineHeight: size, textAlign: "center", width: size } }, i.kind === "emoji" ? i.value : FLOW_ICONS[i.name].emoji);
+};
+var FINALE_COLORS = ["#f59e0b", "#10b981", "#ef4444", "#8b5cf6", "#06b6d4", "#ec4899"];
+var finaleBits = (kind, accent) => {
+  const rnd = (a, b) => a + Math.random() * (b - a);
+  const colors = [accent, accent, ...FINALE_COLORS];
+  const pick = () => colors[Math.floor(Math.random() * colors.length)];
+  if (kind === "confetti")
+    return Array.from({ length: 48 }, (_, i) => ({
+      x: i % 2 ? 12 : 82,
+      y: 92,
+      dx: (i % 2 ? 1 : -1) * rnd(40, 200),
+      mid: -rnd(380, 620),
+      dy: -rnd(120, 300),
+      size: rnd(7, 11),
+      rot: rnd(-540, 540),
+      color: pick(),
+      delay: rnd(0, 160),
+      life: rnd(1500, 2e3),
+      shape: "rect"
+    }));
+  if (kind === "fireworks")
+    return Array.from({ length: 3 }, (_, b) => {
+      const x = rnd(20, 75);
+      const y = rnd(18, 45);
+      const color = pick();
+      return Array.from({ length: 18 }, (_2, i) => {
+        const a = Math.PI * 2 * i / 18;
+        const r = rnd(70, 130);
+        return { x, y, dx: Math.cos(a) * r, mid: Math.sin(a) * r * 0.8, dy: Math.sin(a) * r + 40, size: 5, rot: 0, color, delay: b * 320, life: rnd(900, 1200), shape: "dot" };
+      });
+    }).flat();
+  return Array.from({ length: 22 }, () => ({
+    x: rnd(6, 88),
+    y: rnd(20, 80),
+    dx: 0,
+    mid: -rnd(10, 25),
+    dy: -rnd(30, 60),
+    size: rnd(16, 28),
+    rot: rnd(-40, 40),
+    color: pick(),
+    delay: rnd(0, 600),
+    life: rnd(900, 1300),
+    shape: "star"
+  }));
+};
+var Finale = ({ kind, accent }) => {
+  const A = RN.Animated;
+  const [bits] = (0, import_react2.useState)(() => finaleBits(kind, accent));
+  const [values] = (0, import_react2.useState)(() => A ? bits.map(() => new A.Value(0)) : []);
+  const [on, setOn] = (0, import_react2.useState)(!!A);
+  (0, import_react2.useEffect)(() => {
+    if (!A) return;
+    let stopped = false;
+    let run = null;
+    const go = () => {
+      if (stopped) return;
+      run = A.parallel(values.map((v, i) => A.timing(v, { toValue: 1, duration: bits[i].life, delay: bits[i].delay, useNativeDriver: true })));
+      run.start(() => !stopped && setOn(false));
+    };
+    Promise.resolve(RN.AccessibilityInfo?.isReduceMotionEnabled?.()).then((reduce) => reduce ? !stopped && setOn(false) : go()).catch(go);
+    return () => {
+      stopped = true;
+      run?.stop();
+    };
+  }, [A, bits, values]);
+  if (!on || !A) return null;
+  return (0, import_react2.createElement)(
+    RN.View,
+    { pointerEvents: "none", accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: { position: "absolute", left: 0, right: 0, top: 0, bottom: 0 } },
+    ...bits.map((b, i) => {
+      const t2 = values[i];
+      const fade = t2.interpolate({ inputRange: [0, 0.7, 1], outputRange: [1, 1, 0] });
+      const scale = b.shape === "star" ? t2.interpolate({ inputRange: [0, 0.25, 1], outputRange: [0.2, 1.15, 0.6] }) : 1;
+      return (0, import_react2.createElement)(
+        A.View,
+        {
+          key: i,
+          style: {
+            position: "absolute",
+            left: `${b.x}%`,
+            top: `${b.y}%`,
+            width: b.size,
+            height: b.shape === "rect" ? b.size * 0.45 : b.size,
+            borderRadius: b.shape === "dot" ? b.size / 2 : 2,
+            backgroundColor: b.shape === "star" ? "transparent" : b.color,
+            alignItems: "center",
+            justifyContent: "center",
+            opacity: fade,
+            transform: [
+              { translateX: t2.interpolate({ inputRange: [0, 1], outputRange: [0, b.dx] }) },
+              { translateY: t2.interpolate({ inputRange: [0, 0.5, 1], outputRange: [0, b.mid, b.dy] }) },
+              { rotate: t2.interpolate({ inputRange: [0, 1], outputRange: ["0deg", `${b.rot}deg`] }) },
+              { scale }
+            ]
+          }
+        },
+        b.shape === "star" ? (0, import_react2.createElement)(RN.Text, { style: { color: b.color, fontSize: b.size, lineHeight: b.size } }, "\u2605") : null
+      );
+    })
+  );
+};
 var LIGHT = { bg: "#ffffff", fg: "#1c1d20", muted: "#5d6068", soft: "#f4f5f7", line: "#e4e5e8" };
 var DARK = { bg: "#17181b", fg: "#f1f2f4", muted: "#a9acb3", soft: "#232428", line: "#2e2f35" };
-var months = (n) => `${n} ${n === 1 ? "month" : "months"}`;
-var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
+var MRRocketFlows = (props) => {
+  const [, setTick] = (0, import_react2.useState)(0);
+  (0, import_react2.useEffect)(() => props.flows.subscribe(() => setTick((t2) => t2 + 1)), [props.flows]);
+  const fin = props.flows.finale?.() ?? null;
+  const accent = props.appearance?.accent ?? props.flows.accent?.() ?? "#3f76ff";
+  return (0, import_react2.createElement)(import_react2.Fragment, null, (0, import_react2.createElement)(FlowsBody, props), fin ? (0, import_react2.createElement)(Finale, { key: fin.key, kind: fin.kind, accent }) : null);
+};
+var FlowsBody = ({ flows, paywall, appearance = {} }) => {
   const scheme = RN.useColorScheme?.();
   const dark = appearance.theme === "dark" || (appearance.theme ?? "auto") === "auto" && scheme === "dark";
-  const p = { ...dark ? DARK : LIGHT, accent: appearance.accent ?? "#3f76ff", danger: "#d92d20" };
-  const [, setTick] = (0, import_react.useState)(0);
-  (0, import_react.useEffect)(() => flows.subscribe(() => setTick((t) => t + 1)), [flows]);
-  (0, import_react.useEffect)(() => paywall?.subscribe(() => setTick((t) => t + 1)), [paywall]);
+  const p = { ...dark ? DARK : LIGHT, accent: appearance.accent ?? flows.accent?.() ?? "#3f76ff", danger: "#d92d20" };
+  const [, setTick] = (0, import_react2.useState)(0);
+  (0, import_react2.useEffect)(() => flows.subscribe(() => setTick((t2) => t2 + 1)), [flows]);
+  (0, import_react2.useEffect)(() => paywall?.subscribe(() => setTick((t2) => t2 + 1)), [paywall]);
   const pw = paywall?.view() ?? null;
   const v = flows.view();
-  const [comment, setComment] = (0, import_react.useState)("");
+  const [comment, setComment] = (0, import_react2.useState)("");
   const screen = v?.type === "cancel" ? v.screen : null;
-  (0, import_react.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     if (!screen) setComment("");
   }, [screen]);
   if (!v && !pw) return null;
-  const text2 = (children, style = {}) => (0, import_react.createElement)(RN.Text, { style: { color: p.fg, fontSize: 15, ...style } }, children);
+  const text2 = (children, style = {}) => (0, import_react2.createElement)(RN.Text, { style: { color: p.fg, fontSize: 15, ...style } }, children);
   const muted = (children, style = {}) => text2(children, { color: p.muted, fontSize: 13, ...style });
-  const title = (children) => (0, import_react.createElement)(RN.Text, { accessibilityRole: "header", style: { color: p.fg, fontSize: 18, fontWeight: "700" } }, children);
-  const btn = (label, kind, onPress, disabled = false) => (0, import_react.createElement)(
+  const title = (children) => (0, import_react2.createElement)(RN.Text, { accessibilityRole: "header", style: { color: p.fg, fontSize: 18, fontWeight: "700" } }, children);
+  const btn = (label, kind, onPress, disabled = false) => (0, import_react2.createElement)(
     RN.Pressable,
     {
       key: label,
@@ -2057,12 +2600,12 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
       fontWeight: kind === "quiet" ? "500" : "600"
     })
   );
-  const close = (label, onPress) => (0, import_react.createElement)(
+  const close = (label, onPress) => (0, import_react2.createElement)(
     RN.Pressable,
     { onPress, accessibilityRole: "button", accessibilityLabel: label, hitSlop: 12, style: { marginLeft: "auto", padding: 4 } },
     text2("\xD7", { fontSize: 22, color: p.muted })
   );
-  const card = (children, style = {}) => (0, import_react.createElement)(
+  const card = (children, style = {}) => (0, import_react2.createElement)(
     RN.View,
     {
       style: {
@@ -2079,16 +2622,16 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
     },
     ...children
   );
-  const sheet = (children, onClose) => (0, import_react.createElement)(
+  const sheet = (children, onClose) => (0, import_react2.createElement)(
     RN.Modal,
     { visible: true, transparent: true, animationType: "fade", onRequestClose: onClose },
-    (0, import_react.createElement)(
+    (0, import_react2.createElement)(
       RN.View,
       { style: { flex: 1, backgroundColor: "rgba(0,0,0,0.4)", justifyContent: "flex-end" } },
       card(children, { borderBottomLeftRadius: 0, borderBottomRightRadius: 0, paddingBottom: 34 })
     )
   );
-  const input = (placeholder, value = comment, onChange = setComment) => (0, import_react.createElement)(RN.TextInput, {
+  const input = (placeholder, value = comment, onChange = setComment) => (0, import_react2.createElement)(RN.TextInput, {
     value,
     onChangeText: onChange,
     placeholder,
@@ -2103,19 +2646,19 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
     const host = paywall;
     return sheet(
       [
-        (0, import_react.createElement)(
+        (0, import_react2.createElement)(
           RN.View,
           { key: "top", style: { flexDirection: "row", alignItems: "center", gap: 4 } },
           ...w.total > 1 ? Array.from(
             { length: w.total },
-            (_, i) => (0, import_react.createElement)(RN.View, { key: i, style: { width: 16, height: 4, borderRadius: 4, backgroundColor: i <= w.index ? p.accent : p.line } })
+            (_, i) => (0, import_react2.createElement)(RN.View, { key: i, style: { width: 16, height: 4, borderRadius: 4, backgroundColor: i <= w.index ? p.accent : p.line } })
           ) : [],
-          close("Close", host.close)
+          close(t("Close"), host.close)
         ),
         title(pg.title),
         pg.body ? muted(pg.body, { fontSize: 15 }) : null,
         ...pg.kind === "benefits" ? (pg.items ?? []).map(
-          (item, i) => (0, import_react.createElement)(
+          (item, i) => (0, import_react2.createElement)(
             RN.View,
             { key: `b${i}`, style: { flexDirection: "row", gap: 10, alignItems: "flex-start" } },
             text2("\u2713", { color: p.accent, fontWeight: "700" }),
@@ -2123,13 +2666,13 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
           )
         ) : [],
         ...pg.kind === "proof" ? (pg.quotes ?? []).map(
-          (q, i) => (0, import_react.createElement)(RN.View, { key: `q${i}`, style: { backgroundColor: p.soft, borderRadius: 12, padding: 12, gap: 6 } }, text2(q.text), q.by ? muted(q.by) : null)
+          (q, i) => (0, import_react2.createElement)(RN.View, { key: `q${i}`, style: { backgroundColor: p.soft, borderRadius: 12, padding: 12, gap: 6 } }, text2(q.text), q.by ? muted(q.by) : null)
         ) : [],
-        pg.kind === "plans" ? (0, import_react.createElement)(
+        pg.kind === "plans" ? (0, import_react2.createElement)(
           RN.View,
           { key: "plans", accessibilityRole: "radiogroup", style: { gap: 6 } },
           ...w.plans.map(
-            (plan) => (0, import_react.createElement)(
+            (plan) => (0, import_react2.createElement)(
               RN.Pressable,
               {
                 key: plan.id,
@@ -2149,14 +2692,14 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
                   gap: 10
                 }
               },
-              (0, import_react.createElement)(RN.View, { style: { flex: 1 } }, text2(plan.name, { fontWeight: "600" }), plan.note ? muted(plan.note) : null),
+              (0, import_react2.createElement)(RN.View, { style: { flex: 1 } }, text2(plan.name, { fontWeight: "600" }), plan.note ? muted(plan.note) : null),
               text2(plan.price, { fontWeight: "700" })
             )
           )
         ) : null,
         w.error ? text2(w.error, { color: p.danger, fontSize: 13 }) : null,
-        btn(w.busy ? "One moment\u2026" : pg.button || "Continue", "primary", host.next, w.busy || pg.kind === "plans" && !w.plan),
-        w.index ? btn("Back", "quiet", host.back, w.busy) : null
+        btn(w.busy ? t("One moment\u2026") : pg.button || t("Continue"), "primary", host.next, w.busy || pg.kind === "plans" && !w.plan),
+        w.index ? btn(t("Back"), "quiet", host.back, w.busy) : null
       ],
       host.close
     );
@@ -2164,22 +2707,22 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
   if (pw) return paywallSheet(pw);
   if (!v) return null;
   if (v.type === "cancel") {
-    const top = (0, import_react.createElement)(
+    const top = (0, import_react2.createElement)(
       RN.View,
       { style: { flexDirection: "row", alignItems: "center", gap: 4 } },
       ...v.steps > 1 ? Array.from(
         { length: v.steps },
-        (_, i) => (0, import_react.createElement)(RN.View, { key: i, style: { width: 16, height: 4, borderRadius: 4, backgroundColor: i < v.step ? p.accent : p.line } })
+        (_, i) => (0, import_react2.createElement)(RN.View, { key: i, style: { width: 16, height: 4, borderRadius: 4, backgroundColor: i < v.step ? p.accent : p.line } })
       ) : [],
-      close("Close", flows.cancel.close)
+      close(t("Close"), flows.cancel.close)
     );
     const error = v.error ? text2(v.error, { color: p.danger, fontSize: 13 }) : null;
     let body = [];
-    const choices = (items) => (0, import_react.createElement)(
+    const choices = (items) => (0, import_react2.createElement)(
       RN.ScrollView,
       { style: { maxHeight: 320 }, contentContainerStyle: { gap: 6 }, accessibilityRole: "radiogroup" },
       ...items.map(
-        (c) => (0, import_react.createElement)(
+        (c) => (0, import_react2.createElement)(
           RN.Pressable,
           {
             key: c.key,
@@ -2202,48 +2745,48 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
     );
     if (v.screen === "survey")
       body = [
-        title(v.flow.question || "Why are you leaving?"),
+        title(v.flow.question || t("Why are you leaving?")),
         choices(v.flow.reasons.map((r) => ({ key: r.id, label: r.label, on: v.reason === r.id, press: () => flows.cancel.pick(r.id) }))),
-        btn("Continue", "primary", flows.cancel.next, !v.reason),
-        btn("Never mind, keep my plan", "quiet", flows.cancel.close)
+        btn(t("Continue"), "primary", flows.cancel.next, !v.reason),
+        btn(t("Never mind, keep my plan"), "quiet", flows.cancel.close)
       ];
     else if (v.screen === "followup" && v.followUp) {
       const f = v.followUp;
       const label = v.flow.reasons.find((r) => r.id === v.reason)?.label;
       body = [
-        label ? muted(`You said: ${label}`) : null,
+        label ? muted(tf("You said: {label}", { label })) : null,
         title(f.question),
-        f.answers.length ? choices(f.answers.map((a, i) => ({ key: String(i), label: a, on: v.answer === a, press: () => flows.cancel.answer(a) }))) : input("Your answer (optional)", v.answer ?? "", flows.cancel.answer),
-        btn("Continue", "primary", flows.cancel.next),
-        btn("Never mind, keep my plan", "quiet", flows.cancel.close)
+        f.answers.length ? choices(f.answers.map((a, i) => ({ key: String(i), label: f.answerLabels?.[i] || a, on: v.answer === a, press: () => flows.cancel.answer(a) }))) : input(t("Your answer (optional)"), v.answer ?? "", flows.cancel.answer),
+        btn(t("Continue"), "primary", flows.cancel.next),
+        btn(t("Never mind, keep my plan"), "quiet", flows.cancel.close)
       ];
     } else if (v.screen === "offer" && v.offer) {
       const o = v.offer;
       const label = v.flow.reasons.find((r) => r.id === v.reason)?.label;
-      const detail = o.kind === "discount" && o.percent ? v.price ? `${money(discounted(v.price.amount, o.percent), v.price.currency)} instead of ${money(v.price.amount, v.price.currency)}${o.months ? ` for ${months(o.months)}` : ""}` : `${o.percent}% off${o.months ? ` for ${months(o.months)}` : ""}` : o.kind === "pause" && o.months ? `Pause for up to ${months(o.months)}. Your data stays.` : o.kind === "downgrade" && o.planName ? o.planName : null;
+      const detail = o.kind === "discount" && o.percent ? v.price ? `${tf("{price} instead of {old}", { price: money(discounted(v.price.amount, o.percent), v.price.currency), old: money(v.price.amount, v.price.currency) })}${o.months ? ` ${forMonths(o.months)}` : ""}` : `${tf("{percent}% off", { percent: o.percent })}${o.months ? ` ${forMonths(o.months)}` : ""}` : o.kind === "pause" && o.months ? tf("Pause for up to {months}. Your data stays.", { months: monthsWord(o.months) }) : o.kind === "downgrade" && o.planName ? o.planName : null;
       body = [
-        label ? muted(`You said: ${label}`) : null,
+        label ? muted(tf("You said: {label}", { label })) : null,
         title(o.headline),
-        detail ? (0, import_react.createElement)(RN.View, { style: { backgroundColor: p.soft, borderRadius: 10, padding: 12 } }, text2(detail, { fontWeight: "600" })) : null,
-        o.kind === "contact" ? input("What would make you stay?") : null,
-        btn(v.busy ? "One moment\u2026" : offerButton(o), "primary", () => flows.cancel.accept(comment), v.busy),
-        btn("No thanks, continue cancelling", "quiet", flows.cancel.decline, v.busy)
+        detail ? (0, import_react2.createElement)(RN.View, { style: { backgroundColor: p.soft, borderRadius: 10, padding: 12 } }, text2(detail, { fontWeight: "600" })) : null,
+        o.kind === "contact" ? input(t("What would make you stay?")) : null,
+        btn(v.busy ? t("One moment\u2026") : offerButton(o), "primary", () => flows.cancel.accept(comment), v.busy),
+        btn(t("No thanks, continue cancelling"), "quiet", flows.cancel.decline, v.busy)
       ];
     } else
       body = [
         title(v.flow.confirm.title),
         v.flow.confirm.body ? muted(v.flow.confirm.body, { fontSize: 15 }) : null,
-        v.steps > 1 ? input("Anything else we should know? (optional)") : null,
-        btn(v.busy ? "One moment\u2026" : v.flow.confirm.button, "danger", () => flows.cancel.confirm(comment), v.busy),
-        btn("Keep my plan", "secondary", flows.cancel.close, v.busy)
+        v.steps > 1 ? input(t("Anything else we should know? (optional)")) : null,
+        btn(v.busy ? t("One moment\u2026") : v.flow.confirm.button, "danger", () => flows.cancel.confirm(comment), v.busy),
+        btn(t("Keep my plan"), "secondary", flows.cancel.close, v.busy)
       ];
     return sheet([top, ...body, error], flows.cancel.close);
   }
-  const media = (s) => {
-    const m2 = mediaOf(s);
+  const media = (s2) => {
+    const m2 = mediaOf(s2);
     if (!m2) return null;
     if (m2.kind === "image")
-      return RN.Image ? (0, import_react.createElement)(RN.Image, {
+      return RN.Image ? (0, import_react2.createElement)(RN.Image, {
         key: "media",
         source: { uri: m2.url },
         accessibilityLabel: m2.alt,
@@ -2252,51 +2795,148 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
       }) : null;
     const v2 = videoEmbed(m2.url);
     const open = v2?.kind === "file" ? v2.src : m2.url;
-    return RN.Linking ? btn("\u25B6 Watch the video", "secondary", () => void RN.Linking?.openURL(open).catch(() => {
+    return RN.Linking ? btn(`\u25B6 ${t("Watch the video")}`, "secondary", () => void RN.Linking?.openURL(open).catch(() => {
     })) : null;
   };
+  if (v.type === "step" && v.step.kind === "question") {
+    const s2 = v.step;
+    const q = s2.question;
+    const ok = answerOk(q, v.answer);
+    return sheet(
+      [
+        (0, import_react2.createElement)(
+          RN.View,
+          { key: "top", style: { flexDirection: "row", alignItems: "center", gap: 4 } },
+          ...v.total > 1 ? Array.from(
+            { length: v.total },
+            (_, i) => (0, import_react2.createElement)(RN.View, { key: i, style: { width: 16, height: 4, borderRadius: 4, backgroundColor: i <= v.index ? p.accent : p.line } })
+          ) : [],
+          close(t("Close"), flows.onboarding.dismiss)
+        ),
+        v.index === 0 && v.flow.icon ? (0, import_react2.createElement)(RN.View, { key: "icon" }, iconNode(v.flow.icon, 36, p.accent)) : null,
+        title(s2.title),
+        s2.body ? muted(s2.body, { fontSize: 15 }) : null,
+        q?.type === "choice" ? (0, import_react2.createElement)(
+          RN.ScrollView,
+          { key: "opts", style: { maxHeight: 320 }, contentContainerStyle: { gap: 6 }, accessibilityRole: "radiogroup" },
+          ...[...q.options ?? [], ...q.other ? [{ id: OTHER_PREFIX, label: q.otherLabel || t("Other") }] : []].map((o) => {
+            const isOther = o.id === OTHER_PREFIX;
+            const on = isOther ? !!v.answer?.startsWith(OTHER_PREFIX) : v.answer === o.id;
+            return (0, import_react2.createElement)(
+              RN.Pressable,
+              {
+                key: o.id,
+                onPress: () => isOther && on ? void 0 : flows.onboarding.answer(o.id),
+                accessibilityRole: "radio",
+                accessibilityState: { checked: on },
+                style: {
+                  minHeight: 44,
+                  paddingHorizontal: 12,
+                  borderRadius: 10,
+                  borderWidth: 1,
+                  borderColor: on ? p.accent : p.line,
+                  backgroundColor: on ? p.soft : p.bg,
+                  justifyContent: "center"
+                }
+              },
+              text2(o.label, { fontWeight: "500" })
+            );
+          }),
+          q.other && v.answer?.startsWith(OTHER_PREFIX) ? (0, import_react2.createElement)(RN.TextInput, {
+            key: "other",
+            value: v.answer.slice(OTHER_PREFIX.length),
+            onChangeText: (t2) => flows.onboarding.answer(OTHER_PREFIX + t2),
+            onSubmitEditing: flows.onboarding.next,
+            placeholder: t("Your answer"),
+            placeholderTextColor: p.muted,
+            maxLength: 490,
+            accessibilityLabel: q.otherLabel || t("Other"),
+            style: { height: 44, borderWidth: 1, borderColor: p.line, borderRadius: 10, paddingHorizontal: 12, color: p.fg }
+          }) : null
+        ) : q?.type === "scale" ? (0, import_react2.createElement)(
+          RN.View,
+          { key: "scale", style: { gap: 6 } },
+          (0, import_react2.createElement)(
+            RN.View,
+            { style: { flexDirection: "row", gap: 4 }, accessibilityRole: "radiogroup" },
+            ...scaleOf(q).map((n) => {
+              const on = v.answer === String(n);
+              return (0, import_react2.createElement)(
+                RN.Pressable,
+                {
+                  key: n,
+                  onPress: () => flows.onboarding.answer(String(n)),
+                  accessibilityRole: "radio",
+                  accessibilityState: { checked: on },
+                  style: { flex: 1, height: 44, borderRadius: 8, borderWidth: 1, borderColor: on ? p.accent : p.line, backgroundColor: on ? p.accent : p.bg, alignItems: "center", justifyContent: "center" }
+                },
+                text2(String(n), { fontWeight: "500", color: on ? "#fff" : p.fg })
+              );
+            })
+          ),
+          q.lowLabel || q.highLabel ? (0, import_react2.createElement)(RN.View, { style: { flexDirection: "row", justifyContent: "space-between" } }, muted(q.lowLabel || ""), muted(q.highLabel || "")) : null
+        ) : q ? (0, import_react2.createElement)(RN.TextInput, {
+          key: "answer",
+          value: v.answer ?? "",
+          onChangeText: (t2) => flows.onboarding.answer(t2),
+          onSubmitEditing: flows.onboarding.next,
+          placeholder: q.placeholder || t("Your answer"),
+          placeholderTextColor: p.muted,
+          maxLength: 500,
+          accessibilityLabel: s2.title,
+          style: { height: 44, borderWidth: 1, borderColor: p.line, borderRadius: 10, paddingHorizontal: 12, color: p.fg }
+        }) : null,
+        btn(s2.button || (v.last ? t("Done") : t("Continue")), "primary", flows.onboarding.next, !ok),
+        q?.optional ? btn(q.skipLabel || t("Skip"), "quiet", flows.onboarding.skip) : null,
+        v.back ? btn(t("Back"), "quiet", flows.onboarding.back) : null
+      ],
+      flows.onboarding.dismiss
+    );
+  }
   if (v.type === "step")
     return sheet(
       [
-        (0, import_react.createElement)(
+        (0, import_react2.createElement)(
           RN.View,
           { style: { flexDirection: "row", alignItems: "center" } },
-          v.total > 1 ? muted(`Step ${v.index + 1} of ${v.total}`) : null,
-          close("Close the tour", flows.onboarding.dismiss)
+          v.total > 1 ? muted(tf("Step {n} of {total}", { n: v.index + 1, total: v.total })) : null,
+          close(t("Close the tour"), flows.onboarding.dismiss)
         ),
+        v.step.kind === "modal" && v.flow.icon ? (0, import_react2.createElement)(RN.View, { key: "icon" }, iconNode(v.flow.icon, 36, p.accent)) : null,
         media(v.step),
         title(v.step.title),
         v.step.body ? muted(v.step.body, { fontSize: 15 }) : null,
-        btn(v.step.button || (v.last ? "Done" : "Next"), "primary", flows.onboarding.next)
+        btn(v.step.button || (v.last ? t("Done") : t("Next")), "primary", flows.onboarding.next)
       ],
       flows.onboarding.dismiss
     );
   if (v.type === "checklist") {
     const done = v.items.filter((i) => i.done).length;
-    return (0, import_react.createElement)(
+    return (0, import_react2.createElement)(
       RN.View,
       { pointerEvents: "box-none", style: { position: "absolute", left: 12, right: 12, bottom: 28 } },
       card([
-        (0, import_react.createElement)(
+        (0, import_react2.createElement)(
           RN.View,
           { key: "t", style: { flexDirection: "row", alignItems: "center" } },
           title(v.flow.name),
-          close("Hide the checklist", flows.onboarding.dismiss)
+          close(t("Hide the checklist"), flows.onboarding.dismiss)
         ),
-        muted(`${done} of ${v.items.length} done`),
+        muted(tf("{done} of {total} done", { done, total: v.items.length })),
         ...v.items.map(
-          ({ step, done: d, tour }) => (0, import_react.createElement)(
+          ({ step, done: d, opens }) => (0, import_react2.createElement)(
             RN.Pressable,
             {
               key: step.id,
-              // 0.17.0: an item that starts a tour opens it; finishing the tour ticks it.
-              disabled: d || !!step.event && !tour,
-              onPress: () => tour ? flows.onboarding.startTour(step.id) : flows.onboarding.check(step.id),
-              accessibilityRole: tour && !d ? "button" : "checkbox",
+              // 0.17.0/0.18.0: a task that opens something (a tour, a modal, a screen, the app's code) does it;
+              // a finished tour or modal ticks it, a screen or the app's code once opened (unless an event does).
+              disabled: d || !!step.event && !opens,
+              onPress: () => opens ? flows.onboarding.open(step.id) : flows.onboarding.check(step.id),
+              accessibilityRole: opens && !d ? "button" : "checkbox",
               accessibilityState: { checked: d },
               style: { flexDirection: "row", gap: 10, alignItems: "flex-start", paddingVertical: 6 }
             },
-            (0, import_react.createElement)(
+            (0, import_react2.createElement)(
               RN.View,
               {
                 style: {
@@ -2312,7 +2952,8 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
               },
               d ? text2("\u2713", { color: "#fff", fontSize: 12 }) : null
             ),
-            (0, import_react.createElement)(
+            step.icon ? iconNode(step.icon, 20, p.accent) : null,
+            (0, import_react2.createElement)(
               RN.View,
               { style: { flex: 1 } },
               text2(step.title, { fontWeight: "600", color: d ? p.muted : p.fg, textDecorationLine: d ? "line-through" : "none" }),
@@ -2325,22 +2966,22 @@ var MRRocketFlows = ({ flows, paywall, appearance = {} }) => {
   }
   const m = v.message;
   if (m.style === "banner")
-    return (0, import_react.createElement)(
+    return (0, import_react2.createElement)(
       RN.View,
       { pointerEvents: "box-none", style: { position: "absolute", left: 12, right: 12, top: 56 } },
       card([
-        (0, import_react.createElement)(
+        (0, import_react2.createElement)(
           RN.View,
           { key: "t", style: { flexDirection: "row", alignItems: "center", gap: 8 } },
-          (0, import_react.createElement)(RN.View, { style: { flex: 1 } }, text2(m.title, { fontWeight: "700" }), m.body ? muted(m.body) : null),
-          close("Dismiss", flows.message.dismiss)
+          (0, import_react2.createElement)(RN.View, { style: { flex: 1 } }, text2(m.title, { fontWeight: "700" }), m.body ? muted(m.body) : null),
+          close(t("Dismiss"), flows.message.dismiss)
         ),
         m.button ? btn(m.button, "primary", flows.message.click) : null
       ])
     );
   return sheet(
     [
-      (0, import_react.createElement)(RN.View, { key: "t", style: { flexDirection: "row" } }, close("Dismiss", flows.message.dismiss)),
+      (0, import_react2.createElement)(RN.View, { key: "t", style: { flexDirection: "row" } }, close(t("Dismiss"), flows.message.dismiss)),
       title(m.title),
       m.body ? muted(m.body, { fontSize: 15 }) : null,
       m.button ? btn(m.button, "primary", flows.message.click) : null
@@ -2414,10 +3055,10 @@ var expoPush = () => {
     },
     token: async (projectId) => {
       if (RN2.Platform.OS === "android" && n.setNotificationChannelAsync)
-        await n.setNotificationChannelAsync("default", { name: "Default", importance: n.AndroidImportance?.HIGH ?? 4 });
+        await n.setNotificationChannelAsync("default", { name: t("Default"), importance: n.AndroidImportance?.HIGH ?? 4 });
       const id = projectId ?? constants.expoConfig?.extra?.eas?.projectId ?? constants.easConfig?.projectId;
-      const t = await n.getExpoPushTokenAsync(id ? { projectId: id } : void 0);
-      return typeof t?.data === "string" && t.data ? t.data : null;
+      const push = await n.getExpoPushTokenAsync(id ? { projectId: id } : void 0);
+      return typeof push?.data === "string" && push.data ? push.data : null;
     },
     onOpen: (listener) => {
       const sub = n.addNotificationResponseReceivedListener((r) => listener(dataOf(r) ?? {}));
@@ -2428,8 +3069,8 @@ var expoPush = () => {
 };
 var asyncStorage = () => {
   const m = asyncStorageModule;
-  const s = m?.default ?? m;
-  return s && typeof s.getItem === "function" && typeof s.setItem === "function" && typeof s.removeItem === "function" ? s : null;
+  const s2 = m?.default ?? m;
+  return s2 && typeof s2.getItem === "function" && typeof s2.setItem === "function" && typeof s2.removeItem === "function" ? s2 : null;
 };
 var DEVICE_TYPES = { 1: "phone", 2: "tablet", 3: "desktop", 4: "tv" };
 var text = (v, max = 80) => typeof v === "string" && v.trim() ? v.trim().slice(0, max) : typeof v === "number" ? String(v) : void 0;
@@ -2473,10 +3114,10 @@ var recorderDeps = () => {
   }
   return {
     capture: async (width) => {
-      const s = RN2.Dimensions.get("screen");
-      if (!s?.width) return null;
+      const s2 = RN2.Dimensions.get("screen");
+      if (!s2?.width) return null;
       const w = Math.round(width);
-      const h3 = Math.round(s.height / s.width * width);
+      const h3 = Math.round(s2.height / s2.width * width);
       const img = await capture({ format: "jpg", quality: 0.5, result: "base64", width: w, height: h3 });
       return img ? { img: img.replace(/^data:image\/\w+;base64,/, ""), w, h: h3 } : null;
     },
@@ -2503,8 +3144,8 @@ var nativeDeps = (overrides = {}) => ({
   context: readContext,
   appId: text(expoApplication?.applicationId, 150),
   screen: () => {
-    const s = RN2.Dimensions.get("screen");
-    return s ? { w: s.width, h: s.height } : void 0;
+    const s2 = RN2.Dimensions.get("screen");
+    return s2 ? { w: s2.width, h: s2.height } : void 0;
   },
   initialUrl: () => RN2.Linking.getInitialURL(),
   openUrl: (url) => void RN2.Linking.openURL(url).catch(() => void 0),
@@ -2523,7 +3164,7 @@ var optionalModules = () => ({
 });
 
 // src/native/widgets-view.ts
-var import_react2 = require("react");
+var import_react3 = require("react");
 var RN3 = require("react-native");
 var usePalette = (appearance = {}) => {
   const scheme = RN3.useColorScheme?.();
@@ -2531,10 +3172,10 @@ var usePalette = (appearance = {}) => {
   return { ...dark ? DARK : LIGHT, accent: appearance.accent ?? "#3f76ff", danger: "#d92d20" };
 };
 var kit = (p) => {
-  const text2 = (children, style = {}) => (0, import_react2.createElement)(RN3.Text, { style: { color: p.fg, fontSize: 15, ...style } }, children);
+  const text2 = (children, style = {}) => (0, import_react3.createElement)(RN3.Text, { style: { color: p.fg, fontSize: 15, ...style } }, children);
   const muted = (children, style = {}) => text2(children, { color: p.muted, fontSize: 13, ...style });
-  const title = (children) => (0, import_react2.createElement)(RN3.Text, { accessibilityRole: "header", style: { color: p.fg, fontSize: 17, fontWeight: "700", flex: 1 } }, children);
-  const btn = (label, kind, onPress, disabled = false, style = {}) => (0, import_react2.createElement)(
+  const title = (children) => (0, import_react3.createElement)(RN3.Text, { accessibilityRole: "header", style: { color: p.fg, fontSize: 17, fontWeight: "700", flex: 1 } }, children);
+  const btn = (label, kind, onPress, disabled = false, style = {}) => (0, import_react3.createElement)(
     RN3.Pressable,
     {
       key: label,
@@ -2557,8 +3198,8 @@ var kit = (p) => {
     },
     text2(label, { color: kind === "primary" ? "#ffffff" : p.fg, fontWeight: "600" })
   );
-  const closeX = (label, onPress) => (0, import_react2.createElement)(RN3.Pressable, { onPress, accessibilityRole: "button", accessibilityLabel: label, hitSlop: 12, style: { padding: 4 } }, text2("\xD7", { fontSize: 24, color: p.muted }));
-  const field = (o) => (0, import_react2.createElement)(RN3.TextInput, {
+  const closeX = (label, onPress) => (0, import_react3.createElement)(RN3.Pressable, { onPress, accessibilityRole: "button", accessibilityLabel: label, hitSlop: 12, style: { padding: 4 } }, text2("\xD7", { fontSize: 24, color: p.muted }));
+  const field = (o) => (0, import_react3.createElement)(RN3.TextInput, {
     value: o.value,
     onChangeText: o.onChange,
     placeholder: o.placeholder,
@@ -2581,7 +3222,7 @@ var kit = (p) => {
       ...o.style
     }
   });
-  const chip = (label, on, onPress, key = label) => (0, import_react2.createElement)(
+  const chip = (label, on, onPress, key = label) => (0, import_react3.createElement)(
     RN3.Pressable,
     {
       key,
@@ -2592,17 +3233,17 @@ var kit = (p) => {
     },
     text2(label, { fontSize: 13, fontWeight: "600", color: on ? p.accent : p.fg })
   );
-  const page = (heading, onClose, children) => (0, import_react2.createElement)(
+  const page = (heading, onClose, children) => (0, import_react3.createElement)(
     RN3.Modal,
     { visible: true, animationType: "slide", presentationStyle: "pageSheet", onRequestClose: onClose },
-    (0, import_react2.createElement)(
+    (0, import_react3.createElement)(
       RN3.KeyboardAvoidingView,
       { behavior: RN3.Platform.OS === "ios" ? "padding" : void 0, style: { flex: 1, backgroundColor: p.bg } },
-      (0, import_react2.createElement)(
+      (0, import_react3.createElement)(
         RN3.View,
         { style: { flexDirection: "row", alignItems: "center", paddingHorizontal: 16, paddingTop: 16, paddingBottom: 12, borderBottomWidth: 1, borderBottomColor: p.line } },
         title(heading),
-        closeX("Close", onClose)
+        closeX(t("Close"), onClose)
       ),
       ...children
     )
@@ -2610,13 +3251,13 @@ var kit = (p) => {
   return { text: text2, muted, title, btn, closeX, field, chip, page };
 };
 var timeAgo = (iso) => {
-  const t = new Date(iso).getTime();
-  if (Number.isNaN(t)) return "";
-  const d = Math.max(0, Date.now() - t) / 1e3;
-  if (d < 60) return "just now";
-  if (d < 3600) return `${Math.floor(d / 60)}m ago`;
-  if (d < 86400) return `${Math.floor(d / 3600)}h ago`;
-  return `${Math.floor(d / 86400)}d ago`;
+  const at = new Date(iso).getTime();
+  if (Number.isNaN(at)) return "";
+  const d = Math.max(0, Date.now() - at) / 1e3;
+  if (d < 60) return t("just now");
+  if (d < 3600) return tf("{n}m ago", { n: Math.floor(d / 60) });
+  if (d < 86400) return tf("{n}h ago", { n: Math.floor(d / 3600) });
+  return tf("{n}d ago", { n: Math.floor(d / 86400) });
 };
 var opener = () => {
   let open = false;
@@ -2626,8 +3267,8 @@ var opener = () => {
     listeners.forEach((l) => l(v));
   };
   const useOpen = () => {
-    const [v, setV] = (0, import_react2.useState)(open);
-    (0, import_react2.useEffect)(() => {
+    const [v, setV] = (0, import_react3.useState)(open);
+    (0, import_react3.useEffect)(() => {
       listeners.add(setV);
       setV(open);
       return () => {
@@ -2641,22 +3282,22 @@ var opener = () => {
 var isAnswered = (a) => Array.isArray(a) ? a.length > 0 : typeof a === "number" ? true : !!a?.trim();
 var SurveySheet = ({ survey, api, p, onDone }) => {
   const k = kit(p);
-  const [step, setStep] = (0, import_react2.useState)(0);
-  const [answers, setAnswers] = (0, import_react2.useState)({});
-  const [done, setDone] = (0, import_react2.useState)(false);
-  const [error, setError] = (0, import_react2.useState)("");
-  const started = (0, import_react2.useRef)(Date.now());
-  const finished = (0, import_react2.useRef)(false);
+  const [step, setStep] = (0, import_react3.useState)(0);
+  const [answers, setAnswers] = (0, import_react3.useState)({});
+  const [done, setDone] = (0, import_react3.useState)(false);
+  const [error, setError] = (0, import_react3.useState)("");
+  const started = (0, import_react3.useRef)(Date.now());
+  const finished = (0, import_react3.useRef)(false);
   const q = survey.questions[step];
   const last = step === survey.questions.length - 1;
   const value = answers[q.key];
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     api.seen(survey.id).catch(() => void 0);
   }, [api, survey.id]);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     if (!done) return;
-    const t = setTimeout(onDone, 2500);
-    return () => clearTimeout(t);
+    const t2 = setTimeout(onDone, 2500);
+    return () => clearTimeout(t2);
   }, [done, onDone]);
   const finish = (completed, all = answers) => {
     if (finished.current) return;
@@ -2668,7 +3309,7 @@ var SurveySheet = ({ survey, api, p, onDone }) => {
     onDone();
   };
   const next = () => {
-    if (q.required && !isAnswered(value)) return setError("Please answer this question.");
+    if (q.required && !isAnswered(value)) return setError(t("Please answer this question."));
     setError("");
     if (!last) return setStep(step + 1);
     finish(true);
@@ -2682,40 +3323,40 @@ var SurveySheet = ({ survey, api, p, onDone }) => {
   if (q.kind === "nps" || q.kind === "rating") {
     const scale = q.kind === "nps" ? 11 : Math.min(Math.max(q.scale ?? 5, 2), 10);
     const start = q.kind === "nps" ? 0 : 1;
-    input = (0, import_react2.createElement)(
+    input = (0, import_react3.createElement)(
       RN3.View,
       { style: { gap: 6 } },
-      (0, import_react2.createElement)(
+      (0, import_react3.createElement)(
         RN3.View,
         { style: { flexDirection: "row", flexWrap: "wrap", gap: 6 }, accessibilityRole: "radiogroup", accessibilityLabel: q.title },
         ...Array.from({ length: scale }, (_, i) => {
           const n = i + start;
           const on = value === n;
-          return (0, import_react2.createElement)(
+          return (0, import_react3.createElement)(
             RN3.Pressable,
             {
               key: n,
               onPress: () => pick(n),
               accessibilityRole: "radio",
               accessibilityState: { checked: on },
-              accessibilityLabel: `${n} of ${scale - 1 + start}`,
+              accessibilityLabel: tf("{n} of {total}", { n, total: scale - 1 + start }),
               style: { width: 40, height: 40, borderRadius: 8, alignItems: "center", justifyContent: "center", borderWidth: 1, borderColor: on ? p.accent : p.line, backgroundColor: on ? p.accent : p.bg }
             },
             k.text(String(n), { color: on ? "#ffffff" : p.fg, fontWeight: "600" })
           );
         })
       ),
-      q.low || q.high || q.kind === "nps" ? (0, import_react2.createElement)(RN3.View, { style: { flexDirection: "row", justifyContent: "space-between" } }, k.muted(q.low ?? (q.kind === "nps" ? "Not likely" : "")), k.muted(q.high ?? (q.kind === "nps" ? "Very likely" : ""))) : null
+      q.low || q.high || q.kind === "nps" ? (0, import_react3.createElement)(RN3.View, { style: { flexDirection: "row", justifyContent: "space-between" } }, k.muted(q.low ?? (q.kind === "nps" ? t("Not likely") : "")), k.muted(q.high ?? (q.kind === "nps" ? t("Very likely") : ""))) : null
     );
   } else if (q.kind === "single" || q.kind === "multi") {
     const multi = q.kind === "multi";
     const picked = multi ? value ?? [] : [];
-    input = (0, import_react2.createElement)(
+    input = (0, import_react3.createElement)(
       RN3.View,
       { style: { gap: 6 } },
-      ...(q.options ?? []).map((o) => {
+      ...(q.options ?? []).map((o, i) => {
         const on = multi ? picked.includes(o) : value === o;
-        return (0, import_react2.createElement)(
+        return (0, import_react3.createElement)(
           RN3.Pressable,
           {
             key: o,
@@ -2724,32 +3365,33 @@ var SurveySheet = ({ survey, api, p, onDone }) => {
             accessibilityState: { checked: on },
             style: { minHeight: 44, paddingHorizontal: 12, borderRadius: 10, justifyContent: "center", borderWidth: 1, borderColor: on ? p.accent : p.line, backgroundColor: on ? p.soft : p.bg }
           },
-          k.text(o, { fontWeight: "500" })
+          // The label in the person's language; what is recorded stays the option itself.
+          k.text(q.labels?.[i] || o, { fontWeight: "500" })
         );
       })
     );
-  } else input = k.field({ value: value ?? "", onChange: pick, placeholder: q.placeholder ?? "Type your answer", multiline: true });
-  const body = done ? [k.text(survey.thanks || "Thanks for your feedback.", { fontWeight: "600", textAlign: "center", paddingVertical: 16 })] : [
-    (0, import_react2.createElement)(
+  } else input = k.field({ value: value ?? "", onChange: pick, placeholder: q.placeholder ?? t("Type your answer"), multiline: true });
+  const body = done ? [k.text(survey.thanks || t("Thanks for your feedback."), { fontWeight: "600", textAlign: "center", paddingVertical: 16 })] : [
+    (0, import_react3.createElement)(
       RN3.View,
       { key: "top", style: { flexDirection: "row", alignItems: "center", gap: 4 } },
-      ...survey.questions.map((x, i) => (0, import_react2.createElement)(RN3.View, { key: x.key, style: { width: 16, height: 4, borderRadius: 4, backgroundColor: i <= step ? p.accent : p.line } })),
-      (0, import_react2.createElement)(RN3.View, { style: { flex: 1 } }),
-      k.closeX("Close survey", dismiss)
+      ...survey.questions.map((x, i) => (0, import_react3.createElement)(RN3.View, { key: x.key, style: { width: 16, height: 4, borderRadius: 4, backgroundColor: i <= step ? p.accent : p.line } })),
+      (0, import_react3.createElement)(RN3.View, { style: { flex: 1 } }),
+      k.closeX(t("Close survey"), dismiss)
     ),
-    (0, import_react2.createElement)(RN3.Text, { key: "q", accessibilityRole: "header", style: { color: p.fg, fontSize: 17, fontWeight: "700" } }, q.title, q.required ? "" : (0, import_react2.createElement)(RN3.Text, { style: { color: p.muted, fontSize: 13, fontWeight: "400" } }, "  optional")),
+    (0, import_react3.createElement)(RN3.Text, { key: "q", accessibilityRole: "header", style: { color: p.fg, fontSize: 17, fontWeight: "700" } }, q.title, q.required ? "" : (0, import_react3.createElement)(RN3.Text, { style: { color: p.muted, fontSize: 13, fontWeight: "400" } }, `  ${t("optional")}`)),
     q.description ? k.muted(q.description) : null,
     input,
     error ? k.text(error, { color: p.danger, fontSize: 13 }) : null,
-    k.btn(last ? "Send" : "Next", "primary", next)
+    k.btn(last ? t("Send") : t("Next"), "primary", next)
   ];
-  return (0, import_react2.createElement)(
+  return (0, import_react3.createElement)(
     RN3.Modal,
     { visible: true, transparent: true, animationType: "slide", onRequestClose: dismiss },
-    (0, import_react2.createElement)(
+    (0, import_react3.createElement)(
       RN3.KeyboardAvoidingView,
       { behavior: RN3.Platform.OS === "ios" ? "padding" : void 0, style: { flex: 1, backgroundColor: "rgba(0,0,0,0.35)", justifyContent: "flex-end" } },
-      (0, import_react2.createElement)(
+      (0, import_react3.createElement)(
         RN3.View,
         {
           accessibilityViewIsModal: true,
@@ -2763,10 +3405,10 @@ var SurveySheet = ({ survey, api, p, onDone }) => {
 };
 var MRRocketSurveys = ({ client, appearance }) => {
   const p = usePalette(appearance);
-  const [survey, setSurvey] = (0, import_react2.useState)(null);
-  const [who2, setWho] = (0, import_react2.useState)(() => client.getDistinctId());
-  (0, import_react2.useEffect)(() => client.subscribe(() => setWho(client.getDistinctId())), [client]);
-  (0, import_react2.useEffect)(() => {
+  const [survey, setSurvey] = (0, import_react3.useState)(null);
+  const [who2, setWho] = (0, import_react3.useState)(() => client.getDistinctId());
+  (0, import_react3.useEffect)(() => client.subscribe(() => setWho(client.getDistinctId())), [client]);
+  (0, import_react3.useEffect)(() => {
     let stop = false;
     const ctrl = new AbortController();
     const timer = setTimeout(() => {
@@ -2774,9 +3416,9 @@ var MRRocketSurveys = ({ client, appearance }) => {
         const api = client.api();
         if (stop || !api) return;
         api.survey("", ctrl.signal).then((r) => {
-          const s = r.survey;
-          if (stop || !s || !s.questions.length || client.isSurveyDone(s.id)) return;
-          setSurvey({ s, api });
+          const s2 = r.survey;
+          if (stop || !s2 || !s2.questions.length || client.isSurveyDone(s2.id)) return;
+          setSurvey({ s: s2, api });
         }).catch(() => void 0);
       });
     }, 3e3);
@@ -2786,35 +3428,35 @@ var MRRocketSurveys = ({ client, appearance }) => {
       ctrl.abort();
     };
   }, [client, who2]);
-  const done = (0, import_react2.useCallback)(() => {
+  const done = (0, import_react3.useCallback)(() => {
     setSurvey((cur) => {
       if (cur) client.markSurveyDone(cur.s.id);
       return null;
     });
   }, [client]);
   if (!survey) return null;
-  return (0, import_react2.createElement)(SurveySheet, { key: survey.s.id, survey: survey.s, api: survey.api, p, onDone: done });
+  return (0, import_react3.createElement)(SurveySheet, { key: survey.s.id, survey: survey.s, api: survey.api, p, onDone: done });
 };
 var feedbackOpen = opener();
 var useFeedback = () => ({ open: () => feedbackOpen.set(true), close: () => feedbackOpen.set(false) });
 var FeedbackSheet = ({ client, p, title }) => {
   const k = kit(p);
-  const [tab, setTab] = (0, import_react2.useState)("top");
-  const [posts, setPosts] = (0, import_react2.useState)(null);
-  const [boards, setBoards] = (0, import_react2.useState)([]);
-  const [error, setError] = (0, import_react2.useState)("");
-  const [board, setBoard] = (0, import_react2.useState)("feature");
-  const [subject, setSubject] = (0, import_react2.useState)("");
-  const [details, setDetails] = (0, import_react2.useState)("");
-  const [name, setName] = (0, import_react2.useState)("");
-  const [email, setEmail] = (0, import_react2.useState)("");
-  const [sending, setSending] = (0, import_react2.useState)(false);
-  const [sent, setSent] = (0, import_react2.useState)(false);
+  const [tab, setTab] = (0, import_react3.useState)("top");
+  const [posts, setPosts] = (0, import_react3.useState)(null);
+  const [boards, setBoards] = (0, import_react3.useState)([]);
+  const [error, setError] = (0, import_react3.useState)("");
+  const [board, setBoard] = (0, import_react3.useState)("feature");
+  const [subject, setSubject] = (0, import_react3.useState)("");
+  const [details, setDetails] = (0, import_react3.useState)("");
+  const [name, setName] = (0, import_react3.useState)("");
+  const [email, setEmail] = (0, import_react3.useState)("");
+  const [sending, setSending] = (0, import_react3.useState)(false);
+  const [sent, setSent] = (0, import_react3.useState)(false);
   const close = () => feedbackOpen.set(false);
   const user = client.getUser();
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     const api = client.api();
-    if (!api) return setError("Feedback is off while tracking is off.");
+    if (!api) return setError(t("Feedback is off while tracking is off."));
     const ctrl = new AbortController();
     api.list({ sort: "top" }, ctrl.signal).then((l) => {
       setPosts(l.posts);
@@ -2844,74 +3486,77 @@ var FeedbackSheet = ({ client, p, title }) => {
       setSent(true);
     }).catch((e) => setError(e.message)).finally(() => setSending(false));
   };
-  const tabs = (0, import_react2.createElement)(
+  const tabs = (0, import_react3.createElement)(
     RN3.View,
     { style: { flexDirection: "row", gap: 8, paddingHorizontal: 16, paddingTop: 12 } },
-    k.chip("Top requests", tab === "top", () => setTab("top")),
-    k.chip("Suggest", tab === "new", () => {
+    k.chip(t("Top requests"), tab === "top", () => setTab("top")),
+    k.chip(t("Suggest"), tab === "new", () => {
       setTab("new");
       setSent(false);
     })
   );
-  const list = (0, import_react2.createElement)(
+  const list = (0, import_react3.createElement)(
     RN3.ScrollView,
     { style: { flex: 1 }, contentContainerStyle: { padding: 16, gap: 10 } },
     error ? k.text(error, { color: p.danger, fontSize: 13 }) : null,
-    posts === null && !error ? k.muted("Loading\u2026") : null,
-    posts?.length === 0 ? k.muted("No requests yet. Be the first to suggest one.") : null,
+    posts === null && !error ? k.muted(t("Loading\u2026")) : null,
+    posts?.length === 0 ? k.muted(t("No requests yet. Be the first to suggest one.")) : null,
     ...(posts ?? []).map(
-      (post) => (0, import_react2.createElement)(
+      (post) => (0, import_react3.createElement)(
         RN3.View,
         { key: post.id, style: { flexDirection: "row", gap: 12, alignItems: "flex-start", paddingVertical: 8, borderBottomWidth: 1, borderBottomColor: p.line } },
-        (0, import_react2.createElement)(
+        (0, import_react3.createElement)(
           RN3.Pressable,
           {
             onPress: () => vote(post),
             accessibilityRole: "button",
             accessibilityState: { selected: post.voted },
-            accessibilityLabel: `${post.voted ? "Remove your vote from" : "Upvote"} ${post.title}. ${post.votes} votes`,
+            accessibilityLabel: post.voted ? tf("Remove your vote from {title}. {votes}", { title: post.title, votes: post.votes === 1 ? t("1 vote") : tf("{n} votes", { n: post.votes }) }) : tf("Upvote {title}. {votes}", { title: post.title, votes: post.votes === 1 ? t("1 vote") : tf("{n} votes", { n: post.votes }) }),
             style: { width: 44, minHeight: 48, borderRadius: 10, alignItems: "center", justifyContent: "center", borderWidth: 1, borderColor: post.voted ? p.accent : p.line }
           },
           k.text("\u25B2", { fontSize: 11, color: post.voted ? p.accent : p.muted }),
           k.text(String(post.votes), { fontWeight: "700", fontSize: 14, color: post.voted ? p.accent : p.fg })
         ),
-        (0, import_react2.createElement)(RN3.View, { style: { flex: 1, gap: 2 } }, k.text(post.title, { fontWeight: "600" }), post.body ? k.muted(post.body.slice(0, 160)) : null)
+        (0, import_react3.createElement)(RN3.View, { style: { flex: 1, gap: 2 } }, k.text(post.title, { fontWeight: "600" }), post.body ? k.muted(post.body.slice(0, 160)) : null)
       )
     )
   );
-  const form = (0, import_react2.createElement)(
+  const form = (0, import_react3.createElement)(
     RN3.ScrollView,
     { style: { flex: 1 }, contentContainerStyle: { padding: 16, gap: 10 }, keyboardShouldPersistTaps: "handled" },
-    sent ? k.text("Thanks! Your request is on the board.", { fontWeight: "600" }) : null,
-    boards.length > 1 ? (0, import_react2.createElement)(RN3.View, { style: { flexDirection: "row", flexWrap: "wrap", gap: 6 } }, ...boards.map((b) => k.chip(b.label, board === b.id, () => setBoard(b.id), b.id))) : null,
-    k.field({ value: subject, onChange: setSubject, placeholder: "Short title", max: 120 }),
-    k.field({ value: details, onChange: setDetails, placeholder: "Details (optional)", multiline: true }),
+    sent ? k.text(t("Thanks! Your request is on the board."), { fontWeight: "600" }) : null,
+    boards.length > 1 ? (0, import_react3.createElement)(RN3.View, { style: { flexDirection: "row", flexWrap: "wrap", gap: 6 } }, ...boards.map((b) => k.chip(b.label, board === b.id, () => setBoard(b.id), b.id))) : null,
+    k.field({ value: subject, onChange: setSubject, placeholder: t("Short title"), max: 120 }),
+    k.field({ value: details, onChange: setDetails, placeholder: t("Details (optional)"), multiline: true }),
     ...user?.email ? [] : [
-      k.muted("Your name and email are optional; they let the team follow up."),
-      k.field({ value: name, onChange: setName, placeholder: "Your name (optional)", max: 100 }),
-      k.field({ value: email, onChange: setEmail, placeholder: "Your email (optional)", max: 200, email: true })
+      k.muted(t("Your name and email are optional; they let the team follow up.")),
+      k.field({ value: name, onChange: setName, placeholder: t("Your name (optional)"), max: 100 }),
+      k.field({ value: email, onChange: setEmail, placeholder: t("Your email (optional)"), max: 200, email: true })
     ],
     error ? k.text(error, { color: p.danger, fontSize: 13 }) : null,
-    k.btn(sending ? "Sending\u2026" : "Send request", "primary", submit, subject.trim().length < 3 || sending)
+    k.btn(sending ? t("Sending\u2026") : t("Send request"), "primary", submit, subject.trim().length < 3 || sending)
   );
   return k.page(title, close, [tabs, tab === "top" ? list : form]);
 };
 var MRRocketFeedback = ({ client, appearance, options = {} }) => {
   const p = usePalette(appearance);
   const open = feedbackOpen.useOpen();
-  return open ? (0, import_react2.createElement)(FeedbackSheet, { client, p, title: options.title ?? "Feedback" }) : null;
+  return open ? (0, import_react3.createElement)(FeedbackSheet, { client, p, title: options.title ?? t("Feedback") }) : null;
 };
 var POLL_OPEN_MS = 4e3;
 var POLL_WAITING_MS = 8e3;
 var POLL_IDLE_MS = 3e4;
+var POLL_QUIET_MS = 6e4;
 var WAITING_FOR_MS = 10 * 6e4;
 var EMAIL = /^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/;
-var whoLabel = { visitor: "You", team: "Team", ai: "AI agent", auto: "Team" };
-var who = (from, agentName) => from === "ai" && agentName?.trim() || whoLabel[from];
+var whoLabel = (from) => from === "visitor" ? t("You") : from === "ai" ? t("AI agent") : t("Team");
+var who = (from, agentName) => from === "ai" && agentName?.trim() || whoLabel(from);
 var msgView = "home";
+var msgChat = null;
 var messengerOpen = opener();
-var openAt = (v = "home") => {
+var openAt = (v = "home", chatId = null) => {
   msgView = v;
+  msgChat = chatId;
   messengerOpen.set(true);
 };
 var useMessenger = () => ({
@@ -2938,12 +3583,15 @@ try {
   imagePicker = null;
 }
 var PHOTO_TYPES = { jpg: "image/jpeg", jpeg: "image/jpeg", png: "image/png", webp: "image/webp", gif: "image/gif" };
-var teamOf = (t) => (t?.messages ?? []).filter((m) => m.from !== "visitor");
-var svg = null;
+var samePlace = (a, b) => a.chatId === b.chatId && a.fresh === b.fresh;
+var shownChat = (at, chats) => at.fresh ? null : at.chatId ?? (chats.length === 1 ? chats[0].id : null);
+var isAnswer = (m) => m.from === "team" || m.from === "ai";
+var lineOf = (m) => m.body || (m.attachments?.length === 1 ? tf("Sent {name}", { name: m.attachments[0].name }) : m.attachments?.length ? tf("Sent {n} files", { n: m.attachments.length }) : "");
+var svg2 = null;
 try {
-  svg = require("react-native-svg");
+  svg2 = require("react-native-svg");
 } catch {
-  svg = null;
+  svg2 = null;
 }
 var GLYPH = {
   chat: "M2.5 4.5a2 2 0 0 1 2-2h7a2 2 0 0 1 2 2v4.5a2 2 0 0 1-2 2H7l-3 2.5V11a2 2 0 0 1-1.5-2z",
@@ -2958,15 +3606,15 @@ var GLYPH = {
 };
 var FALLBACK = { chat: "\u{1F4AC}", home: "\u2302", help: "?", send: "\u2192", up: "\u2191", next: "\u203A", search: "\u2315", cross: "\xD7", clip: "\u{1F4CE}" };
 var glyph = (name, color, size = 20) => {
-  const Svg = svg?.Svg ?? svg?.default;
-  if (!svg || !Svg) return (0, import_react2.createElement)(RN3.Text, { style: { color, fontSize: Math.round(size * 0.85), lineHeight: size + 2, textAlign: "center", minWidth: size } }, FALLBACK[name]);
-  return (0, import_react2.createElement)(Svg, { width: size, height: size, viewBox: "0 0 16 16", fill: "none" }, (0, import_react2.createElement)(svg.Path, { d: GLYPH[name], stroke: color, strokeWidth: 1.7, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" }));
+  const Svg = svg2?.Svg ?? svg2?.default;
+  if (!svg2 || !Svg) return (0, import_react3.createElement)(RN3.Text, { style: { color, fontSize: Math.round(size * 0.85), lineHeight: size + 2, textAlign: "center", minWidth: size } }, FALLBACK[name]);
+  return (0, import_react3.createElement)(Svg, { width: size, height: size, viewBox: "0 0 16 16", fill: "none" }, (0, import_react3.createElement)(svg2.Path, { d: GLYPH[name], stroke: color, strokeWidth: 1.7, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" }));
 };
 var alpha = (hex, a) => /^#[0-9a-f]{6}$/i.test(hex) ? `${hex}${Math.round(a * 255).toString(16).padStart(2, "0")}` : hex;
-var teamMark = (title, bg, fg, size = 36) => (0, import_react2.createElement)(
+var teamMark = (title, bg, fg, size = 36) => (0, import_react3.createElement)(
   RN3.View,
   { style: { width: size, height: size, borderRadius: size / 2, backgroundColor: bg, alignItems: "center", justifyContent: "center" } },
-  (0, import_react2.createElement)(RN3.Text, { style: { color: fg, fontSize: Math.round(size * 0.42), fontWeight: "700" } }, (title.trim()[0] ?? "?").toUpperCase())
+  (0, import_react3.createElement)(RN3.Text, { style: { color: fg, fontSize: Math.round(size * 0.42), fontWeight: "700" } }, (title.trim()[0] ?? "?").toUpperCase())
 );
 var HU = {
   light: { bg: "#ffffff", surface: "#f4f4f5", def: "#ececee", segment: "#ffffff", fg: "#18181b", muted: "#71717a" },
@@ -2974,43 +3622,81 @@ var HU = {
 };
 var hairline = { shadowColor: "#000", shadowOpacity: 0.07, shadowRadius: 3, shadowOffset: { width: 0, height: 1 }, elevation: 1 };
 var useChat = (client, o, open, view) => {
-  const [thread, setThread] = (0, import_react2.useState)(null);
-  const [loaded, setLoaded] = (0, import_react2.useState)(false);
-  const [error, setError] = (0, import_react2.useState)("");
-  const [unseen, setUnseen] = (0, import_react2.useState)([]);
-  const known = (0, import_react2.useRef)(null);
+  const [thread, setThread] = (0, import_react3.useState)(null);
+  const [chats, setChats] = (0, import_react3.useState)([]);
+  const [hasEmail, setHasEmail] = (0, import_react3.useState)(false);
+  const [place, setPlace] = (0, import_react3.useState)({ chatId: null, fresh: false });
+  const [loaded, setLoaded] = (0, import_react3.useState)(false);
+  const [error, setError] = (0, import_react3.useState)("");
+  const [unseen, setUnseen] = (0, import_react3.useState)([]);
+  const known = (0, import_react3.useRef)(/* @__PURE__ */ new Map());
+  const seeded = (0, import_react3.useRef)(false);
   const watching = open && view === "messages";
-  const watch = (0, import_react2.useRef)(watching);
+  const watch = (0, import_react3.useRef)(watching);
   watch.current = watching;
-  const [active, setActive] = (0, import_react2.useState)(RN3.AppState.currentState === "active");
-  (0, import_react2.useEffect)(() => {
+  const at = (0, import_react3.useRef)(place);
+  const list = (0, import_react3.useRef)(chats);
+  const readFailed = (0, import_react3.useRef)(false);
+  const [active, setActive] = (0, import_react3.useState)(RN3.AppState.currentState === "active");
+  (0, import_react3.useEffect)(() => {
     const sub = RN3.AppState.addEventListener("change", (st) => setActive(st === "active"));
     return () => sub.remove();
   }, []);
-  const take = (0, import_react2.useCallback)(
-    (t) => {
-      const team = teamOf(t);
-      if (known.current !== null) {
-        const i = team.findIndex((m) => m.id === known.current);
-        const fresh = team.slice(i + 1).filter((m) => m.from !== "auto");
-        if (fresh.length) {
-          if (o.haptics !== false) buzz();
-          if (!watch.current) setUnseen((u) => [...u, ...fresh]);
-        }
-      }
-      known.current = team.at(-1)?.id ?? "";
-      setThread(t);
+  const enter = (0, import_react3.useCallback)((chatId, fresh = false) => {
+    const next = { chatId, fresh };
+    if (samePlace(at.current, next)) return;
+    at.current = next;
+    setPlace(next);
+    setThread(null);
+    setError("");
+  }, []);
+  const take = (0, import_react3.useCallback)(
+    (t2) => {
+      const read = t2.conversation;
+      const last = t2.messages.at(-1);
+      const all = t2.conversations ?? (read && last ? [{ id: read.id, status: read.status, subject: lineOf(t2.messages[0]), last }] : []);
+      const fresh = [];
+      const learn = (chat, answers, newest) => {
+        const was = known.current.get(chat);
+        const since = was ?? (seeded.current ? "" : void 0);
+        if (since !== void 0) fresh.push(...answers.filter((m) => m.at > since).map((m) => ({ ...m, chat })));
+        known.current.set(chat, newest ?? was ?? "");
+      };
+      for (const c of all) if (c.id !== read?.id) learn(c.id, c.last && isAnswer(c.last) ? [c.last] : [], c.last?.at);
+      if (read) learn(read.id, t2.messages.filter(isAnswer), last?.at);
+      seeded.current = true;
+      if (fresh.length && o.haptics !== false) buzz();
+      const shown2 = shownChat(at.current, all);
+      const counted = fresh.filter((m) => !watch.current || m.chat !== shown2);
+      setUnseen((u) => [...u.filter((m) => all.some((c) => c.id === m.chat)), ...counted]);
+      list.current = all;
+      setChats(all);
+      setHasEmail(t2.hasEmail);
+      if (at.current.chatId === null || read?.id === at.current.chatId) setThread(t2);
     },
     [o.haptics]
   );
-  (0, import_react2.useEffect)(() => {
-    if (watching) setUnseen([]);
-  }, [watching]);
-  (0, import_react2.useEffect)(() => {
+  const arrived = (0, import_react3.useCallback)(
+    (from, t2) => {
+      const went = t2.conversation?.id;
+      if (went && samePlace(at.current, from)) {
+        at.current = { chatId: went, fresh: false };
+        setPlace(at.current);
+      }
+      take(t2);
+    },
+    [take]
+  );
+  const shown = shownChat(place, chats);
+  (0, import_react3.useEffect)(() => {
+    if (watching && shown) setUnseen((u) => u.filter((m) => m.chat !== shown));
+  }, [watching, shown]);
+  (0, import_react3.useEffect)(() => {
     if (!active) return;
     let stop = false;
     let timer;
     let ctrl = null;
+    let refused = false;
     const tick = async () => {
       const api = client.api();
       if (!api) {
@@ -3018,23 +3704,32 @@ var useChat = (client, o, open, view) => {
         return;
       }
       ctrl = new AbortController();
-      let t = null;
       try {
         await client.ready;
-        t = await api.chat(ctrl.signal);
+        const t2 = await api.chat(ctrl.signal, place.chatId ?? void 0);
         if (stop) return;
-        take(t);
-        setError("");
+        take(t2);
+        if (readFailed.current) setError("");
+        readFailed.current = false;
       } catch (e) {
         if (e.name === "AbortError" || stop) return;
-        if (watch.current) setError(e.message);
+        refused = [401, 403].includes(e.status ?? 0);
+        if (e.status === 404 && place.chatId) enter(null);
+        else if (watch.current) {
+          readFailed.current = true;
+          setError(e.message);
+        }
       }
       setLoaded(true);
-      const waiting = !!t?.messages.some((m) => m.from === "visitor") && t?.conversation?.status !== "solved";
-      const wrote = (t?.messages ?? []).filter((m) => m.from === "visitor").at(-1)?.at;
-      const recent = !!wrote && Date.now() - new Date(wrote).getTime() < WAITING_FOR_MS;
-      const ms = watch.current ? POLL_OPEN_MS : waiting && recent ? POLL_WAITING_MS : waiting || open ? POLL_IDLE_MS : 0;
+      const running = list.current.filter((c) => c.status !== "solved");
+      const recent = running.some((c) => c.last && Date.now() - new Date(c.last.at).getTime() < WAITING_FOR_MS);
+      const ms = watch.current ? POLL_OPEN_MS : running.length && recent ? POLL_WAITING_MS : running.length || open ? POLL_IDLE_MS : 0;
       if (!stop && ms) timer = setTimeout(tick, ms);
+      else if (!stop) timer = setTimeout(quiet, POLL_QUIET_MS);
+    };
+    const quiet = () => {
+      if (client.getUser() && !refused) void tick();
+      else timer = setTimeout(quiet, POLL_QUIET_MS);
     };
     void tick();
     return () => {
@@ -3042,16 +3737,30 @@ var useChat = (client, o, open, view) => {
       ctrl?.abort();
       clearTimeout(timer);
     };
-  }, [client, take, active, open, watching]);
-  return { thread, loaded, error, setError, unseen, take };
+  }, [client, take, enter, active, open, watching, place]);
+  return {
+    // A new conversation has nothing to show yet; polls keep reading the newest for the list.
+    thread: place.fresh ? null : thread,
+    chats,
+    hasEmail,
+    place,
+    /** Messages shows the list: several conversations and none chosen. */
+    listing: place.chatId === null && !place.fresh && chats.length > 1,
+    enter,
+    loaded,
+    error,
+    setError,
+    unseen,
+    arrived
+  };
 };
 var useArticles = (client, on, query) => {
-  const [list, setList] = (0, import_react2.useState)(null);
-  const [any, setAny] = (0, import_react2.useState)(null);
-  (0, import_react2.useEffect)(() => {
+  const [list, setList] = (0, import_react3.useState)(null);
+  const [any, setAny] = (0, import_react3.useState)(null);
+  (0, import_react3.useEffect)(() => {
     if (!on) return;
     let stop = false;
-    const t = setTimeout(
+    const t2 = setTimeout(
       () => void client.ready.then(
         () => client.api()?.articles(query.trim() || void 0).then((r) => {
           if (stop) return;
@@ -3063,74 +3772,74 @@ var useArticles = (client, on, query) => {
     );
     return () => {
       stop = true;
-      clearTimeout(t);
+      clearTimeout(t2);
     };
   }, [client, on, query]);
   return { list, any };
 };
 var spansOf = (p, spans, base) => spans.map(
-  (s, i) => (0, import_react2.createElement)(
+  (s2, i) => (0, import_react3.createElement)(
     RN3.Text,
     {
       key: i,
-      onPress: s.href ? () => void RN3.Linking.openURL(s.href).catch(() => void 0) : void 0,
-      accessibilityRole: s.href ? "link" : void 0,
+      onPress: s2.href ? () => void RN3.Linking.openURL(s2.href).catch(() => void 0) : void 0,
+      accessibilityRole: s2.href ? "link" : void 0,
       style: {
         ...base,
-        ...s.bold ? { fontWeight: "700" } : {},
-        ...s.italic ? { fontStyle: "italic" } : {},
-        ...s.code ? { fontFamily: RN3.Platform.OS === "ios" ? "Menlo" : "monospace", backgroundColor: p.soft } : {},
-        ...s.href ? { color: p.accent, textDecorationLine: "underline" } : {}
+        ...s2.bold ? { fontWeight: "700" } : {},
+        ...s2.italic ? { fontStyle: "italic" } : {},
+        ...s2.code ? { fontFamily: RN3.Platform.OS === "ios" ? "Menlo" : "monospace", backgroundColor: p.soft } : {},
+        ...s2.href ? { color: p.accent, textDecorationLine: "underline" } : {}
       }
     },
-    s.text
+    s2.text
   )
 );
 var ArticleView = ({ client, p, id, onAsk }) => {
   const k = kit(p);
-  const [a, setA] = (0, import_react2.useState)(null);
-  const [error, setError] = (0, import_react2.useState)("");
-  const [rated, setRated] = (0, import_react2.useState)(false);
-  (0, import_react2.useEffect)(() => {
+  const [a, setA] = (0, import_react3.useState)(null);
+  const [error, setError] = (0, import_react3.useState)("");
+  const [rated, setRated] = (0, import_react3.useState)(false);
+  (0, import_react3.useEffect)(() => {
     const ctrl = new AbortController();
     client.api()?.article(id, ctrl.signal).then(setA).catch((e) => e.name !== "AbortError" && setError(e.message));
     return () => ctrl.abort();
   }, [client, id]);
   if (error) return k.text(error, { color: p.danger });
-  if (!a) return k.muted("Loading\u2026");
+  if (!a) return k.muted(t("Loading\u2026"));
   const base = { color: p.fg, fontSize: 15, lineHeight: 22 };
   const blocks = a.blocks.map((b, i) => {
-    if (b.type === "h2" || b.type === "h3") return (0, import_react2.createElement)(RN3.Text, { key: i, accessibilityRole: "header", style: { ...base, fontSize: b.type === "h2" ? 17 : 16, fontWeight: "700", marginTop: 8 } }, ...spansOf(p, b.spans, {}));
-    if (b.type === "p") return (0, import_react2.createElement)(RN3.Text, { key: i, style: base }, ...spansOf(p, b.spans, {}));
-    if (b.type === "quote") return (0, import_react2.createElement)(RN3.View, { key: i, style: { borderLeftWidth: 3, borderLeftColor: p.line, paddingLeft: 10 } }, (0, import_react2.createElement)(RN3.Text, { style: { ...base, color: p.muted } }, ...spansOf(p, b.spans, {})));
+    if (b.type === "h2" || b.type === "h3") return (0, import_react3.createElement)(RN3.Text, { key: i, accessibilityRole: "header", style: { ...base, fontSize: b.type === "h2" ? 17 : 16, fontWeight: "700", marginTop: 8 } }, ...spansOf(p, b.spans, {}));
+    if (b.type === "p") return (0, import_react3.createElement)(RN3.Text, { key: i, style: base }, ...spansOf(p, b.spans, {}));
+    if (b.type === "quote") return (0, import_react3.createElement)(RN3.View, { key: i, style: { borderLeftWidth: 3, borderLeftColor: p.line, paddingLeft: 10 } }, (0, import_react3.createElement)(RN3.Text, { style: { ...base, color: p.muted } }, ...spansOf(p, b.spans, {})));
     if (b.type === "ul" || b.type === "ol")
-      return (0, import_react2.createElement)(
+      return (0, import_react3.createElement)(
         RN3.View,
         { key: i, style: { gap: 4 } },
-        ...b.items.map((it, j) => (0, import_react2.createElement)(RN3.View, { key: j, style: { flexDirection: "row", gap: 8 } }, k.text(b.type === "ol" ? `${j + 1}.` : "\u2022", base), (0, import_react2.createElement)(RN3.Text, { style: { ...base, flex: 1 } }, ...spansOf(p, it, {}))))
+        ...b.items.map((it, j) => (0, import_react3.createElement)(RN3.View, { key: j, style: { flexDirection: "row", gap: 8 } }, k.text(b.type === "ol" ? `${j + 1}.` : "\u2022", base), (0, import_react3.createElement)(RN3.Text, { style: { ...base, flex: 1 } }, ...spansOf(p, it, {}))))
       );
-    if (b.type === "code") return (0, import_react2.createElement)(RN3.View, { key: i, style: { backgroundColor: p.soft, borderRadius: 8, padding: 10 } }, k.text(b.text, { fontFamily: RN3.Platform.OS === "ios" ? "Menlo" : "monospace", fontSize: 13 }));
-    return (0, import_react2.createElement)(RN3.View, { key: i, style: { height: 1, backgroundColor: p.line } });
+    if (b.type === "code") return (0, import_react3.createElement)(RN3.View, { key: i, style: { backgroundColor: p.soft, borderRadius: 8, padding: 10 } }, k.text(b.text, { fontFamily: RN3.Platform.OS === "ios" ? "Menlo" : "monospace", fontSize: 13 }));
+    return (0, import_react3.createElement)(RN3.View, { key: i, style: { height: 1, backgroundColor: p.line } });
   });
   const rate = (helpful) => {
     setRated(true);
     client.api()?.rateArticle(id, helpful).catch(() => void 0);
     if (!helpful) onAsk();
   };
-  return (0, import_react2.createElement)(
+  return (0, import_react3.createElement)(
     RN3.View,
     { style: { gap: 10 } },
     k.muted(a.collection),
-    (0, import_react2.createElement)(RN3.Text, { accessibilityRole: "header", style: { color: p.fg, fontSize: 20, fontWeight: "700" } }, a.title),
+    (0, import_react3.createElement)(RN3.Text, { accessibilityRole: "header", style: { color: p.fg, fontSize: 20, fontWeight: "700" } }, a.title),
     ...blocks,
-    (0, import_react2.createElement)(
+    (0, import_react3.createElement)(
       RN3.View,
       { style: { flexDirection: "row", alignItems: "center", gap: 8, padding: 12, borderRadius: 10, backgroundColor: p.soft, marginTop: 8 } },
-      rated ? k.muted("Thanks for letting us know.") : k.muted("Did this answer your question?", { flex: 1 }),
-      rated ? null : k.btn("Yes", "secondary", () => rate(true), false, { height: 34 }),
-      rated ? null : k.btn("No", "secondary", () => rate(false), false, { height: 34 })
+      rated ? k.muted(t("Thanks for letting us know.")) : k.muted(t("Did this answer your question?"), { flex: 1 }),
+      rated ? null : k.btn(t("Yes"), "secondary", () => rate(true), false, { height: 34 }),
+      rated ? null : k.btn(t("No"), "secondary", () => rate(false), false, { height: 34 })
     ),
-    k.btn("Still need help? Send us a message", "secondary", onAsk)
+    k.btn(t("Still need help? Send us a message"), "secondary", onAsk)
   );
 };
 var MessengerSheet = ({
@@ -3143,33 +3852,42 @@ var MessengerSheet = ({
   brand
 }) => {
   const k = kit(p);
-  const [body, setBody] = (0, import_react2.useState)("");
-  const [email, setEmail] = (0, import_react2.useState)("");
-  const [pending, setPending] = (0, import_react2.useState)(null);
-  const [photos, setPhotos] = (0, import_react2.useState)([]);
-  const [query, setQuery] = (0, import_react2.useState)("");
+  const [body, setBody] = (0, import_react3.useState)("");
+  const [asked, setAsked] = (0, import_react3.useState)("");
+  const [email, setEmail] = (0, import_react3.useState)("");
+  const [pending, setPending] = (0, import_react3.useState)(null);
+  const [slow, setSlow] = (0, import_react3.useState)(false);
+  (0, import_react3.useEffect)(() => {
+    setSlow(false);
+    if (!pending) return;
+    const t2 = setTimeout(() => setSlow(true), 1500);
+    return () => clearTimeout(t2);
+  }, [pending]);
+  const [photos, setPhotos] = (0, import_react3.useState)([]);
+  const [query, setQuery] = (0, import_react3.useState)("");
   const helpOn = o.help !== false;
   const arts = useArticles(client, helpOn, query);
-  const scroll = (0, import_react2.useRef)(null);
+  const scroll = (0, import_react3.useRef)(null);
   const close = () => messengerOpen.set(false);
-  const greeting = o.greeting ?? "Hi! How can we help?";
-  const { thread } = chat;
-  const count = (thread?.messages.length ?? 0) + (pending ? 1 : 0);
-  (0, import_react2.useEffect)(() => {
+  const greeting = o.greeting ?? t("Hi! How can we help?");
+  const { thread, place } = chat;
+  const pendingHere = pending && samePlace(pending.to, place) ? pending : null;
+  const count = (thread?.messages.length ?? 0) + (pendingHere ? 1 : 0);
+  (0, import_react3.useEffect)(() => {
     if (view === "messages") setTimeout(() => scroll.current?.scrollToEnd?.({ animated: true }), 50);
-  }, [count, view]);
-  const needEmail = (o.askEmail ?? true) && !thread?.hasEmail && !client.getUser()?.email;
+  }, [count, view, place]);
+  const needEmail = (o.askEmail ?? true) && !chat.hasEmail && !client.getUser()?.email;
   const emailOk = !email.trim() || EMAIL.test(email.trim());
   const pickPhotos = async () => {
     const api = client.api();
     if (!api || !imagePicker?.launchImageLibraryAsync || pending) return;
     const room = CHAT_FILES_PER_MESSAGE - photos.length;
-    if (room <= 0) return chat.setError(`Up to ${CHAT_FILES_PER_MESSAGE} files per message.`);
+    if (room <= 0) return chat.setError(tf("Up to {n} files per message.", { n: CHAT_FILES_PER_MESSAGE }));
     let res;
     try {
       res = await imagePicker.launchImageLibraryAsync({ allowsMultipleSelection: room > 1, selectionLimit: room, quality: 0.8, exif: false });
     } catch (e) {
-      return chat.setError(e.message || "The photos could not be opened.");
+      return chat.setError(e.message || t("The photos could not be opened."));
     }
     if (res.canceled || res.cancelled || !res.assets?.length) return;
     chat.setError("");
@@ -3178,11 +3896,11 @@ var MessengerSheet = ({
       const name = a.fileName || a.uri.split("/").pop() || "photo.jpg";
       const type = a.mimeType && Object.values(PHOTO_TYPES).includes(a.mimeType) ? a.mimeType : PHOTO_TYPES[name.split(".").pop()?.toLowerCase() ?? ""];
       if (!type) {
-        chat.setError("Only pictures (PNG, JPEG, WebP, GIF) can be sent.");
+        chat.setError(t("Only pictures (PNG, JPEG, WebP, GIF) can be sent."));
         continue;
       }
       if (a.fileSize && a.fileSize > CHAT_FILE_MAX_BYTES) {
-        chat.setError(`${name} is larger than 10 MB.`);
+        chat.setError(tf("{name} is larger than 10 MB.", { name }));
         continue;
       }
       const ph = { key: `local-${Date.now().toString(36)}${Math.random().toString(36).slice(2, 7)}`, uri: a.uri, name, type, size: a.fileSize ?? 0, up: Promise.resolve() };
@@ -3201,29 +3919,29 @@ var MessengerSheet = ({
     setPhotos((list) => [...list, ...added]);
   };
   const canSend = (!!body.trim() || photos.length > 0) && !pending && emailOk;
-  const send = async () => {
-    const text2 = body.trim();
+  const deliver = async (text2, files, to) => {
     const api = client.api();
-    const files = photos;
-    if (!text2 && !files.length || pending || !emailOk || !api) return;
+    if (!api) return;
     setPending({
       id: "pending",
       from: "visitor",
       body: text2,
       at: (/* @__PURE__ */ new Date()).toISOString(),
+      to,
       ...files.length ? { attachments: files.map((f) => ({ id: f.key, name: f.name, type: f.type, size: f.size })) } : {}
     });
-    setBody("");
-    setPhotos([]);
     chat.setError("");
     try {
       await Promise.all(files.map((f) => f.up));
       const ids = files.filter((f) => f.id).map((f) => f.id);
-      if (!text2 && !ids.length) throw new Error("The photo could not be sent.");
+      if (!text2 && !ids.length) throw new Error(t("The photo could not be sent."));
       const win = RN3.Dimensions.get("screen");
-      chat.take(
+      const conversation = to.fresh ? "new" : to.chatId ?? thread?.conversation?.id;
+      chat.arrived(
+        to,
         await api.sendChat({
           body: text2,
+          ...conversation ? { conversation } : {},
           email: needEmail && email.trim() ? email.trim() : void 0,
           ...ids.length ? { attachments: ids } : {},
           // A little context for a bug report: the system and the screen size.
@@ -3231,14 +3949,45 @@ var MessengerSheet = ({
         })
       );
     } catch (e) {
-      setBody(text2);
-      setPhotos(files.filter((f) => f.id));
-      chat.setError(e.message);
+      const gone = e.status === 404;
+      chat.enter(gone ? null : to.chatId, gone || to.fresh);
+      setBody((typed) => [text2, typed.trim()].filter(Boolean).join("\n"));
+      setPhotos((list) => [...files.filter((f) => f.id), ...list]);
+      chat.setError(gone ? t("This conversation is no longer available. Your message is still here to send as a new one.") : e.message);
     } finally {
       setPending(null);
     }
   };
-  const localUris = (0, import_react2.useRef)(/* @__PURE__ */ new Map());
+  const send = () => {
+    const text2 = body.trim();
+    const files = photos;
+    if (!text2 && !files.length || pending || !emailOk || !client.api()) return;
+    setBody("");
+    setPhotos([]);
+    void deliver(text2, files, place);
+  };
+  const openMessages = () => {
+    chat.enter(null);
+    setView("messages");
+  };
+  const openChat = (id) => {
+    chat.enter(id);
+    setView("messages");
+  };
+  const startChat = () => {
+    chat.enter(null, true);
+    setView("messages");
+  };
+  const ask = () => {
+    const text2 = asked.trim();
+    if (!text2) return openMessages();
+    if (pending || !client.api()) return;
+    setAsked("");
+    startChat();
+    if (emailOk) void deliver(text2, [], { chatId: null, fresh: true });
+    else setBody((typed) => [text2, typed.trim()].filter(Boolean).join("\n"));
+  };
+  const localUris = (0, import_react3.useRef)(/* @__PURE__ */ new Map());
   for (const f of photos) localUris.current.set(f.key, f.uri);
   const fileUrl = (id) => localUris.current.get(id) ?? client.api()?.attachmentUrl(id) ?? "";
   const ink = inkOn(p.accent);
@@ -3253,11 +4002,11 @@ var MessengerSheet = ({
   const title = o.title?.trim() ?? "";
   const bubble = (m, isPending = false) => {
     const mine = m.from === "visitor";
-    return (0, import_react2.createElement)(
+    return (0, import_react3.createElement)(
       RN3.View,
       { key: m.id, style: { alignSelf: mine ? "flex-end" : "flex-start", maxWidth: "82%", gap: 4 } },
       ...(m.attachments ?? []).map(
-        (f) => (0, import_react2.createElement)(
+        (f) => (0, import_react3.createElement)(
           RN3.Pressable,
           {
             key: f.id,
@@ -3266,10 +4015,10 @@ var MessengerSheet = ({
             accessibilityLabel: f.name,
             style: { alignSelf: mine ? "flex-end" : "flex-start", opacity: isPending ? 0.7 : 1 }
           },
-          f.type.startsWith("image/") ? (0, import_react2.createElement)(RN3.Image, { source: { uri: fileUrl(f.id) }, resizeMode: "cover", style: { width: 200, height: 150, borderRadius: r.bubble, backgroundColor: p.soft } }) : (0, import_react2.createElement)(RN3.View, { style: { backgroundColor: p.soft, borderRadius: r.card, paddingHorizontal: 10, paddingVertical: 7 } }, k.text(`\u{1F4C4} ${f.name}`, { fontSize: 13 }))
+          f.type.startsWith("image/") ? (0, import_react3.createElement)(RN3.Image, { source: { uri: fileUrl(f.id) }, resizeMode: "cover", style: { width: 200, height: 150, borderRadius: r.bubble, backgroundColor: p.soft } }) : (0, import_react3.createElement)(RN3.View, { style: { backgroundColor: p.soft, borderRadius: r.card, paddingHorizontal: 10, paddingVertical: 7 } }, k.text(`\u{1F4C4} ${f.name}`, { fontSize: 13 }))
         )
       ),
-      !m.body && m.attachments?.length ? null : (0, import_react2.createElement)(
+      !m.body && m.attachments?.length ? null : (0, import_react3.createElement)(
         RN3.View,
         {
           style: {
@@ -3286,120 +4035,149 @@ var MessengerSheet = ({
         k.text(m.body, { color: mine ? ink : hu.fg })
       ),
       ...(m.articles ?? []).map(
-        (a) => (0, import_react2.createElement)(
+        (a) => (0, import_react3.createElement)(
           RN3.Pressable,
           { key: a.id, onPress: () => setView({ article: a.id }), accessibilityRole: "link", style: { backgroundColor: p.soft, borderRadius: r.card, paddingHorizontal: 10, paddingVertical: 7 } },
           k.text(`\u{1F4C4} ${a.title}`, { fontSize: 13 })
         )
       ),
-      m.at ? k.muted(`${mine ? "" : `${who(m.from, o.agentName)} \xB7 `}${isPending ? "Sending\u2026" : timeAgo(m.at)}`, { fontSize: 11, textAlign: mine ? "right" : "left", paddingHorizontal: 6 }) : null
+      m.at ? k.muted(`${mine ? "" : `${who(m.from, o.agentName)} \xB7 `}${isPending && slow ? t("Sending\u2026") : timeAgo(m.at)}`, { fontSize: 11, textAlign: mine ? "right" : "left", paddingHorizontal: 6 }) : null
     );
   };
-  const row = (a) => (0, import_react2.createElement)(
+  const row = (a) => (0, import_react3.createElement)(
     RN3.Pressable,
     { key: a.id, onPress: () => setView({ article: a.id }), accessibilityRole: "button", style: { flexDirection: "row", alignItems: "center", gap: 8, paddingVertical: 11, paddingHorizontal: 8 } },
     k.text(a.title, { flex: 1 }),
     glyph("next", p.accent, 14)
   );
-  const card = (children, style = {}) => (0, import_react2.createElement)(RN3.View, { style: { backgroundColor: raised, borderRadius: r.card, padding: 16, ...surf, ...style } }, ...children);
-  const searchRow = (onPress) => (0, import_react2.createElement)(
+  const card = (children, style = {}) => (0, import_react3.createElement)(RN3.View, { style: { backgroundColor: raised, borderRadius: r.card, padding: 16, ...surf, ...style } }, ...children);
+  const searchRow = (onPress) => (0, import_react3.createElement)(
     RN3.Pressable,
     { key: "s", onPress, accessibilityRole: "search", style: { flexDirection: "row", alignItems: "center", height: 44, borderRadius: r.field, paddingHorizontal: 14, backgroundColor: hu.def } },
-    k.muted("Search for help", { flex: 1, fontSize: 15 }),
+    k.muted(t("Search for help"), { flex: 1, fontSize: 15 }),
     glyph("search", p.accent, 16)
   );
-  const search = k.field({ value: query, onChange: setQuery, placeholder: "Search for help", max: 200, style: { borderWidth: 0, borderRadius: r.field, backgroundColor: raised, ...surf } });
+  const search = k.field({ value: query, onChange: setQuery, placeholder: t("Search for help"), max: 200, style: { borderWidth: 0, borderRadius: r.field, backgroundColor: raised, ...surf } });
   const first = client.getUser()?.name?.trim().split(/\s+/)[0];
-  const rest = greeting.replace(/^(hi|hello|hey|hallo)( there)?\s*[!,.]*\s*/i, "").trim() || "How can we help you today?";
-  const hero = (fg, sub) => (0, import_react2.createElement)(
+  const rest = (o.greeting !== void 0 ? greeting.replace(/^(hi|hello|hey|hallo|moin|servus|bonjour|salut|hola|ciao|salve|hoi|ol[áa]|cze[śs][ćc]|hej|こんにちは)( there)?\s*[!,.！、。]*\s*/i, "").trim() : t("How can we help?")) || t("How can we help you today?");
+  const hero = (fg, sub) => (0, import_react3.createElement)(
     RN3.Text,
     { key: "hero", accessibilityRole: "header", style: { color: fg, fontSize: 25, fontWeight: "600", letterSpacing: -0.6, lineHeight: 30 } },
-    first ? `Hi, ${first} \u{1F44B}
-` : "Hi there \u{1F44B}\n",
-    (0, import_react2.createElement)(RN3.Text, { style: { color: sub, fontWeight: "500" } }, rest)
+    `${first ? tf("Hi, {name}", { name: first }) : t("Hi there")} \u{1F44B}
+`,
+    (0, import_react3.createElement)(RN3.Text, { style: { color: sub, fontWeight: "500" } }, rest)
   );
-  const last = thread?.messages.at(-1);
+  const chatRow = (c) => {
+    const m = c.last;
+    const n = chat.unseen.filter((u) => u.chat === c.id).length;
+    const closed = c.status === "solved" ? ` \xB7 ${t("Closed")}` : "";
+    const subject = c.subject || (m ? lineOf(m) : "");
+    const line = m ? lineOf(m) : "";
+    return (0, import_react3.createElement)(
+      RN3.Pressable,
+      { key: c.id, onPress: () => openChat(c.id), accessibilityRole: "button", accessibilityLabel: `${tf("Conversation: {subject}", { subject })}${closed}${n ? `, ${tf("{n} new", { n })}` : ""}` },
+      card(
+        [
+          (0, import_react3.createElement)(
+            RN3.View,
+            { key: "r", style: { flexDirection: "row", alignItems: "center", gap: 10 } },
+            title ? teamMark(title, alpha(p.accent, 0.16), p.accent, 26) : null,
+            (0, import_react3.createElement)(
+              RN3.View,
+              { style: { flex: 1, gap: 1 } },
+              (0, import_react3.createElement)(RN3.Text, { numberOfLines: 1, style: { color: hu.fg, fontSize: 14, fontWeight: "500" } }, subject),
+              m && line !== subject ? (0, import_react3.createElement)(RN3.Text, { numberOfLines: 1, style: { color: hu.muted, fontSize: 13 } }, line) : null,
+              m ? k.muted(`${who(m.from, o.agentName)} \xB7 ${timeAgo(m.at)}${closed}`, { fontSize: 11.5 }) : null
+            ),
+            n ? (0, import_react3.createElement)(RN3.View, { style: { minWidth: 20, height: 20, paddingHorizontal: 5, borderRadius: 10, backgroundColor: p.danger, alignItems: "center", justifyContent: "center" } }, k.text(String(Math.min(n, 9)), { color: "#fff", fontSize: 11, fontWeight: "700" })) : glyph("next", p.muted, 14)
+          )
+        ],
+        { paddingVertical: 10, paddingHorizontal: 12 }
+      )
+    );
+  };
   const showHelp = helpOn && arts.any !== false;
   let content;
   if (view === "home") {
+    const running = chat.chats.filter((c) => c.status !== "solved");
+    const rows = (running.length ? running : chat.chats).slice(0, 2);
     const cards = [
-      // "Ask a question": the words go into the chat's field and are sent as the chat opens.
-      (0, import_react2.createElement)(
+      // "Ask a question": its own field; the words start a new conversation.
+      (0, import_react3.createElement)(
         RN3.View,
         { key: "ask", style: { flexDirection: "row", alignItems: "center", gap: 8, height: 48, borderRadius: 24, paddingLeft: 18, paddingRight: 6, backgroundColor: hu.surface, ...surf } },
-        k.field({ value: body, onChange: setBody, placeholder: "Ask a question", max: 4e3, style: { flex: 1, borderWidth: 0, paddingHorizontal: 0, backgroundColor: "transparent" } }),
-        (0, import_react2.createElement)(
+        k.field({ value: asked, onChange: setAsked, placeholder: t("Ask a question"), max: 4e3, onSubmit: ask, style: { flex: 1, borderWidth: 0, paddingHorizontal: 0, backgroundColor: "transparent" } }),
+        (0, import_react3.createElement)(
           RN3.Pressable,
           {
-            onPress: () => {
-              setView("messages");
-              if (body.trim()) void send();
-            },
+            onPress: ask,
             accessibilityRole: "button",
-            accessibilityLabel: "Send",
-            style: { width: 36, height: 36, borderRadius: 18, alignItems: "center", justifyContent: "center", backgroundColor: body.trim() ? p.accent : hu.def }
+            accessibilityLabel: t("Send"),
+            style: { width: 36, height: 36, borderRadius: 18, alignItems: "center", justifyContent: "center", backgroundColor: asked.trim() ? p.accent : hu.def }
           },
-          glyph("up", body.trim() ? ink : hu.muted, 18)
+          glyph("up", asked.trim() ? ink : hu.muted, 18)
         )
       ),
-      last ? (0, import_react2.createElement)(
+      ...rows.map(chatRow),
+      chat.chats.length > rows.length ? (0, import_react3.createElement)(
         RN3.Pressable,
-        { key: "recent", onPress: () => setView("messages"), accessibilityRole: "button" },
-        card([
-          (0, import_react2.createElement)(
-            RN3.View,
-            { key: "r", style: { flexDirection: "row", alignItems: "center", gap: 10 } },
-            title ? teamMark(title, alpha(p.accent, 0.16), p.accent, 26) : null,
-            (0, import_react2.createElement)(RN3.View, { style: { flex: 1, gap: 1 } }, (0, import_react2.createElement)(RN3.Text, { numberOfLines: 1, style: { color: hu.fg, fontSize: 14, fontWeight: "500" } }, last.body || (last.attachments?.length ? `Sent ${last.attachments.length === 1 ? last.attachments[0].name : `${last.attachments.length} files`}` : "")), k.muted(`${last.from === "visitor" ? "You" : who(last.from, o.agentName)} \xB7 ${timeAgo(last.at)}`, { fontSize: 11.5 })),
-            chat.unseen.length ? (0, import_react2.createElement)(RN3.View, { style: { width: 8, height: 8, borderRadius: 4, backgroundColor: p.danger } }) : glyph("next", p.muted, 14)
-          )
-        ], { paddingVertical: 10, paddingHorizontal: 12 })
+        { key: "all", onPress: openMessages, accessibilityRole: "button", accessibilityLabel: tf("All conversations ({n})", { n: chat.chats.length }), style: { flexDirection: "row", alignItems: "center", justifyContent: "center", gap: 4, paddingVertical: 6 } },
+        k.muted(tf("All conversations ({n})", { n: chat.chats.length }), { fontSize: 13, fontWeight: "500" }),
+        glyph("next", p.muted, 12)
       ) : null,
       showHelp ? card([searchRow(() => setView("help")), ...(arts.list ?? []).slice(0, 4).map(row)], { padding: 8, gap: 2 }) : null
     ];
-    content = plain ? (0, import_react2.createElement)(
+    content = plain ? (0, import_react3.createElement)(
       RN3.ScrollView,
       { key: "home", style: { flex: 1, backgroundColor: canvas }, contentContainerStyle: { paddingHorizontal: 16, paddingTop: 4, paddingBottom: 24, gap: 12 }, keyboardShouldPersistTaps: "handled" },
-      (0, import_react2.createElement)(RN3.View, { key: "top", style: { paddingHorizontal: 6, paddingBottom: 10 } }, hero(p.fg, p.muted)),
+      (0, import_react3.createElement)(RN3.View, { key: "top", style: { paddingHorizontal: 6, paddingBottom: 10 } }, hero(p.fg, p.muted)),
       ...cards
-    ) : (0, import_react2.createElement)(
+    ) : (0, import_react3.createElement)(
       RN3.ScrollView,
       { key: "home", style: { flex: 1, backgroundColor: canvas }, contentContainerStyle: { paddingBottom: 24 }, keyboardShouldPersistTaps: "handled" },
-      (0, import_react2.createElement)(RN3.View, { style: { backgroundColor: p.accent, paddingHorizontal: 22, paddingTop: 4, paddingBottom: 64 } }, hero(ink, alpha(ink, 0.8))),
-      (0, import_react2.createElement)(RN3.View, { style: { marginTop: -48, paddingHorizontal: 16, gap: 12 } }, ...cards)
+      (0, import_react3.createElement)(RN3.View, { style: { backgroundColor: p.accent, paddingHorizontal: 22, paddingTop: 4, paddingBottom: 64 } }, hero(ink, alpha(ink, 0.8))),
+      (0, import_react3.createElement)(RN3.View, { style: { marginTop: -48, paddingHorizontal: 16, gap: 12 } }, ...cards)
+    );
+  } else if (view === "messages" && chat.listing)
+    content = (0, import_react3.createElement)(
+      RN3.ScrollView,
+      { key: "chats", style: { flex: 1, backgroundColor: canvas }, contentContainerStyle: { paddingHorizontal: 16, paddingTop: 4, paddingBottom: 16, gap: 12 } },
+      ...chat.chats.map(chatRow),
+      k.btn(t("New conversation"), "primary", startChat)
     );
-  } else if (view === "messages")
-    content = (0, import_react2.createElement)(
+  else if (view === "messages")
+    content = (0, import_react3.createElement)(
       RN3.View,
       { key: "messages", style: { flex: 1, backgroundColor: hu.bg } },
-      (0, import_react2.createElement)(
+      (0, import_react3.createElement)(
         RN3.ScrollView,
         { ref: scroll, style: { flex: 1 }, contentContainerStyle: { paddingHorizontal: 16, paddingTop: 4, paddingBottom: 16, gap: 12 } },
-        bubble({ id: "greeting", from: "team", body: greeting, at: "" }),
-        !chat.loaded ? k.muted("Loading\u2026") : null,
+        // The greeting opens an empty chat only, never above the visitor's first words (2026-10-30).
+        !thread?.messages.length && !pendingHere && !place.chatId ? bubble({ id: "greeting", from: "team", body: greeting, at: "" }) : null,
+        !chat.loaded && !place.fresh && !pendingHere || place.chatId && !thread ? k.muted(t("Loading\u2026")) : null,
         ...(thread?.messages ?? []).map((m) => bubble(m)),
-        pending ? bubble(pending, true) : null,
-        thread?.conversation?.status === "solved" && !pending ? k.muted("This conversation is closed. Write to start a new one.", { textAlign: "center" }) : null
+        pendingHere ? bubble(pendingHere, true) : null,
+        thread?.conversation?.status === "solved" && !pendingHere ? k.muted(t("This conversation is closed. Write to start a new one."), { textAlign: "center" }) : null
       ),
-      (0, import_react2.createElement)(
+      (0, import_react3.createElement)(
         RN3.View,
         { style: { paddingHorizontal: 12, paddingTop: 8, paddingBottom: 6, gap: 8 } },
         chat.error ? k.text(chat.error, { color: p.danger, fontSize: 12 }) : null,
         // Photos picked for the next message, each with a way to take it out again.
-        photos.length ? (0, import_react2.createElement)(
+        photos.length ? (0, import_react3.createElement)(
           RN3.View,
           { style: { flexDirection: "row", flexWrap: "wrap", gap: 10, paddingTop: 6, paddingHorizontal: 2 } },
           ...photos.map(
-            (f) => (0, import_react2.createElement)(
+            (f) => (0, import_react3.createElement)(
               RN3.View,
               { key: f.key, style: { width: 56, height: 56 } },
-              (0, import_react2.createElement)(RN3.Image, { source: { uri: f.uri }, resizeMode: "cover", accessibilityLabel: f.id ? f.name : `${f.name}, uploading`, style: { width: 56, height: 56, borderRadius: Math.max(4, r.card - 4), backgroundColor: p.soft, opacity: f.id ? 1 : 0.5 } }),
-              (0, import_react2.createElement)(
+              (0, import_react3.createElement)(RN3.Image, { source: { uri: f.uri }, resizeMode: "cover", accessibilityLabel: f.id ? f.name : tf("{name}, uploading", { name: f.name }), style: { width: 56, height: 56, borderRadius: Math.max(4, r.card - 4), backgroundColor: p.soft, opacity: f.id ? 1 : 0.5 } }),
+              (0, import_react3.createElement)(
                 RN3.Pressable,
                 {
                   onPress: () => setPhotos((list) => list.filter((x) => x.key !== f.key)),
                   accessibilityRole: "button",
-                  accessibilityLabel: `Remove ${f.name}`,
+                  accessibilityLabel: tf("Remove {name}", { name: f.name }),
                   hitSlop: 8,
                   style: { position: "absolute", top: -7, right: -7, width: 22, height: 22, borderRadius: 11, borderWidth: 2, borderColor: p.bg, backgroundColor: p.fg, alignItems: "center", justifyContent: "center" }
                 },
@@ -3409,35 +4187,35 @@ var MessengerSheet = ({
           )
         ) : null,
         // The message field on top, the paperclip (when the app has expo-image-picker) and the send button under it.
-        (0, import_react2.createElement)(
+        (0, import_react3.createElement)(
           RN3.View,
           { style: { gap: 2, borderRadius: 20, paddingTop: 10, paddingBottom: 6, paddingRight: 6, paddingLeft: 16, backgroundColor: hu.surface, ...surf } },
           // The optional email: the box's first line, under a hairline the message follows.
           needEmail ? k.field({
             value: email,
             onChange: setEmail,
-            placeholder: "Email for our reply (optional)",
+            placeholder: t("Email for our reply (optional)"),
             email: true,
             max: 200,
             style: { minHeight: 0, marginRight: 10, marginBottom: 4, paddingHorizontal: 0, paddingTop: 0, paddingBottom: 8, borderWidth: 0, borderRadius: 0, borderBottomWidth: 1, borderBottomColor: emailOk ? p.line : p.danger, backgroundColor: "transparent", fontSize: 13.5 }
           }) : null,
-          k.field({ value: body, onChange: setBody, placeholder: "Write a message\u2026", multiline: true, max: 4e3, style: { minHeight: 28, maxHeight: 120, borderWidth: 0, paddingHorizontal: 0, paddingVertical: 4, backgroundColor: "transparent" } }),
-          (0, import_react2.createElement)(
+          k.field({ value: body, onChange: setBody, placeholder: t("Write a message\u2026"), multiline: true, max: 4e3, style: { minHeight: 28, maxHeight: 120, borderWidth: 0, paddingHorizontal: 0, paddingVertical: 4, backgroundColor: "transparent" } }),
+          (0, import_react3.createElement)(
             RN3.View,
             { style: { flexDirection: "row", alignItems: "center", marginLeft: -8 } },
-            imagePicker?.launchImageLibraryAsync ? (0, import_react2.createElement)(
+            imagePicker?.launchImageLibraryAsync ? (0, import_react3.createElement)(
               RN3.Pressable,
-              { onPress: () => void pickPhotos(), disabled: !!pending, accessibilityRole: "button", accessibilityLabel: "Attach a photo or screenshot", hitSlop: 6, style: { width: 34, height: 34, borderRadius: 17, alignItems: "center", justifyContent: "center" } },
+              { onPress: () => void pickPhotos(), disabled: !!pending, accessibilityRole: "button", accessibilityLabel: t("Attach a photo or screenshot"), hitSlop: 6, style: { width: 34, height: 34, borderRadius: 17, alignItems: "center", justifyContent: "center" } },
               glyph("clip", hu.muted, 19)
             ) : null,
-            (0, import_react2.createElement)(RN3.View, { style: { flex: 1 } }),
-            (0, import_react2.createElement)(
+            (0, import_react3.createElement)(RN3.View, { style: { flex: 1 } }),
+            (0, import_react3.createElement)(
               RN3.Pressable,
               {
-                onPress: () => void send(),
+                onPress: send,
                 disabled: !canSend,
                 accessibilityRole: "button",
-                accessibilityLabel: "Send",
+                accessibilityLabel: t("Send"),
                 style: { width: 34, height: 34, borderRadius: 17, alignItems: "center", justifyContent: "center", backgroundColor: canSend ? p.accent : hu.def }
               },
               glyph("up", canSend ? ink : hu.muted, 18)
@@ -3449,28 +4227,28 @@ var MessengerSheet = ({
   else if (view === "help") {
     const groups = /* @__PURE__ */ new Map();
     for (const a of arts.list ?? []) groups.set(a.collection, [...groups.get(a.collection) ?? [], a]);
-    content = (0, import_react2.createElement)(
+    content = (0, import_react3.createElement)(
       RN3.ScrollView,
       { key: "help", style: { flex: 1, backgroundColor: canvas }, contentContainerStyle: { paddingHorizontal: 16, paddingTop: 4, paddingBottom: 16, gap: 12 }, keyboardShouldPersistTaps: "handled" },
       search,
-      arts.list === null ? k.muted("Loading\u2026") : null,
-      arts.list?.length === 0 ? (0, import_react2.createElement)(RN3.View, { style: { gap: 10, alignItems: "center", paddingVertical: 24 } }, k.muted(query.trim() ? `Nothing found for \u201C${query.trim()}\u201D.` : "No help articles yet."), k.btn("Send us a message", "primary", () => setView("messages"))) : null,
-      ...query.trim() ? arts.list?.length ? [card((arts.list ?? []).map(row), { padding: 8 })] : [] : [...groups].map(([name, items]) => (0, import_react2.createElement)(RN3.View, { key: name, style: { gap: 6 } }, k.muted(`${name} \xB7 ${items.length}`, { fontSize: 12, fontWeight: "600", paddingHorizontal: 2 }), card(items.map(row), { padding: 8 })))
+      arts.list === null ? k.muted(t("Loading\u2026")) : null,
+      arts.list?.length === 0 ? (0, import_react3.createElement)(RN3.View, { style: { gap: 10, alignItems: "center", paddingVertical: 24 } }, k.muted(query.trim() ? tf("Nothing found for \u201C{q}\u201D.", { q: query.trim() }) : t("No help articles yet.")), k.btn(t("Send us a message"), "primary", startChat)) : null,
+      ...query.trim() ? arts.list?.length ? [card((arts.list ?? []).map(row), { padding: 8 })] : [] : [...groups].map(([name, items]) => (0, import_react3.createElement)(RN3.View, { key: name, style: { gap: 6 } }, k.muted(`${name} \xB7 ${items.length}`, { fontSize: 12, fontWeight: "600", paddingHorizontal: 2 }), card(items.map(row), { padding: 8 })))
     );
   } else
-    content = (0, import_react2.createElement)(
+    content = (0, import_react3.createElement)(
       RN3.ScrollView,
       { key: `a-${view.article}`, style: { flex: 1 }, contentContainerStyle: { paddingHorizontal: 16, paddingTop: 4, paddingBottom: 32 } },
-      (0, import_react2.createElement)(ArticleView, { client, p, id: view.article, onAsk: () => setView("messages") })
+      (0, import_react3.createElement)(ArticleView, { client, p, id: view.article, onAsk: startChat })
     );
   const current = typeof view === "string" ? view : "help";
   const tab = (v, name, icon, badge = 0) => {
     const on = current === v;
-    return (0, import_react2.createElement)(
+    return (0, import_react3.createElement)(
       RN3.Pressable,
       {
         key: v,
-        onPress: () => setView(v),
+        onPress: () => v === "messages" ? openMessages() : setView(v),
         accessibilityRole: "tab",
         accessibilityLabel: name,
         accessibilityState: { selected: on },
@@ -3479,68 +4257,69 @@ var MessengerSheet = ({
       },
       glyph(icon, on ? hu.fg : hu.muted, 17),
       on ? k.text(name, { fontSize: 13.5, fontWeight: "500", color: hu.fg }) : null,
-      badge ? (0, import_react2.createElement)(RN3.View, { style: { position: "absolute", top: 7, right: 12, width: 8, height: 8, borderRadius: 4, backgroundColor: p.danger } }) : null
+      badge ? (0, import_react3.createElement)(RN3.View, { style: { position: "absolute", top: 7, right: 12, width: 8, height: 8, borderRadius: 4, backgroundColor: p.danger } }) : null
     );
   };
   const onAccent = view === "home" && !plain;
   const ground = onAccent ? p.accent : hu.bg;
-  const back = (to, label) => (0, import_react2.createElement)(
+  const back = (to, label) => (0, import_react3.createElement)(
     RN3.Pressable,
-    { key: "back", onPress: () => setView(to), accessibilityRole: "button", accessibilityLabel: label, hitSlop: 10, style: { width: 32, height: 32, alignItems: "center", justifyContent: "center", transform: [{ rotate: "180deg" }] } },
+    { key: "back", onPress: to, accessibilityRole: "button", accessibilityLabel: label, hitSlop: 10, style: { width: 32, height: 32, alignItems: "center", justifyContent: "center", transform: [{ rotate: "180deg" }] } },
     glyph("next", hu.fg, 18)
   );
-  const head = (0, import_react2.createElement)(
+  const head = (0, import_react3.createElement)(
     RN3.View,
     { key: "head", style: { flexDirection: "row", alignItems: "center", gap: 8, paddingLeft: 12, paddingRight: 12, paddingTop: 12, paddingBottom: 6, backgroundColor: ground } },
-    typeof view !== "string" ? back("help", "All articles") : view === "messages" ? back("home", "Back to home") : view === "home" && (o.logo || title) ? o.logo ? (0, import_react2.createElement)(RN3.Image, { key: "logo", source: { uri: o.logo }, accessibilityIgnoresInvertColors: true, resizeMode: "contain", style: { height: 28, aspectRatio: 1, maxWidth: 132, borderRadius: 8, marginLeft: 4 } }) : teamMark(title, alpha(p.accent, 0.16), p.accent, 28) : null,
-    // In the chat: who answers, in the middle.
-    view === "messages" && title ? (0, import_react2.createElement)(
+    typeof view !== "string" ? back(() => setView("help"), t("All articles")) : view === "messages" && !chat.listing && chat.chats.length > 1 ? back(openMessages, t("All conversations")) : view === "messages" ? back(() => setView("home"), t("Back to home")) : view === "home" && (o.logo || title) ? o.logo ? (0, import_react3.createElement)(RN3.Image, { key: "logo", source: { uri: o.logo }, accessibilityIgnoresInvertColors: true, resizeMode: "contain", style: { height: 28, aspectRatio: 1, maxWidth: 132, borderRadius: 8, marginLeft: 4 } }) : teamMark(title, alpha(p.accent, 0.16), p.accent, 28) : null,
+    // In the chat: who answers, in the middle; over the list its name.
+    view === "messages" && chat.listing ? (0, import_react3.createElement)(RN3.View, { style: { flex: 1, alignItems: "center" } }, k.text(t("Messages"), { color: hu.fg, fontSize: 15, fontWeight: "600" })) : view === "messages" && title ? (0, import_react3.createElement)(
       RN3.View,
       { style: { flex: 1, flexDirection: "row", alignItems: "center", justifyContent: "center", gap: 8 } },
       teamMark(title, alpha(p.accent, 0.16), p.accent, 28),
-      (0, import_react2.createElement)(RN3.Text, { numberOfLines: 1, style: { flexShrink: 1, color: hu.fg, fontSize: 15, fontWeight: "600" } }, title)
-    ) : (0, import_react2.createElement)(RN3.View, { style: { flex: 1 } }),
-    (0, import_react2.createElement)(RN3.Pressable, { onPress: close, accessibilityRole: "button", accessibilityLabel: "Close", hitSlop: 12, style: { width: 32, height: 32, borderRadius: 10, alignItems: "center", justifyContent: "center" } }, glyph("cross", onAccent ? ink : p.muted, 18))
+      (0, import_react3.createElement)(RN3.Text, { numberOfLines: 1, style: { flexShrink: 1, color: hu.fg, fontSize: 15, fontWeight: "600" } }, title)
+    ) : (0, import_react3.createElement)(RN3.View, { style: { flex: 1 } }),
+    (0, import_react3.createElement)(RN3.Pressable, { onPress: close, accessibilityRole: "button", accessibilityLabel: t("Close"), hitSlop: 12, style: { width: 32, height: 32, borderRadius: 10, alignItems: "center", justifyContent: "center" } }, glyph("cross", onAccent ? ink : p.muted, 18))
   );
-  const powered = brand ? (0, import_react2.createElement)(
+  const powered = brand ? (0, import_react3.createElement)(
     RN3.View,
     { key: "brand", style: { paddingTop: 2, paddingBottom: 6, alignItems: "center", backgroundColor: hu.bg } },
-    (0, import_react2.createElement)(
+    (0, import_react3.createElement)(
       RN3.Text,
       { onPress: () => void RN3.Linking.openURL(BRAND_URL).catch(() => void 0), accessibilityRole: "link", hitSlop: 8, style: { color: p.muted, fontSize: 11.5 } },
-      "Powered by ",
-      (0, import_react2.createElement)(RN3.Text, { style: { fontWeight: "600" } }, "MRRocket")
+      t("Powered by {brand}").split("{brand}")[0],
+      (0, import_react3.createElement)(RN3.Text, { style: { fontWeight: "600" } }, "MRRocket"),
+      t("Powered by {brand}").split("{brand}")[1]
     )
   ) : null;
-  return (0, import_react2.createElement)(
+  return (0, import_react3.createElement)(
     RN3.Modal,
     { visible: true, animationType: "slide", presentationStyle: "pageSheet", onRequestClose: close },
-    (0, import_react2.createElement)(
+    (0, import_react3.createElement)(
       RN3.KeyboardAvoidingView,
       { behavior: RN3.Platform.OS === "ios" ? "padding" : void 0, style: { flex: 1, backgroundColor: hu.bg } },
       head,
       content,
-      view === "messages" ? null : (0, import_react2.createElement)(
+      view === "messages" && !chat.listing ? null : (0, import_react3.createElement)(
         RN3.View,
         { key: "tabs", accessibilityRole: "tablist", style: { flexDirection: "row", marginHorizontal: 12, marginTop: 6, marginBottom: 6, padding: 4, borderRadius: 22, backgroundColor: hu.surface } },
-        tab("home", "Home", "home"),
-        tab("messages", "Messages", "chat", chat.unseen.length),
-        showHelp ? tab("help", "Help", "help") : null
+        tab("home", t("Home"), "home"),
+        tab("messages", t("Messages"), "chat", chat.unseen.length),
+        showHelp ? tab("help", t("Help"), "help") : null
       ),
       powered,
-      (0, import_react2.createElement)(RN3.View, { style: { height: 16 } })
+      (0, import_react3.createElement)(RN3.View, { style: { height: 16 } })
     )
   );
 };
 var MRRocketMessenger = ({ client, appearance, options: given = {} }) => {
-  const [look, setLook] = (0, import_react2.useState)(null);
-  (0, import_react2.useEffect)(() => {
+  const [look, setLook] = (0, import_react3.useState)(null);
+  (0, import_react3.useEffect)(() => {
     const ctrl = new AbortController();
     void client.ready.then(
       () => client.api()?.messengerLook(ctrl.signal).then(setLook).catch(() => void 0)
     );
     return () => ctrl.abort();
-  }, [client]);
+  }, [client, wordsVersion()]);
   const defined = Object.fromEntries(Object.entries(given).filter(([, v]) => v !== void 0));
   const options = look ? {
     title: look.title,
@@ -3562,27 +4341,31 @@ var MRRocketMessenger = ({ client, appearance, options: given = {} }) => {
   const p = usePalette({ theme: appearance?.theme ?? look?.theme, accent: appearance?.accent ?? look?.accent });
   const k = kit(p);
   const open = messengerOpen.useOpen();
-  const [view, setViewState] = (0, import_react2.useState)(msgView);
-  const [banner, setBanner] = (0, import_react2.useState)(null);
-  (0, import_react2.useEffect)(() => {
-    if (open) setViewState(msgView);
-  }, [open]);
+  const [view, setViewState] = (0, import_react3.useState)(msgView);
+  const [banner, setBanner] = (0, import_react3.useState)(null);
   const setView = (v) => {
     msgView = v;
     setViewState(v);
   };
   const chat = useChat(client, options, open, view);
+  const { enter } = chat;
+  (0, import_react3.useEffect)(() => {
+    if (!open) return;
+    setViewState(msgView);
+    if (msgView === "messages") enter(msgChat);
+  }, [open, enter]);
   const latest = chat.unseen.at(-1);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     if (!latest || open || options.preview === false) return;
     setBanner(latest);
-    const t = setTimeout(() => setBanner(null), 6e3);
-    return () => clearTimeout(t);
+    const t2 = setTimeout(() => setBanner(null), 6e3);
+    return () => clearTimeout(t2);
   }, [latest, open, options.preview]);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     if (open) setBanner(null);
   }, [open]);
   const unseen = chat.unseen.length;
+  const news = latest?.chat ?? null;
   const ink = inkOn(p.accent);
   const label = options.label?.trim() ?? "";
   const r = CORNERS[options.corners ?? "round"];
@@ -3591,15 +4374,15 @@ var MRRocketMessenger = ({ client, appearance, options: given = {} }) => {
     ...edge === "top" ? { top: 60 } : edge === "bottom" ? { bottom: 34 } : { top: 0, bottom: 0, justifyContent: "center" },
     ...side === "left" ? { left: 20 } : side === "right" ? { right: 20 } : { left: 0, right: 0, alignItems: "center" }
   };
-  const launcher = options.launcher ? (0, import_react2.createElement)(
+  const launcher = options.launcher ? (0, import_react3.createElement)(
     RN3.View,
     { key: "launcher", pointerEvents: "box-none", style: { position: "absolute", ...place } },
-    (0, import_react2.createElement)(
+    (0, import_react3.createElement)(
       RN3.Pressable,
       {
-        onPress: () => openAt(unseen ? "messages" : "home"),
+        onPress: () => openAt(news ? "messages" : "home", news),
         accessibilityRole: "button",
-        accessibilityLabel: unseen ? `Open chat, ${unseen} new` : "Open chat",
+        accessibilityLabel: unseen === 1 ? t("Open chat, 1 new reply") : unseen ? tf("Open chat, {n} new replies", { n: unseen }) : t("Open chat"),
         style: {
           height: label ? 50 : 56,
           minWidth: label ? 0 : 56,
@@ -3619,14 +4402,14 @@ var MRRocketMessenger = ({ client, appearance, options: given = {} }) => {
       },
       glyph("chat", ink, label ? 20 : 26),
       label ? k.text(label, { color: ink, fontWeight: "700" }) : null,
-      unseen ? (0, import_react2.createElement)(RN3.View, { style: { position: "absolute", top: -2, right: -2, minWidth: 20, height: 20, borderRadius: 10, backgroundColor: p.danger, alignItems: "center", justifyContent: "center", borderWidth: 2, borderColor: p.bg } }, k.text(String(Math.min(unseen, 9)), { color: "#fff", fontSize: 11, fontWeight: "700" })) : null
+      unseen ? (0, import_react3.createElement)(RN3.View, { style: { position: "absolute", top: -2, right: -2, minWidth: 20, height: 20, borderRadius: 10, backgroundColor: p.danger, alignItems: "center", justifyContent: "center", borderWidth: 2, borderColor: p.bg } }, k.text(String(Math.min(unseen, 9)), { color: "#fff", fontSize: 11, fontWeight: "700" })) : null
     )
   ) : null;
-  const toast = banner ? (0, import_react2.createElement)(
+  const toast = banner ? (0, import_react3.createElement)(
     RN3.Pressable,
     {
       key: "banner",
-      onPress: () => openAt("messages"),
+      onPress: () => openAt("messages", banner.chat),
       accessibilityRole: "button",
       accessibilityLiveRegion: "polite",
       style: {
@@ -3646,30 +4429,30 @@ var MRRocketMessenger = ({ client, appearance, options: given = {} }) => {
         elevation: 6
       }
     },
-    k.muted(`${who(banner.from, options.agentName)}${unseen > 1 ? ` \xB7 ${unseen} new` : ""}`, { fontWeight: "600", fontSize: 12 }),
-    (0, import_react2.createElement)(RN3.Text, { numberOfLines: 3, style: { color: p.fg, fontSize: 15, lineHeight: 20 } }, banner.body)
+    k.muted(`${who(banner.from, options.agentName)}${unseen > 1 ? ` \xB7 ${tf("{n} new", { n: unseen })}` : ""}`, { fontWeight: "600", fontSize: 12 }),
+    (0, import_react3.createElement)(RN3.Text, { numberOfLines: 3, style: { color: p.fg, fontSize: 15, lineHeight: 20 } }, banner.body)
   ) : null;
   if (!launcher && !toast && !open) return null;
-  return (0, import_react2.createElement)(
+  return (0, import_react3.createElement)(
     RN3.View,
     { pointerEvents: "box-none", style: { position: "absolute", top: 0, left: 0, right: 0, bottom: 0 } },
     launcher,
     toast,
-    open ? (0, import_react2.createElement)(MessengerSheet, { client, p, o: options, chat, view, setView, brand: look?.branding !== false }) : null
+    open ? (0, import_react3.createElement)(MessengerSheet, { client, p, o: options, chat, view, setView, brand: look?.branding !== false }) : null
   );
 };
 
 // src/native/index.tsx
 var RN4 = require("react-native");
 var MRRocketMask = ({ children, style }) => {
-  const ref = (0, import_react3.useRef)(null);
-  (0, import_react3.useEffect)(() => {
+  const ref = (0, import_react4.useRef)(null);
+  (0, import_react4.useEffect)(() => {
     maskedViews.add(ref);
     return () => {
       maskedViews.delete(ref);
     };
   }, []);
-  return (0, import_react3.createElement)(RN4.View, { ref, collapsable: false, style }, children);
+  return (0, import_react4.createElement)(RN4.View, { ref, collapsable: false, style }, children);
 };
 var shared = null;
 var sharedKey = "";
@@ -3686,16 +4469,20 @@ var createMRRocket = (options) => {
   return shared;
 };
 var getMRRocket = () => shared;
-var Ctx = (0, import_react3.createContext)(null);
+var Ctx = (0, import_react4.createContext)(null);
 var MRRocketProvider = ({ client: given, children, consent, flows = true, appearance, surveys = true, messenger = {}, feedback = {}, heatmaps = true, ...options }) => {
-  const [client] = (0, import_react3.useState)(() => given ?? createMRRocket({ ...options, consent }));
-  (0, import_react3.useEffect)(() => {
+  const [client] = (0, import_react4.useState)(() => given ?? createMRRocket({ ...options, consent }));
+  (0, import_react4.useSyncExternalStore)(onWords, wordsVersion, wordsVersion);
+  (0, import_react4.useEffect)(() => {
+    if (options.locale) setLocale(options.locale);
+  }, [options.locale]);
+  (0, import_react4.useEffect)(() => {
     if (consent) client.setConsent(consent);
   }, [client, consent]);
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (options.replay !== void 0) client.setReplay(options.replay);
   }, [client, options.replay]);
-  const start = (0, import_react3.useRef)(null);
+  const start = (0, import_react4.useRef)(null);
   const touch = (e, end) => {
     const n = e.nativeEvent;
     const x = n.pageX ?? n.changedTouches?.[0]?.pageX;
@@ -3704,22 +4491,22 @@ var MRRocketProvider = ({ client: given, children, consent, flows = true, appear
     if (!end) start.current = { x, y, t: Date.now() };
     else if (start.current && Math.hypot(x - start.current.x, y - start.current.y) < 10 && Date.now() - start.current.t < 500) client.tap(x, y);
   };
-  return (0, import_react3.createElement)(
+  return (0, import_react4.createElement)(
     Ctx.Provider,
     { value: client },
-    heatmaps ? (0, import_react3.createElement)(RN4.View, { style: { flex: 1 }, onTouchStartCapture: (e) => touch(e, false), onTouchEndCapture: (e) => touch(e, true) }, children) : children,
-    flows ? (0, import_react3.createElement)(MRRocketFlows, { flows: client.flows, paywall: client.paywall, appearance }) : null,
-    surveys ? (0, import_react3.createElement)(MRRocketSurveys, { client, appearance }) : null,
-    feedback ? (0, import_react3.createElement)(MRRocketFeedback, { client, appearance, options: feedback }) : null,
-    messenger ? (0, import_react3.createElement)(MRRocketMessenger, { client, appearance, options: messenger }) : null
+    heatmaps ? (0, import_react4.createElement)(RN4.View, { style: { flex: 1 }, onTouchStartCapture: (e) => touch(e, false), onTouchEndCapture: (e) => touch(e, true) }, children) : children,
+    flows ? (0, import_react4.createElement)(MRRocketFlows, { flows: client.flows, paywall: client.paywall, appearance }) : null,
+    surveys ? (0, import_react4.createElement)(MRRocketSurveys, { client, appearance }) : null,
+    feedback ? (0, import_react4.createElement)(MRRocketFeedback, { client, appearance, options: feedback }) : null,
+    messenger ? (0, import_react4.createElement)(MRRocketMessenger, { client, appearance, options: messenger }) : null
   );
 };
 var useClient = () => {
-  const c = (0, import_react3.useContext)(Ctx);
+  const c = (0, import_react4.useContext)(Ctx);
   if (!c) throw new Error("MRRocket: wrap your app in <MRRocketProvider apiKey=\u2026>.");
   return c;
 };
-var useVersion = (client) => (0, import_react3.useSyncExternalStore)(client.subscribe, client.getVersion, client.getVersion);
+var useVersion = (client) => (0, import_react4.useSyncExternalStore)(client.subscribe, client.getVersion, client.getVersion);
 var useMRRocket = () => {
   const client = useClient();
   useVersion(client);
@@ -3753,9 +4540,9 @@ var useReview = () => {
   const client = useClient();
   return { request: client.requestReview };
 };
-var useOnboarding = () => {
+var useOnboarding = (id) => {
   const client = useClient();
-  return { start: client.startOnboarding };
+  return useOnboardingItem(client.flows, id, client.startOnboarding);
 };
 var useFlag = (key) => {
   const client = useClient();
@@ -3772,7 +4559,7 @@ var useVariant = (key) => {
   useVersion(client);
   const config = client.getConfig();
   const variant = client.peekVariant(key);
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (config) client.expose(key, variant);
   }, [client, config, key, variant]);
   return variant;
@@ -3783,7 +4570,7 @@ var useText = (id, fallback) => {
   const config = client.getConfig();
   const text2 = client.peekText(id);
   const person = client.getDistinctId();
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (config) client.exposeText(id);
   }, [client, config, id, person]);
   return text2 ?? fallback;
@@ -3808,13 +4595,13 @@ var useExpoRouterTracking = () => {
     console.warn("[MRRocket] useExpoRouterTracking needs expo-router. With React Navigation use useNavigationTracking.");
   }
   const pathname = (router?.usePathname ?? noPathname)();
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (pathname) client.screen(pathname);
   }, [client, pathname]);
 };
 var useNavigationTracking = () => {
   const client = useClient();
-  return (0, import_react3.useCallback)(
+  return (0, import_react4.useCallback)(
     (state) => {
       const name = activeRouteName(state);
       if (name) client.screen(name);