@spear-ai/spectral 1.3.20 → 1.3.22

package/dist/Slider/SliderBase.js

@@ -1,80 +1,80 @@
 "use client";
 import { jsx as k, jsxs as Q } from "react/jsx-runtime";
 import { Slot as P } from "../primitives/slot.js";
-import { createContext as W, forwardRef as z, useEffect as Z, useRef as B, useState as F, useCallback as A, useContext as U, createRef as _ } from "react";
-function E(...r) {
+import { createContext as W, forwardRef as E, useEffect as Z, useRef as G, useState as B, useCallback as A, useContext as F, createRef as _ } from "react";
+function x(...r) {
   return r.filter(Boolean).join(" ");
 }
-function I(r, o, e) {
-  return Math.min(e, Math.max(o, r));
+function I(r, i, e) {
+  return Math.min(e, Math.max(i, r));
 }
-function j(r, o, e) {
-  const a = Math.round((r - e) / o), l = e + a * o;
+function U(r, i, e) {
+  const a = Math.round((r - e) / i), l = e + a * i;
   return Number(l.toFixed(10));
 }
-function L(r, o, e) {
-  return (r - o) * 100 / (e - o);
+function L(r, i, e) {
+  return (r - i) * 100 / (e - i);
 }
-function tt(r, o, e) {
-  return o + r / 100 * (e - o);
+function tt(r, i, e) {
+  return i + r / 100 * (e - i);
 }
-function et(r, o) {
+function et(r, i) {
   let e = 0, a = 1 / 0;
   for (let l = 0; l < r.length; l += 1) {
-    const n = Math.abs(r[l] - o);
+    const n = Math.abs(r[l] - i);
     n < a && (a = n, e = l);
   }
   return e;
 }
 function nt(r) {
-  const { value: o, defaultValue: e, onChange: a } = r, [l, n] = F(e), s = Array.isArray(o), t = s ? o : l, i = A(
+  const { value: i, defaultValue: e, onChange: a } = r, [l, n] = B(e), s = Array.isArray(i), t = s ? i : l, o = A(
     (u) => {
       const d = typeof u == "function" ? u(t) : u;
       s || n(d), a?.(d);
     },
     [s, a, t]
   );
-  return [t, i];
+  return [t, o];
 }
-const x = W(null), rt = z(
+const z = W(null), rt = E(
   ({
     asChild: r,
-    className: o,
+    className: i,
     value: e,
     defaultValue: a,
     onValueChange: l,
     onValueCommit: n,
     min: s = 0,
     max: t = 100,
-    step: i = 1,
+    step: o = 1,
     minStepsBetweenThumbs: u = 0,
     orientation: d = "horizontal",
     dir: S = "ltr",
     disabled: b = !1,
-    name: p,
+    name: h,
     form: N,
     required: T,
     children: V,
     ...$
   }, c) => {
-    const [m, f] = nt({
+    const [m, p] = nt({
       value: e,
       defaultValue: a && a.length > 0 ? a : [s],
       onChange: l
     });
     Z(() => {
-      f((g) => X(g, { min: s, max: t, step: i, minStepsBetweenThumbs: u }));
-    }, [s, t, i, u, f]);
-    const v = B(null), h = B([]), [y, C] = F(null), w = A(
+      p((g) => X(g, { min: s, max: t, step: o, minStepsBetweenThumbs: u }));
+    }, [s, t, o, u]);
+    const v = G(null), f = G([]), [y, C] = B(null), w = A(
       (g, R) => {
-        const D = X(g, { min: s, max: t, step: i, minStepsBetweenThumbs: u });
-        f(D), R?.commit && n?.(D);
+        const D = X(g, { min: s, max: t, step: o, minStepsBetweenThumbs: u });
+        p(D), R?.commit && n?.(D);
       },
-      [t, s, u, n, f, i]
+      [t, s, u, n, p, o]
     ), K = A(
       (g, R, D) => {
-        const G = [...m];
-        G[g] = R, w(G, D);
+        const j = [...m];
+        j[g] = R, w(j, D);
       },
       [w, m]
     ), M = {
@@ -82,36 +82,36 @@ const x = W(null), rt = z(
       setValues: w,
       min: s,
       max: t,
-      step: i,
+      step: o,
       minStepsBetweenThumbs: u,
       orientation: d,
       dir: S,
       disabled: b,
       trackRef: v,
-      thumbsRef: h,
+      thumbsRef: f,
       activeIndex: y,
       setActiveIndex: C,
       updateAtIndex: K
     }, J = r ? P : "div", O = c;
-    return /* @__PURE__ */ k(x.Provider, { value: M, children: /* @__PURE__ */ Q(
+    return /* @__PURE__ */ k(z.Provider, { value: M, children: /* @__PURE__ */ Q(
       J,
       {
         ref: O,
         role: "presentation",
         "data-orientation": d,
         "data-disabled": b ? "" : void 0,
-        className: E(
+        className: x(
           "relative touch-none select-none",
           d === "horizontal" ? "h-6 w-full" : "h-full w-6",
-          o
+          i
         ),
         ...$,
         children: [
-          p && M.values.map((g, R) => /* @__PURE__ */ k(
+          h && M.values.map((g, R) => /* @__PURE__ */ k(
             "input",
             {
               type: "hidden",
-              name: M.values.length > 1 ? `${p}[]` : p,
+              name: M.values.length > 1 ? `${h}[]` : h,
               value: String(g),
               form: N,
               required: T && R === 0,
@@ -125,29 +125,29 @@ const x = W(null), rt = z(
     ) });
   }
 );
-rt.displayName = "Slider";
-function X(r, o) {
-  const { min: e, max: a, step: l, minStepsBetweenThumbs: n } = o, s = r.map((i) => I(j(i, l, e), e, a));
-  if (s.sort((i, u) => i - u), s.length <= 1 || n <= 0) return s;
+rt.displayName = "SliderBase";
+function X(r, i) {
+  const { min: e, max: a, step: l, minStepsBetweenThumbs: n } = i, s = r.map((o) => I(U(o, l, e), e, a));
+  if (s.sort((o, u) => o - u), s.length <= 1 || n <= 0) return s;
   const t = l * n;
-  for (let i = 1; i < s.length; i += 1)
-    s[i] - s[i - 1] < t && (s[i] = I(s[i - 1] + t, e, a));
+  for (let o = 1; o < s.length; o += 1)
+    s[o] - s[o - 1] < t && (s[o] = I(s[o - 1] + t, e, a));
   return s;
 }
-const ot = z(
-  ({ asChild: r, className: o, onPointerDown: e, ...a }, l) => {
-    const n = U(x);
+const ot = E(
+  ({ asChild: r, className: i, onPointerDown: e, ...a }, l) => {
+    const n = F(z);
     if (!n) throw new Error("SliderTrack must be used within Slider");
     const s = r ? P : "div", t = (u) => {
       n.trackRef.current = u, typeof l == "function" ? l(u) : l && "current" in l && (l.current = u);
-    }, i = A(
+    }, o = A(
       (u) => {
         if (e?.(u), u.defaultPrevented || n.disabled) return;
         const d = n.trackRef.current;
         if (!d) return;
         d.setPointerCapture?.(u.pointerId), u.preventDefault();
-        const S = d.getBoundingClientRect(), b = Y(u.clientX, u.clientY, S, n), p = et(n.values, b);
-        n.setActiveIndex(p), n.updateAtIndex(p, b), H(p, n);
+        const S = d.getBoundingClientRect(), b = Y(u.clientX, u.clientY, S, n), h = et(n.values, b);
+        n.setActiveIndex(h), n.updateAtIndex(h, b), H(h, n);
       },
       [n, e]
     );
@@ -156,30 +156,30 @@ const ot = z(
       {
         ref: t,
         "data-orientation": n.orientation,
-        className: E(
+        className: x(
           "bg-secondary relative grow rounded-full",
           n.orientation === "horizontal" ? "h-2" : "w-2",
-          o
+          i
         ),
         style: { touchAction: "none" },
-        onPointerDown: i,
+        onPointerDown: o,
         ...a
       }
     );
   }
 );
 ot.displayName = "SliderTrack";
-const it = z(
-  ({ asChild: r, className: o, style: e, ...a }, l) => {
-    const n = U(x);
+const it = E(
+  ({ asChild: r, className: i, style: e, ...a }, l) => {
+    const n = F(z);
     if (!n) throw new Error("SliderRange must be used within Slider");
-    const s = r ? P : "div", t = L(n.values[0], n.min, n.max), i = L(n.values[n.values.length - 1], n.min, n.max), u = n.orientation === "horizontal" ? { left: `${t}%`, width: `${i - t}%` } : { bottom: `${t}%`, height: `${i - t}%` };
+    const s = r ? P : "div", t = L(n.values[0], n.min, n.max), o = L(n.values[n.values.length - 1], n.min, n.max), u = n.orientation === "horizontal" ? { left: `${t}%`, width: `${o - t}%` } : { bottom: `${t}%`, height: `${o - t}%` };
     return /* @__PURE__ */ k(
       s,
       {
         ref: l,
         "data-orientation": n.orientation,
-        className: E("bg-primary absolute rounded-full", n.orientation === "horizontal" ? "h-2" : "w-2", o),
+        className: x("bg-primary absolute rounded-full", n.orientation === "horizontal" ? "h-2" : "w-2", i),
         style: { ...u, ...e },
         ...a
       }
@@ -187,61 +187,61 @@ const it = z(
   }
 );
 it.displayName = "SliderRange";
-const at = z(
-  ({ asChild: r, className: o, index: e, onKeyDown: a, onPointerDown: l, ...n }, s) => {
-    const t = U(x);
+const at = E(
+  ({ asChild: r, className: i, index: e, onKeyDown: a, onPointerDown: l, ...n }, s) => {
+    const t = F(z);
     if (!t) throw new Error("SliderThumb must be used within Slider");
-    const [i] = F(() => {
+    const [o] = B(() => {
       const c = typeof e == "number" ? e : t.thumbsRef.current.length;
       return t.thumbsRef.current[c] || (t.thumbsRef.current[c] = _()), c;
-    }), u = t.values[i] ?? t.values[t.values.length - 1], d = L(u, t.min, t.max), S = r ? P : "button", b = (c) => {
-      t.thumbsRef.current[i].current = c, typeof s == "function" ? s(c) : s && "current" in s && (s.current = c);
-    }, N = (t.activeIndex === null || t.activeIndex === i) && !t.disabled ? 0 : -1, T = A(
+    }), u = t.values[o] ?? t.values[t.values.length - 1], d = L(u, t.min, t.max), S = r ? P : "button", b = (c) => {
+      t.thumbsRef.current[o].current = c, typeof s == "function" ? s(c) : s && "current" in s && (s.current = c);
+    }, N = (t.activeIndex === null || t.activeIndex === o) && !t.disabled ? 0 : -1, T = A(
       (c) => {
         if (a?.(c), c.defaultPrevented || t.disabled) return;
-        const m = Math.max(t.step * 10, t.step), f = (w) => w === "inc" ? 1 : -1, v = (w) => st(i, w, t), h = c.key;
-        if (h === "Home") {
-          c.preventDefault(), t.updateAtIndex(i, t.min, { commit: !0 });
+        const m = Math.max(t.step * 10, t.step), p = (w) => w === "inc" ? 1 : -1, v = (w) => st(o, w, t), f = c.key;
+        if (f === "Home") {
+          c.preventDefault(), t.updateAtIndex(o, t.min, { commit: !0 });
           return;
         }
-        if (h === "End") {
-          c.preventDefault(), t.updateAtIndex(i, t.max, { commit: !0 });
+        if (f === "End") {
+          c.preventDefault(), t.updateAtIndex(o, t.max, { commit: !0 });
           return;
         }
         const y = t.orientation === "horizontal", C = t.dir === "rtl";
-        if (h === "ArrowRight" && y) {
+        if (f === "ArrowRight" && y) {
           c.preventDefault(), v(t.step * (C ? -1 : 1));
           return;
         }
-        if (h === "ArrowLeft" && y) {
+        if (f === "ArrowLeft" && y) {
           c.preventDefault(), v(t.step * (C ? 1 : -1));
           return;
         }
-        if (h === "ArrowUp" && !y) {
+        if (f === "ArrowUp" && !y) {
           c.preventDefault(), v(t.step);
           return;
         }
-        if (h === "ArrowDown" && !y) {
+        if (f === "ArrowDown" && !y) {
           c.preventDefault(), v(-t.step);
           return;
         }
-        if (h === "PageUp") {
-          c.preventDefault(), v(f("inc") * m);
+        if (f === "PageUp") {
+          c.preventDefault(), v(p("inc") * m);
           return;
         }
-        if (h === "PageDown") {
-          c.preventDefault(), v(f("dec") * m);
+        if (f === "PageDown") {
+          c.preventDefault(), v(p("dec") * m);
           return;
         }
       },
-      [t, i, a]
+      [t, o, a]
     ), V = A(
       (c) => {
         if (l?.(c), c.defaultPrevented || t.disabled) return;
-        const m = t.trackRef.current, f = t.thumbsRef.current[i].current;
-        !m || !f || (f.setPointerCapture?.(c.pointerId), c.preventDefault(), t.setActiveIndex(i), H(i, t));
+        const m = t.trackRef.current, p = t.thumbsRef.current[o].current;
+        !m || !p || (p.setPointerCapture?.(c.pointerId), c.preventDefault(), t.setActiveIndex(o), H(o, t));
       },
-      [t, i, l]
+      [t, o, l]
     ), $ = t.orientation === "horizontal" ? { left: `${d}%`, transform: "translate(-50%, -50%)" } : { bottom: `${d}%`, transform: "translate(-50%, 50%)" };
     return /* @__PURE__ */ k(
       S,
@@ -256,17 +256,16 @@ const at = z(
         "aria-disabled": t.disabled || void 0,
         "data-orientation": t.orientation,
         "data-disabled": t.disabled ? "" : void 0,
-        className: E(
-          "bg-background absolute grid place-items-center rounded-full shadow",
+        className: x(
+          "absolute grid place-items-center rounded-full shadow",
           "border-input border outline-none",
           "focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2",
           "h-5 w-5",
-          o
+          i
         ),
         style: {
           ...$,
-          top: t.orientation === "horizontal" ? "50%" : "auto",
-          left: t.orientation === "horizontal" ? void 0 : "50%",
+          ...t.orientation === "horizontal" ? { top: "50%" } : { left: "50%" },
           touchAction: "none"
         },
         onKeyDown: T,
@@ -277,38 +276,38 @@ const at = z(
   }
 );
 at.displayName = "SliderThumb";
-function Y(r, o, e, a) {
+function Y(r, i, e, a) {
   let l;
   if (a.orientation === "horizontal") {
-    const i = I(r - e.left, 0, e.width) / e.width * 100;
-    l = a.dir === "rtl" ? 100 - i : i;
+    const o = I(r - e.left, 0, e.width) / e.width * 100;
+    l = a.dir === "rtl" ? 100 - o : o;
   } else
-    l = 100 - I(o - e.top, 0, e.height) / e.height * 100;
-  const n = tt(l, a.min, a.max), s = j(n, a.step, a.min);
+    l = 100 - I(i - e.top, 0, e.height) / e.height * 100;
+  const n = tt(l, a.min, a.max), s = U(n, a.step, a.min);
   return I(s, a.min, a.max);
 }
-function q(r, o, e) {
+function q(r, i, e) {
   const a = e.step * e.minStepsBetweenThumbs, l = r > 0 ? e.values[r - 1] : e.min, n = r < e.values.length - 1 ? e.values[r + 1] : e.max, s = l + (r > 0 ? a : 0), t = n - (r < e.values.length - 1 ? a : 0);
-  return I(o, s, t);
+  return I(i, s, t);
 }
-function st(r, o, e) {
-  const a = e.values[r], l = q(r, j(a + o, e.step, e.min), e);
+function st(r, i, e) {
+  const a = e.values[r], l = q(r, U(a + i, e.step, e.min), e);
   e.updateAtIndex(r, l, { commit: !0 });
 }
-function H(r, o) {
-  const e = o.trackRef.current;
+function H(r, i) {
+  const e = i.trackRef.current;
   if (!e) return;
   const a = () => e.getBoundingClientRect(), l = (s) => {
-    if (o.disabled) return;
-    const t = Y(s.clientX, s.clientY, a(), o), i = q(r, t, o);
-    o.updateAtIndex(r, i);
+    if (i.disabled) return;
+    const t = Y(s.clientX, s.clientY, a(), i), o = q(r, t, i);
+    i.updateAtIndex(r, o);
   }, n = () => {
-    o.setActiveIndex(null), o.setValues([...o.values], { commit: !0 }), window.removeEventListener("pointermove", l, !0), window.removeEventListener("pointerup", n, !0);
+    i.setActiveIndex(null), window.removeEventListener("pointermove", l, !0), window.removeEventListener("pointerup", n, !0);
   };
   window.addEventListener("pointermove", l, !0), window.addEventListener("pointerup", n, !0);
 }
 export {
-  rt as Slider,
+  rt as SliderBase,
   it as SliderRange,
   at as SliderThumb,
   ot as SliderTrack

package/dist/Slider.js

@@ -1,7 +1,7 @@
 "use client";
 import './assets/main.css';
 import { jsxs as v, jsx as t } from "react/jsx-runtime";
-import { Slider as w, SliderTrack as p, SliderRange as x, SliderThumb as S } from "./Slider/SliderBase.js";
+import { SliderBase as w, SliderTrack as p, SliderRange as x, SliderThumb as k } from "./Slider/SliderBase.js";
 import { c as a } from "./twUtils-CRiPKpXj.js";
 const j = ({
   className: o,
@@ -58,8 +58,8 @@ const j = ({
             )
           }
         ),
-        Array.from({ length: f.length }, (k, g) => /* @__PURE__ */ t(
-          S,
+        Array.from({ length: f.length }, (z, g) => /* @__PURE__ */ t(
+          k,
           {
             "data-slot": "slider-thumb",
             className: "border-slider-thumb-border bg-slider-thumb-bg ring-slider-thumb-ring/50 block size-4 shrink-0 rounded-full border shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"

package/dist/ToggleGroup.js

@@ -1,29 +1,29 @@
 "use client";
 import './assets/main.css';
 import { jsx as d } from "react/jsx-runtime";
-import { ToggleGroupItemBase as p, ToggleGroupBase as m } from "./ToggleGroup/ToggleGroupBase.js";
-import { toggleVariants as f } from "./Toggle.js";
+import { ToggleGroupItemBase as p, ToggleGroupBase as f } from "./ToggleGroup/ToggleGroupBase.js";
+import { toggleVariants as m } from "./Toggle.js";
 import { c as l } from "./twUtils-CRiPKpXj.js";
 import { createContext as c, forwardRef as v, useContext as b } from "react";
 const g = c({
   size: "default",
   variant: "default",
   layout: "default"
-}), h = ({ className: n, variant: e, size: o, layout: a, children: u, ...r }) => /* @__PURE__ */ d(
-  m,
+}), w = ({ className: n, variant: e, size: o, layout: a, children: u, ...r }) => /* @__PURE__ */ d(
+  f,
   {
     "data-slot": "toggle-group",
     "data-variant": e,
     "data-size": o,
     "data-layout": a,
     className: l(
-      "group/toggle-group [&[data-variant='outline']]:bg-toggle-group-bg flex h-fit w-fit items-center rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md [&[data-variant='outline']]:gap-0.25",
+      "group/toggle-group [&[data-variant='outline']]:bg-toggle-group-bg flex h-fit w-fit items-center rounded-md [&_button:first-of-type]:rounded-l-md [&_button:last-of-type]:rounded-r-md [&[data-layout='expanded']]:w-full [&[data-variant='outline']]:gap-0.25",
       n
     ),
     ...r,
     children: /* @__PURE__ */ d(g.Provider, { value: { variant: e, size: o, layout: a }, children: u })
   }
-), w = v(({ className: n, children: e, variant: o, size: a, value: u, layout: r, ...i }, s) => {
+), h = v(({ className: n, children: e, variant: o, size: a, value: u, layout: r, ...i }, s) => {
   const t = b(g);
   return /* @__PURE__ */ d(
     p,
@@ -35,7 +35,7 @@ const g = c({
       "data-layout": t.layout || r,
       value: u,
       className: l(
-        f({
+        m({
           variant: t.variant || o,
           size: t.size || a,
           layout: t.layout || r
@@ -49,6 +49,6 @@ const g = c({
   );
 });
 export {
-  h as ToggleGroup,
-  w as ToggleGroupItem
+  w as ToggleGroup,
+  h as ToggleGroupItem
 };