@retailmenot/anchor/esm/avatar.js

A React UI Library by RetailMeNot

import { a as _taggedTemplateLiteral } from './anchor-chunk-7b9d8557.js';
import { a as __rest } from './anchor-chunk-27f34e54.js';
import { forwardRef, createElement, useContext, useState, Children, Fragment, useEffect, useRef, createRef, Component, cloneElement, useReducer, PureComponent, isValidElement, createContext, useImperativeHandle } from 'react';
import classNames from 'classnames';
import styled from '@xstyled/styled-components';
import { space } from '@xstyled/system';

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n    flex: 0 0 1.625rem;\n    width: 1.625rem;\n    height: 1.625rem;\n    font-family: base;\n    font-size: 0.75rem;\n    font-weight: bold;\n    color: text.base;\n    background-color: background.base;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: circular;\n    overflow: hidden;\n\n    img {\n        flex: 0 0 100%;\n        max-width: 100%;\n    }\n"]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n    border: solid 0.1875rem rgba(255, 255, 255, 0.4);\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 2rem;\n    width: 2rem;\n    border-radius: circular;\n\n    svg {\n        justify-self: baseline;\n        height: 1.5rem;\n        margin-bottom: -0.375rem;\n    }\n    ", "\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}
/* eslint-disable max-len */

var DefaultAvatar = function DefaultAvatar() {
  return createElement("svg", {
    width: "36",
    height: "36",
    viewBox: "0 0 22 22",
    xmlns: "http://www.w3.org/2000/svg"
  }, createElement("path", {
    d: "M22 20.427c0 .869-.704 1.573-1.571 1.573H1.57A1.572 1.572 0 0 1 0 20.427V18.95c0-3.527 2.805-6.392 6.254-6.392h.038v-.001c1.315.993 2.934 1.604 4.708 1.604s3.393-.611 4.708-1.604v.001h.038c3.449 0 6.254 2.865 6.254 6.392v1.476zM11 0a6.29 6.29 0 0 1 6.286 6.294A6.29 6.29 0 0 1 11 12.59a6.29 6.29 0 0 1-6.286-6.295A6.29 6.29 0 0 1 11 0z",
    fill: "#A6A6A6"
  }));
};
/* eslint-enable max-len */


var StyledAvatar = styled('div')(_templateObject(), space);
var InnerBorder = styled('div')(_templateObject2());
var Avatar = function Avatar(_a) {
  var className = _a.className,
      src = _a.src,
      label = _a.label,
      alt = _a.alt,
      props = __rest(_a, ["className", "src", "label", "alt"]);

  return createElement(StyledAvatar, Object.assign({
    className: classNames('anchor-avatar', className)
  }, props), createElement(InnerBorder, {
    className: "anchor-avatar-container"
  }, label && label.substr(0, 2).toUpperCase(), src && createElement("img", {
    src: src,
    alt: alt ? alt : 'Anchor Avatar'
  }), !label && !src && createElement(DefaultAvatar, null)));
};

export { Avatar };
//# sourceMappingURL=avatar.js.map