mdx-editor/editor ? reverse-engineered prompt

Build me a polished React markdown editor component that feels natural like editing in Google Docs or Notion, but for markdown and MDX. I want a reusable editor I can drop into an app, with support for normal markdown, headings, tables, images, code blocks, and basic rich text behavior. It should also let me edit JSX components, either with a built in JSX editor or a way to plug in my own.

Please make it look clean, work well with TypeScript, and include a simple example page so I can try it right away. If you need to check current docs or best practices for anything, feel free to look them up online. Keep the setup straightforward and make sure the editor is easy to customize and extend.