npm - @ai-matrx/chat - Versions diffs - 0.5.0 → 0.5.3 - Mend

@ai-matrx/chat 0.5.0 → 0.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (512) hide show

package/dist/agents/ui-first-tools/ui/AskCard.js CHANGED Viewed

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from "react";
 import {
   Info,
@@ -158,7 +159,7 @@ function AskCard({ ask }) {
   const isLast = ask.batchTotal == null || ask.batchTotal <= 1 || typeof ask.batchIndex === "number" && ask.batchIndex === ask.batchTotal - 1;
   const showExtras = ask.toolName === "user" && ask.kind !== "notify";
   const showNote = showExtras && isLast;
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     AgentCardShell,
     {
       tone: p.tone,
@@ -170,46 +171,53 @@ function AskCard({ ask }) {
       onDismiss: skip,
       dismissLabel: "Skip this question",
       pending: ask.status !== "pending",
-      bottomSlot: typeof ask.expiresAtMs === "number" ? /* @__PURE__ */ React.createElement(
+      bottomSlot: typeof ask.expiresAtMs === "number" ? /* @__PURE__ */ jsx(
         AskCardCountdown,
         {
           expiresAtMs: ask.expiresAtMs,
           className: "absolute bottom-0 left-0 right-0 rounded-none"
         }
       ) : null,
-      "aria-label": `Question from agent: ${ask.question ?? ask.message ?? ""}`
-    },
-    writeMode ? /* @__PURE__ */ React.createElement(
-      WriteInsteadBody,
-      {
-        value: writeText,
-        onChange: setWriteText,
-        onSend: sendWriteInstead,
-        onSkip: skip,
-        onBack: () => {
-          setWriteMode(false);
-          setWriteText("");
+      "aria-label": `Question from agent: ${ask.question ?? ask.message ?? ""}`,
+      children: writeMode ? /* @__PURE__ */ jsx(
+        WriteInsteadBody,
+        {
+          value: writeText,
+          onChange: setWriteText,
+          onSend: sendWriteInstead,
+          onSkip: skip,
+          onBack: () => {
+            setWriteMode(false);
+            setWriteText("");
+          }
         }
-      }
-    ) : /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React.createElement(
-      AskBody,
-      {
-        ask,
-        onAnswer: answer,
-        onSkip: skip,
-        onDraft: (r) => setAskDraft(ask.callId, r),
-        labels: SINGLE_LABELS
-      }
-    ), showNote && /* @__PURE__ */ React.createElement("div", { className: "mt-1 flex flex-col gap-1.5 border-t border-border/60 pt-2.5" }, /* @__PURE__ */ React.createElement("div", { className: "text-[11px] uppercase tracking-wide text-muted-foreground" }, "Anything else? (optional)"), /* @__PURE__ */ React.createElement(
-      Textarea,
-      {
-        value: additionalInstructions,
-        onChange: (e) => setAdditionalInstructions(e.target.value),
-        placeholder: "Add a note for the agent\u2026",
-        rows: 2,
-        className: "text-base"
-      }
-    )), showExtras && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Button, { variant: "link", onClick: () => setWriteMode(true) }, "Write message instead")))
+      ) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsx(
+          AskBody,
+          {
+            ask,
+            onAnswer: answer,
+            onSkip: skip,
+            onDraft: (r) => setAskDraft(ask.callId, r),
+            labels: SINGLE_LABELS
+          }
+        ),
+        showNote && /* @__PURE__ */ jsxs("div", { className: "mt-1 flex flex-col gap-1.5 border-t border-border/60 pt-2.5", children: [
+          /* @__PURE__ */ jsx("div", { className: "text-[11px] uppercase tracking-wide text-muted-foreground", children: "Anything else? (optional)" }),
+          /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              value: additionalInstructions,
+              onChange: (e) => setAdditionalInstructions(e.target.value),
+              placeholder: "Add a note for the agent\u2026",
+              rows: 2,
+              className: "text-base"
+            }
+          )
+        ] }),
+        showExtras && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { variant: "link", onClick: () => setWriteMode(true), children: "Write message instead" }) })
+      ] })
+    }
   );
 }
 function WriteInsteadBody({
@@ -220,28 +228,37 @@ function WriteInsteadBody({
   onBack
 }) {
   const hasText = value.trim().length > 0;
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React.createElement("div", { className: "text-[11px] uppercase tracking-wide text-muted-foreground" }, "Write a message instead"), /* @__PURE__ */ React.createElement(
-    Textarea,
-    {
-      value,
-      onChange: (e) => onChange(e.target.value),
-      placeholder: "Type your reply to the agent\u2026",
-      rows: 3,
-      autoFocus: true,
-      className: "text-base",
-      onKeyDown: (e) => {
-        if ((e.metaKey || e.ctrlKey) && e.key === "Enter") onSend();
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-[11px] uppercase tracking-wide text-muted-foreground", children: "Write a message instead" }),
+    /* @__PURE__ */ jsx(
+      Textarea,
+      {
+        value,
+        onChange: (e) => onChange(e.target.value),
+        placeholder: "Type your reply to the agent\u2026",
+        rows: 3,
+        autoFocus: true,
+        className: "text-base",
+        onKeyDown: (e) => {
+          if ((e.metaKey || e.ctrlKey) && e.key === "Enter") onSend();
+        }
       }
-    }
-  ), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: hasText ? "primary" : "outline",
-      onClick: hasText ? onSend : onSkip
-    },
-    hasText && /* @__PURE__ */ React.createElement(Send, { className: "size-3.5" }),
-    hasText ? "Send" : "Skip"
-  ), /* @__PURE__ */ React.createElement(Button, { variant: "quiet", onClick: onBack }, "Back to questions")));
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: hasText ? "primary" : "outline",
+          onClick: hasText ? onSend : onSkip,
+          children: [
+            hasText && /* @__PURE__ */ jsx(Send, { className: "size-3.5" }),
+            hasText ? "Send" : "Skip"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { variant: "quiet", onClick: onBack, children: "Back to questions" })
+    ] })
+  ] });
 }
 function useDraft(onDraft, draft) {
   const key = JSON.stringify(draft);
@@ -256,36 +273,38 @@ function PrimaryAction({
   onSkip,
   className
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     Button,
     {
       variant: hasContent ? "primary" : "outline",
       onClick: hasContent ? onSend : onSkip,
-      className
-    },
-    hasContent && /* @__PURE__ */ React.createElement(Send, { className: "size-3.5" }),
-    hasContent ? labels.send : labels.skip
+      className,
+      children: [
+        hasContent && /* @__PURE__ */ jsx(Send, { className: "size-3.5" }),
+        hasContent ? labels.send : labels.skip
+      ]
+    }
   );
 }
 function AskBody(props) {
   const { ask } = props;
   switch (ask.kind) {
     case "confirm":
-      return /* @__PURE__ */ React.createElement(ConfirmBody, { ...props });
+      return /* @__PURE__ */ jsx(ConfirmBody, { ...props });
     case "choice":
-      return /* @__PURE__ */ React.createElement(ChoiceBody, { ...props, multi: false });
+      return /* @__PURE__ */ jsx(ChoiceBody, { ...props, multi: false });
     case "choice_many":
-      return /* @__PURE__ */ React.createElement(ChoiceBody, { ...props, multi: true });
+      return /* @__PURE__ */ jsx(ChoiceBody, { ...props, multi: true });
     case "text":
-      return /* @__PURE__ */ React.createElement(TextBody, { ...props, secret: false });
+      return /* @__PURE__ */ jsx(TextBody, { ...props, secret: false });
     case "secret":
-      return /* @__PURE__ */ React.createElement(TextBody, { ...props, secret: true });
+      return /* @__PURE__ */ jsx(TextBody, { ...props, secret: true });
     case "notify":
-      return /* @__PURE__ */ React.createElement(NotifyBody, { ...props });
+      return /* @__PURE__ */ jsx(NotifyBody, { ...props });
     case "plan_approval":
-      return /* @__PURE__ */ React.createElement(PlanApprovalBody, { ...props });
+      return /* @__PURE__ */ jsx(PlanApprovalBody, { ...props });
     case "takeover":
-      return /* @__PURE__ */ React.createElement(TextBody, { ...props, secret: false });
+      return /* @__PURE__ */ jsx(TextBody, { ...props, secret: false });
     case "approval":
     case "email_review":
       return null;
@@ -311,69 +330,80 @@ function ConfirmBody({
     onAnswer({ ...EMPTY_ASK_RESPONSE, confirmed: null, freeform: text });
   }
   if (otherMode) {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React.createElement(
-      Textarea,
-      {
-        value: otherText,
-        onChange: (e) => setOtherText(e.target.value),
-        placeholder: "Type your answer\u2026",
-        rows: 2,
-        autoFocus: true,
-        className: "text-base",
-        onKeyDown: (e) => {
-          if ((e.metaKey || e.ctrlKey) && e.key === "Enter") sendOther();
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          value: otherText,
+          onChange: (e) => setOtherText(e.target.value),
+          placeholder: "Type your answer\u2026",
+          rows: 2,
+          autoFocus: true,
+          className: "text-base",
+          onKeyDown: (e) => {
+            if ((e.metaKey || e.ctrlKey) && e.key === "Enter") sendOther();
+          }
         }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          PrimaryAction,
+          {
+            hasContent: text.length > 0,
+            labels,
+            onSend: sendOther,
+            onSkip
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "quiet",
+            onClick: () => {
+              setOtherMode(false);
+              setOtherText("");
+            },
+            children: "Back"
+          }
+        )
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "primary",
+        onClick: () => onAnswer({ ...EMPTY_ASK_RESPONSE, confirmed: true }),
+        children: "Yes"
       }
-    ), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement(
-      PrimaryAction,
+    ),
+    /* @__PURE__ */ jsx(
+      Button,
       {
-        hasContent: text.length > 0,
-        labels,
-        onSend: sendOther,
-        onSkip
+        variant: "outline",
+        onClick: () => onAnswer({ ...EMPTY_ASK_RESPONSE, confirmed: false }),
+        children: "No"
       }
-    ), /* @__PURE__ */ React.createElement(
+    ),
+    /* @__PURE__ */ jsx(
       Button,
       {
         variant: "quiet",
-        onClick: () => {
-          setOtherMode(false);
-          setOtherText("");
-        }
-      },
-      "Back"
-    )));
-  }
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center gap-2" }, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "primary",
-      onClick: () => onAnswer({ ...EMPTY_ASK_RESPONSE, confirmed: true })
-    },
-    "Yes"
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "outline",
-      onClick: () => onAnswer({ ...EMPTY_ASK_RESPONSE, confirmed: false })
-    },
-    "No"
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "quiet",
-      onClick: () => setOtherMode(true)
-    },
-    "Other\u2026"
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "quiet",
-      onClick: onSkip,
-      className: "ml-auto"
-    },
-    labels.skip
-  ));
+        onClick: () => setOtherMode(true),
+        children: "Other\u2026"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "quiet",
+        onClick: onSkip,
+        className: "ml-auto",
+        children: labels.skip
+      }
+    )
+  ] });
 }
 function ChoiceBody({
   ask,
@@ -425,57 +455,77 @@ function ChoiceBody({
   function submit() {
     if (draft) onAnswer(draft);
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React.createElement("div", { className: sideBySide ? "grid grid-cols-[1fr_1.2fr] gap-3" : "" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-1.5" }, options.map((opt, i) => /* @__PURE__ */ React.createElement(
-    "label",
-    {
-      key: opt.label,
-      className: "flex cursor-pointer items-start gap-2 rounded-lg border border-border/70 bg-background/60 px-3 py-2 text-sm transition-colors hover:bg-accent/60",
-      onMouseEnter: () => setFocusedIdx(i)
-    },
-    /* @__PURE__ */ React.createElement(
-      "input",
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: sideBySide ? "grid grid-cols-[1fr_1.2fr] gap-3" : "", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+        options.map((opt, i) => /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "flex cursor-pointer items-start gap-2 rounded-lg border border-border/70 bg-background/60 px-3 py-2 text-sm transition-colors hover:bg-accent/60",
+            onMouseEnter: () => setFocusedIdx(i),
+            children: [
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: multi ? "checkbox" : "radio",
+                  name: `ask-${ask.callId}`,
+                  value: opt.label,
+                  checked: selected.includes(opt.label),
+                  onChange: () => {
+                    toggle(opt.label);
+                    setFocusedIdx(i);
+                  },
+                  className: "mt-0.5 size-3.5"
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsx("div", { children: opt.label }),
+                opt.description && /* @__PURE__ */ jsx("div", { className: "mt-0.5 text-xs text-muted-foreground", children: opt.description })
+              ] })
+            ]
+          },
+          opt.label
+        )),
+        ask.allowOther && /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-start gap-2 rounded-lg border border-dashed border-border bg-background/40 px-3 py-2 text-sm transition-colors hover:bg-accent/60", children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: multi ? "checkbox" : "radio",
+              name: `ask-${ask.callId}`,
+              value: OTHER_SENTINEL,
+              checked: otherSelected,
+              onChange: () => toggle(OTHER_SENTINEL),
+              className: "mt-0.5 size-3.5"
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx("div", { children: "Other" }),
+            otherSelected ? /* @__PURE__ */ jsx(
+              Textarea,
+              {
+                value: otherText,
+                onChange: (e) => setOtherText(e.target.value),
+                placeholder: "Type your answer\u2026",
+                rows: 2,
+                className: "mt-1 text-base",
+                autoFocus: true
+              }
+            ) : /* @__PURE__ */ jsx("div", { className: "mt-0.5 text-xs text-muted-foreground", children: "Type a different answer" })
+          ] })
+        ] })
+      ] }),
+      sideBySide && focusedOption?.preview && /* @__PURE__ */ jsx("pre", { className: "overflow-auto rounded-lg border border-border bg-muted/40 p-2 font-mono text-[11px] leading-relaxed whitespace-pre-wrap", children: focusedOption.preview })
+    ] }),
+    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+      PrimaryAction,
       {
-        type: multi ? "checkbox" : "radio",
-        name: `ask-${ask.callId}`,
-        value: opt.label,
-        checked: selected.includes(opt.label),
-        onChange: () => {
-          toggle(opt.label);
-          setFocusedIdx(i);
-        },
-        className: "mt-0.5 size-3.5"
+        hasContent: draft !== null,
+        labels,
+        onSend: submit,
+        onSkip
       }
