@marimo-team/islands 0.23.7-dev20 → 0.23.7-dev23

package/dist/{chat-ui-Cf4tuQ8s.js → chat-ui-Den2QMz-.js}

@@ -6,16 +6,16 @@ import { _ as Logger, c as Objects, g as cn, l as useEventListener, t as Button
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
 import { r as toast } from "./copy-DLf4aN7I.js";
-import { C as AccordionContent, D as ChatBubbleIcon, En as Trash2, Ft as jotaiJsonStorage, G as cellErrorsAtom, Ht as allTablesAtom, It as variablesAtom, Kt as getRequestClient, Lt as PluralWord, Nn as Info, Ot as moveToEndOfEditor, P as base64ToDataURL, Rn as CircleX, S as Accordion, T as AccordionTrigger, Tn as Wrench, Tt as createVariableInfoElement, Ut as dataSourceConnectionsAtom, V as renderHTML, Wt as getTableType, Xt as singleFacet, Y as notebookAtom, _ as Boosts, _n as atomWithStorage, b as AIContextProvider, c as Popover, d as PopoverTrigger, f as isOutputEmpty, h as DatasourceContextProvider, jn as LoaderCircle, n as MarkdownRenderer, on as CellOutputId, s as Spinner, t as toPng, tn as ZodLocalStorage, u as PopoverContent, v as Sections, vt as displayCellName, w as AccordionItem, x as AIContextRegistry, y as contextToXml, yn as Anchor2 } from "./html-to-image-q0T1ijn_.js";
+import { C as AccordionContent, D as ChatBubbleIcon, En as Trash2, Ft as jotaiJsonStorage, G as cellErrorsAtom, Ht as allTablesAtom, In as ExternalLink, It as variablesAtom, Kt as getRequestClient, Lt as PluralWord, Nn as Info, Ot as moveToEndOfEditor, P as base64ToDataURL, Pn as FileText, S as Accordion, T as AccordionTrigger, Tn as Wrench, Tt as createVariableInfoElement, Ut as dataSourceConnectionsAtom, V as renderHTML, Wt as getTableType, Xt as singleFacet, Y as notebookAtom, _ as Boosts, _n as atomWithStorage, b as AIContextProvider, c as Popover, d as PopoverTrigger, f as isOutputEmpty, h as DatasourceContextProvider, jn as LoaderCircle, n as MarkdownRenderer, on as CellOutputId, s as Spinner, t as toPng, tn as ZodLocalStorage, u as PopoverContent, v as Sections, vt as displayCellName, w as AccordionItem, x as AIContextRegistry, y as contextToXml, yn as Anchor2, zn as CircleX } from "./html-to-image-DxWM1HVj.js";
 import "./chunk-5FQGJX7Z-BOg95xG5.js";
 import { u as createLucideIcon } from "./dist-D3ZI9nhS.js";
-import { F as X, S as logNever, t as Strings } from "./strings-BiIhGaI8.js";
+import { F as X, L as ChevronDown, S as logNever, t as Strings } from "./strings-BiIhGaI8.js";
 import { a as NumberField, b as DropdownMenuTrigger, d as DropdownMenuContent, p as DropdownMenuItem, r as Input, u as DropdownMenu } from "./input-Cc1Vvw9A.js";
-import { v as CircleQuestionMark } from "./toDate-CJWlVNGD.js";
-import { a as MarimoIncomingMessageEvent, d as File$1, n as blobToString, t as processOutput, u as deserializeBlob } from "./process-output-DTKS9bKk.js";
+import { p as isUrl, v as CircleQuestionMark } from "./toDate-CJWlVNGD.js";
+import { a as MarimoIncomingMessageEvent, d as File$1, n as blobToString, t as processOutput, u as deserializeBlob } from "./process-output-DBYxXdrN.js";
 import "./react-dom-BWRJ_g_k.js";
 import { t as require_jsx_runtime } from "./jsx-runtime-COBk7ree.js";
-import { B as union, C as any, D as discriminatedUnion, E as custom, H as safeParseAsync, I as record, L as strictObject, M as never, N as number, O as lazy, P as object$1, R as string, S as _null, T as boolean, V as unknown, W as toJSONSchema, b as _enum, k as literal, w as array$1, x as _instanceof } from "./zod-BWkcDORu.js";
+import { A as looseObject, B as union, C as any, D as discriminatedUnion, E as custom, H as safeParseAsync, I as record, L as strictObject, M as never, N as number, O as lazy, P as object$1, R as string, S as _null, T as boolean, V as unknown, W as toJSONSchema, b as _enum, k as literal, w as array$1, x as _instanceof } from "./zod-BWkcDORu.js";
 import { n as ErrorBanner } from "./error-banner-CVkfBUT3.js";
 import { t as Label } from "./label-BLqV33b1.js";
 import { t as Tooltip } from "./tooltip-DRaMBu06.js";
@@ -33,7 +33,15 @@ import "./dist-nuW5EDYT.js";
 import { n as minimalSetup, t as esm_default } from "./esm-CWp0KQeK.js";
 import "./purify.es-DT70lfR0.js";
 import { t as useAsyncData } from "./useAsyncData-C56Khv_R.js";
-var BotMessageSquare = createLucideIcon("bot-message-square", [
+var Ban = createLucideIcon("ban", [["path", {
+  d: "M4.929 4.929 19.07 19.071",
+  key: "196cmz"
+}], ["circle", {
+  cx: "12",
+  cy: "12",
+  r: "10",
+  key: "1mglay"
+}]]), BotMessageSquare = createLucideIcon("bot-message-square", [
   ["path", {
     d: "M12 6V2H8",
     key: "1155em"
@@ -87,7 +95,20 @@ var BotMessageSquare = createLucideIcon("bot-message-square", [
   cy: "12",
   r: "3",
   key: "1v7zrd"
-}]]);
+}]]), ShieldQuestionMark = createLucideIcon("shield-question-mark", [
+  ["path", {
+    d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z",
+    key: "oel41y"
+  }],
+  ["path", {
+    d: "M9.1 9a3 3 0 0 1 5.82 1c0 2-3 3-3 3",
+    key: "mhlwft"
+  }],
+  ["path", {
+    d: "M12 17h.01",
+    key: "p32p05"
+  }]
+]);
 require_compiler_runtime();
 var import_react = /* @__PURE__ */ __toESM(require_react(), 1), marker$2 = "vercel.ai.error", symbol$2 = Symbol.for(marker$2), _a$2, _b$1, AISDKError = class e extends (_b$1 = Error, _a$2 = symbol$2, _b$1) {
   constructor({ name: e18, message: h, cause: g }) {
@@ -2885,42 +2906,107 @@ var ParseError = class extends Error {
   constructor(e18, h) {
     super(e18), this.name = "ParseError", this.type = h.type, this.field = h.field, this.value = h.value, this.line = h.line;
   }
-};
+}, LF = 10, CR = 13, SPACE = 32;
 function noop(e18) {
 }
 function createParser(e18) {
   if (typeof e18 == "function") throw TypeError("`callbacks` must be an object, got a function instead. Did you mean `{onEvent: fn}`?");
-  let { onEvent: h = noop, onError: g = noop, onRetry: _ = noop, onComment: v } = e18, y = "", b = true, x, S = "", C = "";
-  function w(e19) {
-    let h2 = b ? e19.replace(/^\xEF\xBB\xBF/, "") : e19, [g2, _2] = splitLines(`${y}${h2}`);
-    for (let e20 of g2) T(e20);
-    y = _2, b = false;
-  }
+  let { onEvent: h = noop, onError: g = noop, onRetry: _ = noop, onComment: v } = e18, y = [], b = true, x, S = "", C = 0, w;
   function T(e19) {
-    if (e19 === "") {
-      D();
+    if (b && (b = false, e19.charCodeAt(0) === 239 && e19.charCodeAt(1) === 187 && e19.charCodeAt(2) === 191 && (e19 = e19.slice(3))), y.length === 0) {
+      let h3 = E(e19);
+      h3 !== "" && y.push(h3);
       return;
     }
-    if (e19.startsWith(":")) {
-      v && v(e19.slice(e19.startsWith(": ") ? 2 : 1));
+    if (e19.indexOf("\n") === -1 && e19.indexOf("\r") === -1) {
+      y.push(e19);
       return;
     }
-    let h2 = e19.indexOf(":");
-    if (h2 !== -1) {
-      let g2 = e19.slice(0, h2), _2 = e19[h2 + 1] === " " ? 2 : 1;
-      E(g2, e19.slice(h2 + _2), e19);
+    y.push(e19);
+    let h2 = y.join("");
+    y.length = 0;
+    let g2 = E(h2);
+    g2 !== "" && y.push(g2);
+  }
+  function E(e19) {
+    let g2 = 0;
+    if (e19.indexOf("\r") === -1) {
+      let _2 = e19.indexOf("\n", g2);
+      for (; _2 !== -1; ) {
+        if (g2 === _2) {
+          C > 0 && h({
+            id: x,
+            event: w,
+            data: S
+          }), x = void 0, S = "", C = 0, w = void 0, g2 = _2 + 1, _2 = e19.indexOf("\n", g2);
+          continue;
+        }
+        let v2 = e19.charCodeAt(g2);
+        if (isDataPrefix(e19, g2, v2)) {
+          let v3 = e19.charCodeAt(g2 + 5) === SPACE ? g2 + 6 : g2 + 5, y2 = e19.slice(v3, _2);
+          if (C === 0 && e19.charCodeAt(_2 + 1) === LF) {
+            h({
+              id: x,
+              event: w,
+              data: y2
+            }), x = void 0, S = "", w = void 0, g2 = _2 + 2, _2 = e19.indexOf("\n", g2);
+            continue;
+          }
+          S = C === 0 ? y2 : `${S}
+${y2}`, C++;
+        } else isEventPrefix(e19, g2, v2) ? w = e19.slice(e19.charCodeAt(g2 + 6) === SPACE ? g2 + 7 : g2 + 6, _2) || void 0 : D(e19, g2, _2);
+        g2 = _2 + 1, _2 = e19.indexOf("\n", g2);
+      }
+      return e19.slice(g2);
+    }
+    for (; g2 < e19.length; ) {
+      let h2 = e19.indexOf("\r", g2), _2 = e19.indexOf("\n", g2), v2 = -1;
+      if (h2 !== -1 && _2 !== -1 ? v2 = h2 < _2 ? h2 : _2 : h2 === -1 ? _2 !== -1 && (v2 = _2) : v2 = h2 === e19.length - 1 ? -1 : h2, v2 === -1) break;
+      D(e19, g2, v2), g2 = v2 + 1, e19.charCodeAt(g2 - 1) === CR && e19.charCodeAt(g2) === LF && g2++;
+    }
+    return e19.slice(g2);
+  }
+  function D(e19, h2, g2) {
+    if (h2 === g2) {
+      k();
       return;
     }
-    E(e19, "", e19);
+    let _2 = e19.charCodeAt(h2);
+    if (isDataPrefix(e19, h2, _2)) {
+      let _3 = e19.charCodeAt(h2 + 5) === SPACE ? h2 + 6 : h2 + 5, v2 = e19.slice(_3, g2);
+      S = C === 0 ? v2 : `${S}
+${v2}`, C++;
+      return;
+    }
+    if (isEventPrefix(e19, h2, _2)) {
+      w = e19.slice(e19.charCodeAt(h2 + 6) === SPACE ? h2 + 7 : h2 + 6, g2) || void 0;
+      return;
+    }
+    if (_2 === 105 && e19.charCodeAt(h2 + 1) === 100 && e19.charCodeAt(h2 + 2) === 58) {
+      let _3 = e19.slice(e19.charCodeAt(h2 + 3) === SPACE ? h2 + 4 : h2 + 3, g2);
+      x = _3.includes("\0") ? void 0 : _3;
+      return;
+    }
+    if (_2 === 58) {
+      v && v(e19.slice(h2, g2).slice(e19.charCodeAt(h2 + 1) === SPACE ? 2 : 1));
+      return;
+    }
+    let y2 = e19.slice(h2, g2), b2 = y2.indexOf(":");
+    if (b2 === -1) {
+      O(y2, "", y2);
+      return;
+    }
+    let T2 = y2.slice(0, b2), E2 = y2.charCodeAt(b2 + 1) === SPACE ? 2 : 1;
+    O(T2, y2.slice(b2 + E2), y2);
   }
-  function E(e19, h2, v2) {
+  function O(e19, h2, v2) {
     switch (e19) {
       case "event":
-        C = h2;
+        w = h2 || void 0;
         break;
       case "data":
-        S = `${S}${h2}
-`;
+        S = C === 0 ? h2 : `${S}
+${h2}`, C++;
         break;
       case "id":
         x = h2.includes("\0") ? void 0 : h2;
@@ -2942,34 +3028,30 @@ function createParser(e18) {
         break;
     }
   }
-  function D() {
-    S.length > 0 && h({
+  function k() {
+    C > 0 && h({
       id: x,
-      event: C || void 0,
-      data: S.endsWith("\n") ? S.slice(0, -1) : S
-    }), x = void 0, S = "", C = "";
-  }
-  function O(e19 = {}) {
-    y && e19.consume && T(y), b = true, x = void 0, S = "", C = "", y = "";
+      event: w,
+      data: S
+    }), x = void 0, S = "", C = 0, w = void 0;
+  }
+  function A(e19 = {}) {
+    if (e19.consume && y.length > 0) {
+      let e20 = y.join("");
+      D(e20, 0, e20.length);
+    }
+    b = true, x = void 0, S = "", C = 0, w = void 0, y.length = 0;
   }
   return {
-    feed: w,
-    reset: O
+    feed: T,
+    reset: A
   };
 }
-function splitLines(e18) {
-  let h = [], g = "", _ = 0;
-  for (; _ < e18.length; ) {
-    let v = e18.indexOf("\r", _), y = e18.indexOf("\n", _), b = -1;
-    if (v !== -1 && y !== -1 ? b = Math.min(v, y) : v === -1 ? y !== -1 && (b = y) : b = v === e18.length - 1 ? -1 : v, b === -1) {
-      g = e18.slice(_);
-      break;
-    } else {
-      let g2 = e18.slice(_, b);
-      h.push(g2), _ = b + 1, e18[_ - 1] === "\r" && e18[_] === "\n" && _++;
-    }
-  }
-  return [h, g];
+function isDataPrefix(e18, h, g) {
+  return g === 100 && e18.charCodeAt(h + 1) === 97 && e18.charCodeAt(h + 2) === 116 && e18.charCodeAt(h + 3) === 97 && e18.charCodeAt(h + 4) === 58;
+}
+function isEventPrefix(e18, h, g) {
+  return g === 101 && e18.charCodeAt(h + 1) === 118 && e18.charCodeAt(h + 2) === 101 && e18.charCodeAt(h + 3) === 110 && e18.charCodeAt(h + 4) === 116 && e18.charCodeAt(h + 5) === 58;
 }
 var EventSourceParserStream = class extends TransformStream {
   constructor({ onError: e18, onRetry: h, onComment: g } = {}) {
@@ -4221,7 +4303,7 @@ function mergeObjects(e18, h) {
   if (e18 === void 0) return h;
   if (h === void 0) return e18;
   let g = { ...e18 };
-  for (let _ in h) if (Object.prototype.hasOwnProperty.call(h, _)) {
+  for (let _ in h) if (!(_ === "__proto__" || _ === "constructor" || _ === "prototype") && Object.prototype.hasOwnProperty.call(h, _)) {
     let v = h[_];
     if (v === void 0) continue;
     let y = _ in e18 ? e18[_] : void 0, b = typeof v == "object" && !!v && !Array.isArray(v) && !(v instanceof Date) && !(v instanceof RegExp), x = typeof y == "object" && !!y && !Array.isArray(y) && !(y instanceof Date) && !(y instanceof RegExp);
@@ -6334,10 +6416,10 @@ async function convertToFileUIPart(e18) {
     url: await blobToString(e19, "dataUrl")
   })));
 }
-var import_compiler_runtime$4 = require_compiler_runtime();
+var import_compiler_runtime$9 = require_compiler_runtime();
 const AttachmentRenderer = (e18) => {
   var _a;
-  let h = (0, import_compiler_runtime$4.c)(6), { attachment: g } = e18;
+  let h = (0, import_compiler_runtime$9.c)(6), { attachment: g } = e18;
   if ((_a = g.mediaType) == null ? void 0 : _a.startsWith("image/")) {
     let e19 = g.filename || "Attachment", _2;
     return h[0] !== g.url || h[1] !== e19 ? (_2 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
@@ -6353,28 +6435,66 @@ const AttachmentRenderer = (e18) => {
     className: "flex flex-row gap-1 items-center text-xs",
     children: [_, v]
   }), h[4] = v, h[5] = y), y;
+}, SourceChip = (e18) => {
+  let h = (0, import_compiler_runtime$9.c)(15), { icon: g, title: _, subtitle: v, href: y } = e18, b;
+  h[0] === _ ? b = h[1] : (b = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+    className: "truncate font-medium",
+    children: _
+  }), h[0] = _, h[1] = b);
+  let x;
+  h[2] === v ? x = h[3] : (x = v && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+    className: "truncate opacity-70",
+    children: [
+      "(",
+      v,
+      ")"
+    ]
+  }), h[2] = v, h[3] = x);
+  let S;
+  h[4] !== g || h[5] !== b || h[6] !== x ? (S = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    g,
+    b,
+    x
+  ] }), h[4] = g, h[5] = b, h[6] = x, h[7] = S) : S = h[7];
+  let C = S;
+  if (y && isUrl(y)) {
+    let e19 = v ?? _, g2;
+    return h[8] !== C || h[9] !== y || h[10] !== e19 ? (g2 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
+      href: y,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      title: e19,
+      className: "inline-flex max-w-full items-center gap-1.5 rounded-md border bg-muted/50 px-2 py-1 my-1 text-xs text-muted-foreground hover:bg-muted hover:text-foreground transition-colors",
+      children: C
+    }), h[8] = C, h[9] = y, h[10] = e19, h[11] = g2) : g2 = h[11], g2;
+  }
+  let w = v ?? _, T;
+  return h[12] !== C || h[13] !== w ? (T = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+    className: "inline-flex max-w-full items-center gap-1.5 rounded-md border bg-muted/50 px-2 py-1 my-1 text-xs text-muted-foreground",
+    title: w,
+    children: C
+  }), h[12] = C, h[13] = w, h[14] = T) : T = h[14], T;
 };
