@spear-ai/spectral 1.4.47 → 1.5.1

package/dist/Button.d.ts

@@ -1,3 +1,4 @@
+import { AsChildProp } from './primitives/slot';
 import { VariantProps } from 'class-variance-authority';
 import { ButtonHTMLAttributes, MouseEvent, ReactNode, Ref } from 'react';
 declare const buttonVariants: (props?: ({
@@ -5,13 +6,13 @@ declare const buttonVariants: (props?: ({
     size?: "small" | "default" | "fullWidth" | null | undefined;
     state?: "default" | "error" | "loading" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'color'>, VariantProps<typeof buttonVariants> {
+export interface ButtonProps extends AsChildProp, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'color'>, VariantProps<typeof buttonVariants> {
     disabled?: boolean;
     endIcon?: ReactNode;
     errorMessage?: string | ReactNode;
-    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
     dataTestId?: string;
-    label: string;
+    label?: string;
     size?: 'small' | 'default' | 'fullWidth';
     startIcon?: ReactNode;
     state?: 'default' | 'error' | 'loading';
@@ -19,7 +20,7 @@ export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement
     variant?: 'primary' | 'secondary' | 'outline' | 'ghost';
 }
 export declare const Button: {
-    ({ ref, className, dataTestId, disabled, endIcon, errorMessage, label, size, startIcon, state, type, variant, ...props }: ButtonProps & {
+    ({ ref, asChild, className, dataTestId, disabled, endIcon, errorMessage, label, onClick, size, startIcon, state, type, variant, children, ...props }: ButtonProps & {
         ref?: Ref<HTMLButtonElement>;
     }): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/dist/Button.js

@@ -1,11 +1,13 @@
+"use client";
 import "./styles/main.css";
-import { jsxs as s, jsx as o } from "react/jsx-runtime";
-import { ErrorMessage as h } from "./utils/formFieldUtils.js";
-import { cn as u } from "./utils/twUtils.js";
-import { c as y } from "./index-D29mdTf5.js";
-import "react";
-import { c as f } from "./createLucideIcon-D4r5Phnh.js";
-const N = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]], w = f("loader-circle", N), _ = y(
+import { jsxs as p, jsx as r, Fragment as k } from "react/jsx-runtime";
+import { Slot as z } from "./primitives/slot.js";
+import { ErrorMessage as B } from "./utils/formFieldUtils.js";
+import { cn as i } from "./utils/twUtils.js";
+import { c as E } from "./index-D29mdTf5.js";
+import { isValidElement as V, Children as D } from "react";
+import { c as L } from "./createLucideIcon-D4r5Phnh.js";
+const S = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]], q = L("loader-circle", S), A = E(
   `
     !font-sans flex relative items-center justify-center gap-2 whitespace-nowrap transition-colors cursor-pointer rounded-lg border font-semibold focus:outline-none focus:outline-none
     focus-visible:outline-1 focus-visible:outline-offset-2 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 disabled:pointer-events-none
@@ -38,22 +40,25 @@ const N = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]], w = f
       size: "default"
     }
   }
-), j = ({
-  ref: l,
-  className: g,
-  dataTestId: c,
-  disabled: r,
-  endIcon: n,
-  errorMessage: b,
-  label: p,
-  size: a,
-  startIcon: d,
-  state: t,
-  type: x = "button",
-  variant: e = "primary",
-  ...m
+), F = ({
+  ref: x,
+  asChild: m = !1,
+  className: v,
+  dataTestId: h,
+  disabled: o,
+  endIcon: b,
+  errorMessage: d,
+  label: y,
+  onClick: f,
+  size: s,
+  startIcon: u,
+  state: e,
+  type: w = "button",
+  variant: n = "primary",
+  children: a,
+  ...C
 }) => {
-  const i = {
+  const l = {
     error: {
       primary: "bg-button-danger border-button-danger text-text-primary hover:bg-button-danger--hover hover:text-text-primary",
       secondary: "bg-button-danger border-button-danger text-text-primary hover:bg-button-danger--hover hover:text-text-primary",
@@ -66,18 +71,39 @@ const N = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]], w = f
       outline: "bg-button-outline-bg--disabled border-button-outline-border--disabled text-button-outline-text--disabled pointer-events-none",
       ghost: "bg-transparent text-button-ghost-text--disabled pointer-events-none"
     }
-  }, v = u(_({ variant: e, state: t, size: a }), t === "error" && i.error[e], t === "loading" && i.loading[e], g);
-  return /* @__PURE__ */ s("div", { className: u("flex flex-col justify-items-center", a), children: [
-    /* @__PURE__ */ s("button", { "aria-disabled": r, className: v, "data-state": t, "data-testid": c || `spectral-button-${e}`, disabled: r, ref: l, type: x, ...m, children: [
-      d && /* @__PURE__ */ o("span", { className: "flex pr-1", "aria-hidden": !0, "data-testid": "spectral-button-start-icon", children: d }),
-      t === "loading" && /* @__PURE__ */ o(w, { className: "ml-2 animate-spin", size: 16 }),
-      p,
-      n && t !== "loading" && /* @__PURE__ */ o("span", { className: "flex pl-2", "aria-hidden": !0, "data-testid": "spectral-button-end-icon", children: n })
-    ] }),
-    t === "error" && b && /* @__PURE__ */ o(h, { message: b, dataTestId: "spectral-button-error-message", id: "button-error" })
+  }, N = i(A({ variant: n, state: e, size: s }), e === "error" && l.error[n], e === "loading" && l.loading[n], v), t = m && V(a) && D.count(a) === 1, c = t ? void 0 : a ?? y;
+  if (!t && !c)
+    throw new Error("Button requires either `label` or `children`");
+  const _ = (g) => {
+    o && (g.preventDefault(), g.stopPropagation());
+  }, j = t ? z : "button";
+  return /* @__PURE__ */ p("div", { className: i("flex flex-col justify-items-center", s), children: [
+    /* @__PURE__ */ r(
+      j,
+      {
+        "aria-disabled": o,
+        className: i(N, t && o && "pointer-events-none opacity-50"),
+        "data-state": e,
+        "data-testid": h || `spectral-button-${n}`,
+        disabled: t ? void 0 : o,
+        onClickCapture: t ? _ : void 0,
+        onClick: f,
+        ref: x,
+        tabIndex: t && o ? -1 : void 0,
+        type: t ? void 0 : w,
+        ...C,
+        children: t ? a : /* @__PURE__ */ p(k, { children: [
+          u && /* @__PURE__ */ r("span", { className: "flex pr-1", "aria-hidden": !0, "data-testid": "spectral-button-start-icon", children: u }),
+          e === "loading" && /* @__PURE__ */ r(q, { className: "ml-2 animate-spin", size: 16 }),
+          c,
+          b && e !== "loading" && /* @__PURE__ */ r("span", { className: "flex pl-2", "aria-hidden": !0, "data-testid": "spectral-button-end-icon", children: b })
+        ] })
+      }
+    ),
+    e === "error" && d && /* @__PURE__ */ r(B, { message: d, dataTestId: "spectral-button-error-message", id: "button-error" })
   ] });
 };
-j.displayName = "Button";
+F.displayName = "Button";
 export {
-  j as Button
+  F as Button
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spear-ai/spectral",
-  "version": "1.4.47",
+  "version": "1.5.1",
   "type": "module",
   "private": false,
   "repository": {