use jsxImportSource types if available

[souporserious]

Initial checklist

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

Affected package

vscode-mdx

Steps to reproduce

• Use a library that makes use of jsxImportSource, like restyle.
• Once jsxImportSource is configured, add an MDX file that has an element with the css prop e.g. <div css={{ color: 'tomato' }} />
• The VS Code extension will not recognize the types and will error when trying to use the css prop.

Actual behavior

When using the css prop from restyle in this case, it will error incorrectly. The functionality works as expected, but there is a type error because the extension doesn't recognize the css element prop is ok:

Expected behavior

Similar to how ts/tsx files will pick up the types if jsxImportSource is configured, it would be great if the VS Code extension could load the related types as well.

Runtime

No response

Package manager

No response

Operating system

No response

Build and bundle tools

No response

[remcohaszing]

It respects TypeScript’s jsxImportSource in tsconfig.json. Are you seeing something else? If so, please provide a reproduction.

[souporserious]

Interesting, yeah it doesn't seem to get recognized for me, at least in a Next.js repo with MDX and jsxImportSource configured. I made a minimal reproduction here. I'm using v1.8.13 of the MDX VS Code extension and Node v21.2.0.

[remcohaszing]

That project excludes MDX files from the TypeScript program by specifying an include pattern that doesn’t include MDX. As a result, MDX files are part of the default TypeScript program created by the language server. This defaults to the jsxImportSource value react.

The best thing to do here is to remove the include and exclude options from tsconfig.json. However I am aware Next.js will add back these bad defaults.

The alternative solution is to add **/* (preferred) or **/*.mdx to the include array.

[github-actions]

Hi! Thanks for reaching out! Because we treat issues as our backlog, we close issues that are questions since they don’t represent a task to be completed.

See our support docs for how and where to ask questions.

Thanks,
— bb

[souporserious]

I see, apologies for filing an issue, didn't realize it was using a different configuration 😅. Thank you for the help!