@spear-ai/spectral 1.8.9 → 1.9.0

package/dist/Tray.js

@@ -1,6 +1,6 @@
 "use client";
 import "./styles/main.css";
-import { jsx as e, jsxs as x } from "react/jsx-runtime";
+import { jsx as e, jsxs as u } from "react/jsx-runtime";
 import { ButtonIcon as K } from "./ButtonIcon.js";
 import "./Icons/AnalyzeIcon.js";
 import "./Icons/AnnotationsIcon.js";
@@ -16,7 +16,7 @@ import "./Icons/ChevronDownIcon.js";
 import "./Icons/ChevronUpIcon.js";
 import "./Icons/ClockIcon.js";
 import "./Icons/CloseCircleIcon.js";
-import { CloseIcon as f } from "./Icons/CloseIcon.js";
+import { CloseIcon as h } from "./Icons/CloseIcon.js";
 import "./Icons/DashboardIcon.js";
 import "./Icons/DatabaseIcon.js";
 import "./Icons/DeleteIcon.js";
@@ -72,10 +72,10 @@ import "./Icons/ZoomXIcon.js";
 import "./Icons/ZoomYIcon.js";
 import { cn as a } from "./utils/twUtils.js";
 import { c as M } from "./index-D29mdTf5.js";
-import { createContext as H, useRef as h, useMemo as T, useContext as I } from "react";
-import { j as g } from "./index-DEYs15GP.js";
-import { D as s } from "./index-D2Qxe4uK.js";
-import { m as v } from "./proxy-CO_-Vget.js";
+import { createContext as H, useRef as f, useMemo as T, useContext as I } from "react";
+import { j as v } from "./index-DEYs15GP.js";
+import { D as m } from "./index-Bm1RbF6w.js";
+import { m as g } from "./proxy-CO_-Vget.js";
 import { A as O } from "./index-Cl8VeY0o.js";
 const j = M("fixed bottom-4 left-1/2 z-10 -translate-x-1/2 overflow-hidden rounded-2xl bg-drawer-bg outline-none w-full sm:max-md:max-w-full", {
   variants: {
@@ -95,7 +95,7 @@ const j = M("fixed bottom-4 left-1/2 z-10 -translate-x-1/2 overflow-hidden round
     throw new Error("Tray components must be used within Tray root");
   return t;
 }, B = ({ children: t, size: r = "sm", ...o }) => {
-  const i = h("default"), n = T(
+  const i = f("default"), n = T(
     () => ({
       animationKey: i.current,
       setAnimationKey: (p) => {
@@ -105,39 +105,40 @@ const j = M("fixed bottom-4 left-1/2 z-10 -translate-x-1/2 overflow-hidden round
     }),
     [r]
   );
-  return /* @__PURE__ */ e(N.Provider, { value: n, children: /* @__PURE__ */ e(s.Root, { "data-testid": "spectral-tray", ...o, children: t }) });
+  return /* @__PURE__ */ e(N.Provider, { value: n, children: /* @__PURE__ */ e(m.Root, { "data-testid": "spectral-tray", ...o, children: t }) });
 };
 B.displayName = "Tray";
 const P = ({
   className: t,
   ref: r,
   ...o
-}) => /* @__PURE__ */ e(s.Trigger, { className: a(t), "data-testid": "spectral-tray-trigger", "data-vaul-no-drag": "", ref: r, ...o });
+}) => /* @__PURE__ */ e(m.Trigger, { className: a(t), "data-testid": "spectral-tray-trigger", "data-vaul-no-drag": "", ref: r, ...o });
 P.displayName = "TrayTrigger";
 const C = ({
   className: t,
   ref: r,
   ...o
-}) => /* @__PURE__ */ e(s.Close, { asChild: !0, className: a(t), "data-testid": "spectral-tray-close", "data-vaul-no-drag": "", ref: r, ...o, children: /* @__PURE__ */ e(f, {}) });
+}) => /* @__PURE__ */ e(m.Close, { asChild: !0, className: a(t), "data-testid": "spectral-tray-close", "data-vaul-no-drag": "", ref: r, ...o, children: /* @__PURE__ */ e(h, {}) });
 C.displayName = "TrayClose";
 const w = ({
   className: t,
   ref: r,
   ...o
-}) => /* @__PURE__ */ e(s.Overlay, { className: a("bg-overlay fixed inset-0 z-10", t), ref: r, ...o });
+}) => /* @__PURE__ */ e(m.Overlay, { className: a("bg-overlay fixed inset-0 z-10", t), ref: r, ...o });
 w.displayName = "TrayOverlay";
 const S = ({
-  children: t,
-  className: r,
-  ref: o,
-  size: i,
-  ...n
+  "aria-label": t,
+  children: r,
+  className: o,
+  ref: i,
+  size: n,
+  ...p
 }) => {
-  const { size: p } = b(), l = i ?? p, [m, c] = g();
-  return /* @__PURE__ */ x(s.Portal, { children: [
+  const { size: l } = b(), s = n ?? l, [d, c] = v();
+  return /* @__PURE__ */ u(m.Portal, { children: [
     /* @__PURE__ */ e(w, {}),
-    /* @__PURE__ */ e(s.Content, { asChild: !0, className: a(j({ size: l }), r), "data-testid": "spectral-tray-content", ref: o, ...n, children: /* @__PURE__ */ e(
-      v.div,
+    /* @__PURE__ */ e(m.Content, { "aria-describedby": void 0, asChild: !0, className: a(j({ size: s }), o), "data-testid": "spectral-tray-content", ref: i, ...p, children: /* @__PURE__ */ u(
+      g.div,
       {
         animate: {
           height: c.height,
@@ -146,7 +147,10 @@ const S = ({
             ease: [0.25, 1, 0.5, 1]
           }
         },
-        children: /* @__PURE__ */ e("div", { ref: m, className: "px-6 pt-2.5 pb-6 antialiased", children: t })
+        children: [
+          /* @__PURE__ */ e(m.Title, { className: "sr-only", children: t ?? "Tray" }),
+          /* @__PURE__ */ e("div", { ref: d, className: "px-6 pt-2.5 pb-6 antialiased", children: r })
+        ]
       }
     ) })
   ] });
@@ -157,9 +161,9 @@ const V = ({
   className: r,
   ref: o,
   ...i
-}) => /* @__PURE__ */ x("div", { className: a("relative flex flex-col space-y-1.5 pb-4 text-start", r), "data-testid": "spectral-tray-header", ref: o, ...i, children: [
+}) => /* @__PURE__ */ u("div", { className: a("relative flex flex-col space-y-1.5 pb-4 text-start", r), "data-testid": "spectral-tray-header", ref: o, ...i, children: [
   t,
-  /* @__PURE__ */ e(C, { className: "hover:bg-level-four absolute top-0 right-[-14px] z-10 cursor-pointer rounded-full p-1 text-neutral-400 transition-colors hover:scale-110 hover:text-neutral-100", children: /* @__PURE__ */ e(K, { icon: /* @__PURE__ */ e(f, {}), label: "Close tray", shape: "circle" }) })
+  /* @__PURE__ */ e(C, { className: "hover:bg-level-four absolute top-0 right-[-14px] z-10 cursor-pointer rounded-full p-1 text-neutral-400 transition-colors hover:scale-110 hover:text-neutral-100", children: /* @__PURE__ */ e(K, { icon: /* @__PURE__ */ e(h, {}), label: "Close tray", shape: "circle" }) })
 ] });
 V.displayName = "TrayHeader";
 const U = ({
@@ -182,20 +186,20 @@ const k = ({
   ref: i,
   ...n
 }) => {
-  const { animationKey: p } = b(), l = t ?? p, m = h(null), [c, y] = g(), z = T(() => {
-    const d = y.height, R = m.current, A = 0.27, u = 0.15;
-    if (!m.current)
-      return m.current = d, u;
-    const D = Math.abs(d - (R ?? 0));
-    return m.current = d, Math.min(Math.max(D / 500, u), A);
-  }, [y.height]);
+  const { animationKey: p } = b(), l = t ?? p, s = f(null), [d, c] = v(), z = T(() => {
+    const y = c.height, R = s.current, A = 0.27, x = 0.15;
+    if (!s.current)
+      return s.current = y, x;
+    const D = Math.abs(y - (R ?? 0));
+    return s.current = y, Math.min(Math.max(D / 500, x), A);
+  }, [c.height]);
   return /* @__PURE__ */ e("div", { ref: i, "data-testid": "spectral-tray-body", className: a(o), ...n, children: /* @__PURE__ */ e(O, { initial: !1, mode: "popLayout", custom: l, children: /* @__PURE__ */ e(
-    v.div,
+    g.div,
     {
       animate: { opacity: 1, scale: 1, y: 0 },
       exit: { opacity: 0, scale: 0.96 },
       initial: { opacity: 0, scale: 0.96 },
-      ref: c,
+      ref: d,
       transition: {
         duration: z,
         ease: [0.26, 0.08, 0.25, 1]