-var import_compiler_runtime$3 = require_compiler_runtime();
+var import_compiler_runtime$8 = require_compiler_runtime();
 const ReasoningAccordion = (e18) => {
-  let h = (0, import_compiler_runtime$3.c)(13), { reasoning: g, index: _, isStreaming: v } = e18, y = _ === void 0 ? 0 : _, b = v === void 0 ? false : v, x = b ? "reasoning" : void 0, S;
-  h[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (S = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BotMessageSquare, { className: "h-3 w-3" }), h[0] = S) : S = h[0];
-  let C = b ? "Thinking" : "View reasoning", T;
-  h[1] !== g.length || h[2] !== C ? (T = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionTrigger, {
+  let h = (0, import_compiler_runtime$8.c)(13), { reasoning: g, index: _, isStreaming: v } = e18, y = _ === void 0 ? 0 : _, b = v === void 0 ? false : v, [x, S] = import_react.useState("");
+  if (!g && !b) return null;
+  let C = b ? "reasoning" : x, T;
+  h[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (T = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BotMessageSquare, { className: "h-3 w-3" }), h[0] = T) : T = h[0];
+  let E = b ? "Thinking" : "View reasoning", D = g.length > 0 && ` (${g.length} chars)`, O;
+  h[1] !== E || h[2] !== D ? (O = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionTrigger, {
     className: "text-xs text-muted-foreground hover:bg-muted/50 px-2 py-1 h-auto rounded-sm [&[data-state=open]>svg]:rotate-180",
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
       className: "flex items-center gap-2",
       children: [
-        S,
-        C,
-        " (",
-        g.length,
-        " ",
-        "chars)"
+        T,
+        E,
+        D
       ]
     })
-  }), h[1] = g.length, h[2] = C, h[3] = T) : T = h[3];
-  let E;
-  h[4] === g ? E = h[5] : (E = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionContent, {
+  }), h[1] = E, h[2] = D, h[3] = O) : O = h[3];
+  let k;
+  h[4] === g ? k = h[5] : (k = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionContent, {
     className: "pb-2 px-2",
     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
       className: "bg-muted/30 border border-muted/50 rounded-md p-3 italic text-muted-foreground/90 relative",
@@ -6383,31 +6503,194 @@ const ReasoningAccordion = (e18) => {
         children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MarkdownRenderer, { content: g })
       })
     })
