import React from 'react';
import classnames from 'classnames';
import { Tooltip, TOOLTIP_PLACEMENT_TYPES } from '../tooltip';
import { useTranslation } from '../hooks/use-translation';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const getInitials = callerName => {
  const names = callerName.split(' ');
  let initials = names[0].substring(0, 1);
  if (names.length > 1) {
    initials += names[names.length - 1].substring(0, 1);
  }
  return initials;
};
/** Renders the placeholder for users avatar.
 * @uxr-only-supported
 * @midnight-gray-supported
 * @alpine-light-supported
 */
export const Avatar = ({
  children,
  callerName,
  className = '',
  imageSrc = '',
  imageAlt,
  isTooltipHidden = false,
  tooltipText = '',
  testId = 'avatar'
}) => {
  const {
    t
  } = useTranslation();
  const avatarAlt = imageAlt ?? t('avatar image');
  const initials = callerName ? getInitials(callerName) : null;
  const tooltipContent = tooltipText || callerName;

  // With Image
  if (imageSrc) {
    return /*#__PURE__*/_jsxs("figure", {
      className: "avatar",
      children: [!isTooltipHidden && /*#__PURE__*/_jsx(Tooltip, {
        content: tooltipContent,
        placement: TOOLTIP_PLACEMENT_TYPES.TOP,
        children: /*#__PURE__*/_jsx("img", {
          className: classnames('avatar-container', className),
          "test-id": testId,
          src: imageSrc,
          alt: avatarAlt
        })
      }), isTooltipHidden && /*#__PURE__*/_jsx("img", {
        className: classnames('avatar-container', className),
        "test-id": testId,
        src: imageSrc,
        alt: avatarAlt
      }), children && /*#__PURE__*/_jsx("figcaption", {
        className: "avatar-name",
        "test-id": "avatar-name",
        children: children
      })]
    });
  }

  // With Initials
  return /*#__PURE__*/_jsxs("figure", {
    className: "avatar",
    children: [callerName && !isTooltipHidden && /*#__PURE__*/_jsx(Tooltip, {
      content: tooltipContent,
      placement: TOOLTIP_PLACEMENT_TYPES.TOP,
      children: /*#__PURE__*/_jsx("div", {
        className: classnames('avatar-container', className),
        "test-id": testId,
        children: initials
      })
    }), callerName && isTooltipHidden && /*#__PURE__*/_jsx("div", {
      className: classnames('avatar-container uppercased', className),
      "test-id": testId,
      children: initials
    }), children && /*#__PURE__*/_jsx("figcaption", {
      className: "avatar-name",
      "test-id": "avatar-name",
      children: children
    })]
  });
};