@automattic/agenttic-ui 0.1.75 → 0.1.77

package/dist/DiffCard-WlOKTIaG.js

@@ -0,0 +1,1325 @@
+import { jsx as e, jsxs as p, Fragment as Y } from "react/jsx-runtime";
+import { __ as w } from "@wordpress/i18n";
+import * as it from "react";
+import k, { createContext as pt, useContext as ht, useState as ft, useEffect as tt, useId as gt, useCallback as et, useRef as bt, useMemo as st } from "react";
+import { AnimatePresence as lt, motion as W } from "framer-motion";
+import { Slot as Ct } from "@radix-ui/react-slot";
+import * as O from "@radix-ui/react-popover";
+import vt from "react-markdown";
+import './DiffCard.css';function v(...t) {
+  return t.flat().filter(Boolean).map((n) => typeof n == "string" ? n : typeof n == "object" && !Array.isArray(n) && n !== null ? Object.entries(n).filter(([o, a]) => a).map(([o]) => o).join(" ") : "").join(" ").trim();
+}
+const J = {
+  type: "spring",
+  stiffness: 300,
+  damping: 30
+}, U = {
+  type: "spring",
+  damping: 40,
+  stiffness: 500,
+  mass: 0.8
+}, Q = {
+  ...U,
+  stiffness: 1e3,
+  damping: 90
+}, wt = {
+  type: "spring",
+  damping: 40,
+  stiffness: 500,
+  mass: 0.8
+}, yt = {
+  hidden: {
+    opacity: 0
+  },
+  visible: {
+    opacity: 1,
+    transition: J
+  },
+  exit: {
+    opacity: 0,
+    transition: { ...J, duration: 0.1 }
+  }
+}, _t = () => {
+  if (typeof window > "u")
+    return { left: 0, right: 0, top: 0, bottom: 0 };
+  const t = 20;
+  return {
+    left: t,
+    right: window.innerWidth - 400 - t,
+    // Assuming max width of 400px
+    top: t,
+    bottom: window.innerHeight - 60 - t
+    // Assuming collapsed height of 60px
+  };
+}, Nt = {
+  "0%": { backgroundPosition: "-200% 0" },
+  "100%": { backgroundPosition: "200% 0" }
+}, wn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  fadeVariants: yt,
+  fastSpring: U,
+  fastSpringWithDelay: Q,
+  getDragConstraints: _t,
+  morphSpring: wt,
+  springConfig: J,
+  thinkingGradientKeyframes: Nt
+}, Symbol.toStringTag, { value: "Module" })), rt = pt(null);
+function Z() {
+  const t = ht(rt);
+  if (!t)
+    throw new Error(
+      "useAgentUIContext must be used within an AgentUIContainer"
+    );
+  return t;
+}
+function yn({ children: t, value: n }) {
+  return /* @__PURE__ */ e(rt.Provider, { value: n, children: t });
+}
+const xt = "button-module_button", It = "button-module_pressed", St = "button-module_primary", $t = "button-module_ghost", Lt = "button-module_outline", kt = "button-module_transparent", Dt = "button-module_link", At = "button-module_icon", Rt = "button-module_sm", Bt = "button-module_lg", Wt = "button-module_withTextAndIcon", T = {
+  button: xt,
+  pressed: It,
+  primary: St,
+  ghost: $t,
+  outline: Lt,
+  transparent: kt,
+  link: Dt,
+  icon: At,
+  sm: Rt,
+  lg: Bt,
+  withTextAndIcon: Wt
+}, D = it.forwardRef(
+  function({
+    className: n,
+    variant: o = "primary",
+    size: a,
+    icon: i,
+    children: s,
+    asChild: r = !1,
+    pressed: f,
+    ...g
+  }, d) {
+    const u = r ? Ct : "button", c = !!i, b = a || (c && !s ? "icon" : void 0);
+    return /* @__PURE__ */ p(
+      u,
+      {
+        ref: d,
+        "data-slot": "button",
+        className: v(
+          T.button,
+          T[o],
+          b && T[b],
+          c && s ? T.withTextAndIcon : void 0,
+          f ? T.pressed : void 0,
+          n
+        ),
+        "aria-pressed": f,
+        ...g,
+        children: [
+          i,
+          s
+        ]
+      }
+    );
+  }
+);
+D.displayName = "Button";
+const Mt = "Textarea-module_textarea", jt = {
+  textarea: Mt
+}, ct = it.forwardRef(
+  ({ className: t, ...n }, o) => /* @__PURE__ */ e(
+    "textarea",
+    {
+      "data-slot": "textarea",
+      className: jt.textarea,
+      ref: o,
+      ...n
+    }
+  )
+);
+ct.displayName = "Textarea";
+function Et({ className: t, size: n = 24 }) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: n,
+      height: n,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: t,
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M12.2197 5C12.4186 5 12.6094 5.07902 12.75 5.21967L17 9.46967C17.2929 9.76256 17.2929 10.2374 17 10.5303C16.7071 10.8232 16.2322 10.8232 15.9393 10.5303L12.9697 7.56067V18.25C12.9697 18.6642 12.6339 19 12.2197 19C11.8055 19 11.4697 18.6642 11.4697 18.25V7.56065L8.5 10.5303C8.2071 10.8232 7.73223 10.8232 7.43934 10.5303C7.14644 10.2374 7.14645 9.76256 7.43934 9.46967L11.6894 5.21967C11.83 5.07902 12.0208 5 12.2197 5Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+}
+function Pt({ className: t, size: n = 24 }) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: n,
+      height: n,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: t,
+      children: /* @__PURE__ */ e(
+        "rect",
+        {
+          x: "7",
+          y: "7",
+          width: "10",
+          height: "10",
+          rx: "2",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+}
+const Vt = "ChatInput-module_container", Ht = "ChatInput-module_textareaContainer", Tt = "ChatInput-module_actions", Ut = "ChatInput-module_containerStacked", Zt = "ChatInput-module_button", Ot = "ChatInput-module_actionWrapper", Qt = "ChatInput-module_actionWrapperDisabled", I = {
+  container: Vt,
+  textareaContainer: Ht,
+  actions: Tt,
+  containerStacked: Ut,
+  button: Zt,
+  actionWrapper: Ot,
+  actionWrapperDisabled: Qt
+};
+function Ft({ className: t, size: n = 24 }) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      className: t,
+      width: n,
+      height: n,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M18.0045 13.4451L12 7.9864L5.9955 13.4451L7.00451 14.5549L12 10.0136L16.9955 14.5549L18.0045 13.4451Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+}
+const Gt = "AnimatedPlaceholder-module_container", qt = {
+  container: Gt
+};
+function Kt({
+  texts: t,
+  interval: n = 3e3,
+  className: o = ""
+}) {
+  const [a, i] = ft(0);
+  return tt(() => {
+    const s = setInterval(() => {
+      i(
+        (r) => (r + 1) % t.length
+      );
+    }, n);
+    return () => clearInterval(s);
+  }, [t.length, n]), /* @__PURE__ */ e(lt, { mode: "wait", children: /* @__PURE__ */ e(
+    W.span,
+    {
+      "data-slot": "animated-placeholder",
+      className: v(qt.container, o),
+      initial: { opacity: 0, y: 8 },
+      animate: { opacity: 1, y: 0 },
+      exit: { opacity: 0, y: -8 },
+      transition: {
+        duration: 0.3,
+        ease: [0.4, 0, 0.2, 1]
+        // Matches --transition-colors cubic-bezier
+      },
+      children: t[a]
+    },
+    a
+  ) });
+}
+function Xt({
+  value: t,
+  onChange: n,
+  onSubmit: o,
+  onKeyDown: a,
+  textareaRef: i,
+  placeholder: s = w("Ask anything", "a8c-agenttic"),
+  isProcessing: r,
+  onBlur: f,
+  onFocus: g,
+  onClick: d,
+  fromCompact: u = !1,
+  onExpand: c,
+  showExpandButton: b = !0,
+  focusOnMount: m = !1,
+  customActions: N = [],
+  actionOrder: y = "before-submit",
+  onStop: x,
+  disabled: A,
+  readOnly: h,
+  onMouseEnter: R,
+  onMouseLeave: $,
+  expandOnClick: P = !1,
+  layout: F = "inline"
+}) {
+  const G = gt(), { variant: q, floatingChatState: nt, isInputOverLimit: M } = Z(), j = (
+    // If the consumer actively sets `disabled` to `false` (vs undefined), that takes precedence.
+    A !== void 0 ? !A : (t.trim() || r) && !M
+  ), dt = et(
+    (l) => {
+      const H = l.key.toLowerCase();
+      if (H === "enter" && !l.shiftKey && (l.nativeEvent.isComposing || l.keyCode === 229)) {
+        l.preventDefault();
+        return;
+      }
+      if (H === "enter" && !l.shiftKey && !j) {
+        l.preventDefault();
+        return;
+      }
+      if (h && H === "enter" && !l.shiftKey) {
+        l.preventDefault();
+        return;
+      }
+      ((l.metaKey || l.ctrlKey) && H === "z" || l.ctrlKey && H === "y") && l.stopPropagation(), a(l);
+    },
+    [j, a, h]
+  ), ot = (l) => l.endsWith("…") ? l : `${l}…`, K = Array.isArray(s);
+  let V;
+  K ? V = s.map(ot) : s ? V = ot(s) : V = "";
+  const X = bt(m);
+  tt(() => {
+    X.current && i.current && i.current.focus(), X.current = !1;
+  }, [X, i]);
+  const at = () => N.map((l) => /* @__PURE__ */ e(
+    "span",
+    {
+      className: v(I.actionWrapper, {
+        [I.actionWrapperDisabled]: l.disabled
+      }),
+      children: /* @__PURE__ */ e(
+        D,
+        {
+          className: l.className || I.button,
+          onClick: l.onClick,
+          disabled: l.disabled,
+          variant: l.variant || "ghost",
+          icon: l.icon,
+          "aria-label": l["aria-label"]
+        }
+      )
+    },
+    l.id
+  )), ut = () => q === "embedded" || nt === "expanded" || P ? null : b && c ? /* @__PURE__ */ e(
+    D,
+    {
+      className: I.button,
+      onClick: c,
+      variant: "ghost",
+      icon: /* @__PURE__ */ e(Ft, {}),
+      "aria-label": w("Expand conversation", "a8c-agenttic")
+    }
+  ) : null, mt = () => {
+    if (r && !x)
+      return null;
+    const l = () => {
+      r && x ? x() : o();
+    };
+    return /* @__PURE__ */ e(
+      D,
+      {
+        className: I.button,
+        onClick: l,
+        disabled: !j,
+        variant: "primary",
+        icon: r ? /* @__PURE__ */ e(Pt, {}) : /* @__PURE__ */ e(Et, {}),
+        "aria-label": r ? w("Stop processing", "a8c-agenttic") : w("Send message", "a8c-agenttic")
+      }
+    );
+  };
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      "data-slot": "chat-input",
+      className: `${I.container}${F === "stacked" ? ` ${I.containerStacked}` : ""}`,
+      onMouseEnter: R,
+      onMouseLeave: $,
+      children: [
+        /* @__PURE__ */ p(
+          W.div,
+          {
+            className: I.textareaContainer,
+            initial: {
+              opacity: 0
+            },
+            animate: {
+              opacity: 1,
+              scale: 1,
+              transition: t.trim() ? { duration: 0 } : Q
+            },
+            children: [
+              !t && K && /* @__PURE__ */ e(
+                Kt,
+                {
+                  texts: V
+                }
+              ),
+              /* @__PURE__ */ e(
+                ct,
+                {
+                  id: G,
+                  ref: i,
+                  value: t,
+                  readOnly: h,
+                  onChange: (l) => n(l.target.value),
+                  onKeyDown: dt,
+                  onBlur: f,
+                  onFocus: g,
+                  onClick: d,
+                  placeholder: K ? "" : V,
+                  rows: 1,
+                  "aria-label": w("Chat input", "a8c-agenttic")
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ p(
+          W.div,
+          {
+            className: I.actions,
+            initial: {
+              opacity: u ? 1 : 0,
+              scale: u ? 1 : 0.5
+            },
+            animate: {
+              opacity: 1,
+              scale: 1,
+              transition: t.trim() ? { duration: 0 } : U
+            },
+            children: [
+              ut(),
+              y === "before-submit" && at(),
+              mt(),
+              y === "after-submit" && at()
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function Yt({ className: t, size: n = 24 }) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      className: t,
+      width: n,
+      height: n,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M18.0045 10.5549L12 16.0136L5.9955 10.5549L7.00451 9.44504L12 13.9864L16.9955 9.44504L18.0045 10.5549Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+}
+const Jt = "SuggestionDropdown-module_container", zt = "SuggestionDropdown-module_labelRow", te = "SuggestionDropdown-module_chevron", ee = "SuggestionDropdown-module_chevronOpen", ne = "SuggestionDropdown-module_dropdown", oe = "SuggestionDropdown-module_option", E = {
+  container: Jt,
+  labelRow: zt,
+  chevron: te,
+  chevronOpen: ee,
+  dropdown: ne,
+  option: oe
+}, ae = "Suggestions-module_container", ie = "Suggestions-module_vertical", se = "Suggestions-module_button", le = "Suggestions-module_label", re = "Suggestions-module_description", ce = "Suggestions-module_floating", _ = {
+  container: ae,
+  vertical: ie,
+  button: se,
+  "suggestion-content--with-description": "Suggestions-module_suggestion-content--with-description",
+  label: le,
+  description: re,
+  floating: ce
+}, de = (t, n) => !t || !n ? `${t}${n}` : /\s$/.test(t) || /^\s/.test(n) ? `${t}${n}` : `${t} ${n}`, ue = ({
+  suggestion: t,
+  onSelect: n,
+  availableSuggestions: o,
+  onOpenChange: a,
+  showDescription: i
+}) => {
+  var A;
+  const [s, r] = k.useState(!1), f = k.useRef(null), [g, d] = k.useState(null), [u, c] = k.useState(null), [b, m] = k.useState(void 0), N = k.useCallback(
+    (h) => {
+      if (f.current = h, !h) {
+        d(null), c(null);
+        return;
+      }
+      d(
+        h.closest(".agenttic") ?? h
+      ), c(
+        h.closest(
+          '[data-slot="conversation-view"]'
+        ) ?? null
+      );
+    },
+    []
+  ), y = k.useCallback(
+    (h) => {
+      var R;
+      if (h) {
+        const $ = (R = f.current) == null ? void 0 : R.closest(
+          '[data-slot="suggestions"]'
+        );
+        $ && m($.clientWidth * 0.9);
+      }
+      r(h), a == null || a(h);
+    },
+    [a]
+  ), x = (h) => {
+    const { options: R, ...$ } = t, P = {
+      ...$,
+      prompt: de(
+        t.prompt ?? t.label,
+        h.value
+      ),
+      label: `${t.label} ${h.label}`
+    };
+    n == null || n(P, o), y(!1);
+  };
+  return /* @__PURE__ */ e("div", { ref: N, className: E.container, children: /* @__PURE__ */ p(O.Root, { open: s, onOpenChange: y, children: [
+    /* @__PURE__ */ e(O.Trigger, { asChild: !0, children: /* @__PURE__ */ e(
+      D,
+      {
+        variant: "outline",
+        className: _.button,
+        children: /* @__PURE__ */ p(
+          "div",
+          {
+            className: v(
+              _["suggestion-content"],
+              i ? _["suggestion-content--with-description"] : ""
+            ),
+            children: [
+              /* @__PURE__ */ p("span", { className: E.labelRow, children: [
+                /* @__PURE__ */ e("span", { className: _.label, children: t.label }),
+                /* @__PURE__ */ e(
+                  Yt,
+                  {
+                    size: 14,
+                    className: `${E.chevron} ${s ? E.chevronOpen : ""}`
+                  }
+                )
+              ] }),
+              i && t.description && /* @__PURE__ */ e(
+                "span",
+                {
+                  className: _.description,
+                  children: t.description
+                }
+              )
+            ]
+          }
+        )
+      }
+    ) }),
+    g && /* @__PURE__ */ e(O.Portal, { container: g, children: /* @__PURE__ */ e(
+      O.Content,
+      {
+        className: E.dropdown,
+        side: "top",
+        align: "start",
+        sideOffset: 4,
+        collisionBoundary: u,
+        "aria-label": t.label,
+        style: b ? { width: b } : void 0,
+        children: (A = t.options) == null ? void 0 : A.map((h) => /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            "data-slot": "suggestion-option",
+            className: E.option,
+            onClick: () => x(h),
+            children: h.label
+          },
+          h.id
+        ))
+      }
+    ) })
+  ] }) });
+}, me = ({
+  className: t,
+  suggestions: n,
+  onSubmit: o,
+  layout: a = "horizontal",
+  visible: i = !0,
+  onMouseEnter: s,
+  onMouseLeave: r,
+  onDropdownOpenChange: f,
+  translateY: g = "-100%"
+}) => {
+  const { variant: d, reportSuggestionsRendered: u } = Z(), c = st(
+    () => d === "floating" ? n == null ? void 0 : n.slice(0, 3) : n,
+    [n, d]
+  );
+  tt(() => {
+    i && (c != null && c.length) && (u == null || u(c));
+  }, [i, c, u]);
+  const b = async (m, N) => {
+    let y = !0;
+    m.action && (y = await m.action()), y && o && m.prompt && o(m, N);
+  };
+  return !c || c.length === 0 ? null : /* @__PURE__ */ e(lt, { children: i && /* @__PURE__ */ e(
+    W.div,
+    {
+      "data-slot": "suggestions",
+      className: v(
+        _.container,
+        a === "vertical" ? _.vertical : a === "floating" ? _.floating : "",
+        t
+      ),
+      initial: { opacity: 0, y: "-80%" },
+      animate: { opacity: 1, y: g },
+      exit: { opacity: 0, y: "-80%" },
+      transition: Q,
+      onMouseEnter: s,
+      onMouseLeave: r,
+      children: c.map(
+        (m, N) => {
+          const y = !!m.description && a !== "horizontal";
+          return /* @__PURE__ */ e(
+            W.div,
+            {
+              initial: { opacity: 0, y: 10 },
+              animate: { opacity: 1, y: 0 },
+              exit: { opacity: 0, y: 10 },
+              transition: {
+                ...Q,
+                delay: N * 0.05
+              },
+              children: m.options && m.options.length > 0 ? /* @__PURE__ */ e(
+                ue,
+                {
+                  suggestion: m,
+                  onSelect: b,
+                  availableSuggestions: c,
+                  onOpenChange: f,
+                  showDescription: y
+                }
+              ) : /* @__PURE__ */ e(
+                D,
+                {
+                  onClick: (x) => {
+                    x.stopPropagation(), b(
+                      m,
+                      c
+                    );
+                  },
+                  variant: "outline",
+                  className: _.button,
+                  children: /* @__PURE__ */ p(
+                    "div",
+                    {
+                      className: v(
+                        _["suggestion-content"],
+                        y ? _["suggestion-content--with-description"] : ""
+                      ),
+                      children: [
+                        /* @__PURE__ */ e(
+                          "span",
+                          {
+                            className: _.label,
+                            children: m.label
+                          }
+                        ),
+                        y && /* @__PURE__ */ e(
+                          "span",
+                          {
+                            className: _.description,
+                            children: m.description
+                          }
+                        )
+                      ]
+                    }
+                  )
+                }
+              )
+            },
+            m.id
+          );
+        }
+      )
+    }
+  ) });
+};
+function pe({ className: t, size: n = 24 }) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      className: t,
+      width: n,
+      height: n,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M12.0001 13.0607L16.4697 17.5304L17.5304 16.4697L13.0607 12.0001L17.5304 7.53039L16.4697 6.46973L12.0001 10.9394L7.5304 6.46973L6.46973 7.53039L10.9394 12.0001L6.46974 16.4697L7.5304 17.5304L12.0001 13.0607Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+}
+const he = "SourcesCard-module_card", fe = "SourcesCard-module_heading", ge = "SourcesCard-module_list", be = "SourcesCard-module_item", Ce = "SourcesCard-module_title", ve = "SourcesCard-module_label", B = {
+  card: he,
+  heading: fe,
+  list: ge,
+  item: be,
+  title: Ce,
+  label: ve
+};
+function _n({ sources: t, className: n }) {
+  return t != null && t.length ? /* @__PURE__ */ p(
+    "section",
+    {
+      className: v(B.card, n),
+      "data-agenttic-sources-card": !0,
+      "data-slot": "sources",
+      children: [
+        /* @__PURE__ */ e("p", { className: B.heading, "data-slot": "heading", children: w("Sources", "a8c-agenttic") }),
+        /* @__PURE__ */ e("ul", { className: B.list, "data-slot": "list", children: t.map((o, a) => {
+          const i = o.title || o.url || o.label || w("Untitled source", "a8c-agenttic"), s = o.id || o.url || `${i}-${a}`;
+          return /* @__PURE__ */ p(
+            "li",
+            {
+              className: B.item,
+              "data-slot": "source",
+              children: [
+                o.url ? /* @__PURE__ */ e(
+                  "a",
+                  {
+                    className: B.title,
+                    "data-slot": "title",
+                    href: o.url,
+                    target: "_blank",
+                    rel: "noopener noreferrer",
+                    children: i
+                  }
+                ) : /* @__PURE__ */ e(
+                  "span",
+                  {
+                    className: B.title,
+                    "data-slot": "title",
+                    children: i
+                  }
+                ),
+                o.label ? /* @__PURE__ */ e(
+                  "span",
+                  {
+                    className: B.label,
+                    "data-slot": "label",
+                    children: o.label
+                  }
+                ) : null
+              ]
+            },
+            s
+          );
+        }) })
+      ]
+    }
+  ) : null;
+}
+function we({ className: t, size: n = 24 }) {
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: n,
+      height: n,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: t,
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M12 5C12.4142 5 12.75 5.33579 12.75 5.75V11.25H18.25C18.6642 11.25 19 11.5858 19 12C19 12.4142 18.6642 12.75 18.25 12.75H12.75V18.25C12.75 18.6642 12.4142 19 12 19C11.5858 19 11.25 18.6642 11.25 18.25V12.75H5.75C5.33579 12.75 5 12.4142 5 12C5 11.5858 5.33579 11.25 5.75 11.25H11.25V5.75C11.25 5.33579 11.5858 5 12 5Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+}
+function ye({
+  className: t,
+  disabled: n,
+  readOnly: o,
+  customActions: a,
+  actionOrder: i,
+  onKeyDown: s,
+  layout: r,
+  imageUploaderRef: f,
+  imageUploadDisabled: g
+} = {}) {
+  const {
+    inputValue: d,
+    setInputValue: u,
+    handleSubmit: c,
+    handleKeyDown: b,
+    textareaRef: m,
+    placeholder: N,
+    isProcessing: y,
+    onStop: x,
+    fromCompact: A,
+    onExpand: h,
+    showExpandButton: R,
+    focusOnMount: $,
+    onInputFocus: P,
+    onInputBlur: F
+  } = Z(), G = (M) => {
+    s == null || s(M), !M.defaultPrevented && b(M);
+  }, q = st(() => f ? [{
+    id: "image-upload",
+    icon: /* @__PURE__ */ e(we, {}),
+    onClick: () => {
+      var j;
+      return (j = f.current) == null ? void 0 : j.openFileDialog();
+    },
+    variant: "ghost",
+    disabled: g,
+    "aria-label": w("Upload image", "a8c-agenttic")
+  }, ...a || []] : a, [f, a, g]);
+  return /* @__PURE__ */ e(
+    Xt,
+    {
+      value: d,
+      onChange: u,
+      onSubmit: c,
+      onKeyDown: G,
+      onFocus: P,
+      onBlur: F,
+      textareaRef: m,
+      placeholder: N,
+      isProcessing: y,
+      onStop: x,
+      fromCompact: A,
+      onExpand: h,
+      showExpandButton: R,
+      focusOnMount: $,
+      disabled: n,
+      readOnly: o,
+      customActions: q,
+      actionOrder: i,
+      className: t,
+      layout: r ?? (f ? "stacked" : "inline")
+    }
+  );
+}
+function _e({
+  className: t,
+  showSuggestions: n,
+  onSelect: o
+} = {}) {
+  const {
+    suggestions: a,
+    handleSuggestionSubmit: i,
+    inputValue: s,
+    messages: r,
+    variant: f,
+    emptyView: g
+  } = Z(), d = et(
+    (u, c) => {
+      try {
+        const b = u.prompt ?? u.label;
+        o == null || o(b);
+      } catch (b) {
+        console.warn("Suggestions onSelect callback failed:", b);
+      }
+      i(u, c);
+    },
+    [o, i]
+  );
+  return s && !n || g && ["floating", "embedded"].includes(f) && r.length === 0 && !s ? null : /* @__PURE__ */ e(
+    me,
+    {
+      suggestions: a,
+      onSubmit: d,
+      className: t
+    }
+  );
+}
+function Ne({ className: t, size: n = 18 }) {
+  return /* @__PURE__ */ p(
+    "svg",
+    {
+      width: n,
+      height: n,
+      viewBox: "0 0 18 18",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: t,
+      role: "img",
+      "aria-label": "Alert",
+      children: [
+        /* @__PURE__ */ e("path", { d: "M8.4375 12V10.875H9.5625V12H8.4375Z", fill: "currentColor" }),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M8.4375 6L8.4375 9.75H9.5625V6L8.4375 6Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M9 3C5.68629 3 3 5.68629 3 9C3 12.3137 5.68629 15 9 15C12.3137 15 15 12.3137 15 9C15 5.68629 12.3137 3 9 3ZM4.125 9C4.125 11.6924 6.30761 13.875 9 13.875C11.6924 13.875 13.875 11.6924 13.875 9C13.875 6.30761 11.6924 4.125 9 4.125C6.30761 4.125 4.125 6.30761 4.125 9Z",
+            fill: "currentColor"
+          }
+        )
+      ]
+    }
+  );
+}
+function xe({ className: t, size: n = 18 }) {
+  return /* @__PURE__ */ p(
+    "svg",
+    {
+      width: n,
+      height: n,
+      viewBox: "0 0 18 18",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: t,
+      role: "img",
+      "aria-label": "Alert",
+      children: [
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M9.56279 13.0952H8.43779V11.9702H9.56279V13.0952Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M8.43779 10.8452H9.56279V7.0952L8.43779 7.0952V10.8452Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M7.85634 3.48153C8.35812 2.58949 9.64245 2.58949 10.1442 3.48153L15.6118 13.2017C16.104 14.0767 15.4717 15.1577 14.4679 15.1577H3.53267C2.52884 15.1577 1.89659 14.0767 2.38873 13.2017L7.85634 3.48153ZM9.16371 4.03308C9.09203 3.90564 8.90855 3.90564 8.83686 4.03308L3.36925 13.7533C3.29895 13.8783 3.38927 14.0327 3.53267 14.0327H14.4679C14.6113 14.0327 14.7016 13.8783 14.6313 13.7533L9.16371 4.03308Z",
+            fill: "currentColor"
+          }
+        )
+      ]
+    }
+  );
+}
+const Ie = "Notice-module_container", Se = "Notice-module_isSuccess", $e = "Notice-module_icon", Le = "Notice-module_isWarning", ke = "Notice-module_isError", De = "Notice-module_content", Ae = "Notice-module_actions", Re = "Notice-module_action", Be = "Notice-module_dismissible", S = {
+  container: Ie,
+  isSuccess: Se,
+  icon: $e,
+  isWarning: Le,
+  isError: ke,
+  content: De,
+  actions: Ae,
+  action: Re,
+  dismissible: Be
+};
+function We({
+  icon: t,
+  message: n,
+  action: o,
+  dismissible: a = !0,
+  onDismiss: i,
+  className: s,
+  status: r
+}) {
+  const g = et(() => {
+    if (k.isValidElement(t))
+      return t;
+    if (t === !1 || t === null)
+      return null;
+    switch (r) {
+      case "warning":
+        return /* @__PURE__ */ e(Ne, {});
+      case "error":
+        return /* @__PURE__ */ e(xe, {});
+      default:
+        return null;
+    }
+  }, [t, r])();
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      "data-slot": "notice",
+      className: v(
+        S.container,
+        {
+          [S.isSuccess]: r === "success",
+          [S.isWarning]: r === "warning",
+          [S.isError]: r === "error"
+        },
+        s
+      ),
+      children: [
+        /* @__PURE__ */ p("div", { className: S.content, children: [
+          g && /* @__PURE__ */ e("div", { className: S.icon, children: g }),
+          /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
+            vt,
+            {
+              allowedElements: ["p", "strong", "em", "a", "br"],
+              unwrapDisallowed: !0,
+              components: {
+                a: ({ node: d, ...u }) => /* @__PURE__ */ e(
+                  "a",
+                  {
+                    ...u,
+                    target: "_blank",
+                    rel: "noopener noreferrer",
+                    children: u.children
+                  }
+                )
+              },
+              children: n
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ p("div", { className: S.actions, children: [
+          o && /* @__PURE__ */ e(
+            D,
+            {
+              className: S.action,
+              onClick: o.onClick,
+              variant: "link",
+              children: o.label
+            }
+          ),
+          a && i && /* @__PURE__ */ e(
+            D,
+            {
+              className: S.dismissible,
+              onClick: i,
+              variant: "ghost",
+              size: "sm",
+              icon: /* @__PURE__ */ e(pe, {})
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function Me({ className: t } = {}) {
+  const { notice: n } = Z();
+  return n ? /* @__PURE__ */ e(
+    We,
+    {
+      icon: n.icon,
+      message: n.message,
+      action: n.action,
+      dismissible: n.dismissible,
+      onDismiss: n.onDismiss,
+      className: t,
+      status: n.status
+    }
+  ) : null;
+}
+const je = "ChatFooter-module_container", Ee = "ChatFooter-module_disclosure", z = {
+  container: je,
+  disclosure: Ee
+}, Pe = "https://automattic.com/ai-guidelines/";
+function Ve() {
+  const t = (
+    /* translators: %s: the linked label "Guidelines" (links to Automattic's AI guidelines). */
+    w("You’re chatting with AI. %s.", "a8c-agenttic")
+  ), [n, o] = t.split("%s");
+  return /* @__PURE__ */ p(Y, { children: [
+    n,
+    /* @__PURE__ */ e(
+      "a",
+      {
+        href: Pe,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        "aria-label": w(
+          "Guidelines (opens in a new tab)",
+          "a8c-agenttic"
+        ),
+        children: w("Guidelines", "a8c-agenttic")
+      }
+    ),
+    o
+  ] });
+}
+function He({
+  children: t
+}) {
+  return t === !1 || t === null || t === void 0 ? null : /* @__PURE__ */ e(
+    "div",
+    {
+      "data-slot": "chat-compliance-disclosure",
+      className: z.disclosure,
+      children: t
+    }
+  );
+}
+function Nn({
+  children: t,
+  className: n,
+  complianceDisclosure: o = /* @__PURE__ */ e(Ve, {})
+} = {}) {
+  const a = /* @__PURE__ */ e(He, { children: o });
+  return t ? /* @__PURE__ */ p(Y, { children: [
+    /* @__PURE__ */ e(
+      W.div,
+      {
+        "data-slot": "chat-footer",
+        className: v(z.container, n),
+        initial: { opacity: 0, scale: 1 },
+        animate: { opacity: 1, scale: 1 },
+        transition: { ...U },
+        children: t
+      }
+    ),
+    a
+  ] }) : /* @__PURE__ */ p(Y, { children: [
+    /* @__PURE__ */ p(
+      W.div,
+      {
+        "data-slot": "chat-footer",
+        className: v(z.container, n),
+        initial: { opacity: 0, scale: 1 },
+        animate: { opacity: 1, scale: 1 },
+        transition: { ...U },
+        children: [
+          /* @__PURE__ */ e(_e, {}),
+          /* @__PURE__ */ e(Me, {}),
+          /* @__PURE__ */ e(ye, {})
+        ]
+      }
+    ),
+    a
+  ] });
+}
+const Te = "QuestionCard-module_card", Ue = "QuestionCard-module_question", Ze = "QuestionCard-module_choices", Oe = "QuestionCard-module_choicesGrid", Qe = "QuestionCard-module_choice", Fe = "QuestionCard-module_answered", Ge = "QuestionCard-module_label", qe = "QuestionCard-module_description", L = {
+  card: Te,
+  question: Ue,
+  choices: Ze,
+  choicesGrid: Oe,
+  choice: Qe,
+  answered: Fe,
+  label: Ge,
+  description: qe
+};
+function xn({
+  prompt: t,
+  onAnswer: n,
+  disabled: o = !1,
+  answered: a = !1,
+  answeredChoice: i,
+  className: s,
+  renderChoiceContent: r
+}) {
+  const f = o || a, g = t.choices.slice(0, 4);
+  return /* @__PURE__ */ p(
+    "section",
+    {
+      className: v(L.card, s),
+      "data-agenttic-question-card": !0,
+      "data-slot": "card",
+      children: [
+        /* @__PURE__ */ e("p", { className: L.question, "data-slot": "question", children: t.question }),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: v(
+              L.choices,
+              g.length === 4 ? L.choicesGrid : void 0
+            ),
+            "data-slot": "choices",
+            children: g.map((d, u) => {
+              const c = d.message ?? d.label, b = i === c;
+              return /* @__PURE__ */ p(
+                "button",
+                {
+                  type: "button",
+                  "data-slot": "choice",
+                  className: v(
+                    L.choice,
+                    b ? L.answered : void 0
+                  ),
+                  disabled: f,
+                  "aria-pressed": b || void 0,
+                  onClick: () => n(c, d),
+                  children: [
+                    /* @__PURE__ */ e("span", { className: L.label, "data-slot": "label", children: d.label }),
+                    d.description ? /* @__PURE__ */ e(
+                      "span",
+                      {
+                        className: L.description,
+                        "data-slot": "description",
+                        children: d.description
+                      }
+                    ) : null,
+                    r == null ? void 0 : r(d)
+                  ]
+                },
+                `${d.label}-${u}`
+              );
+            })
+          }
+        )
+      ]
+    }
+  );
+}
+const Ke = "DiffCard-module_card", Xe = "DiffCard-module_isResolved", Ye = "DiffCard-module_title", Je = "DiffCard-module_summary", ze = "DiffCard-module_body", tn = "DiffCard-module_change", en = "DiffCard-module_changeLabel", nn = "DiffCard-module_diff", on = "DiffCard-module_removed", an = "DiffCard-module_added", sn = "DiffCard-module_resolution", ln = "DiffCard-module_actions", rn = "DiffCard-module_action", cn = "DiffCard-module_accept", dn = "DiffCard-module_reject", C = {
+  card: Ke,
+  isResolved: Xe,
+  title: Ye,
+  summary: Je,
+  body: ze,
+  change: tn,
+  changeLabel: en,
+  diff: nn,
+  removed: on,
+  added: an,
+  resolution: sn,
+  actions: ln,
+  action: rn,
+  accept: cn,
+  reject: dn
+};
+function un(t) {
+  return typeof t == "string" ? [] : Array.isArray(t) ? t : [t];
+}
+function mn(t, n) {
+  const o = typeof t.original == "string" && t.original.length > 0, a = typeof t.replacement == "string" && t.replacement.length > 0;
+  return /* @__PURE__ */ p("div", { className: C.change, "data-slot": "change", children: [
+    t.label ? /* @__PURE__ */ e("span", { className: C.changeLabel, "data-slot": "change-label", children: t.label }) : null,
+    o ? /* @__PURE__ */ e(
+      "pre",
+      {
+        className: v(C.diff, C.removed),
+        "data-slot": "original",
+        children: t.original
+      }
+    ) : null,
+    a ? /* @__PURE__ */ e(
+      "pre",
+      {
+        className: v(C.diff, C.added),
+        "data-slot": "replacement",
+        children: t.replacement
+      }
+    ) : null
+  ] }, n);
+}
+function In({
+  diff: t,
+  title: n,
+  summary: o,
+  onResolve: a,
+  disabled: i = !1,
+  resolved: s,
+  acceptLabel: r,
+  rejectLabel: f,
+  className: g,
+  renderDiff: d
+}) {
+  const u = !!s, c = i || u, b = un(t);
+  let m;
+  return d ? m = d(t) : typeof t == "string" ? m = /* @__PURE__ */ e("pre", { className: C.diff, "data-slot": "diff", children: t }) : m = b.map(mn), /* @__PURE__ */ p(
+    "section",
+    {
+      className: v(
+        C.card,
+        u ? C.isResolved : void 0,
+        g
+      ),
+      "data-agenttic-diff-card": !0,
+      "data-slot": "card",
+      children: [
+        n ? /* @__PURE__ */ e("p", { className: C.title, "data-slot": "title", children: n }) : null,
+        o ? /* @__PURE__ */ e("p", { className: C.summary, "data-slot": "summary", children: o }) : null,
+        /* @__PURE__ */ e("div", { className: C.body, "data-slot": "body", children: m }),
+        u ? /* @__PURE__ */ e("p", { className: C.resolution, "data-slot": "resolution", children: s === "accepted" ? w("Accepted", "a8c-agenttic") : w("Rejected", "a8c-agenttic") }) : /* @__PURE__ */ p("div", { className: C.actions, "data-slot": "actions", children: [
+          /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              "data-slot": "accept",
+              className: v(C.action, C.accept),
+              disabled: c,
+              onClick: () => a("accepted"),
+              children: r ?? w("Accept", "a8c-agenttic")
+            }
+          ),
+          /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              "data-slot": "reject",
+              className: v(C.action, C.reject),
+              disabled: c,
+              onClick: () => a("rejected"),
+              children: f ?? w("Reject", "a8c-agenttic")
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+export {
+  yn as A,
+  D as B,
+  Xt as C,
+  Ve as D,
+  We as N,
+  we as P,
+  xn as Q,
+  me as S,
+  pe as X,
+  Ft as a,
+  yt as b,
+  v as c,
+  _n as d,
+  Nn as e,
+  U as f,
+  Me as g,
+  _e as h,
+  ye as i,
+  He as j,
+  Kt as k,
+  In as l,
+  wt as m,
+  wn as n,
+  Pt as o,
+  Et as p,
+  z as s,
+  Z as u
+};