Nextjs 14 with App router issue with meta on MDX

Question

I'm trying to fill some data based on the content of meta object inside MDX, but I can't get that info from layout component.

As title says, I'm using NextJS with App router.

---

I'm working on a design system doc site, and I want to have a layout to use on all the pages of the components docs (similar to Paste

I have a layout.tsx file, and inside each folder, I have a page.mdx file with the actual content and a meta object.

This is the layout.tsx file

'use client'

export const Layout = ({
  children,
  meta,
}: {
  children: React.ReactNode
  meta: { title: string; description: string }
}) => {
  console.log(children, meta)

  return (
    <div className="layout">
      <h1>{meta.title}</h1>
      <div className="layout__content">{children}</div>
    </div>
  )
}

export default Layout

This is the page.mdx I'm trying to render.

import {Layout} from '../../components/layout-test'

export const meta = {
  title: 'Layout',
  description: 'Layout',
}

export default Layout

This is a brief description of the component that will be displayed in the documentation.

Layout is applied (I see the dom structure from the layout file) but I couldn't find a way to access meta content.

If I manually import the MDX file into the layout, meta is available, but my idea is to skip the manual importation (and repetition).

Any help on this?

Basic example

https://replit.com/@dev181/Nextjs-layout-MDX