@shakthillc/components/es/Avatar/Avatar.js

React generic components for shakthi products

import _Object$getPrototypeOf from "babel-runtime/core-js/object/get-prototype-of";
import _classCallCheck from "babel-runtime/helpers/classCallCheck";
import _createClass from "babel-runtime/helpers/createClass";
import _possibleConstructorReturn from "babel-runtime/helpers/possibleConstructorReturn";
import _inherits from "babel-runtime/helpers/inherits";
import React from "react";
import style from "./Avatar.module.css";
import { PropTypes } from "prop-types";

var Avatar = function (_React$PureComponent) {
  _inherits(Avatar, _React$PureComponent);

  function Avatar() {
    _classCallCheck(this, Avatar);

    return _possibleConstructorReturn(this, (Avatar.__proto__ || _Object$getPrototypeOf(Avatar)).apply(this, arguments));
  }

  _createClass(Avatar, [{
    key: "returnColor",
    value: function returnColor() {
      var color = ["#a3a398", "#b7a1f9", "#40a78c", "#D0EAF1", "#8FBCBC", "#cbcef9", "#76a5b4", "#5b9d60", "#B1DC88"];
      return color[Math.floor(Math.random() * color.length)];
    }
  }, {
    key: "returnNode",
    value: function returnNode() {
      var _props = this.props,
          imageUrl = _props.imageUrl,
          text = _props.text,
          size = _props.size;

      if (imageUrl && imageUrl !== "") {
        return React.createElement("div", {
          className: style["avatar-img"],
          style: {
            backgroundImage: "url(" + imageUrl + ")",
            width: "" + size,
            height: "" + size
          }
        });
      } else {
        return React.createElement(
          "div",
          {
            className: style["avatar"],
            style: {
              width: size,
              height: size,
              backgroundColor: this.returnColor(),
              lineHeight: size
            }
          },
          text[0].toUpperCase()
        );
      }
    }
  }, {
    key: "render",
    value: function render() {
      return this.returnNode();
    }
  }]);

  return Avatar;
}(React.PureComponent);

export default Avatar;

Avatar.defaultProps = {
  imageUrl: "",
  size: "24px"
};
Avatar.propTypes = {
  imageUrl: PropTypes.string,
  text: PropTypes.string,
  size: PropTypes.string
};