-  }), h[4] = g, h[5] = E);
-  let D;
-  h[6] !== T || h[7] !== E ? (D = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AccordionItem, {
+  }), h[4] = g, h[5] = k);
+  let A;
+  h[6] !== O || h[7] !== k ? (A = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AccordionItem, {
     value: "reasoning",
     className: "border-0",
-    children: [T, E]
-  }), h[6] = T, h[7] = E, h[8] = D) : D = h[8];
-  let O;
-  return h[9] !== y || h[10] !== x || h[11] !== D ? (O = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Accordion, {
+    children: [O, k]
+  }), h[6] = O, h[7] = k, h[8] = A) : A = h[8];
+  let j;
+  return h[9] !== y || h[10] !== C || h[11] !== A ? (j = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Accordion, {
     type: "single",
     collapsible: true,
     className: "w-full mb-2",
-    value: x,
-    children: D
-  }, y), h[9] = y, h[10] = x, h[11] = D, h[12] = O) : O = h[12], O;
+    value: C,
+    onValueChange: S,
+    children: A
+  }, y), h[9] = y, h[10] = C, h[11] = A, h[12] = j) : j = h[12], j;
+};
+function formatToolName(e18) {
+  return e18.replace("tool-", "");
+}
+var import_compiler_runtime$7 = require_compiler_runtime();
+const ToolArgsRenderer = (e18) => {
+  let h = (0, import_compiler_runtime$7.c)(9), { input: g, label: _ } = e18, v = _ === void 0 ? "Tool Request" : _;
+  if (g == null) return null;
+  let y;
+  h[0] === v ? y = h[1] : (y = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
+    className: "text-xs font-semibold text-muted-foreground",
+    children: v
+  }), h[0] = v, h[1] = y);
+  let b;
+  h[2] === g ? b = h[3] : (b = JSON.stringify(g, null, 2), h[2] = g, h[3] = b);
+  let x;
+  h[4] === b ? x = h[5] : (x = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", {
+    className: "bg-(--slate-2) p-2 text-muted-foreground border border-(--slate-4) rounded text-xs overflow-auto scrollbar-thin max-h-64",
+    children: b
+  }), h[4] = b, h[5] = x);
+  let S;
+  return h[6] !== y || h[7] !== x ? (S = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    className: "space-y-2",
+    children: [y, x]
+  }), h[6] = y, h[7] = x, h[8] = S) : S = h[8], S;
+};
+var import_compiler_runtime$6 = require_compiler_runtime();
+const ToolApprovalCard = (e18) => {
+  let h = (0, import_compiler_runtime$6.c)(25), { toolName: g, input: _, approval: y, onApprove: x, className: S } = e18, C;
+  h[0] === S ? C = h[1] : (C = cn("rounded-md border border-(--amber-6) bg-(--amber-2) p-3 space-y-3", S), h[0] = S, h[1] = C);
+  let w = `Approval required for ${formatToolName(g)}`, T;
+  h[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (T = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ShieldQuestionMark, { className: "h-4 w-4 text-(--amber-11) mt-0.5 shrink-0" }), h[2] = T) : T = h[2];
+  let E;
+  h[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (E = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+    className: "font-semibold",
+    children: "Approval required:"
+  }), h[3] = E) : E = h[3];
+  let D;
+  h[4] === g ? D = h[5] : (D = formatToolName(g), h[4] = g, h[5] = D);
+  let O;
+  h[6] === D ? O = h[7] : (O = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    className: "flex items-start gap-2",
+    children: [T, /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+      className: "text-xs text-(--amber-11) leading-relaxed",
+      children: [
+        E,
+        " ",
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
+          className: "font-mono",
+          children: D
+        })
+      ]
+    })]
+  }), h[6] = D, h[7] = O);
+  let k;
+  h[8] === _ ? k = h[9] : (k = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolArgsRenderer, { input: _ }), h[8] = _, h[9] = k);
+  let A;
+  h[10] !== y.id || h[11] !== x ? (A = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
+    size: "xs",
+    variant: "outline",
+    onClick: () => x({
+      id: y.id,
+      approved: false
+    }),
+    children: "Deny"
+  }), h[10] = y.id, h[11] = x, h[12] = A) : A = h[12];
+  let j;
+  h[13] !== y.id || h[14] !== x ? (j = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
+    size: "xs",
+    onClick: () => x({
+      id: y.id,
+      approved: true
+    }),
+    children: "Approve"
+  }), h[13] = y.id, h[14] = x, h[15] = j) : j = h[15];
+  let M;
+  h[16] !== A || h[17] !== j ? (M = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    className: "flex items-center justify-end gap-2",
+    children: [A, j]
+  }), h[16] = A, h[17] = j, h[18] = M) : M = h[18];
+  let N;
+  return h[19] !== C || h[20] !== M || h[21] !== w || h[22] !== O || h[23] !== k ? (N = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    className: C,
+    role: "alertdialog",
+    "aria-label": w,
+    children: [
+      O,
+      k,
+      M
+    ]
+  }), h[19] = C, h[20] = M, h[21] = w, h[22] = O, h[23] = k, h[24] = N) : N = h[24], N;
 };
