Module not found: Error: Can't resolve 'tabbable'

Question

I am getting an error that tabbable module not found while integrating @material-tailwind/react in my react app. Here are details of my project:

node: 16.20.2

react: 18.2.0

@material-tailwind/react: 2.1.5

tailwindcss: 3.3.5

my tailwind.config.js

/** @type {import('tailwindcss').Config} */
const withMT = require("@material-tailwind/react/utils/withMT");


module.exports = withMT({
  content: [
    './src/**/*.{js,jsx,ts,tsx}',
  ],
  fontFamily: {
    gilroy: ['Gilroy', 'sans-serif'],
  },
  theme: {
    extend: {},
  },
  plugins: []
});

my component

import React from 'react';
import {Accordion, AccordionHeader, AccordionBody } from "@material-tailwind/react";


export default function ContentAccordion(props) {
  const topics = props.topics || [];
  const [open, setOpen] = React.useState(1);
  const handleOpen = (value) => setOpen(open === value ? 0 : value);

  return (
    <>
      {topics.map((topic, index) => (
      <Accordion open={open === (index+1)}>
        <AccordionHeader onClick={() => handleOpen(1)}>{topic.name}</AccordionHeader>
        <AccordionBody>
          We&apos;re not always in the position that we want to be at. We&apos;re constantly
          growing. We&apos;re constantly making mistakes. We&apos;re constantly trying to express
          ourselves and actualize our dreams.
        </AccordionBody>
      </Accordion>
      ))}
    </>
  )
};

I have tried to delete my node_mobules folder and re-install all the packages. But it didn't work too. Thus, I cant use components of @material-tailwind/react. Please help me if I am missing anything here