Update AstroGist theme and code block configuration
This commit is contained in:
parent
b788158a87
commit
363ef40442
|
@ -55,8 +55,8 @@ import { defineConfig } from "astro/config";
|
||||||
// https://astro.build/config
|
// https://astro.build/config
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
+ integrations: [astroGist({
|
+ integrations: [astroGist({
|
||||||
// This is the default options shown... dark is Astro's Houston-dark, and light is currently nightowl-light until a Houston-light is released.
|
// Allows you to set the default theme
|
||||||
theme: ['astroGists-dark', 'astroGists-light']
|
theme: ['catppuccin-macchiato']
|
||||||
+ })]
|
+ })]
|
||||||
});
|
});
|
||||||
```
|
```
|
||||||
|
|
|
@ -1,11 +1,15 @@
|
||||||
import { pluginLineNumbers } from '@expressive-code/plugin-line-numbers'
|
import { pluginLineNumbers } from '@expressive-code/plugin-line-numbers'
|
||||||
import { ExpressiveCode } from 'expressive-code'
|
import { ExpressiveCode, loadShikiTheme, type BundledShikiTheme } from 'expressive-code'
|
||||||
// import config from "virtual:astro-gists/config";
|
import config from "virtual:astro-gists/config";
|
||||||
// import { loadTheme } from "./theming";
|
|
||||||
|
|
||||||
export { default as Code } from './components/Code.astro'
|
export { default as Code } from './components/Code.astro'
|
||||||
|
|
||||||
export const engine = new ExpressiveCode({
|
export const engine = new ExpressiveCode({
|
||||||
//themes: await loadTheme(config.theme),
|
themes: [
|
||||||
|
config.theme ?
|
||||||
|
await loadShikiTheme(config.theme as BundledShikiTheme) :
|
||||||
|
await loadShikiTheme('catppuccin-macchiato'), await loadShikiTheme('catppuccin-latte')
|
||||||
|
],
|
||||||
plugins: [pluginLineNumbers()],
|
plugins: [pluginLineNumbers()],
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
@ -1,39 +0,0 @@
|
||||||
import { ExpressiveCodeTheme, loadShikiTheme, type BundledShikiTheme } from 'expressive-code'
|
|
||||||
import fs from 'node:fs'
|
|
||||||
|
|
||||||
function loadBundledThemeFromFile(theme: string) {
|
|
||||||
return fs.readFileSync(new URL(`./themes/${theme}.jsonc`, import.meta.url), 'utf-8');
|
|
||||||
}
|
|
||||||
|
|
||||||
const houstonDark = loadBundledThemeFromFile('houston-dark');
|
|
||||||
const nightOwlLight = loadBundledThemeFromFile('night-owl-light');
|
|
||||||
|
|
||||||
export type BundledThemeName = 'astroGists-dark' | 'astroGists-light';
|
|
||||||
|
|
||||||
export type ShikiThemeOrBundledThemeName = BundledShikiTheme | BundledThemeName;
|
|
||||||
|
|
||||||
export async function loadTheme(
|
|
||||||
themes: ShikiThemeOrBundledThemeName[] | undefined
|
|
||||||
): Promise<ExpressiveCodeTheme[]> {
|
|
||||||
|
|
||||||
const shikiThemes = themes && !Array.isArray(themes) ? [themes] : themes
|
|
||||||
|
|
||||||
const themesToLoad = (!shikiThemes || !shikiThemes.length) ? ['astroGists-dark', 'astroGists-light'] : shikiThemes;
|
|
||||||
|
|
||||||
const loadedThemes = await Promise.all(
|
|
||||||
themesToLoad.map(async (theme) => {
|
|
||||||
if (theme === 'astroGists-dark' || theme === 'astroGists-light') {
|
|
||||||
const bundledTheme = theme === 'astroGists-dark' ? houstonDark : nightOwlLight;
|
|
||||||
return customizeBundledTheme(ExpressiveCodeTheme.fromJSONString(bundledTheme));
|
|
||||||
}
|
|
||||||
return await loadShikiTheme(theme as BundledShikiTheme);
|
|
||||||
})
|
|
||||||
);
|
|
||||||
|
|
||||||
return loadedThemes;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function customizeBundledTheme(theme: ExpressiveCodeTheme) {
|
|
||||||
return theme;
|
|
||||||
}
|
|
|
@ -4,16 +4,16 @@ export default astroGist;
|
||||||
|
|
||||||
// Export the user config schema
|
// Export the user config schema
|
||||||
import { z } from "astro/zod";
|
import { z } from "astro/zod";
|
||||||
import type { ShikiThemeOrBundledThemeName } from "./ExpressiveCode/theming"
|
import type { BundledShikiTheme } from "expressive-code";
|
||||||
|
|
||||||
export const optionsSchema = z.object({
|
export const optionsSchema = z.object({
|
||||||
/**
|
/**
|
||||||
* Optional: Allows the user to change the default theme for the code blocks.
|
* Optional: Allows the user to change the default theme for the code blocks.
|
||||||
* @default ['astroGist-dark','astroGist-light']
|
* @example ['github-dark']
|
||||||
*
|
*
|
||||||
* All available themes are listed in the [Shiki documentation](https://shiki.matsu.io/docs/themes).
|
* All available themes are listed in the [Shiki documentation](https://shiki.matsu.io/docs/themes).
|
||||||
*/
|
*/
|
||||||
theme: z.custom<ShikiThemeOrBundledThemeName[]>().optional(),
|
theme: z.custom<BundledShikiTheme>().optional(),
|
||||||
});
|
});
|
||||||
|
|
||||||
export type astroGistsUserConfig = z.infer<typeof optionsSchema>
|
export type astroGistsUserConfig = z.infer<typeof optionsSchema>
|
Loading…
Reference in New Issue