@spear-ai/spectral 1.3.9 → 1.3.11

package/dist/RadioGroup/RadioGroupBase.js

@@ -0,0 +1,254 @@
+import './assets/main.css'
+import { jsx as j, jsxs as M } from "react/jsx-runtime";
+import { Slot as S } from "../primitives/slot.js";
+import { createContext as T, forwardRef as L, useId as U, useState as P, useRef as E, useEffect as I, useCallback as C, useContext as $, useImperativeHandle as B } from "react";
+function q(...s) {
+  return s.filter(Boolean).join(" ");
+}
+const H = T(null);
+function z(s) {
+  const { value: i, defaultValue: t, onChange: r } = s, [d, n] = P(t), u = i !== void 0, R = u ? i : d, l = C(
+    (e) => {
+      u || n(e), r?.(e);
+    },
+    [u, r]
+  );
+  return [R, l];
+}
+function J(s, i, t, r) {
+  const d = s.length;
+  let n = i;
+  for (let u = 0; u < d; u += 1) {
+    if (n = t === "next" ? n + 1 : n - 1, r && (n < 0 && (n = d - 1), n >= d && (n = 0)), n < 0 || n >= d) return i;
+    if (!s[n].disabled) return n;
+  }
+  return i;
+}
+function Q(s, i, t) {
+  const { key: r } = s;
+  return r === "Home" ? "first" : r === "End" ? "last" : i === "vertical" ? r === "ArrowDown" ? "next" : r === "ArrowUp" ? "prev" : null : r === "ArrowRight" ? t === "rtl" ? "prev" : "next" : r === "ArrowLeft" ? t === "rtl" ? "next" : "prev" : null;
+}
+const W = L(
+  ({
+    asChild: s,
+    className: i,
+    value: t,
+    defaultValue: r,
+    onValueChange: d,
+    name: n,
+    required: u = !1,
+    form: R,
+    disabled: l = !1,
+    orientation: e = "vertical",
+    dir: V = "ltr",
+    loop: b = !0,
+    id: v,
+    ...f
+  }, p) => {
+    const m = U(), O = v ?? `rg-${m}`, [x, y] = z({
+      value: t,
+      defaultValue: r ?? void 0,
+      onChange: d
+    }), [A, g] = P(x), k = E([]), G = E(null);
+    I(() => {
+      x !== void 0 && g(x);
+    }, [x]), I(() => {
+      const c = G.current;
+      if (!c) return;
+      const a = () => {
+        y(r ?? void 0);
+      };
+      return c.addEventListener("reset", a), () => c.removeEventListener("reset", a);
+    }, [r, y]);
+    const o = C((c) => (k.current.push(c), () => {
+      k.current = k.current.filter((a) => a.value !== c.value);
+    }), []), h = C(
+      (c, a) => {
+        l || (y(c), a?.focus && (g(c), k.current.find((K) => K.value === c)?.ref.current?.focus()));
+      },
+      [l, y]
+    ), w = {
+      value: x,
+      setValue: h,
+      name: n,
+      required: u,
+      form: R,
+      disabled: l,
+      orientation: e,
+      dir: V,
+      loop: b,
+      registerItem: o,
+      focusableValue: A,
+      setFocusableValue: g,
+      formElRef: G,
+      itemsRef: k
+    }, N = s ? S : "div", F = p;
+    return /* @__PURE__ */ j(H.Provider, { value: w, children: /* @__PURE__ */ j(
+      N,
+      {
+        id: O,
+        ref: F,
+        role: "radiogroup",
+        "aria-orientation": e,
+        "data-disabled": l ? "" : void 0,
+        className: q(i),
+        ...f
+      }
+    ) });
+  }
+);
+W.displayName = "RadioGroup";
+const X = L(
+  ({ asChild: s, className: i, value: t, disabled: r, id: d, onKeyDown: n, onClick: u, ...R }, l) => {
+    const e = $(H);
+    if (!e) throw new Error("RadioGroupItem must be used within RadioGroup");
+    const V = U(), b = d ?? `rgi-${V}`, v = E(null), f = E(null);
+    B(
+      l,
+      () => v.current,
+      []
+    );
+    const p = e.value === t, m = !!r || e.disabled;
+    I(() => {
+      const o = { value: t, ref: v, disabled: !!m, id: b };
+      return e.registerItem(o);
+    }, [t, m, b]), I(() => {
+      !e.formElRef.current && f.current?.form && (e.formElRef.current = f.current.form);
+    }, [e.formElRef]), I(() => {
+      f.current && (f.current.checked = p);
+    }, [p]);
+    const x = (e.focusableValue ? e.focusableValue === t : p) && !m ? 0 : -1, y = s ? S : "button", A = (o) => {
+      v.current = o;
+    }, g = C(
+      (o) => {
+        if (!m && (e.setValue(t, { focus: !0, user: o }), f.current)) {
+          const h = new Event("change", { bubbles: !0 });
+          f.current.dispatchEvent(h);
+        }
+      },
+      [e, m, t]
+    ), k = C(
+      (o) => {
+        u?.(o), !o.defaultPrevented && g(!0);
+      },
+      [u, g]
+    ), G = C(
+      (o) => {
+        if (n?.(o), o.defaultPrevented) return;
+        if (o.key === " " || o.key === "Enter") {
+          o.preventDefault(), g(!0);
+          return;
+        }
+        const h = Q(o, e.orientation, e.dir);
+        if (h) {
+          o.preventDefault();
+          const w = [...e.itemsRef.current], N = w.findIndex((a) => a.value === t);
+          if (N === -1) return;
+          if (h === "first") {
+            const a = w.find((D) => !D.disabled);
+            a && e.setValue(a.value, { focus: !0, user: !0 });
+            return;
+          }
+          if (h === "last") {
+            const a = [...w].reverse().find((D) => !D.disabled);
+            a && e.setValue(a.value, { focus: !0, user: !0 });
+            return;
+          }
+          const F = J(w, N, h, e.loop), c = w[F];
+          c && !c.disabled && e.setValue(c.value, { focus: !0, user: !0 });
+        }
+      },
+      [e, n, g, t]
+    );
+    return /* @__PURE__ */ M(
+      y,
+      {
+        id: b,
+        ref: A,
+        type: "button",
+        role: "radio",
+        "aria-checked": p,
+        "aria-disabled": m || void 0,
+        "data-state": p ? "checked" : "unchecked",
+        "data-disabled": m ? "" : void 0,
+        tabIndex: x,
+        onClick: k,
+        onKeyDown: G,
+        className: q(
+          "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full",
+          "border-input bg-background border",
+          "focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none",
+          "data-[state=checked]:border-primary data-[state=checked]:bg-primary/10",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          i
+        ),
+        ...R,
+        children: [
+          /* @__PURE__ */ j(
+            "input",
+            {
+              ref: f,
+              type: "radio",
+              name: e.name,
+              value: t,
+              required: e.required,
+              disabled: m,
+              form: e.form,
+              checked: p,
+              readOnly: !0,
+              tabIndex: -1,
+              "aria-hidden": "true",
+              style: {
+                position: "absolute",
+                opacity: 0,
+                width: 0,
+                height: 0,
+                pointerEvents: "none"
+              }
+            }
+          ),
+          R.children
+        ]
+      }
+    );
+  }
+);
+X.displayName = "RadioGroupItem";
+const Y = L(
+  ({ asChild: s, className: i, forceMount: t, ...r }, d) => {
+    if (!$(H)) return null;
+    const [u, R] = P(!1), l = E(null);
+    return B(
+      d,
+      () => l.current,
+      []
+    ), I(() => {
+      const b = l.current;
+      if (!b) return;
+      const v = b.closest('[role="radio"]');
+      if (!v) return;
+      const f = () => {
+        R(v.getAttribute("aria-checked") === "true");
+      };
+      f();
+      const p = new MutationObserver(f);
+      return p.observe(v, { attributes: !0, attributeFilter: ["aria-checked"] }), () => p.disconnect();
+    }, []), !u && !t ? null : /* @__PURE__ */ j(
+      s ? S : "span",
+      {
+        ref: (b) => {
+          l.current = b;
+        },
+        "data-state": u ? "checked" : "unchecked",
+        className: q("flex items-center justify-center text-current", i),
+        ...r
+      }
+    );
+  }
+);
+Y.displayName = "RadioGroupIndicator";
+export {
+  W as RadioGroup,
+  Y as RadioGroupIndicator,
+  X as RadioGroupItem
+};

