"use client";
import { jsx as n, jsxs as x, Fragment as z } from "react/jsx-runtime";
import v from "react";
import { ArrowsClockwise as R } from "@phosphor-icons/react";
import { L as C } from "./loader-g8a6j76ue5nq0lr8.js";
import { T as U } from "./tooltip-mooldq78tg77ekvv.js";
import { r as m } from "./resolve-variant-gw6eh7fa4st8ej7m.js";
import { u as D } from "./link-provider-mn2voeohon7cj9o4.js";
import { c as b } from "./vendor-styling-ofvnbcuht98q88oo.js";
const d = {
  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: "relative overflow-hidden bg-(--kumo-button-emphasis-bg) !text-white ring ring-(--kumo-button-emphasis-ring) focus:ring-(--kumo-button-emphasis-ring) focus-visible:ring-(--kumo-button-emphasis-ring) active:ring-(--kumo-button-emphasis-ring) disabled:opacity-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-line 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: "relative overflow-hidden bg-(--kumo-button-emphasis-bg) !text-white ring ring-(--kumo-button-emphasis-ring) focus:ring-(--kumo-button-emphasis-ring) focus-visible:ring-(--kumo-button-emphasis-ring) active:ring-(--kumo-button-emphasis-ring) disabled:opacity-50",
      description: "Danger button for destructive actions like delete"
    },
    "secondary-destructive": {
      classes: "bg-kumo-base !text-kumo-danger ring not-disabled:hover:!text-kumo-danger not-disabled:hover:ring-kumo-danger/30 disabled:bg-kumo-base/50 disabled:!text-kumo-danger/70 ring-kumo-line 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-line transition-colors not-disabled:hover:text-kumo-strong not-disabled:hover:ring-kumo-focus/25",
      description: "Bordered button with transparent background"
    }
  }
}, r = {
  shape: "base",
  size: "base",
  variant: "secondary"
};
function N({
  variant: e = r.variant,
  size: s = r.size,
  shape: t = r.shape
} = {}) {
  const o = t === "square" || t === "circle";
  return b(
    // 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",
    m(
      d.size,
      s,
      r.size
    ).classes,
    m(
      d.shape,
      t,
      r.shape
    ).classes,
    o && m(
      d.compactSize,
      s,
      r.size
    ).classes,
    m(
      d.variant,
      e,
      r.variant
    ).classes
  );
}
const _ = (e) => e ? v.isValidElement(e) ? e : /* @__PURE__ */ n(e, {}) : null, B = (e) => {
  if (e === "primary") return "var(--color-kumo-brand)";
  if (e === "destructive") return "var(--color-kumo-danger)";
}, S = (e) => {
  const s = B(e);
  if (s)
    return {
      "--kumo-button-emphasis-ring": `color-mix(in oklch, ${s}, black 10%)`,
      "--kumo-button-emphasis-bg": `color-mix(in oklch, ${s}, white 30%)`,
      "--kumo-button-emphasis-gradient-start": `color-mix(in oklch, ${s}, white 15%)`,
      "--kumo-button-emphasis-gradient-end": s
    };
}, T = (e, s, t) => {
  const o = t != null ? /* @__PURE__ */ n("span", { className: "contents", children: t }) : null;
  return B(e) ? /* @__PURE__ */ x(z, { children: [
    /* @__PURE__ */ n(
      "span",
      {
        "aria-hidden": "true",
        className: "absolute inset-0 rounded-[inherit] bg-linear-to-b from-(--kumo-button-emphasis-gradient-start) to-(--kumo-button-emphasis-gradient-end) shadow-[inset_0_1px_0_0_var(--kumo-button-emphasis-bg)] group-hover:from-(--kumo-button-emphasis-bg)"
      }
    ),
    /* @__PURE__ */ x("span", { className: "relative flex items-center gap-1.5", children: [
      s,
      o
    ] })
  ] }) : /* @__PURE__ */ x(z, { children: [
    s,
    o
  ] });
}, L = v.forwardRef(
  ({
    children: e,
    className: s,
    disabled: t,
    loading: o,
    shape: p = "base",
    size: u = "base",
    variant: i = "secondary",
    icon: g,
    style: a,
    title: c,
    ...h
  }, k) => {
    const { type: l, ...f } = h, y = S(i), A = o ? /* @__PURE__ */ n(C, { size: u === "lg" ? 16 : 14 }) : _(g), w = /* @__PURE__ */ n(
      "button",
      {
        ref: k,
        "data-kumo-component": "Button",
        className: b(
          N({ variant: i, size: u, shape: p }),
          t && "cursor-not-allowed opacity-50",
          s
        ),
        disabled: o || t,
        style: y ? { ...y, ...a } : a,
        type: l ?? "button",
        ...f,
        children: T(i, A, e)
      }
    );
    return c ? /* @__PURE__ */ n(U, { content: c, render: w }) : w;
  }
);
L.displayName = "Button";
const P = ({
  "aria-label": e = "Refresh",
  loading: s,
  ...t
}) => /* @__PURE__ */ n(L, { shape: "square", "aria-label": e, ...t, children: /* @__PURE__ */ n(
  R,
  {
    className: b({
      "animate-refresh": s,
      "size-4.5": t.size === "base" || !t.size,
      "size-4": t.size === "sm",
      "size-5": t.size === "lg"
    })
  }
) }), E = v.forwardRef(
  ({
    children: e,
    className: s,
    external: t,
    href: o,
    shape: p = "base",
    size: u = "base",
    variant: i = "ghost",
    icon: g,
    style: a,
    // linksExternal = false,
    ...c
  }, h) => {
    const k = D(), l = S(i), f = t ? { target: "_blank", rel: "noopener noreferrer" } : {};
    return /* @__PURE__ */ n(
      k,
      {
        ref: h,
        "data-kumo-component": "LinkButton",
        className: b(
          N({ variant: i, size: u, shape: p }),
          "flex items-center no-underline!",
          s
        ),
        href: o,
        style: l ? { ...l, ...a } : a,
        to: typeof o == "string" ? o : void 0,
        ...f,
        ...c,
        children: T(i, _(g), e)
      }
    );
  }
);
E.displayName = "LinkButton";
export {
  L as B,
  E as L,
  P as R,
  N as b
};
//# sourceMappingURL=button-ebfdg9mkhojue36n.js.map
