Revert "Pass all Image.props to nested img element"

This reverts commit ab8cb0b.

src/components/Image/Image.tsx

@@ -13,10 +13,7 @@ export type ImageProps = React.ImgHTMLAttributes<HTMLImageElement> & {
 } & ({ href: string; title: string } | { href?: never; title?: never });
 
 const Image = React.forwardRef<HTMLImageElement, ImageProps>(
- (
- { alt = "", className, isSrcLoading, href, title, onError, ...props },
- forwardRef
- ) => {
+ ({ className, ...props }, forwardRef) => {
  const ref = useRef<HTMLImageElement>(null);
  const [isError, setError] = useState(false);
 
@@ -26,7 +23,7 @@ const Image = React.forwardRef<HTMLImageElement, ImageProps>(
  () => ref.current
  );
 
- if ((!props.src && !isSrcLoading) || isError) {
+ if ((!props.src && !props.isSrcLoading) || isError) {
  return <ImagePlaceholder className={className} />;
  }
 
@@ -48,8 +45,7 @@ const Image = React.forwardRef<HTMLImageElement, ImageProps>(
  * 5. Component `Image` flickers as it transitions from displaying `ContentLoader` to displaying `img`
  *
  */
- const isLoading = !ref.current?.complete && isSrcLoading;
- const commonClasses = `${className} ${isLoading ? "hidden" : ""}`;
+ const isLoading = !ref.current?.complete && props.isSrcLoading;
 
  return (
  <>
@@ -66,13 +62,20 @@ const Image = React.forwardRef<HTMLImageElement, ImageProps>(
  * wrapping the `img`.
  *
  */}
- <WithLink className={commonClasses} href={href} title={title}>
+ <WithLink
+ className={`${className} ${isLoading ? "hidden" : ""}`}
+ href={props.href}
+ title={props.title}
+ >
  <img
  ref={ref}
- className={`object-contain ${commonClasses}`}
- alt={alt}
- onError={(e) => (onError ? onError(e) : setError(true))}
- {...props}
+ src={props.src}
+ className={`object-contain ${
+ isLoading ? "hidden" : ""
+ } ${className}`}
+ alt={props.alt || ""}
+ loading={props.loading}
+ onError={(e) => (props.onError ? props.onError(e) : setError(true))}
  />
  </WithLink>
  </>