From e8e1d93c0de6d4e8aeeb66189527f60edc998b7a Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 9 Aug 2024 17:56:31 +0800 Subject: [PATCH 1/3] Update to new shiki token names --- .changeset/quick-ads-exercise.md | 10 +++++++++ packages/markdown/remark/src/shiki.ts | 30 --------------------------- 2 files changed, 10 insertions(+), 30 deletions(-) create mode 100644 .changeset/quick-ads-exercise.md diff --git a/.changeset/quick-ads-exercise.md b/.changeset/quick-ads-exercise.md new file mode 100644 index 000000000000..51a343536284 --- /dev/null +++ b/.changeset/quick-ads-exercise.md @@ -0,0 +1,10 @@ +--- +'@astrojs/markdown-remark': major +--- + +Renames the CSS variables theme color token names to better align with the Shiki v1 defaults: + +- `--astro-code-color-text` => `--astro-code-foreground` +- `--astro-code-color-background` => `--astro-code-background` + +You can perform a global find and replace in your project to migrate to the new token names. diff --git a/packages/markdown/remark/src/shiki.ts b/packages/markdown/remark/src/shiki.ts index fa29c9c06a1f..27b54f7bd68d 100644 --- a/packages/markdown/remark/src/shiki.ts +++ b/packages/markdown/remark/src/shiki.ts @@ -5,7 +5,6 @@ import { getHighlighter, isSpecialLang, } from 'shiki'; -import { visit } from 'unist-util-visit'; import type { ShikiConfig } from './types.js'; export interface ShikiHighlighter { @@ -23,16 +22,6 @@ export interface ShikiHighlighter { ): Promise; } -// TODO: Remove this special replacement in Astro 5 -const ASTRO_COLOR_REPLACEMENTS: Record = { - '--astro-code-foreground': '--astro-code-color-text', - '--astro-code-background': '--astro-code-color-background', -}; -const COLOR_REPLACEMENT_REGEX = new RegExp( - `${Object.keys(ASTRO_COLOR_REPLACEMENTS).join('|')}`, - 'g' -); - let _cssVariablesTheme: ReturnType; const cssVariablesTheme = () => _cssVariablesTheme ?? @@ -145,21 +134,6 @@ export async function createShikiHighlighter({ return node.children[0] as typeof node; } }, - root(node) { - if (Object.values(themes).length) { - return; - } - - const themeName = typeof theme === 'string' ? theme : theme.name; - if (themeName === 'css-variables') { - // Replace special color tokens to CSS variables - visit(node as any, 'element', (child) => { - if (child.properties?.style) { - child.properties.style = replaceCssVariables(child.properties.style); - } - }); - } - }, }, ...transformers, ], @@ -171,7 +145,3 @@ export async function createShikiHighlighter({ function normalizePropAsString(value: Properties[string]): string | null { return Array.isArray(value) ? value.join(' ') : (value as string | null); } - -function replaceCssVariables(str: string) { - return str.replace(COLOR_REPLACEMENT_REGEX, (match) => ASTRO_COLOR_REPLACEMENTS[match] || match); -} From c103bd4abdd22338859a2d059ab448c809038fbb Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 9 Aug 2024 17:58:06 +0800 Subject: [PATCH 2/3] Update test --- packages/astro/test/astro-component-code.test.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/astro/test/astro-component-code.test.js b/packages/astro/test/astro-component-code.test.js index 3e5bf5d9e3a6..80707f52dea8 100644 --- a/packages/astro/test/astro-component-code.test.js +++ b/packages/astro/test/astro-component-code.test.js @@ -88,12 +88,12 @@ describe('', () => { .map((i, f) => (f.attribs ? f.attribs.style : 'no style found')) .toArray(), [ - 'background-color:var(--astro-code-color-background);color:var(--astro-code-color-text); overflow-x: auto;', + 'background-color:var(--astro-code-background);color:var(--astro-code-foreground); overflow-x: auto;', 'color:var(--astro-code-token-constant)', 'color:var(--astro-code-token-function)', - 'color:var(--astro-code-color-text)', + 'color:var(--astro-code-foreground)', 'color:var(--astro-code-token-string-expression)', - 'color:var(--astro-code-color-text)', + 'color:var(--astro-code-foreground)', ] ); }); From 0f671624f23bad9cecd5262f73bc22f64c02739b Mon Sep 17 00:00:00 2001 From: Bjorn Lu Date: Fri, 9 Aug 2024 21:43:59 +0800 Subject: [PATCH 3/3] Update .changeset/quick-ads-exercise.md Co-authored-by: Sarah Rainsberger --- .changeset/quick-ads-exercise.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/quick-ads-exercise.md b/.changeset/quick-ads-exercise.md index 51a343536284..dd4285a4cb3b 100644 --- a/.changeset/quick-ads-exercise.md +++ b/.changeset/quick-ads-exercise.md @@ -2,7 +2,7 @@ '@astrojs/markdown-remark': major --- -Renames the CSS variables theme color token names to better align with the Shiki v1 defaults: +Renames the following CSS variables theme color token names to better align with the Shiki v1 defaults: - `--astro-code-color-text` => `--astro-code-foreground` - `--astro-code-color-background` => `--astro-code-background`