@trail-ui/react/dist/chunk-VHL2FHIN.mjs

import {
  AvatarContext,
  _Avatar
} from "./chunk-6QLWLSJK.mjs";

// src/avatar/avatar-group.tsx
import { getValidChildren } from "@trail-ui/react-utils";
import { clsx, compact } from "@trail-ui/shared-utils";
import { avatarGroup } from "@trail-ui/theme";
import {
  cloneElement,
  forwardRef,
  useMemo
} from "react";
import { jsx, jsxs } from "react/jsx-runtime";
function AvatarGroup(props, ref) {
  const {
    elementType,
    max = 5,
    total,
    size,
    color,
    radius,
    isBordered,
    isDisabled,
    isGrid,
    renderCount = (count) => /* @__PURE__ */ jsx(_Avatar, { className: "hover:-translate-x-0", name: `+${count}` }),
    className,
    children,
    ...otherProps
  } = props;
  const Component = elementType || "span";
  const context = useMemo(
    () => ({
      isInGroup: true,
      size,
      color,
      radius,
      isGrid,
      isBordered,
      isDisabled
    }),
    [size, color, radius, isGrid, isBordered, isDisabled]
  );
  const classNames = useMemo(() => avatarGroup({ className, isGrid }), [className, isGrid]);
  const validChildren = getValidChildren(children);
  const childrenWithinMax = max ? validChildren.slice(0, max) : validChildren;
  const remainingCount = total ? total : max != null ? validChildren.length - max : -1;
  const clones = childrenWithinMax.map((child, index) => {
    const isFirstAvatar = index === 0;
    const isLastAvatar = index === childrenWithinMax.length - 1;
    const childProps = {
      className: clsx(
        isFirstAvatar ? "ms-0" : !isGrid ? "-ms-2" : "",
        isLastAvatar && remainingCount < 1 ? "hover:-translate-x-0" : ""
      )
    };
    return cloneElement(child, compact(childProps));
  });
  return /* @__PURE__ */ jsx(Component, { ref, className: classNames, role: "group", ...otherProps, children: /* @__PURE__ */ jsxs(AvatarContext.Provider, { value: context, children: [
    clones,
    remainingCount > 0 && renderCount(remainingCount)
  ] }) });
}
var _AvatarGroup = forwardRef(AvatarGroup);

export {
  _AvatarGroup
};