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)

Affected packages and versions

^2.1.2"

Link to runnable example

https://stackblitz.com/github/bholmesdev/mdx-shiki-compilation?file=test.mjs

Steps to reproduce

1. Run the MDX compiler with the rehypeRaw plugin applied + some other plugin that inserts a custom element (Shiki twoslash in this case).
2. Set jsx: true in the compiler config
3. Note the value contains <_components.custom-element-name> in the output, but dashes (-) are not valid JSX!

Expected behavior

Ideally, the _components statement would serialize dashes to camelCase or some other JSX-compliant string like so:

const _components = Object.assign({ ... "customElementName": "custom-element-name" }, props.components);

Actual behavior

Instead, _components uses the element name untouched:

const _components = Object.assign({ ... "custom-element-name": "custom-element-name" }, props.components);

Runtime

Node v16

Package manager

pnpm

OS

macOS

Build and bundle tools

Other (please specify in steps to reproduce)