-var import_compiler_runtime$2 = require_compiler_runtime(), SuccessResultSchema = object$1({
+var import_compiler_runtime$5 = require_compiler_runtime();
+const ToolErrorCard = (e18) => {
+  let h = (0, import_compiler_runtime$5.c)(28), { toolName: g, input: _, errorText: y, isLive: b, className: x } = e18, [S, C] = import_react.useState(b), w = import_react.useRef(b), T, E;
+  h[0] === b ? (T = h[1], E = h[2]) : (T = () => {
+    w.current && !b && C(false), w.current = b;
+  }, E = [b], h[0] = b, h[1] = T, h[2] = E), import_react.useEffect(T, E);
+  let D;
+  h[3] === x ? D = h[4] : (D = cn("rounded-md border border-(--red-6) bg-(--red-2)", x), h[3] = x, h[4] = D);
+  let O;
+  h[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (O = () => C(_temp$2), h[5] = O) : O = h[5];
+  let k;
+  h[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (k = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CircleX, { className: "h-3.5 w-3.5 shrink-0" }), h[6] = k) : k = h[6];
+  let A;
+  h[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (A = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+    className: "font-semibold",
+    children: "Failed:"
+  }), h[7] = A) : A = h[7];
+  let j;
+  h[8] === g ? j = h[9] : (j = formatToolName(g), h[8] = g, h[9] = j);
+  let M;
+  h[10] === j ? M = h[11] : (M = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+    className: "flex-1 text-left",
+    children: [
+      A,
+      " ",
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
+        className: "font-mono",
+        children: j
+      })
+    ]
+  }), h[10] = j, h[11] = M);
+  let N = S && "rotate-180", P;
+  h[12] === N ? P = h[13] : (P = cn("h-3.5 w-3.5 shrink-0 transition-transform", N), h[12] = N, h[13] = P);
+  let F;
+  h[14] === P ? F = h[15] : (F = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronDown, { className: P }), h[14] = P, h[15] = F);
+  let I;
+  h[16] !== S || h[17] !== F || h[18] !== M ? (I = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
+    type: "button",
+    onClick: O,
+    className: "w-full flex items-center gap-2 px-3 py-2 text-xs text-(--red-11) hover:bg-(--red-3) rounded-md transition-colors",
+    "aria-expanded": S,
+    children: [
+      k,
+      M,
+      F
+    ]
+  }), h[16] = S, h[17] = F, h[18] = M, h[19] = I) : I = h[19];
+  let L;
+  h[20] !== y || h[21] !== _ || h[22] !== S ? (L = S && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    className: "px-3 pb-3 space-y-3 border-t border-(--red-6)/40 pt-3",
+    children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolArgsRenderer, { input: _ }), y && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
+      className: "text-xs font-semibold text-(--red-11) mb-1",
+      children: "Error"
+    }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", {
+      className: "bg-(--red-2) border border-(--red-6) rounded p-2 text-xs text-(--red-11) leading-relaxed overflow-auto scrollbar-thin max-h-64 whitespace-pre-wrap",
+      children: y
+    })] })]
+  }), h[20] = y, h[21] = _, h[22] = S, h[23] = L) : L = h[23];
+  let R;
+  return h[24] !== I || h[25] !== L || h[26] !== D ? (R = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    className: D,
+    children: [I, L]
+  }), h[24] = I, h[25] = L, h[26] = D, h[27] = R) : R = h[27], R;
+};
+function _temp$2(e18) {
+  return !e18;
+}
+var import_compiler_runtime$4 = require_compiler_runtime();
+function isUninformative(e18) {
+  return e18 == null ? true : typeof e18 == "object" ? isEmpty_default(e18) : false;
+}
+var SuccessResultSchema = looseObject({
   status: string().default("success"),
   auth_required: boolean().default(false),
   action_url: any(),
   next_steps: any(),
   meta: any(),
   message: string().nullish()
-}).passthrough(), PrettySuccessResult = (e18) => {
-  let h = (0, import_compiler_runtime$2.c)(12), { data: g } = e18, _;
+}), PrettySuccessResult = (e18) => {
+  let h = (0, import_compiler_runtime$4.c)(12), { data: g } = e18, _;
   if (h[0] !== g) {
     let { status: e19, auth_required: v, action_url: y, meta: b, next_steps: x, message: S, ...C } = g, w;
     h[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (w = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
@@ -6416,12 +6699,12 @@ var import_compiler_runtime$2 = require_compiler_runtime(), SuccessResultSchema
     }), h[2] = w) : w = h[2];
     let T;
     h[3] === e19 ? T = h[4] : (T = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
-      className: "text-xs px-2 py-0.5 bg-[var(--grass-2)] text-[var(--grass-11)] rounded-full font-medium capitalize",
+      className: "text-xs px-2 py-0.5 bg-(--grass-2) text-(--grass-11) rounded-full font-medium capitalize",
       children: e19
     }), h[3] = e19, h[4] = T);
     let E;
     h[5] === v ? E = h[6] : (E = v && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
-      className: "text-xs px-2 py-0.5 bg-[var(--amber-2)] text-[var(--amber-11)] rounded-full",
+      className: "text-xs px-2 py-0.5 bg-(--amber-2) text-(--amber-11) rounded-full",
       children: "Auth Required"
     }), h[5] = v, h[6] = E);
     let D;
