@spear-ai/spectral 1.4.5 → 1.4.7

package/dist/MultiSelect/MultiSelectBase.js

@@ -4,6 +4,8 @@ import { jsxs as o, jsx as r, Fragment as de } from "react/jsx-runtime";
 import "../Icons/AnalyzeIcon.js";
 import "../Icons/AnnotationsIcon.js";
 import "../Icons/ApprovedIcon.js";
+import "../Icons/ArrowDownIcon.js";
+import "../Icons/ArrowUpIcon.js";
 import "../Icons/CalendarIcon.js";
 import "../Icons/CheckCircleIcon.js";
 import "../Icons/CheckSquareIcon.js";
@@ -61,57 +63,51 @@ import "../Icons/ZoomYIcon.js";
 import { ErrorMessage as me } from "../utils/formFieldUtils.js";
 import { cn as f } from "../utils/twUtils.js";
 import { forwardRef as be, useId as fe, useState as L, useRef as _, useMemo as T, useCallback as b, useEffect as ge } from "react";
-import { c as he } from "../createLucideIcon-B_8CJpcQ.js";
-/**
- * @license lucide-react v0.546.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
+import { c as he } from "../createLucideIcon-D4r5Phnh.js";
 const xe = [
   ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
-], ye = he("search", xe), ve = "h-4 w-4", we = (i) => ({
+], ye = he("search", xe), ve = "h-4 w-4", we = (s) => ({
   error: "border-danger hover:border-danger focus-visible:border-danger focus-visible:ring-danger",
   loading: "cursor-wait border-input-border--disabled",
   disabled: "cursor-not-allowed opacity-50 border-input-border--disabled bg-input-bg--disabled",
   default: ""
-})[i], Ne = (i, l, d) => f(
+})[s], Ne = (s, l, d) => f(
   "flex h-12 w-full items-center justify-between rounded-lg border border-input-border bg-input-bg px-4 py-3 text-sm",
   "hover:border-input-border--hover focus:border-input-border--focus focus:outline-none",
   "focus:ring-2 focus:ring-black focus:ring-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-black focus-visible:ring-offset-2",
   "disabled:cursor-not-allowed disabled:opacity-50 disabled:border-input-border--disabled disabled:bg-input-bg--disabled",
   "transition duration-200 text-input-text",
   l && "border-input-border--focus ring-2 ring-black ring-offset-2",
-  we(i),
+  we(s),
   d
-), ke = (i) => f(
+), ke = (s) => f(
   "absolute top-full left-0 right-0 z-50 mt-1 max-h-80 overflow-hidden rounded-lg border border-input-border bg-input-bg shadow-lg",
   "transition-all duration-200 origin-top",
-  i ? "scale-100 opacity-100 translate-y-0" : "scale-95 opacity-0 -translate-y-1 pointer-events-none"
-), Ce = (i) => {
+  s ? "scale-100 opacity-100 translate-y-0" : "scale-95 opacity-0 -translate-y-1 pointer-events-none"
+), Ce = (s) => {
   const l = _(null);
   return ge(() => {
     const d = (n) => {
-      l.current && !l.current.contains(n.target) && i();
+      l.current && !l.current.contains(n.target) && s();
     };
     return document.addEventListener("mousedown", d), () => document.removeEventListener("mousedown", d);
-  }, [i]), l;
-}, Ie = (i, l, d) => {
+  }, [s]), l;
+}, Ie = (s, l, d) => {
   const [n, g] = L(-1), I = b(
     (u) => {
       const v = {
         ArrowDown: () => {
-          u.preventDefault(), g((h) => Math.min(h + 1, i.length - 1));
+          u.preventDefault(), g((h) => Math.min(h + 1, s.length - 1));
         },
         ArrowUp: () => {
           u.preventDefault(), g((h) => Math.max(h - 1, -1));
         },
         Enter: () => {
-          u.preventDefault(), n >= 0 && i[n] && l(i[n].value);
+          u.preventDefault(), n >= 0 && s[n] && l(s[n].value);
         },
         " ": () => {
-          u.preventDefault(), n >= 0 && i[n] && l(i[n].value);
+          u.preventDefault(), n >= 0 && s[n] && l(s[n].value);
         },
         Escape: () => {
           u.preventDefault(), d();
@@ -119,12 +115,12 @@ const xe = [
       }[u.key];
       v && v();
     },
-    [i, n, l, d]
+    [s, n, l, d]
   );
   return { focusedIndex: n, setFocusedIndex: g, handleKeyDown: I };
 }, Se = be(
   ({
-    className: i,
+    className: s,
     clearAllLabel: l = "Clear all",
     closeOnSelect: d = !1,
     emptyMessage: n = "No options found",
@@ -150,13 +146,13 @@ const xe = [
     ...z
   }, J) => {
     const Q = fe(), S = I || `${h}-${Q}`, K = `${S}-error`, [y, k] = L(!1), [D, W] = L(""), X = Ce(() => k(!1)), A = _(null), O = z.disabled || x === "disabled", Y = x === "loading", ee = x === "error", w = T(() => {
-      let e = m.filter((s) => s.label.toLowerCase().includes(D.toLowerCase()));
-      return R && (e = [...e].sort((s, t) => s.label.localeCompare(t.label))), e;
+      let e = m.filter((i) => i.label.toLowerCase().includes(D.toLowerCase()));
+      return R && (e = [...e].sort((i, t) => i.label.localeCompare(t.label))), e;
     }, [m, D, R]), N = T(() => {
-      const e = {}, s = [];
+      const e = {}, i = [];
       return w.forEach((t) => {
-        t.group ? (e[t.group] || (e[t.group] = []), e[t.group].push(t)) : s.push(t);
-      }), { groups: e, ungrouped: s, hasGroups: Object.keys(e).length > 0 };
+        t.group ? (e[t.group] || (e[t.group] = []), e[t.group].push(t)) : i.push(t);
+      }), { groups: e, ungrouped: i, hasGroups: Object.keys(e).length > 0 };
     }, [w]), C = b(
       (e) => {
         if (m.find((c) => c.value === e)?.disabled) return;
@@ -164,24 +160,24 @@ const xe = [
         p(t), d && k(!1);
       },
       [m, a, p, d]
-    ), { focusedIndex: te, handleKeyDown: re } = Ie(w, C, () => k(!1)), se = b(() => {
+    ), { focusedIndex: te, handleKeyDown: re } = Ie(w, C, () => k(!1)), ie = b(() => {
       O || k((e) => (e || setTimeout(() => A.current?.focus(), 0), !e));
-    }, [O]), ie = b(() => {
-      const e = m.filter((t) => !t.disabled).map((t) => t.value), s = e.every((t) => a.includes(t));
-      p(s ? [] : e);
+    }, [O]), se = b(() => {
+      const e = m.filter((t) => !t.disabled).map((t) => t.value), i = e.every((t) => a.includes(t));
+      p(i ? [] : e);
     }, [m, a, p]), j = b(() => {
       p([]);
     }, [p]), oe = b((e) => {
       W(e.target.value);
     }, []), le = b(
-      (e, s) => {
-        s.stopPropagation(), C(e);
+      (e, i) => {
+        i.stopPropagation(), C(e);
       },
       [C]
     ), ne = () => {
       if (a.length === 0)
         return /* @__PURE__ */ r("span", { className: "text-input-text-placeholder", children: $ });
