import { o as O } from "./rolldown-runtime.js";
import { i as Y, t as G } from "./vendor/react.js";
import { t as J } from "./check.js";
import { t as K } from "./FileTypeIcon.js";
import { t as Q } from "./copy.js";
import { t as W } from "./list.js";
import { t as X } from "./Avatar.js";
import { n as Z, t as ee } from "./thumbs-up.js";
import { t as U } from "./dist.js";
import { t as o } from "./utils.js";
import { t as se } from "./create-safe-context.js";
import { t as te } from "./interaction-context.js";
import { t as ae } from "./markdown-renderer.js";
import { t as re } from "./AITypingIndicator.js";
var d = /* @__PURE__ */ O(Y(), 1), e = G(), ne = U("flex items-start w-full", {
  variants: { type: {
    received: "justify-start",
    sent: "justify-end"
  } },
  defaultVariants: { type: "received" }
}), ie = U("flex flex-col gap-1 overflow-hidden px-4 py-3 rounded-2xl max-w-[720px] min-w-[100px]", {
  variants: { type: {
    received: "bg-muted",
    sent: "bg-[var(--sent-bubble)] text-primary-foreground"
  } },
  defaultVariants: { type: "received" }
}), [p, ye] = se("AIMessage");
function y({ children: s, className: a }) {
  const t = d.useContext(p)?.type ?? "received";
  return /* @__PURE__ */ (0, e.jsx)("div", {
    "data-slot": "ai-message-bubble",
    "data-message-type": t,
    className: o(ie({ type: t }), a),
    children: s
  });
}
y.displayName = "AIMessage.Bubble";
function h({ icon: s, onClick: a, active: t, count: r, label: n, className: i }) {
  return /* @__PURE__ */ (0, e.jsxs)("button", {
    type: "button",
    onClick: a,
    "aria-label": n,
    "aria-pressed": t,
    className: o("flex items-center justify-center gap-1 px-2.5 py-2 min-w-11 min-h-11 rounded-full bg-muted hover:bg-accent delight-click-ripple transition-all duration-150 ease-out hover:scale-110 active:scale-95 motion-reduce:hover:scale-100 motion-reduce:active:scale-100 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring", t && "bg-primary/10 text-primary delight-check-bounce motion-reduce:!animate-none", i),
    children: [s, r !== void 0 && r > 0 && /* @__PURE__ */ (0, e.jsx)("span", {
      className: "text-xs font-medium text-muted-foreground",
      children: r
    })]
  });
}
function A({ reactions: s, onReactionClick: a, className: t }) {
  return s?.length ? /* @__PURE__ */ (0, e.jsx)("div", {
    "data-slot": "ai-message-reactions",
    className: o("flex items-center gap-1", t),
    children: s.map((r) => /* @__PURE__ */ (0, e.jsxs)("button", {
      type: "button",
      onClick: () => a?.(r.emoji),
      "aria-label": `React with ${r.emoji}${r.count > 1 ? `, ${r.count} reactions` : ""}`,
      "aria-pressed": r.reacted,
      className: o("flex items-center gap-1 px-2.5 py-1.5 min-h-11 rounded-full bg-muted hover:bg-accent text-sm transition-colors focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring", r.reacted && "bg-primary/10"),
      children: [/* @__PURE__ */ (0, e.jsx)("span", {
        "aria-hidden": "true",
        children: r.emoji
      }), r.count > 1 && /* @__PURE__ */ (0, e.jsx)("span", {
        className: "text-xs text-muted-foreground",
        children: r.count
      })]
    }, r.emoji))
  }) : null;
}
A.displayName = "AIMessage.Reactions";
function N({ onClick: s, active: a, className: t }) {
  return /* @__PURE__ */ (0, e.jsx)(h, {
    icon: /* @__PURE__ */ (0, e.jsx)(ee, {
      className: "size-4 text-quaternary-foreground",
      "aria-hidden": "true"
    }),
    onClick: s,
    active: a,
    label: "Thumbs up",
    className: t
  });
}
N.displayName = "AIMessage.ThumbsUp";
function I({ onClick: s, active: a, className: t }) {
  return /* @__PURE__ */ (0, e.jsx)(h, {
    icon: /* @__PURE__ */ (0, e.jsx)(Z, {
      className: "size-4 text-quaternary-foreground",
      "aria-hidden": "true"
    }),
    onClick: s,
    active: a,
    label: "Thumbs down",
    className: t
  });
}
I.displayName = "AIMessage.ThumbsDown";
function M({ onClick: s, className: a }) {
  const [t, r] = d.useState(!1), n = d.useRef(void 0);
  d.useEffect(() => () => clearTimeout(n.current), []);
  const i = d.useCallback(() => {
    s?.(), r(!0), clearTimeout(n.current), n.current = setTimeout(() => r(!1), 2e3);
  }, [s]);
  return /* @__PURE__ */ (0, e.jsx)(h, {
    icon: t ? /* @__PURE__ */ (0, e.jsx)(J, {
      className: "size-4 text-success delight-bounce-in motion-reduce:animate-none",
      "aria-hidden": "true"
    }) : /* @__PURE__ */ (0, e.jsx)(Q, {
      className: "size-4 text-secondary-foreground",
      "aria-hidden": "true"
    }),
    onClick: i,
    label: t ? "Copied to clipboard" : "Copy message",
    className: a
  });
}
M.displayName = "AIMessage.CopyButton";
function w({ onClick: s, className: a }) {
  return /* @__PURE__ */ (0, e.jsx)(h, {
    icon: /* @__PURE__ */ (0, e.jsx)(W, {
      className: "size-4 text-secondary-foreground",
      "aria-hidden": "true"
    }),
    onClick: s,
    label: "Show list",
    className: a
  });
}
w.displayName = "AIMessage.ListButton";
function C({ children: s, className: a }) {
  const t = d.useContext(p);
  return /* @__PURE__ */ (0, e.jsx)("div", {
    "data-slot": "ai-message-actions",
    role: "toolbar",
    "aria-label": "Message actions",
    className: o("flex items-center gap-0.5 rounded-full overflow-hidden", a),
    children: s ?? (t && /* @__PURE__ */ (0, e.jsxs)(e.Fragment, { children: [
      /* @__PURE__ */ (0, e.jsx)(N, {
        onClick: t.onThumbsUp,
        active: t.thumbsUpActive
      }),
      /* @__PURE__ */ (0, e.jsx)(I, {
        onClick: t.onThumbsDown,
        active: t.thumbsDownActive
      }),
      /* @__PURE__ */ (0, e.jsx)(M, { onClick: t.onCopy }),
      /* @__PURE__ */ (0, e.jsx)(w, { onClick: t.onShowList })
    ] }))
  });
}
C.displayName = "AIMessage.Actions";
function k({ className: s }) {
  return /* @__PURE__ */ (0, e.jsx)("div", {
    "data-slot": "ai-message-typing-indicator",
    className: o("flex items-center gap-1 motion-reduce:animate-none", s),
    children: /* @__PURE__ */ (0, e.jsx)(re, {
      size: "sm",
      color: "var(--muted-foreground)"
    })
  });
}
k.displayName = "AIMessage.TypingIndicator";
function T({ attachment: s, messageType: a = "received", onClick: t, className: r }) {
  const i = (() => {
    if (s.extension) return s.extension;
    const l = s.name.split(".");
    return l.length > 1 ? l[l.length - 1] : "";
  })(), c = a === "sent" ? "bg-primary/10 border border-primary-foreground/20 rounded-2xl" : "bg-muted rounded-2xl";
  return /* @__PURE__ */ (0, e.jsxs)("button", {
    type: "button",
    "data-slot": "ai-message-attachment-preview",
    onClick: t,
    "aria-label": `Attachment: ${s.name}, ${s.size}`,
    className: o("flex items-center gap-3 p-3 min-h-11 hover:bg-accent transition-colors w-full max-w-[320px] focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring", c, r),
    children: [s.thumbnailUrl ? /* @__PURE__ */ (0, e.jsx)("img", {
      src: s.thumbnailUrl,
      alt: s.name,
      className: "size-10 rounded-md object-cover"
    }) : /* @__PURE__ */ (0, e.jsx)(K, {
      extension: i,
      size: "md",
      className: "shrink-0"
    }), /* @__PURE__ */ (0, e.jsxs)("div", {
      className: "flex flex-col items-start min-w-0",
      children: [/* @__PURE__ */ (0, e.jsx)("span", {
        className: "text-sm font-medium text-secondary-foreground truncate w-full",
        children: s.name
      }), /* @__PURE__ */ (0, e.jsx)("span", {
        className: "text-sm text-muted-foreground",
        children: s.size
      })]
    })]
  });
}
T.displayName = "AIMessage.AttachmentPreview";
function R({ attachments: s, messageType: a = "received", onAttachmentClick: t, className: r }) {
  return s?.length ? /* @__PURE__ */ (0, e.jsx)("div", {
    "data-slot": "ai-message-attachments",
    className: o("flex flex-col gap-2 mt-1", r),
    children: s.map((n) => /* @__PURE__ */ (0, e.jsx)(T, {
      attachment: n,
      messageType: a,
      onClick: () => t?.(n)
    }, n.id))
  }) : null;
}
R.displayName = "AIMessage.Attachments";
function z({ isAgent: s, ...a }) {
  return /* @__PURE__ */ (0, e.jsx)(X, {
    "data-slot": "ai-message-avatar",
    ...a,
    size: "md",
    indicator: s ? "verified" : a.indicator
  });
}
z.displayName = "AIMessage.Avatar";
function B({ children: s, content: a, markdown: t, onInteraction: r, className: n }) {
  const i = d.useContext(p)?.type ?? "received", c = i === "sent", l = t ?? i === "received", u = a ?? (typeof s == "string" ? s : ""), m = c ? "inverted" : "default";
  return /* @__PURE__ */ (0, e.jsx)("div", {
    "data-slot": "ai-message-content",
    className: o("w-full", n),
    children: l && u ? /* @__PURE__ */ (0, e.jsx)(te, {
      onInteraction: r,
      children: /* @__PURE__ */ (0, e.jsx)(ae, {
        variant: m,
        className: o("text-base", c ? "text-primary-foreground" : "text-foreground"),
        children: u
      })
    }) : u ? /* @__PURE__ */ (0, e.jsx)("p", {
      className: o("text-base whitespace-pre-wrap", c ? "text-primary-foreground" : "text-foreground"),
      children: u
    }) : s
  });
}
B.displayName = "AIMessage.Content";
function _({ senderName: s, timestamp: a, avatar: t, className: r }) {
  const n = d.useContext(p), i = n?.type === "sent";
  return n?.compact ?? !1 ? null : /* @__PURE__ */ (0, e.jsxs)("div", {
    "data-slot": "ai-message-header",
    className: o("flex items-center justify-between w-full", r),
    children: [/* @__PURE__ */ (0, e.jsxs)("div", {
      className: "flex items-center gap-2 min-w-0 flex-1",
      children: [t && /* @__PURE__ */ (0, e.jsx)("div", {
        className: "shrink-0",
        children: t
      }), /* @__PURE__ */ (0, e.jsx)("span", {
        className: o("text-sm font-medium truncate", i ? "text-primary-foreground" : "text-secondary-foreground"),
        children: i ? "You" : s
      })]
    }), a && /* @__PURE__ */ (0, e.jsx)("span", {
      className: o("text-xs shrink-0", i ? "text-primary-foreground/90" : "text-muted-foreground"),
      children: a
    })]
  });
}
_.displayName = "AIMessage.Header";
var S = (0, d.forwardRef)(({ type: s = "received", isAgent: a = !1, compact: t = !1, isTyping: r = !1, onThumbsUp: n, onThumbsDown: i, onCopy: c, onShowList: l, thumbsUpActive: u, thumbsDownActive: m, children: f, className: x, ...b }, v) => {
  const g = s === "sent", j = d.useMemo(() => ({
    type: s,
    isAgent: a,
    compact: t,
    isTyping: r,
    onThumbsUp: n,
    onThumbsDown: i,
    onCopy: c,
    onShowList: l,
    thumbsUpActive: u,
    thumbsDownActive: m
  }), [
    s,
    a,
    t,
    r,
    n,
    i,
    c,
    l,
    u,
    m
  ]);
  return /* @__PURE__ */ (0, e.jsx)(p.Provider, {
    value: j,
    children: /* @__PURE__ */ (0, e.jsx)("div", {
      ref: v,
      "data-slot": "ai-message",
      className: o(ne({ type: s }), g ? "pe-2" : "ps-0", g ? "delight-slide-in-end" : "delight-slide-up", x),
      ...b,
      children: /* @__PURE__ */ (0, e.jsx)("div", {
        className: o("flex flex-col gap-1.5 items-start", g && "items-end"),
        children: f
      })
    })
  });
});
S.displayName = "AIMessage.Root";
var V = (0, d.forwardRef)(({ type: s = "received", content: a, senderName: t, timestamp: r, avatar: n, isAgent: i = !1, compact: c = !1, isTyping: l = !1, markdown: u, onInteraction: m, attachments: f, reactions: x, showActions: b = !1, onThumbsUp: v, onThumbsDown: g, onCopy: j, onShowList: D, onReactionClick: E, onAttachmentClick: P, thumbsUpActive: $, thumbsDownActive: q, className: L, ...H }, F) => /* @__PURE__ */ (0, e.jsxs)(S, {
  ref: F,
  type: s,
  isAgent: i,
  compact: c,
  isTyping: l,
  onThumbsUp: v,
  onThumbsDown: g,
  onCopy: j,
  onShowList: D,
  thumbsUpActive: $,
  thumbsDownActive: q,
  className: L,
  ...H,
  children: [
    s !== "sent" && !c && n && (d.isValidElement(n) ? n : /* @__PURE__ */ (0, e.jsx)(z, {
      ...n,
      isAgent: i
    })),
    /* @__PURE__ */ (0, e.jsxs)(y, { children: [s !== "sent" && /* @__PURE__ */ (0, e.jsx)(_, {
      senderName: t,
      timestamp: r
    }), l ? /* @__PURE__ */ (0, e.jsx)(k, {}) : a && /* @__PURE__ */ (0, e.jsx)(B, {
      content: a,
      markdown: u,
      onInteraction: m
    })] }),
    !l && f && f.length > 0 && /* @__PURE__ */ (0, e.jsx)(R, {
      attachments: f,
      messageType: s ?? "received",
      onAttachmentClick: P
    }),
    !l && (b || x?.length) && /* @__PURE__ */ (0, e.jsxs)("div", {
      className: "flex items-center gap-1",
      children: [b && i && /* @__PURE__ */ (0, e.jsx)(C, {}), x && x.length > 0 && /* @__PURE__ */ (0, e.jsx)(A, {
        reactions: x,
        onReactionClick: E
      })]
    })
  ]
}));
V.displayName = "AIMessage";
var Ae = Object.assign(V, {
  Root: S,
  Bubble: y,
  Header: _,
  Avatar: z,
  Content: B,
  Actions: C,
  Reactions: A,
  Attachments: R,
  AttachmentPreview: T,
  TypingIndicator: k,
  CopyButton: M,
  ThumbsUp: N,
  ThumbsDown: I,
  ListButton: w
});
export {
  Ae as t
};

//# sourceMappingURL=AIMessage.js.map