Estoy usando chakraUI en mi proyecto de reacción y recibo el siguiente error:

 chakra-ui-checkbox.esm.js:146 Uncaught TypeError: framer_motion__WEBPACK_IMPORTED_MODULE_5__.motion.custom is not a function at Module../node_modules/@chakra-ui/checkbox/dist/chakra-ui-checkbox.esm.js (chakra-ui-checkbox.esm.js:146:1) at Module.options.factory (react refresh:6:1) at __webpack_require__ (bootstrap:24:1) at fn (hot module replacement:62:1) at Module../node_modules/@chakra-ui/react/dist/chakra-ui-react.esm.js (chakra-ui-react-utils.esm.js:91:1) at Module.options.factory (react refresh:6:1) at __webpack_require__ (bootstrap:24:1) at fn (hot module replacement:62:1) at Module../src/App.js (bundle.js:18:74) at Module.options.factory (react refresh:6:1)

Así es como usé esto en mi archivo app.js

 import Navbar from "./components/navbar/navbar"; import { useState } from "react"; import { ChakraProvider } from "@chakra-ui/react"; import theme from "./theme"; function App() { const [isMenuOpen, setIsMenuOpen] = useState(false); return ( <div> <ChakraProvider> <Navbar isMenuOpen={isMenuOpen} setIsMenuOpen={setIsMenuOpen} /> </ChakraProvider> </div> ); } export default App;

Aquí está mi archivo package.json

 "dependencies": { "@chakra-ui/react": "^1.8.7", "@emotion/react": "^11.8.2", "@emotion/styled": "^11.8.1", "@testing-library/jest-dom": "^5.16.3", "@testing-library/react": "^12.1.4", "@testing-library/user-event": "^13.5.0", "framer-motion": "^6.2.8", "react": "^18.0.0", "react-dom": "^18.0.0", "react-scripts": "5.0.0", "web-vitals": "^2.1.4" },

Aquí hay una de las soluciones, pero pensé que este problema estaba solucionado. Entonces, ¿cuál es el problema con mi código? ¿Puede ayudarme alguien, por favor?