@redocly/replay 0.27.0-next.4 → 0.27.0-next.6

package/dist/replay-AiPanel-DvOGYsWl.js

@@ -0,0 +1,2918 @@
+import { jsx as i, jsxs as h, Fragment as Fe } from "react/jsx-runtime";
+import { useState as K, useEffect as B, useCallback as $, useMemo as S, Fragment as yt, useRef as F, useLayoutEffect as je, createContext as xt, useContext as wt } from "react";
+import c, { css as fe, keyframes as bt } from "styled-components";
+import { Tooltip as Y, AI_SEARCH_MAX_MESSAGE_LENGTH as Ct, Button as V, SubtractIcon as kt, AddIcon as Tt, CheckmarkFilledIcon as It, CloseFilledIcon as St, CheckboxIcon as At, capitalize as ee, ChevronDownIcon as Lt, ChevronRightIcon as Pt, SettingsCogIcon as Et, Dropdown as Rt, DropdownMenu as Ot, DropdownMenuItem as We, CheckmarkIcon as $t, ClaudeIcon as Dt, GeminiIcon as Mt, ChatGptIcon as zt, Typography as re, TrashCanIcon as _t, AiStarsGradientIcon as Vt, NewChatIcon as Ht, RecentlyViewedIcon as Bt, CloseIcon as Nt, ArrowLeftIcon as Ft } from "@redocly/theme";
+import { G as xe, H as Ue, T as X, J as we, K as jt, b as Wt, m as Ye, i as Ut, j as Yt, L as Gt, N as pe, O as he, P as N, Q as me, U as Kt, V as qt, W as Ge, X as Zt, Y as Jt, R as ge, E as le, Z as Ke, p as qe, _ as ye, $ as U, a0 as Xt } from "./replay-index-DXnDNeqk.js";
+import { l as Qt, n as en, p as tn, q as nn, T as rn, t as on, v as an, x as Ze, C as k, y as sn, z as Je, L as cn, B as q, D as ln, E as dn, F as un, G as fn, H as j } from "./replay-useAiChatQueries-Btd-PmIH.js";
+import { M as D } from "./replay-db-BtdwaWh3.js";
+import "@tanstack/react-query";
+import { Link as pn } from "react-router-dom";
+const te = c.div`
+  width: var(--search-ai-thinking-dot-size);
+  height: var(--search-ai-thinking-dot-size);
+  border-radius: 50%;
+  background: var(--search-ai-thinking-dot-color);
+  animation: bounce 1.4s infinite ease-in-out;
+
+  &:nth-child(1) {
+    animation-delay: -0.32s;
+  }
+
+  &:nth-child(2) {
+    animation-delay: -0.16s;
+  }
+
+  &:nth-child(3) {
+    animation-delay: 0s;
+  }
+
+  @keyframes bounce {
+    0%,
+    80%,
+    100% {
+      opacity: 0.2;
+      transform: scale(0.8);
+    }
+    40% {
+      opacity: 1;
+      transform: scale(1);
+    }
+  }
+`, Xe = 280;
+function be() {
+  const [e, t] = K(
+    () => xe().getIndexingActivityState().inProgress
+  );
+  return B(() => xe().subscribe("indexing-activity", (r) => {
+    t(r.inProgress);
+  }), []), /* @__PURE__ */ i(hn, { $open: e, children: /* @__PURE__ */ i(gn, { children: /* @__PURE__ */ i(vn, { $open: e, "aria-hidden": !e, children: /* @__PURE__ */ i(
+    Y,
+    {
+      tip: "We're building a search index of your project. Until it's ready, the assistant may need more context in each reply to stay accurate, which can use more tokens.",
+      placement: "top",
+      width: "240px",
+      arrowPosition: "left",
+      children: /* @__PURE__ */ h(mn, { role: "status", "aria-live": "polite", "aria-label": "Indexing in progress...", children: [
+        /* @__PURE__ */ i("div", { children: /* @__PURE__ */ i(te, {}) }),
+        /* @__PURE__ */ i(yn, { children: "Indexing in progress..." })
+      ] })
+    }
+  ) }) }) });
+}
+const hn = c.div`
+  display: grid;
+  grid-template-rows: ${({ $open: e }) => e ? "1fr" : "0fr"};
+  transition: grid-template-rows ${Xe}ms ease-out;
+`, gn = c.div`
+  min-height: 0;
+  overflow: hidden;
+`, vn = c.div`
+  opacity: ${({ $open: e }) => e ? 1 : 0};
+  transition: opacity ${Xe}ms ease-out;
+  pointer-events: ${({ $open: e }) => e ? "auto" : "none"};
+  padding: var(--spacing-xs);
+  padding-top: var(--spacing-xxs);
+`, mn = c.div`
+  width: 100%;
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xxs);
+  background: var(--layer-color);
+  padding: var(--spacing-xs) var(--spacing-sm);
+  border-radius: var(--border-radius);
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+`, yn = c.div`
+  flex: 1;
+  min-width: 0;
+`, xn = (e) => /* @__PURE__ */ i(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...e,
+    children: /* @__PURE__ */ i(
+      "path",
+      {
+        d: "M13.0094 7.61066L3.38435 2.79816C3.30892 2.76043 3.22418 2.74532 3.14035 2.75463C3.05652 2.76394 2.97717 2.79729 2.91186 2.85066C2.84948 2.90294 2.80292 2.97158 2.77742 3.04886C2.75191 3.12615 2.74847 3.20902 2.76748 3.28816L3.92685 7.56253H8.87498V8.43753H3.92685L2.74998 12.6988C2.73214 12.7649 2.73006 12.8342 2.7439 12.9013C2.75774 12.9683 2.78712 13.0312 2.82968 13.0848C2.87223 13.1384 2.92677 13.1813 2.98891 13.21C3.05106 13.2387 3.11907 13.2524 3.18748 13.25C3.25597 13.2496 3.3234 13.2331 3.38435 13.2019L13.0094 8.38941C13.081 8.35269 13.1412 8.29692 13.1832 8.22821C13.2252 8.15951 13.2474 8.08055 13.2474 8.00003C13.2474 7.91951 13.2252 7.84056 13.1832 7.77185C13.1412 7.70315 13.081 7.64737 13.0094 7.61066Z",
+        fill: "white"
+      }
+    )
+  }
+), wn = c(xn).attrs({
+  "data-component-name": "icons/SendIcon/SendIcon"
+})`
+  path {
+    fill: ${({ color: e }) => Ue(e)};
+  }
+
+  height: ${({ size: e }) => e || "16px"};
+  width: ${({ size: e }) => e || "16px"};
+`, bn = (e) => /* @__PURE__ */ i("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 14 14", fill: "none", ...e, children: /* @__PURE__ */ i("path", { d: "M10.5 3.5V10.5H3.5V3.5H10.5ZM10.5 2.625H3.5C3.26794 2.625 3.04538 2.71719 2.88128 2.88128C2.71719 3.04538 2.625 3.26794 2.625 3.5V10.5C2.625 10.7321 2.71719 10.9546 2.88128 11.1187C3.04538 11.2828 3.26794 11.375 3.5 11.375H10.5C10.7321 11.375 10.9546 11.2828 11.1187 11.1187C11.2828 10.9546 11.375 10.7321 11.375 10.5V3.5C11.375 3.26794 11.2828 3.04538 11.1187 2.88128C10.9546 2.71719 10.7321 2.625 10.5 2.625Z" }) }), Cn = c(bn).attrs({
+  "data-component-name": "icons/StopIcon/StopIcon"
+})`
+  path {
+    fill: ${({ color: e }) => Ue(e)};
+  }
+
+  height: ${({ size: e }) => e || "16px"};
+  width: ${({ size: e }) => e || "16px"};
+`;
+function kn({
+  placeholder: e = "Ask anything...",
+  className: t,
+  disabled: n,
+  isStreaming: r = !1,
+  onStop: o,
+  modelSelector: a,
+  value: s,
+  onValueChange: l,
+  onSubmit: d,
+  textareaRef: u
+}) {
+  const f = s.trim(), p = !n && f.length > 0 && !r, g = !n && f.length > 0, m = (b) => {
+    l(b.target.value);
+  }, v = () => {
+    !f || n || r || d();
+  }, x = () => {
+    !r || !o || o();
+  };
+  return /* @__PURE__ */ h(Tn, { className: t, $isActive: g, children: [
+    /* @__PURE__ */ i(
+      In,
+      {
+        ref: u,
+        rows: 1,
+        maxLength: Ct,
+        placeholder: e,
+        value: s,
+        disabled: n,
+        spellCheck: !1,
+        onChange: m,
+        onKeyDown: (b) => {
+          b.key === "Enter" && !b.shiftKey && !b.nativeEvent.isComposing && (b.preventDefault(), r && o ? x() : v());
+        }
+      }
+    ),
+    /* @__PURE__ */ h(Sn, { children: [
+      a,
+      r && o ? /* @__PURE__ */ i(
+        Ln,
+        {
+          type: "button",
+          size: "small",
+          "aria-label": "Stop generating",
+          icon: /* @__PURE__ */ i(Cn, { color: "var(--icon-color-on-color)" }),
+          onClick: x
+        }
+      ) : /* @__PURE__ */ i(
+        An,
+        {
+          type: "button",
+          size: "small",
+          "aria-label": "Send message",
+          icon: /* @__PURE__ */ i(wn, { color: "var(--icon-color-on-color)" }),
+          onClick: v,
+          disabled: !p
+        }
+      )
+    ] })
+  ] });
+}
+const Tn = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+  width: 100%;
+  padding: var(--spacing-xs);
+  border: var(--search-ai-conversation-input-border, 1px solid var(--border-color-secondary));
+  border-radius: var(--search-ai-conversation-input-border-radius, var(--border-radius-lg));
+  background-color: var(--layer-color);
+  box-sizing: border-box;
+
+  &:hover,
+  &:focus-within {
+    border-color: transparent;
+    background:
+      linear-gradient(var(--layer-color), var(--layer-color)) padding-box,
+      var(--replay-ai-gradient-soft) border-box;
+  }
+
+  ${({ $isActive: e }) => e && fe`
+      border-color: transparent;
+      background:
+        linear-gradient(var(--layer-color), var(--layer-color)) padding-box,
+        var(--replay-ai-gradient-soft) border-box;
+    `}
+`, In = c.textarea`
+  max-height: 150px;
+  min-height: var(--search-ai-conversation-input-min-height);
+
+  resize: none;
+  border: none;
+  outline: none;
+  padding: 0;
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+  color: var(--text-color-primary);
+  caret-color: var(--text-color-primary);
+  background-color: transparent;
+  field-sizing: content;
+
+  &::placeholder {
+    color: var(--text-color-helper);
+    text-indent: 2px;
+  }
+`, Sn = c.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: var(--spacing-xs);
+`, An = c(V)`
+  box-sizing: border-box;
+  background: var(--search-ai-gradient);
+
+  &:disabled {
+    background: var(--replay-ai-gradient-disabled);
+    border: var(--replay-ai-send-button-disabled-border);
+    width: 24px;
+    height: 24px;
+  }
+`, Ln = c(V)`
+  box-sizing: border-box;
+  background: var(--color-warm-grey-9);
+  border-radius: var(--border-radius-xxl);
+`, Pn = /* @__PURE__ */ new Set(["collection", "workflow", "step", "operation", "workflow-run"]);
+function Qe(e) {
+  return `replay://step?${new URLSearchParams({
+    collectionId: e.collectionId.trim(),
+    workflowId: e.workflowId.trim(),
+    stepId: e.stepId.trim()
+  }).toString()}`;
+}
+function R(e, t) {
+  const n = e.get(t);
+  if (n == null)
+    return null;
+  const r = n.trim();
+  return r.length > 0 ? r : null;
+}
+function En(e) {
+  let t;
+  try {
+    t = new URL(e);
+  } catch {
+    return null;
+  }
+  if (t.protocol !== "replay:")
+    return null;
+  const n = t.hostname.toLowerCase();
+  if (!Pn.has(n))
+    return null;
+  const r = t.searchParams;
+  switch (n) {
+    case "collection": {
+      const o = R(r, "collectionId");
+      return o ? { kind: "collection", collectionId: o } : null;
+    }
+    case "workflow": {
+      const o = R(r, "collectionId"), a = R(r, "workflowId");
+      return !o || !a ? null : { kind: "workflow", collectionId: o, workflowId: a };
+    }
+    case "step": {
+      const o = R(r, "collectionId"), a = R(r, "workflowId"), s = R(r, "stepId");
+      return !o || !a || !s ? null : { kind: "step", collectionId: o, workflowId: a, stepId: s };
+    }
+    case "operation": {
+      const o = R(r, "operationId");
+      return o ? { kind: "operation", operationId: o } : null;
+    }
+    case "workflow-run": {
+      const o = R(r, "collectionId"), a = R(r, "workflowId");
+      if (!o || !a) return null;
+      const s = R(r, "historyId"), l = s === "null" || s === "undefined" ? null : s;
+      return {
+        kind: "workflow-run",
+        collectionId: o,
+        workflowId: a,
+        ...l ? { historyId: l } : {}
+      };
+    }
+    default:
+      return null;
+  }
+}
+function Rn(e, t, n) {
+  return e.tabsState.tabs.get({ noproxy: !0 }).findIndex(({ data: r }) => jt(r, Wt.WorkflowRun) && r.collectionId === t && r.workflowId === n);
+}
+function On(e, t, n, r = {}) {
+  switch (n.kind) {
+    case "collection":
+      t.openCollectionTab({
+        collectionId: n.collectionId,
+        activeTabName: we.COLLECTION_SETTINGS
+      });
+      break;
+    case "workflow":
+      t.openWorkflowTab({
+        collectionId: n.collectionId,
+        workflowId: n.workflowId,
+        activeTabName: we.WORKFLOW_SETTINGS
+      });
+      break;
+    case "step":
+      t.openStepTabFromCollection({
+        collectionId: n.collectionId,
+        workflowId: n.workflowId,
+        stepId: n.stepId,
+        state: X.Normal
+      });
+      break;
+    case "workflow-run": {
+      const o = r.workflowRunHistoryIds?.[nn(n.collectionId, n.workflowId)] ?? [], a = n.historyId && o.includes(n.historyId) ? n.historyId : o.at(-1) ?? n.historyId;
+      if (a) {
+        t.openWorkflowRunTabFromHistory(a, { state: X.Normal });
+        break;
+      }
+      const s = Rn(
+        e,
+        n.collectionId,
+        n.workflowId
+      );
+      if (s !== -1) {
+        e.tabsState.tabs.get({ noproxy: !0 })[s].state === X.Preview && t.changeTabState(s, X.Normal), t.handleTabChange(s);
+        break;
+      }
+      t.openWorkflowRunTab({
+        collectionId: n.collectionId,
+        workflowId: n.workflowId
+      });
+      break;
+    }
+    case "operation": {
+      const o = Qt(e, n.operationId);
+      if (!o.ok) {
+        console.warn("[executeReplayChatLink] Operation not resolved", {
+          operationId: n.operationId,
+          message: o.message
+        });
+        return;
+      }
+      en(
+        e,
+        tn(o.value),
+        t
+      );
+      break;
+    }
+  }
+}
+function $n(e, t, n, r = {}) {
+  const o = En(n);
+  o && On(e, t, o, r);
+}
+function et({
+  workflowRunHistoryIds: e
+} = {}) {
+  const t = Ye(), { getApiOperation: n } = Ut(), {
+    handleTabChange: r,
+    addNewTab: o,
+    openCollectionTab: a,
+    openWorkflowTab: s,
+    openStepTabFromCollection: l,
+    openWorkflowRunTab: d,
+    openWorkflowRunTabFromHistory: u,
+    changeTabState: f
+  } = Yt();
+  return $(
+    (p) => {
+      const g = p.target;
+      if (!(g instanceof Element))
+        return;
+      const m = g.closest("a[href]");
+      if (!(m instanceof HTMLAnchorElement))
+        return;
+      const v = m.getAttribute("href");
+      v?.startsWith("replay:") && (p.preventDefault(), p.stopPropagation(), $n(
+        t,
+        {
+          getApiOperation: n,
+          handleTabChange: r,
+          addNewTab: o,
+          openCollectionTab: a,
+          openWorkflowTab: s,
+          openStepTabFromCollection: l,
+          openWorkflowRunTab: d,
+          openWorkflowRunTabFromHistory: u,
+          changeTabState: f
+        },
+        v,
+        { workflowRunHistoryIds: e }
+      ));
+    },
+    [
+      e,
+      t,
+      n,
+      r,
+      o,
+      a,
+      s,
+      l,
+      d,
+      u,
+      f
+    ]
+  );
+}
+class Dn {
+  diff(t, n, r = {}) {
+    let o;
+    typeof r == "function" ? (o = r, r = {}) : "callback" in r && (o = r.callback);
+    const a = this.castInput(t, r), s = this.castInput(n, r), l = this.removeEmpty(this.tokenize(a, r)), d = this.removeEmpty(this.tokenize(s, r));
+    return this.diffWithOptionsObj(l, d, r, o);
+  }
+  diffWithOptionsObj(t, n, r, o) {
+    var a;
+    const s = (y) => {
+      if (y = this.postProcess(y, r), o) {
+        setTimeout(function() {
+          o(y);
+        }, 0);
+        return;
+      } else
+        return y;
+    }, l = n.length, d = t.length;
+    let u = 1, f = l + d;
+    r.maxEditLength != null && (f = Math.min(f, r.maxEditLength));
+    const p = (a = r.timeout) !== null && a !== void 0 ? a : 1 / 0, g = Date.now() + p, m = [{ oldPos: -1, lastComponent: void 0 }];
+    let v = this.extractCommon(m[0], n, t, 0, r);
+    if (m[0].oldPos + 1 >= d && v + 1 >= l)
+      return s(this.buildValues(m[0].lastComponent, n, t));
+    let x = -1 / 0, w = 1 / 0;
+    const b = () => {
+      for (let y = Math.max(x, -u); y <= Math.min(w, u); y += 2) {
+        let A;
+        const z = m[y - 1], P = m[y + 1];
+        z && (m[y - 1] = void 0);
+        let M = !1;
+        if (P) {
+          const J = P.oldPos - y;
+          M = P && 0 <= J && J < l;
+        }
+        const Z = z && z.oldPos + 1 < d;
+        if (!M && !Z) {
+          m[y] = void 0;
+          continue;
+        }
+        if (!Z || M && z.oldPos < P.oldPos ? A = this.addToPath(P, !0, !1, 0, r) : A = this.addToPath(z, !1, !0, 1, r), v = this.extractCommon(A, n, t, y, r), A.oldPos + 1 >= d && v + 1 >= l)
+          return s(this.buildValues(A.lastComponent, n, t)) || !0;
+        m[y] = A, A.oldPos + 1 >= d && (w = Math.min(w, y - 1)), v + 1 >= l && (x = Math.max(x, y + 1));
+      }
+      u++;
+    };
+    if (o)
+      (function y() {
+        setTimeout(function() {
+          if (u > f || Date.now() > g)
+            return o(void 0);
+          b() || y();
+        }, 0);
+      })();
+    else
+      for (; u <= f && Date.now() <= g; ) {
+        const y = b();
+        if (y)
+          return y;
+      }
+  }
+  addToPath(t, n, r, o, a) {
+    const s = t.lastComponent;
+    return s && !a.oneChangePerToken && s.added === n && s.removed === r ? {
+      oldPos: t.oldPos + o,
+      lastComponent: { count: s.count + 1, added: n, removed: r, previousComponent: s.previousComponent }
+    } : {
+      oldPos: t.oldPos + o,
+      lastComponent: { count: 1, added: n, removed: r, previousComponent: s }
+    };
+  }
+  extractCommon(t, n, r, o, a) {
+    const s = n.length, l = r.length;
+    let d = t.oldPos, u = d - o, f = 0;
+    for (; u + 1 < s && d + 1 < l && this.equals(r[d + 1], n[u + 1], a); )
+      u++, d++, f++, a.oneChangePerToken && (t.lastComponent = { count: 1, previousComponent: t.lastComponent, added: !1, removed: !1 });
+    return f && !a.oneChangePerToken && (t.lastComponent = { count: f, previousComponent: t.lastComponent, added: !1, removed: !1 }), t.oldPos = d, u;
+  }
+  equals(t, n, r) {
+    return r.comparator ? r.comparator(t, n) : t === n || !!r.ignoreCase && t.toLowerCase() === n.toLowerCase();
+  }
+  removeEmpty(t) {
+    const n = [];
+    for (let r = 0; r < t.length; r++)
+      t[r] && n.push(t[r]);
+    return n;
+  }
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  castInput(t, n) {
+    return t;
+  }
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  tokenize(t, n) {
+    return Array.from(t);
+  }
+  join(t) {
+    return t.join("");
+  }
+  postProcess(t, n) {
+    return t;
+  }
+  get useLongestToken() {
+    return !1;
+  }
+  buildValues(t, n, r) {
+    const o = [];
+    let a;
+    for (; t; )
+      o.push(t), a = t.previousComponent, delete t.previousComponent, t = a;
+    o.reverse();
+    const s = o.length;
+    let l = 0, d = 0, u = 0;
+    for (; l < s; l++) {
+      const f = o[l];
+      if (f.removed)
+        f.value = this.join(r.slice(u, u + f.count)), u += f.count;
+      else {
+        if (!f.added && this.useLongestToken) {
+          let p = n.slice(d, d + f.count);
+          p = p.map(function(g, m) {
+            const v = r[u + m];
+            return v.length > g.length ? v : g;
+          }), f.value = this.join(p);
+        } else
+          f.value = this.join(n.slice(d, d + f.count));
+        d += f.count, f.added || (u += f.count);
+      }
+    }
+    return o;
+  }
+}
+class Mn extends Dn {
+  constructor() {
+    super(...arguments), this.tokenize = Vn;
+  }
+  equals(t, n, r) {
+    return r.ignoreWhitespace ? ((!r.newlineIsToken || !t.includes(`
+`)) && (t = t.trim()), (!r.newlineIsToken || !n.includes(`
+`)) && (n = n.trim())) : r.ignoreNewlineAtEof && !r.newlineIsToken && (t.endsWith(`
+`) && (t = t.slice(0, -1)), n.endsWith(`
+`) && (n = n.slice(0, -1))), super.equals(t, n, r);
+  }
+}
+const zn = new Mn();
+function _n(e, t, n) {
+  return zn.diff(e, t, n);
+}
+function Vn(e, t) {
+  t.stripTrailingCr && (e = e.replace(/\r\n/g, `
+`));
+  const n = [], r = e.split(/(\n|\r\n)/);
+  r[r.length - 1] || r.pop();
+  for (let o = 0; o < r.length; o++) {
+    const a = r[o];
+    o % 2 && !t.newlineIsToken ? n[n.length - 1] += a : n.push(a);
+  }
+  return n;
+}
+const Hn = 500;
+function Bn(e, t) {
+  const n = Nn(e, t);
+  if (n.length === 0) return [];
+  const r = [];
+  let o = 0;
+  for (; o < n.length; ) {
+    let a = o;
+    const s = n[o].type === "context";
+    for (; a < n.length && n[a].type === "context" === s; ) a++;
+    const l = n.slice(o, a);
+    r.push({
+      start: o,
+      end: a,
+      rows: l,
+      hasAdditions: l.some((d) => d.type === "add"),
+      hasRemovals: l.some((d) => d.type === "remove")
+    }), o = a;
+  }
+  return r;
+}
+function Nn(e, t) {
+  if (e === void 0)
+    return t === void 0 ? [] : W(t, "add");
+  if (t === void 0) return W(e, "remove");
+  if (e === t) return W(t, "context");
+  const n = Fn(e, t);
+  return n ? n.flatMap(
+    (r) => W(r.value, r.added ? "add" : r.removed ? "remove" : "context")
+  ) : [...W(e, "remove"), ...W(t, "add")];
+}
+function Fn(e, t) {
+  try {
+    return _n(e, t, { timeout: Hn });
+  } catch {
+    return;
+  }
+}
+function W(e, t) {
+  const n = e.split(`
+`);
+  return n.length > 1 && n[n.length - 1] === "" && n.pop(), n.map((r) => ({ type: t, text: r }));
+}
+const Ce = 1, ke = (e) => e && e.hasAdditions !== e.hasRemovals, Te = (e) => e && (e.hasAdditions || e.hasRemovals);
+function jn(e, t, n) {
+  if (e.hasAdditions || e.hasRemovals)
+    return Q(e.rows);
+  const r = n[t - 1], o = n[t + 1], a = ke(r) ? Ce : 0, s = ke(o) ? Ce : 0;
+  if (a + s >= e.rows.length) return Q(e.rows);
+  const l = e.rows.slice(0, a), d = s > 0 ? e.rows.slice(-s) : [], u = [];
+  return u.push(...Q(l)), Te(r) && Te(o) && u.push({ kind: "separator" }), u.push(...Q(d)), u;
+}
+function Q(e) {
+  return e.map((t) => ({
+    kind: "row",
+    row: t
+  }));
+}
+const Wn = 200;
+function Ie({ oldValue: e, newValue: t }) {
+  const n = S(() => Bn(e, t), [e, t]), r = S(() => n.flatMap(jn), [n]);
+  return S(() => n.some((a) => a.hasAdditions || a.hasRemovals), [n]) ? /* @__PURE__ */ i(Yn, { $maxHeight: Wn, children: r.map((a, s) => {
+    if (a.kind === "separator")
+      return /* @__PURE__ */ i(Jn, { children: /* @__PURE__ */ i(Se, { children: "···" }) }, s);
+    const { row: l } = a, d = Un(l.type);
+    return /* @__PURE__ */ h(d, { children: [
+      /* @__PURE__ */ h(Zn, { children: [
+        l.type === "remove" && /* @__PURE__ */ i(kt, { size: "12px" }),
+        l.type === "add" && /* @__PURE__ */ i(Tt, { size: "12px" })
+      ] }),
+      /* @__PURE__ */ i(Se, { children: l.text === "" ? " " : l.text })
+    ] }, s);
+  }) }) : null;
+}
+function Un(e) {
+  return e === "remove" ? Gn : e === "add" ? Kn : qn;
+}
+const Yn = c.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  min-width: 0;
+  max-height: ${({ $maxHeight: e }) => e}px;
+  overflow-y: auto;
+  border-radius: var(--border-radius);
+  &::-webkit-scrollbar-track {
+    margin: var(--spacing-xxs) 0;
+  }
+`, se = c.div`
+  display: flex;
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+  font-weight: var(--font-weight-regular);
+  padding-right: var(--spacing-xxs);
+`, Gn = c(se)`
+  background: var(--admonition-danger-bg-color);
+  color: var(--color-raspberry-7);
+`, Kn = c(se)`
+  background: var(--admonition-success-bg-color);
+  color: var(--color-green-7);
+`, qn = c(se)`
+  background: transparent;
+  color: var(--text-color-secondary);
+`, Zn = c.span`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 16px;
+  height: 20px;
+  flex-shrink: 0;
+`, Se = c.span`
+  width: 100%;
+  min-width: 0;
+  line-height: var(--line-height-sm);
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-regular);
+  white-space: pre-wrap;
+  word-break: break-all;
+`, Jn = c(se)`
+  user-select: none;
+`, Xn = (e) => typeof e != "object" || e === null ? !1 : "kind" in e && e.kind === "batch" ? "changes" in e ? Array.isArray(e.changes) && e.changes.every(Ae) : !1 : Ae(e);
+function Ae(e) {
+  return typeof e != "object" || e === null || !("id" in e) || !("target" in e) || !("included" in e) || !("kind" in e) ? !1 : e.kind === "single";
+}
+const Qn = {
+  approveLabel: "Approve",
+  denyLabel: "Deny"
+};
+function er(e, t) {
+  const n = T(t, "action");
+  if (n) {
+    const o = rn[n];
+    if (o) return o;
+  }
+  const r = on[e];
+  return r || Qn;
+}
+function T(e, t) {
+  if (!e || typeof e != "object") return null;
+  const n = e.payload;
+  if (!n || typeof n != "object") return null;
+  const r = n[t];
+  return typeof r != "string" ? null : r.trim() || null;
+}
+function Le(e, t) {
+  if (!(typeof t > "u"))
+    return e ? `${e}: ${t}` : t;
+}
+function tr(e) {
+  return e ? "changes" in e ? Array.isArray(e.changes) ? e.changes.map((t) => !t || typeof t != "object" || !("approved" in t) ? !1 : t.approved === !0) : [] : [] : [];
+}
+function nr(e, t) {
+  if (!e || typeof e != "object") return;
+  const n = oe(e, pe), r = oe(n, he);
+  if (!(t in r)) return;
+  const o = r[t];
+  if (Array.isArray(o) && o.length !== 0 && o.every(Xn))
+    return o;
+}
+function tt(e, t) {
+  return an(e) && Ze(e) && e.toolCallId === t;
+}
+function rr(e, t, n) {
+  const r = e.parts.map((d) => tt(d, t) ? { ...d, input: or(d.input, n) } : d), o = e.metadata && typeof e.metadata == "object" ? e.metadata : {}, a = oe(o, pe), l = { ...oe(a, he), [t]: Gt(n) };
+  return {
+    ...e,
+    parts: r,
+    metadata: {
+      ...o,
+      [pe]: {
+        ...a,
+        [he]: l
+      }
+    }
+  };
+}
+function oe(e, t) {
+  const n = e[t];
+  return typeof n == "object" && n !== null ? n : {};
+}
+function or(e, t) {
+  if (!e || !("changes" in e) || !Array.isArray(e.changes)) return e;
+  const { changes: n, ...r } = e;
+  return {
+    ...r,
+    changes: n.map((o, a) => ({
+      ...o,
+      approved: t[a]?.included ?? !1
+    }))
+  };
+}
+function ir({
+  preview: e,
+  isIncluded: t,
+  onToggle: n,
+  readOnly: r
+}) {
+  if (e.kind === "batch")
+    return /* @__PURE__ */ i(
+      Pe,
+      {
+        isIncluded: t,
+        onToggle: n,
+        readOnly: r,
+        primaryLabel: e.target.type,
+        children: /* @__PURE__ */ i(vr, { children: e.changes.map((l) => /* @__PURE__ */ i(
+          Ie,
+          {
+            oldValue: Le(l.target.key, l.oldValue),
+            newValue: Le(l.target.key, l.newValue)
+          },
+          l.id
+        )) })
+      }
+    );
+  const { target: o, oldValue: a, newValue: s } = e;
+  return /* @__PURE__ */ i(
+    Pe,
+    {
+      isIncluded: t,
+      onToggle: n,
+      readOnly: r,
+      primaryLabel: o.key ?? o.type,
+      categoryLabel: o.key ? o.type : void 0,
+      children: /* @__PURE__ */ i(Ie, { oldValue: a, newValue: s })
+    }
+  );
+}
+function Pe({
+  isIncluded: e,
+  onToggle: t,
+  readOnly: n,
+  primaryLabel: r,
+  categoryLabel: o,
+  children: a
+}) {
+  return /* @__PURE__ */ h(ar, { $dimmed: n && !e, children: [
+    /* @__PURE__ */ h(sr, { children: [
+      n ? /* @__PURE__ */ i(pr, { children: e ? /* @__PURE__ */ i(hr, { size: "16px" }) : /* @__PURE__ */ i(gr, { size: "16px" }) }) : /* @__PURE__ */ h(ur, { children: [
+        /* @__PURE__ */ i(dr, { checked: e }),
+        /* @__PURE__ */ i(fr, { type: "checkbox", checked: e, onChange: t })
+      ] }),
+      /* @__PURE__ */ i(cr, { children: r }),
+      o ? /* @__PURE__ */ i(lr, { children: o }) : null
+    ] }),
+    a
+  ] });
+}
+const ar = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+  min-width: 0;
+  padding: var(--spacing-xs);
+  border-bottom: 1px solid var(--border-color-secondary);
+  box-sizing: border-box;
+  opacity: ${({ $dimmed: e }) => e ? 0.4 : 1};
+  &:last-child {
+    border-bottom: none;
+  }
+`, sr = c.div`
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  min-width: 0;
+`, cr = c.span`
+  flex: 1;
+  min-width: 0;
+  color: var(--text-color-primary);
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-medium);
+  line-height: var(--line-height-sm);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`, lr = c.span`
+  flex-shrink: 0;
+  font-family: var(--code-block-font-family, var(--font-family-monospace, monospace));
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-secondary);
+`, dr = c(At).attrs({ "aria-hidden": !0 })`
+  --checkbox-border-color: var(--color-blueberry-6);
+  --checkbox-box-color: var(--color-blueberry-6);
+  --checkbox-box-color-active: var(--color-blueberry-6);
+`, ur = c.span`
+  position: relative;
+  display: inline-flex;
+  flex-shrink: 0;
+  width: 16px;
+  height: 16px;
+`, fr = c.input`
+  position: absolute;
+  inset: 0;
+  width: 16px;
+  height: 16px;
+  margin: 0;
+  opacity: 0;
+  cursor: pointer;
+`, pr = c.span`
+  display: inline-flex;
+  flex-shrink: 0;
+  width: 16px;
+  height: 16px;
+  align-items: center;
+  justify-content: center;
+`, hr = c(It)`
+  color: var(--color-success-base);
+`, gr = c(St)`
+  color: var(--text-color-description);
+`, vr = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xxs);
+  min-width: 0;
+`;
+function nt({
+  previews: e,
+  handleToggle: t,
+  readOnly: n
+}) {
+  return e.length === 0 ? null : /* @__PURE__ */ i(mr, { children: e.map((r, o) => /* @__PURE__ */ i(
+    ir,
+    {
+      preview: r,
+      isIncluded: r.included,
+      onToggle: t ? () => t(o) : void 0,
+      readOnly: n
+    },
+    r.id
+  )) });
+}
+const mr = c.div`
+  display: flex;
+  flex-direction: column;
+`, yr = {
+  update_step: br,
+  update_security: Cr,
+  run_request: Ir,
+  web_search: Sr,
+  manage_environment: kr,
+  manage_collection: Tr
+};
+function xr(e, t) {
+  const n = yr[e];
+  return n ? n(t) : wr(e);
+}
+function wr(e) {
+  return [{ kind: "text", text: e.split("_").map((n) => n.charAt(0).toUpperCase() + n.slice(1)).join(" ") }];
+}
+function br(e) {
+  return rt(e, "Update step");
+}
+function Cr(e) {
+  return rt(e, "Update security");
+}
+function rt(e, t) {
+  const { collectionId: n, workflowId: r, stepId: o } = Ar(e);
+  return !n || !r || !o ? I(t) : ot(
+    `${t} `,
+    Qe({ collectionId: n, workflowId: r, stepId: o }),
+    o
+  );
+}
+function I(e) {
+  return [{ kind: "text", text: e }];
+}
+function E(e, t) {
+  return t ? `${e} "${t}"` : e;
+}
+function ot(e, t, n) {
+  return [
+    { kind: "text", text: e },
+    { kind: "link", href: t, label: n }
+  ];
+}
+function kr(e) {
+  const t = T(e, "action"), n = T(e, "environment"), r = n ? ` in environment "${n}"` : "";
+  switch (t) {
+    case "add_environment":
+      return I(E("Add environment", n));
+    case "set_active_environment":
+      return I(
+        n ? `Switch active environment to ${n}` : "Switch active environment"
+      );
+    case "upsert_input":
+      return I(E("Set input", T(e, "name")) + r);
+    case "remove_input":
+      return I(
+        E("Remove input", T(e, "inputName")) + r
+      );
+    case "upsert_server":
+      return I(E("Set server", T(e, "apiId")) + r);
+    case "remove_server":
+      return I(
+        E("Remove server", T(e, "apiId")) + r
+      );
+    default:
+      return I("Manage environment");
+  }
+}
+function Tr(e) {
+  switch (T(e, "action")) {
+    case "create_collection":
+      return I(E("Create collection", T(e, "title")));
+    case "delete_collection":
+      return I(
+        E("Delete collection", T(e, "collectionId"))
+      );
+    case "create_workflow":
+      return I(E("Create workflow", T(e, "name")));
+    case "delete_workflow":
+      return I(E("Delete workflow", T(e, "workflowId")));
+    case "create_step":
+      return I(E("Create step", T(e, "stepName")));
+    case "delete_step": {
+      const n = T(e, "collectionId"), r = T(e, "workflowId"), o = T(e, "stepId");
+      return !n || !r || !o ? I("Delete step") : ot(
+        "Delete step ",
+        Qe({ collectionId: n, workflowId: r, stepId: o }),
+        o
+      );
+    }
+    case "save_tab_to_collection":
+      return I(
+        E("Save tab as step", T(e, "newStepName"))
+      );
+    default:
+      return I("Manage collection");
+  }
+}
+function Ir() {
+  return [{ kind: "text", text: "Run current request" }];
+}
+function Sr(e) {
+  return [
+    {
+      kind: "text",
+      text: "Search the web at "
+    },
+    {
+      kind: "link",
+      href: e.url,
+      label: e.url
+    }
+  ];
+}
+function Ar(e) {
+  return {
+    collectionId: de(e, "collectionId"),
+    workflowId: de(e, "workflowId"),
+    stepId: de(e, "stepId")
+  };
+}
+function de(e, t) {
+  if (!e || !(t in e)) return null;
+  const n = e[t];
+  return typeof n == "string" && n.trim() || null;
+}
+function it({ toolName: e, input: t }) {
+  const n = xr(e, t), r = et();
+  return /* @__PURE__ */ i(Lr, { onClick: r, children: /* @__PURE__ */ i(Pr, { children: n.map(
+    (o, a) => o.kind === "text" ? /* @__PURE__ */ i("span", { children: o.text }, a) : /* @__PURE__ */ i(Er, { href: o.href, children: o.label }, a)
+  ) }) });
+}
+const Lr = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+  min-width: 0;
+  padding: var(--spacing-xs) var(--spacing-sm);
+
+  &:not(:last-child) {
+    border-bottom: 1px solid var(--border-color-secondary);
+  }
+`, Pr = c.span`
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-primary);
+`, Er = c.a`
+  color: var(--link-color-primary);
+  cursor: pointer;
+  text-decoration: none;
+
+  &:hover {
+    color: var(--link-color-primary, var(--text-color-link));
+  }
+`;
+function C({
+  id: e,
+  targetType: t,
+  targetKey: n,
+  oldValue: r,
+  newValue: o
+}) {
+  return {
+    kind: "single",
+    id: e,
+    target: n === void 0 ? { type: t } : { type: t, key: n },
+    oldValue: r,
+    newValue: o,
+    included: !0
+  };
+}
+function _(e, t) {
+  return C({ id: e, targetType: t, oldValue: void 0, newValue: void 0 });
+}
+function G({
+  data: e,
+  baseId: t,
+  targetType: n,
+  batchTargetKey: r,
+  getOldValue: o,
+  getNewValue: a = (l, d) => String(d ?? ""),
+  resolveTargetKey: s = (l) => l
+}) {
+  const l = Object.entries(e).filter(([, f]) => f !== void 0);
+  if (l.length === 0)
+    return _(t, n);
+  if (l.length >= 2) {
+    const f = l.map(
+      ([g, m]) => C({
+        id: `${t}:${g}`,
+        targetType: n,
+        targetKey: s(g),
+        oldValue: o(g),
+        newValue: a(g, m)
+      })
+    );
+    return { kind: "batch", id: t, target: r !== void 0 ? { type: n, key: r } : { type: n }, changes: f, included: !0 };
+  }
+  const [d, u] = l[0];
+  return C({
+    id: t,
+    targetType: n,
+    targetKey: s(d),
+    oldValue: o(d),
+    newValue: a(d, u)
+  });
+}
+function Rr({
+  store: e,
+  input: t
+}) {
+  if (!Or(t)) return [];
+  const n = /* @__PURE__ */ new Map(), r = (o) => {
+    const a = n.get(o);
+    if (a) return a;
+    const s = Je(e, t.collectionId, t.workflowId, o), l = s.ok ? s.value : null, d = l ? Array.from(l.security.get({ noproxy: !0 })) : [];
+    return n.set(o, d), d;
+  };
+  return t.changes.map((o, a) => {
+    const s = o.stepId?.trim(), l = s || t.stepId;
+    return $r(r(l), o, a, s);
+  });
+}
+function Or(e) {
+  if (typeof e != "object" || e === null) return !1;
+  const t = e;
+  return typeof t.collectionId == "string" && typeof t.workflowId == "string" && typeof t.stepId == "string" && Array.isArray(t.changes) && t.changes.length > 0;
+}
+function H(e, t) {
+  return e ? t ? `${e}: ${t}` : e : t;
+}
+function $r(e, t, n, r) {
+  const o = `security[${n}]`;
+  switch (t.action) {
+    case k.ADD: {
+      const { type: a, schemeId: s, data: l } = t;
+      return !l || Object.keys(l).length === 0 ? C({
+        id: o,
+        targetType: a,
+        targetKey: H(r, s),
+        oldValue: void 0,
+        newValue: a
+      }) : G({
+        data: l,
+        baseId: o,
+        targetType: a,
+        batchTargetKey: H(r, s),
+        getOldValue: () => {
+        },
+        resolveTargetKey: (d) => H(r, d)
+      });
+    }
+    case k.UPDATE: {
+      const { type: a, schemeId: s, data: l } = t, d = t.index !== void 0 ? e[t.index] : void 0;
+      return !l || Object.keys(l).length === 0 ? C({
+        id: o,
+        targetType: a,
+        targetKey: H(r, s),
+        oldValue: Re(d),
+        newValue: a
+      }) : G({
+        data: l,
+        baseId: o,
+        targetType: a,
+        batchTargetKey: H(r, s),
+        getOldValue: (u) => d ? Dr(d, u) : void 0,
+        resolveTargetKey: (u) => H(r, u)
+      });
+    }
+    case k.REMOVE: {
+      const a = sn(e, t), s = a.ok ? a.entry : void 0;
+      return C({
+        id: o,
+        targetType: s?.securityType ?? "Security",
+        targetKey: H(r, st(s)),
+        oldValue: Re(s),
+        newValue: void 0
+      });
+    }
+  }
+}
+function Dr(e, t) {
+  switch (e.securityType) {
+    case N.NoAuth:
+      return;
+    case N.OAuth2:
+      return Ee(e[N.OAuth2], t);
+    case N.OpenIDConnect: {
+      const n = e[N.OpenIDConnect];
+      return t === "openIdConnectUrl" ? n.openIdConnectUrl || void 0 : t === "userInfoUrl" ? n.userInfoUrl || void 0 : Ee(n, t);
+    }
+    default: {
+      const n = e[e.securityType];
+      return at(n, t);
+    }
+  }
+}
+function Ee(e, t) {
+  if (t === "grantType") return e.grantType || void 0;
+  if (!e.grantType) return;
+  const n = e[e.grantType];
+  return at(n, t);
+}
+function at(e, t) {
+  const n = e[t];
+  return n !== void 0 && n !== "" ? String(n) : void 0;
+}
+function Re(e) {
+  if (!e || e.securityType === N.NoAuth) return;
+  const t = st(e);
+  return t ? `${e.securityType} (${t})` : e.securityType;
+}
+function st(e) {
+  return !e || e.securityType === N.NoAuth ? void 0 : e[e.securityType]?.schemeName || void 0;
+}
+function Mr({
+  store: e,
+  input: t
+}) {
+  if (!zr(t)) return [];
+  const n = Je(e, t.collectionId, t.workflowId, t.stepId), r = n.ok ? n.value : null;
+  return t.changes.map((o, a) => _r(r, o, a));
+}
+function zr(e) {
+  return typeof e != "object" || e === null ? !1 : "collectionId" in e && "workflowId" in e && "stepId" in e && "changes" in e && Array.isArray(e.changes) && e.changes.length > 0 && typeof e.collectionId == "string" && typeof e.workflowId == "string" && typeof e.stepId == "string";
+}
+function _r(e, t, n) {
+  const r = t.id ?? `${t.field}[${n}]`;
+  switch (t.field) {
+    case "method":
+    case "url":
+    case "description":
+      return Vr(e, t, r);
+    case "parameters":
+      return Hr(e, t, r);
+    case "outputs":
+      return Br(e, t, r);
+    case "body":
+      return Nr(e, t, r);
+    case "successCriteria":
+      return Fr(e, t, r);
+  }
+}
+function Vr(e, t, n) {
+  const r = ee(t.field);
+  switch (t.action) {
+    case k.ADD:
+      return C({
+        id: n,
+        targetType: r,
+        oldValue: void 0,
+        newValue: t.data
+      });
+    case k.UPDATE:
+      return C({
+        id: n,
+        targetType: r,
+        oldValue: Oe(e, t.field),
+        newValue: t.data
+      });
+    case k.REMOVE:
+      return C({
+        id: n,
+        targetType: r,
+        oldValue: Oe(e, t.field),
+        newValue: void 0
+      });
+  }
+}
+function Hr(e, t, n) {
+  switch (t.action) {
+    case k.ADD: {
+      if (!t.data) return _(n, "parameter");
+      const { in: r, name: o, value: a } = t.data;
+      return C({
+        id: n,
+        targetType: ee(r),
+        targetKey: o,
+        oldValue: void 0,
+        newValue: a
+      });
+    }
+    case k.UPDATE: {
+      if (!t.id && !t.data?.name) return _(n, "parameter");
+      const r = $e(e, t), o = t.data?.in ?? r?.in ?? "parameter";
+      return C({
+        id: n,
+        targetType: ee(o),
+        targetKey: t.data?.name ?? r?.key,
+        oldValue: r ? r.value ?? "" : void 0,
+        newValue: t.data?.value
+      });
+    }
+    case k.REMOVE: {
+      if (!t.id && !t.data?.name) return _(n, "parameter");
+      const r = $e(e, t), o = t.data?.in ?? r?.in ?? "parameter";
+      return C({
+        id: n,
+        targetType: ee(o),
+        targetKey: r?.key ?? t.data?.name,
+        oldValue: r ? r.value ?? "" : void 0,
+        newValue: void 0
+      });
+    }
+  }
+}
+function Br(e, t, n) {
+  switch (t.action) {
+    case k.ADD:
+      return t.data ? C({
+        id: n,
+        targetType: "Output",
+        targetKey: t.data.name,
+        oldValue: void 0,
+        newValue: t.data.expression
+      }) : C({
+        id: n,
+        targetType: "Output",
+        oldValue: void 0,
+        newValue: void 0
+      });
+    case k.UPDATE: {
+      if (!t.data)
+        return C({
+          id: n,
+          targetType: "Output",
+          oldValue: void 0,
+          newValue: void 0
+        });
+      const r = t.id && e ? Me(e, t.id) : void 0;
+      return C({
+        id: n,
+        targetType: "Output",
+        targetKey: t.data.name,
+        oldValue: r?.value,
+        newValue: t.data.expression
+      });
+    }
+    case k.REMOVE: {
+      if (!t.id && !t.data?.name) return _(n, "Output");
+      let r = t.id && e ? Me(e, t.id) : void 0;
+      return !r && e && t.data?.name && (r = Ur(e, t.data.name)), C({
+        id: n,
+        targetType: "Output",
+        targetKey: r?.key ?? t.data?.name,
+        oldValue: r?.value,
+        newValue: void 0
+      });
+    }
+  }
+}
+function Nr(e, t, n) {
+  const { data: r } = t;
+  switch (t.action) {
+    case k.ADD:
+      return G({
+        data: r,
+        baseId: n,
+        targetType: "Body",
+        getOldValue: () => {
+        },
+        getNewValue: (o) => o === "content" ? ue(r.content, r.contentType) : ae(r[o]),
+        resolveTargetKey: (o) => o === "content" ? void 0 : o
+      });
+    case k.UPDATE: {
+      const o = e?.requestBody.type.get(), a = r.contentType ?? o;
+      return G({
+        data: r,
+        baseId: n,
+        targetType: "Body",
+        getOldValue: (s) => {
+          if (e) {
+            if (s === "content")
+              return ue(e.requestBody.content.get(), o) || void 0;
+            if (s === "contentType") return o;
+          }
+        },
+        getNewValue: (s) => s === "content" ? ue(r.content, a) : ae(r[s]),
+        resolveTargetKey: (s) => s === "content" ? void 0 : s
+      });
+    }
+    case k.REMOVE: {
+      const o = e ? me({
+        contentType: e.requestBody.type.get(),
+        content: e.requestBody.content.get()
+      }) : void 0;
+      return C({
+        id: n,
+        targetType: "Body",
+        oldValue: o,
+        newValue: void 0
+      });
+    }
+  }
+}
+function Fr(e, t, n) {
+  switch (t.action) {
+    case k.ADD:
+      return t.data ? G({
+        data: t.data,
+        baseId: n,
+        targetType: "successCriteria",
+        getOldValue: () => {
+        },
+        getNewValue: (r) => ae(t.data[r])
+      }) : _(n, "successCriteria");
+    case k.UPDATE: {
+      if (!t.data) return _(n, "successCriteria");
+      const r = typeof t.id == "string" && e ? De(e, t.id) : void 0;
+      return G({
+        data: t.data,
+        baseId: n,
+        targetType: "successCriteria",
+        getOldValue: (o) => {
+          if (r) {
+            if (o === "condition") return r.condition;
+            if (o === "context") return r.context ?? void 0;
+            if (o === "type") return r.type;
+          }
+        },
+        getNewValue: (o) => ae(t.data[o])
+      });
+    }
+    case k.REMOVE: {
+      if (typeof t.id != "string") return _(n, "successCriteria");
+      const r = e ? De(e, t.id) : void 0;
+      return C({
+        id: n,
+        targetType: "successCriteria",
+        targetKey: r?.condition,
+        oldValue: r ? me(r) : void 0,
+        newValue: void 0
+      });
+    }
+  }
+}
+function Oe(e, t) {
+  if (e)
+    switch (t) {
+      case "method":
+        return e.xOperation.ornull?.method.get();
+      case "url":
+        return e.xOperation.ornull?.url.get();
+      case "description":
+        return e.description.get();
+    }
+}
+function $e(e, t) {
+  let n = t.id && e ? jr(e, t.id) : null;
+  return !n && e && t.data?.name && (n = Wr(e, t.data.name)), n;
+}
+function ct(e, t) {
+  for (const n of ["path", "query", "header", "cookie"]) {
+    const r = e.parameters[cn[n]].get().find((o) => Kt(o) && t(o));
+    if (r) return r;
+  }
+  return null;
+}
+function jr(e, t) {
+  return ct(e, (n) => n.id === t);
+}
+function Wr(e, t) {
+  return ct(e, (n) => n.key === t);
+}
+function De(e, t) {
+  return e.successCriteria.get().find((n) => n.condition === t);
+}
+function lt(e, t) {
+  for (const n of e.outputs.get())
+    if (t(n))
+      return {
+        key: ie(n.key),
+        value: ie(n.value)
+      };
+}
+function Me(e, t) {
+  return lt(e, (n) => ie(n.id) === t);
+}
+function Ur(e, t) {
+  return lt(e, (n) => ie(n.key) === t);
+}
+function ie(e) {
+  return typeof e == "string" ? e : e.get();
+}
+function ae(e) {
+  return e == null ? "" : typeof e == "string" ? e : me(e);
+}
+function ue(e, t) {
+  if (!e || t !== qt.JSON) return e;
+  try {
+    return JSON.stringify(JSON.parse(e), null, 2);
+  } catch {
+    return e;
+  }
+}
+const Yr = {
+  update_security: Rr,
+  update_step: Mr
+};
+function dt(e, t) {
+  const n = Ye(), r = S(() => {
+    const d = e ? Yr[e] : void 0;
+    if (!d) return [];
+    try {
+      return d({ store: n, input: t });
+    } catch (u) {
+      return console.error("Unable to build change previews", u), [];
+    }
+  }, [e, n, t]), [o, a] = K(
+    () => Object.fromEntries(r.map((d) => [d.id, d.included]))
+  ), s = S(
+    () => r.map((d) => ({ ...d, included: o[d.id] ?? d.included })),
+    [r, o]
+  ), l = $(
+    (d) => {
+      a(typeof d == "function" ? (u) => {
+        const f = r.map((p) => ({
+          ...p,
+          included: u[p.id] ?? p.included
+        }));
+        return Object.fromEntries(d(f).map((p) => [p.id, p.included]));
+      } : Object.fromEntries(d.map((u) => [u.id, u.included])));
+    },
+    [r]
+  );
+  return { previews: s, setPreviews: l };
+}
+function Gr({
+  toolCallId: e,
+  toolName: t,
+  input: n,
+  onApprove: r,
+  onDeny: o
+}) {
+  const { updateMessages: a } = q(), { previews: s, setPreviews: l } = dt(t, n), { includedCount: d, totalCount: u } = S(
+    () => ({
+      includedCount: s.filter((v) => v.included).length,
+      totalCount: s.length
+    }),
+    [s]
+  ), { approveLabel: f, denyLabel: p } = S(
+    () => er(t, n),
+    [t, n]
+  ), g = $(() => {
+    a((v) => {
+      const x = [];
+      for (let w = 0; w < v.length; w++) {
+        const b = v[w], { parts: y } = b, A = b.role === "assistant", z = y.some(
+          (P) => tt(P, e)
+        );
+        if (A && z) {
+          const P = rr(b, e, s);
+          x.push({ index: w, message: P });
+        }
+      }
+      return x;
+    }), r();
+  }, [s, r, a, e]), m = $(
+    (v) => {
+      l(
+        (x) => x.map(
+          (w, b) => b === v ? { ...w, included: !w.included } : w
+        )
+      );
+    },
+    [l]
+  );
+  return /* @__PURE__ */ h(Kr, { children: [
+    /* @__PURE__ */ i(it, { toolName: t, input: n }),
+    s.length ? /* @__PURE__ */ i(qr, { children: /* @__PURE__ */ i(nt, { previews: s, handleToggle: m }) }) : null,
+    s.length ? /* @__PURE__ */ i(Ge, {}) : null,
+    /* @__PURE__ */ h(Zr, { children: [
+      u > 1 ? /* @__PURE__ */ h(Jr, { children: [
+        d,
+        " of ",
+        u,
+        " selected"
+      ] }) : null,
+      /* @__PURE__ */ i(Xr, { size: "small", variant: "secondary", onClick: o, children: p }),
+      /* @__PURE__ */ i(
+        Qr,
+        {
+          size: "small",
+          variant: "primary",
+          onClick: g,
+          disabled: u > 0 ? d === 0 : !1,
+          children: f
+        }
+      )
+    ] })
+  ] });
+}
+const Kr = c.div`
+  display: flex;
+  color: var(--text-color-primary);
+  flex-direction: column;
+  gap: var(--spacing-xs);
+  width: 100%;
+  min-width: 0;
+  border-radius: var(--border-radius-md, 10px);
+  border: 1px solid var(--border-color-secondary);
+  background: var(--layer-color);
+  line-height: var(--line-height-sm);
+`, qr = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+  min-width: 0;
+`, Zr = c.div`
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  align-items: center;
+  padding: 0 var(--spacing-sm) var(--spacing-xs) var(--spacing-sm);
+  gap: var(--spacing-xxs);
+`, Jr = c.span`
+  flex: 1;
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-secondary);
+`, Xr = c(V)`
+  background: none;
+`, Qr = c(V)`
+  border: 1px solid var(--button-bg-color);
+  padding-top: 0;
+  padding-bottom: 0;
+  &:disabled {
+    border: 1px solid var(--button-border-color-disabled);
+  }
+`;
+function eo({
+  approvalId: e,
+  toolCallId: t,
+  toolName: n,
+  input: r
+}) {
+  const { addToolApprovalResponse: o } = q(), a = $(() => {
+    o({ id: e, approved: !0 });
+  }, [e, o]), s = $(() => {
+    o({ id: e, approved: !1 });
+  }, [e, o]);
+  return /* @__PURE__ */ i(
+    Gr,
+    {
+      onApprove: a,
+      onDeny: s,
+      toolCallId: t,
+      toolName: n,
+      input: r
+    }
+  );
+}
+function to({
+  toolName: e,
+  toolCallId: t,
+  input: n,
+  isDenied: r,
+  messageMetadata: o,
+  onUndo: a
+}) {
+  const s = S(
+    () => nr(o, t),
+    [o, t]
+  ), { previews: l } = dt(
+    s ? void 0 : e,
+    n
+  ), d = S(() => {
+    const g = s ?? l;
+    if (r)
+      return g.map((v) => ({ ...v, included: !1 }));
+    const m = tr(n);
+    return g.map((v, x) => ({
+      ...v,
+      included: m[x] ?? v.included
+    }));
+  }, [s, l, n, r]);
+  if (d.length === 0)
+    return null;
+  const u = d.filter((g) => g.included).length, p = u === 0 ? "Nothing applied" : `${u} ${u === 1 ? "change" : "changes"} applied`;
+  return /* @__PURE__ */ h(no, { children: [
+    /* @__PURE__ */ i(it, { toolName: e, input: n }),
+    /* @__PURE__ */ i(ro, { children: /* @__PURE__ */ i(nt, { previews: d, readOnly: !0 }) }),
+    /* @__PURE__ */ i(Ge, {}),
+    /* @__PURE__ */ h(oo, { children: [
+      /* @__PURE__ */ i(io, { children: p }),
+      a ? /* @__PURE__ */ i(ao, { size: "small", variant: "outlined", onClick: a, children: "Undo" }) : null
+    ] })
+  ] });
+}
+const no = c.div`
+  display: flex;
+  color: var(--text-color-primary);
+  flex-direction: column;
+  width: 100%;
+  min-width: 0;
+  border-radius: var(--border-radius-md, 10px);
+  border: 1px solid var(--border-color-secondary);
+  background: var(--layer-color);
+  line-height: var(--line-height-sm);
+`, ro = c.div`
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+`, oo = c.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: var(--spacing-xs) var(--spacing-sm);
+  gap: var(--spacing-xs);
+`, io = c.span`
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-secondary);
+`, ao = c(V)`
+  padding-top: 0;
+  padding-bottom: 0;
+`;
+function so({ items: e, isLast: t }) {
+  const [n, r] = K(t), o = $(() => {
+    r((s) => !s);
+  }, []), a = S(() => e.filter((s) => s.kind === "action"), [e]);
+  return /* @__PURE__ */ h(lo, { children: [
+    /* @__PURE__ */ h(uo, { type: "button", onClick: o, "aria-expanded": n, children: [
+      /* @__PURE__ */ i(fo, { children: n ? /* @__PURE__ */ i(Lt, { size: "12px", color: "var(--icon-color-additional)" }) : /* @__PURE__ */ i(Pt, { size: "12px", color: "var(--icon-color-additional)" }) }),
+      /* @__PURE__ */ h(po, { children: [
+        a.length,
+        " ",
+        a.length === 1 ? "action" : "actions"
+      ] })
+    ] }),
+    n && /* @__PURE__ */ i(ho, { children: a.map((s, l) => /* @__PURE__ */ i(co, { text: s.text }, l)) })
+  ] });
+}
+function co({ text: e }) {
+  return /* @__PURE__ */ h(go, { children: [
+    /* @__PURE__ */ h(vo, { children: [
+      /* @__PURE__ */ i(mo, { "aria-hidden": !0 }),
+      /* @__PURE__ */ i(yo, { children: /* @__PURE__ */ i(xo, { "aria-hidden": !0 }) }),
+      /* @__PURE__ */ i(ut, { "aria-hidden": !0 })
+    ] }),
+    /* @__PURE__ */ i(wo, { children: e })
+  ] });
+}
+const lo = c.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  min-width: 0;
+`, uo = c.button`
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  user-select: none;
+  width: fit-content;
+  padding: 0;
+`, fo = c.span`
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+`, po = c.span`
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-description);
+`, ho = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+`, ut = c.span`
+  display: block;
+  width: 1px;
+  flex-shrink: 0;
+  align-self: center;
+  background: var(--border-color-secondary);
+  flex: 1 1 auto;
+  min-height: 8px;
+`, go = c.div`
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  gap: var(--spacing-xxs);
+  min-width: 0;
+
+  &:last-child {
+    ${ut} {
+      display: none;
+    }
+  }
+`, vo = c.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  box-sizing: border-box;
+  width: 12px;
+  flex: 0 0 auto;
+  align-self: stretch;
+  min-height: 0;
+`, mo = c.span`
+  display: block;
+  width: 1px;
+  height: 4px;
+  flex: 0 0 auto;
+  flex-shrink: 0;
+  background: var(--border-color-secondary);
+`, yo = c.div`
+  width: 12px;
+  height: 12px;
+  flex: 0 0 auto;
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`, xo = c.span`
+  width: 4px;
+  height: 4px;
+  flex-shrink: 0;
+  border-radius: 50%;
+  box-sizing: border-box;
+  border: 1px solid var(--border-color-secondary);
+  background: transparent;
+`, wo = c.span`
+  flex: 1;
+  min-width: 0;
+  align-self: flex-start;
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-helper);
+`;
+function bo({
+  items: e,
+  messageMetadata: t
+}) {
+  return /* @__PURE__ */ i(ko, { children: e.map((n, r) => {
+    if (n.kind === "reasoning-block") {
+      const s = r === e.length - 1;
+      return /* @__PURE__ */ i(so, { items: n.items, isLast: s }, n.key);
+    }
+    if (n.kind === "text")
+      return /* @__PURE__ */ i(
+        Co,
+        {
+          rawMarkdown: n.text,
+          workflowRunHistoryIds: n.workflowRunHistoryIds
+        },
+        n.key
+      );
+    const { part: o } = n, a = ln(o.type);
+    return a && Ze(o) ? /* @__PURE__ */ i(
+      eo,
+      {
+        approvalId: o.approval.id,
+        toolCallId: o.toolCallId,
+        toolName: a,
+        input: o.input
+      },
+      n.key
+    ) : a && dn(o) ? /* @__PURE__ */ i(
+      to,
+      {
+        toolName: a,
+        toolCallId: o.toolCallId,
+        input: o.input,
+        isDenied: o.state === "output-denied",
+        messageMetadata: t
+      },
+      n.key
+    ) : null;
+  }) });
+}
+function Co({
+  rawMarkdown: e,
+  workflowRunHistoryIds: t
+}) {
+  const n = et({ workflowRunHistoryIds: t });
+  return /* @__PURE__ */ i(To, { onClick: n, children: /* @__PURE__ */ i(Zt, { rawMarkdown: e, parser: Jt }) });
+}
+const ko = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+`, To = c.div`
+  white-space: normal;
+
+  max-width: 100%;
+  overflow: hidden;
+
+  p:first-child {
+    margin-top: 0;
+  }
+
+  p:last-child {
+    margin-bottom: 0;
+  }
+`, ft = c.div`
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-primary);
+`;
+function Io() {
+  return /* @__PURE__ */ h(So, { children: [
+    /* @__PURE__ */ i(te, {}),
+    /* @__PURE__ */ i(te, {}),
+    /* @__PURE__ */ i(te, {})
+  ] });
+}
+const So = c.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 24px;
+  height: 24px;
+`;
+function Ao() {
+  return /* @__PURE__ */ h(Lo, { children: [
+    /* @__PURE__ */ i(Io, {}),
+    /* @__PURE__ */ i(Po, { children: "Thinking" })
+  ] });
+}
+const Lo = c.div`
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xxs);
+`, Po = c.span`
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+  color: var(--text-color-helper);
+`;
+function Eo({ items: e }) {
+  return /* @__PURE__ */ i(yt, { children: e.map((t) => t.kind !== "text" ? null : /* @__PURE__ */ i(ft, { children: t.text }, t.key)) });
+}
+const Ro = "Something went wrong. Please try again.";
+function Oo(e) {
+  const t = e?.message?.trim();
+  return t || Ro;
+}
+function $o({ message: e, isLastMessage: t }) {
+  const { chatStatus: n, chatError: r } = q(), { role: o, parts: a } = e, s = o === D.ASSISTANT, l = S(() => un(a), [a]), d = l.length > 0, u = n === "error" && t && s && !d;
+  return !d && !u ? null : /* @__PURE__ */ i(pt, { $role: o, children: /* @__PURE__ */ i(
+    Mo,
+    {
+      isFailedEmptyAssistant: u,
+      chatError: r,
+      isAssistant: s,
+      contentItems: l,
+      messageMetadata: e.metadata
+    }
+  ) });
+}
+function Do() {
+  return /* @__PURE__ */ i(pt, { $role: D.ASSISTANT, children: /* @__PURE__ */ i(ve, { children: /* @__PURE__ */ i(Ao, {}) }) });
+}
+function Mo({
+  isFailedEmptyAssistant: e,
+  chatError: t,
+  isAssistant: n,
+  contentItems: r,
+  messageMetadata: o
+}) {
+  return e ? /* @__PURE__ */ i(ve, { children: /* @__PURE__ */ i(ft, { children: Oo(t) }) }) : /* @__PURE__ */ i(ve, { children: n ? /* @__PURE__ */ i(bo, { items: r, messageMetadata: o }) : /* @__PURE__ */ i(Eo, { items: r }) });
+}
+const pt = c.div`
+  display: flex;
+  flex-direction: column;
+  padding: var(--spacing-xs) var(--spacing-sm);
+  gap: var(--spacing-xxs);
+  min-width: 0;
+  width: ${({ $role: e }) => e === D.ASSISTANT ? "100%" : "fit-content"};
+  border-radius: ${({ $role: e }) => e === D.USER ? "6px 0px 6px 6px" : "0px 6px 6px 6px"};
+  background: ${({ $role: e }) => e === D.USER ? "var(--replay-ai-user-message-gradient)" : "transparent"};
+  border: none;
+  color: var(--text-color-primary);
+  box-sizing: border-box;
+  word-wrap: break-word;
+  white-space: pre-wrap;
+  max-width: 100%;
+`, ve = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xxs);
+  min-width: 0;
+  width: 100%;
+`;
+function zo() {
+  const { messages: e, isStreaming: t } = q(), n = e.at(-1), r = S(() => {
+    const o = n?.role === D.ASSISTANT, a = n?.parts.at(-1)?.type === "text";
+    return t && !(o && a);
+  }, [t, n?.parts, n?.role]);
+  return /* @__PURE__ */ h(_o, { children: [
+    e.map((o, a) => /* @__PURE__ */ i(ze, { $role: o.role, children: /* @__PURE__ */ i(_e, { $role: o.role, children: /* @__PURE__ */ i($o, { message: o, isLastMessage: a === e.length - 1 }) }) }, o.id)),
+    r && /* @__PURE__ */ i(ze, { $role: D.ASSISTANT, children: /* @__PURE__ */ i(_e, { $role: D.ASSISTANT, children: /* @__PURE__ */ i(Do, {}) }) })
+  ] });
+}
+const _o = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+  width: 100%;
+`, ze = c.div`
+  display: flex;
+  width: 100%;
+  justify-content: ${({ $role: e }) => e === D.USER ? "flex-end" : "flex-start"};
+`, _e = c.div`
+  display: flex;
+  flex-direction: column;
+  align-items: ${({ $role: e }) => e === D.USER ? "flex-end" : "stretch"};
+  gap: var(--spacing-xs);
+  min-width: 0;
+  width: 100%;
+  max-width: 100%;
+`;
+function Vo(e) {
+  const t = F(void 0);
+  return B(() => {
+    t.current = e;
+  }), t.current;
+}
+const ht = c.div`
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  width: 100%;
+  overflow: auto;
+  padding: var(--spacing-xs);
+`, Ho = (e) => /* @__PURE__ */ h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 14 14", fill: "none", ...e, children: [
+  /* @__PURE__ */ i(
+    "path",
+    {
+      d: "M12.1683 8.65224C13.4439 7.91782 13.4439 6.08176 12.1683 5.34733L8.48891 3.22903L5.13033 6.57817C5.03961 6.66863 5.03961 6.8153 5.13033 6.90577L8.81674 10.5818L12.1683 8.65224Z",
+      fill: "url(#replay-icon-gradient)"
+    }
+  ),
+  /* @__PURE__ */ i(
+    "path",
+    {
+      d: "M7.56707 11.3013L3.81522 13.4613C2.53957 14.1957 0.945007 13.2777 0.945007 11.8088L0.945008 2.19072C0.945008 0.721872 2.53957 -0.196157 3.81522 0.538267L7.23924 2.50957L4.14475 5.59536C3.5097 6.22861 3.5097 7.25532 4.14475 7.88858L7.56707 11.3013Z",
+      fill: "url(#replay-icon-gradient)"
+    }
+  ),
+  /* @__PURE__ */ i("defs", { children: /* @__PURE__ */ h(
+    "linearGradient",
+    {
+      id: "replay-icon-gradient",
+      x1: "12.0947",
+      y1: "10.9627",
+      x2: "1.65018",
+      y2: "0.120816",
+      gradientUnits: "userSpaceOnUse",
+      children: [
+        /* @__PURE__ */ i("stop", { stopColor: "#C361FF" }),
+        /* @__PURE__ */ i("stop", { offset: "0.411322", stopColor: "#9461FF" }),
+        /* @__PURE__ */ i("stop", { offset: "0.73777", stopColor: "#207DFF" }),
+        /* @__PURE__ */ i("stop", { offset: "1", stopColor: "#1DA8F6" })
+      ]
+    }
+  ) })
+] }), Bo = c(Ho)`
+  height: ${({ size: e }) => e || "14px"};
+  width: ${({ size: e }) => e || "14px"};
+`;
+function No(e) {
+  const t = "var(--font-size-base)";
+  switch (e) {
+    case ge:
+      return /* @__PURE__ */ i(Bo, { size: t });
+    case le.OPENAI:
+      return /* @__PURE__ */ i(zt, { size: t, color: "var(--text-color-primary)" });
+    case le.GEMINI:
+      return /* @__PURE__ */ i(Mt, { size: t });
+    case le.ANTHROPIC:
+      return /* @__PURE__ */ i(Dt, { size: t, color: "var(--replay-claude-icon-color)" });
+  }
+}
+function Fo({
+  models: e,
+  selectedModelId: t,
+  placement: n,
+  onModelSelect: r,
+  onSettingsOpen: o
+}) {
+  const a = e.find((p) => p.id === t), s = a?.label ?? "Replay AI", l = a?.id, d = e.filter((p) => p.provider === ge), u = e.filter((p) => p.provider !== ge), f = d.length > 0 && u.length > 0;
+  return /* @__PURE__ */ i(Yo, { children: /* @__PURE__ */ i(
+    Go,
+    {
+      trigger: /* @__PURE__ */ i(jo, { label: s }),
+      placement: n,
+      alignment: "start",
+      withArrow: !0,
+      children: /* @__PURE__ */ h(Ko, { children: [
+        /* @__PURE__ */ h(Jo, { children: [
+          d.map((p) => /* @__PURE__ */ i(
+            Ve,
+            {
+              model: p,
+              activeModelId: l,
+              onModelSelect: r
+            },
+            p.id
+          )),
+          f && /* @__PURE__ */ i(He, { "aria-hidden": !0 }),
+          u.length > 0 && /* @__PURE__ */ i(Fe, { children: u.map((p) => /* @__PURE__ */ i(
+            Ve,
+            {
+              model: p,
+              activeModelId: l,
+              onModelSelect: r
+            },
+            p.id
+          )) })
+        ] }),
+        o && e.length > 0 && /* @__PURE__ */ i(He, { "aria-hidden": !0 }),
+        o && /* @__PURE__ */ i(
+          Xo,
+          {
+            prefix: /* @__PURE__ */ i(Et, { size: "var(--font-size-base)", color: "var(--text-color-secondary)" }),
+            content: "Manage models",
+            onAction: () => o("ai-providers")
+          }
+        )
+      ] })
+    }
+  ) });
+}
+function jo({
+  label: e,
+  icon: t,
+  onClick: n,
+  onKeyDown: r
+}) {
+  return /* @__PURE__ */ h(Wo, { onClick: n, onKeyDown: r, children: [
+    /* @__PURE__ */ i(Uo, { children: e }),
+    t
+  ] });
+}
+function Ve({ model: e, activeModelId: t, onModelSelect: n }) {
+  const r = e.id === t;
+  return /* @__PURE__ */ i(
+    We,
+    {
+      prefix: No(e.provider),
+      suffix: r ? /* @__PURE__ */ i(Zo, { size: "var(--font-size-base)", color: "var(--text-color-primary)" }) : void 0,
+      onAction: () => n(e.id),
+      active: r,
+      children: /* @__PURE__ */ i(qo, { children: e.label })
+    }
+  );
+}
+const Wo = c.div`
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  gap: var(--spacing-xxs);
+  height: 24px;
+  padding: 0 var(--spacing-xs);
+  border-radius: var(--border-radius);
+  background: var(--bg-color-active);
+  cursor: pointer;
+  user-select: none;
+
+  &:hover {
+    background: var(--layer-color-active);
+  }
+`, Uo = c.span`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-base);
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-base);
+  color: var(--text-color-primary);
+  white-space: nowrap;
+`, Yo = c.div`
+  --dropdown-menu-padding-top: 0;
+
+  min-width: 0;
+  flex: 1;
+  position: relative;
+`, Go = c(Rt)`
+  width: 100%;
+  min-width: 0;
+  flex: 1;
+
+  > :last-child {
+    width: 100%;
+    max-width: 200px;
+  }
+`, Ko = c(Ot)`
+  --dropdown-menu-item-gap: calc(var(--spacing-unit) / 2);
+  --dropdown-menu-item-padding-vertical: var(--spacing-xxs);
+  --dropdown-menu-item-padding-horizontal: var(--spacing-xs);
+
+  padding: var(--spacing-xxs);
+  margin: 5px 0;
+  border-radius: var(--border-radius-lg);
+  background: var(--bg-color);
+`, qo = c.span`
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`, Zo = c($t)`
+  margin-left: var(--spacing-xxs);
+`, He = c.li`
+  flex-shrink: 0;
+  list-style: none;
+  width: 100%;
+  height: 1px;
+  margin: 0;
+  background: var(--border-color-secondary);
+`, Jo = c.li`
+  display: flex;
+  flex-direction: column;
+  gap: var(--dropdown-menu-item-gap);
+  list-style: none;
+  min-height: 0;
+  overflow-y: auto;
+`, Xo = c(We)`
+  flex-shrink: 0;
+`;
+function Qo() {
+  const {
+    chatId: e,
+    isLoading: t,
+    pendingComposerPreset: n,
+    clearPendingComposerPreset: r,
+    availableModels: o,
+    selectedModelId: a,
+    selectModel: s,
+    onSettingsOpen: l
+  } = Ke(), { messages: d, isStreaming: u, sendMessage: f, stopGeneration: p } = q(), { isOpen: g } = qe(), [m, v] = K(""), x = F(null), w = F(null), b = F(!0), y = d.length > 0, A = Vo(d.length), P = A !== void 0 && A > 0 && !y, M = $((L = "smooth") => {
+    w.current && w.current.scrollTo({
+      top: w.current.scrollHeight,
+      behavior: L
+    });
+  }, []), Z = $(() => {
+    const L = w.current;
+    if (!L) return;
+    L.scrollHeight - L.scrollTop - L.clientHeight < 50 && (b.current = !0);
+  }, []);
+  B(() => {
+    const L = w.current;
+    if (!L) return;
+    const ce = (mt) => {
+      mt.deltaY < 0 && (b.current = !1);
+    };
+    return L.addEventListener("wheel", ce, { passive: !0 }), () => L.removeEventListener("wheel", ce);
+  }, []);
+  const J = $(async () => {
+    m && (v(""), b.current = !0, await f(m), x.current && requestAnimationFrame(() => x.current?.focus()));
+  }, [f, m]);
+  return B(() => {
+    g && (x.current && x.current.focus(), b.current = !0, M());
+  }, [g, d.length, M]), B(() => {
+    u && b.current && M();
+  }), B(
+    function() {
+      g && x.current && (x.current.focus(), M("instant"));
+    },
+    [e, g, M]
+  ), B(
+    function() {
+      !g || n === null || (v(n), r());
+    },
+    [g, n, r]
+  ), /* @__PURE__ */ h(ht, { children: [
+    /* @__PURE__ */ i(
+      ei,
+      {
+        ref: w,
+        $isExpanded: t || y,
+        $isAnimated: u || P,
+        onScroll: Z,
+        children: t ? /* @__PURE__ */ i(ti, { children: /* @__PURE__ */ i(ye, { size: "20px" }) }) : /* @__PURE__ */ i(zo, {})
+      }
+    ),
+    /* @__PURE__ */ i(
+      kn,
+      {
+        value: m,
+        onValueChange: v,
+        onSubmit: J,
+        isStreaming: u,
+        onStop: p,
+        textareaRef: x,
+        modelSelector: /* @__PURE__ */ i(
+          Fo,
+          {
+            models: o,
+            selectedModelId: a,
+            placement: y ? "top" : "bottom",
+            onModelSelect: s,
+            onSettingsOpen: l
+          }
+        )
+      }
+    )
+  ] });
+}
+const ei = c.div`
+  flex: ${({ $isExpanded: e }) => e ? 1 : 0};
+  width: 100%;
+  overflow: auto;
+  padding-bottom: ${(e) => e.$isExpanded ? "var(--spacing-xs)" : "0"};
+  transition-property: flex;
+  transition-duration: ${(e) => e.$isAnimated ? "var(--replay-transition-duration)" : "0s"};
+  transition-timing-function: var(--replay-transition-timing-function);
+`, ti = c.div`
+  display: flex;
+  justify-content: center;
+  height: 100%;
+  padding-top: var(--spacing-lg);
+`, O = {
+  TODAY: "today",
+  YESTERDAY: "yesterday",
+  LAST_WEEK: "last_week",
+  LAST_MONTH: "last_month",
+  OLDER: "older"
+}, ni = {
+  [O.TODAY]: "Today",
+  [O.YESTERDAY]: "Yesterday",
+  [O.LAST_WEEK]: "Last 7 days",
+  [O.LAST_MONTH]: "Last 30 days",
+  [O.OLDER]: "Older"
+};
+function ri(e, t = Date.now()) {
+  const n = U(e).startOf("day"), r = U(t).startOf("day"), o = U(t).subtract(1, "day").startOf("day"), a = U(t).subtract(7, "day").startOf("day"), s = U(t).subtract(30, "day").startOf("day");
+  return n.isSame(r, "day") ? O.TODAY : n.isSame(o, "day") ? O.YESTERDAY : !n.isBefore(a, "day") && n.isBefore(o, "day") ? O.LAST_WEEK : !n.isBefore(s, "day") && n.isBefore(a, "day") ? O.LAST_MONTH : O.OLDER;
+}
+function oi(e) {
+  const t = [];
+  for (const n of e) {
+    const r = ri(n.updatedAt), o = t[t.length - 1];
+    !o || o.bucket !== r ? t.push({ bucket: r, chats: [n] }) : o.chats.push(n);
+  }
+  return t;
+}
+function ii(e) {
+  const {
+    scrollRef: t,
+    sentinelRef: n,
+    hasNextPage: r,
+    isFetchingNextPage: o,
+    fetchNextPage: a,
+    observerResetKey: s
+  } = e;
+  je(() => {
+    const l = t.current, d = n.current;
+    if (!l || !d) return;
+    const u = new IntersectionObserver(
+      (f) => {
+        const p = f[0];
+        p && p.isIntersecting && r && (o || a());
+      },
+      { root: l, rootMargin: "80px" }
+    );
+    return u.observe(d), () => {
+      u.disconnect();
+    };
+  }, [s, a, r, o, t, n]);
+}
+const gt = c(ht)`
+  gap: var(--spacing-xxs);
+  user-select: none;
+`, ai = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+`, si = c.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xxs);
+`, ci = c(gt)`
+  display: flex;
+  flex-grow: 1;
+  align-items: center;
+  flex-direction: column;
+  padding: var(--spacing-md);
+`, li = c.div`
+  display: flex;
+  flex-grow: 1;
+  align-items: center;
+  justify-content: center;
+`, di = c.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  max-width: 75%;
+  gap: var(--spacing-xxs);
+`, ui = c.div`
+  display: flex;
+  justify-content: center;
+  padding: var(--spacing-xs);
+`, fi = c(re)`
+  padding-left: var(--spacing-xs);
+  font-size: var(--font-size-sm);
+  color: var(--color-warm-grey-7);
+`, pi = c.div`
+  display: flex;
+  flex-grow: 1;
+
+  .tooltip-expanded {
+    flex-grow: 1;
+    min-width: 0;
+  }
+`, hi = c.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-grow: 1;
+  min-width: 0;
+  border-radius: var(--border-radius);
+  padding: calc(var(--spacing-xxs) / 2) var(--spacing-xs);
+  gap: calc(var(--spacing-xxs) * 2.5);
+  cursor: pointer;
+
+  ${V} {
+    display: none;
+  }
+
+  &:focus-within,
+  &:hover {
+    background-color: var(--color-hover-base);
+
+    ${V} {
+      display: inline-flex;
+    }
+  }
+`, gi = c(re)`
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+`, vi = c.div`
+  height: 1px;
+  flex-shrink: 0;
+`;
+function mi(e) {
+  const { chat: t, onSelect: n, onRemove: r } = e;
+  return /* @__PURE__ */ i(pi, { children: /* @__PURE__ */ i(Y, { tip: U(t.updatedAt).format("MMM DD, YYYY, hh:mm:ss A"), className: "expanded", children: /* @__PURE__ */ h(hi, { role: "button", onClick: () => n?.(t.id), children: [
+    /* @__PURE__ */ i(gi, { children: t.title ?? "New chat" }),
+    /* @__PURE__ */ i(
+      V,
+      {
+        variant: "ghost",
+        size: "small",
+        tone: "danger",
+        icon: /* @__PURE__ */ i(_t, {}),
+        onClick: (o) => {
+          o.stopPropagation(), r?.(t.id);
+        }
+      }
+    )
+  ] }) }) });
+}
+function yi(e) {
+  const { group: t, onChatSelect: n, onChatRemove: r } = e;
+  return /* @__PURE__ */ h(si, { children: [
+    /* @__PURE__ */ i(fi, { children: ni[t.bucket] }),
+    t.chats.map((o) => /* @__PURE__ */ i(
+      mi,
+      {
+        chat: o,
+        onSelect: n,
+        onRemove: r
+      },
+      o.id
+    ))
+  ] });
+}
+function xi() {
+  return /* @__PURE__ */ i(li, { children: /* @__PURE__ */ h(di, { children: [
+    /* @__PURE__ */ i(re, { textAlign: "center", fontWeight: "var(--font-weight-semibold)", children: "No chat history" }),
+    /* @__PURE__ */ i(re, { textAlign: "center", children: "Ask questions or let the assistant take action for you." })
+  ] }) });
+}
+function wi() {
+  return /* @__PURE__ */ i(ci, { children: /* @__PURE__ */ i(ye, {}) });
+}
+const bi = 50;
+function Ci(e) {
+  const { onChatSelect: t, onChatRemove: n } = e, r = F(null), o = F(null), { data: a, isPending: s, hasNextPage: l, isFetchingNextPage: d, fetchNextPage: u } = fn(bi), f = S(() => (a?.pages ?? []).flatMap((g) => g.items), [a?.pages]), p = S(() => oi(f), [f]);
+  return ii({
+    scrollRef: r,
+    sentinelRef: o,
+    hasNextPage: l,
+    isFetchingNextPage: d,
+    fetchNextPage: u,
+    observerResetKey: a?.pages.length
+  }), s && !a ? /* @__PURE__ */ i(wi, {}) : f.length === 0 ? /* @__PURE__ */ i(xi, {}) : /* @__PURE__ */ h(gt, { ref: r, children: [
+    /* @__PURE__ */ i(ai, { children: p.map((g) => /* @__PURE__ */ i(
+      yi,
+      {
+        group: g,
+        onChatSelect: t,
+        onChatRemove: n
+      },
+      `${g.bucket}-${g.chats[0]?.id ?? ""}`
+    )) }),
+    l && /* @__PURE__ */ i(vi, { ref: o, "aria-hidden": !0 }),
+    d && /* @__PURE__ */ i(ui, { children: /* @__PURE__ */ i(ye, {}) })
+  ] });
+}
+const ki = xt(null);
+function Ti(e) {
+  const t = wt(ki);
+  if (t?.components) {
+    const { LinkComponent: s } = t.components;
+    return /* @__PURE__ */ i(s, { ...e });
+  }
+  const { external: n, languageInsensitive: r, innerRef: o, ...a } = e;
+  return /* @__PURE__ */ i(pn, { ref: o, ...a });
+}
+const Ii = () => bt`
+    0% {
+        color: var(--button-content-color);
+        background-color: var(--button-bg-color-active);
+    }
+
+    50% {
+        background-color: var(--button-bg-color);
+    }
+
+    100% {
+        color: var(--button-content-color);
+        background-color: var(--button-bg-color-active);
+    }
+`, Si = c(Ti)`
+  text-decoration: none;
+  &:focus-visible {
+    outline: 1px solid var(--button-border-color-focused);
+  }
+  border-radius: var(--button-border-radius);
+`;
+function Ai({
+  variant: e = "secondary",
+  tone: t = "default",
+  size: n = "medium",
+  extraClass: r = "",
+  className: o = ""
+}) {
+  return [
+    "button",
+    r,
+    `button-tone-${t}`,
+    `button-variant-${e}`,
+    `button-size-${n}`,
+    o
+  ].filter((s) => s).join(" ").trim();
+}
+const Li = c.button`
+  width: ${({ $fullWidth: e }) => e ? "100%" : "auto"};
+
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--button-gap);
+  margin: var(--button-margin);
+  cursor: pointer;
+  text-wrap: var(--button-text-wrap);
+
+  color: var(--button-color);
+  background-color: var(--button-bg-color);
+  border: var(--button-border-width) var(--button-border-style) var(--button-border-color);
+  box-shadow: var(--button-box-shadow);
+  backdrop-filter: var(--button-backdrop-filter, none);
+
+  font-weight: var(--button-font-weight);
+  font-size: var(--button-font-size);
+  line-height: var(--button-line-height);
+  padding: ${({ $icon: e, $iconPosition: t, $iconOnly: n }) => e ? `var(--button-icon-${n ? "" : `${t || "left"}-`}padding)` : "var(--button-padding)"};
+  border-radius: var(--button-border-radius);
+
+  svg {
+    width: var(--button-icon-size);
+    height: var(--button-icon-size);
+  }
+
+  &:hover {
+    background-color: var(--button-bg-color-hover);
+    color: var(--button-color-hover);
+    border-color: var(--button-border-color-hover);
+  }
+
+  &:active,
+  &.active {
+    background-color: var(--button-bg-color-active);
+    border-color: var(--button-border-color-active);
+    color: var(--button-color-active);
+  }
+
+  &:focus-visible {
+    outline: 1px solid var(--button-border-color-focused);
+  }
+
+  &.button-tone-danger {
+    color: var(--button-content-color-danger);
+    border-color: var(--button-border-color-danger);
+    background-color: var(--button-bg-color-danger);
+
+    &:hover {
+      color: var(--button-content-color-danger-hover);
+      border-color: var(--button-border-color-danger-hover);
+      background-color: var(--button-bg-color-danger-hover);
+    }
+
+    &:active {
+      color: var(--button-content-color-danger-pressed);
+      border-color: var(--button-border-color-danger-pressed);
+      background-color: var(--button-bg-color-danger-pressed);
+    }
+  }
+
+  &:disabled {
+    pointer-events: none;
+    background-color: var(--button-bg-color-disabled);
+    color: var(--button-content-color-disabled);
+    border-color: var(--button-border-color-disabled);
+    border-width: var(--button-border-width-disabled);
+  }
+
+  ${({ $variant: e, $size: t }) => (e === "link" || e === "ghost") && t === "small" && fe`
+      --button-font-size: var(--font-size-sm);
+      --button-line-height: var(--line-height-sm);
+      --button-icon-padding: var(--button-icon-padding-small) !important;
+    `}
+
+  ${({ $blinking: e }) => e && fe`
+      pointer-events: none;
+      animation: ${Ii()} 1.2s infinite;
+    `}
+`, Pi = (e) => {
+  const {
+    languageInsensitive: t,
+    fullWidth: n,
+    blinking: r,
+    iconPosition: o,
+    icon: a,
+    children: s,
+    variant: l,
+    tone: d,
+    size: u,
+    extraClass: f,
+    to: p,
+    external: g,
+    className: m,
+    ...v
+  } = e, x = "tabIndex" in e ? e.tabIndex : e.to ? -1 : void 0, w = /* @__PURE__ */ h(
+    Li,
+    {
+      "data-component-name": "Button/Button",
+      ...v,
+      className: Ai({ variant: l, tone: d, size: u, extraClass: f, className: m }),
+      $fullWidth: n,
+      $blinking: r,
+      $iconPosition: o,
+      $icon: a,
+      $iconOnly: !s && a != null,
+      $variant: l,
+      $size: u,
+      tabIndex: x,
+      children: [
+        a && o !== "right" && a,
+        s,
+        a && o === "right" && a
+      ]
+    }
+  );
+  return p ? /* @__PURE__ */ i(
+    Si,
+    {
+      to: p,
+      external: g,
+      languageInsensitive: t,
+      onClick: e.onClick,
+      children: w
+    }
+  ) : w;
+}, ne = c(Pi)``;
+function Ei() {
+  const e = F(null), [t, n] = K(!1);
+  return je(() => {
+    if (!e.current) return;
+    const r = e.current;
+    function o() {
+      n(r.scrollWidth > r.clientWidth);
+    }
+    o();
+    const a = new ResizeObserver(o);
+    return a.observe(r), () => a.disconnect();
+  }, []), {
+    ref: e,
+    value: t
+  };
+}
+function Ri(e) {
+  const { ref: t, value: n } = Ei();
+  return /* @__PURE__ */ i(Oi, { children: /* @__PURE__ */ i(Y, { tip: e.value, className: "no-overflow", disabled: !n, children: /* @__PURE__ */ i($i, { ref: t, children: e.value }) }) });
+}
+const Oi = c.div`
+  overflow: hidden;
+  .tooltip-no-overflow {
+    overflow: hidden;
+  }
+`, $i = c.div`
+  color: var(--text-color-primary);
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  user-select: none;
+`;
+function vt(e) {
+  const { children: t, buttons: n } = e;
+  return /* @__PURE__ */ h(Di, { children: [
+    /* @__PURE__ */ i(Mi, { children: t }),
+    n && /* @__PURE__ */ i(zi, { children: n })
+  ] });
+}
+const Di = c.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: var(--spacing-xs);
+  gap: var(--spacing-xs);
+  width: 100%;
+  flex-shrink: 0;
+`, Mi = c.div`
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  min-width: 0;
+  flex: 1;
+`, zi = c.div`
+  display: flex;
+  align-items: center;
+  gap: 2px;
+`;
+function _i(e) {
+  const { title: t, onCreateNewChat: n, onViewHistory: r, onClose: o } = e;
+  return /* @__PURE__ */ h(vt, { buttons: /* @__PURE__ */ h(Fe, { children: [
+    /* @__PURE__ */ i(Y, { tip: "New chat", children: /* @__PURE__ */ i(
+      ne,
+      {
+        size: "small",
+        variant: "text",
+        "aria-label": "Create new chat",
+        onClick: n,
+        icon: /* @__PURE__ */ i(Ht, {})
+      }
+    ) }),
+    /* @__PURE__ */ i(Y, { tip: "Chat history", children: /* @__PURE__ */ i(
+      ne,
+      {
+        size: "small",
+        variant: "text",
+        "aria-label": "View chat history",
+        onClick: r,
+        icon: /* @__PURE__ */ i(Bt, {})
+      }
+    ) }),
+    /* @__PURE__ */ i(Hi, { children: /* @__PURE__ */ i(Xt, {}) }),
+    /* @__PURE__ */ i(Y, { tip: "Close", arrowPosition: "left", children: /* @__PURE__ */ i(
+      ne,
+      {
+        variant: "text",
+        size: "small",
+        "aria-label": "Close panel",
+        icon: /* @__PURE__ */ i(Nt, {}),
+        onClick: o
+      }
+    ) })
+  ] }), children: [
+    /* @__PURE__ */ i(Vi, { children: /* @__PURE__ */ i(Vt, { size: "14px" }) }),
+    /* @__PURE__ */ i(Ri, { value: t })
+  ] });
+}
+const Vi = c.div`
+  display: flex;
+`, Hi = c.div`
+  display: flex;
+  height: 14px;
+`, Bi = /* @__PURE__ */ new Set([
+  "color",
+  "fontFamily",
+  "fontSize",
+  "fontStyle",
+  "fontWeight",
+  "lineHeight",
+  "letterSpacing",
+  "marginBottom",
+  "marginTop",
+  "textAlign"
+]), Ni = c.span.withConfig({
+  shouldForwardProp: (e) => !Bi.has(e)
+}).attrs({
+  "data-component-name": "Typography/Typography"
+})`
+  color: ${({ color: e }) => e || "var(--text-color-primary)"};
+  font-family: ${({ fontFamily: e }) => e || "var(--font-family-base)"};
+  font-size: ${({ fontSize: e }) => e || "var(--font-size-base)"};
+  font-style: ${({ fontStyle: e }) => e};
+  font-weight: ${({ fontWeight: e }) => e || "var(--font-weight-regular)"};
+  line-height: ${({ lineHeight: e }) => e || "var(--line-height-base)"};
+  letter-spacing: ${({ letterSpacing: e }) => e};
+  margin-bottom: ${({ marginBottom: e }) => e};
+  margin-top: ${({ marginTop: e }) => e};
+  text-align: ${({ textAlign: e }) => e};
+`;
+function Fi(e) {
+  const { onReturnFromHistory: t } = e;
+  return /* @__PURE__ */ h(vt, { children: [
+    /* @__PURE__ */ i(
+      ne,
+      {
+        size: "small",
+        variant: "text",
+        "aria-label": "Return to chat",
+        onClick: t,
+        icon: /* @__PURE__ */ i(Ft, {})
+      }
+    ),
+    /* @__PURE__ */ i(ji, { children: /* @__PURE__ */ i(Ni, { children: "Chat history" }) })
+  ] });
+}
+const ji = c.div`
+  user-select: none;
+`;
+function na() {
+  const [e, t] = K(j.CHAT), n = qe(), r = Ke(), o = () => {
+    t(j.HISTORY);
+  }, a = () => {
+    t(j.CHAT);
+  }, s = async (l) => {
+    r.selectChat(l), t(j.CHAT);
+  };
+  return /* @__PURE__ */ h(Wi, { children: [
+    /* @__PURE__ */ h(Be, { isActive: e === j.CHAT, children: [
+      /* @__PURE__ */ i(
+        _i,
+        {
+          title: r.title,
+          onCreateNewChat: r.createNewChat,
+          onViewHistory: o,
+          onClose: n.closePanel
+        }
+      ),
+      /* @__PURE__ */ i(Qo, {}),
+      /* @__PURE__ */ i(Ne, { children: /* @__PURE__ */ i(be, {}) })
+    ] }),
+    /* @__PURE__ */ h(Be, { isActive: e === j.HISTORY, isSliding: !0, children: [
+      /* @__PURE__ */ i(Fi, { onReturnFromHistory: a }),
+      /* @__PURE__ */ i(Ci, { onChatSelect: s, onChatRemove: r.removeChat }),
+      /* @__PURE__ */ i(Ne, { children: /* @__PURE__ */ i(be, {}) })
+    ] })
+  ] });
+}
+function Be(e) {
+  const { children: t, isActive: n, isSliding: r = !1 } = e, o = /* @__PURE__ */ i(Ui, { inert: !n, children: t });
+  return r ? /* @__PURE__ */ i(Yi, { $isExpanded: n, children: o }) : o;
+}
+const Wi = c.div`
+  position: relative;
+  height: 100%;
+  overflow: clip;
+`, Ui = c.div`
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  align-items: flex-start;
+  border-radius: var(--border-radius-md);
+  background: var(--bg-color);
+  margin-left: var(--spacing-xxs);
+`, Yi = c.div`
+  position: absolute;
+  inset: 0;
+  transform: translateX(${(e) => e.$isExpanded ? "0%" : "100%"});
+  transition-property: transform;
+  transition-duration: 400ms;
+  transition-timing-function: cubic-bezier(0.45, 0, 0.55, 1);
+  @media (prefers-reduced-motion: reduce) {
+    transition-duration: 0ms;
+  }
+`, Ne = c.div`
+  width: 100%;
+`;
+export {
+  na as AiPanel
+};