@@ -6435,7 +6718,7 @@ var import_compiler_runtime$2 = require_compiler_runtime(), SuccessResultSchema
     let O;
     h[10] === S ? O = h[11] : (O = S && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
       className: "flex items-start gap-2",
-      children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Info, { className: "h-3 w-3 text-[var(--blue-11)] mt-0.5 flex-shrink-0" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+      children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Info, { className: "h-3 w-3 text-(--blue-11) mt-0.5 shrink-0" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
         className: "text-xs text-foreground",
         children: S
       })]
@@ -6452,8 +6735,9 @@ var import_compiler_runtime$2 = require_compiler_runtime(), SuccessResultSchema
     }), h[0] = g, h[1] = _;
   } else _ = h[1];
   return _;
-}, ResultRenderer = (e18) => {
-  let h = (0, import_compiler_runtime$2.c)(8), { result: g } = e18, _;
+};
+const ResultRenderer = (e18) => {
+  let h = (0, import_compiler_runtime$4.c)(8), { result: g } = e18, _;
   h[0] === g ? _ = h[1] : (_ = SuccessResultSchema.safeParse(g), h[0] = g, h[1] = _);
   let v = _;
   if (v.success) {
@@ -6467,160 +6751,262 @@ var import_compiler_runtime$2 = require_compiler_runtime(), SuccessResultSchema
     className: "text-xs font-medium text-muted-foreground mb-1 max-h-64 overflow-y-auto scrollbar-thin",
     children: y
   }), h[6] = y, h[7] = b), b;
-}, ToolArgsRenderer = (e18) => {
-  let h = (0, import_compiler_runtime$2.c)(9), { input: g } = e18;
-  if (!(g && g !== null)) return null;
-  let _;
-  h[0] === g ? _ = h[1] : (_ = isEmpty_default(g), h[0] = g, h[1] = _);
-  let v = _, y = typeof g == "object" && !Array.isArray(g) && Object.keys(g).length > 0, b;
-  h[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (b = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
-    className: "text-xs font-semibold text-muted-foreground",
-    children: "Tool Request"
-  }), h[2] = b) : b = h[2];
-  let x;
-  h[3] !== g || h[4] !== v || h[5] !== y ? (x = v ? "{}" : y ? JSON.stringify(g, null, 2) : String(g), h[3] = g, h[4] = v, h[5] = y, h[6] = x) : x = h[6];
-  let S;
-  return h[7] === x ? S = h[8] : (S = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
-    className: "space-y-2",
-    children: [b, /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", {
-      className: "bg-[var(--slate-2)] p-2 text-muted-foreground border border-[var(--slate-4)] rounded text-xs overflow-auto scrollbar-thin max-h-64",
-      children: x
-    })]
-  }), h[7] = x, h[8] = S), S;
 };
