Apply custom theme to mdx

[nrakochy]

I am having a bit of trouble applying a custom theme to mdx. The generated Docs tab works as expected on the components with Stories csf format, but mdx only is not applying the theme. I have attempted multiple variations of the sb documentation. What might I be missing? Appreciate any help.

Output

Here you can see the text is the wrong color, code source is off, etc.

Expected Output (which applies even on the Show Code bit)

Here's an example .mdx which does not take the theme. Tried with both regular md inside of mdx as well as Source component

import { ArgsTable, Meta, Story } from "@storybook/addon-docs";
import { Source } from "@storybook/addon-docs";
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";

import dedent from "ts-dedent";

## How to create new Storybook entries?

Storybook creation has been simplified. 

```js
const argTypes = {};
...Implementation details...

\```

## Helpful FAQ here

Detailed information

<Source
    language="tsx"
    code={dedent`type CustomProps = {
    // Remove before rendering
    $someExampleType: boolean
    // Send to the DOM
    active: boolean;
};`}
/>

Here's the usage in preview.js that works as expected for .stories.tsx

import { dark as theme } from "./theme";

export const decorators = [];
export const parameters = {
    docs: {
        theme
    },
    actions: { argTypesRegex: "^on.*" }
};

[SeanCox]

If you are also using MUI I found #25134 helpful.