@mast-ai/react-ui 0.1.0

package/dist/index.js

@@ -0,0 +1,1012 @@
+import { useState as R, useRef as C, useEffect as Q, useCallback as _, createContext as nt, useMemo as J, useContext as st, lazy as pt, Fragment as rt, Suspense as ft, useId as gt } from "react";
+import { jsx as e, jsxs as k } from "react/jsx-runtime";
+import { AgentRunner as vt } from "@mast-ai/core";
+import { useVirtualizer as bt } from "@tanstack/react-virtual";
+function tt(t, n, r) {
+  return { id: crypto.randomUUID(), role: t, text: n, toolEvents: [], isStreaming: r };
+}
+function F(t, n, r) {
+  return t.map((s) => s.id === n ? r(s) : s);
+}
+function W(t, n, r, s) {
+  return F(t, n, (a) => {
+    let i = !1;
+    const l = a.toolEvents.map((o) => !i && o.name === r && o.isStreaming ? (i = !0, s(o)) : o);
+    return { ...a, toolEvents: l };
+  });
+}
+function kt(t, n, r, s, a) {
+  return W(t, n, r, (i) => {
+    let l = !1;
+    const o = (i.nestedToolEvents ?? []).map((u) => !l && u.name === s && u.isStreaming ? (l = !0, a(u)) : u);
+    return { ...i, nestedToolEvents: o };
+  });
+}
+function xt(t, n) {
+  const [r, s] = R(() => (n == null ? void 0 : n.initialEntries) ?? []), [a, i] = R(() => [...t.history]), [l, o] = R(!1), [u, m] = R(0), y = C(null), v = C(n == null ? void 0 : n.onTurnComplete);
+  v.current = n == null ? void 0 : n.onTurnComplete, Q(() => {
+    var g;
+    u !== 0 && ((g = v.current) == null || g.call(v, r, a));
+  }, [u]);
+  const T = (g) => {
+    for (let A = g.length - 1; A >= 0; A--) {
+      const N = g[A];
+      if (N.role === "assistant" && N.isStreaming) return N.id;
+    }
+  }, M = _((g, A) => {
+    s((N) => {
+      const E = T(N);
+      return E === void 0 ? N : W(N, E, g, (I) => ({
+        ...I,
+        awaitingApproval: A
+      }));
+    });
+  }, []), P = _((g, A) => {
+    s((N) => {
+      const E = T(N);
+      return E === void 0 ? N : W(N, E, g, (I) => ({ ...I, status: A }));
+    });
+  }, []), S = _(
+    (g, A) => {
+      if (l) return;
+      const N = tt("user", A ?? g, !1), E = tt("assistant", "", !0), I = E.id;
+      s((b) => [...b, N, E]), o(!0);
+      const h = new AbortController();
+      y.current = h, (async () => {
+        try {
+          const b = t.runStream(
+            g,
+            h.signal,
+            (d, f) => {
+              if (f.type === "thinking")
+                s(
+                  (c) => W(c, I, d, (x) => ({
+                    ...x,
+                    subThinking: (x.subThinking ?? "") + f.delta
+                  }))
+                );
+              else if (f.type === "text_delta")
+                s(
+                  (c) => W(c, I, d, (x) => ({
+                    ...x,
+                    subText: (x.subText ?? "") + f.delta
+                  }))
+                );
+              else if (f.type === "tool_call_started") {
+                const c = {
+                  id: crypto.randomUUID(),
+                  type: "tool_call_started",
+                  name: f.name,
+                  args: f.args,
+                  isStreaming: !0
+                };
+                s(
+                  (x) => W(x, I, d, (V) => ({
+                    ...V,
+                    nestedToolEvents: [...V.nestedToolEvents ?? [], c]
+                  }))
+                );
+              } else if (f.type === "tool_call_completed") {
+                const c = f;
+                s(
+                  (x) => kt(x, I, d, c.name, (V) => ({
+                    ...V,
+                    type: "tool_call_completed",
+                    result: c.result,
+                    isStreaming: !1,
+                    status: c.error ? "error" : "success"
+                  }))
+                );
+              }
+            }
+          );
+          for await (const d of b)
+            if (d.type === "text_delta")
+              s(
+                (f) => F(f, I, (c) => ({
+                  ...c,
+                  text: c.text + d.delta
+                }))
+              );
+            else if (d.type === "thinking")
+              s(
+                (f) => F(f, I, (c) => ({
+                  ...c,
+                  thinking: (c.thinking ?? "") + d.delta
+                }))
+              );
+            else if (d.type === "tool_call_started") {
+              const f = {
+                id: crypto.randomUUID(),
+                type: "tool_call_started",
+                name: d.name,
+                args: d.args,
+                isStreaming: !0
+              };
+              s(
+                (c) => F(c, I, (x) => ({
+                  ...x,
+                  toolEvents: [...x.toolEvents, f]
+                }))
+              );
+            } else if (d.type === "tool_call_completed")
+              s(
+                (f) => W(f, I, d.name, (c) => ({
+                  ...c,
+                  type: "tool_call_completed",
+                  result: d.result,
+                  isStreaming: !1,
+                  // Preserve a status set by the proxy (e.g. 'cancelled'); only
+                  // fall back to error/success based on the runner's flag.
+                  status: c.status ?? (d.error ? "error" : "success")
+                }))
+              );
+            else if (d.type === "done") {
+              const f = d.history;
+              s(
+                (c) => F(c, I, (x) => ({
+                  ...x,
+                  text: d.output,
+                  isStreaming: !1
+                }))
+              ), i(f), m((c) => c + 1);
+            }
+        } catch {
+          s(
+            (b) => F(b, I, (d) => ({ ...d, isStreaming: !1 }))
+          );
+        } finally {
+          o(!1);
+        }
+      })();
+    },
+    [t, l]
+  ), w = _(() => {
+    var g;
+    (g = y.current) == null || g.abort();
+  }, []), B = _(() => {
+    var g;
+    (g = y.current) == null || g.abort(), y.current = null, s([]), i([]), o(!1);
+  }, []);
+  return {
+    entries: r,
+    history: a,
+    isRunning: l,
+    sendMessage: S,
+    cancel: w,
+    reset: B,
+    setToolAwaitingApproval: M,
+    setToolStatus: P
+  };
+}
+const K = {
+  width: 16,
+  height: 16,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  "aria-hidden": !0,
+  focusable: !1
+};
+function yt() {
+  return /* @__PURE__ */ k("svg", { ...K, children: [
+    /* @__PURE__ */ e("path", { d: "M9 3a3 3 0 0 0-3 3v.5a3 3 0 0 0-2 5.2A3 3 0 0 0 6 17v.5a3 3 0 0 0 6 0V3a3 3 0 0 0-3 0Z" }),
+    /* @__PURE__ */ e("path", { d: "M15 3a3 3 0 0 1 3 3v.5a3 3 0 0 1 2 5.2A3 3 0 0 1 18 17v.5a3 3 0 0 1-6 0V3a3 3 0 0 1 3 0Z" })
+  ] });
+}
+function It() {
+  return /* @__PURE__ */ e("svg", { ...K, children: /* @__PURE__ */ e("path", { d: "M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18l3 3 6.3-6.3a4 4 0 0 0 5.4-5.4l-2.6 2.6-2.4-2.4 2.6-2.6Z" }) });
+}
+function St() {
+  return /* @__PURE__ */ k("svg", { ...K, children: [
+    /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "9" }),
+    /* @__PURE__ */ e("path", { d: "m8 12 3 3 5-6" })
+  ] });
+}
+function Nt() {
+  return /* @__PURE__ */ k("svg", { ...K, children: [
+    /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "9" }),
+    /* @__PURE__ */ e("path", { d: "m9 9 6 6" }),
+    /* @__PURE__ */ e("path", { d: "m15 9-6 6" })
+  ] });
+}
+function Tt() {
+  return /* @__PURE__ */ k("svg", { ...K, children: [
+    /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "9" }),
+    /* @__PURE__ */ e("path", { d: "M5.5 5.5 18.5 18.5" })
+  ] });
+}
+function wt() {
+  return /* @__PURE__ */ e("svg", { ...K, className: "mast-spin", children: /* @__PURE__ */ e("path", { d: "M12 3a9 9 0 1 0 9 9" }) });
+}
+function At() {
+  return /* @__PURE__ */ e("svg", { ...K, fill: "currentColor", stroke: "none", children: /* @__PURE__ */ e("path", { d: "M3 3 21 12 3 21l3-9-3-9Z" }) });
+}
+function Et() {
+  return /* @__PURE__ */ e("svg", { ...K, fill: "currentColor", stroke: "none", children: /* @__PURE__ */ e("rect", { x: "5", y: "5", width: "14", height: "14", rx: "1" }) });
+}
+const L = {
+  brain: /* @__PURE__ */ e(yt, {}),
+  wrench: /* @__PURE__ */ e(It, {}),
+  check: /* @__PURE__ */ e(St, {}),
+  error: /* @__PURE__ */ e(Nt, {}),
+  cancelled: /* @__PURE__ */ e(Tt, {}),
+  loader: /* @__PURE__ */ e(wt, {}),
+  send: /* @__PURE__ */ e(At, {}),
+  stop: /* @__PURE__ */ e(Et, {})
+}, at = nt(L);
+function Ct({ icons: t, children: n }) {
+  const r = J(() => t ? {
+    brain: t.brain ?? L.brain,
+    wrench: t.wrench ?? L.wrench,
+    check: t.check ?? L.check,
+    error: t.error ?? L.error,
+    cancelled: t.cancelled ?? L.cancelled,
+    loader: t.loader ?? L.loader,
+    send: t.send ?? L.send,
+    stop: t.stop ?? L.stop
+  } : L, [t]);
+  return /* @__PURE__ */ e(at.Provider, { value: r, children: n });
+}
+function q() {
+  return st(at);
+}
+const Mt = Symbol.for("@mast-ai/react-ui.INLINE_APPROVAL"), Pt = "User cancelled the tool call.";
+function _t(t, n) {
+  let r = !1, s = !1;
+  if (n)
+    for (const a of n)
+      a.startsWith("!") ? a.slice(1) === t.name && (s = !0) : a === t.name && (r = !0);
+  return (t.requiresApproval === !0 || r) && !s;
+}
+class Rt {
+  constructor(n, r, s) {
+    this.inner = n, this.onApprovalRequired = r, this.hooks = s;
+  }
+  definition() {
+    return this.inner.definition();
+  }
+  async call(n, r) {
+    var i, l, o, u, m, y;
+    const s = this.inner.definition();
+    (l = (i = this.hooks).notifyAwaiting) == null || l.call(i, s.name, !0);
+    let a;
+    try {
+      const v = await this.onApprovalRequired({
+        id: "",
+        type: "tool_call_started",
+        name: s.name,
+        args: n,
+        isStreaming: !0
+      });
+      v === Mt ? this.hooks.enqueueInline ? a = await this.hooks.enqueueInline(s.name, n) : a = !0 : a = v;
+    } finally {
+      (u = (o = this.hooks).notifyAwaiting) == null || u.call(o, s.name, !1);
+    }
+    return a === !1 ? ((y = (m = this.hooks).setStatus) == null || y.call(m, s.name, "cancelled"), Pt) : typeof a == "string" ? a : this.inner.call(n, r);
+  }
+}
+function Dt(t, n, r, s = {}) {
+  return {
+    getTools: () => t.getTools(),
+    getTool: (a) => {
+      const i = t.getTool(a);
+      if (!i) return;
+      const l = i.definition();
+      if (!_t(l, r())) return i;
+      const o = n();
+      return o ? new Rt(i, o, s) : i;
+    }
+  };
+}
+const it = nt(null);
+function re({
+  runner: t,
+  agent: n,
+  children: r,
+  icons: s,
+  onApprovalRequired: a,
+  approvalOverride: i,
+  initialHistory: l,
+  initialEntries: o,
+  onConversationChange: u
+}) {
+  const m = C(u);
+  m.current = u;
+  const y = C(l), v = C(o), T = C(a);
+  T.current = a;
+  const M = C(i);
+  M.current = i;
+  const P = C(null), S = C(null), w = C(null), B = J(() => {
+    const $ = a !== void 0, O = i !== void 0 && i.length > 0;
+    if (!$ && !O) return t;
+    const z = {
+      notifyAwaiting: (U, D) => {
+        var j;
+        return (j = P.current) == null ? void 0 : j.call(P, U, D);
+      },
+      setStatus: (U, D) => {
+        var j;
+        return (j = S.current) == null ? void 0 : j.call(S, U, D);
+      },
+      enqueueInline: (U, D) => {
+        var j;
+        return ((j = w.current) == null ? void 0 : j.call(w, U, D)) ?? Promise.resolve(!0);
+      }
+    }, H = Dt(
+      t.registry,
+      () => T.current,
+      () => M.current,
+      z
+    );
+    return new vt(t.adapter, H);
+  }, [t, a, i]), [g, A] = R(() => {
+    const $ = B.conversation(n);
+    return y.current && y.current.length > 0 && ($.history = [...y.current]), $;
+  }), N = _(
+    ($, O) => {
+      var z;
+      (z = m.current) == null || z.call(m, O, $);
+    },
+    []
+  ), {
+    entries: E,
+    history: I,
+    sendMessage: h,
+    cancel: p,
+    isRunning: b,
+    reset: d,
+    setToolAwaitingApproval: f,
+    setToolStatus: c
+  } = xt(g, {
+    initialEntries: v.current,
+    onTurnComplete: N
+  });
+  P.current = f, S.current = c;
+  const [x, V] = R([]), X = C(x);
+  X.current = x;
+  const dt = _(($, O) => new Promise((z) => {
+    const H = (D) => {
+      V((j) => j.filter((ht) => ht !== U)), z(D);
+    }, U = {
+      toolName: $,
+      args: O,
+      approve: () => H(!0),
+      reject: () => H(!1),
+      respondWith: (D) => H(D)
+    };
+    V((D) => [...D, U]);
+  }), []);
+  w.current = dt;
+  const Y = _(() => {
+    X.current.forEach(($) => $.reject()), d(), A(B.conversation(n));
+  }, [d, B, n]), mt = J(
+    () => ({
+      messages: E,
+      history: I,
+      sendMessage: h,
+      cancel: p,
+      isRunning: b,
+      reset: Y,
+      pendingApprovals: x
+    }),
+    [E, I, h, p, b, Y, x]
+  );
+  return /* @__PURE__ */ e(it.Provider, { value: mt, children: /* @__PURE__ */ e(Ct, { icons: s, children: r }) });
+}
+function G() {
+  const t = st(it);
+  if (!t)
+    throw new Error("useAgent() must be called from a component rendered inside <AgentProvider>.");
+  return t;
+}
+function $t(t) {
+  if (t === void 0) return "";
+  if (typeof t == "string") return t;
+  try {
+    return JSON.stringify(t, null, 2);
+  } catch {
+    return String(t);
+  }
+}
+function jt({ entry: t, approve: n, reject: r, className: s }) {
+  const a = q(), i = ["mast-inline-approval", s].filter(Boolean).join(" "), l = $t(t.args);
+  return /* @__PURE__ */ k("div", { "data-mast-inline-approval": !0, "data-tool-name": t.name, className: i, children: [
+    /* @__PURE__ */ k("div", { className: "mast-inline-approval-header", children: [
+      /* @__PURE__ */ e("span", { className: "mast-inline-approval-icon", "aria-hidden": "true", children: a.wrench }),
+      /* @__PURE__ */ e("span", { className: "mast-inline-approval-name", children: t.name }),
+      /* @__PURE__ */ e("span", { className: "mast-inline-approval-label", children: "requires approval" })
+    ] }),
+    l ? /* @__PURE__ */ e("pre", { className: "mast-inline-approval-args", children: /* @__PURE__ */ e("code", { children: l }) }) : null,
+    /* @__PURE__ */ k("div", { className: "mast-inline-approval-actions", children: [
+      /* @__PURE__ */ e(
+        "button",
+        {
+          type: "button",
+          className: "mast-inline-approval-button mast-inline-approval-approve",
+          onClick: n,
+          children: "Approve"
+        }
+      ),
+      /* @__PURE__ */ e(
+        "button",
+        {
+          type: "button",
+          className: "mast-inline-approval-button mast-inline-approval-reject",
+          onClick: r,
+          children: "Reject"
+        }
+      )
+    ] })
+  ] });
+}
+function lt({
+  content: t,
+  isStreaming: n = !1,
+  className: r,
+  label: s = "Thinking Process",
+  open: a
+}) {
+  const i = q(), l = ["mast-thinking-block", r].filter(Boolean).join(" ");
+  return /* @__PURE__ */ k(
+    "details",
+    {
+      "data-mast-thinking-block": !0,
+      "data-streaming": n ? "true" : void 0,
+      className: l,
+      open: a,
+      children: [
+        /* @__PURE__ */ k("summary", { className: "mast-thinking-block-summary", children: [
+          /* @__PURE__ */ e("span", { className: "mast-thinking-block-icon", "aria-hidden": "true", children: i.brain }),
+          /* @__PURE__ */ e("span", { className: "mast-thinking-block-label", children: s }),
+          n ? /* @__PURE__ */ e(
+            "span",
+            {
+              className: "mast-thinking-block-pulse",
+              "data-testid": "mast-thinking-pulse",
+              "aria-hidden": "true"
+            }
+          ) : null
+        ] }),
+        /* @__PURE__ */ e("div", { className: "mast-thinking-block-content", children: t })
+      ]
+    }
+  );
+}
+function et(t) {
+  if (t === void 0) return "";
+  if (typeof t == "string") return t;
+  try {
+    return JSON.stringify(t, null, 2);
+  } catch {
+    return String(t);
+  }
+}
+function Lt(t, n) {
+  if (t.isStreaming) return n.loader;
+  switch (t.status) {
+    case "error":
+      return n.error;
+    case "cancelled":
+      return n.cancelled;
+    default:
+      return n.check;
+  }
+}
+function ot({ entry: t, className: n }) {
+  const r = q(), s = ["mast-tool-call-block", n].filter(Boolean).join(" "), a = t.subThinking !== void 0 || t.subText !== void 0, i = t.nestedToolEvents ?? [], l = Lt(t, r), o = et(t.args), u = et(t.result);
+  return /* @__PURE__ */ k(
+    "div",
+    {
+      "data-mast-tool-call-block": !0,
+      "data-streaming": t.isStreaming ? "true" : void 0,
+      "data-status": t.status,
+      "data-tool-name": t.name,
+      className: s,
+      children: [
+        /* @__PURE__ */ k("div", { className: "mast-tool-call-block-header", children: [
+          /* @__PURE__ */ e(
+            "span",
+            {
+              className: "mast-tool-call-block-status",
+              "data-testid": "mast-tool-call-status",
+              "aria-hidden": "true",
+              children: l
+            }
+          ),
+          /* @__PURE__ */ e("span", { className: "mast-tool-call-block-wrench", "aria-hidden": "true", children: r.wrench }),
+          /* @__PURE__ */ e("span", { className: "mast-tool-call-block-name", children: t.name })
+        ] }),
+        a ? /* @__PURE__ */ k("div", { className: "mast-tool-call-block-sub-output", children: [
+          t.subThinking !== void 0 ? /* @__PURE__ */ e(
+            lt,
+            {
+              content: t.subThinking,
+              isStreaming: t.isStreaming,
+              className: "mast-tool-call-block-sub-thinking",
+              open: t.isStreaming ? !0 : void 0
+            }
+          ) : null,
+          t.subText !== void 0 ? /* @__PURE__ */ e("div", { className: "mast-tool-call-block-sub-text", "data-testid": "mast-tool-call-sub-text", children: t.subText }) : null
+        ] }) : null,
+        i.length > 0 ? /* @__PURE__ */ e("div", { className: "mast-tool-call-block-nested", "data-testid": "mast-tool-call-nested", children: i.map((m) => /* @__PURE__ */ e(ot, { entry: m }, m.id)) }) : null,
+        o ? /* @__PURE__ */ k("details", { className: "mast-tool-call-block-args", children: [
+          /* @__PURE__ */ e("summary", { children: "Arguments" }),
+          /* @__PURE__ */ e("pre", { className: "mast-tool-call-block-pre", children: /* @__PURE__ */ e("code", { children: o }) })
+        ] }) : null,
+        !t.isStreaming && u ? /* @__PURE__ */ k("details", { className: "mast-tool-call-block-result", children: [
+          /* @__PURE__ */ e("summary", { children: "Result" }),
+          /* @__PURE__ */ e("pre", { className: "mast-tool-call-block-pre", children: /* @__PURE__ */ e("code", { children: u }) })
+        ] }) : null
+      ]
+    }
+  );
+}
+function Bt({ entry: t, className: n }) {
+  const r = ["mast-user-message", n].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { "data-mast-user-message": !0, className: r, children: /* @__PURE__ */ e("div", { className: "mast-user-message-bubble", children: t.text }) });
+}
+const Ut = pt(async () => {
+  try {
+    const [{ default: t }, { default: n }, { default: r }] = await Promise.all([
+      import("react-markdown"),
+      import("remark-gfm"),
+      import("rehype-sanitize")
+    ]);
+    return {
+      default: ({ children: s }) => /* @__PURE__ */ e("div", { className: "mast-assistant-message-markdown", children: /* @__PURE__ */ e(t, { remarkPlugins: [n], rehypePlugins: [r], children: s }) })
+    };
+  } catch {
+    return {
+      default: ({ children: t }) => /* @__PURE__ */ e("p", { className: "mast-assistant-message-text", children: t })
+    };
+  }
+});
+function Kt({
+  entry: t,
+  className: n,
+  renderMessage: r,
+  renderToolCall: s
+}) {
+  const a = ["mast-assistant-message", n].filter(Boolean).join(" "), { pendingApprovals: i } = G(), l = (o) => {
+    const u = o.awaitingApproval ? i.find((m) => m.toolName === o.name) : void 0;
+    return s ? s(o, u) : u ? /* @__PURE__ */ e(
+      jt,
+      {
+        entry: o,
+        approve: u.approve,
+        reject: u.reject,
+        respondWith: u.respondWith
+      }
+    ) : /* @__PURE__ */ e(ot, { entry: o });
+  };
+  return /* @__PURE__ */ k(
+    "div",
+    {
+      "data-mast-assistant-message": !0,
+      "data-streaming": t.isStreaming ? "true" : void 0,
+      className: a,
+      children: [
+        t.thinking ? /* @__PURE__ */ e(lt, { content: t.thinking, isStreaming: t.isStreaming }) : null,
+        t.toolEvents.map((o, u) => /* @__PURE__ */ e(rt, { children: l(o) }, `${o.id}-${u}`)),
+        t.text ? r ? r(t.text) : /* @__PURE__ */ e(ft, { fallback: /* @__PURE__ */ e("p", { className: "mast-assistant-message-text", children: t.text }), children: /* @__PURE__ */ e(Ut, { children: t.text }) }) : null
+      ]
+    }
+  );
+}
+function Vt({
+  items: t,
+  activeIndex: n,
+  onSelect: r,
+  idPrefix: s,
+  renderItem: a
+}) {
+  return t.length === 0 ? null : /* @__PURE__ */ e(
+    "ul",
+    {
+      className: "mast-mention-picker",
+      id: `${s}-listbox`,
+      role: "listbox",
+      "aria-label": "Mention picker",
+      children: t.map((i, l) => {
+        const o = l === n, u = o ? "mast-mention-picker-item mast-mention-picker-active" : "mast-mention-picker-item";
+        return /* @__PURE__ */ e(
+          "li",
+          {
+            id: `${s}-${l}`,
+            role: "option",
+            "aria-selected": o,
+            className: u,
+            onMouseDown: (m) => {
+              m.preventDefault(), r(i);
+            },
+            children: a ? a(i, o) : /* @__PURE__ */ k("div", { children: [
+              /* @__PURE__ */ e("div", { className: "mast-mention-picker-item-label", children: i.label }),
+              i.description && /* @__PURE__ */ e("div", { className: "mast-mention-picker-item-description", children: i.description })
+            ] })
+          },
+          i.id
+        );
+      })
+    }
+  );
+}
+const Z = "@";
+function ct(t) {
+  return t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function Wt(t, n = Z) {
+  const r = ct(n), s = new RegExp(`${r}([^\\s${r}]*)$`), a = t.match(s);
+  return a ? a[1] : null;
+}
+function zt(t, n = Z) {
+  const r = ct(n), s = new RegExp(`${r}[^\\s${r}]*$`);
+  return t.replace(s, "");
+}
+function Ft(t, n) {
+  return t.map((r) => `${r.text}${Z}${r.item.label}`).join("") + n;
+}
+function Ot(t) {
+  const n = t.trigger ?? "@", [r, s] = R([]), [a, i] = R(""), [l, o] = R(null), [u, m] = R(0), [y, v] = R([]), T = C(r);
+  T.current = r;
+  const M = C(a);
+  M.current = a;
+  const P = C(0);
+  Q(() => {
+    if (l === null) {
+      v([]);
+      return;
+    }
+    const h = ++P.current;
+    if (t.onSearch) {
+      const p = t.onSearch(l);
+      p instanceof Promise ? p.then((b) => {
+        h === P.current && v(b);
+      }) : v(p);
+    }
+  }, [l, t.onSearch]);
+  const S = new Set(r.map((h) => h.item.id)), w = (() => {
+    if (l === null) return [];
+    if (t.onSearch)
+      return y.filter((p) => !S.has(p.id));
+    const h = l.toLowerCase();
+    return (t.items ?? []).filter(
+      (p) => !S.has(p.id) && p.label.toLowerCase().includes(h)
+    );
+  })(), B = _(
+    (h) => {
+      i(h), o(Wt(h, n)), m(0);
+    },
+    [n]
+  ), g = _(
+    (h) => {
+      const p = T.current;
+      if (p.some((d) => d.item.id === h.id)) return;
+      const b = zt(M.current, n);
+      s([...p, { text: b, item: h }]), i(""), o(null), m(0);
+    },
+    [n]
+  ), A = _((h) => {
+    const p = T.current, b = p.findIndex((c) => c.item.id === h);
+    if (b === -1) return;
+    const d = p[b].text, f = [...p.slice(0, b), ...p.slice(b + 1)];
+    if (b < f.length) {
+      f[b] = { ...f[b], text: d + f[b].text }, s(f);
+      return;
+    }
+    s(f), i(d + M.current);
+  }, []), N = _(
+    (h) => {
+      if (l === null || w.length === 0) return !1;
+      switch (h.key) {
+        case "ArrowDown":
+          return h.preventDefault(), m((p) => (p + 1) % w.length), !0;
+        case "ArrowUp":
+          return h.preventDefault(), m((p) => p === 0 ? w.length - 1 : p - 1), !0;
+        case "Enter":
+          return h.preventDefault(), g(w[u] ?? w[0]), !0;
+        case "Escape":
+          return h.preventDefault(), o(null), !0;
+        default:
+          return !1;
+      }
+    },
+    [l, w, u, g]
+  ), E = _(() => {
+    const h = Ft(r, a);
+    return { prompt: t.buildPrompt ? t.buildPrompt(r, a) : h, displayText: h };
+  }, [r, a, t.buildPrompt]), I = _(() => {
+    s([]), i(""), o(null), m(0);
+  }, []);
+  return {
+    segments: r,
+    trailingInput: a,
+    mentionQuery: l,
+    filteredItems: w,
+    pickerIndex: u,
+    setTrailingInput: B,
+    handleKeyDown: N,
+    selectItem: g,
+    removeChip: A,
+    buildSubmission: E,
+    clear: I
+  };
+}
+const Ht = 1, qt = 8;
+function ut(t) {
+  const n = t.split(`
+`).length;
+  return Math.min(qt, Math.max(Ht, n));
+}
+function Gt({
+  className: t,
+  placeholder: n = "Type a message and press Enter.",
+  sendLabel: r,
+  cancelLabel: s,
+  mentions: a
+}) {
+  return a ? /* @__PURE__ */ e(
+    Qt,
+    {
+      className: t,
+      placeholder: n,
+      sendLabel: r,
+      cancelLabel: s,
+      mentions: a
+    }
+  ) : /* @__PURE__ */ e(
+    Jt,
+    {
+      className: t,
+      placeholder: n,
+      sendLabel: r,
+      cancelLabel: s
+    }
+  );
+}
+function Jt({ className: t, placeholder: n, sendLabel: r, cancelLabel: s }) {
+  const { sendMessage: a, cancel: i, isRunning: l } = G(), o = q(), [u, m] = R(""), y = ["mast-chat-input", t].filter(Boolean).join(" "), v = u.trim(), T = !l && v.length > 0, M = () => {
+    T && (a(v), m(""));
+  }, P = (S) => {
+    S.key === "Enter" && !S.shiftKey && (S.preventDefault(), M());
+  };
+  return /* @__PURE__ */ k(
+    "form",
+    {
+      "data-mast-chat-input": !0,
+      className: y,
+      onSubmit: (S) => {
+        S.preventDefault(), M();
+      },
+      children: [
+        /* @__PURE__ */ e("label", { className: "mast-chat-input-label mast-visually-hidden", htmlFor: "mast-chat-input-field", children: "Message" }),
+        /* @__PURE__ */ e(
+          "textarea",
+          {
+            id: "mast-chat-input-field",
+            className: "mast-chat-input-textarea",
+            value: u,
+            placeholder: n,
+            rows: ut(u),
+            disabled: l,
+            onChange: (S) => m(S.target.value),
+            onKeyDown: P
+          }
+        ),
+        l ? /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            className: "mast-chat-input-cancel",
+            "aria-label": "Cancel",
+            onClick: i,
+            children: s ?? o.stop
+          }
+        ) : /* @__PURE__ */ e(
+          "button",
+          {
+            type: "submit",
+            className: "mast-chat-input-send",
+            "aria-label": "Send",
+            disabled: !T,
+            children: r ?? o.send
+          }
+        )
+      ]
+    }
+  );
+}
+function Qt({
+  className: t,
+  placeholder: n,
+  sendLabel: r,
+  cancelLabel: s,
+  mentions: a
+}) {
+  const { sendMessage: i, cancel: l, isRunning: o } = G(), u = q(), m = gt(), {
+    segments: y,
+    trailingInput: v,
+    mentionQuery: T,
+    filteredItems: M,
+    pickerIndex: P,
+    setTrailingInput: S,
+    handleKeyDown: w,
+    selectItem: B,
+    removeChip: g,
+    buildSubmission: A,
+    clear: N
+  } = Ot(a), E = ["mast-chat-input", "mast-mention-input", t].filter(Boolean).join(" "), I = y.length > 0 || v.trim().length > 0, h = !o && I, p = T !== null && M.length > 0, b = p ? `${m}-${P}` : void 0, d = () => {
+    if (!h) return;
+    const { prompt: c, displayText: x } = A();
+    x.trim() && (i(c, x), N());
+  }, f = (c) => {
+    w(c) || c.key === "Enter" && !c.shiftKey && (c.preventDefault(), d());
+  };
+  return /* @__PURE__ */ k(
+    "form",
+    {
+      "data-mast-chat-input": !0,
+      className: E,
+      onSubmit: (c) => {
+        c.preventDefault(), d();
+      },
+      children: [
+        /* @__PURE__ */ e("label", { className: "mast-chat-input-label mast-visually-hidden", htmlFor: "mast-chat-input-field", children: "Message" }),
+        /* @__PURE__ */ k("div", { className: "mast-mention-input-field", children: [
+          p && /* @__PURE__ */ e(
+            Vt,
+            {
+              items: M,
+              activeIndex: P,
+              onSelect: B,
+              idPrefix: m,
+              renderItem: a.renderItem
+            }
+          ),
+          /* @__PURE__ */ k("div", { className: "mast-mention-input-content", children: [
+            y.map((c) => /* @__PURE__ */ k(rt, { children: [
+              c.text && /* @__PURE__ */ e("span", { className: "mast-mention-segment-text", children: c.text }),
+              a.renderChip ? a.renderChip(c.item, () => g(c.item.id)) : /* @__PURE__ */ k("span", { className: "mast-mention-chip", children: [
+                "@",
+                c.item.label,
+                /* @__PURE__ */ e(
+                  "button",
+                  {
+                    type: "button",
+                    className: "mast-mention-chip-remove",
+                    "aria-label": `Remove reference to ${c.item.label}`,
+                    onClick: () => g(c.item.id),
+                    children: "×"
+                  }
+                )
+              ] })
+            ] }, c.item.id)),
+            /* @__PURE__ */ e(
+              "textarea",
+              {
+                id: "mast-chat-input-field",
+                className: "mast-chat-input-textarea mast-mention-input-textarea",
+                value: v,
+                placeholder: y.length === 0 ? n : "",
+                rows: ut(v),
+                disabled: o,
+                onChange: (c) => S(c.target.value),
+                onKeyDown: f,
+                role: "combobox",
+                "aria-expanded": p,
+                "aria-controls": p ? `${m}-listbox` : void 0,
+                "aria-autocomplete": "list",
+                "aria-activedescendant": b
+              }
+            )
+          ] })
+        ] }),
+        o ? /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            className: "mast-chat-input-cancel",
+            "aria-label": "Cancel",
+            onClick: l,
+            children: s ?? u.stop
+          }
+        ) : /* @__PURE__ */ e(
+          "button",
+          {
+            type: "submit",
+            className: "mast-chat-input-send",
+            "aria-label": "Send",
+            disabled: !h,
+            children: r ?? u.send
+          }
+        )
+      ]
+    }
+  );
+}
+function Zt({ entry: t, className: n, renderToolCall: r, renderMessage: s }) {
+  return t.role === "user" ? /* @__PURE__ */ e(Bt, { entry: t, className: n }) : /* @__PURE__ */ e(
+    Kt,
+    {
+      entry: t,
+      className: n,
+      renderToolCall: r,
+      renderMessage: s
+    }
+  );
+}
+const Xt = 80;
+function Yt({ className: t, renderToolCall: n, renderMessage: r }) {
+  const { messages: s } = G(), a = C(null), i = bt({
+    count: s.length,
+    getScrollElement: () => a.current,
+    estimateSize: () => Xt,
+    overscan: 4
+  }), l = s.length > 0 ? s[s.length - 1] : void 0, o = (l == null ? void 0 : l.text.length) ?? 0;
+  Q(() => {
+    s.length !== 0 && i.scrollToIndex(s.length - 1, { align: "end" });
+  }, [s.length, o, i]);
+  const u = i.getTotalSize(), m = i.getVirtualItems(), y = ["mast-message-list", t].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { ref: a, "data-mast-message-list": !0, className: y, role: "log", "aria-live": "polite", children: /* @__PURE__ */ e("div", { style: { height: `${u}px`, position: "relative", width: "100%" }, children: m.map((v) => {
+    const T = s[v.index];
+    return /* @__PURE__ */ e(
+      "div",
+      {
+        "data-index": v.index,
+        ref: i.measureElement,
+        style: {
+          position: "absolute",
+          top: 0,
+          left: 0,
+          width: "100%",
+          transform: `translateY(${v.start}px)`
+        },
+        children: /* @__PURE__ */ e(
+          Zt,
+          {
+            entry: T,
+            renderToolCall: n,
+            renderMessage: r
+          }
+        )
+      },
+      T.id
+    );
+  }) }) });
+}
+function ae({
+  theme: t,
+  className: n,
+  renderToolCall: r,
+  renderMessage: s,
+  inputPlaceholder: a,
+  mentions: i
+}) {
+  const l = ["mast-conversation-panel", n].filter(Boolean).join(" ");
+  return /* @__PURE__ */ k("div", { "data-mast-root": !0, "data-mast-theme": t, className: l, children: [
+    /* @__PURE__ */ e(Yt, { renderToolCall: r, renderMessage: s }),
+    /* @__PURE__ */ e(Gt, { placeholder: a, mentions: i })
+  ] });
+}
+export {
+  re as AgentProvider,
+  Kt as AssistantMessage,
+  Gt as ChatInput,
+  ae as ConversationPanel,
+  Mt as INLINE_APPROVAL,
+  jt as InlineApproval,
+  Zt as MessageItem,
+  Yt as MessageList,
+  lt as ThinkingBlock,
+  ot as ToolCallBlock,
+  Bt as UserMessage,
+  Ft as buildInlineMentionPrompt,
+  Wt as extractMentionQuery,
+  zt as removeMentionTrigger,
+  G as useAgent,
+  xt as useAgentStream,
+  Ot as useMentions
+};