diff options
Diffstat (limited to 'packages/integrations/mdx')
| -rw-r--r-- | packages/integrations/mdx/package.json | 2 | ||||
| -rw-r--r-- | packages/integrations/mdx/src/remark-shiki.ts | 20 | ||||
| -rw-r--r-- | packages/integrations/mdx/test/mdx-syntax-highlighting.test.js | 2 |
3 files changed, 22 insertions, 2 deletions
diff --git a/packages/integrations/mdx/package.json b/packages/integrations/mdx/package.json index 6f3cad30d..c801d674e 100644 --- a/packages/integrations/mdx/package.json +++ b/packages/integrations/mdx/package.json @@ -44,7 +44,7 @@ "remark-frontmatter": "^4.0.1", "remark-gfm": "^3.0.1", "remark-smartypants": "^2.0.0", - "shiki": "^0.11.1", + "shiki": "^0.14.1", "source-map": "^0.7.4", "unist-util-visit": "^4.1.0", "vfile": "^5.3.2" diff --git a/packages/integrations/mdx/src/remark-shiki.ts b/packages/integrations/mdx/src/remark-shiki.ts index d4620194c..3f3310de7 100644 --- a/packages/integrations/mdx/src/remark-shiki.ts +++ b/packages/integrations/mdx/src/remark-shiki.ts @@ -10,7 +10,27 @@ import { visit } from 'unist-util-visit'; */ const highlighterCacheAsync = new Map<string, Promise<shiki.Highlighter>>(); +// Map of old theme names to new names to preserve compatibility when we upgrade shiki +const compatThemes: Record<string, string> = { + 'material-darker': 'material-theme-darker', + 'material-default': 'material-theme', + 'material-lighter': 'material-theme-lighter', + 'material-ocean': 'material-theme-ocean', + 'material-palenight': 'material-theme-palenight', +}; + +const normalizeTheme = (theme: string | shiki.IShikiTheme) => { + if (typeof theme === 'string') { + return compatThemes[theme] || theme; + } else if (compatThemes[theme.name]) { + return { ...theme, name: compatThemes[theme.name] }; + } else { + return theme; + } +}; + const remarkShiki = async ({ langs = [], theme = 'github-dark', wrap = false }: ShikiConfig) => { + theme = normalizeTheme(theme); const cacheID: string = typeof theme === 'string' ? theme : theme.name; let highlighterAsync = highlighterCacheAsync.get(cacheID); if (!highlighterAsync) { diff --git a/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js b/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js index d420faabc..40281cffd 100644 --- a/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js +++ b/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js @@ -25,7 +25,7 @@ describe('MDX syntax highlighting', () => { const shikiCodeBlock = document.querySelector('pre.astro-code'); expect(shikiCodeBlock).to.not.be.null; - expect(shikiCodeBlock.getAttribute('style')).to.contain('background-color:#0d1117'); + expect(shikiCodeBlock.getAttribute('style')).to.contain('background-color:#24292e'); }); it('respects markdown.shikiConfig.theme', async () => { |