Error while using in latest MUI

I am getting the below error using this library in the latest version on mui.

As soon as I add the library and add the below component I get this error.

import React from "react";
import Carousel from "react-material-ui-carousel";
import { Paper, Button } from "@mui/material";

function Example(props) {
  var items = [
    {
      name: "Random Name #1",
      description: "Probably the most random thing you have ever seen!",
    },
    {
      name: "Random Name #2",
      description: "Hello World!",
    },
  ];

  return (
    <Carousel>
      {items.map((item, i) => (
        <Item key={i} item={item} />
      ))}
    </Carousel>
  );
}

function Item(props) {
  return (
    <Paper>
      <h2>{props.item.name}</h2>
      <p>{props.item.description}</p>

      <Button className="CheckButton">Check it out!</Button>
    </Paper>
  );
}

export default Example;

[n-ii-ma]

This package seems to be incompatible with React 18. To fix the problem, add this to your projects package.json file:

"overrides": {
  "react-material-ui-carousel": {
    "react": "^18.0.0",
    "react-dom": "^18.0.0"
  }
}

Be sure to delete your node_modules folder and package-lock.json. Then run npm install to create them again.

[Learus]

Since this seems to be a React 18 issue, I will be closing this. The carousel now supports React 18 from version v3.4.0 onwards.