The same as Type '{ children: Element[]; className: string; }' is missing the following properties from type 'Pick<MenuItemProps & ButtonHTMLAttributes<HTMLButtonElement>, "type" | "key" | "id" | "name" | "color" | "translate" | ... 262 more ... | "onResizeCapture">': nonce, onResize, onResizeCapture #379 with Typography, Card, CardHeader

[michaelaboctario]

I have this:
"dependencies": {
"@heroicons/react": "^2.1.5",
"@material-tailwind/react": "^2.1.10",
"next": "14.2.13",
"react": "^18.2.0",
"react-dom": "^18"
},
"devDependencies": {
"@types/node": "^20",
"@types/react": "^18.2.21",
"@types/react-dom": "^18",
"eslint": "^8",
"eslint-config-next": "14.2.13",
"postcss": "^8",
"tailwindcss": "^3.4.1",
"typescript": "^5.2.2"
}

and
.....

is doing

Type '{ children: string; color: "blue-gray"; className: string; }' is missing the following properties from type 'Pick<TypographyProps, "suppressHydrationWarning" | "className" | "color" | "id" | "lang" | "media" | "style" | "target" | "type" | "role" | "tabIndex" | "href" | ... 257 more ... | "ping">': placeholder, onPointerEnterCapture, onPointerLeaveCapture

Try to use MaterialTailwind with Nextjs.

[Angelgamonal]

Hi, I suggest checking out discussion #651 . You'll find several possible solutions there

[michaelaboctario]

Hi, thanks you.
As in discussion #651, using "@types/react": "18.2.39" works for me.

[n-devr]

+1 for "@types/react": "18.2.39" resolving the issue.

I had a newer version of @types/react (18.3.12) and had to downgrade to get rid of the error.

[risqiromadhoni]

I have this: "dependencies": { "@heroicons/react": "^2.1.5", "@material-tailwind/react": "^2.1.10", "next": "14.2.13", "react": "^18.2.0", "react-dom": "^18" }, "devDependencies": { "@types/node": "^20", "@types/react": "^18.2.21", "@types/react-dom": "^18", "eslint": "^8", "eslint-config-next": "14.2.13", "postcss": "^8", "tailwindcss": "^3.4.1", "typescript": "^5.2.2" }

and .....

is doing

Type '{ children: string; color: "blue-gray"; className: string; }' is missing the following properties from type 'Pick<TypographyProps, "suppressHydrationWarning" | "className" | "color" | "id" | "lang" | "media" | "style" | "target" | "type" | "role" | "tabIndex" | "href" | ... 257 more ... | "ping">': placeholder, onPointerEnterCapture, onPointerLeaveCapture

Try to use MaterialTailwind with Nextjs.

"devDependencies": {
   "@types/react": "^18.3.12",
},
"resolutions": {
   "@types/react": "18.2.39"
},

In my case i can use resolutions to fix error, so i can use both version (latest and 18.2.39) on my app