[Feature Request]: Update CodeSnippet syntax highlighting example

[tay1orjones]

The problem

The example codepen we link to on the website showing an example of using PrismJS to add syntax highlighting to CodeSnippet is out of date. It uses v10 bx classes and just generally doesn't match the look and feel or experience that we're delivering on the website, in storybook, example stackblitz's, etc.

The solution

Make a new stackblitz example that demonstrates how to add PrismJS syntax highlighting to the CodeSnippet.

This will probably involve:

• [ ] Setting up a new vite project in the examples directory
• [ ] Use React to render a hunk of javascript code in a template literal inside CodeSnippet that has been formatted using prettier, and had all html entities/characters escaped, like <,>, etc.
• [ ] Include PrismJS from a CDN (unpkg or something) will probably be easiest, though we could add it as a dep if preferred
• [ ] Configure the syntax theme to be similar/the same as what's being used on the website/gatsby theme
• [ ] Optionally: update documentation providing an example of this syntax theme we use, but with disclaimers - it's only a place to start, only works in one theme, should be assessed for accessibility in your product, etc.
• [ ] Update the link on the website to point to the new stackblitz example

Examples

https://codepen.io/team/carbon/pen/eKMBLw

[github-actions[bot]]

Thank you for submitting a feature request. Your proposal is open and will soon be triaged by the Carbon team.

If your proposal is accepted and the Carbon team has bandwidth they will take on the issue, or else request you or other volunteers from the community to work on this issue.

[sstrubberg]

Simple fix would be to update the codepen to v11