-const ToolCallAccordion = (e18) => {
-  let h = (0, import_compiler_runtime$2.c)(38), { toolName: g, result: _, error: y, index: b, state: x, className: S, input: C } = e18, T = b === void 0 ? 0 : b, E = x === "output-available" && (_ || y), D = y ? "error" : E ? "success" : "loading", O;
-  h[0] === D ? O = h[1] : (O = () => {
-    switch (D) {
-      case "loading":
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoaderCircle, { className: "h-3 w-3 animate-spin" });
-      case "error":
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CircleX, { className: "h-3 w-3 text-[var(--red-11)]" });
-      case "success":
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CircleCheckBig, { className: "h-3 w-3 text-[var(--grass-11)]" });
-      default:
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Wrench, { className: "h-3 w-3" });
+function _temp$1(e18) {
+  let [h, g] = e18;
+  return isUninformative(g) ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    className: "space-y-1.5",
+    children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+      className: "text-xs text-muted-foreground",
+      children: h
+    }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", {
+      className: "bg-(--slate-2) p-2 text-muted-foreground border border-(--slate-4) rounded text-xs overflow-auto scrollbar-thin max-h-64",
+      children: JSON.stringify(g, null, 2)
+    })]
+  }, h);
+}
+var import_compiler_runtime$3 = require_compiler_runtime(), STATUS_LABEL = {
+  "input-streaming": "Generating",
+  "input-available": "Running",
+  "approval-responded": "Awaiting result",
+  "output-available": "Done",
+  "output-denied": "Denied"
+}, StatusIcon = (e18) => {
+  let h = (0, import_compiler_runtime$3.c)(4), { state: g } = e18;
+  switch (g) {
+    case "input-streaming":
+    case "input-available":
+    case "approval-responded": {
+      let e19;
+      return h[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoaderCircle, { className: "h-3 w-3 animate-spin" }), h[0] = e19) : e19 = h[0], e19;
     }
-  }, h[0] = D, h[1] = O);
-  let k = O, A;
-  h[2] !== y || h[3] !== E || h[4] !== D ? (A = () => D === "loading" ? "Running" : y ? "Failed" : E ? "Done" : "Tool call", h[2] = y, h[3] = E, h[4] = D, h[5] = A) : A = h[5];
-  let j = A, M = `tool-${T}`, N;
-  h[6] === S ? N = h[7] : (N = cn("w-full", S), h[6] = S, h[7] = N);
-  let P = D === "error" && "text-[var(--red-11)]/80", F = D === "success" && "text-[var(--grass-11)]/80", B;
-  h[8] !== P || h[9] !== F ? (B = cn("h-6 text-xs border-border shadow-none! ring-0! bg-muted/60 hover:bg-muted py-0 px-2 gap-1 rounded-sm [&[data-state=open]>svg]:rotate-180 hover:no-underline", P, F), h[8] = P, h[9] = F, h[10] = B) : B = h[10];
-  let V;
-  h[11] === k ? V = h[12] : (V = k(), h[11] = k, h[12] = V);
-  let H = j(), U;
-  h[13] === g ? U = h[14] : (U = formatToolName(g), h[13] = g, h[14] = U);
-  let W;
-  h[15] === U ? W = h[16] : (W = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
+    case "output-available": {
+      let e19;
+      return h[1] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CircleCheckBig, { className: "h-3 w-3 text-(--grass-11)" }), h[1] = e19) : e19 = h[1], e19;
+    }
+    case "output-denied": {
+      let e19;
+      return h[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Ban, { className: "h-3 w-3 text-muted-foreground" }), h[2] = e19) : e19 = h[2], e19;
+    }
+    default: {
+      logNever(g);
+      let e19;
+      return h[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Wrench, { className: "h-3 w-3" }), h[3] = e19) : e19 = h[3], e19;
+    }
+  }
+};
+function getTriggerToneClass(e18) {
+  switch (e18) {
+    case "output-available":
+      return "text-(--grass-11)/80";
+    case "output-denied":
+      return "text-muted-foreground";
+    case "input-streaming":
+    case "input-available":
+    case "approval-responded":
+      return "";
+    default:
+      return logNever(e18), "";
+  }
+}
+const ToolHistoryRow = (e18) => {
+  let h = (0, import_compiler_runtime$3.c)(29), { toolName: g, state: _, input: y, result: b, approval: x, index: S, className: C } = e18, T = `tool-${S === void 0 ? 0 : S}`, E;
+  h[0] === C ? E = h[1] : (E = cn("w-full", C), h[0] = C, h[1] = E);
+  let D;
+  h[2] === _ ? D = h[3] : (D = cn("h-6 text-xs border-border shadow-none! ring-0! bg-muted/60 hover:bg-muted py-0 px-2 gap-1 rounded-sm [&[data-state=open]>svg]:rotate-180 hover:no-underline", getTriggerToneClass(_)), h[2] = _, h[3] = D);
+  let O;
+  h[4] === _ ? O = h[5] : (O = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatusIcon, { state: _ }), h[4] = _, h[5] = O);
+  let k = STATUS_LABEL[_], A;
+  h[6] === g ? A = h[7] : (A = formatToolName(g), h[6] = g, h[7] = A);
+  let j;
+  h[8] === A ? j = h[9] : (j = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
     className: "font-mono text-xs",
-    children: U
-  }), h[15] = U, h[16] = W);
-  let G;
-  h[17] !== H || h[18] !== W || h[19] !== V ? (G = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+    children: A
+  }), h[8] = A, h[9] = j);
+  let M;
+  h[10] !== O || h[11] !== k || h[12] !== j ? (M = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
     className: "flex items-center gap-1",
     children: [
-      V,
-      H,
+      O,
+      k,
       ":",
-      W
-    ]
-  }), h[17] = H, h[18] = W, h[19] = V, h[20] = G) : G = h[20];
-  let K;
-  h[21] !== G || h[22] !== B ? (K = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionTrigger, {
-    className: B,
-    children: G
-  }), h[21] = G, h[22] = B, h[23] = K) : K = h[23];
-  let q;
-  h[24] !== y || h[25] !== E || h[26] !== C || h[27] !== _ ? (q = E && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
-    className: "space-y-3",
-    children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolArgsRenderer, { input: C }),
-      _ != null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ResultRenderer, { result: _ }),
-      y && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
-        className: "bg-[var(--red-2)] border border-[var(--red-6)] rounded-lg p-3",
-        children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
-          className: "text-xs font-semibold text-[var(--red-11)] mb-2 flex items-center gap-2",
-          children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "w-1.5 h-1.5 bg-[var(--red-9)] rounded-full" }), "Error"]
-        }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
-          className: "text-sm text-[var(--red-11)] leading-relaxed",
-          children: y
-        })]
-      })
+      j
     ]
