import { j as t } from "../../node_modules/react/jsx-runtime.js";
import { forwardRef as d } from "react";
import { cva as m } from "../../node_modules/class-variance-authority/dist/index.js";
import { cn as l } from "../../utils/index.js";
import { Icon as u } from "../Icon/index.js";
const b = m(
  [
    "w-full",
    //full-width
    "rounded-md",
    //rounded-border
    "font-medium",
    //font semibold
    "focus:outline-none",
    //no outline when is focus
    "disabled:cursor-not-allowed",
    "focus:ring-1",
    "focus:ring-offset-2",
    "text-nowrap",
    "flex flex-row items-center justify-center gap-2"
  ],
  {
    variants: {
      variant: {
        solid: "",
        outline: "border-2",
        ghost: "transition-colors duration-300"
      },
      size: {
        sm: "px-3 py-2 text-sm",
        md: "px-4 py-3 text-base",
        lg: "px-6 py-5 text-lg"
      },
      colorscheme: {
        primary: "text-white"
      },
      fit: {
        content: "w-fit",
        stretch: "w-full"
      }
    },
    compoundVariants: [
      {
        variant: "solid",
        colorscheme: "primary",
        className: "bg-interaction-main-default hover:bg-interaction-main-hover active:bg-interaction-main-active focus:ring-interaction-main-default disabled:!bg-interaction-support-disabled-subtle disabled:!text-interaction-support-disabled-medium"
      },
      {
        variant: "outline",
        colorscheme: "primary",
        className: "text-interaction-main-default border-interaction-main-default bg-transparent hover:bg-interaction-muted-brand-hover active:bg-interaction-muted-brand-active focus:border-interaction-main-active focus:ring-0 disabled:text-interaction-support-disabled-medium disabled:!border-interaction-support-disabled-medium disabled:!bg-transparent"
      },
      {
        variant: "ghost",
        colorscheme: "primary",
        className: "text-interaction-main-default bg-transparent hover:bg-interaction-muted-brand-hover active:bg-interaction-muted-brand-active focus:ring-interaction-main-default disabled:!text-interaction-support-disabled-medium"
      }
    ],
    defaultVariants: {
      variant: "solid",
      size: "md",
      colorscheme: "primary",
      fit: "content"
    }
  }
), s = d(
  ({ variant: e, size: i, colorscheme: a, fit: o, className: r, ...n }, c) => /* @__PURE__ */ t.jsx(
    "button",
    {
      ref: c,
      className: l(
        b({ variant: e, size: i, colorscheme: a, fit: o, className: r })
      ),
      ...n
    }
  )
), h = d(
  ({ variant: e, size: i, colorscheme: a, className: o, ...r }, n) => /* @__PURE__ */ t.jsxs("div", { className: "flex gap-[3px]", ref: n, children: [
    /* @__PURE__ */ t.jsx(
      s,
      {
        className: "rounded-l-lg rounded-r-none",
        variant: e,
        size: i,
        ...r
      }
    ),
    /* @__PURE__ */ t.jsx(
      s,
      {
        className: "rounded-r-lg rounded-l-none",
        variant: e,
        size: i,
        ...r,
        children: /* @__PURE__ */ t.jsx(u, { name: "chevron-down", size: "sm" })
      }
    )
  ] })
);
export {
  s as Button,
  h as SplitButton
};
