import * as React from 'react' ; import * as PropTypes from 'prop-types' ; import classNames from 'classnames' ; import { ImageProps as ReakitImageProps } from 'reakit/ts' ; import _Image from './styled' ; export type LocalImageProps = { children ? : React . ReactNode ; className ? : string ; /** How the image fits its bounds */ fit ? : 'cover' | 'contain' ; /** Positioning of the fitted image. Value can be "top", "left", "center", "right", "bottom" or an "x y" coordinate */ fitPosition ? : string ; /** Fix the width of the image. It will not be responsive. */ isFixed ? : boolean ; } ; export type ImageProps = LocalImageProps & ReakitImageProps ; export const Image = ( { children , className , isFixed , ... props } ) => ( < _Image className = { classNames ( { [ className || '' ] : Boolean ( className ) } ) } isFixed = { isFixed } { ... props } > { children } < /_Image>); export const imagePropTypes = { children : PropTypes . node , className : PropTypes . string , fit : PropTypes . oneOf ( [ 'cover' , 'contain' ] ) as PropTypes . Validator < LocalImageProps [ 'fit' ] > , fitPosition : PropTypes . string , isFixed : PropTypes . bool } ; Image . propTypes = imagePropTypes ; export const imageDefaultProps = { children : undefined , className : undefined , fit : undefined , fitPosition : undefined , isFixed : false } ; Image . defaultProps = imageDefaultProps ; const C = Image ; export default C ;