Compatibility issue between @mdx-js/react v3.0.0 and mdx-embed v1.1.2 in gatsby-plugin-mdx v4

[vannyle]

Is your feature request related to a problem? Please describe. Yes, I've recently updated gatsby-plugin-mdx to version 4 and encountered a dependency conflict between @mdx-js/react and mdx-embed. When attempting to install mdx-embed alongside the latest version of gatsby-plugin-mdx, npm throws an ERESOLVE error, indicating an inability to resolve the dependency tree.

Error log:

$ npm install mdx-embed gatsby-plugin-mdx-embed
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: @mdx-js/[email protected]
npm ERR! node_modules/@mdx-js/react
npm ERR!   @mdx-js/react@"^3.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @mdx-js/react@"^1.6.16" from [email protected]
npm ERR! node_modules/mdx-embed
npm ERR!   mdx-embed@"*" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! 
npm ERR! For a full report see:
npm ERR! /Users/user/.npm/_logs/2023-11-27T13_28_07_570Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: /Users/user/.npm/_logs/2023-11-27T13_28_07_570Z-debug-0.log

Describe the solution you'd like An update or a workaround that would resolve this dependency conflict. Ideally, mdx-embed should be compatible with the latest versions of @mdx-js/react.

Describe alternatives you've considered I've considered using --force or --legacy-peer-deps flags to bypass the conflict, but this might lead to unstable and potentially broken dependencies. Another option could be to fork mdx-embed and update the peer dependencies myself, but I would prefer an official update for stability and future compatibility.

Additional context N/A