@sensiblestats/widget-react 0.37.3 → 0.39.0

package/dist/index.cjs

@@ -36,7 +36,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/StatsWidget.tsx
-var import_react23 = require("react");
+var import_react24 = require("react");
 var import_widget_sdk5 = require("@sensiblestats/widget-sdk");
 
 // src/kickoff.ts
@@ -57,6 +57,8 @@ var STRINGS = {
     launcherLabel: "Chat with SensibleStats",
     placeholder: "Ask about a team, player or match\u2026",
     closeChat: "Close chat",
+    newConversation: "New conversation",
+    moreOptions: "More options",
     chatDialogLabel: "SensibleStats chat",
     stopResponse: "Stop response",
     sendMessage: "Send message",
@@ -129,6 +131,8 @@ var STRINGS = {
     launcherLabel: "SensibleStats ile sohbet et",
     placeholder: "Bir tak\u0131m, oyuncu veya ma\xE7 hakk\u0131nda sor\u2026",
     closeChat: "Sohbeti kapat",
+    newConversation: "Yeni sohbet",
+    moreOptions: "Di\u011Fer se\xE7enekler",
     chatDialogLabel: "SensibleStats sohbet",
     stopResponse: "Yan\u0131t\u0131 durdur",
     sendMessage: "Mesaj g\xF6nder",
@@ -224,6 +228,8 @@ function normalizeUi(cfg) {
     starters: cfg.starters ?? [],
     injectStyles: cfg.injectStyles ?? true,
     closeChat: strings.closeChat,
+    newConversation: strings.newConversation,
+    moreOptions: strings.moreOptions,
     chatDialogLabel: strings.chatDialogLabel,
     stopResponse: strings.stopResponse,
     sendMessage: strings.sendMessage,
@@ -642,7 +648,7 @@ function marketOddsRowToSlipSelection(vm, row, conversationId) {
 // src/reducer.ts
 var POPUP_MAX = 160;
 function initialState(starters) {
-  return { isOpen: false, messages: [], isStreaming: false, status: null, actionsLoading: false, starters, error: null, lastUserInput: null, lastDisplayText: null, popupText: null, conversationId: null };
+  return { isOpen: false, messages: [], isStreaming: false, status: null, actionsLoading: false, starters, configuredStarters: starters, error: null, lastUserInput: null, lastDisplayText: null, popupText: null, conversationId: null };
 }
 function activeTurn(state) {
   const last = state.messages[state.messages.length - 1];
@@ -722,6 +728,19 @@ function reducer(state, action) {
     }
     case "DISMISS_POPUP":
       return { ...state, popupText: null };
+    case "RESET":
+      return { ...initialState(state.configuredStarters), isOpen: state.isOpen };
+    case "RESTORE":
+      return {
+        ...state,
+        messages: action.messages,
+        conversationId: action.conversationId,
+        isStreaming: false,
+        status: null,
+        actionsLoading: false,
+        starters: action.messages.length ? [] : state.configuredStarters,
+        error: null
+      };
     case "EVENT":
       return applyEvent(state, action.event);
     case "STREAM_ERROR":
@@ -841,17 +860,82 @@ function useLiveDashboardPoll({ messages, dispatch, getLiveDashboard }) {
   }, [anchorKey, messages, forceUpdate]);
 }
 
+// src/conversationStore.ts
+var TTL_MS = 36e5;
+var MAX_MESSAGES = 30;
+function readConversation(storageKey, now) {
+  let raw;
+  try {
+    raw = window.localStorage.getItem(storageKey);
+  } catch {
+    return null;
+  }
+  if (!raw) return null;
+  let parsed;
+  try {
+    parsed = JSON.parse(raw);
+  } catch {
+    return "corrupt";
+  }
+  if (parsed?.v !== 1 || !Array.isArray(parsed.messages) || typeof parsed.updatedAt !== "number") return "corrupt";
+  if (now - parsed.updatedAt > TTL_MS) return "expired";
+  return { conversationId: parsed.conversationId ?? null, messages: parsed.messages };
+}
+function writeConversation(storageKey, conversationId, messages, now) {
+  let capped = messages.slice(-MAX_MESSAGES);
+  for (let attempt = 0; attempt < 2; attempt++) {
+    try {
+      window.localStorage.setItem(storageKey, JSON.stringify({ v: 1, updatedAt: now, conversationId, messages: capped }));
+      return;
+    } catch {
+      if (capped.length <= 1) return;
+      capped = capped.slice(Math.ceil(capped.length / 2));
+    }
+  }
+}
+function clearConversation(storageKey) {
+  try {
+    window.localStorage.removeItem(storageKey);
+  } catch {
+  }
+}
+
 // src/useChatStream.ts
+function hasAnswerContent(t) {
+  return !!t.text || t.cards.length > 0 || t.insights.length > 0 || t.marketOdds.length > 0 || t.oddsMovement.length > 0 || !!t.greetingDashboard || !!t.clubFanDashboard;
+}
 var STREAM_FALLBACK_TIMEOUT_MS = 3e4;
-function useChatStream(conversation, starterTexts, greetingMessage) {
-  const seed = (0, import_react2.useMemo)(() => initialState(starterTexts.map(chipFromText)), []);
-  const [state, dispatch] = (0, import_react2.useReducer)(reducer, seed);
-  const idRef = (0, import_react2.useRef)(0);
+function seedIdCounter(messages) {
+  let max = -1;
+  for (const m of messages) {
+    const n = Number(m.id.slice(1));
+    if (m.id[0] === "m" && Number.isFinite(n) && n > max) max = n;
+  }
+  return max + 1;
+}
+function useChatStream(conversation, starterTexts, greetingMessage, storageKey) {
+  const boot = (0, import_react2.useMemo)(() => {
+    const payload = storageKey ? readConversation(storageKey, Date.now()) : null;
+    const restored = payload != null && payload !== "expired" && payload !== "corrupt";
+    const base = initialState(starterTexts.map(chipFromText));
+    if (restored) {
+      return { state: { ...base, messages: payload.messages, conversationId: payload.conversationId, starters: [] }, restored: true, stale: false };
+    }
+    return { state: base, restored: false, stale: payload === "expired" || payload === "corrupt" };
+  }, []);
+  const [state, dispatch] = (0, import_react2.useReducer)(reducer, boot.state);
+  const idRef = (0, import_react2.useRef)(seedIdCounter(boot.state.messages));
   const handleRef = (0, import_react2.useRef)(null);
   const fallbackTimerRef = (0, import_react2.useRef)(null);
   const stateRef = (0, import_react2.useRef)(state);
   stateRef.current = state;
-  const greetedRef = (0, import_react2.useRef)(false);
+  const greetedRef = (0, import_react2.useRef)(boot.restored);
+  const hydratedRef = (0, import_react2.useRef)(false);
+  const restoreSeededRef = (0, import_react2.useRef)(false);
+  if (!restoreSeededRef.current) {
+    restoreSeededRef.current = true;
+    if (boot.restored && boot.state.conversationId) conversation.conversationId = boot.state.conversationId;
+  }
   const nextId = () => `m${idRef.current++}`;
   const clearFallbackTimer = (0, import_react2.useCallback)(() => {
     if (fallbackTimerRef.current != null) {
@@ -907,10 +991,9 @@ function useChatStream(conversation, starterTexts, greetingMessage) {
     const last = stateRef.current.lastUserInput;
     if (last) run(last, stateRef.current.lastDisplayText ?? void 0);
   }, [run]);
-  (0, import_react2.useEffect)(() => {
+  const fireGreeting = (0, import_react2.useCallback)(() => {
     const message = greetingMessage?.trim();
-    if (!message || greetedRef.current) return;
-    greetedRef.current = true;
+    if (!message) return;
     try {
       handleRef.current?.cancel();
       clearFallbackTimer();
@@ -923,6 +1006,55 @@ function useChatStream(conversation, starterTexts, greetingMessage) {
       dispatch({ kind: "STOP" });
     }
   }, [greetingMessage, conversation, consume, clearFallbackTimer, armFallbackTimer]);
+  (0, import_react2.useEffect)(() => {
+    if (greetedRef.current) return;
+    greetedRef.current = true;
+    fireGreeting();
+  }, [fireGreeting]);
+  (0, import_react2.useEffect)(() => {
+    if (boot.stale && storageKey) clearConversation(storageKey);
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    if (!storageKey || state.isStreaming) return;
+    if (hydratedRef.current) {
+      hydratedRef.current = false;
+      return;
+    }
+    const msgs = state.messages;
+    const persistable = msgs.filter((m, i) => {
+      if (m.role === "user") {
+        const next = msgs[i + 1];
+        return !!next && next.role === "assistant" && next.done && !next.isGreeting && hasAnswerContent(next);
+      }
+      return m.done && !m.isGreeting && hasAnswerContent(m);
+    });
+    if (persistable.length === 0) return;
+    writeConversation(storageKey, state.conversationId, persistable, Date.now());
+  }, [storageKey, state.isStreaming, state.messages, state.conversationId]);
+  (0, import_react2.useEffect)(() => {
+    if (!storageKey) return;
+    const onStorage = (e) => {
+      if (e.key !== storageKey || e.storageArea !== window.localStorage) return;
+      if (stateRef.current.isStreaming) return;
+      if (e.newValue == null) {
+        idRef.current = 0;
+        conversation.conversationId = void 0;
+        hydratedRef.current = true;
+        dispatch({ kind: "RESET" });
+        greetedRef.current = true;
+        fireGreeting();
+        return;
+      }
+      const parsed = readConversation(storageKey, Date.now());
+      if (!parsed || parsed === "expired" || parsed === "corrupt") return;
+      idRef.current = seedIdCounter(parsed.messages);
+      conversation.conversationId = parsed.conversationId ?? void 0;
+      hydratedRef.current = true;
+      dispatch({ kind: "RESTORE", messages: parsed.messages, conversationId: parsed.conversationId });
+    };
+    window.addEventListener("storage", onStorage);
+    return () => window.removeEventListener("storage", onStorage);
+  }, [storageKey, conversation, fireGreeting]);
   const open = (0, import_react2.useCallback)(() => dispatch({ kind: "OPEN" }), []);
   const close = (0, import_react2.useCallback)(() => {
     handleRef.current?.cancel();
@@ -941,9 +1073,20 @@ function useChatStream(conversation, starterTexts, greetingMessage) {
     else open();
   }, [close, open]);
   const dismissPopup = (0, import_react2.useCallback)(() => dispatch({ kind: "DISMISS_POPUP" }), []);
+  const reset = (0, import_react2.useCallback)(() => {
+    handleRef.current?.cancel();
+    handleRef.current = null;
+    clearFallbackTimer();
+    if (storageKey) clearConversation(storageKey);
+    idRef.current = 0;
+    conversation.conversationId = void 0;
+    dispatch({ kind: "RESET" });
+    greetedRef.current = true;
+    fireGreeting();
+  }, [storageKey, conversation, clearFallbackTimer, fireGreeting]);
   const getLiveDashboard = (0, import_react2.useCallback)(() => conversation.getLiveDashboard(), [conversation]);
   useLiveDashboardPoll({ messages: state.messages, dispatch, getLiveDashboard });
-  return { state, open, close, stop, toggle, send, retry, dismissPopup };
+  return { state, open, close, stop, toggle, send, retry, dismissPopup, reset };
 }
 
 // src/useLiveMonitor.ts
@@ -1288,6 +1431,16 @@ function CloseIcon() {
 function ChevronIcon() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) });
 }
+function NewChatIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { fill: "none", d: "M12 5v14M5 12h14", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) });
+}
+function KebabIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "currentColor", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "5", r: "1.6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "1.6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "19", r: "1.6" })
+  ] }) });
+}
 var DASHBOARD_EMOJI = {
   football: "\u26BD",
   "goal-net": "\u{1F945}",
@@ -1352,20 +1505,89 @@ function ChatFab({ label, greeting, popupText, logoUrl, onOpen, onDismissPopup,
 }
 
 // src/components/ChatPanel.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 
 // src/components/ChatHeader.tsx
+var import_react6 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
-function ChatHeader({ onClose, closeLabel = "Close chat", logoUrl, headerTitle }) {
+function ChatHeader({
+  onClose,
+  closeLabel = "Close chat",
+  logoUrl,
+  headerTitle,
+  onNewConversation,
+  canReset,
+  newConversationLabel = "New conversation",
+  moreOptionsLabel = "More options"
+}) {
+  const [menuOpen, setMenuOpen] = (0, import_react6.useState)(false);
+  const wrapRef = (0, import_react6.useRef)(null);
+  const kebabRef = (0, import_react6.useRef)(null);
+  const firstItemRef = (0, import_react6.useRef)(null);
+  const hasMenu = !!(canReset && onNewConversation);
+  (0, import_react6.useEffect)(() => {
+    if (menuOpen) firstItemRef.current?.focus();
+  }, [menuOpen]);
+  (0, import_react6.useEffect)(() => {
+    if (!menuOpen) return;
+    const onPointer = (e) => {
+      if (!wrapRef.current?.contains(e.target)) setMenuOpen(false);
+    };
+    const onKey = (e) => {
+      if (e.key === "Escape") {
+        setMenuOpen(false);
+        kebabRef.current?.focus();
+      }
+    };
+    document.addEventListener("mousedown", onPointer);
+    document.addEventListener("keydown", onKey);
+    return () => {
+      document.removeEventListener("mousedown", onPointer);
+      document.removeEventListener("keydown", onKey);
+    };
+  }, [menuOpen]);
+  const runNewConversation = () => {
+    setMenuOpen(false);
+    onNewConversation?.();
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("header", { className: "ss-w-header", children: [
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(BrandMark, { logoUrl, className: "ss-w-header-mark" }),
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "ss-w-header-title", children: headerTitle ?? "SensibleStats" }),
+    hasMenu ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "ss-w-menu-wrap", ref: wrapRef, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "button",
+        {
+          type: "button",
+          className: "ss-w-kebab",
+          ref: kebabRef,
+          "aria-haspopup": "menu",
+          "aria-expanded": menuOpen,
+          "aria-label": moreOptionsLabel,
+          onClick: () => setMenuOpen((open) => !open),
+          children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(KebabIcon, {})
+        }
+      ),
+      menuOpen ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "ss-w-menu", role: "menu", "aria-label": moreOptionsLabel, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+        "button",
+        {
+          type: "button",
+          className: "ss-w-menu-item",
+          role: "menuitem",
+          ref: firstItemRef,
+          onClick: runNewConversation,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(NewChatIcon, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: newConversationLabel })
+          ]
+        }
+      ) }) : null
+    ] }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { type: "button", className: "ss-w-close", "aria-label": closeLabel, onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CloseIcon, {}) })
   ] });
 }
 
 // src/components/MessageList.tsx