-    ),
-    /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", null, opt.label), opt.description && /* @__PURE__ */ React.createElement("div", { className: "mt-0.5 text-xs text-muted-foreground" }, opt.description))
-  )), ask.allowOther && /* @__PURE__ */ React.createElement("label", { className: "flex cursor-pointer items-start gap-2 rounded-lg border border-dashed border-border bg-background/40 px-3 py-2 text-sm transition-colors hover:bg-accent/60" }, /* @__PURE__ */ React.createElement(
-    "input",
-    {
-      type: multi ? "checkbox" : "radio",
-      name: `ask-${ask.callId}`,
-      value: OTHER_SENTINEL,
-      checked: otherSelected,
-      onChange: () => toggle(OTHER_SENTINEL),
-      className: "mt-0.5 size-3.5"
-    }
-  ), /* @__PURE__ */ React.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React.createElement("div", null, "Other"), otherSelected ? /* @__PURE__ */ React.createElement(
-    Textarea,
-    {
-      value: otherText,
-      onChange: (e) => setOtherText(e.target.value),
-      placeholder: "Type your answer\u2026",
-      rows: 2,
-      className: "mt-1 text-base",
-      autoFocus: true
-    }
-  ) : /* @__PURE__ */ React.createElement("div", { className: "mt-0.5 text-xs text-muted-foreground" }, "Type a different answer")))), sideBySide && focusedOption?.preview && /* @__PURE__ */ React.createElement("pre", { className: "overflow-auto rounded-lg border border-border bg-muted/40 p-2 font-mono text-[11px] leading-relaxed whitespace-pre-wrap" }, focusedOption.preview)), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
-    PrimaryAction,
-    {
-      hasContent: draft !== null,
-      labels,
-      onSend: submit,
-      onSkip
-    }
-  )));
+    ) })
+  ] });
 }
 function TextBody({
   ask,
@@ -495,39 +545,48 @@ function TextBody({
     if (!hasText) return;
     onAnswer({ ...EMPTY_ASK_RESPONSE, answer: value });
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, secret ? /* @__PURE__ */ React.createElement("div", { className: "relative" }, /* @__PURE__ */ React.createElement(
-    Input,
-    {
-      type: show ? "text" : "password",
-      value,
-      onChange: (e) => setValue(e.target.value),
-      placeholder: "Enter value\u2026",
-      onKeyDown: (e) => {
-        if (e.key === "Enter") submit();
-      },
-      className: "pr-8 text-base"
-    }
-  ), /* @__PURE__ */ React.createElement(Button, { variant: "quiet", icon: show ? /* @__PURE__ */ React.createElement(EyeOff, null) : /* @__PURE__ */ React.createElement(Eye, null), onClick: () => setShow((s) => !s), "aria-label": show ? "Hide value" : "Show value", className: "absolute right-2 top-1/2" })) : /* @__PURE__ */ React.createElement(
-    Textarea,
-    {
-      value,
-      onChange: (e) => setValue(e.target.value),
-      placeholder: "Type your answer\u2026",
-      rows: 2,
-      className: "text-base",
-      onKeyDown: (e) => {
-        if ((e.metaKey || e.ctrlKey) && e.key === "Enter") submit();
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+    secret ? /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          type: show ? "text" : "password",
+          value,
+          onChange: (e) => setValue(e.target.value),
+          placeholder: "Enter value\u2026",
+          onKeyDown: (e) => {
+            if (e.key === "Enter") submit();
+          },
+          className: "pr-8 text-base"
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { variant: "quiet", icon: show ? /* @__PURE__ */ jsx(EyeOff, {}) : /* @__PURE__ */ jsx(Eye, {}), onClick: () => setShow((s) => !s), "aria-label": show ? "Hide value" : "Show value", className: "absolute right-2 top-1/2" })
+    ] }) : /* @__PURE__ */ jsx(
+      Textarea,
+      {
+        value,
+        onChange: (e) => setValue(e.target.value),
+        placeholder: "Type your answer\u2026",
+        rows: 2,
+        className: "text-base",
+        onKeyDown: (e) => {
+          if ((e.metaKey || e.ctrlKey) && e.key === "Enter") submit();
+        }
       }
-    }
-  ), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement(
-    PrimaryAction,
-    {
-      hasContent: hasText,
-      labels,
-      onSend: submit,
-      onSkip
-    }
-  ), /* @__PURE__ */ React.createElement("span", { className: "text-[11px] text-muted-foreground" }, secret ? "Stored only for this call." : "Cmd/Ctrl+Enter to submit")));
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(
+        PrimaryAction,
+        {
+          hasContent: hasText,
+          labels,
+          onSend: submit,
+          onSkip
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-[11px] text-muted-foreground", children: secret ? "Stored only for this call." : "Cmd/Ctrl+Enter to submit" })
+    ] })
+  ] });
 }
 function NotifyBody({ ask, onAnswer, onDraft }) {
   const seed = getAskDraft(ask.callId)?.freeform ?? "";
@@ -545,97 +604,128 @@ function NotifyBody({ ask, onAnswer, onDraft }) {
   function dismiss() {
     onAnswer({ ...EMPTY_ASK_RESPONSE, action: "dismiss", freeform: null });
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, ask.message && /* @__PURE__ */ React.createElement("div", { className: "text-sm text-foreground" }, /* @__PURE__ */ React.createElement(RichContent, { source: ask.message ?? "", level: "standard" })), !showOther && /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center gap-2" }, (ask.actions ?? []).map((a) => /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      key: a,
-      variant: ask.level === "error" ? "danger" : "outline",
-      onClick: () => onAnswer({ ...EMPTY_ASK_RESPONSE, action: a, freeform: null })
-    },
-    a
-  )), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "outline",
-      onClick: () => setShowOther(true)
-    },
-    "Other\u2026"
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "quiet",
-      onClick: dismiss,
-      className: "ml-auto"
-    },
-    "Dismiss"
-  )), showOther && /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React.createElement(
-    Textarea,
-    {
-      value: freeform,
-      onChange: (e) => setFreeform(e.target.value),
-      placeholder: "Tell the agent what happened\u2026",
-      rows: 2,
-      autoFocus: true,
-      className: "text-base",
-      onKeyDown: (e) => {
-        if ((e.metaKey || e.ctrlKey) && e.key === "Enter") sendOther();
-      }
-    }
-  ), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement(
-    PrimaryAction,
-    {
-      hasContent: hasText,
-      labels: { send: "Send", skip: "Dismiss" },
-      onSend: sendOther,
-      onSkip: dismiss
-    }
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "quiet",
-      onClick: () => {
-        setShowOther(false);
-        setFreeform("");
-      }
-    },
-    "Back"
-  ))));
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+    ask.message && /* @__PURE__ */ jsx("div", { className: "text-sm text-foreground", children: /* @__PURE__ */ jsx(RichContent, { source: ask.message ?? "", level: "standard" }) }),
+    !showOther && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+      (ask.actions ?? []).map((a) => /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: ask.level === "error" ? "danger" : "outline",
+          onClick: () => onAnswer({ ...EMPTY_ASK_RESPONSE, action: a, freeform: null }),
+          children: a
+        },
+        a
+      )),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          onClick: () => setShowOther(true),
+          children: "Other\u2026"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "quiet",
+          onClick: dismiss,
+          className: "ml-auto",
+          children: "Dismiss"
+        }
+      )
+    ] }),
+    showOther && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          value: freeform,
+          onChange: (e) => setFreeform(e.target.value),
+          placeholder: "Tell the agent what happened\u2026",
+          rows: 2,
+          autoFocus: true,
+          className: "text-base",
+          onKeyDown: (e) => {
+            if ((e.metaKey || e.ctrlKey) && e.key === "Enter") sendOther();
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          PrimaryAction,
+          {
+            hasContent: hasText,
+            labels: { send: "Send", skip: "Dismiss" },
+            onSend: sendOther,
+            onSkip: dismiss
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "quiet",
+            onClick: () => {
+              setShowOther(false);
+              setFreeform("");
+            },
+            children: "Back"
+          }
+        )
+      ] })
+    ] })
+  ] });
 }
 function PlanApprovalBody({ ask, onAnswer, onSkip, labels }) {
   const plan = ask.plan;
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2" }, plan?.reasoning && /* @__PURE__ */ React.createElement("div", { className: "text-xs text-muted-foreground" }, /* @__PURE__ */ React.createElement(RichContent, { source: plan.reasoning ?? "", level: "standard" })), plan?.steps && plan.steps.length > 0 && /* @__PURE__ */ React.createElement("ol", { className: "list-decimal space-y-0.5 pl-5 text-sm" }, plan.steps.map((s, i) => /* @__PURE__ */ React.createElement("li", { key: i, className: "text-foreground" }, s))), plan?.estimated_minutes != null && /* @__PURE__ */ React.createElement("div", { className: "text-xs text-muted-foreground" }, "Estimated ~", plan.estimated_minutes, " min"), /* @__PURE__ */ React.createElement("div", { className: "flex gap-2" }, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "primary",
-      onClick: () => onAnswer({
-        ...EMPTY_ASK_RESPONSE,
-        selected: ["Approve"],
-        confirmed: true
-      })
-    },
-    /* @__PURE__ */ React.createElement(CheckCheck, { className: "size-3.5" }),
-    "Approve"
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "outline",
-      onClick: () => onAnswer({
-        ...EMPTY_ASK_RESPONSE,
-        selected: ["Reject"],
-        confirmed: false
-      })
-    },
-    /* @__PURE__ */ React.createElement(Circle, { className: "size-3.5" }),
-    "Reject"
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      variant: "quiet",
-      onClick: onSkip,
-      className: "ml-auto"
-    },
-    labels.skip
-  )));
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+    plan?.reasoning && /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: /* @__PURE__ */ jsx(RichContent, { source: plan.reasoning ?? "", level: "standard" }) }),
+    plan?.steps && plan.steps.length > 0 && /* @__PURE__ */ jsx("ol", { className: "list-decimal space-y-0.5 pl-5 text-sm", children: plan.steps.map((s, i) => /* @__PURE__ */ jsx("li", { className: "text-foreground", children: s }, i)) }),
+    plan?.estimated_minutes != null && /* @__PURE__ */ jsxs("div", { className: "text-xs text-muted-foreground", children: [
+      "Estimated ~",
+      plan.estimated_minutes,
+      " min"
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: "primary",
+          onClick: () => onAnswer({
+            ...EMPTY_ASK_RESPONSE,
+            selected: ["Approve"],
+            confirmed: true
+          }),
+          children: [
+            /* @__PURE__ */ jsx(CheckCheck, { className: "size-3.5" }),
+            "Approve"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: "outline",
+          onClick: () => onAnswer({
+            ...EMPTY_ASK_RESPONSE,
+            selected: ["Reject"],
+            confirmed: false
+          }),
+          children: [
+            /* @__PURE__ */ jsx(Circle, { className: "size-3.5" }),
+            "Reject"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "quiet",
+          onClick: onSkip,
+          className: "ml-auto",
+          children: labels.skip
+        }
+      )
+    ] })
+  ] });
 }
 export {
   AskBody,