@bikdotai/bik-component-library 0.0.868 → 0.0.869

package/dist/esm/components/bik-copilot/CopilotPanel.js

@@ -1,18 +1,19 @@
-import { jsxs as o, jsx as t, Fragment as je } from "react/jsx-runtime";
-import Ne from "../../assets/icons/arrow_down.svg.js";
-import g from "../../assets/icons/bik_ai_stars_icon.svg.js";
-import $e from "../../assets/icons/cross.svg.js";
-import Oe from "../../assets/icons/refresh.svg.js";
-import Ue, { useState as h, useRef as u, useEffect as j } from "react";
-import { COLORS as k } from "../../constants/Theme.js";
-import { TitleSmall as Ve, BodyCaption as le, BodySecondary as De } from "../TypographyStyle.js";
-import { CopilotFeedbackModal as Ke } from "./CopilotFeedbackModal.js";
-import { PanelContainer as Xe, PanelHeader as Ge, HeaderAvatar as ze, HeaderText as Je, HeaderTitleRow as Ze, HeaderBadge as qe, HeaderActions as Qe, IconAction as ce, MessagesViewport as Ye, MessagesArea as et, EmptyState as tt, EmptyStateIcon as rt, SuggestionList as ot, SuggestionChip as nt, HistoryLoader as it, MessageBubble as lt, ToolCtaList as ct, ToolCtaLink as dt, MessageTimestamp as at, InterruptedNote as st, MessageActions as ht, MessageAction as T, FollowUpList as ut, FollowUpsLabel as pt, FollowUpChip as ft, ThinkingBubble as kt, ThinkingLabel as wt, ScrollFade as Ct, JumpToLatestButton as mt, ErrorBanner as yt, InputArea as bt, InputWrapper as vt, MessageInput as gt, SendButton as Tt, Disclaimer as St } from "./CopilotPanel.styled.js";
-import { isCopilotRegeneratePrompt as Mt } from "./copilotRegenerate.js";
-import { renderCopilotMarkdown as It } from "./utils/markdown.js";
-import { toolResultCtas as xt } from "./utils/toolCtas.js";
-import { DotPulse as de } from "../dot-pulse/DotPulse.js";
-const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
+import { jsxs as r, jsx as t, Fragment as Oe } from "react/jsx-runtime";
+import Ue from "../../assets/icons/arrow_down.svg.js";
+import C from "../../assets/icons/bik_ai_stars_icon.svg.js";
+import de from "../../assets/icons/cross.svg.js";
+import Ve from "../../assets/icons/refresh.svg.js";
+import De, { useState as u, useRef as p, useEffect as S } from "react";
+import { COLORS as f } from "../../constants/Theme.js";
+import { TitleSmall as Ke, BodyCaption as ae, BodySecondary as Xe } from "../TypographyStyle.js";
+import { CopilotFeedbackModal as Ge } from "./CopilotFeedbackModal.js";
+import { PanelContainer as ze, PanelHeader as Je, HeaderAvatar as Ze, HeaderText as qe, HeaderTitleRow as Qe, HeaderBadge as Ye, HeaderActions as et, IconAction as he, MessagesViewport as tt, MessagesArea as rt, EmptyState as ot, EmptyStateIcon as nt, SuggestionList as it, SuggestionChip as lt, HistoryLoader as ct, MessageBubble as dt, ToolCtaList as at, ToolCtaLink as ht, MessageTimestamp as st, InterruptedNote as ut, MessageActions as pt, MessageAction as x, FollowUpList as ft, FollowUpsLabel as kt, FollowUpChip as wt, ThinkingBubble as Ct, ThinkingLabel as bt, ScrollFade as yt, JumpToLatestButton as mt, ErrorBanner as vt, InputArea as gt, AttachmentChip as Tt, AttachmentText as St, AttachmentRemove as xt, InputWrapper as At, MessageInput as Mt, SendButton as It, Disclaimer as Lt } from "./CopilotPanel.styled.js";
+import { isCopilotRegeneratePrompt as Bt } from "./copilotRegenerate.js";
+import { buildCopilotSelectionPrompt as Rt } from "./copilotSelectionPrompt.js";
+import { renderCopilotMarkdown as Ht } from "./utils/markdown.js";
+import { toolResultCtas as Ft } from "./utils/toolCtas.js";
+import { DotPulse as se } from "../dot-pulse/DotPulse.js";
+const Et = 96, _t = 24, Pt = 1800, Wt = async (n) => {
   try {
     if (navigator.clipboard?.writeText)
       return await navigator.clipboard.writeText(n), !0;
@@ -21,12 +22,12 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
   try {
     const i = document.createElement("textarea");
     i.value = n, i.setAttribute("readonly", ""), i.style.position = "fixed", i.style.top = "-1000px", i.style.opacity = "0", document.body.appendChild(i), i.select();
-    const S = document.execCommand("copy");
-    return document.body.removeChild(i), S;
+    const A = document.execCommand("copy");
+    return document.body.removeChild(i), A;
   } catch {
     return !1;
   }
-}, Rt = 48, Ft = (n) => {
+}, jt = 48, Nt = (n) => {
   if (!n || !Number.isFinite(n))
     return "";
   const i = new Date(n);
@@ -34,7 +35,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
     hour: "numeric",
     minute: "2-digit"
   });