-var import_react20 = require("react");
+var import_react21 = require("react");
 
 // src/components/Markdown.tsx
 var import_react_markdown = __toESM(require("react-markdown"), 1);
@@ -1383,7 +1605,7 @@ function Markdown({ text }) {
 }
 
 // src/components/EntityCardList.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var MAX_VISIBLE = 3;
 var RECORD_RE = /^(\d+)-(\d+)-(\d+)$/;
@@ -1467,7 +1689,7 @@ function ScopeTabs({ scopes, active, onSelect }) {
   )) });
 }
 function EntityCardItem({ c }) {
-  const [active, setActive] = (0, import_react6.useState)(0);
+  const [active, setActive] = (0, import_react7.useState)(0);
   const hasBody = c.scopes.length > 0;
   if (!hasBody) {
     return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "ss-w-ecard ss-w-ecard-bare", "data-kind": c.kind, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardHeader, { c, showScopeCrest: false }) });
@@ -1481,7 +1703,7 @@ function EntityCardItem({ c }) {
   ] });
 }
 function EntityCardList({ cards, disabled, showLessLabel = "Show less", showMoreLabel = (n) => `Show ${n} more` }) {
-  const [expanded, setExpanded] = (0, import_react6.useState)(false);
+  const [expanded, setExpanded] = (0, import_react7.useState)(false);
   if (cards.length === 0) return null;
   const visible = expanded ? cards : cards.slice(0, MAX_VISIBLE);
   const overflow = cards.length - MAX_VISIBLE;
@@ -1492,18 +1714,18 @@ function EntityCardList({ cards, disabled, showLessLabel = "Show less", showMore
 }
 
 // src/components/BettingInsightList.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 
 // src/components/AddToSlipButton.tsx
-var import_react8 = require("react");
+var import_react9 = require("react");
 var import_widget_sdk4 = require("@sensiblestats/widget-sdk");
 
 // src/components/Toast.tsx
-var import_react7 = require("react");
+var import_react8 = require("react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
 var DISMISS_MS = 4e3;
 function Toast({ toast, onDismiss }) {
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!toast) return;
     const timer = setTimeout(onDismiss, DISMISS_MS);
     return () => clearTimeout(timer);
@@ -1521,10 +1743,10 @@ function withTimeout(value) {
   ]);
 }
 function SlipButton({ selection, shownOdds, marketName, slip, ui }) {
-  const [pending, setPending] = (0, import_react8.useState)(false);
-  const [settled, setSettled] = (0, import_react8.useState)(false);
-  const [toast, setToast] = (0, import_react8.useState)(null);
-  const dismiss = (0, import_react8.useCallback)(() => setToast(null), []);
+  const [pending, setPending] = (0, import_react9.useState)(false);
+  const [settled, setSettled] = (0, import_react9.useState)(false);
+  const [toast, setToast] = (0, import_react9.useState)(null);
+  const dismiss = (0, import_react9.useCallback)(() => setToast(null), []);
   const handler = slip.onAddToSlip;
   if (!ui || !handler || !selection) return null;
   const onClick = async () => {
@@ -1588,14 +1810,14 @@ function OddsMovementBadge({
 }
 
 // src/components/Crest.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 var import_jsx_runtime11 = require("react/jsx-runtime");
 function initials2(name) {
   return (name ?? "").trim().slice(0, 1).toUpperCase() || "?";
 }
 function Crest2({ url, name, kind }) {
   const cls = kind === "comp" ? "ss-w-bi-comp-logo" : "ss-w-bi-crest";
-  const [failed, setFailed] = (0, import_react9.useState)(false);
+  const [failed, setFailed] = (0, import_react10.useState)(false);
   if (url && !failed) {
     return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("img", { className: cls, src: url, alt: "", "aria-hidden": "true", onError: () => setFailed(true) });
   }
@@ -1603,7 +1825,7 @@ function Crest2({ url, name, kind }) {
 }
 
 // src/components/PinToggle.tsx
-var import_react10 = require("react");
+var import_react11 = require("react");
 var import_jsx_runtime12 = require("react/jsx-runtime");
 var PIN_GLYPHS = {
   pin: { viewBox: "0 0 24 24", strokeWidth: 1.4, transform: "scale(1.5)", d: "M9.5 1.5 14.5 6.5 13 8l-.5-.5-3 3 .3 2.2-1.4 1.4L5.6 11.3l-3.3 3.3-1-1 3.3-3.3L1.9 7.5l1.4-1.4 2.2.3 3-3L8 2.9z" },
@@ -1611,8 +1833,8 @@ var PIN_GLYPHS = {
   bookmark: { viewBox: "0 0 24 24", strokeWidth: 2, d: "M7 3h10a1.5 1.5 0 0 1 1.5 1.5V21l-6.5-3.6L5.5 21V4.5A1.5 1.5 0 0 1 7 3z" }
 };
 function PinToggle({ pin, monitor, ui }) {
-  const [toast, setToast] = (0, import_react10.useState)(null);
-  const dismiss = (0, import_react10.useCallback)(() => setToast(null), []);
+  const [toast, setToast] = (0, import_react11.useState)(null);
+  const dismiss = (0, import_react11.useCallback)(() => setToast(null), []);
   if (!monitor || !monitor.enabled) return null;
   const key = pinKey(pin);
   const pinned = monitor.isPinned(key);
@@ -1664,7 +1886,7 @@ function StatRows({ stats }) {
   ] }, `${s.label}:${s.value}`)) });
 }
 function ScopedStats({ scopes }) {
-  const [active, setActive] = (0, import_react11.useState)(0);
+  const [active, setActive] = (0, import_react12.useState)(0);
   const current = scopes[active] ?? scopes[0] ?? { key: "", label: "", stats: [] };
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "ss-w-bi-scoped", children: [
     /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "ss-w-bi-scopes", role: "group", children: scopes.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { type: "button", className: "ss-w-bi-chip", "aria-pressed": i === active, onClick: () => setActive(i), children: s.label }, s.key)) }),
