MDX not parsing tables but also not rendering via component tag

[landed1]

Summary

I am using MDX files for content for a static site. The files sit in a folder and I am using a utility function along with compileMDX.
`export async function parseMdxFile(filePath: string) {
try {
const source = await fs.promises.readFile(filePath, 'utf8')

const { frontmatter, content } = await compileMDX<MdxFrontmatter>({
  source,
  options: {
    parseFrontmatter: true,
      remarkPlugins: [remarkGfm],
      format: 'mdx',
  }
})

return {
  ...frontmatter,
  slug: path.basename(filePath, '.mdx'),
  content
}

Trying to use like this

<article className='prose max-w-none'>
<MDXRemote source={content} />
<h2>Raw content below works but TABLE md not parsed</h2>
<div>{content}</div>
</article>

Additional information

I have checked most of the bugs and related things I can see online. 
Some things which helped get mdx working
mdx-components.tsx in the root folder not app!
delete .next folder
Adding the correct next config to support MDX
The remarkGFM plugin doesn't work so I see the md table content not the html. because I could use <div>{content}</div> as this seems to work ok. I also get my front matter ok and so the issues are just the <MDXRemote source={content} /> and table parsing.

Thank you for help my package:
  "dependencies": {
    "@mdx-js/loader": "^3.1.0",
    "@mdx-js/mdx": "2.0.0-rc.2",
    "@mdx-js/react": "2.0.0-rc.2",
    "@next/mdx": "^15.0.4",
    "@nextui-org/react": "^2.6.4",
    "@types/mdx": "^2.0.13",
    "contentlayer": "^0.3.4",
    "date-fns": "^4.1.0",
    "framer-motion": "^11.13.1",
    "gray-matter": "^4.0.3",
    "mdx-bundler": "^10.0.3",
    "next": "15.0.4",
    "next-mdx-remote": "^5.0.0",
    "next-seo": "^6.6.0",
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "rehype-stringify": "^10.0.1",
    "remark-gfm": "3.0.1",
    "remark-rehype": "^11.1.1"
  },

Example

No response

[myudak]

EXACT SAME ISSUE