-}, Et = () => /* @__PURE__ */ o(
+}, $t = () => /* @__PURE__ */ r(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -51,7 +52,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
       /* @__PURE__ */ t("path", { d: "M6 11l6-6 6 6" })
     ]
   }
-), _t = () => /* @__PURE__ */ o(
+), Ot = () => /* @__PURE__ */ r(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -68,7 +69,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
       /* @__PURE__ */ t("path", { d: "M13 6l6 6-6 6" })
     ]
   }
-), ae = ({ size: n = 16 }) => /* @__PURE__ */ t(
+), ue = ({ size: n = 16 }) => /* @__PURE__ */ t(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -78,7 +79,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
     "aria-hidden": "true",
     children: /* @__PURE__ */ t("rect", { x: "7", y: "7", width: "10", height: "10", rx: "2" })
   }
-), Pt = () => /* @__PURE__ */ o(
+), Ut = () => /* @__PURE__ */ r(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -95,7 +96,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
       /* @__PURE__ */ t("path", { d: "M15 5.5A1.5 1.5 0 0 0 13.5 4H5.5A1.5 1.5 0 0 0 4 5.5v8A1.5 1.5 0 0 0 5.5 15" })
     ]
   }
-), Wt = () => /* @__PURE__ */ t(
+), Vt = () => /* @__PURE__ */ t(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -109,7 +110,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
     "aria-hidden": "true",
     children: /* @__PURE__ */ t("path", { d: "M5 13l4 4L19 7" })
   }
-), jt = () => /* @__PURE__ */ o(
+), Dt = () => /* @__PURE__ */ r(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -126,7 +127,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
       /* @__PURE__ */ t("path", { d: "M20 4v4h-4" })
     ]
   }
-), Nt = ({ filled: n = !1 }) => /* @__PURE__ */ o(
+), Kt = ({ filled: n = !1 }) => /* @__PURE__ */ r(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -143,7 +144,7 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
       /* @__PURE__ */ t("path", { d: "M7 10l4.5-7a2 2 0 0 1 3.7 1.3L14.5 9H19a2 2 0 0 1 2 2.3l-1.1 7A2 2 0 0 1 18 20H7" })
     ]
   }
-), $t = ({ filled: n = !1 }) => /* @__PURE__ */ o(
+), Xt = ({ filled: n = !1 }) => /* @__PURE__ */ r(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -160,211 +161,219 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
       /* @__PURE__ */ t("path", { d: "M7 14l4.5 7a2 2 0 0 0 3.7-1.3L14.5 15H19a2 2 0 0 0 2-2.3l-1.1-7A2 2 0 0 0 18 4H7" })
     ]
   }
