"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _box = _interopRequireDefault(require("../../atoms/box/box"));
var _stack = require("../../atoms/stack/stack");
var _avatar = _interopRequireDefault(require("./avatar"));
var _useAvatarGroup = require("./useAvatarGroup");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
/**
 * AvatarGroup is a component that groups multiple Avatar components together. It can truncate the avatars and show a "+X" label (where X is the remaining avatars).
 */
const AvatarGroup = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef(({
  children,
  spacing = "2",
  max = 3,
  ...rest
}, ref) => {
  // Convert the children to an array
  const avatarChildren = _react.default.Children.toArray(children);

  /**
   * Render the avatars.
   * @returns An array of Avatar components.
   */
  const renderAvatars = () => {
    return _react.default.Children.map(avatarChildren, (child, index) => {
      const shouldBreakLoop = index > max;
      const shouldRenderAvatar = index + 1 <= max;
      if (shouldBreakLoop) return;
      if (shouldRenderAvatar) return /*#__PURE__*/_react.default.cloneElement(child);else {
        if (rest.customTruncatedComponent) return /*#__PURE__*/_react.default.cloneElement(rest.customTruncatedComponent, {
          ...rest.customTruncatedComponent.props,
          remainingAvatars: avatarChildren.length - max
        });
        return /*#__PURE__*/_react.default.createElement(_avatar.default, {
          name: `+${avatarChildren.length - max}`,
          getInitials: name => name,
          backgroundColor: rest.truncatedBackgroundColor
        });
      }
    });
  };
  return /*#__PURE__*/_react.default.createElement(_box.default, _extends({}, rest, {
    ref: ref
  }), /*#__PURE__*/_react.default.createElement(_useAvatarGroup.avatarGroupContext.Provider, {
    value: {
      size: rest.size,
      variant: rest.variant
    }
  }, /*#__PURE__*/_react.default.createElement(_stack.ZStack, {
    reversed: true,
    spacing: spacing
  }, renderAvatars())));
}));
AvatarGroup.displayName = "AvatarGroup";
var _default = exports.default = AvatarGroup;
//# sourceMappingURL=avatar-group.js.map