@spear-ai/spectral 1.3.66 → 1.3.68

package/dist/Input.js

@@ -1,6 +1,6 @@
 "use client";
 import "./styles/main.css";
-import { jsxs as u, jsx as t } from "react/jsx-runtime";
+import { jsxs as d, jsx as t } from "react/jsx-runtime";
 import { usePasswordVisibility as tt, usePrefixWidth as rt, useClearOnFocus as et } from "./Input/InputUtils.js";
 import "./Icons/AnalyzeIcon.js";
 import "./Icons/AnnotationsIcon.js";
@@ -60,7 +60,7 @@ import "./Icons/ZoomAllIcon.js";
 import "./Icons/ZoomXIcon.js";
 import "./Icons/ZoomYIcon.js";
 import { Label as lt } from "./Label.js";
-import { useFormFieldId as ct, getAriaProps as mt, getInputClasses as dt, useFormFieldState as ut, getFormFieldCSSProperties as ft, ErrorMessage as ht } from "./utils/formFieldUtils.js";
+import { useFormFieldId as ct, getAriaProps as mt, getInputClasses as ut, useFormFieldState as dt, getFormFieldCSSProperties as ft, ErrorMessage as ht } from "./utils/formFieldUtils.js";
 import { cn as f } from "./utils/twUtils.js";
 import { forwardRef as bt, useRef as xt, useCallback as c } from "react";
 const gt = (m) => ({
@@ -76,102 +76,61 @@ const gt = (m) => ({
   ({
     className: m,
     clearOnFocus: h = !1,
-    disabled: P,
+    disabled: k,
     errorMessage: b,
-    id: R,
-    label: o,
+    id: P,
+    label: e,
+    labelClassName: R,
     name: x,
     onBlur: g,
-    onChange: C,
-    onValueChange: a,
-    onFocus: w,
+    onChange: a,
+    onFocus: C,
     placeholder: S,
     prefix: n,
-    showClearButton: $ = !1,
-    suppressHydrationWarning: L = !0,
+    showClearButton: V = !1,
+    suppressHydrationWarning: $ = !0,
     state: i = "default",
     type: p = "text",
-    value: v = "",
-    required: y,
-    startIcon: I,
-    endIcon: N,
-    "aria-label": M,
-    "aria-describedby": O,
-    ...j
-  }, A) => {
-    const l = ct(R, x), F = `${l}-error`, { isDisabled: E, isLoading: B, isInvalid: H } = ut(P, i), V = mt(i, y, F, O), W = xt(null), s = A || W, { isVisible: d, toggleVisibility: D, inputType: T } = tt(), { prefixWidth: G, prefixRef: J } = rt(n), { handleFocus: z } = et(
-      h,
-      a ? (r) => a(r.target.value) : void 0
-    ), K = c(
+    value: w = "",
+    required: v,
+    startIcon: y,
+    endIcon: I,
+    "aria-label": L,
+    "aria-describedby": M,
+    ...O
+  }, j) => {
+    const l = ct(P, x), N = `${l}-error`, { isDisabled: F, isLoading: A, isInvalid: B } = dt(k, i), H = mt(i, v, N, M), W = xt(null), s = j || W, { isVisible: u, toggleVisibility: D, inputType: T } = tt(), { prefixWidth: G, prefixRef: J } = rt(n), { handleFocus: E } = et(h, a ? (r) => a(r.target.value) : void 0), K = c(
       (r) => {
         g?.(r);
       },
       [g]
     ), Q = c(
       (r) => {
-        z(r, w);
+        E(r, C);
       },
-      [z, w]
+      [E, C]
     ), U = c(
       (r) => {
-        const e = r.target.value;
-        C?.(e), a?.(e);
+        const o = r.target.value;
+        a?.(o);
       },
-      [C, a]
+      [a]
     ), X = c(() => {
       s.current && (s.current.value = "", s.current.dispatchEvent(new Event("input", { bubbles: !0 })), s.current.focus());
-    }, [s]), k = $ && v.length > 0, Y = () => {
-      const r = "absolute right-4 top-1/2 -translate-y-1/2 text-input-icon hover:text-input-icon--hover focus:outline-none cursor-pointer", e = {
-        password: () => /* @__PURE__ */ t(
-          "button",
-          {
-            className: r,
-            type: "button",
-            onClick: D,
-            "aria-label": d ? `Hide ${o}` : `Show ${o}`,
-            "aria-pressed": d,
-            "aria-controls": l,
-            "data-testid": "input-password-toggle",
-            children: d ? /* @__PURE__ */ t(at, { size: 22 }) : /* @__PURE__ */ t(nt, { size: 22 })
-          }
-        ),
-        clear: () => /* @__PURE__ */ t(
-          "button",
-          {
-            className: r,
-            type: "button",
-            onClick: X,
-            "aria-label": `Clear ${o}`,
-            "data-testid": "input-clear-button",
-            children: /* @__PURE__ */ t(it, { size: 24 })
-          }
-        ),
-        loading: () => /* @__PURE__ */ t("div", { className: "absolute top-1/2 right-4 -translate-y-1/2", "data-testid": "input-loading-icon", children: /* @__PURE__ */ t(pt, { size: 24 }) }),
-        error: () => /* @__PURE__ */ t("div", { className: "text-danger-400 absolute top-1/2 right-4 -translate-y-1/2", "data-testid": "input-error-icon", children: /* @__PURE__ */ t(st, { size: 24 }) }),
-        success: () => /* @__PURE__ */ t("div", { className: "text-success-400 absolute top-1/2 right-4 -translate-y-1/2", "data-testid": "input-success-icon", children: /* @__PURE__ */ t(ot, { size: 24 }) })
+    }, [s]), z = V && w.length > 0, Y = () => {
+      const r = "absolute right-4 top-1/2 -translate-y-1/2 text-input-icon hover:text-input-icon--hover focus:outline-none cursor-pointer", o = {
+        password: () => /* @__PURE__ */ t("button", { className: r, type: "button", onClick: D, "aria-label": u ? `Hide ${e}` : `Show ${e}`, "aria-pressed": u, "aria-controls": l, "data-testid": "input-password-toggle", children: u ? /* @__PURE__ */ t(at, { size: 22 }) : /* @__PURE__ */ t(nt, { size: 22 }) }),
+        clear: () => /* @__PURE__ */ t("button", { className: r, type: "button", onClick: X, "aria-label": `Clear ${e}`, "data-testid": "input-clear-button", children: /* @__PURE__ */ t(it, { size: 24 }) }),
+        loading: () => /* @__PURE__ */ t("div", { className: "absolute right-4 top-1/2 -translate-y-1/2", "data-testid": "input-loading-icon", children: /* @__PURE__ */ t(pt, { size: 24 }) }),
+        error: () => /* @__PURE__ */ t("div", { className: "absolute right-4 top-1/2 -translate-y-1/2 text-danger-400", "data-testid": "input-error-icon", children: /* @__PURE__ */ t(st, { size: 24 }) }),
+        success: () => /* @__PURE__ */ t("div", { className: "absolute right-4 top-1/2 -translate-y-1/2 text-success-400", "data-testid": "input-success-icon", children: /* @__PURE__ */ t(ot, { size: 24 }) })
       };
-      return N || (p === "password" ? e.password() : k ? e.clear() : B ? e.loading() : i === "success" ? e.success() : i === "error" ? e.error() : null);
-    }, Z = () => I || null, _ = f(
-      dt(i, m),
-      "[text-indent:var(--prefix-width)]",
-      k && "pr-10"
-    ), q = f(
-      "pointer-events-none absolute inset-y-0 left-4 flex items-center text-base text-input-text-prefix opacity-100 peer-disabled:opacity-50"
-    );
-    return /* @__PURE__ */ u("div", { className: "w-full space-y-1.5", "data-testid": "input-root", children: [
-      o && /* @__PURE__ */ t(
-        lt,
-        {
-          htmlFor: l,
-          className: f(
-            "mb-2 block",
-            E && "text-input-text--disabled placeholder:text-input-text-placeholder cursor-not-allowed"
-          ),
-          children: o
-        }
-      ),
-      /* @__PURE__ */ u("div", { className: "relative", "data-testid": "input-wrapper", children: [
-        /* @__PURE__ */ u("div", { className: "relative", children: [
+      return I || (p === "password" ? o.password() : z ? o.clear() : A ? o.loading() : i === "success" ? o.success() : i === "error" ? o.error() : null);
+    }, Z = () => y || null, _ = f(ut(i, m), "[text-indent:var(--prefix-width)]", z && "pr-10"), q = f("pointer-events-none absolute inset-y-0 left-4 flex items-center text-base text-input-text-prefix opacity-100 peer-disabled:opacity-50");
+    return /* @__PURE__ */ d("div", { className: "w-full space-y-1.5", "data-testid": "input-root", children: [
+      e && /* @__PURE__ */ t(lt, { htmlFor: l, className: f("block mb-2", R, F && "text-input-text--disabled placeholder:text-input-text-placeholder cursor-not-allowed"), children: e }),
+      /* @__PURE__ */ d("div", { className: "relative", "data-testid": "input-wrapper", children: [
+        /* @__PURE__ */ d("div", { className: "relative", children: [
           Z(),
           n && /* @__PURE__ */ t("span", { ref: J, className: q, children: n }),
           /* @__PURE__ */ t(
@@ -181,29 +140,29 @@ const gt = (m) => ({
               name: x,
               ref: s,
               type: p === "password" ? T : p,
-              value: v,
-              disabled: E,
-              required: y,
+              value: w,
+              disabled: F,
+              required: v,
               autoComplete: gt(p),
               className: _,
               onChange: U,
               onFocus: Q,
               onBlur: K,
-              placeholder: S || o,
-              suppressHydrationWarning: L,
-              ...V,
-              ...j,
+              placeholder: S || e,
+              suppressHydrationWarning: $,
+              ...H,
+              ...O,
               "data-testid": "input-input",
               "data-state": i,
               style: ft({
                 "--prefix-width": n ? `${G}px` : "0px"
               }),
-              "aria-label": M || o
+              "aria-label": L || e
             }
           ),
           Y()
         ] }),
-        H && b && /* @__PURE__ */ t(ht, { id: F, message: b })
+        B && b && /* @__PURE__ */ t(ht, { id: N, message: b })
       ] })
     ] });
   }

package/dist/InputGroup.js

@@ -40,11 +40,7 @@ const k = ({ className: r, ...t }) => /* @__PURE__ */ n(
       align: "inline-start"
     }
   }
-), y = ({
-  className: r,
-  align: t = "inline-start",
-  ...o
-}) => /* @__PURE__ */ n(
+), y = ({ className: r, align: t = "inline-start", ...o }) => /* @__PURE__ */ n(
   "div",
   {
     role: "group",
@@ -75,48 +71,7 @@ const k = ({ className: r, ...t }) => /* @__PURE__ */ n(
   defaultVariants: {
     size: "xs"
   }
-}), z = ({
-  className: r,
-  type: t = "button",
-  variant: o = "ghost",
-  size: a = "xs",
-  ...i
-}) => /* @__PURE__ */ n(
-  u,
-  {
-    type: t,
-    "data-size": a,
-    variant: o,
-    className: e(c({ size: a }), r),
-    ...i
-  }
-), w = ({ className: r, ...t }) => /* @__PURE__ */ n(
-  "span",
-  {
-    className: e(
-      "text-input-text flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
-      r
-    ),
-    ...t
-  }
-), G = ({ className: r, ...t }) => /* @__PURE__ */ n(
-  p,
-  {
-    "data-slot": "input-group-control",
-    className: e("flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0", r),
-    ...t
-  }
-), I = ({ className: r, ...t }) => /* @__PURE__ */ n(
-  l,
-  {
-    "data-slot": "input-group-control",
-    className: e(
-      "flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0",
-      r
-    ),
-    ...t
-  }
-);
+}), z = ({ className: r, type: t = "button", variant: o = "ghost", size: a = "xs", ...i }) => /* @__PURE__ */ n(u, { type: t, "data-size": a, variant: o, className: e(c({ size: a }), r), ...i }), w = ({ className: r, ...t }) => /* @__PURE__ */ n("span", { className: e("text-input-text flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", r), ...t }), G = ({ className: r, ...t }) => /* @__PURE__ */ n(p, { "data-slot": "input-group-control", className: e("flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0", r), ...t }), I = ({ className: r, ...t }) => /* @__PURE__ */ n(l, { "data-slot": "input-group-control", className: e("flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0", r), ...t });
 export {
   k as InputGroup,
   y as InputGroupAddon,

package/dist/InputOTP.js

@@ -256,110 +256,74 @@ const Pt = ht({}), xt = ht(null), Ct = () => {
   if (!t)
     throw new Error("useRoot must be used within an InputOTP");
   return t;
-}, Mt = Q(
-  ({
-    autoFocus: t = !1,
-    children: r,
-    className: a,
-    errorMessage: u,
-    hasError: v,
-    id: s,
-    inputMode: b = "numeric",
-    maxLength: d,
-    name: T,
-    onChange: S,
-    onComplete: A,
-    value: R,
-    variant: f = "outlined",
-    ...x
-  }, g) => {
-    const w = Ht(s, T), O = (l) => {
-      const I = l.clipboardData.getData("text/plain").trim();
-      I.length === d && typeof S == "function" && (S(""), setTimeout(() => {
-        typeof S == "function" && S(I);
-      }, 0));
-    };
-    return /* @__PURE__ */ k(Pt.Provider, { value: { hasError: v }, children: /* @__PURE__ */ vt("div", { className: "flex w-max flex-col gap-y-1", children: [
-      /* @__PURE__ */ k(
-        St,
-        {
-          autoFocus: t,
-          containerClassName: gt(
-            "flex items-center gap-2 has-[:disabled]:opacity-50 disabled:cursor-not-allowed",
-            a
-          ),
-          "data-1p-ignore": "true",
-          "data-dashlane-disabled-on-field": "true",
-          "data-lpignore": "true",
-          "data-protonpass-ignore": "true",
-          "data-testid": "input-otp",
-          id: w,
-          inputMode: b,
-          maxLength: d,
-          onChange: S,
-          onComplete: A,
-          onPaste: O,
-          pushPasswordManagerStrategy: "none",
-          ref: g,
-          textAlign: "center",
-          value: R,
-          ...x,
-          render: ({ slots: l }) => /* @__PURE__ */ k(xt.Provider, { value: { slots: l, variant: f }, children: r })
-        }
-      ),
-      v && u && /* @__PURE__ */ k(Gt, { id: Lt(w), message: u })
-    ] }) });
-  }
-);
-Mt.displayName = "InputOTP";
-const kt = Q(({ ...t }, r) => /* @__PURE__ */ k(
-  "div",
-  {
-    ref: r,
-    className: "flex items-center justify-between justify-center gap-x-2",
-    ...t,
-    "data-testid": "input-otp-group"
-  }
-));
-kt.displayName = "InputOTP.Group";
-const Tt = Q(
-  ({ index: t, className: r, ...a }, u) => {
-    const { variant: v = "outlined", slots: s = [] } = Ct(), { hasError: b } = bt(Pt), d = s[t] || { char: "", hasFakeCaret: !0, isActive: !1 };
-    return /* @__PURE__ */ vt(
-      "div",
+}, Mt = Q(({ autoFocus: t = !1, children: r, className: a, errorMessage: u, hasError: v, id: s, inputMode: b = "numeric", maxLength: d, name: T, onChange: S, onComplete: A, value: R, variant: f = "outlined", ...x }, g) => {
+  const w = Ht(s, T), O = (l) => {
+    const I = l.clipboardData.getData("text/plain").trim();
+    I.length === d && typeof S == "function" && (S(""), setTimeout(() => {
+      typeof S == "function" && S(I);
+    }, 0));
+  };
+  return /* @__PURE__ */ k(Pt.Provider, { value: { hasError: v }, children: /* @__PURE__ */ vt("div", { className: "flex w-max flex-col gap-y-1", children: [
+    /* @__PURE__ */ k(
+      St,
       {
-        ref: u,
-        className: gt(
-          "relative z-10 flex h-12 w-10 items-center justify-center rounded-[8px] border-1 transition duration-200 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2",
-          v === "filled" ? "bg-level-one border-level-one" : "border-input-otp-border bg-transparent",
-          !b && "border",
-          b && "border-danger-400 focus-visible:outline-danger-400 border-2",
-          d.isActive && !b && "outline-input-otp-border--focus z-10 outline-2 outline-offset-2",
-          d.isActive && b && "outline-danger-400 outline-2 outline-offset-2",
-          r
-        ),
-        "data-index": t,
-        "data-testid": "input-otp-slot",
-        "data-variant": v,
-        ...a,
-        children: [
-          d.char,
-          d.hasFakeCaret && /* @__PURE__ */ k("div", { className: "animate-caret-blink pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ k("div", { className: "bg-input-otp-caret h-8 w-px" }) })
-        ]
+        autoFocus: t,
+        containerClassName: gt("flex items-center gap-2 has-[:disabled]:opacity-50 disabled:cursor-not-allowed", a),
+        "data-1p-ignore": "true",
+        "data-dashlane-disabled-on-field": "true",
+        "data-lpignore": "true",
+        "data-protonpass-ignore": "true",
+        "data-testid": "input-otp",
+        id: w,
+        inputMode: b,
+        maxLength: d,
+        onChange: S,
+        onComplete: A,
+        onPaste: O,
+        pushPasswordManagerStrategy: "none",
+        ref: g,
+        textAlign: "center",
+        value: R,
+        ...x,
+        render: ({ slots: l }) => /* @__PURE__ */ k(xt.Provider, { value: { slots: l, variant: f }, children: r })
       }
-    );
-  }
-);
+    ),
+    v && u && /* @__PURE__ */ k(Gt, { id: Lt(w), message: u })
+  ] }) });
+});
+Mt.displayName = "InputOTP";
+const kt = Q(({ ...t }, r) => /* @__PURE__ */ k("div", { ref: r, className: "flex items-center justify-between gap-x-2 justify-center", ...t, "data-testid": "input-otp-group" }));
+kt.displayName = "InputOTP.Group";
+const Tt = Q(({ index: t, className: r, ...a }, u) => {
+  const { variant: v = "outlined", slots: s = [] } = Ct(), { hasError: b } = bt(Pt), d = s[t] || { char: "", hasFakeCaret: !0, isActive: !1 };
+  return /* @__PURE__ */ vt(
+    "div",
+    {
+      ref: u,
+      className: gt(
+        "relative flex h-12 w-10 items-center justify-center rounded-[8px] border-1 transition duration-200 z-10 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2",
+        v === "filled" ? "bg-level-one border-level-one" : "bg-transparent border-input-otp-border",
+        !b && "border",
+        b && "border-2 border-danger-400 focus-visible:outline-danger-400",
+        d.isActive && !b && "z-10 outline-2 outline-input-otp-border--focus outline-offset-2",
+        d.isActive && b && "outline-2 outline-offset-2 outline-danger-400",
+        r
+      ),
+      "data-index": t,
+      "data-testid": "input-otp-slot",
+      "data-variant": v,
+      ...a,
+      children: [
+        d.char,
+        d.hasFakeCaret && /* @__PURE__ */ k("div", { className: "pointer-events-none absolute inset-0 flex animate-caret-blink items-center justify-center", children: /* @__PURE__ */ k("div", { className: "h-8 w-px bg-input-otp-caret" }) })
+      ]
+    }
+  );
+});
 Tt.displayName = "InputOTP.Slot";
 const Rt = Q(({ ...t }, r) => {
   const { variant: a = "outlined" } = Ct();
-  return /* @__PURE__ */ k("div", { ref: r, role: "separator", ...t, "data-testid": "input-otp-separator", "data-variant": a, children: /* @__PURE__ */ k(
-    _t,
-    {
-      size: 24,
-      color: a === "filled" ? "var(--color-input-otp-filled-separator)" : "var(--color-input-otp-border)"
-    }
-  ) });
+  return /* @__PURE__ */ k("div", { ref: r, role: "separator", ...t, "data-testid": "input-otp-separator", "data-variant": a, children: /* @__PURE__ */ k(_t, { size: 24, color: a === "filled" ? "var(--color-input-otp-filled-separator)" : "var(--color-input-otp-border)" }) });
 });
 Rt.displayName = "InputOTP.Separator";
 const pn = Object.assign(Mt, {

package/dist/Label.js

@@ -5,18 +5,7 @@ import { cn as l } from "./utils/twUtils.js";
 import { forwardRef as t } from "react";
 const m = t(({ className: e, ...a }, o) => (
   // eslint-disable-next-line jsx-a11y/label-has-associated-control
-  /* @__PURE__ */ r(
-    "label",
-    {
-      ref: o,
-      "data-slot": "label",
-      className: l(
-        "text-sm leading-none font-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
-        e
-      ),
-      ...a
-    }
-  )
+  /* @__PURE__ */ r("label", { ref: o, "data-slot": "label", className: l("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", e), ...a })
 ));
 m.displayName = "Label";
 export {

package/dist/MultiSelect/MultiSelectBase.d.ts

@@ -1,34 +1,34 @@
 import { ButtonHTMLAttributes } from 'react';
 export type MultiSelectState = 'default' | 'error' | 'disabled' | 'loading';
 export interface MultiSelectOption {
-    readonly label: string;
-    readonly value: string;
-    readonly group?: string;
-    readonly disabled?: boolean;
+    label: string;
+    value: string;
+    group?: string;
+    disabled?: boolean;
 }
 export interface MultiSelectBaseProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onChange'> {
     value: string[];
     onChange: (value: string[]) => void;
-    readonly options: readonly MultiSelectOption[];
-    readonly placeholder?: string;
-    readonly maxCount?: number;
-    readonly state?: MultiSelectState;
-    readonly errorMessage?: string;
-    readonly emptyMessage?: string;
-    readonly loadingMessage?: string;
-    readonly searchPlaceholder?: string;
-    readonly selectAllLabel?: string;
-    readonly clearAllLabel?: string;
-    readonly sortAlphabetically?: boolean;
-    readonly showSelectAll?: boolean;
-    readonly showClearAll?: boolean;
-    readonly showSearch?: boolean;
-    readonly closeOnSelect?: boolean;
-    readonly name?: string;
-    readonly id?: string;
-    readonly label?: string;
-    readonly 'aria-label'?: string;
-    readonly 'aria-describedby'?: string;
+    options: MultiSelectOption[];
+    placeholder?: string;
+    maxCount?: number;
+    state?: MultiSelectState;
+    errorMessage?: string;
+    emptyMessage?: string;
+    loadingMessage?: string;
+    searchPlaceholder?: string;
+    selectAllLabel?: string;
+    clearAllLabel?: string;
+    sortAlphabetically?: boolean;
+    showSelectAll?: boolean;
+    showClearAll?: boolean;
+    showSearch?: boolean;
+    closeOnSelect?: boolean;
+    name?: string;
+    id?: string;
+    label?: string;
+    'aria-label'?: string;
+    'aria-describedby'?: string;
 }
 export declare const MultiSelectBase: import('react').ForwardRefExoticComponent<MultiSelectBaseProps & import('react').RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=MultiSelectBase.d.ts.map