gab-social/app/javascript/gabsocial/components/image.js
2020-02-19 18:57:07 -05:00

41 lines
973 B
JavaScript

import classNames from 'classnames/bind'
import { autoPlayGif } from '../initial_state'
// : testing :
const placeholderSource = 'https://via.placeholder.com/150'
const cx = classNames.bind(_s)
export default class Image extends PureComponent {
static propTypes = {
alt: PropTypes.string,
src: PropTypes.string,
className: PropTypes.string,
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
fit: PropTypes.oneOf(['contain', 'cover', 'tile', 'none']),
}
static defaultProps = {
width: '100%',
fit: 'cover',
}
render() {
const { src, fit, className, ...otherProps } = this.props
const source = src || placeholderSource
const classes = cx(className, {
default: 1,
objectFitCover: fit === 'cover'
})
return (
<img
className={classes}
{...otherProps}
src={source}
/>
)
}
}