-      const e = a.slice(0, v), s = a.length - v;
+      const e = a.slice(0, v), i = a.length - v;
       return /* @__PURE__ */ o("div", { className: "flex items-center gap-1 flex-wrap", children: [
         e.map((t) => {
           const c = m.find((E) => E.value === t);
@@ -190,13 +186,13 @@ const xe = [
             /* @__PURE__ */ r("button", { "aria-label": `Remove ${c.label}`, className: "hover:text-danger focus:outline-none", "data-testid": "spectral-multiselect-remove-item-button", onClick: (E) => le(t, E), type: "button", children: /* @__PURE__ */ r(P, { size: 12 }) })
           ] }, t) : null;
         }),
-        s > 0 && /* @__PURE__ */ o("span", { className: "text-input-text-secondary text-xs", children: [
+        i > 0 && /* @__PURE__ */ o("span", { className: "text-input-text-secondary text-xs", children: [
           "+",
-          s,
+          i,
           " more"
         ] })
       ] });
-    }, F = (e, s) => {
+    }, F = (e, i) => {
       const t = a.includes(e.value);
       return /* @__PURE__ */ o(
         "button",
@@ -204,7 +200,7 @@ const xe = [
           className: f(
             "w-full flex items-center gap-3 px-3 py-2 text-sm text-left hover:bg-input-bg--hover focus:bg-input-bg--hover focus:outline-none",
             "disabled:opacity-50 disabled:cursor-not-allowed",
-            s === te && "bg-input-bg--hover",
+            i === te && "bg-input-bg--hover",
             t && "text-input-text font-medium"
           ),
           disabled: e.disabled,
@@ -231,13 +227,13 @@ const xe = [
             "aria-describedby": f(ee && K, q),
             "aria-expanded": y,
             "aria-label": Z || u,
-            className: Ne(x, y, i),
+            className: Ne(x, y, s),
             "data-state": x,
             "data-testid": "spectral-multiselect-trigger",
             disabled: O,
             id: S,
             name: h,
-            onClick: se,
+            onClick: ie,
             ref: J,
             role: "combobox",
             style: ae(),
@@ -294,18 +290,18 @@ const xe = [
                 {
                   className: "w-full flex items-center gap-3 px-3 py-2 text-sm font-medium text-input-text-secondary hover:bg-input-bg--hover focus:bg-input-bg--hover focus:outline-none",
                   "data-testid": "spectral-multiselect-select-all-button",
-                  onClick: ie,
+                  onClick: se,
                   type: "button",
                   children: H
                 }
               ),
               /* @__PURE__ */ r("div", { className: "mx-3 my-1 h-px bg-input-border" })
             ] }),
-            N.ungrouped.length > 0 && /* @__PURE__ */ r("div", { className: "mb-1", children: N.ungrouped.map((e, s) => F(e, s)) }),
-            Object.entries(N.groups).map(([e, s]) => /* @__PURE__ */ o("div", { className: "mb-1", "data-testid": "spectral-multiselect-group", children: [
+            N.ungrouped.length > 0 && /* @__PURE__ */ r("div", { className: "mb-1", children: N.ungrouped.map((e, i) => F(e, i)) }),
+            Object.entries(N.groups).map(([e, i]) => /* @__PURE__ */ o("div", { className: "mb-1", "data-testid": "spectral-multiselect-group", children: [
               (N.ungrouped.length > 0 || Object.keys(N.groups).indexOf(e) > 0) && /* @__PURE__ */ r("div", { className: "mx-3 my-1 h-px bg-input-border" }),
               /* @__PURE__ */ r("div", { "data-testid": "spectral-multiselect-group-name", className: "px-3 py-1 text-xs font-semibold text-input-text-secondary uppercase tracking-wide", children: e }),
-              s.map((t, c) => F(t, w.indexOf(t)))
+              i.map((t, c) => F(t, w.indexOf(t)))
             ] }, e)),
             V && a.length > 0 && /* @__PURE__ */ o("div", { className: "mt-1", children: [
               /* @__PURE__ */ r("div", { className: "mx-3 my-1 h-px bg-input-border" }),

package/dist/RadioGroup.js

@@ -432,7 +432,7 @@ const B = he(
       "data-testid": "spectral-radio-group-item",
       className: F(
         "relative aspect-square h-4.5 w-4.5 rounded-full border-2 border-border-subtle bg-radio-bg ring-black transition-colors cursor-pointer",
-        "hover:border-radio-border--hover focus-visible:ring-1 focus-visible:ring-offset-2",
+        "hover:border-radio-border--hover focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-accent",
         "[&[data-state=checked]]:border-radio-border--selected [&[data-state=checked]]:bg-radio-bg",
         o && A,
         r

package/dist/Select.js

@@ -4,6 +4,8 @@ import { jsxs as r, jsx as t, Fragment as S } from "react/jsx-runtime";
 import "./Icons/AnalyzeIcon.js";
 import "./Icons/AnnotationsIcon.js";
 import "./Icons/ApprovedIcon.js";
+import "./Icons/ArrowDownIcon.js";
+import "./Icons/ArrowUpIcon.js";
 import "./Icons/CalendarIcon.js";
 import "./Icons/CheckCircleIcon.js";
 import "./Icons/CheckSquareIcon.js";

package/dist/Textarea.js

@@ -5,6 +5,8 @@ import { useTextarea as z } from "./Textarea/TextareaUtils.js";
 import "./Icons/AnalyzeIcon.js";
 import "./Icons/AnnotationsIcon.js";
 import "./Icons/ApprovedIcon.js";
+import "./Icons/ArrowDownIcon.js";
+import "./Icons/ArrowUpIcon.js";
 import "./Icons/CalendarIcon.js";
 import "./Icons/CheckCircleIcon.js";
 import "./Icons/CheckSquareIcon.js";

package/dist/Toggle/ToggleBase.d.ts

@@ -13,5 +13,5 @@ export declare const ToggleBase: import('react').ForwardRefExoticComponent<Omit<
     onPressedChange?: (pressed: boolean) => void;
     disabled?: boolean;
     asChild?: boolean;
-} & import('react').RefAttributes<HTMLButtonElement>>;
+} & import('react').RefAttributes<HTMLButtonElement | HTMLDivElement>>;
 //# sourceMappingURL=ToggleBase.d.ts.map

package/dist/Toggle/ToggleBase.js

@@ -1,28 +1,46 @@
 "use client";
 import "../styles/main.css";
-import { jsx as h } from "react/jsx-runtime";
+import { jsx as f } from "react/jsx-runtime";
 import { useControllableState as k } from "../hooks/useControllableState.js";
-import { Slot as y } from "../primitives/slot.js";
-import { forwardRef as P, useCallback as f } from "react";
-const B = P(function({ pressed: u, defaultPressed: d = !1, onPressedChange: p, disabled: t, className: i, onKeyDown: n, onClick: a, type: m = "button", asChild: s = !1, ...c }, g) {
-  const [o, l] = k({
-    value: u,
-    defaultValue: d,
-    onChange: p
-  }), r = f(() => {
-    t || l(!o);
-  }, [t, o, l]), v = f(
+import { Slot as C } from "../primitives/slot.js";
+import { forwardRef as T, useCallback as s } from "react";
+const B = T(function({ pressed: c, defaultPressed: m = !1, onPressedChange: g, disabled: t, className: v, onKeyDown: a, onClick: n, type: h = "button", asChild: b = !1, children: l, ...u }, d) {
+  const [r, i] = k({
+    defaultValue: m,
+    onChange: g,
+    value: c
+  }), o = s(() => {
+    t || i(!r);
+  }, [t, r, i]), x = s(
     (e) => {
-      n && n(e), !e.defaultPrevented && (e.key === " " || e.key === "Enter") && (e.preventDefault(), r());
+      a && a(e), !e.defaultPrevented && (e.key === " " || e.key === "Enter") && (e.preventDefault(), o());
     },
-    [r, n]
-  ), C = f(
+    [o, a]
+  ), P = s(
     (e) => {
-      a && a(e), !e.defaultPrevented && r();
+      n && n(e), !e.defaultPrevented && o();
     },
-    [r, a]
-  );
-  return /* @__PURE__ */ h(s ? y : "button", { ...c, ref: g, type: s ? void 0 : m, "aria-pressed": o, "data-state": o ? "on" : "off", "data-disabled": t ? "" : void 0, disabled: t, onKeyDown: v, onClick: C, className: i });
+    [o, n]
+  ), p = {
+    "aria-disabled": t || void 0,
+    "aria-pressed": r,
+    "data-state": r ? "on" : "off",
+    "data-disabled": t || void 0,
+    className: v,
+    onClick: P,
+    onKeyDown: x
+  };
+  return b ? /* @__PURE__ */ f(
+    "div",
+    {
+      ref: d,
+      role: "button",
+      tabIndex: t ? -1 : 0,
+      ...u,
+      ...p,
+      children: /* @__PURE__ */ f(C, { children: l })
+    }
+  ) : /* @__PURE__ */ f("button", { ref: d, tabIndex: t ? -1 : 0, type: h, ...u, ...p, children: l });
 });
 export {
   B as ToggleBase

package/dist/Toggle.js

@@ -1,13 +1,13 @@
 "use client";
 import "./styles/main.css";
-import { jsx as g } from "react/jsx-runtime";
-import { ToggleBase as n } from "./Toggle/ToggleBase.js";
-import { cn as s } from "./utils/twUtils.js";
-import { c as d } from "./index-D29mdTf5.js";
-import { forwardRef as l } from "react";
-const v = d(
+import { jsx as n } from "react/jsx-runtime";
+import { ToggleBase as s } from "./Toggle/ToggleBase.js";
+import { cn as d } from "./utils/twUtils.js";
+import { c as l } from "./index-D29mdTf5.js";
+import { forwardRef as v } from "react";
+const b = l(
   `
-    bg-toggle-bg inline-flex items-center justify-center gap-2 border rounded-md text-sm shadow-sm font-medium w-fit disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed
+    bg-toggle-bg inline-flex items-center justify-center gap-2 border rounded-md text-sm shadow-sm font-medium w-fit data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed
     hover:cursor-pointer data-[state=on]:text-toggle-text--active text-toggle-text hover:bg-toggle-bg--hover hover:border-toggle-border--hover data-[state=on]:bg-toggle-bg--active
     data-[state=on]:border-toggle-border--active hover:text-toggle-text--hover data-[state=on]:bg-toggle-bg--active data-[state=on]:text-toggle-text--active data-[state=on]:border-toggle-border--active
     transition-[colors] [&_svg]:pointer-events-none [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] focus:outline-none outline-none
@@ -35,8 +35,8 @@ const v = d(
       layout: "default"
     }
   }
-), m = l(({ className: e, variant: t, size: o, layout: r, ...a }, i) => /* @__PURE__ */ g(n, { ref: i, "data-slot": "toggle", "data-testid": "spectral-toggle", className: s(v({ variant: t, size: o, layout: r }), e), ...a }));
+), p = v(({ className: e, variant: t, size: o, layout: r, disabled: a, ...i }, g) => /* @__PURE__ */ n(s, { ref: g, disabled: a, "data-slot": "toggle", "data-testid": "spectral-toggle", className: d(b({ variant: t, size: o, layout: r }), e), ...i }));
 export {
-  m as Toggle,
-  v as toggleVariants
+  p as Toggle,
+  b as toggleVariants
 };

package/dist/Tooltip.d.ts

@@ -1,9 +1,14 @@
+import { VariantProps } from 'class-variance-authority';
 import { ComponentProps } from 'react';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 export declare const TooltipProvider: ({ delayDuration, ...props }: ComponentProps<typeof TooltipPrimitive.Provider>) => import("react/jsx-runtime").JSX.Element;
 export declare const Tooltip: ({ ...props }: ComponentProps<typeof TooltipPrimitive.Root>) => import("react/jsx-runtime").JSX.Element;
-export declare const TooltipTrigger: ({ ...props }: ComponentProps<typeof TooltipPrimitive.Trigger>) => import("react/jsx-runtime").JSX.Element;
-export declare const TooltipContent: ({ children, className, showArrow, sideOffset, ...props }: ComponentProps<typeof TooltipPrimitive.Content> & {
+export declare const TooltipTrigger: ({ asChild, children, ...props }: ComponentProps<typeof TooltipPrimitive.Trigger>) => import("react/jsx-runtime").JSX.Element;
+declare const tooltipVariants: (props?: ({
+    variant?: "default" | "outline" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const TooltipContent: ({ children, className, showArrow, sideOffset, variant, side, ...props }: ComponentProps<typeof TooltipPrimitive.Content> & VariantProps<typeof tooltipVariants> & {
     showArrow?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;
+export {};
 //# sourceMappingURL=Tooltip.d.ts.map