diff --git a/.eslintrc b/.eslintrc index 7402bf12..1a3afc33 100644 --- a/.eslintrc +++ b/.eslintrc @@ -27,7 +27,12 @@ } }, "rules": { - "prettier/prettier": "error", + "prettier/prettier": [ + "error", + { + "endOfLine": "auto" + } + ], "arrow-body-style": [2, "always"], "no-console": 0, "no-param-reassign": 0, diff --git a/src/components/image/image.js b/src/components/image/image.js index a7f2f05c..6f8966fd 100644 --- a/src/components/image/image.js +++ b/src/components/image/image.js @@ -5,13 +5,28 @@ import classnames from 'classnames'; import Element from '../element'; const Image = ({ + // figure tag props className, + fullwidth, + // img tag props alt, + crossOrigin, + height, + ismap, + loading, + longdesc, + referrerpolicy, + sizes, + src, + srcSet, + useMap, + width, + // component props size, fallback, rounded, - src, - fullwidth, + imageClassName, + // leftovers ...props }) => { const [state, setState] = useState({ src }); @@ -32,7 +47,7 @@ const Image = ({ })} > { @@ -40,14 +55,41 @@ const Image = ({ }} src={state.src} alt={alt} + crossOrigin={crossOrigin} + height={height} + ismap={ismap} + loading={loading} + longdesc={longdesc} + referrerpolicy={referrerpolicy} + sizes={sizes} + srcSet={srcSet} + useMap={useMap} + width={width} /> ); }; Image.propTypes = { - src: PropTypes.string.isRequired, + fullwidth: PropTypes.bool, alt: PropTypes.string, + crossOrigin: PropTypes.oneOf(['anonymous', 'use-credentials']), + height: PropTypes.string, + ismap: PropTypes.bool, + loading: PropTypes.oneOf(['eager', 'lazy']), + longdesc: PropTypes.string, + referrerpolicy: PropTypes.oneOf([ + 'no-referrer', + 'no-referrer-when-downgrade', + 'origin', + 'origin-when-cross-origin', + 'unsafe-url', + ]), + sizes: PropTypes.string, + src: PropTypes.string.isRequired, + srcSet: PropTypes.string, + useMap: PropTypes.string, + width: PropTypes.string, rounded: PropTypes.bool, size: PropTypes.oneOfType([ PropTypes.oneOf([ @@ -79,7 +121,10 @@ Image.propTypes = { PropTypes.string, ]), fallback: PropTypes.string, - fullwidth: PropTypes.bool, + /** + * Applies additional classes to the `img` tag (standard `className` applies to root element) + */ + imageClassName: PropTypes.string, renderAs: PropTypes.oneOfType([ PropTypes.func, PropTypes.string,