Typed props

[dimaip]

Hey, just a random feature idea.

I'm using MDX to build email templates. I have a few hundred of those.
For each template, I define an interface for props which can be injected into the template.
It would be great if there was a way to lint the templates and somehow specify the TS types of props for the particular template.

Yeah, TS really spoiled us.

[remcohaszing]

Great idea! Which is why I implemented this as part of the experimental MDX IntelliSense 😁

[dimaip]

Wow, that's amazing, thanks so much for the hint!
But is it possible to declare the type for props outside the mdx template, as a normal TS file that exports a certain type (e.g. Props)?
I want to be able to use this type outside the template, too, when assigning the props.

[remcohaszing]

It supports anything that’s supported by TypeScript in JSDoc. You just need to define the Props type. So you can do something like:

// types.ts
export interface MyMdxProps {
  name: string
}

{/* your-mdx-document.mdx */}
{/**
  * @typedef {@import('./types.js').MyMdxProps} Props
  */}