import { makeStyles } from '@material-ui/core';
import React from 'react';
import { ImageFooter } from './ImageFooter';
const useStyles = makeStyles(theme => ({
    imageWrapper: {
        flex: '1 1 auto',
        overflow: 'hidden',
        position: 'relative',
        margin: theme.spacing(2)
    },
    image: {
        objectFit: 'contain',
        width: '100%',
        height: '100%',
        position: 'absolute',
        top: 0,
        left: 0,
    },
    cardContent: {
        display: 'flex',
        flexDirection: 'column',
        overflow: 'hidden',
        height: '100%',
        background: theme.palette.background.paper,
    },
}));
export const Image = props => {
    const { imageObj, hidePrimaryText, hideSecondaryText } = props;
    const classes = useStyles();
    return (React.createElement("div", { className: classes.cardContent }, React.createElement("div", { className: classes.imageWrapper }, React.createElement("img", { src: imageObj === null || imageObj === void 0 ? void 0 : imageObj.filePath, loading: "lazy", alt: `${imageObj === null || imageObj === void 0 ? void 0 : imageObj.fileName}`, className: classes.image })), React.createElement(ImageFooter, { currentImageObj: imageObj, hidePrimaryText: hidePrimaryText, hideSecondaryText: hideSecondaryText })));
};
//# sourceMappingURL=Image.js.map