Code block syntax highlighting not working for vue block in MDX

[messenjer]

Is your feature request related to a problem? Please describe.

Currently, when I add a code block in an .mdx file and specify the vue language, the code is not syntax highlighted as expected. This affects readability for Vue code snippets in documentation.

Describe the solution you'd like

Support for Vue syntax highlighting was added in version 15.6.0 of react-syntax-highlighter. Updating to this version and adding the vue language to the supported languages list should resolve the issue.

Steps to Reproduce

1. Create an .mdx file with a Vue code block.

   ```vue
   <template>
     <div>Hello World</div>
   </template>

2. View the file in Storybook.

Environment

• Storybook version: 8.4.2
• react-syntax-highlighter version: 15.4.3

Proposed Solution

1. Update react-syntax-highlighter to version 15.6.0 to enable Vue syntax highlighting. https://github.com/react-syntax-highlighter/react-syntax-highlighter/releases/tag/v15.6.0
2. Add vue to the supported languages in the file storybook/code/core/src/components/syntaxhighlighter/syntaxhighlighter.tsx.

Describe alternatives you've considered

Migrate to Shiki : #29160

Are you able to assist to bring the feature to reality?

yes, I can

Additional context

No response