"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const view_container_1 = require("view-container");
const ImageWrapper = view_container_1.styled.div `
  position: relative;
  width: ${props => (props.width ? props.width : '100%')};
  height: ${props => (props.height ? props.height : '100%')};
`;
exports.ImageWrapper = ImageWrapper;
// could be ImageDiv
const ImageBackground = view_container_1.styled.div.attrs({
    role: 'image',
}) `
  ${props => props.src &&
    view_container_1.styled.css `
      background: url(${props.src}) no-repeat;
      background-size: contain;
      background-position: center;
    `};
  width: ${props => props.width || '800px'};
  height: ${props => props.height || '300px'};
`;
exports.ImageBackground = ImageBackground;
// <ImageElement nowrap={nowrap} />
const ImageElement = view_container_1.styled.img `
  ${props => !props.doAutoAlign &&
    view_container_1.styled.css `
      width: 100%;
      height: auto;
    `};

  ${props => props &&
    props.doAutoAlign &&
    view_container_1.styled.css `
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      margin: auto;
      max-width: 100%;
      max-height: 100%;
    `};
`;
exports.ImageElement = ImageElement;
//# sourceMappingURL=styled.js.map