'Carousel' cannot be used as a JSX component

Question

I am trying to create a carousel of pictures using react-responsive-carousel in my NextJs project. Apparently for some reason I am getting this error wne I import and use Carousel component from the library: 'Carousel' cannot be used as a JSX component. Its type 'typeof Carousel' is not a valid JSX element type. Types of construct signatures are incompatible. Type 'new (props: CarouselProps) => Carousel' is not assignable to type 'new (props: any) => Component<any, any, any>'. Type 'Carousel' is missing the following properties from type 'Component<any, any, any>': context, setState, forceUpdate, props, and 2 more.ts(2786)

The interesting part for me here is that the component renders on the page anyways, however, the Images(NextJs) inside do not work as expected. Their size is the same despite me changing its width and height properties.

import React from "react";
import { Carousel } from "react-responsive-carousel";
import Image from "next/image";
import "react-responsive-carousel/lib/styles/carousel.min.css"; // Import carousel styles
import batteriesOnTheField from "@/public/en/images/photovoltaicPage/photovoltaicPage-top-right.jpeg";
import batteriesOnSunset from "@/public/en/images/photovoltaicPage/photovoltaicPage-bot-left.jpeg";
import batteriesOnRoof from "@/public/en/images/photovoltaicPage/photovoltaicPage-bot-center.jpeg";
import batteriesInstall from "@/public/en/images/photovoltaicPage/photovoltaicPage-bot-right.png";

const ImageCarousel = () => {
  return (
    <div>
    <Carousel>
      <div>
        <Image src={batteriesOnTheField} alt="Batteries on the field" width={300} height={300}/>
      </div>
      <div>
        <Image src={batteriesOnSunset} alt="Batteries on sunset" width={300} height={300}/>
      </div>
      <div>
        <Image src={batteriesOnRoof} alt="Batteries on roof" width={300} height={300}/>
      </div>
      <div>
        <Image src={batteriesInstall} alt="Batteries installation" width={300} height={300}/>
      </div>
    </Carousel>
    </div>
  );
};

export default ImageCarousel;