-  }), h[24] = y, h[25] = E, h[26] = C, h[27] = _, h[28] = q) : q = h[28];
-  let J;
-  h[29] === q ? J = h[30] : (J = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionContent, {
+  }), h[10] = O, h[11] = k, h[12] = j, h[13] = M) : M = h[13];
+  let N;
+  h[14] !== D || h[15] !== M ? (N = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionTrigger, {
+    className: D,
+    children: M
+  }), h[14] = D, h[15] = M, h[16] = N) : N = h[16];
+  let P;
+  h[17] !== x || h[18] !== y || h[19] !== b || h[20] !== _ ? (P = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionContent, {
     className: "py-2 px-2",
-    children: q
-  }), h[29] = q, h[30] = J);
-  let Y;
-  h[31] !== K || h[32] !== J ? (Y = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AccordionItem, {
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HistoryContent, {
+      state: _,
+      input: y,
+      result: b,
+      approval: x
+    })
+  }), h[17] = x, h[18] = y, h[19] = b, h[20] = _, h[21] = P) : P = h[21];
+  let F;
+  h[22] !== N || h[23] !== P ? (F = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AccordionItem, {
     value: "tool-call",
     className: "border-0",
-    children: [K, J]
-  }), h[31] = K, h[32] = J, h[33] = Y) : Y = h[33];
-  let Z;
-  return h[34] !== Y || h[35] !== M || h[36] !== N ? (Z = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Accordion, {
+    children: [N, P]
+  }), h[22] = N, h[23] = P, h[24] = F) : F = h[24];
+  let I;
+  return h[25] !== F || h[26] !== T || h[27] !== E ? (I = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Accordion, {
     type: "single",
     collapsible: true,
-    className: N,
-    children: Y
-  }, M), h[34] = Y, h[35] = M, h[36] = N, h[37] = Z) : Z = h[37], Z;
+    className: E,
+    children: F
+  }, T), h[25] = F, h[26] = T, h[27] = E, h[28] = I) : I = h[28], I;
 };
-function formatToolName(e18) {
-  return e18.replace("tool-", "");
-}
-function _temp$1(e18) {
-  let [h, g] = e18;
-  return isEmpty_default(g) ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
-    className: "space-y-1.5",
-    children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
-      className: "text-xs font-medium text-muted-foreground capitalize flex items-center gap-2",
-      children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "w-1.5 h-1.5 bg-[var(--blue-9)] rounded-full" }), h]
-    }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", {
-      className: "bg-[var(--slate-2)] p-2 text-muted-foreground border border-[var(--slate-4)] rounded text-xs overflow-auto scrollbar-thin max-h-64",
-      children: JSON.stringify(g, null, 2)
-    })]
-  }, h);
-}
-const renderUIMessage = ({ message: e18, isStreamingReasoning: h, isLast: _ }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: e18.parts.map((e19, h2) => v(e19, h2)) });
-  function v(v2, y) {
-    if (isToolPart(v2)) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolCallAccordion, {
-      index: y,
-      toolName: v2.type,
-      result: v2.output,
+var HistoryContent = (e18) => {
+  let h = (0, import_compiler_runtime$3.c)(16), { state: g, input: _, result: v, approval: y } = e18;
+  switch (g) {
+    case "input-streaming":
+    case "input-available":
+    case "approval-responded": {
+      let e19;
+      return h[0] === _ ? e19 = h[1] : (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolArgsRenderer, { input: _ }), h[0] = _, h[1] = e19), e19;
+    }
+    case "output-available": {
+      let e19;
+      h[2] === _ ? e19 = h[3] : (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolArgsRenderer, { input: _ }), h[2] = _, h[3] = e19);
+      let g2;
+      h[4] === v ? g2 = h[5] : (g2 = v != null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ResultRenderer, { result: v }), h[4] = v, h[5] = g2);
+      let y2;
+      return h[6] !== e19 || h[7] !== g2 ? (y2 = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+        className: "space-y-3",
+        children: [e19, g2]
+      }), h[6] = e19, h[7] = g2, h[8] = y2) : y2 = h[8], y2;
+    }
+    case "output-denied": {
+      let e19;
+      h[9] === _ ? e19 = h[10] : (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolArgsRenderer, { input: _ }), h[9] = _, h[10] = e19);
+      let g2 = (y == null ? void 0 : y.reason) ? `: ${y.reason}` : ".", v2;
+      h[11] === g2 ? v2 = h[12] : (v2 = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+        className: "bg-muted/40 border border-border rounded-md p-3 text-xs text-muted-foreground leading-relaxed",
+        children: ["Tool execution was denied", g2]
+      }), h[11] = g2, h[12] = v2);
+      let b;
+      return h[13] !== e19 || h[14] !== v2 ? (b = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+        className: "space-y-3",
+        children: [e19, v2]
+      }), h[13] = e19, h[14] = v2, h[15] = b) : b = h[15], b;
+    }
+    default:
+      return logNever(g), null;
+  }
+}, import_compiler_runtime$2 = require_compiler_runtime();
+const ToolCallView = (e18) => {
+  let h = (0, import_compiler_runtime$2.c)(25), { toolName: g, state: _, result: v, errorText: y, input: b, approval: x, onApprove: S, index: C, className: w, isLive: T } = e18, E = T === void 0 ? true : T;
+  switch (_) {
+    case "approval-requested": {
+      if (x != null && S != null) {
+        let e20;
+        return h[0] !== x || h[1] !== w || h[2] !== b || h[3] !== S || h[4] !== g ? (e20 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolApprovalCard, {
+          toolName: g,
+          input: b,
+          approval: x,
+          onApprove: S,
+          className: w
+        }), h[0] = x, h[1] = w, h[2] = b, h[3] = S, h[4] = g, h[5] = e20) : e20 = h[5], e20;
+      }
+      let e19;
+      return h[6] !== w || h[7] !== C || h[8] !== b || h[9] !== g ? (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolHistoryRow, {
+        toolName: g,
+        state: "input-available",
+        input: b,
+        index: C,
+        className: w
+      }), h[6] = w, h[7] = C, h[8] = b, h[9] = g, h[10] = e19) : e19 = h[10], e19;
+    }
+    case "output-error": {
+      let e19;
+      return h[11] !== w || h[12] !== y || h[13] !== b || h[14] !== E || h[15] !== g ? (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolErrorCard, {
+        toolName: g,
+        input: b,
+        errorText: y,
+        isLive: E,
+        className: w
+      }), h[11] = w, h[12] = y, h[13] = b, h[14] = E, h[15] = g, h[16] = e19) : e19 = h[16], e19;
+    }
+    case "input-streaming":
+    case "input-available":
+    case "approval-responded":
+    case "output-available":
+    case "output-denied": {
+      let e19;
+      return h[17] !== x || h[18] !== w || h[19] !== C || h[20] !== b || h[21] !== v || h[22] !== _ || h[23] !== g ? (e19 = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolHistoryRow, {
+        toolName: g,
+        state: _,
+        input: b,
+        result: v,
+        approval: x,
+        index: C,
+        className: w
+      }), h[17] = x, h[18] = w, h[19] = C, h[20] = b, h[21] = v, h[22] = _, h[23] = g, h[24] = e19) : e19 = h[24], e19;
+    }
+    default:
+      return logNever(_), null;
+  }
+}, renderUIMessage = ({ message: e18, isStreamingReasoning: h, isLast: _, addToolApprovalResponse: v }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: e18.parts.map((e19, h2) => y(e19, h2)) });
+  function y(y2, b) {
+    if (isToolPart(y2)) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolCallView, {
+      index: b,
+      toolName: y2.type,
+      result: y2.output,
+      errorText: y2.state === "output-error" ? y2.errorText : void 0,
       className: "my-2",
-      state: v2.state,
-      input: v2.input
-    }, y);
-    if (isDataPart(v2)) return Logger.debug("Found data part", v2), null;
-    switch (v2.type) {
+      state: y2.state,
+      input: y2.input,
+      approval: y2.approval,
+      onApprove: v,
+      isLive: _
+    }, b);
+    if (isDataPart(y2)) return Logger.debug("Found data part", y2), null;
+    switch (y2.type) {
       case "text":
-        return v2.text.includes("<marimo-") ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children: renderHTML({ html: v2.text }) }, y) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MarkdownRenderer, { content: v2.text }, y);
+        return y2.text.includes("<marimo-") ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Fragment, { children: renderHTML({ html: y2.text }) }, b) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MarkdownRenderer, { content: y2.text }, b);
       case "reasoning":
         return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReasoningAccordion, {
-          reasoning: v2.text,
-          index: y,
-          isStreaming: h && _ && y === (e18.parts.length || 0) - 1
-        }, y);
+          reasoning: y2.text,
+          index: b,
+          isStreaming: h && _ && b === (e18.parts.length || 0) - 1
+        }, b);
       case "file":
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AttachmentRenderer, { attachment: v2 }, y);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AttachmentRenderer, { attachment: y2 }, b);
       case "dynamic-tool":
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolCallAccordion, {
-          toolName: v2.toolName,
-          result: v2.output,
-          state: v2.state,
-          input: v2.input
-        }, y);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToolCallView, {
+          toolName: y2.toolName,
+          result: y2.output,
+          errorText: y2.state === "output-error" ? y2.errorText : void 0,
+          state: y2.state,
+          input: y2.input,
+          approval: y2.approval,
+          onApprove: v,
+          isLive: _
+        }, b);
       case "source-document":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SourceChip, {
+          icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FileText, { className: "h-3 w-3 shrink-0" }),
+          title: y2.title,
+          subtitle: y2.filename
+        }, b);
       case "source-url":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SourceChip, {
+          icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ExternalLink, { className: "h-3 w-3 shrink-0" }),
+          title: y2.title ?? y2.url,
+          subtitle: y2.title ? y2.url : void 0,
+          href: y2.url
+        }, b);
       case "step-start":
