@hhgtech/hhg-components/build/esm/index-e9423cb7.js

Hello Health Group common components

import { _ as __rest } from './tslib.es6-ea4dfe68.js';
import React__default, { useContext, useState } from 'react';
import { T as TogetherComponentGlobalContext } from './utils-40e61585.js';
import styled from '@emotion/styled';
import { theme } from './miscTheme.js';

const StyledUserAvatar = styled.div `
  width: ${(props) => props.size || 40}px;
  height: ${(props) => props.size || 40}px;
  flex-shrink: 0;
  cursor: pointer;

  img {
    border-radius: 50%;
  }

  .avatar {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .avatar-default {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: ${theme.colors.secondaryBase};
    border-radius: 50%;
    color: white;
    font-size: 1em;
    font-weight: bold;
    line-height: 1;
  }

  &[data-is-marrybaby='true'] {
    .avatar-default {
      background-color: ${theme.mbColors.pink};
    }
  }
`;

const UserAvatar = (_a) => {
    var { className, isMarryBaby: isMarryBabyProp, style, avatar, username, size } = _a, rest = __rest(_a, ["className", "isMarryBaby", "style", "avatar", "username", "size"]);
    const { data: { env: { isMarryBaby: isMarryBabyContext }, }, } = useContext(TogetherComponentGlobalContext);
    const isMarryBaby = typeof isMarryBabyProp === 'boolean' ? isMarryBabyProp : isMarryBabyContext;
    const [tempAvatar, setTempAvatar] = useState(false);
    return (React__default.createElement(StyledUserAvatar, Object.assign({ "data-is-marrybaby": isMarryBaby, className: className, style: style, size: size }, rest), avatar && !tempAvatar ? (React__default.createElement("img", { loading: "lazy", src: avatar, className: `avatar`, alt: "avatar", onError: () => {
            // e.currentTarget.onerror = null
            if (!tempAvatar)
                setTempAvatar(true);
        } })) : (React__default.createElement("div", { className: "avatar avatar-default" }, username && (username === null || username === void 0 ? void 0 : username.length) > 0 ? username[0].toUpperCase() : 'A'))));
};

export { UserAvatar as U };