Initial attempt at a code splitted syntax highligher

[soupaJ]

Description

This is my initial attempt at adding syntax highlighting. I had a few goals in mind while developing:

1. Bundle size should not increase for documents that don't contain code blocks.
2. For code blocks, only download the required language packs.
3. Try to support many languages. While looking for a syntax highlighter, I found several for JS and TS, but not many for multiple languages. I landed on Codemirror v6 which seemed to work pretty good out of the box with a few tweaks as well as working on mobile.
4. Find a theme that matches Gistdoc styling. After a little bit of discussion, we landed on a theme that closely matches the Nord theme.

In order to use Suspense for lazy loading the syntax highlighter with a fallback, I needed to update to React v18 which also required updating Next.js to the latest.

NOTE: This does not include the line highlighting feature through the markdown metadata yet. I'll add that in a separate PR.

Screenshots

Here's an example of the theme

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
gistdoc	✅ Ready (Inspect)	Visit Preview	Jul 1, 2022 at 3:13AM (UTC)

[jkulton]

This looks great, thanks @soupaJ! Just left a few comments, nothing to change really.

[jkulton]

Added to the changelog here! 🎉