@arcadeai/design-system 3.36.2 → 3.37.0

package/dist/components/ui/molecules/tool-call-accordion.js

@@ -1,12 +1,13 @@
-import { jsx as r, jsxs as a } from "react/jsx-runtime";
+import { jsx as r, jsxs as n, Fragment as S } from "react/jsx-runtime";
 import { c as y } from "../../../index-UgeK3A8s.js";
-import { Table as A, Code as T, Wrench as C, TriangleAlert as v, CheckCircle2 as S, Loader2 as V } from "lucide-react";
-import * as c from "react";
-import { Accordion as j, AccordionContent as z, AccordionItem as I, AccordionTrigger as O } from "../atoms/accordion.js";
-import { CopyButton as E } from "../atoms/copy-button.js";
-import { JsonHighlight as N } from "../atoms/json-highlight.js";
-import { cn as l } from "../../../lib/utils.js";
-const J = y(
+import { Table as z, Code as V, TriangleAlert as w, ChevronRight as h, Wrench as j, CheckCircle2 as I, Loader2 as E } from "lucide-react";
+import * as l from "react";
+import { Accordion as O, AccordionContent as R, AccordionItem as J, AccordionTrigger as $ } from "../atoms/accordion.js";
+import { Collapsible as D, CollapsibleTrigger as H, CollapsibleContent as F } from "../atoms/collapsible.js";
+import { CopyButton as k } from "../atoms/copy-button.js";
+import { JsonHighlight as v } from "../atoms/json-highlight.js";
+import { cn as c } from "../../../lib/utils.js";
+const M = y(
   "font-mono text-xs transition-colors",
   {
     variants: {
@@ -18,7 +19,7 @@ const J = y(
     },
     defaultVariants: { state: "calling" }
   }
-), R = y(
+), B = y(
   "absolute -top-0.5 right-0 size-2 shrink-0 rounded-full ring-2 ring-background",
   {
     variants: {
@@ -31,10 +32,10 @@ const J = y(
     defaultVariants: { state: "calling" }
   }
 );
-function $(e, t = 140) {
+function L(e, t = 140) {
   return e.length > t ? `${e.slice(0, t).trimEnd()}...` : e;
 }
-function w(e) {
+function C(e) {
   if (typeof e == "string")
     try {
       return JSON.stringify(JSON.parse(e), null, 2);
@@ -43,7 +44,7 @@ function w(e) {
     }
   return JSON.stringify(e, null, 2) ?? "null";
 }
-function D(e) {
+function P(e) {
   if (typeof e == "string") {
     try {
       const t = JSON.parse(e);
@@ -56,9 +57,9 @@ function D(e) {
   }
   return typeof e == "object" && e !== null && !Array.isArray(e) ? e : { value: e };
 }
-function H(e) {
+function W(e) {
   if (typeof e == "string")
-    return $(e.replace(/\s+/g, " "));
+    return L(e.replace(/\s+/g, " "));
   if (typeof e == "number" || typeof e == "boolean" || e === null || e === void 0)
     return String(e);
   if (Array.isArray(e))
@@ -69,100 +70,154 @@ function H(e) {
   }
   return String(e);
 }
-function M(e) {
+function _(e) {
   return typeof e == "string" && e.length > 180 || Array.isArray(e) || typeof e == "object" && e !== null;
 }
-function h({
+function x({
   activeView: e,
   panelView: t,
   children: o,
-  lazy: i = !1
+  lazy: a = !1
 }) {
-  const s = e === t, [d, n] = c.useState(s || !i);
-  return c.useEffect(() => {
-    s && n(!0);
-  }, [s]), d ? /* @__PURE__ */ r("div", { className: l(!s && "hidden"), children: o }) : null;
+  const s = e === t, [d, i] = l.useState(s || !a);
+  return l.useEffect(() => {
+    s && i(!0);
+  }, [s]), d ? /* @__PURE__ */ r("div", { className: c(!s && "hidden"), children: o }) : null;
 }
-function B({ label: e, value: t }) {
-  const [, o] = c.useTransition(), [i, s] = c.useState(!1), d = M(t);
-  return /* @__PURE__ */ a("div", { className: "grid gap-1 px-3 py-2.5 sm:grid-cols-[minmax(0,8rem)_minmax(0,1fr)] sm:gap-3", children: [
+function q({ label: e, value: t }) {
+  const [, o] = l.useTransition(), [a, s] = l.useState(!1), d = _(t);
+  return /* @__PURE__ */ n("div", { className: "grid gap-1 px-3 py-2.5 sm:grid-cols-[minmax(0,8rem)_minmax(0,1fr)] sm:gap-3", children: [
     /* @__PURE__ */ r("dt", { className: "font-medium text-[11px] text-muted-foreground uppercase tracking-[0.08em]", children: e }),
-    /* @__PURE__ */ a("dd", { className: "min-w-0 space-y-2 text-foreground/90 text-xs", children: [
-      /* @__PURE__ */ r("span", { className: "wrap-break-word block whitespace-pre-wrap", children: H(t) }),
+    /* @__PURE__ */ n("dd", { className: "min-w-0 space-y-2 text-foreground/90 text-xs", children: [
+      /* @__PURE__ */ r("span", { className: "wrap-break-word block whitespace-pre-wrap", children: W(t) }),
       d && /* @__PURE__ */ r(
         "button",
         {
           className: "inline-flex items-center rounded-md border border-border/60 px-2 py-1 font-medium text-[11px] text-muted-foreground transition-colors hover:bg-muted/40 hover:text-foreground dark:border-white/10",
-          onClick: () => o(() => s((n) => !n)),
+          onClick: () => o(() => s((i) => !i)),
           type: "button",
-          children: i ? "Show less" : "Show more"
+          children: a ? "Show less" : "Show more"
         }
       ),
-      i && /* @__PURE__ */ r(
-        N,
+      a && /* @__PURE__ */ r(
+        v,
         {
           className: "rounded-lg border border-border/60 bg-background/80 dark:border-white/10",
-          code: w(t)
+          code: C(t)
         }
       )
     ] })
   ] });
 }
-const F = c.memo(function({ value: t }) {
-  const o = c.useMemo(
-    () => Object.entries(D(t)),
+const G = l.memo(function({ value: t }) {
+  const o = l.useMemo(
+    () => Object.entries(P(t)),
     [t]
   );
-  return /* @__PURE__ */ r("div", { className: "overflow-hidden rounded-lg border border-border/60 bg-background/80 dark:border-white/10", children: /* @__PURE__ */ r("dl", { className: "divide-y divide-border/50 dark:divide-white/10", children: o.map(([i, s]) => /* @__PURE__ */ r(B, { label: i, value: s }, i)) }) });
-}), x = c.memo(function({
+  return /* @__PURE__ */ r("div", { className: "overflow-hidden rounded-lg border border-border/60 bg-background/80 dark:border-white/10", children: /* @__PURE__ */ r("dl", { className: "divide-y divide-border/50 dark:divide-white/10", children: o.map(([a, s]) => /* @__PURE__ */ r(q, { label: a, value: s }, a)) }) });
+}), N = l.memo(function({
   label: t,
   value: o,
-  view: i = "table",
+  view: a = "table",
   className: s,
   ...d
 }) {
-  const n = c.useMemo(() => w(o), [o]);
-  return /* @__PURE__ */ a("section", { className: l("space-y-2", s), ...d, children: [
-    /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-3", children: [
+  const i = l.useMemo(() => C(o), [o]);
+  return /* @__PURE__ */ n("section", { className: c("space-y-2", s), ...d, children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center justify-between gap-3", children: [
       /* @__PURE__ */ r("h4", { className: "font-medium text-foreground text-xs", children: t }),
       /* @__PURE__ */ r(
-        E,
+        k,
         {
           className: "size-7 shrink-0 text-muted-foreground hover:text-foreground",
-          content: n,
+          content: i,
           size: "icon",
           variant: "ghost"
         }
       )
     ] }),
-    /* @__PURE__ */ r(h, { activeView: i, panelView: "table", children: /* @__PURE__ */ r(F, { value: o }) }),
-    /* @__PURE__ */ r(h, { activeView: i, lazy: !0, panelView: "code", children: /* @__PURE__ */ r(
-      N,
+    /* @__PURE__ */ r(x, { activeView: a, panelView: "table", children: /* @__PURE__ */ r(G, { value: o }) }),
+    /* @__PURE__ */ r(x, { activeView: a, lazy: !0, panelView: "code", children: /* @__PURE__ */ r(
+      v,
       {
         className: "rounded-lg border border-border/60 bg-background/80 dark:border-white/10",
-        code: n
+        code: i
       }
     ) })
   ] });
 });
-function Q({ className: e, ...t }) {
+function K({
+  title: e,
+  description: t,
+  details: o
+}) {
+  return /* @__PURE__ */ n(
+    D,
+    {
+      className: "rounded-lg border border-destructive/25 bg-destructive/[0.04] dark:border-destructive/20 dark:bg-destructive/[0.06]",
+      "data-slot": "tool-call-error-notice",
+      disabled: !o,
+      children: [
+        /* @__PURE__ */ n(
+          H,
+          {
+            className: c(
+              "group flex w-full items-start gap-2.5 px-3 py-2.5 text-left",
+              o && "cursor-pointer"
+            ),
+            children: [
+              /* @__PURE__ */ r(w, { className: "mt-0.5 size-3.5 shrink-0 text-destructive" }),
+              /* @__PURE__ */ n("div", { className: "min-w-0 flex-1 space-y-0.5", children: [
+                /* @__PURE__ */ r("p", { className: "font-medium text-foreground text-sm", children: e }),
+                /* @__PURE__ */ r("p", { className: "text-muted-foreground text-xs", children: t })
+              ] }),
+              o && /* @__PURE__ */ n(S, { children: [
+                /* @__PURE__ */ n("span", { className: "mt-0.5 inline-flex shrink-0 items-center gap-1 text-[11px] text-muted-foreground group-data-[state=open]:hidden", children: [
+                  "Details",
+                  /* @__PURE__ */ r(h, { className: "size-3" })
+                ] }),
+                /* @__PURE__ */ n("span", { className: "mt-0.5 hidden shrink-0 items-center gap-1 text-[11px] text-muted-foreground group-data-[state=open]:inline-flex", children: [
+                  "Hide",
+                  /* @__PURE__ */ r(h, { className: "size-3 rotate-90" })
+                ] })
+              ] })
+            ]
+          }
+        ),
+        o && /* @__PURE__ */ r(F, { children: /* @__PURE__ */ n("div", { className: "relative rounded-b-lg border-border/50 border-t bg-card px-3 py-2.5 dark:border-white/10", children: [
+          /* @__PURE__ */ r(
+            k,
+            {
+              className: "absolute top-2 right-2 size-6 text-muted-foreground/60 hover:text-muted-foreground",
+              content: o,
+              size: "icon",
+              variant: "ghost"
+            }
+          ),
+          /* @__PURE__ */ r("pre", { className: "wrap-break-word overflow-auto whitespace-pre-wrap pr-8 font-mono text-[11px] text-muted-foreground leading-relaxed", children: o })
+        ] }) })
+      ]
+    }
+  );
+}
+function oe({ className: e, ...t }) {
   return /* @__PURE__ */ r(
-    j,
+    O,
     {
-      className: l("w-full", e),
+      className: c("w-full", e),
       "data-slot": "tool-call-accordion",
       ...t
     }
   );
 }
-function U({
+function ne({
   className: e,
   ...t
 }) {
   return /* @__PURE__ */ r(
-    I,
+    J,
     {
-      className: l(
+      className: c(
         "w-full overflow-hidden rounded-xl border border-border/50 bg-card/75 shadow-sm last:border-b dark:border-white/10 dark:shadow-black/20",
         e
       ),
@@ -171,57 +226,57 @@ function U({
     }
   );
 }
-function X({
+function ie({
   className: e,
   state: t,
   toolName: o,
-  icon: i,
+  icon: a,
   showStateIndicator: s = !0,
   ...d
 }) {
-  const n = t ?? "calling", m = i ?? /* @__PURE__ */ r(C, { className: "size-3.5 text-muted-foreground" }), g = {
-    calling: /* @__PURE__ */ r(V, { className: "size-3 shrink-0 animate-spin text-orange-500" }),
-    complete: /* @__PURE__ */ r(S, { className: "size-3 shrink-0 text-green-500" }),
-    error: /* @__PURE__ */ r(v, { className: "size-3 shrink-0 text-destructive" })
+  const i = t ?? "calling", m = a ?? /* @__PURE__ */ r(j, { className: "size-3.5 text-muted-foreground" }), g = {
+    calling: /* @__PURE__ */ r(E, { className: "size-3 shrink-0 animate-spin text-orange-500" }),
+    complete: /* @__PURE__ */ r(I, { className: "size-3 shrink-0 text-green-500" }),
+    error: /* @__PURE__ */ r(w, { className: "size-3 shrink-0 text-destructive" })
   }, f = {
     calling: "Running",
     complete: "Completed",
     error: "Failed"
   };
-  return /* @__PURE__ */ a(
-    O,
+  return /* @__PURE__ */ n(
+    $,
     {
-      className: l(
+      className: c(
         "items-center gap-3 px-3 py-3 hover:bg-muted/15 hover:no-underline [&>svg]:translate-y-0 [&>svg]:self-center",
-        J({ state: n }),
+        M({ state: i }),
         e
       ),
       "data-slot": "tool-call-accordion-trigger",
       ...d,
       children: [
-        /* @__PURE__ */ a("div", { className: "relative shrink-0", children: [
+        /* @__PURE__ */ n("div", { className: "relative shrink-0", children: [
           /* @__PURE__ */ r("div", { className: "flex size-8 items-center justify-center rounded-full bg-muted/45 ring-1 ring-border/50", children: m }),
           s && /* @__PURE__ */ r(
             "span",
             {
               "aria-hidden": "true",
-              className: R({
-                state: n
+              className: B({
+                state: i
               })
             }
           )
         ] }),
         /* @__PURE__ */ r("div", { className: "min-w-0 flex-1 text-left", children: /* @__PURE__ */ r("span", { className: "block truncate text-foreground text-xs", children: o }) }),
-        /* @__PURE__ */ a(
+        /* @__PURE__ */ n(
           "span",
           {
-            className: l(
+            className: c(
               "inline-flex shrink-0 items-center gap-1.5 self-center text-[11px] text-muted-foreground leading-none",
-              n === "error" && "text-destructive"
+              i === "error" && "text-destructive"
             ),
             children: [
-              g[n],
-              f[n]
+              g[i],
+              f[i]
             ]
           }
         )
@@ -229,73 +284,75 @@ function X({
     }
   );
 }
-function Y({
+function ae({
   className: e,
   children: t,
   view: o,
-  onViewChange: i,
+  onViewChange: a,
   showViewToggle: s = !0,
   args: d,
-  result: n,
-  ...m
+  result: i,
+  errorNotice: m,
+  ...g
 }) {
-  const [g, f] = c.useState("table"), [, k] = c.useTransition(), u = o ?? g, b = (p) => {
-    i?.(p), o === void 0 && k(() => f(p));
+  const [f, T] = l.useState("table"), [, A] = l.useTransition(), u = o ?? f, p = (b) => {
+    a?.(b), o === void 0 && A(() => T(b));
   };
   return /* @__PURE__ */ r(
-    z,
+    R,
     {
       className: "w-full border-border/50 border-t bg-muted/10 dark:border-white/10",
       "data-slot": "tool-call-accordion-content",
-      ...m,
-      children: /* @__PURE__ */ a("div", { className: l("space-y-3 overflow-auto px-3 py-3", e), children: [
-        s && /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-3", children: [
+      ...g,
+      children: /* @__PURE__ */ n("div", { className: c("space-y-3 overflow-auto px-3 py-3", e), children: [
+        s && /* @__PURE__ */ n("div", { className: "flex items-center justify-between gap-3", children: [
           /* @__PURE__ */ r("p", { className: "truncate text-[11px] text-muted-foreground", children: "Inspect payload and response" }),
-          /* @__PURE__ */ a("div", { className: "inline-flex shrink-0 items-center gap-0.5 rounded-lg border border-border/60 bg-background/70 p-0.5 shadow-sm dark:border-white/10", children: [
-            /* @__PURE__ */ a(
+          /* @__PURE__ */ n("div", { className: "inline-flex shrink-0 items-center gap-0.5 rounded-lg border border-border/60 bg-background/70 p-0.5 shadow-sm dark:border-white/10", children: [
+            /* @__PURE__ */ n(
               "button",
               {
-                className: l(
+                className: c(
                   "inline-flex h-6.5 items-center justify-center gap-1.5 rounded-md px-2.5 text-[11px] transition-colors",
                   u === "table" ? "bg-background text-foreground shadow-sm ring-1 ring-border/60" : "text-muted-foreground hover:bg-background/60 hover:text-foreground"
                 ),
-                onClick: () => b("table"),
+                onClick: () => p("table"),
                 type: "button",
                 children: [
-                  /* @__PURE__ */ r(A, { className: "size-3.5" }),
+                  /* @__PURE__ */ r(z, { className: "size-3.5" }),
                   "Table"
                 ]
               }
             ),
-            /* @__PURE__ */ a(
+            /* @__PURE__ */ n(
               "button",
               {
-                className: l(
+                className: c(
                   "inline-flex h-6.5 items-center justify-center gap-1.5 rounded-md px-2.5 text-[11px] transition-colors",
                   u === "code" ? "bg-background text-foreground shadow-sm ring-1 ring-border/60" : "text-muted-foreground hover:bg-background/60 hover:text-foreground"
                 ),
-                onClick: () => b("code"),
+                onClick: () => p("code"),
                 type: "button",
                 children: [
-                  /* @__PURE__ */ r(T, { className: "size-3.5" }),
+                  /* @__PURE__ */ r(V, { className: "size-3.5" }),
                   "JSON"
                 ]
               }
             )
           ] })
         ] }),
-        /* @__PURE__ */ a("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ n("div", { className: "space-y-3", children: [
           t,
-          d !== void 0 && /* @__PURE__ */ r(x, { label: "Parameters", value: d, view: u }),
-          n !== void 0 && /* @__PURE__ */ r(x, { label: "Response", value: n, view: u })
+          m && /* @__PURE__ */ r(K, { ...m }),
+          d !== void 0 && /* @__PURE__ */ r(N, { label: "Parameters", value: d, view: u }),
+          i !== void 0 && /* @__PURE__ */ r(N, { label: "Response", value: i, view: u })
         ] })
       ] })
     }
   );
 }
 export {
-  Q as ToolCallAccordion,
-  Y as ToolCallAccordionContent,
-  U as ToolCallAccordionItem,
-  X as ToolCallAccordionTrigger
+  oe as ToolCallAccordion,
+  ae as ToolCallAccordionContent,
+  ne as ToolCallAccordionItem,
+  ie as ToolCallAccordionTrigger
 };

package/dist/components/ui/templates/chat-template-skeletons.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chat-template-skeletons.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/templates/chat-template-skeletons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAcpC,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;AAErE,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAYzB;AAID,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEhE,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,qBAAqB,2CAevB;AAkBD,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;AAErE,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAyBzB;AAID,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEnE,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,wBAAwB,2CA8C1B;AAID,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEnE,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,wBAAwB,2CAQ1B"}
+{"version":3,"file":"chat-template-skeletons.d.ts","sourceRoot":"","sources":["../../../../lib/components/ui/templates/chat-template-skeletons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAepC,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;AAErE,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAYzB;AAID,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEhE,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,qBAAqB,2CAevB;AAID,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;AAErE,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAyBzB;AAID,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEnE,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,wBAAwB,2CA8C1B;AAID,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEnE,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,wBAAwB,2CAQ1B"}

package/dist/components/ui/templates/chat-template-skeletons.js

@@ -1,61 +1,53 @@
 import { jsx as e, jsxs as a } from "react/jsx-runtime";
 import { Skeleton as l } from "../atoms/skeleton.js";
-import { ChatTemplateOverview as o, ChatTemplate as t, ChatTemplateFooter as i, ChatTemplateSuggestions as h, ChatTemplateHeader as p, ChatTemplateHeaderGroup as n } from "./chat-template.js";
-import { cn as m } from "../../../lib/utils.js";
-function f({
+import { SuggestionCardSkeleton as o } from "../molecules/suggestion-card.js";
+import { ChatTemplateOverview as c, ChatTemplate as i, ChatTemplateFooter as h, ChatTemplateSuggestions as p, ChatTemplateHeader as f, ChatTemplateHeaderGroup as n } from "./chat-template.js";
+import { cn as r } from "../../../lib/utils.js";
+function u({
   className: s,
   ...d
 }) {
-  return /* @__PURE__ */ a(p, { className: s, ...d, children: [
+  return /* @__PURE__ */ a(f, { className: s, ...d, children: [
     /* @__PURE__ */ e(n, { children: /* @__PURE__ */ e(l, { className: "h-7 w-7 rounded-md" }) }),
     /* @__PURE__ */ e("div", { className: "flex-1" }),
     /* @__PURE__ */ e(n, { children: /* @__PURE__ */ e(l, { className: "h-9 w-9 rounded-md sm:w-[88px]" }) })
   ] });
 }
-function u({
+function x({
   className: s,
   ...d
 }) {
   return /* @__PURE__ */ e(
     "div",
     {
-      className: m(
+      className: r(
         "flex min-w-0 flex-1 flex-col gap-6 overflow-y-auto pt-4",
         s
       ),
       ...d,
-      children: /* @__PURE__ */ a(o, { children: [
+      children: /* @__PURE__ */ a(c, { children: [
         /* @__PURE__ */ e(l, { className: "mx-auto mb-2 h-8 w-40 rounded-lg sm:mb-4 sm:h-9 sm:w-48 md:h-[44px] md:w-56" }),
         /* @__PURE__ */ e(l, { className: "mx-auto mb-4 h-7 w-56 rounded-lg sm:mb-8 sm:h-8 sm:w-72 md:h-[44px] md:w-96" })
       ] })
     }
   );
 }
-function x() {
-  return /* @__PURE__ */ a("div", { className: "flex w-full flex-col gap-2 rounded-2xl border bg-card p-4 shadow-xs", children: [
-    /* @__PURE__ */ e(l, { className: "h-8 w-8 rounded-xl sm:h-10 sm:w-10" }),
-    /* @__PURE__ */ a("div", { className: "space-y-2 pt-2", children: [
-      /* @__PURE__ */ e(l, { className: "h-4 w-3/4" }),
-      /* @__PURE__ */ e(l, { className: "h-3 w-1/2" })
-    ] })
-  ] });
-}
 function N({
   className: s,
   ...d
 }) {
-  return /* @__PURE__ */ a(i, { className: s, ...d, children: [
-    /* @__PURE__ */ e(h, { children: Array.from({ length: 5 }).map((c, r) => /* @__PURE__ */ e(
+  return /* @__PURE__ */ a(h, { className: s, ...d, children: [
+    /* @__PURE__ */ e(p, { children: Array.from({ length: 5 }).map((t, m) => /* @__PURE__ */ e(
       "div",
       {
-        className: m(
+        className: r(
           "col-span-12 sm:col-span-6",
-          r < 3 ? "md:col-span-4" : "md:col-span-6",
-          r > 1 && "hidden sm:block"
+          m < 3 ? "md:col-span-4" : "md:col-span-6",
+          m > 1 && "hidden sm:block"
         ),
-        children: /* @__PURE__ */ e(x, {})
+        children: /* @__PURE__ */ e(o, {})
       },
-      `suggestion-skeleton-${r.toString()}`
+      `suggestion-skeleton-${m.toString()}`
     )) }),
     /* @__PURE__ */ a("div", { className: "rounded-lg border bg-background p-2 shadow-xs", children: [
       /* @__PURE__ */ e(l, { className: "h-[44px] w-full rounded-md" }),
@@ -63,14 +55,14 @@ function N({
     ] })
   ] });
 }
-function C({
+function k({
   className: s,
   ...d
 }) {
   return /* @__PURE__ */ a(
     "div",
     {
-      className: m(
+      className: r(
         "flex w-(--sidebar-width) shrink-0 flex-col bg-sidebar p-2",
         s
       ),
@@ -82,7 +74,7 @@ function C({
         ] }),
         /* @__PURE__ */ a("div", { className: "flex-1 overflow-hidden py-2", children: [
           /* @__PURE__ */ e("div", { className: "px-2 py-1", children: /* @__PURE__ */ e(l, { className: "mb-2 h-3 w-12" }) }),
-          /* @__PURE__ */ e("div", { className: "flex flex-col gap-0.5", children: Array.from({ length: 6 }).map((c, r) => /* @__PURE__ */ e(
+          /* @__PURE__ */ e("div", { className: "flex flex-col gap-0.5", children: Array.from({ length: 6 }).map((t, m) => /* @__PURE__ */ e(
             "div",
             {
               className: "flex h-8 items-center gap-2 rounded-md px-2",
@@ -90,11 +82,11 @@ function C({
                 l,
                 {
                   className: "h-4 flex-1",
-                  style: { maxWidth: `${55 + r * 17 % 35}%` }
+                  style: { maxWidth: `${55 + m * 17 % 35}%` }
                 }
               )
             },
-            `skeleton-row-${r.toString()}`
+            `skeleton-row-${m.toString()}`
           )) })
         ] }),
         /* @__PURE__ */ e("div", { className: "mt-auto p-2", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-2 rounded-lg p-2", children: [
@@ -108,20 +100,20 @@ function C({
     }
   );
 }
-function k({
+function S({
   className: s,
   ...d
 }) {
-  return /* @__PURE__ */ a(t, { className: s, ...d, children: [
-    /* @__PURE__ */ e(f, {}),
+  return /* @__PURE__ */ a(i, { className: s, ...d, children: [
     /* @__PURE__ */ e(u, {}),
+    /* @__PURE__ */ e(x, {}),
     /* @__PURE__ */ e(N, {})
   ] });
 }
 export {
-  u as ChatBodySkeleton,
-  k as ChatContentSkeleton,
+  x as ChatBodySkeleton,
+  S as ChatContentSkeleton,
   N as ChatFooterSkeleton,
-  f as ChatHeaderSkeleton,
-  C as ChatSidebarSkeleton
+  u as ChatHeaderSkeleton,
+  k as ChatSidebarSkeleton
 };