@bootstrap-styled/ra-ui/lib/components/extendMui/Avatar/index.js

UI components for react-admin

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.styles = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _styledComponents = _interopRequireDefault(require("styled-components"));

var styles = function styles(theme) {
  return {
    colorDefault: {
      color: theme.palette.background.default,
      backgroundColor: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[600]
    }
  };
};

exports.styles = styles;

function AvatarUnstyled(props) {
  var alt = props.alt,
      childrenProp = props.children,
      childrenClassNameProp = props.childrenClassName,
      classNameProp = props.className,
      Component = props.component,
      imgProps = props.imgProps,
      sizes = props.sizes,
      src = props.src,
      srcSet = props.srcSet,
      other = (0, _objectWithoutProperties2.default)(props, ["alt", "children", "childrenClassName", "className", "component", "imgProps", "sizes", "src", "srcSet"]);
  var className = (0, _classnames.default)({
    'color-default': childrenProp && !src && !srcSet
  }, classNameProp);
  var children = null;

  if (childrenProp) {
    if (childrenClassNameProp && typeof childrenProp !== 'string' && _react.default.isValidElement(childrenProp)) {
      var childrenClassName = (0, _classnames.default)(childrenClassNameProp, childrenProp.props.className);
      children = _react.default.cloneElement(childrenProp, {
        className: childrenClassName
      });
    } else {
      children = childrenProp;
    }
  } else if (src || srcSet) {
    children = _react.default.createElement("img", (0, _extends2.default)({
      alt: alt,
      src: src,
      srcSet: srcSet,
      sizes: sizes,
      className: "avatar-img"
    }, imgProps));
  }

  return _react.default.createElement(Component, (0, _extends2.default)({
    className: (0, _classnames.default)(className, 'avatar')
  }, other), children);
}

var Avatar = (0, _styledComponents.default)(AvatarUnstyled).withConfig({
  displayName: "Avatar",
  componentId: "sc-1argd26-0"
})(["", ""], function (props) {
  return "\n    &.avatar {\n      position: 'relative';\n      display: 'flex';\n      align-items: 'center';\n      justify-content: 'center';\n      flex-shrink: 0;\n      width: theme.spacing.unit * 5;\n      height: theme.spacing.unit * 5;\n      font-family: theme.typography.fontFamily;\n      font-size: theme.typography.pxToRem(20);\n      border-radius: '50%';\n      overflow: 'hidden';\n      user-select: 'none';\n      &.color-default {\n        color: ".concat(props.theme['$avatar-color-default'], "\n        background-color: ").concat(props.theme['$avatar-bg-default'], "\n      };\n      .avatar-img {\n        width: '100%';\n        height: '100%';\n        text-align: 'center';\n        // Handle non-square image. The property isn't supported by IE11.\n        object-fit: 'cover';\n      }\n    }\n  ");
});
Avatar.propTypes = {
  alt: _propTypes.default.string,
  children: _propTypes.default.node,
  childrenClassName: _propTypes.default.string,
  className: _propTypes.default.string,
  component: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]),
  imgProps: _propTypes.default.object,
  sizes: _propTypes.default.string,
  src: _propTypes.default.string,
  srcSet: _propTypes.default.string
};
Avatar.defaultProps = {
  component: 'div'
};
var _default = Avatar;
exports.default = _default;