feat: shiki transformers support

[aidenybai]

Shiki has the transformers API and the @shikijs/transformers package. These transformers contain a lot of useful utilities (such as highlight) that would be amazing to have. I wrote a pnpm patch to try and add it, but it didn't seem to work:

/patches/[email protected]

diff --git a/dist/core.mjs b/dist/core.mjs
index 13943e61abccc2b932fe40314014c3ceb856ceaf..b0f25036385759029c5f70ef4743d6f1eb1df7e6 100644
--- a/dist/core.mjs
+++ b/dist/core.mjs
@@ -1,6 +1,7 @@
 import { diff } from 'diff-match-patch-es';
 import { hash } from 'ohash';
 
+import {transformerNotationHighlight} from "@shikijs/transformers"
 function createMagicMoveMachine(codeToKeyedTokens2, options = {}) {
   const EMPTY = toKeyedTokens("", []);
   let previous = EMPTY;
@@ -30,7 +31,7 @@ function createMagicMoveMachine(codeToKeyedTokens2, options = {}) {
   };
 }
 function codeToKeyedTokens(highlighter, code, options, lineNumbers = false) {
-  const result = highlighter.codeToTokens(code, options);
+  const result = highlighter.codeToTokens(code,  {... options, transformers: [transformerNotationHighlight()] });
   return {
     ...toKeyedTokens(
       code,

[antfu]

This is pretty tricky, as magic-move is based on the highlighted tokens, but not the hast (in a way, say it runs before transformers). I am not sure if refactor this into hast-based would be possible - but before that happens, I'd say currently it's a limitation that magic-move doesn't work well with transformers.

[elwyn-de-neve]

Hi Antfu, isn't this already featured in Sli.dev?