-        return Logger.debug("Found non-renderable part", v2), null;
+        return null;
       default:
-        return logNever(v2), null;
+        return logNever(y2), null;
     }
   }
 };
@@ -7171,7 +7557,7 @@ const Chatbot = (e18) => {
   let N = (0, import_react.useRef)({
     backendMessageId: null,
     frontendMessageIndex: null
-  }), F = (0, import_react.useRef)(null), { data: I } = useAsyncData(async () => (await e18.get_chat_history({})).messages, []), L = e18.value.length > 0 ? e18.value : I, { messages: R, sendMessage: z, setMessages: B, status: V, stop: H, error: U, regenerate: W, clearError: G } = useChat({
+  }), P = (0, import_react.useRef)(null), { data: I } = useAsyncData(async () => (await e18.get_chat_history({})).messages, []), L = e18.value.length > 0 ? e18.value : I, { messages: R, sendMessage: z, setMessages: B, status: V, stop: H, error: U, regenerate: W, clearError: G } = useChat({
     transport: new DefaultChatTransport({ fetch: async (h2, _2) => {
       var _a2;
       if (_2 === void 0) return fetch(h2);
@@ -7192,21 +7578,21 @@ const Chatbot = (e18) => {
           };
         }), _3 = new ReadableStream({
           start(e19) {
-            F.current = e19;
+            P.current = e19;
             let h4 = () => {
               try {
                 e19.close();
               } catch (e20) {
                 Logger.debug("Controller may already be closed", { error: e20 });
               }
-              F.current = null;
+              P.current = null;
             };
             return y == null ? void 0 : y.addEventListener("abort", h4), () => {
               y == null ? void 0 : y.removeEventListener("abort", h4);
             };
           },
           cancel() {
-            F.current = null;
+            P.current = null;
           }
         });
         return e18.send_prompt({
@@ -7214,7 +7600,7 @@ const Chatbot = (e18) => {
           config: b
         }).catch((e19) => {
           var _a3;
-          (_a3 = F.current) == null ? void 0 : _a3.error(e19), F.current = null;
+          (_a3 = P.current) == null ? void 0 : _a3.error(e19), P.current = null;
         }), createUIMessageStreamResponse({ stream: _3 });
       } catch (e19) {
         if (N.current = {
@@ -7242,8 +7628,8 @@ const Chatbot = (e18) => {
   useEventListener(e18.host, MarimoIncomingMessageEvent.TYPE, (e19) => {
     let h2 = ChatMessageIncomingSchema.safeParse(e19.detail.message);
     if (!h2.success) return;
-    let g = h2.data, _2 = F.current;
-    _2 && (g.content && _2.enqueue(g.content), g.is_final && (_2.close(), F.current = null));
+    let g = h2.data, _2 = P.current;
+    _2 && (g.content && _2.enqueue(g.content), g.is_final && (_2.close(), P.current = null));
   });
   let K = V === "submitted" || V === "streaming", q = (h2) => {
     let g = R.findIndex((e19) => e19.id === h2);