var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { tagPropType, mapToCssModules } from './Shared/helper.js';

//component - CoreUI / CImg

var CImg = function CImg(props) {
  var className = props.className,
      cssModule = props.cssModule,
      innerRef = props.innerRef,
      fluid = props.fluid,
      block = props.block,
      thumbnail = props.thumbnail,
      shape = props.shape,
      align = props.align,
      alt = props.alt,
      src = props.src,
      width = props.width,
      height = props.height,
      placeholderColor = props.placeholderColor,
      active = props.active,
      fluidGrow = props.fluidGrow,
      attributes = _objectWithoutProperties(props, ['className', 'cssModule', 'innerRef', 'fluid', 'block', 'thumbnail', 'shape', 'align', 'alt', 'src', 'width', 'height', 'placeholderColor', 'active', 'fluidGrow']);

  // vars

  var isActive = function () {
    //active prop is present in CImgLazy component, here always undefined
    return active !== false;
  }();

  var alignClass = function () {
    if (align === 'center') {
      return 'mx-auto';
    } else if (align === 'right') {
      return 'float-right';
    } else if (align === 'left') {
      return 'float-left';
    }
    return null;
  }();

  // render

  var classes = mapToCssModules(classNames(className, alignClass, thumbnail ? 'img-thumbnail' : null, fluid || fluidGrow ? 'img-fluid' : null, fluidGrow ? 'w-100' : null, block ? 'd-block' : null, shape ? shape : null), cssModule);

  return src && isActive ? React.createElement('img', _extends({}, attributes, {
    className: classes,
    src: src,
    alt: alt,
    width: width,
    height: height,
    ref: innerRef })) : React.createElement('svg', _extends({}, attributes, {
    className: classes,
    width: width,
    height: height,
    style: { 'backgroundColor': isActive ? placeholderColor : 'transparent' },
    ref: innerRef
  }));
};

CImg.propTypes = process.env.NODE_ENV !== "production" ? {
  tag: tagPropType,
  className: PropTypes.string,
  cssModule: PropTypes.object,
  //
  innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),
  src: PropTypes.string,
  alt: PropTypes.string,
  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
  height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
  block: PropTypes.bool,
  fluid: PropTypes.bool,
  fluidGrow: PropTypes.bool,
  shape: PropTypes.string, //oneOf(['', 'rounded']),
  thumbnail: PropTypes.bool,
  align: PropTypes.oneOf(['', 'left', 'right', 'center']),
  placeholderColor: PropTypes.string
} : {};

CImg.defaultProps = {
  placeholderColor: 'transparent'
};

export default CImg;