-), tr = ({
+), dr = ({
   messages: n,
   onSend: i,
-  onClose: S,
-  title: w = "Copilot",
-  badge: N,
-  subtitle: $,
-  avatar: se,
-  placeholder: he = "Write your message...",
-  disclaimer: O = "AI can make mistakes, Verify the responses.",
-  emptyStateTitle: ue,
-  emptyStateSubtitle: U = "Here are some things you can try",
+  onClose: A,
+  title: b = "Copilot",
+  badge: O,
+  subtitle: U,
+  avatar: pe,
+  placeholder: fe = "Write your message...",
+  disclaimer: V = "AI can make mistakes, Verify the responses.",
+  emptyStateTitle: ke,
+  emptyStateSubtitle: D = "Here are some things you can try",
   suggestions: M,
-  onSuggestionClick: pe,
-  showRefresh: fe = !0,
-  onRefresh: V,
-  onRegenerate: D,
+  onSuggestionClick: we,
+  showRefresh: Ce = !0,
+  onRefresh: K,
+  onRegenerate: X,
   onFeedback: I,
-  dislikeTitle: ke,
-  dislikeSubtitle: we,
-  dislikeReasons: Ce,
-  dislikeNotePlaceholder: me,
-  dislikeSubmitLabel: ye,
-  isThinking: C = !1,
-  thinkingLabel: K = "Thinking",
-  isStreaming: be = !1,
-  onStop: X,
-  interruptedLabel: G = "This message was interrupted",
-  followUpsLabel: z = "Follow ups",
-  onToolCtaClick: ve,
-  hasMoreHistory: ge = !1,
+  dislikeTitle: be,
+  dislikeSubtitle: ye,
+  dislikeReasons: me,
+  dislikeNotePlaceholder: ve,
+  dislikeSubmitLabel: ge,
+  isThinking: y = !1,
+  thinkingLabel: G = "Thinking",
+  isStreaming: Te = !1,
+  onStop: z,
+  interruptedLabel: J = "This message was interrupted",
+  followUpsLabel: Z = "Follow ups",
+  onToolCtaClick: Se,
+  hasMoreHistory: xe = !1,
   isLoadingHistory: m = !1,
-  onLoadOlderMessages: J,
-  historyLoadingLabel: Te = "Loading earlier messages",
+  onLoadOlderMessages: q,
+  historyLoadingLabel: Ae = "Loading earlier messages",
   inputDisabled: d = !1,
-  errorMessage: Z,
-  width: Se,
-  height: Me,
-  className: Ie,
-  style: xe
+  attachment: a,
+  onAttachmentRemove: Q,
+  errorMessage: Y,
+  width: Me,
+  height: Ie,
+  className: Le,
+  style: Be
 }) => {
-  const [x, q] = h(""), [Ae, Q] = h(!1), [A, L] = h(!0), [y, Y] = h(null), [s, Le] = h({}), [b, B] = h(null), ee = u(null), p = u(null), H = u(null), R = u(null), F = u(0), E = u(null), v = n.filter(
-    (e) => (e.content.length > 0 || e.wasInterrupted) && !Mt(e.content)
-  ), te = v.length === 0 && !C, a = C || be, re = !d && !a && x.trim().length > 0, f = a && !!X, _ = v[v.length - 1], P = !a && _?.role === "assistant" ? _.followUps : void 0, W = !te && !A;
-  j(() => {
-    A && H.current?.scrollIntoView({ behavior: "smooth" });
-  }, [n, C, A]), j(() => {
-    const e = R.current, r = E.current;
-    !e || r === null || m || (E.current = null, e.scrollTop = e.scrollHeight - r, F.current = e.scrollTop);
+  const [L, ee] = u(""), [Re, te] = u(!1), [B, R] = u(!0), [v, re] = u(null), [s, He] = u({}), [g, H] = u(null), F = p(null), k = p(null), E = p(null), _ = p(null), P = p(0), W = p(null), T = n.filter(
+    (e) => (e.content.length > 0 || e.wasInterrupted) && !Bt(e.content)
+  ), oe = T.length === 0 && !y, h = y || Te, ne = !d && !h && (L.trim().length > 0 || !!a), w = h && !!z, j = T[T.length - 1], N = !h && j?.role === "assistant" ? j.followUps : void 0, $ = !oe && !B;
+  S(() => {
+    B && E.current?.scrollIntoView({ behavior: "smooth" });
+  }, [n, y, B]), S(() => {
+    const e = _.current, o = W.current;
+    !e || o === null || m || (W.current = null, e.scrollTop = e.scrollHeight - o, P.current = e.scrollTop);
   }, [n, m]);
-  const Be = () => {
-    const e = R.current;
+  const Fe = () => {
+    const e = _.current;
     if (!e)
       return;
-    const r = e.scrollHeight - e.scrollTop - e.clientHeight;
-    e.scrollTop <= Rt && ge && !m && J && (E.current = e.scrollHeight - e.scrollTop, J());
-    const c = e.scrollTop < F.current - 1;
-    if (F.current = e.scrollTop, r <= Lt) {
-      L(!0);
+    const o = e.scrollHeight - e.scrollTop - e.clientHeight;
+    e.scrollTop <= jt && xe && !m && q && (W.current = e.scrollHeight - e.scrollTop, q());
+    const c = e.scrollTop < P.current - 1;
+    if (P.current = e.scrollTop, o <= _t) {
+      R(!0);
       return;
     }
-    c && L(!1);
-  }, He = () => {
-    L(!0), H.current?.scrollIntoView({ behavior: "smooth" });
+    c && R(!1);
+  }, Ee = () => {
+    R(!0), E.current?.scrollIntoView({ behavior: "smooth" });
   };
-  j(
+  S(
     () => () => {
-      p.current && window.clearTimeout(p.current);
+      k.current && window.clearTimeout(k.current);
     },
     []
   );
-  const Re = async (e) => {
-    await Ht(e.content) && (p.current && window.clearTimeout(p.current), Y(e.id), p.current = window.setTimeout(
-      () => Y(null),
-      Bt
+  const _e = async (e) => {
+    await Wt(e.content) && (k.current && window.clearTimeout(k.current), re(e.id), k.current = window.setTimeout(
+      () => re(null),
+      Pt
     ));
-  }, oe = (e, r) => {
-    const c = s[e] === r;
-    if (Le((l) => ({
+  }, ie = (e, o) => {
+    const c = s[e] === o;
+    if (He((l) => ({
       ...l,
-      [e]: l[e] === r ? void 0 : r
+      [e]: l[e] === o ? void 0 : o
     })), c) {
-      r === "dislike" && B(
+      o === "dislike" && H(
         (l) => l === e ? null : l
       );
       return;
     }
-    if (r === "like") {
+    if (o === "like") {
       I?.(e, "like");
       return;
     }
-    b && b !== e && I?.(b, "dislike"), B(e);
-  }, ne = (e, r) => {
-    B((c) => c === e ? null : c), I?.(e, "dislike", r);
-  }, Fe = () => {
-    d || a || D?.();
-  }, ie = () => {
-    const e = x.trim();
-    if (!e || d || a)
+    g && g !== e && I?.(g, "dislike"), H(e);
+  }, le = (e, o) => {
+    H((c) => c === e ? null : c), I?.(e, "dislike", o);
+  }, Pe = () => {
+    d || h || X?.();
+  }, ce = () => {
+    const e = L.trim();
+    if (!e && !a || d || h)
       return;
-    i(e), q("");
-    const r = ee.current;
-    r && (r.style.height = "auto");
-  }, Ee = (e) => {
-    q(e.target.value);
-    const r = e.target;
-    r.style.height = "auto", r.style.height = `${Math.min(
-      r.scrollHeight,
-      At
+    i(
+      a ? Rt(a, e) : e
+    ), ee(""), Q?.();
+    const o = F.current;
+    o && (o.style.height = "auto");
+  };
+  S(() => {
+    a && F.current?.focus();
+  }, [a]);
+  const We = (e) => {
+    ee(e.target.value);
+    const o = e.target;
+    o.style.height = "auto", o.style.height = `${Math.min(
+      o.scrollHeight,
+      Et
     )}px`;
-  }, _e = (e) => {
-    e.key === "Enter" && !e.shiftKey && (e.preventDefault(), ie());
-  }, Pe = (e) => {
-    d || a || (pe?.(e), i(e.text));
-  }, We = (e) => {
-    d || a || i(e);
+  }, je = (e) => {
+    e.key === "Enter" && !e.shiftKey && (e.preventDefault(), ce());
+  }, Ne = (e) => {
+    d || h || (we?.(e), i(e.text));
+  }, $e = (e) => {
+    d || h || i(e);
   };
-  return /* @__PURE__ */ o(
-    Xe,
+  return /* @__PURE__ */ r(
+    ze,
     {
-      className: Ie,
-      style: { width: Se, height: Me, ...xe },
+      className: Le,
+      style: { width: Me, height: Ie, ...Be },
       role: "dialog",
-      "aria-label": w,
+      "aria-label": b,
       children: [
-        /* @__PURE__ */ o(Ge, { children: [
-          /* @__PURE__ */ t(ze, { children: se ?? /* @__PURE__ */ t(g, { width: 18, height: 18 }) }),
-          /* @__PURE__ */ o(Je, { children: [
-            /* @__PURE__ */ o(Ze, { children: [
-              /* @__PURE__ */ t(Ve, { children: w }),
-              N && /* @__PURE__ */ t(qe, { children: N })
+        /* @__PURE__ */ r(Je, { children: [
+          /* @__PURE__ */ t(Ze, { children: pe ?? /* @__PURE__ */ t(C, { width: 18, height: 18 }) }),
+          /* @__PURE__ */ r(qe, { children: [
+            /* @__PURE__ */ r(Qe, { children: [
+              /* @__PURE__ */ t(Ke, { children: b }),
+              O && /* @__PURE__ */ t(Ye, { children: O })
             ] }),
-            $ && /* @__PURE__ */ t(le, { color: k.content.secondary, children: $ })
+            U && /* @__PURE__ */ t(ae, { color: f.content.secondary, children: U })
           ] }),
-          /* @__PURE__ */ o(Qe, { children: [
-            fe && V && /* @__PURE__ */ t(
-              ce,
+          /* @__PURE__ */ r(et, { children: [
+            Ce && K && /* @__PURE__ */ t(
+              he,
               {
                 type: "button",
-                onClick: V,
+                onClick: K,
                 "aria-label": "Start a new conversation",
-                children: /* @__PURE__ */ t(Oe, { width: 16, height: 16 })
+                children: /* @__PURE__ */ t(Ve, { width: 16, height: 16 })
               }
             ),
             /* @__PURE__ */ t(
-              ce,
+              he,
               {
                 type: "button",
-                onClick: S,
+                onClick: A,
                 "aria-label": "Close copilot",
-                children: /* @__PURE__ */ t($e, { width: 18, height: 18 })
+                children: /* @__PURE__ */ t(de, { width: 18, height: 18 })
               }
             )
           ] })
         ] }),
-        /* @__PURE__ */ o(Ye, { children: [
+        /* @__PURE__ */ r(tt, { children: [
           /* @__PURE__ */ t(
-            et,
+            rt,
             {
-              ref: R,
-              onScroll: Be,
+              ref: _,
+              onScroll: Fe,
               role: "region",
               "aria-label": "Conversation",
-              children: te ? /* @__PURE__ */ o(tt, { children: [
-                /* @__PURE__ */ t(rt, { children: /* @__PURE__ */ t(g, { width: 28, height: 28 }) }),
-                /* @__PURE__ */ t(De, { style: { fontWeight: 600 }, children: ue || w }),
-                U && /* @__PURE__ */ t(le, { color: k.content.secondary, children: U }),
-                M && M.length > 0 && /* @__PURE__ */ t(ot, { children: M.map((e) => /* @__PURE__ */ o(
-                  nt,
+              children: oe ? /* @__PURE__ */ r(ot, { children: [
+                /* @__PURE__ */ t(nt, { children: /* @__PURE__ */ t(C, { width: 28, height: 28 }) }),
+                /* @__PURE__ */ t(Xe, { style: { fontWeight: 600 }, children: ke || b }),
+                D && /* @__PURE__ */ t(ae, { color: f.content.secondary, children: D }),
+                M && M.length > 0 && /* @__PURE__ */ t(it, { children: M.map((e) => /* @__PURE__ */ r(
+                  lt,
                   {
                     type: "button",
-                    disabled: d || a,
-                    onClick: () => Pe(e),
+                    disabled: d || h,
+                    onClick: () => Ne(e),
                     children: [
-                      /* @__PURE__ */ t(g, { width: 14, height: 14 }),
+                      /* @__PURE__ */ t(C, { width: 14, height: 14 }),
                       e.text
                     ]
                   },
                   e.id
                 )) })
-              ] }) : /* @__PURE__ */ o(je, { children: [
-                m && /* @__PURE__ */ o(it, { role: "status", "aria-live": "polite", children: [
-                  /* @__PURE__ */ t(de, { color: k.content.placeholder, size: 4 }),
-                  Te
+              ] }) : /* @__PURE__ */ r(Oe, { children: [
+                m && /* @__PURE__ */ r(ct, { role: "status", "aria-live": "polite", children: [
+                  /* @__PURE__ */ t(se, { color: f.content.placeholder, size: 4 }),
+                  Ae
                 ] }),
-                v.map((e) => {
-                  const r = e.role === "user" ? Ft(e.timestamp) : "";
-                  return /* @__PURE__ */ o(Ue.Fragment, { children: [
-                    e.content.length > 0 && /* @__PURE__ */ t(lt, { $role: e.role, children: e.role === "assistant" ? /* @__PURE__ */ t(
+                T.map((e) => {
+                  const o = e.role === "user" ? Nt(e.timestamp) : "";
+                  return /* @__PURE__ */ r(De.Fragment, { children: [
+                    e.content.length > 0 && /* @__PURE__ */ t(dt, { $role: e.role, children: e.role === "assistant" ? /* @__PURE__ */ t(
                       "div",
                       {
                         dangerouslySetInnerHTML: {
-                          __html: It(e.content)
+                          __html: Ht(e.content)
                         }
                       }
                     ) : /* @__PURE__ */ t("div", { style: { whiteSpace: "pre-wrap" }, children: e.content }) }),
                     e.role === "assistant" && !e.isStreaming && (() => {
-                      const c = xt(e.toolResults);
-                      return c.length === 0 ? null : /* @__PURE__ */ t(ct, { children: c.map((l) => /* @__PURE__ */ t(
-                        dt,
+                      const c = Ft(e.toolResults);
+                      return c.length === 0 ? null : /* @__PURE__ */ t(at, { children: c.map((l) => /* @__PURE__ */ t(
+                        ht,
                         {
                           href: l.url,
                           target: "_blank",
                           rel: "noopener noreferrer",
-                          onClick: () => ve?.({
+                          onClick: () => Se?.({
                             tool: l.tool,
                             url: l.url
                           }),
@@ -373,47 +382,47 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
                         `${l.tool}-${l.url}`
                       )) });
                     })(),
-                    r && /* @__PURE__ */ t(at, { children: r }),
-                    e.wasInterrupted && G && /* @__PURE__ */ o(st, { children: [
-                      /* @__PURE__ */ t(ae, { size: 12 }),
-                      G
+                    o && /* @__PURE__ */ t(st, { children: o }),
+                    e.wasInterrupted && J && /* @__PURE__ */ r(ut, { children: [
+                      /* @__PURE__ */ t(ue, { size: 12 }),
+                      J
                     ] }),
-                    e.role === "assistant" && e.content.length > 0 && !e.isStreaming && /* @__PURE__ */ o(ht, { children: [
+                    e.role === "assistant" && e.content.length > 0 && !e.isStreaming && /* @__PURE__ */ r(pt, { children: [
                       /* @__PURE__ */ t(
-                        T,
+                        x,
                         {
                           type: "button",
                           onClick: () => {
-                            Re(e);
+                            _e(e);
                           },
-                          "data-copied": y === e.id,
-                          title: y === e.id ? "Copied" : "Copy",
-                          "aria-label": y === e.id ? "Response copied to clipboard" : "Copy response",
-                          children: y === e.id ? /* @__PURE__ */ t(Wt, {}) : /* @__PURE__ */ t(Pt, {})
+                          "data-copied": v === e.id,
+                          title: v === e.id ? "Copied" : "Copy",
+                          "aria-label": v === e.id ? "Response copied to clipboard" : "Copy response",
+                          children: v === e.id ? /* @__PURE__ */ t(Vt, {}) : /* @__PURE__ */ t(Ut, {})
                         }
                       ),
-                      D && e.id === _?.id && /* @__PURE__ */ t(
-                        T,
+                      X && e.id === j?.id && /* @__PURE__ */ t(
+                        x,
                         {
                           type: "button",
-                          onClick: Fe,
-                          disabled: d || a,
+                          onClick: Pe,
+                          disabled: d || h,
                           title: "Regenerate",
                           "aria-label": "Regenerate response",
-                          children: /* @__PURE__ */ t(jt, {})
+                          children: /* @__PURE__ */ t(Dt, {})
                         }
                       ),
                       /* @__PURE__ */ t(
-                        T,
+                        x,
                         {
                           type: "button",
-                          onClick: () => oe(e.id, "like"),
+                          onClick: () => ie(e.id, "like"),
                           "data-selected": s[e.id] === "like",
                           "aria-pressed": s[e.id] === "like",
                           title: "Good response",
                           "aria-label": "Good response",
                           children: /* @__PURE__ */ t(
-                            Nt,
+                            Kt,
                             {
                               filled: s[e.id] === "like"
                             }
@@ -421,16 +430,16 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
                         }
                       ),
                       /* @__PURE__ */ t(
-                        T,
+                        x,
                         {
                           type: "button",
-                          onClick: () => oe(e.id, "dislike"),
+                          onClick: () => ie(e.id, "dislike"),
                           "data-selected": s[e.id] === "dislike",
                           "aria-pressed": s[e.id] === "dislike",
                           title: "Bad response",
                           "aria-label": "Bad response",
                           children: /* @__PURE__ */ t(
-                            $t,
+                            Xt,
                             {
                               filled: s[e.id] === "dislike"
                             }
@@ -438,99 +447,114 @@ const At = 96, Lt = 24, Bt = 1800, Ht = async (n) => {
                         }
                       )
                     ] }),
-                    b === e.id && /* @__PURE__ */ t(
-                      Ke,
+                    g === e.id && /* @__PURE__ */ t(
+                      Ge,
                       {
-                        title: ke,
-                        subtitle: we ?? `Help us improve ${w}`,
-                        reasons: Ce,
-                        notePlaceholder: me,
-                        submitLabel: ye,
-                        onSubmit: (c) => ne(e.id, c),
-                        onDismiss: () => ne(e.id)
+                        title: be,
+                        subtitle: ye ?? `Help us improve ${b}`,
+                        reasons: me,
+                        notePlaceholder: ve,
+                        submitLabel: ge,
+                        onSubmit: (c) => le(e.id, c),
+                        onDismiss: () => le(e.id)
                       }
                     )
                   ] }, e.id);
                 }),
-                P && P.length > 0 && /* @__PURE__ */ o(ut, { children: [
-                  z && /* @__PURE__ */ t(pt, { children: z }),
-                  P.map((e) => /* @__PURE__ */ o(
-                    ft,
+                N && N.length > 0 && /* @__PURE__ */ r(ft, { children: [
+                  Z && /* @__PURE__ */ t(kt, { children: Z }),
+                  N.map((e) => /* @__PURE__ */ r(
+                    wt,
                     {
                       type: "button",
                       disabled: d,
-                      onClick: () => We(e),
+                      onClick: () => $e(e),
                       children: [
-                        /* @__PURE__ */ t(_t, {}),
+                        /* @__PURE__ */ t(Ot, {}),
                         e
                       ]
                     },
                     e
                   ))
                 ] }),
-                C && /* @__PURE__ */ o(kt, { role: "status", "aria-live": "polite", children: [
+                y && /* @__PURE__ */ r(Ct, { role: "status", "aria-live": "polite", children: [
                   /* @__PURE__ */ t(
-                    g,
+                    C,
                     {
                       width: 14,
                       height: 14,
-                      color: k.content.brand
+                      color: f.content.brand
                     }
                   ),
-                  K && /* @__PURE__ */ t(wt, { children: K }),
-                  /* @__PURE__ */ t(de, { color: k.background.brand, size: 5 })
+                  G && /* @__PURE__ */ t(bt, { children: G }),
+                  /* @__PURE__ */ t(se, { color: f.background.brand, size: 5 })
                 ] }),
-                /* @__PURE__ */ t("div", { ref: H })
+                /* @__PURE__ */ t("div", { ref: E })
               ] })
             }
           ),
-          /* @__PURE__ */ t(Ct, { $visible: W, "aria-hidden": "true" }),
+          /* @__PURE__ */ t(yt, { $visible: $, "aria-hidden": "true" }),
           /* @__PURE__ */ t(
             mt,
             {
               type: "button",
-              $visible: W,
-              onClick: He,
-              tabIndex: W ? 0 : -1,
+              $visible: $,
+              onClick: Ee,
+              tabIndex: $ ? 0 : -1,
               "aria-label": "Scroll to the latest message",
-              children: /* @__PURE__ */ t(Ne, { width: 16, height: 16 })
+              children: /* @__PURE__ */ t(Ue, { width: 16, height: 16 })
             }
           )
         ] }),
-        Z && /* @__PURE__ */ t(yt, { role: "alert", children: Z }),
-        /* @__PURE__ */ t(bt, { children: /* @__PURE__ */ o(vt, { $focused: Ae, children: [
-          /* @__PURE__ */ t(
-            gt,
-            {
-              ref: ee,
-              rows: 1,
-              value: x,
-              placeholder: he,
-              disabled: d,
-              onChange: Ee,
-              onKeyDown: _e,
-              onFocus: () => Q(!0),
-              onBlur: () => Q(!1)
-            }
-          ),
-          /* @__PURE__ */ t(
-            Tt,
-            {
-              type: "button",
-              $active: f || re,
-              disabled: !f && !re,
-              onClick: f ? X : ie,
-              "aria-label": f ? "Stop generating" : "Send message",
-              children: f ? /* @__PURE__ */ t(ae, {}) : /* @__PURE__ */ t(Et, {})
-            }
-          )
-        ] }) }),
-        O && /* @__PURE__ */ t(St, { children: O })
+        Y && /* @__PURE__ */ t(vt, { role: "alert", children: Y }),
+        /* @__PURE__ */ r(gt, { children: [
+          a && /* @__PURE__ */ r(Tt, { children: [
+            /* @__PURE__ */ t(C, { width: 14, height: 14, color: f.content.brand }),
+            /* @__PURE__ */ t(St, { title: a, children: a }),
+            /* @__PURE__ */ t(
+              xt,
+              {
+                type: "button",
+                onClick: Q,
+                "aria-label": "Remove the selected text",
+                children: /* @__PURE__ */ t(de, { width: 12, height: 12 })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ r(At, { $focused: Re, children: [
+            /* @__PURE__ */ t(
+              Mt,
+              {
+                ref: F,
+                rows: 1,
+                value: L,
+                placeholder: fe,
+                disabled: d,
+                onChange: We,
+                onKeyDown: je,
+                onFocus: () => te(!0),
+                onBlur: () => te(!1)
+              }
+            ),
+            /* @__PURE__ */ t(
+              It,
+              {
+                type: "button",
+                $active: w || ne,
+                disabled: !w && !ne,
+                onClick: w ? z : ce,
+                "aria-label": w ? "Stop generating" : "Send message",
+                children: w ? /* @__PURE__ */ t(ue, {}) : /* @__PURE__ */ t($t, {})
+              }
+            )
+          ] })
+        ] }),
+        V && /* @__PURE__ */ t(Lt, { children: V })
       ]
     }
   );
 };
 export {
-  tr as CopilotPanel
+  dr as CopilotPanel
 };
 //# sourceMappingURL=CopilotPanel.js.map