package/dist/Skeleton.js

@@ -0,0 +1,10 @@
+import './assets/main.css'
+import { jsx as o } from "react/jsx-runtime";
+import { c as n } from "./twUtils-CRiPKpXj.js";
+import "react";
+function s({ className: t, ...e }) {
+  return /* @__PURE__ */ o("div", { "data-slot": "skeleton", className: n("bg-accent animate-pulse rounded-md", t), ...e });
+}
+export {
+  s as Skeleton
+};

package/dist/Slider/SliderBase.js

@@ -0,0 +1,315 @@
+import './assets/main.css'
+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) {
+  return r.filter(Boolean).join(" ");
+}
+function I(r, o, e) {
+  return Math.min(e, Math.max(o, r));
+}
+function j(r, o, e) {
+  const a = Math.round((r - e) / o), l = e + a * o;
+  return Number(l.toFixed(10));
+}
+function L(r, o, e) {
+  return (r - o) * 100 / (e - o);
+}
+function tt(r, o, e) {
+  return o + r / 100 * (e - o);
+}
+function et(r, o) {
+  let e = 0, a = 1 / 0;
+  for (let l = 0; l < r.length; l += 1) {
+    const n = Math.abs(r[l] - o);
+    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(
+    (u) => {
+      const d = typeof u == "function" ? u(t) : u;
+      s || n(d), a?.(d);
+    },
+    [s, a, t]
+  );
+  return [t, i];
+}
+const x = W(null), rt = z(
+  ({
+    asChild: r,
+    className: o,
+    value: e,
+    defaultValue: a,
+    onValueChange: l,
+    onValueCommit: n,
+    min: s = 0,
+    max: t = 100,
+    step: i = 1,
+    minStepsBetweenThumbs: u = 0,
+    orientation: d = "horizontal",
+    dir: S = "ltr",
+    disabled: b = !1,
+    name: p,
+    form: N,
+    required: T,
+    children: V,
+    ...$
+  }, c) => {
+    const [m, f] = 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(
+      (g, R) => {
+        const D = X(g, { min: s, max: t, step: i, minStepsBetweenThumbs: u });
+        f(D), R?.commit && n?.(D);
+      },
+      [t, s, u, n, f, i]
+    ), K = A(
+      (g, R, D) => {
+        const G = [...m];
+        G[g] = R, w(G, D);
+      },
+      [w, m]
+    ), M = {
+      values: m,
+      setValues: w,
+      min: s,
+      max: t,
+      step: i,
+      minStepsBetweenThumbs: u,
+      orientation: d,
+      dir: S,
+      disabled: b,
+      trackRef: v,
+      thumbsRef: h,
+      activeIndex: y,
+      setActiveIndex: C,
+      updateAtIndex: K
+    }, J = r ? P : "div", O = c;
+    return /* @__PURE__ */ k(x.Provider, { value: M, children: /* @__PURE__ */ Q(
+      J,
+      {
+        ref: O,
+        role: "presentation",
+        "data-orientation": d,
+        "data-disabled": b ? "" : void 0,
+        className: E(
+          "relative touch-none select-none",
+          d === "horizontal" ? "h-6 w-full" : "h-full w-6",
+          o
+        ),
+        ...$,
+        children: [
+          p && M.values.map((g, R) => /* @__PURE__ */ k(
+            "input",
+            {
+              type: "hidden",
+              name: M.values.length > 1 ? `${p}[]` : p,
+              value: String(g),
+              form: N,
+              required: T && R === 0,
+              "aria-hidden": "true"
+            },
+            R
+          )),
+          V
+        ]
+      }
+    ) });
+  }
+);
+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;
+  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));
+  return s;
+}
+const ot = z(
+  ({ asChild: r, className: o, onPointerDown: e, ...a }, l) => {
+    const n = U(x);
+    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(
+      (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);
+      },
+      [n, e]
+    );
+    return /* @__PURE__ */ k(
+      s,
+      {
+        ref: t,
+        "data-orientation": n.orientation,
+        className: E(
+          "bg-secondary relative grow rounded-full",
+          n.orientation === "horizontal" ? "h-2" : "w-2",
+          o
+        ),
+        style: { touchAction: "none" },
+        onPointerDown: i,
+        ...a
+      }
+    );
+  }
+);
+ot.displayName = "SliderTrack";
+const it = z(
+  ({ asChild: r, className: o, style: e, ...a }, l) => {
+    const n = U(x);
+    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}%` };
+    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),
+        style: { ...u, ...e },
+        ...a
+      }
+    );
+  }
+);
+it.displayName = "SliderRange";
+const at = z(
+  ({ asChild: r, className: o, index: e, onKeyDown: a, onPointerDown: l, ...n }, s) => {
+    const t = U(x);
+    if (!t) throw new Error("SliderThumb must be used within Slider");
+    const [i] = F(() => {
+      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(
+      (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 });
+          return;
+        }
+        if (h === "End") {
+          c.preventDefault(), t.updateAtIndex(i, t.max, { commit: !0 });
+          return;
+        }
+        const y = t.orientation === "horizontal", C = t.dir === "rtl";
+        if (h === "ArrowRight" && y) {
+          c.preventDefault(), v(t.step * (C ? -1 : 1));
+          return;
+        }
+        if (h === "ArrowLeft" && y) {
+          c.preventDefault(), v(t.step * (C ? 1 : -1));
+          return;
+        }
+        if (h === "ArrowUp" && !y) {
+          c.preventDefault(), v(t.step);
+          return;
+        }
+        if (h === "ArrowDown" && !y) {
+          c.preventDefault(), v(-t.step);
+          return;
+        }
+        if (h === "PageUp") {
+          c.preventDefault(), v(f("inc") * m);
+          return;
+        }
+        if (h === "PageDown") {
+          c.preventDefault(), v(f("dec") * m);
+          return;
+        }
+      },
+      [t, i, 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));
+      },
+      [t, i, l]
+    ), $ = t.orientation === "horizontal" ? { left: `${d}%`, transform: "translate(-50%, -50%)" } : { bottom: `${d}%`, transform: "translate(-50%, 50%)" };
+    return /* @__PURE__ */ k(
+      S,
+      {
+        ref: b,
+        role: "slider",
+        tabIndex: N,
+        "aria-valuemin": t.min,
+        "aria-valuemax": t.max,
+        "aria-valuenow": u,
+        "aria-orientation": t.orientation,
+        "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",
+          "border-input border outline-none",
+          "focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2",
+          "h-5 w-5",
+          o
+        ),
+        style: {
+          ...$,
+          top: t.orientation === "horizontal" ? "50%" : "auto",
+          left: t.orientation === "horizontal" ? void 0 : "50%",
+          touchAction: "none"
+        },
+        onKeyDown: T,
+        onPointerDown: V,
+        ...n
+      }
+    );
+  }
+);
+at.displayName = "SliderThumb";
+function Y(r, o, 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;
+  } 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);
+  return I(s, a.min, a.max);
+}
+function q(r, o, 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);
+}
+function st(r, o, e) {
+  const a = e.values[r], l = q(r, j(a + o, e.step, e.min), e);
+  e.updateAtIndex(r, l, { commit: !0 });
+}
+function H(r, o) {
+  const e = o.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);
+  }, n = () => {
+    o.setActiveIndex(null), o.setValues([...o.values], { commit: !0 }), window.removeEventListener("pointermove", l, !0), window.removeEventListener("pointerup", n, !0);
+  };
+  window.addEventListener("pointermove", l, !0), window.addEventListener("pointerup", n, !0);
+}
+export {
+  rt as Slider,
+  it as SliderRange,
+  at as SliderThumb,
+  ot as SliderTrack
+};

package/dist/Slider.js

@@ -0,0 +1,74 @@
+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 { c as a } from "./twUtils-CRiPKpXj.js";
+const j = ({
+  className: o,
+  defaultValue: e,
+  value: r,
+  min: i = 0,
+  max: l = 100,
+  step: n = 1,
+  minStepsBetweenThumbs: d = 1,
+  onValueChange: s,
+  orientation: c = "horizontal",
+  onValueCommit: h,
+  disabled: b,
+  name: u,
+  ...m
+}) => {
+  const f = r || e || [i];
+  return /* @__PURE__ */ v(
+    w,
+    {
+      "data-slot": "slider",
+      defaultValue: e,
+      value: r,
+      min: i,
+      max: l,
+      step: n,
+      minStepsBetweenThumbs: d,
+      onValueChange: s,
+      orientation: c,
+      onValueCommit: h,
+      disabled: b,
+      name: u,
+      className: a(
+        "relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
+        o
+      ),
+      ...m,
+      children: [
+        /* @__PURE__ */ t(
+          p,
+          {
+            "data-slot": "slider-track",
+            className: a(
+              "bg-slider-track relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
+            ),
+            children: /* @__PURE__ */ t(
+              x,
+              {
+                "data-slot": "slider-range",
+                className: a(
+                  "bg-slider-range absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
+                )
+              }
+            )
+          }
+        ),
+        Array.from({ length: f.length }, (k, g) => /* @__PURE__ */ t(
+          S,
+          {
+            "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"
+          },
+          g
+        ))
+      ]
+    }
+  );
+};
+export {
+  j as Slider
+};