@brokr/sdk 2.1.0 → 2.1.2

package/dist/react.js

@@ -34,6 +34,7 @@ var index_exports = {};
 __export(index_exports, {
   AIChat: () => AIChat,
   AccountPanel: () => AccountPanel,
+  ActivityFeed: () => ActivityFeed,
   AuthPageShell: () => AuthPageShell,
   AuthWall: () => AuthWall,
   AutoReloadToggle: () => AutoReloadToggle,
@@ -63,8 +64,10 @@ __export(index_exports, {
   UpdateBilling: () => UpdateBilling,
   UpgradePrompt: () => UpgradePrompt,
   UsageGate: () => UsageGate,
+  UsageGrid: () => UsageGrid,
   UserButton: () => UserButton,
   defineAccount: () => defineAccount,
+  defineBrokrTheme: () => defineBrokrTheme,
   defineChat: () => defineChat,
   useBrokr: () => useBrokr,
   useBrokrTheme: () => useBrokrTheme,
@@ -4254,6 +4257,7 @@ function getBrokrRootStyle(theme) {
 var import_react3 = __toESM(require("react"));
 
 // src/models.ts
+var STACK_DEFAULT = "__stack_default__";
 var providers = [
   { id: "deepseek", label: "Deepseek", model: "deepseek-chat", color: "#0EA5E9", free: true, logo: "https://assets.brokr.sh/sdk/deepseek_logo.png" },
   { id: "openai", label: "ChatGPT", model: "gpt-5.4-mini", color: "#10B981", free: false, logo: "https://assets.brokr.sh/sdk/gpt_logo.png" },
@@ -6091,7 +6095,7 @@ function PlanCard({
   const handleClick = (0, import_react22.useCallback)(() => {
     void onSelect(plan.slug);
   }, [plan.slug, onSelect]);
-  return /* @__PURE__ */ import_react22.default.createElement("article", { className: "brokr-card brokr-plan-card", "data-highlight": isHighlighted, key: plan.slug }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-3)" } }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "brokr-brand-row", style: { justifyContent: "space-between" } }, /* @__PURE__ */ import_react22.default.createElement("strong", null, plan.name), plan.isCurrent ? /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-badge" }, "Current") : null, isHighlighted && !plan.isCurrent ? /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-badge" }, "Recommended") : null), /* @__PURE__ */ import_react22.default.createElement("div", { className: "brokr-plan-price" }, /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-plan-value" }, plan.price === 0 ? "$0" : `$${(plan.price / 100).toFixed(0)}`), /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-copy" }, "/", plan.interval)), plan.trialDays ? /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-copy" }, plan.trialDays, " day trial included.") : null), /* @__PURE__ */ import_react22.default.createElement(
+  return /* @__PURE__ */ import_react22.default.createElement("article", { className: "brokr-card brokr-plan-card", "data-highlight": isHighlighted, key: plan.slug }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-3)" } }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "brokr-brand-row", style: { justifyContent: "space-between" } }, /* @__PURE__ */ import_react22.default.createElement("strong", null, plan.name), plan.isCurrent ? /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-badge" }, "Current") : null, isHighlighted && !plan.isCurrent ? /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-badge" }, "Recommended") : null), /* @__PURE__ */ import_react22.default.createElement("div", { className: "brokr-plan-price" }, /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-plan-value" }, plan.price === 0 ? "$0" : `$${(plan.price / 100).toFixed(0)}`), /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-copy" }, "/", plan.interval)), plan.trialDays ? /* @__PURE__ */ import_react22.default.createElement("span", { className: "brokr-copy" }, plan.trialDays, " day trial included.") : null), /* @__PURE__ */ import_react22.default.createElement("ul", { className: "brokr-feature-list" }, features.map(([key, value]) => /* @__PURE__ */ import_react22.default.createElement("li", { className: "brokr-feature-item", key }, /* @__PURE__ */ import_react22.default.createElement(CheckIcon, { size: 14 }), /* @__PURE__ */ import_react22.default.createElement("span", null, featureLabel(key), " \xB7 ", featureValueLabel(value))))), /* @__PURE__ */ import_react22.default.createElement(
     "button",
     {
       className: plan.isCurrent ? "brokr-button-secondary" : "brokr-button",
@@ -6100,7 +6104,7 @@ function PlanCard({
       type: "button"
     },
     plan.isCurrent ? "Current plan" : isPending ? "Redirecting" : "Choose plan"
-  ), /* @__PURE__ */ import_react22.default.createElement("ul", { className: "brokr-feature-list" }, features.map(([key, value]) => /* @__PURE__ */ import_react22.default.createElement("li", { className: "brokr-feature-item", key }, /* @__PURE__ */ import_react22.default.createElement(CheckIcon, { size: 14 }), /* @__PURE__ */ import_react22.default.createElement("span", null, featureLabel(key), " \xB7 ", featureValueLabel(value))))));
+  ));
 }
 function Plans({
   columns,
@@ -6327,15 +6331,32 @@ function CancelSubscription({ onCancel }) {
   return /* @__PURE__ */ import_react29.default.createElement("div", { className: "brokr-section", style: { gap: "0.75rem" } }, confirming ? /* @__PURE__ */ import_react29.default.createElement("div", { className: "brokr-inline-message" }, "Subscription changes are confirmed in billing. Continue?") : null, /* @__PURE__ */ import_react29.default.createElement("div", { className: "brokr-brand-row" }, /* @__PURE__ */ import_react29.default.createElement("button", { className: "brokr-button-ghost", disabled: isPending, onClick: handlePrimaryClick, type: "button" }, isPending ? "Opening billing" : confirming ? "Continue" : "Cancel subscription"), confirming ? /* @__PURE__ */ import_react29.default.createElement("button", { className: "brokr-button-secondary", onClick: handleDismiss, type: "button" }, "Keep subscription") : null));
 }
 
+// src/react/payments/UsageGrid.tsx
+var import_react30 = __toESM(require("react"));
+function UsageGrid() {
+  const { entitlements, isLoaded } = useBrokr();
+  const meteredFeatures = (0, import_react30.useMemo)(() => {
+    if (!entitlements?.features) return [];
+    return Object.entries(entitlements.features).filter(([_, check]) => check.limitType === "numeric").map(([slug]) => slug);
+  }, [entitlements]);
+  if (!isLoaded) {
+    return /* @__PURE__ */ import_react30.default.createElement("div", { className: "brokr-usage-grid" }, /* @__PURE__ */ import_react30.default.createElement(Skeleton, { height: 72 }), /* @__PURE__ */ import_react30.default.createElement(Skeleton, { height: 72 }));
+  }
+  if (meteredFeatures.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ import_react30.default.createElement("div", { className: "brokr-usage-grid" }, meteredFeatures.map((slug) => /* @__PURE__ */ import_react30.default.createElement(FeatureMeter, { key: slug, feature: slug })));
+}
+
 // src/react/chat/AIChat.tsx
-var import_react38 = __toESM(require("react"));
+var import_react39 = __toESM(require("react"));
 
 // src/react/chat/ChatContext.tsx
-var import_react30 = require("react");
-var InternalChatContext = (0, import_react30.createContext)(null);
+var import_react31 = require("react");
+var InternalChatContext = (0, import_react31.createContext)(null);
 var ChatProvider = InternalChatContext.Provider;
 function useChatState() {
-  const ctx = (0, import_react30.useContext)(InternalChatContext);
+  const ctx = (0, import_react31.useContext)(InternalChatContext);
   if (!ctx) {
     throw new Error("useChatState must be used within <AIChat>");
   }
@@ -6343,7 +6364,7 @@ function useChatState() {
 }
 
 // src/react/chat/useChat.ts
-var import_react31 = require("react");
+var import_react32 = require("react");
 
 // src/ai/types.ts
 function contentToText(content) {
@@ -6448,6 +6469,39 @@ function isSSEResponse(response) {
   return ct.includes("text/event-stream") && response.body !== null;
 }
 
+// src/react/chat/memory.ts
+var MAX_MEMORY_CHARS = 2e3;
+function serializeMemory(obj, prefix = "") {
+  const lines = [];
+  for (const [key, value] of Object.entries(obj)) {
+    if (value === null || value === void 0) continue;
+    const label = prefix ? `${prefix}.${key}` : key;
+    if (Array.isArray(value)) {
+      lines.push(`${label}: ${value.join(", ")}`);
+    } else if (typeof value === "object") {
+      lines.push(...serializeMemory(value, label));
+    } else {
+      lines.push(`${label}: ${String(value)}`);
+    }
+  }
+  return lines;
+}
+function buildEffectivePrompt(prompt, memory) {
+  if (!memory || Object.keys(memory).length === 0) return prompt;
+  let block = serializeMemory(memory).join("\n");
+  if (block.length > MAX_MEMORY_CHARS) {
+    block = block.slice(0, MAX_MEMORY_CHARS);
+    if (typeof console !== "undefined") {
+      console.warn("[brokr] memory exceeded 2000 char limit, truncated");
+    }
+  }
+  const memSection = `[User context]
+${block}`;
+  return prompt ? `${memSection}
+
+${prompt}` : memSection;
+}
+
 // src/react/chat/useChat.ts
 function makeId(prefix) {
   return `${prefix}_${crypto.randomUUID()}`;
@@ -6465,7 +6519,9 @@ function useChat(config) {
   const {
     endpoint,
     prompt,
-    model: activeModel,
+    explicitModel,
+    displayModel: activeModel,
+    memory,
     persist,
     surface,
     subject,
@@ -6483,48 +6539,64 @@ function useChat(config) {
     userId
   } = config;
   const isPersist = persist && !isControlled;
-  const [memConversations, setMemConversations] = (0, import_react31.useState)([]);
-  const [memActiveId, setMemActiveId] = (0, import_react31.useState)(null);
-  const [serverThreads, setServerThreads] = (0, import_react31.useState)([]);
-  const [serverActiveId, setServerActiveId] = (0, import_react31.useState)(null);
-  const [serverMessages, setServerMessages] = (0, import_react31.useState)([]);
-  const [input, setInput] = (0, import_react31.useState)("");
-  const [isSubmitting, setIsSubmitting] = (0, import_react31.useState)(false);
-  const [error, setError] = (0, import_react31.useState)(null);
-  const [threadsLoading, setThreadsLoading] = (0, import_react31.useState)(false);
-  const [renamingId, setRenamingId] = (0, import_react31.useState)(null);
-  const [renameValue, setRenameValue] = (0, import_react31.useState)("");
-  const [hasMoreMessages, setHasMoreMessages] = (0, import_react31.useState)(false);
-  const [loadingOlder, setLoadingOlder] = (0, import_react31.useState)(false);
-  const textareaRef = (0, import_react31.useRef)(null);
-  const bottomRef = (0, import_react31.useRef)(null);
-  const scrollContainerRef = (0, import_react31.useRef)(null);
-  const sentinelRef = (0, import_react31.useRef)(null);
-  const displaySidebarItems = (0, import_react31.useMemo)(() => {
-    if (isControlled) return threadsProp?.map((t) => ({ id: t.id, title: t.title })) ?? [];
-    if (isPersist) return serverThreads.map((t) => ({ id: t.id, title: t.title }));
-    return memConversations.map((c) => ({ id: c.id, title: c.title || "New chat" }));
+  const [memConversations, setMemConversations] = (0, import_react32.useState)([]);
+  const [memActiveId, setMemActiveId] = (0, import_react32.useState)(null);
+  const [serverThreads, setServerThreads] = (0, import_react32.useState)([]);
+  const [serverActiveId, setServerActiveId] = (0, import_react32.useState)(null);
+  const [serverMessages, setServerMessages] = (0, import_react32.useState)([]);
+  const [input, setInput] = (0, import_react32.useState)("");
+  const [isSubmitting, setIsSubmitting] = (0, import_react32.useState)(false);
+  const [error, setError] = (0, import_react32.useState)(null);
+  const [threadsLoading, setThreadsLoading] = (0, import_react32.useState)(false);
+  const [renamingId, setRenamingId] = (0, import_react32.useState)(null);
+  const [renameValue, setRenameValue] = (0, import_react32.useState)("");
+  const [hasMoreMessages, setHasMoreMessages] = (0, import_react32.useState)(false);
+  const [loadingOlder, setLoadingOlder] = (0, import_react32.useState)(false);
+  const textareaRef = (0, import_react32.useRef)(null);
+  const bottomRef = (0, import_react32.useRef)(null);
+  const scrollContainerRef = (0, import_react32.useRef)(null);
+  const sentinelRef = (0, import_react32.useRef)(null);
+  const displaySidebarItems = (0, import_react32.useMemo)(() => {
+    if (isControlled) {
+      return threadsProp?.map((t) => ({
+        id: t.id,
+        title: t.title,
+        updatedAt: t.updatedAt ?? null
+      })) ?? [];
+    }
+    if (isPersist) {
+      return serverThreads.map((t) => ({
+        id: t.id,
+        title: t.title,
+        updatedAt: t.updatedAt ?? null
+      }));
+    }
+    return memConversations.map((c) => ({
+      id: c.id,
+      title: c.title || "New chat",
+      updatedAt: new Date(c.updatedAt).toISOString()
+    }));
   }, [isControlled, isPersist, threadsProp, serverThreads, memConversations]);
-  const activeId = (0, import_react31.useMemo)(() => {
+  const activeId = (0, import_react32.useMemo)(() => {
     if (isControlled) return activeThreadIdProp ?? null;
     if (isPersist) return serverActiveId;
     return memActiveId;
   }, [isControlled, isPersist, activeThreadIdProp, serverActiveId, memActiveId]);
-  const displayMessages = (0, import_react31.useMemo)(() => {
+  const displayMessages = (0, import_react32.useMemo)(() => {
     if (isControlled) return messagesProp ?? [];
     if (isPersist) return serverMessages;
     return memConversations.find((c) => c.id === memActiveId)?.messages ?? [];
   }, [isControlled, isPersist, messagesProp, serverMessages, memConversations, memActiveId]);
-  const activeMemConv = (0, import_react31.useMemo)(
+  const activeMemConv = (0, import_react32.useMemo)(
     () => memConversations.find((c) => c.id === memActiveId) ?? null,
     [memConversations, memActiveId]
   );
-  const activeThread = (0, import_react31.useMemo)(() => {
+  const activeThread = (0, import_react32.useMemo)(() => {
     if (isControlled) return threadsProp?.find((t) => t.id === activeId) ?? null;
     if (isPersist) return serverThreads.find((t) => t.id === activeId) ?? null;
     return null;
   }, [isControlled, isPersist, threadsProp, serverThreads, activeId]);
-  const renderedTitle = (0, import_react31.useMemo)(() => {
+  const renderedTitle = (0, import_react32.useMemo)(() => {
     if (isPersist && activeThread) return activeThread.title;
     if (!isPersist && activeMemConv) {
       if (activeMemConv.titleState === "loading") return "Naming conversation";
@@ -6533,10 +6605,10 @@ function useChat(config) {
     return "New chat";
   }, [isPersist, activeThread, activeMemConv]);
   const isTitleLoading = !isPersist && activeMemConv?.titleState === "loading";
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     bottomRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [displayMessages, activeId]);
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     if (!isPersist) return;
     setThreadsLoading(true);
     const base = getBaseEndpoint(endpoint);
@@ -6545,7 +6617,7 @@ function useChat(config) {
     fetch(`${base}/threads?${params}`, { credentials: "include" }).then((r) => r.json()).then((data) => setServerThreads(data.threads ?? [])).catch(() => {
     }).finally(() => setThreadsLoading(false));
   }, [isPersist, endpoint, surface, subject]);
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     if (!isPersist || !serverActiveId || isSubmitting) return;
     const base = getBaseEndpoint(endpoint);
     fetch(`${base}/threads/${serverActiveId}/messages?limit=30&offset=0`, { credentials: "include" }).then((r) => r.json()).then((data) => {
@@ -6554,7 +6626,7 @@ function useChat(config) {
     }).catch(() => {
     });
   }, [isPersist, serverActiveId, endpoint, isSubmitting]);
-  const loadOlderMessages = (0, import_react31.useCallback)(async () => {
+  const loadOlderMessages = (0, import_react32.useCallback)(async () => {
     if (!isPersist || !serverActiveId || loadingOlder || !hasMoreMessages) return;
     setLoadingOlder(true);
     const base = getBaseEndpoint(endpoint);
@@ -6584,7 +6656,7 @@ function useChat(config) {
       setLoadingOlder(false);
     }
   }, [isPersist, serverActiveId, loadingOlder, hasMoreMessages, endpoint, serverMessages.length]);
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     if (!isPersist || !hasMoreMessages) return;
     const sentinel = sentinelRef.current;
     if (!sentinel) return;
@@ -6597,15 +6669,15 @@ function useChat(config) {
     observer.observe(sentinel);
     return () => observer.disconnect();
   }, [isPersist, hasMoreMessages, loadOlderMessages]);
-  const notificationsCtx = (0, import_react31.useContext)(NotificationsContext);
-  (0, import_react31.useEffect)(() => {
+  const notificationsCtx = (0, import_react32.useContext)(NotificationsContext);
+  (0, import_react32.useEffect)(() => {
     if (!notificationsCtx || !serverActiveId) return;
     notificationsCtx.registerViewingThread(serverActiveId);
     return () => {
       notificationsCtx.unregisterViewingThread(serverActiveId);
     };
   }, [notificationsCtx, serverActiveId]);
-  (0, import_react31.useEffect)(() => {
+  (0, import_react32.useEffect)(() => {
     if (!onThreadChange) return;
     if (isControlled || isPersist) {
       onThreadChange(activeThread);
@@ -6626,23 +6698,23 @@ function useChat(config) {
       }
     }
   }, [activeThread, onThreadChange, isControlled, isPersist, memConversations, memActiveId, surface, subject]);
-  const updateMemMessages = (0, import_react31.useCallback)((convId, msgs) => {
+  const updateMemMessages = (0, import_react32.useCallback)((convId, msgs) => {
     setMemConversations((prev) => prev.map((c) => c.id === convId ? { ...c, messages: msgs, updatedAt: Date.now() } : c).sort((a, b) => b.updatedAt - a.updatedAt));
   }, []);
-  const updateMemTitle = (0, import_react31.useCallback)((convId, t) => {
+  const updateMemTitle = (0, import_react32.useCallback)((convId, t) => {
     setMemConversations((prev) => prev.map((c) => c.id === convId ? { ...c, title: t, titleState: t ? "ready" : c.titleState, updatedAt: Date.now() } : c));
   }, []);
-  const setMemTitleState = (0, import_react31.useCallback)((convId, state) => {
+  const setMemTitleState = (0, import_react32.useCallback)((convId, state) => {
     setMemConversations((prev) => prev.map((c) => c.id === convId ? { ...c, titleState: state, updatedAt: Date.now() } : c));
   }, []);
-  const appendMemDelta = (0, import_react31.useCallback)((convId, msgId, delta) => {
+  const appendMemDelta = (0, import_react32.useCallback)((convId, msgId, delta) => {
     setMemConversations((prev) => prev.map((c) => c.id === convId ? {
       ...c,
       messages: c.messages.map((m) => m.id === msgId ? { ...m, content: `${m.content}${delta}` } : m),
       updatedAt: Date.now()
     } : c));
   }, []);
-  const animateTitle = (0, import_react31.useCallback)(async (convId, raw) => {
+  const animateTitle = (0, import_react32.useCallback)(async (convId, raw) => {
     const safe = sanitizeTitle(raw);
     setMemTitleState(convId, "loading");
     updateMemTitle(convId, "");
@@ -6654,7 +6726,7 @@ function useChat(config) {
     }
     setMemTitleState(convId, "ready");
   }, [setMemTitleState, updateMemTitle]);
-  const ensureMemConversation = (0, import_react31.useCallback)(() => {
+  const ensureMemConversation = (0, import_react32.useCallback)(() => {
     if (memActiveId) return memActiveId;
     const id = makeId("conv");
     setMemConversations((prev) => [{
@@ -6667,7 +6739,7 @@ function useChat(config) {
     setMemActiveId(id);
     return id;
   }, [memActiveId]);
-  const sendMemoryMessage = (0, import_react31.useCallback)(async (content) => {
+  const sendMemoryMessage = (0, import_react32.useCallback)(async (content) => {
     const convId = ensureMemConversation();
     const userMsg = { id: makeId("msg"), role: "user", content };
     const assistantMsg = { id: makeId("msg"), role: "assistant", content: "", model: activeModel };
@@ -6684,8 +6756,11 @@ function useChat(config) {
         messages: trimToTokenBudget(
           nextMessages.filter((m) => m.role === "user" || m.role === "assistant" && m.content).map(({ content: mc, role }) => ({ role, content: mc }))
         ),
-        model: activeModel,
-        ...prompt ? { systemPrompt: prompt } : {}
+        ...explicitModel ? { model: explicitModel } : {},
+        ...(() => {
+          const ep = buildEffectivePrompt(prompt, memory);
+          return ep ? { systemPrompt: ep } : {};
+        })()
       })
     });
     if (!response.ok) {
@@ -6730,8 +6805,10 @@ function useChat(config) {
     ensureMemConversation,
     memConversations,
     endpoint,
+    explicitModel,
     activeModel,
     prompt,
+    memory,
     updateMemMessages,
     appendMemDelta,
     animateTitle,
@@ -6739,7 +6816,7 @@ function useChat(config) {
     setMemTitleState,
     onMessage
   ]);
-  const sendPersistMessage = (0, import_react31.useCallback)(async (content) => {
+  const sendPersistMessage = (0, import_react32.useCallback)(async (content) => {
     const userMsg = { id: makeId("msg"), role: "user", content, status: "complete" };
     const assistantMsg = { id: makeId("msg"), role: "assistant", content: "", model: activeModel, status: "pending" };
     setServerMessages((prev) => [...prev, userMsg, assistantMsg]);
@@ -6753,9 +6830,12 @@ function useChat(config) {
         content,
         surface,
         subject: subject ?? null,
-        model: activeModel,
+        ...explicitModel ? { model: explicitModel } : {},
         userId: userId ?? void 0,
-        ...prompt ? { systemPrompt: prompt } : {}
+        ...(() => {
+          const ep = buildEffectivePrompt(prompt, memory);
+          return ep ? { systemPrompt: ep } : {};
+        })()
       })
     });
     if (!response.ok) {
@@ -6810,8 +6890,10 @@ function useChat(config) {
     endpoint,
     surface,
     subject,
+    explicitModel,
     activeModel,
     prompt,
+    memory,
     userId,
     setServerMessages,
     setServerActiveId,
@@ -6819,7 +6901,7 @@ function useChat(config) {
     onMessage,
     onThreadCreate
   ]);
-  const sendMessage = (0, import_react31.useCallback)(async (rawText) => {
+  const sendMessage = (0, import_react32.useCallback)(async (rawText) => {
     const content = (rawText ?? input).trim();
     if (!content || isSubmitting) return;
     setInput("");
@@ -6859,7 +6941,7 @@ function useChat(config) {
       setIsSubmitting(false);
     }
   }, [input, isSubmitting, isControlled, isPersist, onSendMessage, activeId, sendPersistMessage, sendMemoryMessage, memActiveId]);
-  const startNewChat = (0, import_react31.useCallback)(() => {
+  const startNewChat = (0, import_react32.useCallback)(() => {
     if (isControlled) {
       onThreadSelect?.(null);
     } else if (isPersist) {
@@ -6874,7 +6956,7 @@ function useChat(config) {
       textareaRef.current?.focus();
     });
   }, [isControlled, isPersist, onThreadSelect]);
-  const selectThread = (0, import_react31.useCallback)((id) => {
+  const selectThread = (0, import_react32.useCallback)((id) => {
     if (isControlled) {
       onThreadSelect?.(id);
     } else if (isPersist) {
@@ -6885,7 +6967,7 @@ function useChat(config) {
       setError(null);
     }
   }, [isControlled, isPersist, onThreadSelect]);
-  const deleteThread = (0, import_react31.useCallback)(async (threadId) => {
+  const deleteThread = (0, import_react32.useCallback)(async (threadId) => {
     if (isControlled) {
       onThreadDelete?.(threadId);
       return;
@@ -6904,12 +6986,12 @@ function useChat(config) {
       if (memActiveId === threadId) setMemActiveId(null);
     }
   }, [isControlled, isPersist, serverActiveId, endpoint, memActiveId, onThreadDelete]);
-  const startRename = (0, import_react31.useCallback)((threadId) => {
+  const startRename = (0, import_react32.useCallback)((threadId) => {
     const item = displaySidebarItems.find((t) => t.id === threadId);
     setRenamingId(threadId);
     setRenameValue(item?.title ?? "");
   }, [displaySidebarItems]);
-  const submitRename = (0, import_react31.useCallback)(async () => {
+  const submitRename = (0, import_react32.useCallback)(async () => {
     if (!renamingId || !renameValue.trim()) {
       setRenamingId(null);
       return;
@@ -6968,7 +7050,7 @@ function useChat(config) {
 }
 
 // src/react/chat/ModelSelector.tsx
-var import_react32 = __toESM(require("react"));
+var import_react33 = __toESM(require("react"));
 function ModelOption({
   provider,
   isActive,
@@ -6976,14 +7058,14 @@ function ModelOption({
   onSelect,
   onCheckout
 }) {
-  const handleClick = (0, import_react32.useCallback)(() => {
+  const handleClick = (0, import_react33.useCallback)(() => {
     if (isLocked) {
       void onCheckout({ plan: "pro" });
     } else {
       onSelect(provider.model);
     }
   }, [isLocked, onCheckout, onSelect, provider.model]);
-  return /* @__PURE__ */ import_react32.default.createElement(
+  return /* @__PURE__ */ import_react33.default.createElement(
     "button",
     {
       "aria-selected": isActive,
@@ -6995,9 +7077,9 @@ function ModelOption({
       title: isLocked ? "Add credits to unlock" : void 0,
       type: "button"
     },
-    /* @__PURE__ */ import_react32.default.createElement("img", { alt: "", className: "brokr-model-logo", src: provider.logo }),
-    /* @__PURE__ */ import_react32.default.createElement("span", { className: "brokr-model-option-label" }, provider.label),
-    isLocked ? /* @__PURE__ */ import_react32.default.createElement("span", { className: "brokr-model-lock", "aria-hidden": "true" }, /* @__PURE__ */ import_react32.default.createElement(LockIcon, { size: 13 })) : null
+    /* @__PURE__ */ import_react33.default.createElement("img", { alt: "", className: "brokr-model-logo", src: provider.logo }),
+    /* @__PURE__ */ import_react33.default.createElement("span", { className: "brokr-model-option-label" }, provider.label),
+    isLocked ? /* @__PURE__ */ import_react33.default.createElement("span", { className: "brokr-model-lock", "aria-hidden": "true" }, /* @__PURE__ */ import_react33.default.createElement(LockIcon, { size: 13 })) : null
   );
 }
 function ModelSelector({
@@ -7006,17 +7088,22 @@ function ModelSelector({
   availableProviders,
   checkout
 }) {
-  const [selectorOpen, setSelectorOpen] = (0, import_react32.useState)(false);
-  const selectorRef = (0, import_react32.useRef)(null);
-  const activeProvider = (0, import_react32.useMemo)(
-    () => providers.find((p) => p.model === activeModel) ?? providers[0],
-    [activeModel]
+  const [selectorOpen, setSelectorOpen] = (0, import_react33.useState)(false);
+  const selectorRef = (0, import_react33.useRef)(null);
+  const isAuto = activeModel === STACK_DEFAULT || !providers.some((p) => p.model === activeModel);
+  const activeProvider = (0, import_react33.useMemo)(
+    () => isAuto ? void 0 : providers.find((p) => p.model === activeModel) ?? providers[0],
+    [activeModel, isAuto]
   );
-  const handleModelSelect = (0, import_react32.useCallback)((model) => {
-    setSelectedModel(model);
+  const handleModelSelect = (0, import_react33.useCallback)((model) => {
+    setSelectedModel(model === STACK_DEFAULT ? null : model);
     setSelectorOpen(false);
   }, [setSelectedModel]);
-  (0, import_react32.useEffect)(() => {
+  const handleAutoSelect = (0, import_react33.useCallback)(() => {
+    setSelectedModel(null);
+    setSelectorOpen(false);
+  }, [setSelectedModel]);
+  (0, import_react33.useEffect)(() => {
     if (!selectorOpen) return;
     const onMouseDown = (e) => {
       if (!selectorRef.current?.contains(e.target)) setSelectorOpen(false);
@@ -7031,10 +7118,10 @@ function ModelSelector({
       document.removeEventListener("keydown", onKeyDown);
     };
   }, [selectorOpen]);
-  const handleToggle = (0, import_react32.useCallback)(() => {
+  const handleToggle = (0, import_react33.useCallback)(() => {
     setSelectorOpen((v) => !v);
   }, []);
-  return /* @__PURE__ */ import_react32.default.createElement("div", { className: "brokr-model-selector", ref: selectorRef }, /* @__PURE__ */ import_react32.default.createElement(
+  return /* @__PURE__ */ import_react33.default.createElement("div", { className: "brokr-model-selector", ref: selectorRef }, /* @__PURE__ */ import_react33.default.createElement(
     "button",
     {
       "aria-expanded": selectorOpen,
@@ -7043,15 +7130,26 @@ function ModelSelector({
       onClick: handleToggle,
       type: "button"
     },
-    activeProvider ? /* @__PURE__ */ import_react32.default.createElement("img", { alt: "", className: "brokr-model-logo", src: activeProvider.logo }) : /* @__PURE__ */ import_react32.default.createElement("span", { className: "brokr-model-dot", style: { background: "currentColor" } }),
-    activeProvider?.label ?? "Model",
-    /* @__PURE__ */ import_react32.default.createElement(ChevronDownIcon, { size: 13 })
-  ), selectorOpen ? /* @__PURE__ */ import_react32.default.createElement("div", { className: "brokr-model-dropdown", role: "listbox" }, providers.map((p) => /* @__PURE__ */ import_react32.default.createElement(
+    activeProvider ? /* @__PURE__ */ import_react33.default.createElement("img", { alt: "", className: "brokr-model-logo", src: activeProvider.logo }) : /* @__PURE__ */ import_react33.default.createElement("span", { className: "brokr-model-dot", style: { background: "#6B7280" } }),
+    isAuto ? "Auto" : activeProvider?.label ?? "Model",
+    /* @__PURE__ */ import_react33.default.createElement(ChevronDownIcon, { size: 13 })
+  ), selectorOpen ? /* @__PURE__ */ import_react33.default.createElement("div", { className: "brokr-model-dropdown", role: "listbox" }, /* @__PURE__ */ import_react33.default.createElement(
+    "button",
+    {
+      "aria-selected": isAuto,
+      className: "brokr-model-option",
+      "data-active": isAuto,
+      onClick: handleAutoSelect,
+      type: "button"
+    },
+    /* @__PURE__ */ import_react33.default.createElement("span", { className: "brokr-model-dot", style: { background: "#6B7280" } }),
+    /* @__PURE__ */ import_react33.default.createElement("span", { className: "brokr-model-option-label" }, "Stack Default")
+  ), providers.map((p) => /* @__PURE__ */ import_react33.default.createElement(
     ModelOption,
     {
       key: p.id,
       provider: p,
-      isActive: p.model === activeModel,
+      isActive: !isAuto && p.model === activeModel,
       isLocked: !availableProviders.some((a) => a.id === p.id),
       onSelect: handleModelSelect,
       onCheckout: checkout
@@ -7060,10 +7158,10 @@ function ModelSelector({
 }
 
 // src/react/chat/ThreadSidebar.tsx
-var import_react33 = __toESM(require("react"));
+var import_react34 = __toESM(require("react"));
 function ThreadItemButton({ id, title, isActive, onSelect }) {
-  const handleClick = (0, import_react33.useCallback)(() => onSelect(id), [id, onSelect]);
-  return /* @__PURE__ */ import_react33.default.createElement(
+  const handleClick = (0, import_react34.useCallback)(() => onSelect(id), [id, onSelect]);
+  return /* @__PURE__ */ import_react34.default.createElement(
     "button",
     {
       className: "brokr-ai-chat-conversation",
@@ -7071,9 +7169,40 @@ function ThreadItemButton({ id, title, isActive, onSelect }) {
       onClick: handleClick,
       type: "button"
     },
-    title
+    /* @__PURE__ */ import_react34.default.createElement(MessageIcon, { size: 12 }),
+    /* @__PURE__ */ import_react34.default.createElement("span", { className: "brokr-ai-chat-conversation-label" }, title)
   );
 }
+var SIDEBAR_GROUP_ORDER = [
+  "today",
+  "yesterday",
+  "this_week",
+  "this_month",
+  "earlier",
+  "undated"
+];
+var SIDEBAR_GROUP_LABELS = {
+  today: "Today",
+  yesterday: "Yesterday",
+  this_week: "This Week",
+  this_month: "This Month",
+  earlier: "Earlier",
+  undated: "Recent"
+};
+function resolveSidebarDateGroup(updatedAt) {
+  if (!updatedAt) return "undated";
+  const parsed = new Date(updatedAt);
+  if (Number.isNaN(parsed.getTime())) return "undated";
+  const now = /* @__PURE__ */ new Date();
+  const startOfToday = new Date(now.getFullYear(), now.getMonth(), now.getDate());
+  const startOfTarget = new Date(parsed.getFullYear(), parsed.getMonth(), parsed.getDate());
+  const diffDays = Math.floor((startOfToday.getTime() - startOfTarget.getTime()) / 864e5);
+  if (diffDays <= 0) return "today";
+  if (diffDays === 1) return "yesterday";
+  if (diffDays < 7) return "this_week";
+  if (diffDays < 30) return "this_month";
+  return "earlier";
+}
 function ThreadSidebar() {
   const {
     startNewChat,
@@ -7087,11 +7216,11 @@ function ThreadSidebar() {
     activeId,
     selectThreadAndCloseSidebar
   } = useChatState();
-  const handleNewChat = (0, import_react33.useCallback)(() => {
+  const handleNewChat = (0, import_react34.useCallback)(() => {
     startNewChat();
     closeSidebar();
   }, [startNewChat, closeSidebar]);
-  const handleRenameKeyDown = (0, import_react33.useCallback)((e) => {
+  const handleRenameKeyDown = (0, import_react34.useCallback)((e) => {
     if (e.key === "Enter") {
       e.preventDefault();
       void submitRename();
@@ -7099,20 +7228,37 @@ function ThreadSidebar() {
     if (e.key === "Escape") {
     }
   }, [submitRename]);
-  const handleRenameBlur = (0, import_react33.useCallback)(() => {
+  const handleRenameBlur = (0, import_react34.useCallback)(() => {
     void submitRename();
   }, [submitRename]);
-  const handleRenameChange = (0, import_react33.useCallback)((e) => {
+  const handleRenameChange = (0, import_react34.useCallback)((e) => {
     setRenameValue(e.target.value);
   }, [setRenameValue]);
-  const content = (0, import_react33.useMemo)(() => {
+  const groupedSidebarItems = (0, import_react34.useMemo)(() => {
+    const grouped = /* @__PURE__ */ new Map();
+    for (const item of displaySidebarItems) {
+      const key = resolveSidebarDateGroup(item.updatedAt);
+      const bucket = grouped.get(key);
+      if (bucket) {
+        bucket.push(item);
+      } else {
+        grouped.set(key, [item]);
+      }
+    }
+    return SIDEBAR_GROUP_ORDER.map((key) => ({
+      key,
+      label: SIDEBAR_GROUP_LABELS[key],
+      items: grouped.get(key) ?? []
+    })).filter((group) => group.items.length > 0);
+  }, [displaySidebarItems]);
+  const content = (0, import_react34.useMemo)(() => {
     if (threadsLoading && displaySidebarItems.length === 0) {
-      return /* @__PURE__ */ import_react33.default.createElement("div", { style: { display: "grid", gap: "0.5rem", padding: "0 0.65rem" } }, /* @__PURE__ */ import_react33.default.createElement(Skeleton, { width: "75%", height: 14, radius: 6 }), /* @__PURE__ */ import_react33.default.createElement(Skeleton, { width: "60%", height: 14, radius: 6 }), /* @__PURE__ */ import_react33.default.createElement(Skeleton, { width: "85%", height: 14, radius: 6 }));
+      return /* @__PURE__ */ import_react34.default.createElement("div", { className: "brokr-ai-chat-sidebar-skeleton" }, /* @__PURE__ */ import_react34.default.createElement(Skeleton, { width: "75%", height: 14, radius: 6 }), /* @__PURE__ */ import_react34.default.createElement(Skeleton, { width: "60%", height: 14, radius: 6 }), /* @__PURE__ */ import_react34.default.createElement(Skeleton, { width: "85%", height: 14, radius: 6 }));
     }
     if (displaySidebarItems.length === 0) {
-      return /* @__PURE__ */ import_react33.default.createElement("div", { className: "brokr-ai-chat-sidebar-empty" }, /* @__PURE__ */ import_react33.default.createElement("p", { className: "brokr-ai-chat-sidebar-empty-text" }, "No conversations yet. Start one above."));
+      return /* @__PURE__ */ import_react34.default.createElement("div", { className: "brokr-ai-chat-sidebar-empty" }, /* @__PURE__ */ import_react34.default.createElement("p", { className: "brokr-ai-chat-sidebar-empty-text" }, "No conversations yet. Start one above."));
     }
-    return /* @__PURE__ */ import_react33.default.createElement("div", { className: "brokr-ai-chat-conversations" }, displaySidebarItems.map((item) => renamingId === item.id ? /* @__PURE__ */ import_react33.default.createElement(
+    return /* @__PURE__ */ import_react34.default.createElement("div", { className: "brokr-ai-chat-sidebar-groups" }, groupedSidebarItems.map((group) => /* @__PURE__ */ import_react34.default.createElement("section", { className: "brokr-ai-chat-sidebar-group", key: group.key }, /* @__PURE__ */ import_react34.default.createElement("span", { className: "brokr-ai-chat-sidebar-kicker" }, group.label), /* @__PURE__ */ import_react34.default.createElement("div", { className: "brokr-ai-chat-conversations" }, group.items.map((item) => renamingId === item.id ? /* @__PURE__ */ import_react34.default.createElement(
       "input",
       {
         autoFocus: true,
@@ -7123,7 +7269,7 @@ function ThreadSidebar() {
         onKeyDown: handleRenameKeyDown,
         value: renameValue
       }
-    ) : /* @__PURE__ */ import_react33.default.createElement(
+    ) : /* @__PURE__ */ import_react34.default.createElement(
       ThreadItemButton,
       {
         key: item.id,
@@ -7132,29 +7278,30 @@ function ThreadSidebar() {
         isActive: item.id === activeId,
         onSelect: selectThreadAndCloseSidebar
       }
-    )));
+    ))))));
   }, [
     threadsLoading,
     displaySidebarItems,
     renamingId,
     renameValue,
+    groupedSidebarItems,
     activeId,
     selectThreadAndCloseSidebar,
     handleRenameBlur,
     handleRenameChange,
     handleRenameKeyDown
   ]);
-  return /* @__PURE__ */ import_react33.default.createElement(import_react33.default.Fragment, null, /* @__PURE__ */ import_react33.default.createElement("button", { className: "brokr-ai-chat-sidebar-button", onClick: handleNewChat, type: "button" }, /* @__PURE__ */ import_react33.default.createElement(MessageIcon, { size: 16 }), "New chat"), content);
+  return /* @__PURE__ */ import_react34.default.createElement(import_react34.default.Fragment, null, /* @__PURE__ */ import_react34.default.createElement("button", { className: "brokr-ai-chat-sidebar-new-chat", onClick: handleNewChat, type: "button" }, /* @__PURE__ */ import_react34.default.createElement(MessageIcon, { size: 16 }), "New chat"), content);
 }
 
 // src/react/chat/MessagePane.tsx
-var import_react36 = __toESM(require("react"));
+var import_react37 = __toESM(require("react"));
 
 // src/react/chat/MessageBubble.tsx
-var import_react35 = __toESM(require("react"));
+var import_react36 = __toESM(require("react"));
 
 // src/react/chat/MarkdownRenderer.tsx
-var import_react34 = __toESM(require("react"));
+var import_react35 = __toESM(require("react"));
 function parseInline(text) {
   const nodes = [];
   let remaining = text;
@@ -7162,19 +7309,25 @@ function parseInline(text) {
   while (remaining) {
     const codeMatch = remaining.match(/^`([^`]+)`/);
     if (codeMatch) {
-      nodes.push(/* @__PURE__ */ import_react34.default.createElement("code", { className: "brokr-md-inline-code", key: key++ }, codeMatch[1]));
+      nodes.push(/* @__PURE__ */ import_react35.default.createElement("code", { className: "brokr-md-inline-code", key: key++ }, codeMatch[1]));
       remaining = remaining.slice(codeMatch[0].length);
       continue;
     }
     const boldMatch = remaining.match(/^\*\*(.+?)\*\*/);
     if (boldMatch) {
-      nodes.push(/* @__PURE__ */ import_react34.default.createElement("strong", { key: key++ }, boldMatch[1]));
+      nodes.push(/* @__PURE__ */ import_react35.default.createElement("strong", { key: key++ }, boldMatch[1]));
       remaining = remaining.slice(boldMatch[0].length);
       continue;
     }
+    const strikethroughMatch = remaining.match(/^~~(.+?)~~/);
+    if (strikethroughMatch) {
+      nodes.push(/* @__PURE__ */ import_react35.default.createElement("del", { key: key++ }, strikethroughMatch[1]));
+      remaining = remaining.slice(strikethroughMatch[0].length);
+      continue;
+    }
     const italicMatch = remaining.match(/^\*(.+?)\*/);
     if (italicMatch) {
-      nodes.push(/* @__PURE__ */ import_react34.default.createElement("em", { key: key++ }, italicMatch[1]));
+      nodes.push(/* @__PURE__ */ import_react35.default.createElement("em", { key: key++ }, italicMatch[1]));
       remaining = remaining.slice(italicMatch[0].length);
       continue;
     }
@@ -7183,12 +7336,12 @@ function parseInline(text) {
       const rawHref = linkMatch[2];
       const isSafe = /^https?:\/\//i.test(rawHref) || /^mailto:/i.test(rawHref);
       nodes.push(
-        /* @__PURE__ */ import_react34.default.createElement("a", { className: "brokr-md-link", href: isSafe ? rawHref : "#", key: key++, rel: "noopener noreferrer", target: "_blank" }, linkMatch[1])
+        /* @__PURE__ */ import_react35.default.createElement("a", { className: "brokr-md-link", href: isSafe ? rawHref : "#", key: key++, rel: "noopener noreferrer", target: "_blank" }, linkMatch[1])
       );
       remaining = remaining.slice(linkMatch[0].length);
       continue;
     }
-    const nextSpecial = remaining.search(/[`*\[]/);
+    const nextSpecial = remaining.search(/[`*~\[]/);
     if (nextSpecial === -1) {
       nodes.push(remaining);
       break;
@@ -7204,10 +7357,10 @@ function parseInline(text) {
   return nodes;
 }
 function CodeBlock({ code, language }) {
-  const handleCopy = (0, import_react34.useCallback)(() => {
+  const handleCopy = (0, import_react35.useCallback)(() => {
     void navigator.clipboard?.writeText(code);
   }, [code]);
-  return /* @__PURE__ */ import_react34.default.createElement("div", { className: "brokr-md-codeblock" }, /* @__PURE__ */ import_react34.default.createElement("div", { className: "brokr-md-codeblock-header" }, /* @__PURE__ */ import_react34.default.createElement("span", { className: "brokr-md-codeblock-lang" }, language || "code"), /* @__PURE__ */ import_react34.default.createElement(
+  return /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-md-codeblock" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-md-codeblock-header" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "brokr-md-codeblock-lang" }, language || "code"), /* @__PURE__ */ import_react35.default.createElement(
     "button",
     {
       "aria-label": "Copy code",
@@ -7215,9 +7368,18 @@ function CodeBlock({ code, language }) {
       onClick: handleCopy,
       type: "button"
     },
-    /* @__PURE__ */ import_react34.default.createElement(CopyIcon, { size: 13 }),
+    /* @__PURE__ */ import_react35.default.createElement(CopyIcon, { size: 13 }),
     "Copy"
-  )), /* @__PURE__ */ import_react34.default.createElement("pre", { className: "brokr-md-codeblock-pre" }, /* @__PURE__ */ import_react34.default.createElement("code", null, code)));
+  )), /* @__PURE__ */ import_react35.default.createElement("pre", { className: "brokr-md-codeblock-pre" }, /* @__PURE__ */ import_react35.default.createElement("code", null, code)));
+}
+function looksLikeTableSeparator(line) {
+  const trimmed = line.trim();
+  return /^\|?\s*:?-{3,}:?\s*(\|\s*:?-{3,}:?\s*)+\|?$/.test(trimmed);
+}
+function splitTableRow(line) {
+  const trimmed = line.trim();
+  const withoutEdges = trimmed.replace(/^\|/, "").replace(/\|$/, "");
+  return withoutEdges.split("|").map((cell) => cell.trim());
 }
 function parseBlocks(text) {
   const blocks = [];
@@ -7248,22 +7410,44 @@ function parseBlocks(text) {
       i++;
       continue;
     }
+    if (line.includes("|") && i + 1 < lines.length && looksLikeTableSeparator(lines[i + 1] ?? "")) {
+      const headers = splitTableRow(line);
+      const rows = [];
+      i += 2;
+      while (i < lines.length) {
+        const candidate = lines[i] ?? "";
+        if (!candidate.trim() || !candidate.includes("|")) break;
+        rows.push(splitTableRow(candidate));
+        i++;
+      }
+      blocks.push({ type: "table", content: "", headers, rows });
+      continue;
+    }
+    if (/^[\s]*>\s?/.test(line)) {
+      const quoteLines = [];
+      while (i < lines.length && /^[\s]*>\s?/.test(lines[i])) {
+        quoteLines.push(lines[i].replace(/^[\s]*>\s?/, ""));
+        i++;
+      }
+      blocks.push({ type: "quote", content: "", items: quoteLines });
+      continue;
+    }
     if (/^[\s]*[-*]\s+/.test(line)) {
       const items = [];
       while (i < lines.length && /^[\s]*[-*]\s+/.test(lines[i])) {
         items.push(lines[i].replace(/^[\s]*[-*]\s+/, ""));
         i++;
       }
-      blocks.push({ type: "list", content: "", items });
+      blocks.push({ type: "list", content: "", items, ordered: false });
       continue;
     }
-    if (/^[\s]*\d+\.\s+/.test(line)) {
+    if (/^[\s]*\d+[.)]\s+/.test(line)) {
       const items = [];
-      while (i < lines.length && /^[\s]*\d+\.\s+/.test(lines[i])) {
-        items.push(lines[i].replace(/^[\s]*\d+\.\s+/, ""));
+      while (i < lines.length && /^[\s]*\d+[.)]\s+/.test(lines[i])) {
+        items.push(lines[i].replace(/^[\s]*\d+[.)]\s+/, ""));
         i++;
       }
-      blocks.push({ type: "list", content: "", items });
+      blocks.push({ type: "list", content: "", items, ordered: true });
       continue;
     }
     if (!line.trim()) {
@@ -7272,7 +7456,7 @@ function parseBlocks(text) {
     }
     const paraLines = [line];
     i++;
-    while (i < lines.length && lines[i].trim() && !lines[i].trimStart().startsWith("```") && !lines[i].match(/^#{1,6}\s/) && !/^(-{3,}|\*{3,}|_{3,})\s*$/.test(lines[i].trim()) && !/^[\s]*[-*]\s+/.test(lines[i]) && !/^[\s]*\d+\.\s+/.test(lines[i])) {
+    while (i < lines.length && lines[i].trim() && !lines[i].trimStart().startsWith("```") && !lines[i].match(/^#{1,6}\s/) && !(lines[i].includes("|") && i + 1 < lines.length && looksLikeTableSeparator(lines[i + 1] ?? "")) && !/^(-{3,}|\*{3,}|_{3,})\s*$/.test(lines[i].trim()) && !/^[\s]*>\s?/.test(lines[i]) && !/^[\s]*[-*]\s+/.test(lines[i]) && !/^[\s]*\d+[.)]\s+/.test(lines[i])) {
       paraLines.push(lines[i]);
       i++;
     }
@@ -7284,41 +7468,48 @@ function renderBlocks(blocks) {
   return blocks.map((block, idx) => {
     switch (block.type) {
       case "code":
-        return /* @__PURE__ */ import_react34.default.createElement(CodeBlock, { code: block.content, key: idx, language: block.language });
+        return /* @__PURE__ */ import_react35.default.createElement(CodeBlock, { code: block.content, key: idx, language: block.language });
       case "divider":
-        return /* @__PURE__ */ import_react34.default.createElement("hr", { className: "brokr-md-divider", key: idx });
+        return /* @__PURE__ */ import_react35.default.createElement("hr", { className: "brokr-md-divider", key: idx });
       case "heading": {
         const Tag = `h${Math.min(block.level ?? 3, 6)}`;
-        return /* @__PURE__ */ import_react34.default.createElement(Tag, { className: `brokr-md-heading brokr-md-h${block.level}`, key: idx }, parseInline(block.content));
+        return /* @__PURE__ */ import_react35.default.createElement(Tag, { className: `brokr-md-heading brokr-md-h${block.level}`, key: idx }, parseInline(block.content));
       }
       case "list":
-        return /* @__PURE__ */ import_react34.default.createElement("ul", { className: "brokr-md-list", key: idx }, block.items?.map((item, li) => /* @__PURE__ */ import_react34.default.createElement("li", { key: li }, parseInline(item))));
+        if (block.ordered) {
+          return /* @__PURE__ */ import_react35.default.createElement("ol", { className: "brokr-md-list brokr-md-list-ordered", key: idx }, block.items?.map((item, li) => /* @__PURE__ */ import_react35.default.createElement("li", { key: li }, parseInline(item))));
+        }
+        return /* @__PURE__ */ import_react35.default.createElement("ul", { className: "brokr-md-list brokr-md-list-unordered", key: idx }, block.items?.map((item, li) => /* @__PURE__ */ import_react35.default.createElement("li", { key: li }, parseInline(item))));
+      case "quote":
+        return /* @__PURE__ */ import_react35.default.createElement("blockquote", { className: "brokr-md-quote", key: idx }, block.items?.map((line, lineIndex) => /* @__PURE__ */ import_react35.default.createElement("p", { className: "brokr-md-quote-line", key: lineIndex }, parseInline(line))));
+      case "table":
+        return /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-md-table-wrap", key: idx }, /* @__PURE__ */ import_react35.default.createElement("table", { className: "brokr-md-table" }, /* @__PURE__ */ import_react35.default.createElement("thead", null, /* @__PURE__ */ import_react35.default.createElement("tr", null, block.headers?.map((header, headerIndex) => /* @__PURE__ */ import_react35.default.createElement("th", { key: headerIndex }, parseInline(header))))), /* @__PURE__ */ import_react35.default.createElement("tbody", null, block.rows?.map((row, rowIndex) => /* @__PURE__ */ import_react35.default.createElement("tr", { key: rowIndex }, row.map((cell, cellIndex) => /* @__PURE__ */ import_react35.default.createElement("td", { key: cellIndex }, parseInline(cell))))))));
       case "paragraph":
       default:
-        return /* @__PURE__ */ import_react34.default.createElement("p", { className: "brokr-md-paragraph", key: idx }, parseInline(block.content));
+        return /* @__PURE__ */ import_react35.default.createElement("p", { className: "brokr-md-paragraph", key: idx }, parseInline(block.content));
     }
   });
 }
 function MarkdownRenderer({ content }) {
-  const rendered = (0, import_react34.useMemo)(() => {
+  const rendered = (0, import_react35.useMemo)(() => {
     if (!content) return null;
     const blocks = parseBlocks(content);
     return renderBlocks(blocks);
   }, [content]);
-  return /* @__PURE__ */ import_react34.default.createElement("div", { className: "brokr-md" }, rendered);
+  return /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-md" }, rendered);
 }
 
 // src/react/chat/MessageBubble.tsx
 function MessageBubble({ message, isTyping, user }) {
-  const handleCopy = (0, import_react35.useCallback)(() => {
+  const handleCopy = (0, import_react36.useCallback)(() => {
     navigator.clipboard.writeText(message.content).catch(() => {
     });
   }, [message.content]);
   if (message.role === "user") {
-    return /* @__PURE__ */ import_react35.default.createElement("article", { className: "brokr-ai-chat-message", "data-role": "user" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-row", "data-role": "user" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-bubble" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-content brokr-ai-chat-message-content-user" }, message.content)), /* @__PURE__ */ import_react35.default.createElement(Avatar, { email: user?.email, name: user?.name, src: user?.image })));
+    return /* @__PURE__ */ import_react36.default.createElement("article", { className: "brokr-ai-chat-message", "data-role": "user" }, /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-row", "data-role": "user" }, /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-bubble" }, /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-content brokr-ai-chat-message-content-user" }, message.content)), /* @__PURE__ */ import_react36.default.createElement(Avatar, { email: user?.email, name: user?.name, src: user?.image })));
   }
   const mp = message.model ? resolveProviderByModel(message.model) : null;
-  return /* @__PURE__ */ import_react35.default.createElement("article", { className: "brokr-ai-chat-message", "data-role": "assistant" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-row", "data-role": "assistant" }, mp ? /* @__PURE__ */ import_react35.default.createElement("img", { alt: mp.label, className: "brokr-ai-chat-model-avatar", src: mp.logo }) : null, isTyping ? /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-typing", "aria-label": "AI is typing" }, /* @__PURE__ */ import_react35.default.createElement("span", null), /* @__PURE__ */ import_react35.default.createElement("span", null), /* @__PURE__ */ import_react35.default.createElement("span", null)) : message.status === "error" && !message.content ? /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-wrap" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-error" }, "Something went wrong generating a reply.")) : /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-wrap" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "brokr-ai-chat-message-content" }, /* @__PURE__ */ import_react35.default.createElement(MarkdownRenderer, { content: message.content })), message.content ? /* @__PURE__ */ import_react35.default.createElement(
+  return /* @__PURE__ */ import_react36.default.createElement("article", { className: "brokr-ai-chat-message", "data-role": "assistant" }, /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-row", "data-role": "assistant" }, mp ? /* @__PURE__ */ import_react36.default.createElement("img", { alt: mp.label, className: "brokr-ai-chat-model-avatar", src: mp.logo }) : null, isTyping ? /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-typing", "aria-label": "AI is typing" }, /* @__PURE__ */ import_react36.default.createElement("span", null), /* @__PURE__ */ import_react36.default.createElement("span", null), /* @__PURE__ */ import_react36.default.createElement("span", null)) : message.status === "error" && !message.content ? /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-wrap" }, /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-error" }, "Something went wrong generating a reply.")) : /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-wrap" }, /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-message-content" }, /* @__PURE__ */ import_react36.default.createElement(MarkdownRenderer, { content: message.content })), message.content ? /* @__PURE__ */ import_react36.default.createElement(
     "button",
     {
       "aria-label": "Copy message",
@@ -7326,16 +7517,16 @@ function MessageBubble({ message, isTyping, user }) {
       onClick: handleCopy,
       type: "button"
     },
-    /* @__PURE__ */ import_react35.default.createElement(CopyIcon, { size: 13 })
+    /* @__PURE__ */ import_react36.default.createElement(CopyIcon, { size: 13 })
   ) : null)));
 }
 
 // src/react/chat/MessagePane.tsx
 function StarterPromptButton({ prompt, onSend }) {
-  const handleClick = (0, import_react36.useCallback)(() => {
+  const handleClick = (0, import_react37.useCallback)(() => {
     void onSend(prompt);
   }, [prompt, onSend]);
-  return /* @__PURE__ */ import_react36.default.createElement("button", { className: "brokr-ai-chat-starter", onClick: handleClick, type: "button" }, prompt);
+  return /* @__PURE__ */ import_react37.default.createElement("button", { className: "brokr-ai-chat-starter", onClick: handleClick, type: "button" }, prompt);
 }
 function MessagePane({ starterPrompts, emptyTitle, emptyCopy, subtitle }) {
   const {
@@ -7353,10 +7544,10 @@ function MessagePane({ starterPrompts, emptyTitle, emptyCopy, subtitle }) {
     user
   } = useChatState();
   const isEmpty = displayMessages.length === 0;
-  const messageElements = (0, import_react36.useMemo)(() => {
+  const messageElements = (0, import_react37.useMemo)(() => {
     return visibleMessages.map((message, index) => {
       const isTyping = message.role === "assistant" && !message.content && (isSubmitting && index === visibleMessages.length - 1 || message.status === "pending" || message.status === "streaming");
-      return /* @__PURE__ */ import_react36.default.createElement(
+      return /* @__PURE__ */ import_react37.default.createElement(
         MessageBubble,
         {
           isTyping,
@@ -7367,16 +7558,16 @@ function MessagePane({ starterPrompts, emptyTitle, emptyCopy, subtitle }) {
       );
     });
   }, [visibleMessages, isSubmitting, user]);
-  return /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-thread", "data-empty": isEmpty, ref: scrollContainerRef }, isEmpty ? /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-empty" }, /* @__PURE__ */ import_react36.default.createElement(SparkIcon, { size: 28 }), /* @__PURE__ */ import_react36.default.createElement("h2", { className: "brokr-title" }, emptyTitle), subtitle ?? emptyCopy ? /* @__PURE__ */ import_react36.default.createElement("p", { className: "brokr-copy" }, subtitle ?? emptyCopy) : null, starterPrompts.length > 0 ? /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-starters" }, starterPrompts.map((sp) => /* @__PURE__ */ import_react36.default.createElement(StarterPromptButton, { key: sp, prompt: sp, onSend: sendMessage }))) : null) : /* @__PURE__ */ import_react36.default.createElement("div", { className: "brokr-ai-chat-thread-inner" }, (isPersist ? hasMoreMessages : memHasMore) ? /* @__PURE__ */ import_react36.default.createElement("div", { ref: sentinelRef, className: "brokr-ai-chat-sentinel" }, loadingOlder ? /* @__PURE__ */ import_react36.default.createElement("div", { style: { display: "flex", justifyContent: "center", padding: "0.5rem" } }, /* @__PURE__ */ import_react36.default.createElement(Skeleton, { width: 120, height: 12, radius: 6 })) : null) : null, messageElements, /* @__PURE__ */ import_react36.default.createElement("div", { ref: bottomRef })));
+  return /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-ai-chat-thread", "data-empty": isEmpty, ref: scrollContainerRef }, isEmpty ? /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-ai-chat-empty" }, /* @__PURE__ */ import_react37.default.createElement(SparkIcon, { size: 28 }), /* @__PURE__ */ import_react37.default.createElement("h2", { className: "brokr-title" }, emptyTitle), subtitle ?? emptyCopy ? /* @__PURE__ */ import_react37.default.createElement("p", { className: "brokr-copy" }, subtitle ?? emptyCopy) : null, starterPrompts.length > 0 ? /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-ai-chat-starters" }, starterPrompts.map((sp) => /* @__PURE__ */ import_react37.default.createElement(StarterPromptButton, { key: sp, prompt: sp, onSend: sendMessage }))) : null) : /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-ai-chat-thread-inner" }, (isPersist ? hasMoreMessages : memHasMore) ? /* @__PURE__ */ import_react37.default.createElement("div", { ref: sentinelRef, className: "brokr-ai-chat-sentinel" }, loadingOlder ? /* @__PURE__ */ import_react37.default.createElement("div", { style: { display: "flex", justifyContent: "center", padding: "0.5rem" } }, /* @__PURE__ */ import_react37.default.createElement(Skeleton, { width: 120, height: 12, radius: 6 })) : null) : null, messageElements, /* @__PURE__ */ import_react37.default.createElement("div", { ref: bottomRef })));
 }
 
 // src/react/chat/ChatInput.tsx
-var import_react37 = __toESM(require("react"));
+var import_react38 = __toESM(require("react"));
 function CommandButton({ cmd, chatContext }) {
-  const handleClick = (0, import_react37.useCallback)(() => {
+  const handleClick = (0, import_react38.useCallback)(() => {
     void cmd.run(chatContext);
   }, [cmd, chatContext]);
-  return /* @__PURE__ */ import_react37.default.createElement("button", { className: "brokr-ai-chat-sidebar-button", key: cmd.id, onClick: handleClick, type: "button" }, cmd.text);
+  return /* @__PURE__ */ import_react38.default.createElement("button", { className: "brokr-ai-chat-sidebar-button", key: cmd.id, onClick: handleClick, type: "button" }, cmd.text);
 }
 function ChatInput() {
   const {
@@ -7389,26 +7580,26 @@ function ChatInput() {
     composerCommands,
     chatContext
   } = useChatState();
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     const el = textareaRef.current;
     if (!el) return;
     el.style.height = "auto";
     el.style.height = `${Math.min(el.scrollHeight, 168)}px`;
   }, [input, textareaRef]);
-  const handleSubmit = (0, import_react37.useCallback)((e) => {
+  const handleSubmit = (0, import_react38.useCallback)((e) => {
     e.preventDefault();
     void sendMessage();
   }, [sendMessage]);
-  const handleKeyDown = (0, import_react37.useCallback)((e) => {
+  const handleKeyDown = (0, import_react38.useCallback)((e) => {
     if (e.key === "Enter" && !e.shiftKey) {
       e.preventDefault();
       void sendMessage();
     }
   }, [sendMessage]);
-  const handleChange = (0, import_react37.useCallback)((e) => {
+  const handleChange = (0, import_react38.useCallback)((e) => {
     setInput(e.target.value);
   }, [setInput]);
-  return /* @__PURE__ */ import_react37.default.createElement("form", { className: "brokr-ai-chat-input-area", onSubmit: handleSubmit }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-ai-chat-input-container" }, composerCommands.length > 0 ? /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-ai-chat-composer-actions" }, composerCommands.map((cmd) => /* @__PURE__ */ import_react37.default.createElement(CommandButton, { key: cmd.id, cmd, chatContext }))) : null, /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-ai-chat-input-row" }, /* @__PURE__ */ import_react37.default.createElement(
+  return /* @__PURE__ */ import_react38.default.createElement("form", { className: "brokr-ai-chat-input-area", onSubmit: handleSubmit }, /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-input-container" }, composerCommands.length > 0 ? /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-composer-actions" }, composerCommands.map((cmd) => /* @__PURE__ */ import_react38.default.createElement(CommandButton, { key: cmd.id, cmd, chatContext }))) : null, /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-input-row" }, /* @__PURE__ */ import_react38.default.createElement(
     "textarea",
     {
       className: "brokr-ai-chat-textarea",
@@ -7419,15 +7610,15 @@ function ChatInput() {
       rows: 1,
       value: input
     }
-  ), /* @__PURE__ */ import_react37.default.createElement(
+  ), /* @__PURE__ */ import_react38.default.createElement(
     "button",
     {
       className: "brokr-ai-chat-send",
       disabled: isSubmitting || !input.trim(),
       type: "submit"
     },
-    isSubmitting ? /* @__PURE__ */ import_react37.default.createElement(SparkIcon, { size: 16 }) : /* @__PURE__ */ import_react37.default.createElement(ArrowRightIcon, { size: 16 })
-  ))), error ? /* @__PURE__ */ import_react37.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null);
+    isSubmitting ? /* @__PURE__ */ import_react38.default.createElement(SparkIcon, { size: 16 }) : /* @__PURE__ */ import_react38.default.createElement(ArrowRightIcon, { size: 16 })
+  ))), error ? /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null);
 }
 
 // src/react/chat/AIChat.tsx
@@ -7449,6 +7640,7 @@ function AIChat(inlineProps) {
     subtitle,
     model: modelProp,
     modelSelector,
+    memory,
     variant = 1,
     sidebar: sidebarProp,
     threadMenu: threadMenuProp,
@@ -7472,30 +7664,28 @@ function AIChat(inlineProps) {
   const headerVisible = variant !== 3;
   const threadMenuVisible = threadMenuProp !== void 0 ? threadMenuProp : variant !== 3;
   const modelSelectorVisible = (modelSelector !== void 0 ? modelSelector : true) && !modelProp;
-  const [selectedModel, setSelectedModel] = (0, import_react38.useState)(() => {
-    if (modelProp) return modelProp;
-    return providers.find((p) => p.free)?.model ?? providers[0]?.model ?? "";
-  });
-  (0, import_react38.useEffect)(() => {
-    if (modelProp) setSelectedModel(modelProp);
-  }, [modelProp]);
-  const activeModel = modelProp ?? selectedModel;
-  const activeProvider = (0, import_react38.useMemo)(
-    () => providers.find((p) => p.model === activeModel) ?? providers[0],
+  const [userSelectedModel, setUserSelectedModel] = (0, import_react39.useState)(null);
+  const explicitModel = modelProp ?? userSelectedModel ?? void 0;
+  const displayModel = explicitModel ?? providers.find((p) => p.free)?.model ?? providers[0]?.model ?? "";
+  const activeModel = explicitModel ?? STACK_DEFAULT;
+  const activeProvider = (0, import_react39.useMemo)(
+    () => activeModel === STACK_DEFAULT ? void 0 : providers.find((p) => p.model === activeModel) ?? providers[0],
     [activeModel]
   );
-  const hasBalance = (0, import_react38.useMemo)(
+  const hasBalance = (0, import_react39.useMemo)(
     () => billing === null || billing.balanceCents === null || billing.balanceCents > 0 || billing.hasPaymentMethod,
     [billing]
   );
-  const availableProviders = (0, import_react38.useMemo)(
+  const availableProviders = (0, import_react39.useMemo)(
     () => hasBalance ? providers : providers.filter((p) => p.free),
     [hasBalance]
   );
   const chat = useChat({
     endpoint,
     prompt,
-    model: activeModel,
+    explicitModel,
+    displayModel,
+    memory,
     persist,
     surface,
     subject,
@@ -7512,8 +7702,8 @@ function AIChat(inlineProps) {
     onThreadChange,
     userId: user?.id
   });
-  const shellRef = (0, import_react38.useRef)(null);
-  (0, import_react38.useEffect)(() => {
+  const shellRef = (0, import_react39.useRef)(null);
+  (0, import_react39.useEffect)(() => {
     const el = shellRef.current;
     if (!el) return;
     let raf = 0;
@@ -7539,23 +7729,23 @@ function AIChat(inlineProps) {
       ro?.disconnect();
     };
   }, []);
-  const [sidebarOpen, setSidebarOpen] = (0, import_react38.useState)(false);
-  const [threadMenuOpenId, setThreadMenuOpenId] = (0, import_react38.useState)(null);
-  const threadMenuRef = (0, import_react38.useRef)(null);
-  const closeSidebar = (0, import_react38.useCallback)(() => setSidebarOpen(false), []);
-  const selectThreadAndCloseSidebar = (0, import_react38.useCallback)((id) => {
+  const [sidebarOpen, setSidebarOpen] = (0, import_react39.useState)(false);
+  const [threadMenuOpenId, setThreadMenuOpenId] = (0, import_react39.useState)(null);
+  const threadMenuRef = (0, import_react39.useRef)(null);
+  const closeSidebar = (0, import_react39.useCallback)(() => setSidebarOpen(false), []);
+  const selectThreadAndCloseSidebar = (0, import_react39.useCallback)((id) => {
     chat.selectThread(id);
     setSidebarOpen(false);
   }, [chat.selectThread]);
-  const handleCopy = (0, import_react38.useCallback)((content) => {
+  const handleCopy = (0, import_react39.useCallback)((content) => {
     navigator.clipboard.writeText(content).catch(() => {
     });
   }, []);
-  const handleStartRename = (0, import_react38.useCallback)((threadId) => {
+  const handleStartRename = (0, import_react39.useCallback)((threadId) => {
     setThreadMenuOpenId(null);
     chat.startRename(threadId);
   }, [chat.startRename]);
-  (0, import_react38.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     if (!threadMenuOpenId) return;
     const onMouseDown = (e) => {
       if (!threadMenuRef.current?.contains(e.target)) setThreadMenuOpenId(null);
@@ -7563,7 +7753,7 @@ function AIChat(inlineProps) {
     document.addEventListener("mousedown", onMouseDown);
     return () => document.removeEventListener("mousedown", onMouseDown);
   }, [threadMenuOpenId]);
-  (0, import_react38.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     if (!sidebarOpen) return;
     const onKeyDown = (e) => {
       if (e.key === "Escape") setSidebarOpen(false);
@@ -7571,10 +7761,10 @@ function AIChat(inlineProps) {
     document.addEventListener("keydown", onKeyDown);
     return () => document.removeEventListener("keydown", onKeyDown);
   }, [sidebarOpen]);
-  const finalTitle = (0, import_react38.useMemo)(() => {
+  const finalTitle = (0, import_react39.useMemo)(() => {
     return chat.renderedTitle || title;
   }, [chat.renderedTitle, title]);
-  const chatContext = (0, import_react38.useMemo)(() => ({
+  const chatContext = (0, import_react39.useMemo)(() => ({
     thread: chat.activeThread,
     messages: chat.displayMessages,
     user,
@@ -7582,19 +7772,19 @@ function AIChat(inlineProps) {
     newThread: chat.startNewChat,
     setThread: chat.selectThread
   }), [chat.activeThread, chat.displayMessages, user, chat.sendMessage, chat.startNewChat, chat.selectThread]);
-  const headerCommands = (0, import_react38.useMemo)(
+  const headerCommands = (0, import_react39.useMemo)(
     () => commands.filter((c) => c.location === "header" && (!c.show || c.show(chatContext))),
     [commands, chatContext]
   );
-  const composerCommands = (0, import_react38.useMemo)(
+  const composerCommands = (0, import_react39.useMemo)(
     () => commands.filter((c) => c.location === "composer" && (!c.show || c.show(chatContext))),
     [commands, chatContext]
   );
-  const threadMenuCommands = (0, import_react38.useMemo)(
+  const threadMenuCommands = (0, import_react39.useMemo)(
     () => commands.filter((c) => c.location === "threadMenu" && (!c.show || c.show(chatContext))),
     [commands, chatContext]
   );
-  const chatState = (0, import_react38.useMemo)(() => ({
+  const chatState = (0, import_react39.useMemo)(() => ({
     displayMessages: chat.displayMessages,
     visibleMessages: chat.displayMessages,
     isSubmitting: chat.isSubmitting,
@@ -7603,10 +7793,10 @@ function AIChat(inlineProps) {
     activeThread: chat.activeThread,
     renderedTitle: finalTitle,
     isTitleLoading: chat.isTitleLoading,
-    activeModel,
+    activeModel: displayModel,
     activeProvider,
-    selectedModel,
-    setSelectedModel,
+    selectedModel: displayModel,
+    setSelectedModel: setUserSelectedModel,
     availableProviders,
     sendMessage: chat.sendMessage,
     startNewChat: chat.startNewChat,
@@ -7646,9 +7836,9 @@ function AIChat(inlineProps) {
   }), [
     chat,
     finalTitle,
-    activeModel,
+    displayModel,
     activeProvider,
-    selectedModel,
+    userSelectedModel,
     availableProviders,
     sidebarOpen,
     closeSidebar,
@@ -7661,16 +7851,16 @@ function AIChat(inlineProps) {
     checkout,
     user
   ]);
-  return /* @__PURE__ */ import_react38.default.createElement(ChatProvider, { value: chatState }, /* @__PURE__ */ import_react38.default.createElement(
+  return /* @__PURE__ */ import_react39.default.createElement(ChatProvider, { value: chatState }, /* @__PURE__ */ import_react39.default.createElement(
     "section",
     {
       className: "brokr-ai-chat-shell",
       "data-sidebar": sidebarVisible,
       ref: shellRef
     },
-    sidebarVisible ? /* @__PURE__ */ import_react38.default.createElement("aside", { className: "brokr-ai-chat-sidebar brokr-ai-chat-sidebar-desktop" }, /* @__PURE__ */ import_react38.default.createElement(ThreadSidebar, null)) : null,
-    sidebarOpen ? /* @__PURE__ */ import_react38.default.createElement(import_react38.default.Fragment, null, /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-drawer-backdrop", onClick: closeSidebar }), /* @__PURE__ */ import_react38.default.createElement("aside", { className: "brokr-ai-chat-drawer" }, /* @__PURE__ */ import_react38.default.createElement(ThreadSidebar, null))) : null,
-    /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-stage", "data-noheader": !headerVisible }, headerVisible ? /* @__PURE__ */ import_react38.default.createElement(
+    sidebarVisible ? /* @__PURE__ */ import_react39.default.createElement("aside", { className: "brokr-ai-chat-sidebar brokr-ai-chat-sidebar-desktop" }, /* @__PURE__ */ import_react39.default.createElement(ThreadSidebar, null)) : null,
+    sidebarOpen ? /* @__PURE__ */ import_react39.default.createElement(import_react39.default.Fragment, null, /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-ai-chat-drawer-backdrop", onClick: closeSidebar }), /* @__PURE__ */ import_react39.default.createElement("aside", { className: "brokr-ai-chat-drawer" }, /* @__PURE__ */ import_react39.default.createElement(ThreadSidebar, null))) : null,
+    /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-ai-chat-stage", "data-noheader": !headerVisible }, headerVisible ? /* @__PURE__ */ import_react39.default.createElement(
       ChatHeader,
       {
         activeId: chat.activeId,
@@ -7685,13 +7875,13 @@ function AIChat(inlineProps) {
         threadMenuRef,
         threadMenuVisible,
         setThreadMenuOpenId,
-        activeModel,
-        setSelectedModel,
+        activeModel: displayModel,
+        setSelectedModel: setUserSelectedModel,
         availableProviders,
         startRename: chatState.startRename,
         deleteThread: chat.deleteThread
       }
-    ) : null, /* @__PURE__ */ import_react38.default.createElement(
+    ) : null, /* @__PURE__ */ import_react39.default.createElement(
       MessagePane,
       {
         starterPrompts,
@@ -7699,21 +7889,21 @@ function AIChat(inlineProps) {
         emptyCopy,
         subtitle
       }
-    ), /* @__PURE__ */ import_react38.default.createElement(ChatInput, null))
+    ), /* @__PURE__ */ import_react39.default.createElement(ChatInput, null))
   ));
 }
 function CommandButton2({ cmd, chatContext }) {
-  const handleClick = (0, import_react38.useCallback)(() => {
+  const handleClick = (0, import_react39.useCallback)(() => {
     void cmd.run(chatContext);
   }, [cmd, chatContext]);
-  return /* @__PURE__ */ import_react38.default.createElement("button", { className: "brokr-ai-chat-sidebar-button", onClick: handleClick, type: "button" }, cmd.text);
+  return /* @__PURE__ */ import_react39.default.createElement("button", { className: "brokr-ai-chat-sidebar-button", onClick: handleClick, type: "button" }, cmd.text);
 }
 function MenuCommandItem({ cmd, chatContext, onClose }) {
-  const handleClick = (0, import_react38.useCallback)(() => {
+  const handleClick = (0, import_react39.useCallback)(() => {
     onClose();
     void cmd.run(chatContext);
   }, [cmd, chatContext, onClose]);
-  return /* @__PURE__ */ import_react38.default.createElement("button", { className: "brokr-ai-chat-thread-dropdown-item", onClick: handleClick, type: "button" }, cmd.text);
+  return /* @__PURE__ */ import_react39.default.createElement("button", { className: "brokr-ai-chat-thread-dropdown-item", onClick: handleClick, type: "button" }, cmd.text);
 }
 function ChatHeader({
   activeId,
@@ -7734,21 +7924,21 @@ function ChatHeader({
   startRename,
   deleteThread
 }) {
-  const handleOpenSidebar = (0, import_react38.useCallback)(() => setSidebarOpen(true), [setSidebarOpen]);
-  const handleToggleMenu = (0, import_react38.useCallback)(() => {
+  const handleOpenSidebar = (0, import_react39.useCallback)(() => setSidebarOpen(true), [setSidebarOpen]);
+  const handleToggleMenu = (0, import_react39.useCallback)(() => {
     setThreadMenuOpenId(threadMenuOpenId ? null : activeId);
   }, [setThreadMenuOpenId, threadMenuOpenId, activeId]);
-  const closeMenu = (0, import_react38.useCallback)(() => setThreadMenuOpenId(null), [setThreadMenuOpenId]);
-  const handleRename = (0, import_react38.useCallback)(() => {
+  const closeMenu = (0, import_react39.useCallback)(() => setThreadMenuOpenId(null), [setThreadMenuOpenId]);
+  const handleRename = (0, import_react39.useCallback)(() => {
     if (activeId) startRename(activeId);
   }, [activeId, startRename]);
-  const handleDelete = (0, import_react38.useCallback)(() => {
+  const handleDelete = (0, import_react39.useCallback)(() => {
     if (activeId) {
       setThreadMenuOpenId(null);
       void deleteThread(activeId);
     }
   }, [activeId, deleteThread, setThreadMenuOpenId]);
-  return /* @__PURE__ */ import_react38.default.createElement("header", { className: "brokr-ai-chat-topbar" }, /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-topbar-left" }, sidebarVisible ? /* @__PURE__ */ import_react38.default.createElement(
+  return /* @__PURE__ */ import_react39.default.createElement("header", { className: "brokr-ai-chat-topbar" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-ai-chat-topbar-left" }, sidebarVisible ? /* @__PURE__ */ import_react39.default.createElement(
     "button",
     {
       "aria-label": "Open sidebar",
@@ -7756,8 +7946,8 @@ function ChatHeader({
       onClick: handleOpenSidebar,
       type: "button"
     },
-    /* @__PURE__ */ import_react38.default.createElement(MenuIcon, { size: 18 })
-  ) : null), /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-topbar-actions" }, headerCommands.map((cmd) => /* @__PURE__ */ import_react38.default.createElement(CommandButton2, { key: cmd.id, cmd, chatContext })), modelSelectorVisible ? /* @__PURE__ */ import_react38.default.createElement(
+    /* @__PURE__ */ import_react39.default.createElement(MenuIcon, { size: 18 })
+  ) : null), /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-ai-chat-topbar-actions" }, headerCommands.map((cmd) => /* @__PURE__ */ import_react39.default.createElement(CommandButton2, { key: cmd.id, cmd, chatContext })), modelSelectorVisible ? /* @__PURE__ */ import_react39.default.createElement(
     ModelSelector,
     {
       activeModel,
@@ -7765,7 +7955,7 @@ function ChatHeader({
       checkout,
       setSelectedModel
     }
-  ) : null, activeId && threadMenuVisible ? /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-thread-menu-wrap", ref: threadMenuRef }, /* @__PURE__ */ import_react38.default.createElement(
+  ) : null, activeId && threadMenuVisible ? /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-ai-chat-thread-menu-wrap", ref: threadMenuRef }, /* @__PURE__ */ import_react39.default.createElement(
     "button",
     {
       "aria-label": "Thread actions",
@@ -7773,17 +7963,17 @@ function ChatHeader({
       onClick: handleToggleMenu,
       type: "button"
     },
-    /* @__PURE__ */ import_react38.default.createElement(MoreHorizontalIcon, { size: 14 })
-  ), threadMenuOpenId ? /* @__PURE__ */ import_react38.default.createElement("div", { className: "brokr-ai-chat-thread-dropdown" }, /* @__PURE__ */ import_react38.default.createElement(
+    /* @__PURE__ */ import_react39.default.createElement(MoreHorizontalIcon, { size: 14 })
+  ), threadMenuOpenId ? /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-ai-chat-thread-dropdown" }, /* @__PURE__ */ import_react39.default.createElement(
     "button",
     {
       className: "brokr-ai-chat-thread-dropdown-item",
       onClick: handleRename,
       type: "button"
     },
-    /* @__PURE__ */ import_react38.default.createElement(PencilIcon, { size: 13 }),
+    /* @__PURE__ */ import_react39.default.createElement(PencilIcon, { size: 13 }),
     "Rename"
-  ), threadMenuCommands.map((cmd) => /* @__PURE__ */ import_react38.default.createElement(
+  ), threadMenuCommands.map((cmd) => /* @__PURE__ */ import_react39.default.createElement(
     MenuCommandItem,
     {
       key: cmd.id,
@@ -7791,7 +7981,7 @@ function ChatHeader({
       chatContext,
       onClose: closeMenu
     }
-  )), /* @__PURE__ */ import_react38.default.createElement(
+  )), /* @__PURE__ */ import_react39.default.createElement(
     "button",
     {
       className: "brokr-ai-chat-thread-dropdown-item",
@@ -7799,118 +7989,196 @@ function ChatHeader({
       onClick: handleDelete,
       type: "button"
     },
-    /* @__PURE__ */ import_react38.default.createElement(TrashIcon, { size: 13 }),
+    /* @__PURE__ */ import_react39.default.createElement(TrashIcon, { size: 13 }),
     "Delete"
   )) : null) : null));
 }
 
 // src/react/composites/FabAI.tsx
-var import_react39 = __toESM(require("react"));
-function StarterButton({ prompt, onSelect }) {
-  const handleClick = (0, import_react39.useCallback)(() => onSelect(prompt), [prompt, onSelect]);
-  return /* @__PURE__ */ import_react39.default.createElement("button", { className: "brokr-chat-starter", onClick: handleClick, type: "button" }, prompt);
+var import_react40 = __toESM(require("react"));
+
+// src/react/composites/fab-context.ts
+function buildFabSystemPrompt(appContext, brandName, existingPrompt) {
+  if (appContext === false) return existingPrompt;
+  const name = appContext?.name ?? brandName;
+  if (!name && !appContext) return existingPrompt;
+  const parts = [];
+  if (name) parts.push(`You are an AI assistant embedded in ${name}.`);
+  if (appContext?.description) parts.push(`This app is ${appContext.description}.`);
+  if (appContext?.currentPage) parts.push(`The user is currently on: ${appContext.currentPage}.`);
+  if (appContext?.facts?.length) parts.push(...appContext.facts);
+  const autoPrompt = parts.join(" ");
+  return existingPrompt ? `${autoPrompt}
+
+${existingPrompt}` : autoPrompt;
+}
+
+// src/react/composites/FabAI.tsx
+function ensureAssistantReply(messages, content) {
+  const normalized = content.trim() ? content : "No response received.";
+  for (let index = messages.length - 1; index >= 0; index -= 1) {
+    if (messages[index]?.role !== "assistant") continue;
+    const next = [...messages];
+    next[index] = { ...next[index], content: normalized };
+    return next;
+  }
+  return [...messages, { role: "assistant", content: normalized }];
+}
+function appendAssistantDelta(messages, delta) {
+  for (let index = messages.length - 1; index >= 0; index -= 1) {
+    if (messages[index]?.role !== "assistant") continue;
+    const next = [...messages];
+    next[index] = {
+      ...next[index],
+      content: `${contentToText(next[index].content)}${delta}`
+    };
+    return next;
+  }
+  return [...messages, { role: "assistant", content: delta }];
 }
 function FabAI({
+  appContext,
   model,
+  memory,
   onSendMessage,
   position = "bottom-right",
-  starterPrompts = [],
   systemPrompt
 }) {
-  const { can, user } = useBrokr();
-  const [isOpen, setIsOpen] = (0, import_react39.useState)(false);
-  const [input, setInput] = (0, import_react39.useState)("");
-  const [error, setError] = (0, import_react39.useState)(null);
-  const [isSending, setIsSending] = (0, import_react39.useState)(false);
-  const [messages, setMessages] = (0, import_react39.useState)([]);
-  const launcherStyle = (0, import_react39.useMemo)(
+  const { can, user, theme } = useBrokr();
+  const brandName = theme?.brand?.name;
+  const [isOpen, setIsOpen] = (0, import_react40.useState)(false);
+  const [input, setInput] = (0, import_react40.useState)("");
+  const [error, setError] = (0, import_react40.useState)(null);
+  const [isSending, setIsSending] = (0, import_react40.useState)(false);
+  const [messages, setMessages] = (0, import_react40.useState)([]);
+  const conversationIdRef = (0, import_react40.useRef)(`fab_${crypto.randomUUID()}`);
+  const launcherStyle = (0, import_react40.useMemo)(
     () => ({
       left: position === "bottom-left" ? "var(--brokr-space-6)" : void 0,
       right: position === "bottom-right" ? "var(--brokr-space-6)" : void 0
     }),
     [position]
   );
-  const canChat = (0, import_react39.useMemo)(() => can("ai.chat"), [can]);
-  const toggleOpen = (0, import_react39.useCallback)(() => {
+  const canChat = (0, import_react40.useMemo)(() => can("ai.chat"), [can]);
+  const toggleOpen = (0, import_react40.useCallback)(() => {
     if (!canChat) {
       redirectTo("/pricing");
       return;
     }
     setIsOpen((current) => !current);
   }, [canChat]);
-  const handleInputChange = (0, import_react39.useCallback)((event) => {
+  const handleInputChange = (0, import_react40.useCallback)((event) => {
     setInput(event.target.value);
   }, []);
-  const handleClose = (0, import_react39.useCallback)(() => {
+  const handleClose = (0, import_react40.useCallback)(() => {
     setIsOpen(false);
   }, []);
-  const sendPrompt = (0, import_react39.useCallback)(async (prompt) => {
+  const sendPrompt = (0, import_react40.useCallback)(async (prompt) => {
     const nextPrompt = prompt.trim();
-    if (!nextPrompt) return;
-    const nextMessages = [...messages, { role: "user", content: nextPrompt }];
+    if (!nextPrompt || isSending) return;
+    const userMessage = { role: "user", content: nextPrompt };
+    const nextMessages = [...messages, userMessage];
+    const optimisticMessages = [...nextMessages, { role: "assistant", content: "" }];
     try {
       setError(null);
       setIsSending(true);
-      setMessages(nextMessages);
+      setMessages(optimisticMessages);
       setInput("");
-      let responseText = "";
       if (onSendMessage) {
-        responseText = await onSendMessage({ messages: nextMessages, model, systemPrompt });
-      } else {
-        const payload = await postJson(
-          "/api/brokr/chat",
-          {
-            messages: nextMessages,
-            model,
-            systemPrompt
+        const responseText2 = await onSendMessage({ messages: nextMessages, model, systemPrompt });
+        setMessages((current) => ensureAssistantReply(current, responseText2));
+        return;
+      }
+      const response = await fetch("/api/brokr/chat", {
+        method: "POST",
+        credentials: "include",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          conversationId: conversationIdRef.current,
+          messages: trimToTokenBudget(
+            nextMessages.filter((message) => message.role === "user" || message.role === "assistant" && Boolean(contentToText(message.content))).map((message) => ({
+              role: message.role,
+              content: contentToText(message.content)
+            }))
+          ),
+          ...model !== void 0 ? { model } : {},
+          ...(() => {
+            const withContext = buildFabSystemPrompt(appContext, brandName, systemPrompt);
+            const ep = buildEffectivePrompt(withContext, memory);
+            return ep ? { systemPrompt: ep } : {};
+          })()
+        })
+      });
+      if (!response.ok) {
+        const payload2 = await response.json().catch(() => ({}));
+        throw new Error(payload2.message ?? payload2.error ?? `Chat failed (${response.status})`);
+      }
+      if (isSSEResponse(response)) {
+        let hasDelta = false;
+        for await (const event of parseSSEStream(response)) {
+          if (event.type === "conversation") {
+            conversationIdRef.current = event.id;
+          } else if (event.type === "delta") {
+            hasDelta = true;
+            setMessages((current) => appendAssistantDelta(current, event.delta));
+          } else if (event.type === "error") {
+            throw new Error(event.message);
           }
-        );
-        responseText = payload.content ?? payload.response ?? "";
+        }
+        if (!hasDelta) {
+          setMessages((current) => ensureAssistantReply(current, "No response received."));
+        }
+        return;
       }
-      setMessages((current) => [...current, {
-        role: "assistant",
-        content: responseText || "No response received."
-      }]);
+      const payload = await response.json().catch(() => ({}));
+      if (payload.error || payload.message) {
+        throw new Error(payload.message ?? payload.error ?? "AI request failed.");
+      }
+      const responseText = payload.content ?? payload.response ?? payload.text ?? "";
+      setMessages((current) => ensureAssistantReply(current, responseText));
     } catch (cause) {
-      setError(cause instanceof Error ? cause.message : "Could not send message.");
+      const message = cause instanceof Error ? cause.message : "Could not send message.";
+      setError(message);
+      setMessages((current) => ensureAssistantReply(current, `Error: ${message}`));
     } finally {
       setIsSending(false);
     }
-  }, [messages, model, onSendMessage, systemPrompt]);
-  const handleSubmit = (0, import_react39.useCallback)(async (event) => {
+  }, [isSending, messages, model, onSendMessage, systemPrompt]);
+  const handleSubmit = (0, import_react40.useCallback)(async (event) => {
     event.preventDefault();
     await sendPrompt(input);
   }, [input, sendPrompt]);
-  const handleKeyDown = (0, import_react39.useCallback)((event) => {
+  const handleKeyDown = (0, import_react40.useCallback)((event) => {
     if (event.key === "Enter" && !event.shiftKey) {
       event.preventDefault();
       void sendPrompt(input);
     }
   }, [input, sendPrompt]);
-  const handleStarterPrompt = (0, import_react39.useCallback)((prompt) => {
-    void sendPrompt(prompt);
-  }, [sendPrompt]);
-  return /* @__PURE__ */ import_react39.default.createElement(import_react39.default.Fragment, null, /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-chat-fab", style: launcherStyle }, /* @__PURE__ */ import_react39.default.createElement(
+  return /* @__PURE__ */ import_react40.default.createElement(import_react40.default.Fragment, null, /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-chat-fab", style: launcherStyle }, /* @__PURE__ */ import_react40.default.createElement(
     "button",
     {
+      "aria-label": isOpen ? "Close AI chat" : "Open AI chat",
       "aria-expanded": isOpen,
       "aria-haspopup": "dialog",
-      className: "brokr-button",
+      className: "brokr-chat-fab-trigger",
       onClick: toggleOpen,
       type: "button"
     },
-    /* @__PURE__ */ import_react39.default.createElement(MessageIcon, { size: 16 }),
-    "Ask AI"
-  )), isOpen ? /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-panel brokr-chat-panel", role: "dialog" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-brand-row", style: { justifyContent: "space-between" } }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react39.default.createElement("strong", null, "AI Chat"), user?.name ? /* @__PURE__ */ import_react39.default.createElement("span", { className: "brokr-copy" }, user.name) : null), /* @__PURE__ */ import_react39.default.createElement("button", { className: "brokr-button-ghost", onClick: handleClose, type: "button" }, /* @__PURE__ */ import_react39.default.createElement(CloseIcon, { size: 16 }))), /* @__PURE__ */ import_react39.default.createElement(
+    /* @__PURE__ */ import_react40.default.createElement(SparkIcon, { size: 18 })
+  )), isOpen ? /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-panel brokr-chat-panel", role: "dialog" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-brand-row", style: { justifyContent: "space-between" } }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react40.default.createElement("strong", null, "AI Chat"), user?.name ? /* @__PURE__ */ import_react40.default.createElement("span", { className: "brokr-copy" }, user.name) : null), /* @__PURE__ */ import_react40.default.createElement("button", { className: "brokr-button-ghost", onClick: handleClose, type: "button" }, /* @__PURE__ */ import_react40.default.createElement(CloseIcon, { size: 16 }))), /* @__PURE__ */ import_react40.default.createElement(
     "div",
     {
       className: "brokr-chat-messages",
       "data-empty": messages.length === 0
     },
-    messages.length === 0 ? /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-chat-empty" }, /* @__PURE__ */ import_react39.default.createElement(SparkIcon, { size: 18 }), /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react39.default.createElement("strong", null, "Send a message to chat with the AI."), /* @__PURE__ */ import_react39.default.createElement("span", { className: "brokr-copy" }, "Ask a question or drop in a starter prompt below.")), starterPrompts.length > 0 ? /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-chat-starters" }, starterPrompts.map((prompt) => /* @__PURE__ */ import_react39.default.createElement(StarterButton, { key: prompt, prompt, onSelect: handleStarterPrompt }))) : null) : null,
-    messages.map((message, index) => /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-chat-bubble", "data-role": message.role, key: `${message.role}-${index}` }, contentToText(message.content))),
-    error ? /* @__PURE__ */ import_react39.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null
-  ), /* @__PURE__ */ import_react39.default.createElement("form", { className: "brokr-section", onSubmit: handleSubmit, style: { gap: "var(--brokr-space-3)" } }, /* @__PURE__ */ import_react39.default.createElement(
+    messages.length === 0 ? /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-chat-empty" }, /* @__PURE__ */ import_react40.default.createElement(SparkIcon, { size: 18 }), /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react40.default.createElement("strong", null, "Send a message to chat with the AI."), /* @__PURE__ */ import_react40.default.createElement("span", { className: "brokr-copy" }, "Ask a question or drop in a starter prompt below."))) : null,
+    messages.map((message, index) => {
+      const text = contentToText(message.content);
+      const isTyping = message.role === "assistant" && !text && isSending && index === messages.length - 1;
+      return /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-chat-bubble", "data-role": message.role, key: `${message.role}-${index}` }, isTyping ? /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-ai-chat-typing", "aria-label": "AI is typing" }, /* @__PURE__ */ import_react40.default.createElement("span", null), /* @__PURE__ */ import_react40.default.createElement("span", null), /* @__PURE__ */ import_react40.default.createElement("span", null)) : message.role === "assistant" ? /* @__PURE__ */ import_react40.default.createElement(MarkdownRenderer, { content: text }) : text);
+    }),
+    error ? /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null
+  ), /* @__PURE__ */ import_react40.default.createElement("form", { className: "brokr-section", onSubmit: handleSubmit, style: { gap: "var(--brokr-space-3)" } }, /* @__PURE__ */ import_react40.default.createElement(
     "textarea",
     {
       className: "brokr-textarea brokr-chat-input",
@@ -7920,11 +8188,11 @@ function FabAI({
       rows: 2,
       value: input
     }
-  ), /* @__PURE__ */ import_react39.default.createElement("button", { className: "brokr-button", disabled: isSending, type: "submit" }, isSending ? "Thinking" : "Send"))) : null);
+  ), /* @__PURE__ */ import_react40.default.createElement("button", { className: "brokr-button", disabled: isSending || !input.trim(), type: "submit" }, isSending ? "Thinking" : "Send"))) : null);
 }
 
 // src/react/composites/SmartUpload.tsx
-var import_react40 = __toESM(require("react"));
+var import_react41 = __toESM(require("react"));
 function SmartUpload({
   accept,
   maxSize = 500 * 1024 * 1024,
@@ -7932,17 +8200,17 @@ function SmartUpload({
   purpose = "general"
 }) {
   const { paymentsMode } = useBrokr();
-  const inputId = (0, import_react40.useId)();
-  const inputRef = (0, import_react40.useRef)(null);
-  const [dragActive, setDragActive] = (0, import_react40.useState)(false);
-  const [error, setError] = (0, import_react40.useState)(null);
-  const [fileName, setFileName] = (0, import_react40.useState)(null);
-  const [progress, setProgress] = (0, import_react40.useState)(0);
-  const [isUploading, setIsUploading] = (0, import_react40.useState)(false);
-  const helperText = (0, import_react40.useMemo)(() => {
+  const inputId = (0, import_react41.useId)();
+  const inputRef = (0, import_react41.useRef)(null);
+  const [dragActive, setDragActive] = (0, import_react41.useState)(false);
+  const [error, setError] = (0, import_react41.useState)(null);
+  const [fileName, setFileName] = (0, import_react41.useState)(null);
+  const [progress, setProgress] = (0, import_react41.useState)(0);
+  const [isUploading, setIsUploading] = (0, import_react41.useState)(false);
+  const helperText = (0, import_react41.useMemo)(() => {
     return `${Math.round(maxSize / (1024 * 1024))} MB max file size.`;
   }, [maxSize]);
-  const beginUpload = (0, import_react40.useCallback)((file) => {
+  const beginUpload = (0, import_react41.useCallback)((file) => {
     if (file.size > maxSize) {
       setError(`That file is larger than ${Math.round(maxSize / (1024 * 1024))} MB.`);
       return;
@@ -7979,31 +8247,31 @@ function SmartUpload({
     body.append("purpose", purpose);
     request.send(body);
   }, [maxSize, onUpload, purpose]);
-  const handleInputChange = (0, import_react40.useCallback)((event) => {
+  const handleInputChange = (0, import_react41.useCallback)((event) => {
     const file = event.target.files?.[0];
     event.target.value = "";
     if (!file) return;
     beginUpload(file);
   }, [beginUpload]);
-  const handleDrop = (0, import_react40.useCallback)((event) => {
+  const handleDrop = (0, import_react41.useCallback)((event) => {
     event.preventDefault();
     setDragActive(false);
     const file = event.dataTransfer.files?.[0];
     if (!file) return;
     beginUpload(file);
   }, [beginUpload]);
-  const handleDragEnter = (0, import_react40.useCallback)((event) => {
+  const handleDragEnter = (0, import_react41.useCallback)((event) => {
     event.preventDefault();
     setDragActive(true);
   }, []);
-  const handleDragLeave = (0, import_react40.useCallback)((event) => {
+  const handleDragLeave = (0, import_react41.useCallback)((event) => {
     event.preventDefault();
     setDragActive(false);
   }, []);
-  const handleBrowse = (0, import_react40.useCallback)(() => {
+  const handleBrowse = (0, import_react41.useCallback)(() => {
     inputRef.current?.click();
   }, []);
-  return /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-card brokr-upload-shell" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-brand-row", style: { justifyContent: "space-between" } }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react40.default.createElement("strong", null, "Upload files"), /* @__PURE__ */ import_react40.default.createElement("span", { className: "brokr-copy" }, "Drop a file and let Brokr handle the boring part.")), paymentsMode === "sandbox" ? /* @__PURE__ */ import_react40.default.createElement("span", { className: "brokr-badge brokr-badge-sandbox" }, "Sandbox") : null), /* @__PURE__ */ import_react40.default.createElement(
+  return /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-card brokr-upload-shell" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-brand-row", style: { justifyContent: "space-between" } }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react41.default.createElement("strong", null, "Upload files"), /* @__PURE__ */ import_react41.default.createElement("span", { className: "brokr-copy" }, "Drop a file and let Brokr handle the boring part.")), paymentsMode === "sandbox" ? /* @__PURE__ */ import_react41.default.createElement("span", { className: "brokr-badge brokr-badge-sandbox" }, "Sandbox") : null), /* @__PURE__ */ import_react41.default.createElement(
     "label",
     {
       className: "brokr-upload-dropzone",
@@ -8014,11 +8282,11 @@ function SmartUpload({
       onDragOver: handleDragEnter,
       onDrop: handleDrop
     },
-    /* @__PURE__ */ import_react40.default.createElement(UploadIcon, { size: 24 }),
-    /* @__PURE__ */ import_react40.default.createElement("strong", null, "Drag and drop a file here or choose one"),
-    /* @__PURE__ */ import_react40.default.createElement("span", { className: "brokr-copy" }, helperText),
-    /* @__PURE__ */ import_react40.default.createElement("button", { className: "brokr-button-secondary", onClick: handleBrowse, type: "button" }, "Choose file")
-  ), /* @__PURE__ */ import_react40.default.createElement(
+    /* @__PURE__ */ import_react41.default.createElement(UploadIcon, { size: 24 }),
+    /* @__PURE__ */ import_react41.default.createElement("strong", null, "Drag and drop a file here or choose one"),
+    /* @__PURE__ */ import_react41.default.createElement("span", { className: "brokr-copy" }, helperText),
+    /* @__PURE__ */ import_react41.default.createElement("button", { className: "brokr-button-secondary", onClick: handleBrowse, type: "button" }, "Choose file")
+  ), /* @__PURE__ */ import_react41.default.createElement(
     "input",
     {
       accept,
@@ -8028,31 +8296,31 @@ function SmartUpload({
       ref: inputRef,
       type: "file"
     }
-  ), fileName ? /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-card brokr-upload-file" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react40.default.createElement("strong", null, fileName), /* @__PURE__ */ import_react40.default.createElement("span", { className: "brokr-copy" }, isUploading ? `Uploading ${progress}%` : progress === 100 ? "Processed" : "Queued")), /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-meter-bar" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-meter-fill", style: { width: `${progress}%` } }))) : null, error ? /* @__PURE__ */ import_react40.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null);
+  ), fileName ? /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-card brokr-upload-file" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-section", style: { gap: "var(--brokr-space-1)" } }, /* @__PURE__ */ import_react41.default.createElement("strong", null, fileName), /* @__PURE__ */ import_react41.default.createElement("span", { className: "brokr-copy" }, isUploading ? `Uploading ${progress}%` : progress === 100 ? "Processed" : "Queued")), /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-meter-bar" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-meter-fill", style: { width: `${progress}%` } }))) : null, error ? /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null);
 }
 
 // src/react/composites/FeedbackWidget.tsx
-var import_react41 = __toESM(require("react"));
+var import_react42 = __toESM(require("react"));
 function FeedbackWidget({
   context,
   onSubmit
 }) {
   const { user } = useBrokr();
-  const [rating, setRating] = (0, import_react41.useState)(null);
-  const [text, setText] = (0, import_react41.useState)("");
-  const [error, setError] = (0, import_react41.useState)(null);
-  const [message, setMessage] = (0, import_react41.useState)(null);
-  const [isPending, setIsPending] = (0, import_react41.useState)(false);
-  const handleTextChange = (0, import_react41.useCallback)((event) => {
+  const [rating, setRating] = (0, import_react42.useState)(null);
+  const [text, setText] = (0, import_react42.useState)("");
+  const [error, setError] = (0, import_react42.useState)(null);
+  const [message, setMessage] = (0, import_react42.useState)(null);
+  const [isPending, setIsPending] = (0, import_react42.useState)(false);
+  const handleTextChange = (0, import_react42.useCallback)((event) => {
     setText(event.target.value);
   }, []);
-  const handleRateUp = (0, import_react41.useCallback)(() => {
+  const handleRateUp = (0, import_react42.useCallback)(() => {
     setRating("up");
   }, []);
-  const handleRateDown = (0, import_react41.useCallback)(() => {
+  const handleRateDown = (0, import_react42.useCallback)(() => {
     setRating("down");
   }, []);
-  const handleSubmit = (0, import_react41.useCallback)(async (event) => {
+  const handleSubmit = (0, import_react42.useCallback)(async (event) => {
     event.preventDefault();
     if (!rating) {
       setError("Choose a direction first.");
@@ -8082,7 +8350,7 @@ function FeedbackWidget({
       setIsPending(false);
     }
   }, [context, onSubmit, rating, text, user?.id]);
-  return /* @__PURE__ */ import_react41.default.createElement("form", { className: "brokr-card brokr-feedback-shell", onSubmit: handleSubmit }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-section", style: { gap: "0.5rem" } }, /* @__PURE__ */ import_react41.default.createElement("strong", null, "How did this feel?"), /* @__PURE__ */ import_react41.default.createElement("p", { className: "brokr-copy" }, "Tight signal only. Tell us what helped or what felt off.")), /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-feedback-rating" }, /* @__PURE__ */ import_react41.default.createElement(
+  return /* @__PURE__ */ import_react42.default.createElement("form", { className: "brokr-card brokr-feedback-shell", onSubmit: handleSubmit }, /* @__PURE__ */ import_react42.default.createElement("div", { className: "brokr-section", style: { gap: "0.5rem" } }, /* @__PURE__ */ import_react42.default.createElement("strong", null, "How did this feel?"), /* @__PURE__ */ import_react42.default.createElement("p", { className: "brokr-copy" }, "Tight signal only. Tell us what helped or what felt off.")), /* @__PURE__ */ import_react42.default.createElement("div", { className: "brokr-feedback-rating" }, /* @__PURE__ */ import_react42.default.createElement(
     "button",
     {
       className: "brokr-rating-button",
@@ -8091,7 +8359,7 @@ function FeedbackWidget({
       type: "button"
     },
     "This worked"
-  ), /* @__PURE__ */ import_react41.default.createElement(
+  ), /* @__PURE__ */ import_react42.default.createElement(
     "button",
     {
       className: "brokr-rating-button",
@@ -8100,7 +8368,7 @@ function FeedbackWidget({
       type: "button"
     },
     "Needs work"
-  )), /* @__PURE__ */ import_react41.default.createElement(
+  )), /* @__PURE__ */ import_react42.default.createElement(
     "textarea",
     {
       className: "brokr-textarea",
@@ -8109,11 +8377,11 @@ function FeedbackWidget({
       rows: 4,
       value: text
     }
-  ), error ? /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null, message ? /* @__PURE__ */ import_react41.default.createElement("div", { className: "brokr-inline-message" }, message) : null, /* @__PURE__ */ import_react41.default.createElement("button", { className: "brokr-button", disabled: isPending, type: "submit" }, isPending ? "Sending" : "Send feedback"));
+  ), error ? /* @__PURE__ */ import_react42.default.createElement("div", { className: "brokr-inline-message", "data-tone": "error" }, error) : null, message ? /* @__PURE__ */ import_react42.default.createElement("div", { className: "brokr-inline-message" }, message) : null, /* @__PURE__ */ import_react42.default.createElement("button", { className: "brokr-button", disabled: isPending, type: "submit" }, isPending ? "Sending" : "Send feedback"));
 }
 
 // src/react/BrokrErrorBoundary.tsx
-var import_react42 = __toESM(require("react"));
+var import_react43 = __toESM(require("react"));
 
 // src/fix-registry.ts
 var FIX_REGISTRY = {
@@ -8337,7 +8605,7 @@ var BrokrError = class extends Error {
 };
 
 // src/react/BrokrErrorBoundary.tsx
-var BrokrErrorBoundary = class extends import_react42.default.Component {
+var BrokrErrorBoundary = class extends import_react43.default.Component {
   constructor() {
     super(...arguments);
     this.state = { hasError: false, error: null };
@@ -8349,11 +8617,11 @@ var BrokrErrorBoundary = class extends import_react42.default.Component {
     if (this.state.hasError) {
       if (this.props.fallback) return this.props.fallback;
       const message = this.state.error instanceof BrokrError ? this.state.error.toUserMessage() : "Something went wrong.";
-      return import_react42.default.createElement(
+      return import_react43.default.createElement(
         "div",
         { style: { padding: 24, textAlign: "center" } },
-        import_react42.default.createElement("p", null, message),
-        import_react42.default.createElement(
+        import_react43.default.createElement("p", null, message),
+        import_react43.default.createElement(
           "button",
           {
             onClick: () => this.setState({ hasError: false, error: null }),
@@ -8367,13 +8635,13 @@ var BrokrErrorBoundary = class extends import_react42.default.Component {
   }
 };
 
-// src/react/notifications/NotificationBell.tsx
-var import_react44 = __toESM(require("react"));
+// src/react/notifications/ActivityFeed.tsx
+var import_react45 = __toESM(require("react"));
 
 // src/react/notifications/use-notifications.ts
-var import_react43 = require("react");
+var import_react44 = require("react");
 function useNotifications() {
-  const ctx = (0, import_react43.useContext)(NotificationsContext);
+  const ctx = (0, import_react44.useContext)(NotificationsContext);
   if (!ctx) {
     throw new Error(
       "useNotifications() requires <BrokrProvider notifications> or <BrokrProvider notifications={config}>. Pass the notifications prop to enable the notification system."
@@ -8382,7 +8650,7 @@ function useNotifications() {
   return ctx;
 }
 
-// src/react/notifications/NotificationBell.tsx
+// src/react/notifications/ActivityFeed.tsx
 function timeAgo(iso) {
   const diff = Date.now() - new Date(iso).getTime();
   const mins = Math.floor(diff / 6e4);
@@ -8393,16 +8661,79 @@ function timeAgo(iso) {
   const days = Math.floor(hours / 24);
   return `${days}d ago`;
 }
+function FeedItem({
+  item,
+  formatter
+}) {
+  if (formatter) {
+    return /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed-item" }, formatter(item));
+  }
+  return /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed-item" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: `brokr-feed-dot brokr-feed-dot--${item.variant}` }), /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed-content" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-feed-title" }, item.title), item.message ? /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-feed-message" }, item.message) : null), /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-feed-time" }, timeAgo(item.createdAt)));
+}
+function ActivityFeed({
+  filter,
+  maxItems = 20,
+  formatters,
+  emptyState
+}) {
+  const { notifications, isLoading } = useNotifications();
+  const items = (0, import_react45.useMemo)(() => {
+    let filtered = notifications;
+    if (filter && filter.length > 0) {
+      const set = new Set(filter);
+      filtered = notifications.filter(
+        (n) => set.has(n.variant) || n.type && set.has(n.type)
+      );
+    }
+    return [...filtered].sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()).slice(0, maxItems);
+  }, [notifications, filter, maxItems]);
+  const getFormatter = (0, import_react45.useCallback)(
+    (item) => {
+      if (!formatters) return void 0;
+      if (item.type && formatters[item.type]) return formatters[item.type];
+      if (formatters[item.variant]) return formatters[item.variant];
+      return void 0;
+    },
+    [formatters]
+  );
+  if (isLoading) {
+    return /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed" }, [1, 2, 3].map((i) => /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed-item", key: i }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-feed-dot" }), /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed-content" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-skeleton", style: { width: "60%", height: 12 } }), /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-skeleton", style: { width: "80%", height: 12 } })), /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-skeleton", style: { width: 40, height: 12 } }))));
+  }
+  if (items.length === 0) {
+    return /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed-empty" }, emptyState ?? /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-copy" }, "No activity yet.")));
+  }
+  return /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-feed" }, items.map((item) => /* @__PURE__ */ import_react45.default.createElement(
+    FeedItem,
+    {
+      key: item.id,
+      item,
+      formatter: getFormatter(item)
+    }
+  )));
+}
+
+// src/react/notifications/NotificationBell.tsx
+var import_react46 = __toESM(require("react"));
+function timeAgo2(iso) {
+  const diff = Date.now() - new Date(iso).getTime();
+  const mins = Math.floor(diff / 6e4);
+  if (mins < 1) return "just now";
+  if (mins < 60) return `${mins}m ago`;
+  const hours = Math.floor(mins / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  return `${days}d ago`;
+}
 function NotifDropdownItem({
   notif,
   registry,
   onClick
 }) {
-  const handleClick = (0, import_react44.useCallback)(() => onClick(notif), [notif, onClick]);
+  const handleClick = (0, import_react46.useCallback)(() => onClick(notif), [notif, onClick]);
   const notifData = notif.data ?? {};
   const notifType = notifData.type ?? "default";
   const resolved = resolveNotificationType(registry, notifType, notifData);
-  return /* @__PURE__ */ import_react44.default.createElement(
+  return /* @__PURE__ */ import_react46.default.createElement(
     "button",
     {
       type: "button",
@@ -8410,18 +8741,18 @@ function NotifDropdownItem({
       onClick: handleClick,
       role: "menuitem"
     },
-    resolved.image ? /* @__PURE__ */ import_react44.default.createElement("img", { src: resolved.image.url, alt: resolved.image.alt, className: "brokr-notif-item-logo" }) : /* @__PURE__ */ import_react44.default.createElement("span", { className: `brokr-notif-item-dot brokr-notif-item-dot--${notif.variant}` }),
-    /* @__PURE__ */ import_react44.default.createElement("div", { className: "brokr-notif-item-body" }, /* @__PURE__ */ import_react44.default.createElement("span", { className: "brokr-notif-item-title" }, notif.title), /* @__PURE__ */ import_react44.default.createElement("span", { className: "brokr-notif-item-message" }, notif.message)),
-    /* @__PURE__ */ import_react44.default.createElement("span", { className: "brokr-notif-item-time" }, timeAgo(notif.createdAt))
+    resolved.image ? /* @__PURE__ */ import_react46.default.createElement("img", { src: resolved.image.url, alt: resolved.image.alt, className: "brokr-notif-item-logo" }) : /* @__PURE__ */ import_react46.default.createElement("span", { className: `brokr-notif-item-dot brokr-notif-item-dot--${notif.variant}` }),
+    /* @__PURE__ */ import_react46.default.createElement("div", { className: "brokr-notif-item-body" }, /* @__PURE__ */ import_react46.default.createElement("span", { className: "brokr-notif-item-title" }, notif.title), /* @__PURE__ */ import_react46.default.createElement("span", { className: "brokr-notif-item-message" }, notif.message)),
+    /* @__PURE__ */ import_react46.default.createElement("span", { className: "brokr-notif-item-time" }, timeAgo2(notif.createdAt))
   );
 }
 function NotificationBell() {
   const { notifications, unreadCount, markRead, markAllRead, isLoading, registry } = useNotifications();
-  const [open, setOpen] = (0, import_react44.useState)(false);
-  const containerRef = (0, import_react44.useRef)(null);
-  const markReadTimerRef = (0, import_react44.useRef)(null);
-  const toggle = (0, import_react44.useCallback)(() => setOpen((o) => !o), []);
-  (0, import_react44.useEffect)(() => {
+  const [open, setOpen] = (0, import_react46.useState)(false);
+  const containerRef = (0, import_react46.useRef)(null);
+  const markReadTimerRef = (0, import_react46.useRef)(null);
+  const toggle = (0, import_react46.useCallback)(() => setOpen((o) => !o), []);
+  (0, import_react46.useEffect)(() => {
     if (markReadTimerRef.current) {
       clearTimeout(markReadTimerRef.current);
       markReadTimerRef.current = null;
@@ -8438,7 +8769,7 @@ function NotificationBell() {
       }
     };
   }, [open, unreadCount, markAllRead]);
-  (0, import_react44.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (!open) return;
     function handleClick(e) {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -8448,7 +8779,7 @@ function NotificationBell() {
     document.addEventListener("mousedown", handleClick);
     return () => document.removeEventListener("mousedown", handleClick);
   }, [open]);
-  (0, import_react44.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (!open) return;
     function handleKey(e) {
       if (e.key === "Escape") setOpen(false);
@@ -8456,13 +8787,13 @@ function NotificationBell() {
     document.addEventListener("keydown", handleKey);
     return () => document.removeEventListener("keydown", handleKey);
   }, [open]);
-  const sorted = (0, import_react44.useMemo)(
+  const sorted = (0, import_react46.useMemo)(
     () => [...notifications].sort(
       (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
     ),
     [notifications]
   );
-  const handleItemClick = (0, import_react44.useCallback)((notif) => {
+  const handleItemClick = (0, import_react46.useCallback)((notif) => {
     if (!notif.read) markRead(notif.id);
     const notifData = notif.data ?? {};
     const notifType = notif.type ?? notifData.type ?? "default";
@@ -8472,7 +8803,7 @@ function NotificationBell() {
       window.location.assign(href);
     }
   }, [markRead, registry]);
-  return /* @__PURE__ */ import_react44.default.createElement("div", { className: "brokr-notif-bell-wrap", ref: containerRef }, /* @__PURE__ */ import_react44.default.createElement(
+  return /* @__PURE__ */ import_react46.default.createElement("div", { className: "brokr-notif-bell-wrap", ref: containerRef }, /* @__PURE__ */ import_react46.default.createElement(
     "button",
     {
       type: "button",
@@ -8482,9 +8813,9 @@ function NotificationBell() {
       "aria-expanded": open,
       "aria-haspopup": "menu"
     },
-    /* @__PURE__ */ import_react44.default.createElement("svg", { "aria-hidden": "true", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.75", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react44.default.createElement("path", { d: "M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" }), /* @__PURE__ */ import_react44.default.createElement("path", { d: "M10.3 21a1.94 1.94 0 0 0 3.4 0" })),
-    unreadCount > 0 && /* @__PURE__ */ import_react44.default.createElement("span", { className: "brokr-notif-badge" }, unreadCount > 99 ? "99+" : unreadCount)
-  ), open && /* @__PURE__ */ import_react44.default.createElement("div", { className: "brokr-notif-dropdown", role: "menu" }, /* @__PURE__ */ import_react44.default.createElement("div", { className: "brokr-notif-dropdown-header" }, /* @__PURE__ */ import_react44.default.createElement("span", { className: "brokr-notif-dropdown-title" }, "Notifications"), unreadCount > 0 && /* @__PURE__ */ import_react44.default.createElement(
+    /* @__PURE__ */ import_react46.default.createElement("svg", { "aria-hidden": "true", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.75", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react46.default.createElement("path", { d: "M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" }), /* @__PURE__ */ import_react46.default.createElement("path", { d: "M10.3 21a1.94 1.94 0 0 0 3.4 0" })),
+    unreadCount > 0 && /* @__PURE__ */ import_react46.default.createElement("span", { className: "brokr-notif-badge" }, unreadCount > 99 ? "99+" : unreadCount)
+  ), open && /* @__PURE__ */ import_react46.default.createElement("div", { className: "brokr-notif-dropdown", role: "menu" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "brokr-notif-dropdown-header" }, /* @__PURE__ */ import_react46.default.createElement("span", { className: "brokr-notif-dropdown-title" }, "Notifications"), unreadCount > 0 && /* @__PURE__ */ import_react46.default.createElement(
     "button",
     {
       type: "button",
@@ -8492,7 +8823,7 @@ function NotificationBell() {
       onClick: markAllRead
     },
     "Mark all read"
-  )), /* @__PURE__ */ import_react44.default.createElement("div", { className: "brokr-notif-dropdown-list" }, isLoading ? /* @__PURE__ */ import_react44.default.createElement("div", { className: "brokr-notif-empty" }, /* @__PURE__ */ import_react44.default.createElement("span", { className: "brokr-notif-empty-text" }, "Loading\u2026")) : sorted.length === 0 ? /* @__PURE__ */ import_react44.default.createElement("div", { className: "brokr-notif-empty" }, /* @__PURE__ */ import_react44.default.createElement("span", { className: "brokr-notif-empty-text" }, "No notifications yet")) : sorted.map((notif) => /* @__PURE__ */ import_react44.default.createElement(
+  )), /* @__PURE__ */ import_react46.default.createElement("div", { className: "brokr-notif-dropdown-list" }, isLoading ? /* @__PURE__ */ import_react46.default.createElement("div", { className: "brokr-notif-empty" }, /* @__PURE__ */ import_react46.default.createElement("span", { className: "brokr-notif-empty-text" }, "Loading\u2026")) : sorted.length === 0 ? /* @__PURE__ */ import_react46.default.createElement("div", { className: "brokr-notif-empty" }, /* @__PURE__ */ import_react46.default.createElement("span", { className: "brokr-notif-empty-text" }, "No notifications yet")) : sorted.map((notif) => /* @__PURE__ */ import_react46.default.createElement(
     NotifDropdownItem,
     {
       key: notif.id,
@@ -8504,7 +8835,7 @@ function NotificationBell() {
 }
 
 // src/react/notifications/NotificationList.tsx
-var import_react45 = __toESM(require("react"));
+var import_react47 = __toESM(require("react"));
 function formatTimestamp(iso) {
   const date = new Date(iso);
   return new Intl.DateTimeFormat("en-US", {
@@ -8515,38 +8846,38 @@ function formatTimestamp(iso) {
   }).format(date);
 }
 function NotificationListSkeleton() {
-  return /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-notif-list-items" }, [1, 2, 3].map((i) => /* @__PURE__ */ import_react45.default.createElement("div", { key: i, className: "brokr-notif-list-row brokr-notif-list-row--skeleton" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-item-dot brokr-notif-item-dot--skeleton" }), /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-notif-item-body" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-item-title brokr-skeleton-line", style: { width: "60%" } }), /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-item-message brokr-skeleton-line", style: { width: "80%" } })), /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-item-time brokr-skeleton-line", style: { width: 48 } }))));
+  return /* @__PURE__ */ import_react47.default.createElement("div", { className: "brokr-notif-list-items" }, [1, 2, 3].map((i) => /* @__PURE__ */ import_react47.default.createElement("div", { key: i, className: "brokr-notif-list-row brokr-notif-list-row--skeleton" }, /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-item-dot brokr-notif-item-dot--skeleton" }), /* @__PURE__ */ import_react47.default.createElement("div", { className: "brokr-notif-item-body" }, /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-item-title brokr-skeleton-line", style: { width: "60%" } }), /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-item-message brokr-skeleton-line", style: { width: "80%" } })), /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-item-time brokr-skeleton-line", style: { width: 48 } }))));
 }
 function NotifListItem({
   notif,
   registry,
   onClick
 }) {
-  const handleClick = (0, import_react45.useCallback)(() => onClick(notif), [notif, onClick]);
+  const handleClick = (0, import_react47.useCallback)(() => onClick(notif), [notif, onClick]);
   const notifData = notif.data ?? {};
   const notifType = notif.type ?? notifData.type ?? "default";
   const resolved = resolveNotificationType(registry, notifType, notifData);
-  return /* @__PURE__ */ import_react45.default.createElement(
+  return /* @__PURE__ */ import_react47.default.createElement(
     "button",
     {
       type: "button",
       className: `brokr-notif-list-row${notif.read ? "" : " brokr-notif-list-row--unread"}`,
       onClick: handleClick
     },
-    resolved.image ? /* @__PURE__ */ import_react45.default.createElement("img", { src: resolved.image.url, alt: resolved.image.alt, className: "brokr-notif-item-logo" }) : /* @__PURE__ */ import_react45.default.createElement("span", { className: `brokr-notif-item-dot brokr-notif-item-dot--${notif.variant}` }),
-    /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-notif-item-body" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-item-title" }, notif.title), /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-item-message" }, notif.message)),
-    /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-item-time" }, formatTimestamp(notif.createdAt))
+    resolved.image ? /* @__PURE__ */ import_react47.default.createElement("img", { src: resolved.image.url, alt: resolved.image.alt, className: "brokr-notif-item-logo" }) : /* @__PURE__ */ import_react47.default.createElement("span", { className: `brokr-notif-item-dot brokr-notif-item-dot--${notif.variant}` }),
+    /* @__PURE__ */ import_react47.default.createElement("div", { className: "brokr-notif-item-body" }, /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-item-title" }, notif.title), /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-item-message" }, notif.message)),
+    /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-item-time" }, formatTimestamp(notif.createdAt))
   );
 }
 function NotificationList() {
   const { notifications, unreadCount, markRead, markAllRead, isLoading, registry } = useNotifications();
-  const sorted = (0, import_react45.useMemo)(
+  const sorted = (0, import_react47.useMemo)(
     () => [...notifications].sort(
       (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
     ),
     [notifications]
   );
-  const handleClick = (0, import_react45.useCallback)((notif) => {
+  const handleClick = (0, import_react47.useCallback)((notif) => {
     if (!notif.read) markRead(notif.id);
     const notifData = notif.data ?? {};
     const notifType = notif.type ?? notifData.type ?? "default";
@@ -8556,7 +8887,7 @@ function NotificationList() {
       window.location.assign(href);
     }
   }, [markRead, registry]);
-  return /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-notif-list" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-notif-list-header" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-list-title" }, "Notifications"), unreadCount > 0 && /* @__PURE__ */ import_react45.default.createElement(
+  return /* @__PURE__ */ import_react47.default.createElement("div", { className: "brokr-notif-list" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "brokr-notif-list-header" }, /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-list-title" }, "Notifications"), unreadCount > 0 && /* @__PURE__ */ import_react47.default.createElement(
     "button",
     {
       type: "button",
@@ -8564,7 +8895,7 @@ function NotificationList() {
       onClick: markAllRead
     },
     "Mark all read"
-  )), isLoading ? /* @__PURE__ */ import_react45.default.createElement(NotificationListSkeleton, null) : sorted.length === 0 ? /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-notif-empty" }, /* @__PURE__ */ import_react45.default.createElement("svg", { "aria-hidden": "true", width: "40", height: "40", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1", strokeLinecap: "round", strokeLinejoin: "round", style: { opacity: 0.3 } }, /* @__PURE__ */ import_react45.default.createElement("path", { d: "M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" }), /* @__PURE__ */ import_react45.default.createElement("path", { d: "M10.3 21a1.94 1.94 0 0 0 3.4 0" })), /* @__PURE__ */ import_react45.default.createElement("span", { className: "brokr-notif-empty-text" }, "No notifications yet")) : /* @__PURE__ */ import_react45.default.createElement("div", { className: "brokr-notif-list-items" }, sorted.map((notif) => /* @__PURE__ */ import_react45.default.createElement(
+  )), isLoading ? /* @__PURE__ */ import_react47.default.createElement(NotificationListSkeleton, null) : sorted.length === 0 ? /* @__PURE__ */ import_react47.default.createElement("div", { className: "brokr-notif-empty" }, /* @__PURE__ */ import_react47.default.createElement("svg", { "aria-hidden": "true", width: "40", height: "40", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1", strokeLinecap: "round", strokeLinejoin: "round", style: { opacity: 0.3 } }, /* @__PURE__ */ import_react47.default.createElement("path", { d: "M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" }), /* @__PURE__ */ import_react47.default.createElement("path", { d: "M10.3 21a1.94 1.94 0 0 0 3.4 0" })), /* @__PURE__ */ import_react47.default.createElement("span", { className: "brokr-notif-empty-text" }, "No notifications yet")) : /* @__PURE__ */ import_react47.default.createElement("div", { className: "brokr-notif-list-items" }, sorted.map((notif) => /* @__PURE__ */ import_react47.default.createElement(
     NotifListItem,
     {
       key: notif.id,
@@ -8605,6 +8936,7 @@ function defineAccount(config) {
 0 && (module.exports = {
   AIChat,
   AccountPanel,
+  ActivityFeed,
   AuthPageShell,
   AuthWall,
   AutoReloadToggle,
@@ -8634,8 +8966,10 @@ function defineAccount(config) {
   UpdateBilling,
   UpgradePrompt,
   UsageGate,
+  UsageGrid,
   UserButton,
   defineAccount,
+  defineBrokrTheme,
   defineChat,
   useBrokr,
   useBrokrTheme,