import { jsxs, jsx } from "react/jsx-runtime";
import "react";
import { cn } from "../utils/cn.js";
import { Button } from "../button/button.js";
import { R as Root2, T as Trigger, E as EllipsisVertical, P as Portal2, C as Content2, I as Item2 } from "../../index-CxplIM9k.js";
const ButtonGroup = ({
  actions,
  size = "md",
  variant = "default",
  maxVisibleActions = 2,
  className
}) => {
  if (!actions || actions.length === 0) return null;
  const visibleActions = actions.slice(0, maxVisibleActions);
  const menuActions = actions.slice(maxVisibleActions);
  const hasMenuActions = menuActions.length > 0;
  const getMenuButtonVariant = () => {
    switch (variant) {
      case "default":
        return "secondary";
      // Secondary styling
      case "accent":
        return "default";
      // Primary styling (accent makes all primary)
      case "muted":
        return "secondary";
      // Secondary styling
      default:
        return "secondary";
    }
  };
  const getButtonVariant = (index) => {
    const isFirst = index === 0;
    switch (variant) {
      case "default":
        return isFirst ? "default" : "secondary";
      // First is primary, others secondary
      case "accent":
        return "default";
      // All primary
      case "muted":
        return "secondary";
      // All secondary
      default:
        return isFirst ? "default" : "secondary";
    }
  };
  const responsiveClasses = "flex-1 md:flex-initial";
  return /* @__PURE__ */ jsxs("div", { className: cn("shrink-0 flex gap-1.5", className), children: [
    visibleActions.map((action, index) => /* @__PURE__ */ jsx(
      Button,
      {
        size,
        variant: getButtonVariant(index),
        onClick: action.onClick,
        disabled: action.disabled,
        className: cn(responsiveClasses),
        leftIcon: action.icon,
        children: action.label
      },
      index
    )),
    hasMenuActions && /* @__PURE__ */ jsxs(Root2, { children: [
      /* @__PURE__ */ jsx(Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
        Button,
        {
          size,
          variant: getMenuButtonVariant(),
          className: cn(
            "px-2",
            variant === "accent" ? "data-[state=open]:bg-action/90" : "data-[state=open]:bg-muted/50"
          ),
          "aria-label": "More actions",
          children: /* @__PURE__ */ jsx(EllipsisVertical, { className: "h-4 w-4" })
        }
      ) }),
      /* @__PURE__ */ jsx(Portal2, { children: /* @__PURE__ */ jsx(
        Content2,
        {
          className: "bg-background text-text-primary text-base min-w-[8rem] rounded-lg border border-border shadow-lg outline-none z-50 p-1",
          align: "end",
          sideOffset: 4,
          children: menuActions.map((action, index) => /* @__PURE__ */ jsxs(
            Item2,
            {
              onClick: (e) => action?.onClick?.(
                e
              ),
              disabled: action.disabled,
              className: cn(
                'focus:bg-input focus:text-accent-foreground [&_svg:not([class*="text-"])]:text-muted-foreground',
                "relative flex w-full cursor-pointer items-center gap-2 rounded-sm py-1.5 pl-2 pr-2",
                "outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
                '[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*="size-"])]:size-4'
              ),
              children: [
                action.icon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-secondary", children: action.icon }),
                /* @__PURE__ */ jsx("span", { className: "truncate", children: action.label })
              ]
            },
            index
          ))
        }
      ) })
    ] })
  ] });
};
export {
  ButtonGroup
};
