"use client";
import { jsx as r, jsxs as x } from "react/jsx-runtime";
import k from "react";
import { ArrowsClockwise as N } from "@phosphor-icons/react";
import { L as T } from "./loader-g8a6j76ue5nq0lr8.js";
import { T as B } from "./tooltip-odudhkxe282wxinq.js";
import { c as l } from "./cn-ct4n7r74mh8y0f48.js";
import { r as c } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
import { u as L } from "./link-provider-mn2voeohon7cj9o4.js";
const u = {
  shape: {
    base: {
      classes: "",
      description: "Default rectangular button shape"
    },
    square: {
      classes: "items-center justify-center p-0",
      description: "Square button for icon-only actions"
    },
    circle: {
      classes: "items-center justify-center p-0 rounded-full",
      description: "Circular button for icon-only actions"
    }
  },
  size: {
    xs: {
      classes: "h-5 gap-1 rounded-sm px-1.5 text-xs",
      description: "Extra small button for compact UIs"
    },
    sm: {
      classes: "h-6.5 gap-1 rounded-md px-2 text-xs",
      description: "Small button for secondary actions"
    },
    base: {
      classes: "h-9 gap-1.5 rounded-lg px-3 text-base",
      description: "Default button size"
    },
    lg: {
      classes: "h-10 gap-2 rounded-lg px-4 text-base",
      description: "Large button for primary CTAs"
    }
  },
  compactSize: {
    xs: { classes: "size-3.5" },
    sm: { classes: "size-6.5" },
    base: { classes: "size-9" },
    lg: { classes: "size-10" }
  },
  variant: {
    primary: {
      classes: "bg-kumo-brand !text-white hover:bg-kumo-brand-hover disabled:bg-kumo-brand/50",
      description: "High-emphasis button for primary actions"
    },
    secondary: {
      classes: "bg-kumo-base !text-kumo-default ring not-disabled:hover:bg-kumo-tint disabled:bg-kumo-base/50 disabled:!text-kumo-default/70 ring-kumo-hairline data-[state=open]:bg-kumo-base",
      description: "Default button style for most actions"
    },
    ghost: {
      classes: "text-kumo-default hover:bg-kumo-tint shadow-none bg-inherit",
      description: "Minimal button with no background"
    },
    destructive: {
      classes: "bg-kumo-danger !text-white hover:bg-kumo-danger/70",
      description: "Danger button for destructive actions like delete"
    },
    "secondary-destructive": {
      classes: "bg-kumo-base !text-kumo-danger ring not-disabled:hover:bg-kumo-base disabled:bg-kumo-base/50 disabled:!text-kumo-danger/70 ring-kumo-hairline data-[state=open]:bg-kumo-base",
      description: "Secondary button with destructive text for less prominent dangerous actions"
    },
    outline: {
      classes: "bg-transparent text-kumo-default ring ring-kumo-hairline",
      description: "Bordered button with transparent background"
    }
  }
}, a = {
  shape: "base",
  size: "base",
  variant: "secondary"
};
function y({
  variant: s = a.variant,
  size: t = a.size,
  shape: e = a.shape
} = {}) {
  const o = e === "square" || e === "circle";
  return l(
    // Base styles
    "group flex w-max shrink-0 items-center font-medium select-none",
    "border-0 shadow-xs",
    "focus:outline-none focus:ring-kumo-focus/50 focus-visible:ring-2 focus-visible:ring-kumo-brand",
    "cursor-pointer",
    // Disabled state
    "disabled:cursor-not-allowed disabled:text-kumo-subtle",
    // Apply variant, size, shape styles from KUMO_BUTTON_VARIANTS
    c(
      u.variant,
      s,
      a.variant
    ).classes,
    c(
      u.size,
      t,
      a.size
    ).classes,
    c(
      u.shape,
      e,
      a.shape
    ).classes,
    o && c(
      u.compactSize,
      t,
      a.size
    ).classes
  );
}
const v = (s) => s ? k.isValidElement(s) ? s : /* @__PURE__ */ r(s, {}) : null, z = k.forwardRef(
  ({
    children: s,
    className: t,
    disabled: e,
    loading: o,
    shape: d = "base",
    size: n = "base",
    variant: m = "secondary",
    icon: b,
    title: i,
    ...p
  }, g) => {
    const { type: f, ...w } = p, h = /* @__PURE__ */ x(
      "button",
      {
        ref: g,
        className: l(
          y({ variant: m, size: n, shape: d }),
          e && "cursor-not-allowed opacity-50",
          t
        ),
        disabled: o || e,
        type: f ?? "button",
        ...w,
        children: [
          o ? /* @__PURE__ */ r(T, { size: n === "lg" ? 16 : 14 }) : v(b),
          s != null && /* @__PURE__ */ r("span", { className: "contents", children: s })
        ]
      }
    );
    return i ? /* @__PURE__ */ r(B, { content: i, render: h }) : h;
  }
);
z.displayName = "Button";
const q = ({
  "aria-label": s = "Refresh",
  loading: t,
  ...e
}) => /* @__PURE__ */ r(z, { shape: "square", "aria-label": s, ...e, children: /* @__PURE__ */ r(
  N,
  {
    className: l({
      "animate-refresh": t,
      "size-4.5": e.size === "base" || !e.size,
      "size-4": e.size === "sm",
      "size-5": e.size === "lg"
    })
  }
) }), S = k.forwardRef(
  ({
    children: s,
    className: t,
    external: e,
    href: o,
    shape: d = "base",
    size: n = "base",
    variant: m = "ghost",
    icon: b,
    // linksExternal = false,
    ...i
  }, p) => {
    const g = L(), f = e ? { target: "_blank", rel: "noopener noreferrer" } : {};
    return /* @__PURE__ */ x(
      g,
      {
        ref: p,
        className: l(
          y({ variant: m, size: n, shape: d }),
          "flex items-center no-underline!",
          t
        ),
        href: o,
        to: typeof o == "string" ? o : void 0,
        ...f,
        ...i,
        children: [
          v(b),
          s
        ]
      }
    );
  }
);
S.displayName = "LinkButton";
export {
  z as B,
  S as L,
  q as R,
  y as b
};
//# sourceMappingURL=button-fe5rvewji3e5xd7m.js.map