@@ -1675,7 +1897,7 @@ function hasStatsContent(it) {
   return !!it.scopes && it.scopes.length >= 2 || it.stats.length > 0;
 }
 function ReasonStrip({ it, ui }) {
-  const [open, setOpen] = (0, import_react11.useState)(false);
+  const [open, setOpen] = (0, import_react12.useState)(false);
   const hasScopes = !!it.scopes && it.scopes.length >= 2;
   const hasStats = hasStatsContent(it);
   const hasText = !!it.text;
@@ -1785,7 +2007,7 @@ function BettingInsightList({ insights, ui, slip, monitor }) {
 }
 
 // src/components/MarketOddsCardList.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 var import_jsx_runtime14 = require("react/jsx-runtime");
 function OddsRow({ vm, row, ui, slip, inSlipIds }) {
   const selection = vm.addToSlipEnabled ? marketOddsRowToSlipSelection(vm, row, slip.conversationId) : null;
@@ -1802,7 +2024,7 @@ function OddsRow({ vm, row, ui, slip, inSlipIds }) {
   ] });
 }
 function MarketOddsCard({ vm, ui, slip, monitor, inSlipIds, hideHeader, pinRef }) {
-  const [open, setOpen] = (0, import_react12.useState)(false);
+  const [open, setOpen] = (0, import_react13.useState)(false);
   const kickoff = vm.kickoffUtc && ui?.bettingKickoff ? ui.bettingKickoff(vm.kickoffUtc) : void 0;
   const hasNamedTeams = !!vm.homeTeamName && !!vm.awayTeamName;
   const showPin = !!monitor && vm.pinEnabled;
@@ -2097,7 +2319,7 @@ function FixtureCard({ card }) {
 }
 
 // src/components/dashboard/CountdownCard.tsx
-var import_react13 = require("react");
+var import_react14 = require("react");
 var import_jsx_runtime20 = require("react/jsx-runtime");
 var DAY_MS = 864e5;
 function remainingSegments(kickoffUnix, nowMs, withSeconds) {
@@ -2116,12 +2338,12 @@ function remainingSegments(kickoffUnix, nowMs, withSeconds) {
 function CountdownCard({ card }) {
   const { data } = card;
   const unitLabel = { d: data.daysUnit, h: data.hoursUnit, m: data.minutesUnit, s: data.secondsUnit };
-  const [nowMs, setNowMs] = (0, import_react13.useState)(() => Date.now());
-  const [reduced] = (0, import_react13.useState)(
+  const [nowMs, setNowMs] = (0, import_react14.useState)(() => Date.now());
+  const [reduced] = (0, import_react14.useState)(
     () => typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches
   );
   const withinDay = data.kickoffUnix * 1e3 - nowMs < DAY_MS;
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (reduced) return;
     const id = window.setInterval(() => setNowMs(Date.now()), withinDay ? 1e3 : 6e4);
     return () => window.clearInterval(id);
@@ -2129,7 +2351,7 @@ function CountdownCard({ card }) {
   const segments = remainingSegments(data.kickoffUnix, nowMs, withinDay && !reduced);
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ss-w-fandash-card ss-w-fandash-countdown", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "ss-w-fandash-countdown-top", children: [
     /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "ss-w-fandash-eyebrow", children: card.title ?? "Kick-off in" }),
-    segments ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "ss-w-fandash-countdown-clock", children: segments.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react13.Fragment, { children: [
+    segments ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "ss-w-fandash-countdown-clock", children: segments.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react14.Fragment, { children: [
       i > 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "ss-w-fandash-countdown-colon", children: ":" }) : null,
       /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { className: "ss-w-fandash-countdown-seg", children: [
         /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "ss-w-fandash-countdown-value", children: s.value }),
@@ -2140,7 +2362,7 @@ function CountdownCard({ card }) {
 }
 
 // src/components/dashboard/InjuriesCard.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 var import_jsx_runtime21 = require("react/jsx-runtime");
 var SHOWN = 3;
 function ColHead({ name, crestUrl }) {
@@ -2163,7 +2385,7 @@ function InjuryList({ rows, emptyLabel, limit }) {
 }
 function InjuriesCard({ card, ui }) {
   const { data } = card;
-  const [expanded, setExpanded] = (0, import_react14.useState)(false);
+  const [expanded, setExpanded] = (0, import_react15.useState)(false);
   const hidden = Math.max(0, data.ours.length - SHOWN) + Math.max(0, data.theirs.length - SHOWN);
   const limit = expanded ? void 0 : SHOWN;
   const showMore = ui?.showMore ?? ((n) => `Show ${n} more`);
@@ -2267,7 +2489,7 @@ function LinksCard({ card }) {
 }
 
 // src/components/dashboard/PostMatchResultCard.tsx
-var import_react15 = require("react");
+var import_react16 = require("react");
 var import_jsx_runtime27 = require("react/jsx-runtime");
 function initials3(name) {
   return name.trim().slice(0, 3).toUpperCase();
@@ -2277,7 +2499,7 @@ function PostMatchCrest({
   name,
   side
 }) {
-  const [failed, setFailed] = (0, import_react15.useState)(false);
+  const [failed, setFailed] = (0, import_react16.useState)(false);
   const cls = `ss-w-fandash-postmatch-crest ss-w-fandash-postmatch-crest--${side}`;
   if (url && !failed) {
     return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("img", { className: cls, src: url, alt: "", "aria-hidden": "true", onError: () => setFailed(true) });
@@ -2476,10 +2698,10 @@ function RestingFormCard({ card }) {
 }
 
 // src/components/dashboard/LiveScoreCard.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 
 // src/useLiveClock.ts
-var import_react16 = require("react");
+var import_react17 = require("react");
 var TICK_MS = 6e4;
 var MAX_LIVE_TICK_MINUTES = 15;
 function computeDisplayMinute(minute, clockRunning, receivedAtMs) {
@@ -2488,10 +2710,10 @@ function computeDisplayMinute(minute, clockRunning, receivedAtMs) {
   return minute + Math.min(Math.max(0, elapsedMinutes), MAX_LIVE_TICK_MINUTES);
 }
 function useLiveClock(minute, clockRunning, receivedAtMs) {
-  const [displayMinute, setDisplayMinute] = (0, import_react16.useState)(
+  const [displayMinute, setDisplayMinute] = (0, import_react17.useState)(
     () => computeDisplayMinute(minute, clockRunning, receivedAtMs)
   );
-  (0, import_react16.useEffect)(() => {
+  (0, import_react17.useEffect)(() => {
     setDisplayMinute(computeDisplayMinute(minute, clockRunning, receivedAtMs));
     if (!clockRunning) return;
     const id = window.setInterval(() => {
@@ -2508,7 +2730,7 @@ function initials5(name) {
   return name.trim().slice(0, 3).toUpperCase();
 }
 function LiveCrest({ url, name, side }) {
-  const [failed, setFailed] = (0, import_react17.useState)(false);
+  const [failed, setFailed] = (0, import_react18.useState)(false);
   const cls = `ss-w-fandash-live-crest ss-w-fandash-live-crest--${side}`;
   if (url && !failed) {
     return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("img", { className: cls, src: url, alt: "", "aria-hidden": "true", onError: () => setFailed(true) });
@@ -2527,7 +2749,7 @@ function LiveScoreCard({
 }) {
   const { data } = card;
   const seedKey = `${data.minute}:${data.homeScore}:${data.awayScore}`;
-  const seedRef = (0, import_react17.useRef)(null);
+  const seedRef = (0, import_react18.useRef)(null);
   if (!seedRef.current || seedRef.current.key !== seedKey) {
     seedRef.current = { key: seedKey, receivedAtMs: Date.now() };
   }
@@ -2567,7 +2789,7 @@ function LiveScoreCard({
 }
 
 // src/components/dashboard/LiveTimelineCard.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 var import_jsx_runtime37 = require("react/jsx-runtime");
 var SHOWN2 = 3;
 function EventIcon({ type }) {
@@ -2609,7 +2831,7 @@ function EventRow({ e }) {
   ] });
 }
 function LiveTimelineCard({ card, ui }) {
-  const [expanded, setExpanded] = (0, import_react18.useState)(false);
+  const [expanded, setExpanded] = (0, import_react19.useState)(false);
   const events = card.data.events;
   if (!events || events.length === 0) return null;
   const sorted = [...events].sort((a, b) => b.minute - a.minute);
@@ -2634,7 +2856,7 @@ function LiveTimelineCard({ card, ui }) {
 }
 
 // src/components/dashboard/MomentumWave.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_jsx_runtime38 = require("react/jsx-runtime");
 var WIDTH = 270;
 var HEIGHT = 56;
@@ -2658,7 +2880,7 @@ function MomentumWave({
 }) {
   if (points.length === 0) return null;
   const { area, line, lastLeftPct, lastTopPx } = buildPaths(points);
-  const clipId = (0, import_react19.useId)();
+  const clipId = (0, import_react20.useId)();
   const topClipId = `${clipId}-top`;
   const bottomClipId = `${clipId}-bottom`;
   const topClass = clubIsHome ? "ss-w-fandash-live-mom-home" : "ss-w-fandash-live-mom-away";
@@ -2849,11 +3071,11 @@ function turnAnchor(messages) {
 }
 function MessageList({ controller, ui, slip, onDashboardTap, monitor }) {
   const { state, send } = controller;
-  const listRef = (0, import_react20.useRef)(null);
-  const endRef = (0, import_react20.useRef)(null);
-  const pinnedRef = (0, import_react20.useRef)(true);
-  const anchoredTurnRef = (0, import_react20.useRef)(null);
-  (0, import_react20.useEffect)(() => {
+  const listRef = (0, import_react21.useRef)(null);
+  const endRef = (0, import_react21.useRef)(null);
+  const pinnedRef = (0, import_react21.useRef)(true);
+  const anchoredTurnRef = (0, import_react21.useRef)(null);
+  (0, import_react21.useEffect)(() => {
     const anchor = turnAnchor(state.messages);
     const list = listRef.current;
     if (anchor && anchor.turnId !== anchoredTurnRef.current) {
@@ -2909,10 +3131,10 @@ function MessageList({ controller, ui, slip, onDashboardTap, monitor }) {
 }
 
 // src/components/ChatInput.tsx
-var import_react21 = require("react");
+var import_react22 = require("react");
 var import_jsx_runtime44 = require("react/jsx-runtime");
 function ChatInput({ placeholder, streaming, onSend, onStop, stopLabel = "Stop response", sendLabel = "Send message" }) {
-  const [value, setValue] = (0, import_react21.useState)("");
+  const [value, setValue] = (0, import_react22.useState)("");
   const submit = () => {
     const t = value.trim();
     if (!t) return;
@@ -3219,8 +3441,8 @@ function OddsPanel({ monitor, ui, slip }) {
 var import_jsx_runtime49 = require("react/jsx-runtime");
 var FULLSCREEN_QUERY = "(max-width: 639px)";
 function useIsModal() {
-  const [modal, setModal] = (0, import_react22.useState)(false);
-  (0, import_react22.useEffect)(() => {
+  const [modal, setModal] = (0, import_react23.useState)(false);
+  (0, import_react23.useEffect)(() => {
     if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
     const mql = window.matchMedia(FULLSCREEN_QUERY);
     const sync = () => setModal(mql.matches);
@@ -3231,9 +3453,9 @@ function useIsModal() {
   return modal;
 }
 function ChatPanel({ controller, ui, slip, onDashboardTap, monitor }) {
-  const { state, close, stop, send } = controller;
+  const { state, close, stop, send, reset } = controller;
   const isModal = useIsModal();
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const onKey = (e) => {
       if (e.key === "Escape") close();
     };
@@ -3244,11 +3466,23 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor }) {
     monitor?.setActiveTab("chat");
     send(text);
   };
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (monitor && monitor.activeTab !== "chat" && state.isStreaming) monitor.markChatActivity();
   }, [monitor, state.isStreaming, state.messages.length]);
   return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "ss-w-panel", role: "dialog", "aria-modal": isModal, "aria-label": ui.chatDialogLabel, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ChatHeader, { onClose: close, closeLabel: ui.closeChat, logoUrl: ui.logoUrl, headerTitle: ui.headerTitle }),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      ChatHeader,
+      {
+        onClose: close,
+        closeLabel: ui.closeChat,
+        logoUrl: ui.logoUrl,
+        headerTitle: ui.headerTitle,
+        onNewConversation: reset,
+        canReset: state.messages.length > 0,
+        newConversationLabel: ui.newConversation,
+        moreOptionsLabel: ui.moreOptions
+      }
+    ),
     monitor && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
       TabBar,
       {
@@ -3363,8 +3597,14 @@ var WIDGET_CSS = `.ss-w-root { all: revert; }
 }
 .ss-w-header { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--ss-w-line); }
 .ss-w-header-mark { width: 18px; height: 18px; display: block; object-fit: contain; }
-.ss-w-header-title { font-weight: 660; }
-.ss-w-close { margin-left: auto; background: none; border: none; color: var(--ss-w-faint); cursor: pointer; font-size: 16px; display: grid; place-items: center; }
+.ss-w-header-title { font-weight: 660; flex: 1; }
+.ss-w-close { background: none; border: none; color: var(--ss-w-faint); cursor: pointer; font-size: 16px; display: grid; place-items: center; }
+.ss-w-menu-wrap { position: relative; display: grid; place-items: center; }
+.ss-w-kebab { background: none; border: none; color: var(--ss-w-faint); cursor: pointer; font-size: 16px; display: grid; place-items: center; }
+.ss-w-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 5; min-width: 184px; padding: 6px; background: var(--ss-w-panel); border: 1px solid var(--ss-w-line); border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.18); }
+.ss-w-menu-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; background: none; border: none; border-radius: 8px; color: var(--ss-w-ink); font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
+.ss-w-menu-item:hover, .ss-w-menu-item:focus-visible { background: var(--ss-w-bubble); }
+.ss-w-menu-item svg { color: var(--ss-w-faint); font-size: 15px; flex: none; }
 
 /* messages */
 /* .ss-w-mon-list (Matches/Odds tab scrollers) shares .ss-w-list's box/scroll rules by design --
@@ -4104,21 +4344,22 @@ function injectStyles(root) {
 function StatsWidget(props) {
   const injectedClient = "client" in props ? props.client : void 0;
   const cfg = props.config;
-  const built = (0, import_react23.useMemo)(() => buildClient(props), [injectedClient, cfg?.operatorId, cfg?.publicKey, cfg?.baseUrl]);
-  const ui = (0, import_react23.useMemo)(() => normalizeUi(props.config ?? { operatorId: "", publicKey: "" }), [props.config]);
-  const rootRef = (0, import_react23.useRef)(null);
-  const introDoneRef = (0, import_react23.useRef)(false);
-  const markIntroDone = (0, import_react23.useCallback)(() => {
+  const built = (0, import_react24.useMemo)(() => buildClient(props), [injectedClient, cfg?.operatorId, cfg?.publicKey, cfg?.baseUrl]);
+  const ui = (0, import_react24.useMemo)(() => normalizeUi(props.config ?? { operatorId: "", publicKey: "" }), [props.config]);
+  const rootRef = (0, import_react24.useRef)(null);
+  const introDoneRef = (0, import_react24.useRef)(false);
+  const markIntroDone = (0, import_react24.useCallback)(() => {
     introDoneRef.current = true;
   }, []);
-  const controller = useChatStream(built?.conversation ?? emptyConversation(), ui.starters, built ? ui.greetingMessage : void 0);
+  const convStorageKey = `ss-w-conv:${cfg?.operatorId ?? ""}:${cfg?.userContext?.operatorUserId ?? "anon"}`;
+  const controller = useChatStream(built?.conversation ?? emptyConversation(), ui.starters, built ? ui.greetingMessage : void 0, convStorageKey);
   const monitor = useLiveMonitor({
     getLiveMonitor: (pins) => built ? built.conversation.getLiveMonitor(pins) : Promise.resolve(null),
     getMarketOdds: (matchId, dev) => built ? built.conversation.getMarketOdds(matchId, dev) : Promise.resolve(null),
     storageKey: `ss-w-pins:${cfg?.operatorId ?? ""}:${cfg?.userContext?.operatorUserId ?? "anon"}`,
     isOpen: controller.state.isOpen
   });
-  const slip = (0, import_react23.useMemo)(
+  const slip = (0, import_react24.useMemo)(
     () => {
       const handler = props.config?.onAddToSlip;
       return {
@@ -4141,11 +4382,11 @@ function StatsWidget(props) {
     },
     [props.config?.onAddToSlip, controller.state.conversationId, built, monitor.markInSlip]
   );
-  const onDashboardTap = (0, import_react23.useMemo)(
+  const onDashboardTap = (0, import_react24.useMemo)(
     () => built ? createDashboardTapSignal((input) => built.conversation.sendSignal(input)) : void 0,
     [built]
   );
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (!built || !ui.injectStyles) return;
     const node = rootRef.current?.getRootNode();
     if (node) injectStyles(node);