Extending props in MDX file with `mdx.checkMdx`

[karlhorky]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Not sure if this is a bug report or a feature request:

Problem

Using custom props in .mdx files while using mdx.checkMdx = true in tsconfig.json results in an error from MDX Analyzer:

Property 'params' does not exist on type '{ readonly components?: {} | undefined; }'. ts-plugin(2339)

Diving into the types in @types/mdx/index.d.ts and @types/mdx/types.d.ts, it seems like there may be a possibility to do some kind of interface declaration merging of MDXProps:

/**
 * The props that may be passed to an MDX component.
 */
export interface MDXProps {
    /**
     * Which props exactly may be passed into the component depends on the contents of the MDX
     * file.
     */
    [key: string]: unknown;

    /**
     * This prop may be used to customize how certain components are rendered.
     */
    components?: MDXComponents;
}

But my attempts have failed, maybe I'm doing something wrong or this isn't the recommended way of typing props:

declare module 'mdx/types' {
  interface MDXProps {
    components?: MDXComponents;
    params: {
      cohortSlug: string;
    };
  }
}

Solution

Some way to type the props of:

1. All MDX files
2. A specific MDX file

Alternatives

Patching the @types/mdx type definitions to add my own props to all MDX components

[karlhorky]

Ah, seems like this is mentioned under the Props section in the readme (first checked the MDX docs, was not aware of the MDX Analyzer readme):

{/**
  * @typedef Props
  * @property {{cohortSlug: string}} params
  *   Params object from Next.js
  */}

[github-actions]

Hi! This was closed. Team: If this was fixed, please add phase/solved. Otherwise, please add one of the no/* labels.