Support for rendering inside a custom component

[manvydasu]

Goal

I'd like to write MDX file, which contains code examples for multiple languages. In order to reduce amount of space taken by code examples, it would be nice to have dropdown/switch component for toggling between languages. Example screenshot taken from geeksforgeeks

Problem

As far as I understand, rehype-pretty-code can't currently be used to achieve that as it only exposes a function, which is a a rehype plugin and it can't be used inside a react component.

[Hi2885]

Problem

As far as I understand, rehype-pretty-code can't currently be used to achieve that as it only exposes a function, which is a a rehype plugin and it can't be used inside a react component.

[o-az]

Goal

I'd like to write MDX file, which contains code examples for multiple languages. In order to reduce amount of space taken by code examples, it would be nice to have dropdown/switch component for toggling between languages. Example screenshot taken from geeksforgeeks

Problem

As far as I understand, rehype-pretty-code can't currently be used to achieve that as it only exposes a function, which is a a rehype plugin and it can't be used inside a react component.

You should be able to do this with Astro Starlight using tabs https://starlight.astro.build/guides/components/#tabs

rehype-pretty-code works well with Astro in general https://github.com/atomiks/rehype-pretty-code/tree/master/examples/astro