import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _isEmpty from "lodash/isEmpty";
import React from 'react';
import { ElementRoot } from "../../../components/ElementRoot";
import OlineImage from "../../../../editor/components/OlineImage";
import img from "../../../../editor/assets/banner01.png";
import { Link } from '@fishx/router';

var Image = function Image(props) {
  var element = props.element,
      elementStyle = props.elementStyle;
  var _element$data = element.data,
      _element$data$image = _element$data.image,
      image = _element$data$image === void 0 ? {} : _element$data$image,
      link = _element$data.link,
      _element$data$setting = _element$data.settings,
      settings = _element$data$setting === void 0 ? {} : _element$data$setting;
  var _image$width = image.width,
      width = _image$width === void 0 ? 'auto' : _image$width,
      _image$height = image.height,
      height = _image$height === void 0 ? 'auto' : _image$height;
  var _settings$horizontalA = settings.horizontalAlign,
      horizontalAlign = _settings$horizontalA === void 0 ? 'left' : _settings$horizontalA;
  var imgStyle = {
    width: width,
    height: height
  };

  if (!imgStyle.width) {
    imgStyle.width = 'auto';
  } else {
    imgStyle.width += imgStyle.width.endsWith('px') ? '' : 'px';
  }

  if (!imgStyle.height) {
    imgStyle.height = 'auto';
  } else {
    imgStyle.height += imgStyle.height.endsWith('px') ? '' : 'px';
  }

  var style = {
    display: 'inline-block',
    maxWidth: '100%',
    maxHeight: '100%'
  };
  return /*#__PURE__*/React.createElement(ElementRoot, {
    element: element,
    style: {
      textAlign: horizontalAlign
    },
    className: 'webiny-pb-base-page-element-style webiny-pb-page-element-image'
  }, link ? /*#__PURE__*/React.createElement(Link, {
    to: link.href,
    target: link.newTab || '_blank'
  }, !_isEmpty(image.file) ? /*#__PURE__*/React.createElement(OlineImage, {
    imageInfo: image.file,
    style: _objectSpread(_objectSpread(_objectSpread({}, imgStyle), elementStyle), style)
  }) : /*#__PURE__*/React.createElement("img", {
    src: img,
    alt: "",
    style: _objectSpread(_objectSpread({}, style), elementStyle)
  })) : /*#__PURE__*/React.createElement("div", null, !_isEmpty(image.file) ? /*#__PURE__*/React.createElement(OlineImage, {
    imageInfo: image.file,
    style: _objectSpread(_objectSpread(_objectSpread({}, imgStyle), elementStyle), style)
  }) : /*#__PURE__*/React.createElement("img", {
    src: img,
    alt: "",
    style: _objectSpread(_objectSpread({}, style), elementStyle)
  })));
};

export default Image;
//# sourceMappingURL=Image.js.map