import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { cva } from "class-variance-authority";
import { cn } from "@open-mercato/shared/lib/utils";
const avatarVariants = cva(
  "inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full font-semibold select-none",
  {
    variants: {
      size: {
        xs: "size-5 text-xs",
        sm: "size-7 text-xs",
        md: "size-9 text-sm",
        lg: "size-12 text-base",
        xl: "size-16 text-xl"
      },
      variant: {
        default: "bg-primary/10 text-primary",
        monochrome: "bg-muted text-muted-foreground"
      }
    },
    defaultVariants: {
      size: "md",
      variant: "default"
    }
  }
);
function computeInitials(label) {
  const trimmed = label.trim();
  if (!trimmed.length) return "?";
  const parts = trimmed.split(/\s+/).filter(Boolean);
  if (parts.length === 1) {
    return parts[0].slice(0, 2).toUpperCase();
  }
  const first = parts[0][0] ?? "";
  const last = parts[parts.length - 1][0] ?? "";
  return (first + last).toUpperCase();
}
const Avatar = React.forwardRef(
  ({ className, label, src, icon, size, variant, ariaLabel, ...rest }, ref) => {
    const initials = React.useMemo(() => computeInitials(label), [label]);
    return /* @__PURE__ */ jsx(
      "div",
      {
        ref,
        role: "img",
        "aria-label": ariaLabel ?? label,
        className: cn(avatarVariants({ size, variant }), className),
        ...rest,
        children: src ? /* @__PURE__ */ jsx("img", { src, alt: "", className: "size-full object-cover", "aria-hidden": "true" }) : icon ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "flex items-center justify-center [&>svg]:size-[55%]", children: icon }) : /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: initials })
      }
    );
  }
);
Avatar.displayName = "Avatar";
function AvatarStack({ children, max = 4, size = "md", className }) {
  const items = React.Children.toArray(children);
  const visible = items.slice(0, max);
  const overflow = items.length - max;
  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center [&>*:not(:first-child)]:-ml-2 [&>*]:ring-2 [&>*]:ring-background", className), children: [
    visible,
    overflow > 0 && /* @__PURE__ */ jsx(Avatar, { label: `+${overflow}`, size, variant: "monochrome", className: "-ml-2" })
  ] });
}
export {
  Avatar,
  AvatarStack,
  avatarVariants
};
//# sourceMappingURL=avatar.js.map
