Add hippo recommends
This commit is contained in:
parent
9ff7919bfc
commit
9110c2e5cf
|
@ -4,6 +4,7 @@ import { ExpressiveCode, loadShikiTheme, type BundledShikiTheme, ExpressiveCodeT
|
||||||
import { toHtml } from 'hast-util-to-html'
|
import { toHtml } from 'hast-util-to-html'
|
||||||
import fs from 'node:fs'
|
import fs from 'node:fs'
|
||||||
import config from "virtual:astro-gists/config";
|
import config from "virtual:astro-gists/config";
|
||||||
|
import { getPageData } from './page-data'
|
||||||
|
|
||||||
const jsoncString = fs.readFileSync(new URL(`../themes/houston.jsonc`, import.meta.url), 'utf-8')
|
const jsoncString = fs.readFileSync(new URL(`../themes/houston.jsonc`, import.meta.url), 'utf-8')
|
||||||
const houston = ExpressiveCodeTheme.fromJSONString(jsoncString)
|
const houston = ExpressiveCodeTheme.fromJSONString(jsoncString)
|
||||||
|
@ -14,6 +15,12 @@ const { code, raw_url, locale,
|
||||||
lang = '', meta = '', ...props
|
lang = '', meta = '', ...props
|
||||||
} = Astro.props
|
} = Astro.props
|
||||||
|
|
||||||
|
const pageData = getPageData(Astro.request)
|
||||||
|
// Note: It's important to store the incremented index in a local variable immediately,
|
||||||
|
// as the `pageData` object is shared between all components on the current page
|
||||||
|
// and can be changed by other Code components during the `await` calls below
|
||||||
|
const groupIndex = ++pageData.blockGroupIndex
|
||||||
|
|
||||||
const engine = new ExpressiveCode({
|
const engine = new ExpressiveCode({
|
||||||
themes: [theme ? await loadShikiTheme(theme as BundledShikiTheme) : houston],
|
themes: [theme ? await loadShikiTheme(theme as BundledShikiTheme) : houston],
|
||||||
plugins: [pluginLineNumbers()],
|
plugins: [pluginLineNumbers()],
|
||||||
|
@ -24,12 +31,18 @@ const themeStyles = await engine.getThemeStyles();
|
||||||
const jsModules = await engine.getJsModules();
|
const jsModules = await engine.getJsModules();
|
||||||
|
|
||||||
const { renderedGroupAst, styles } = await engine.render({
|
const { renderedGroupAst, styles } = await engine.render({
|
||||||
language: lang, meta, locale, code, props, })
|
language: lang, meta, locale, code,
|
||||||
|
parentDocument: {
|
||||||
|
positionInDocument: { groupIndex,},
|
||||||
|
},
|
||||||
|
props, })
|
||||||
|
|
||||||
let htmlContent = toHtml(renderedGroupAst)
|
let htmlContent = toHtml(renderedGroupAst)
|
||||||
|
|
||||||
const stylesToPrepend: string[] = []
|
const stylesToPrepend: string[] = []
|
||||||
stylesToPrepend.push(baseStyles, themeStyles, ...styles)
|
const gistBaseStyles = baseStyles.replace(/\.expressive-code/g, '.gist .expressive-code')
|
||||||
|
const gistThemeStyles = themeStyles.replace(/\.expressive-code/g, '.gist .expressive-code')
|
||||||
|
stylesToPrepend.push(gistBaseStyles, gistThemeStyles, ...styles)
|
||||||
if (stylesToPrepend.length) {
|
if (stylesToPrepend.length) {
|
||||||
htmlContent = `<style>${[...stylesToPrepend].join('')}</style>${htmlContent}`
|
htmlContent = `<style>${[...stylesToPrepend].join('')}</style>${htmlContent}`
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,18 @@
|
||||||
|
export type PageData = {
|
||||||
|
url: string
|
||||||
|
blockGroupIndex: number
|
||||||
|
}
|
||||||
|
|
||||||
|
const pageDataMap = new Map<Request, PageData>()
|
||||||
|
|
||||||
|
export function getPageData(request: Request): PageData {
|
||||||
|
let data = pageDataMap.get(request)
|
||||||
|
if (!data) {
|
||||||
|
data = {
|
||||||
|
url: request.url,
|
||||||
|
blockGroupIndex: -1,
|
||||||
|
}
|
||||||
|
pageDataMap.set(request, data)
|
||||||
|
}
|
||||||
|
return data
|
||||||
|
}
|
Loading…
Reference in New Issue