50 lines
1.5 KiB
TypeScript
50 lines
1.5 KiB
TypeScript
import { generateSrcSet, getNFResize } from '$lib/large-media'
|
|
import Prism from 'prismjs'
|
|
import loadLanguages from 'prismjs/components/index.js'
|
|
|
|
loadLanguages(['bash', 'markdown', 'json', 'yaml', 'typescript'])
|
|
|
|
export const renderer = {
|
|
heading(text: string, level: string) {
|
|
const escapedText = text.toLowerCase().replace(/[^\w]+/g, '-')
|
|
|
|
return `
|
|
<h${level}>
|
|
<a name="${escapedText}" class="anchor" href="#${escapedText}">
|
|
<span class="header-link"></span>
|
|
</a>
|
|
${text}
|
|
</h${level}>
|
|
`
|
|
},
|
|
image(href: string, title: string, text: string) {
|
|
const figcaption = title ? `<figcaption>${title}</figcaption>` : ''
|
|
const isLocal = !href.startsWith('http')
|
|
const src = isLocal ? getNFResize(href, { height: 800, width: 800 }) : href
|
|
const srcset = isLocal
|
|
? `srcset="${generateSrcSet(href, { width: 800, height: 800 })}"`
|
|
: ''
|
|
|
|
return `
|
|
<figure>
|
|
<img
|
|
alt="${text}"
|
|
${srcset}
|
|
src="${src}"
|
|
/>
|
|
${figcaption}
|
|
</figure>
|
|
`
|
|
},
|
|
code(source: string, lang?: string) {
|
|
// When lang is not specified it is usually an empty string which has to be handled
|
|
const usedLang = !lang ? 'shell' : lang
|
|
const highlightedSource = Prism.highlight(
|
|
source,
|
|
Prism.languages[usedLang],
|
|
usedLang
|
|
)
|
|
return `<pre class='language-${usedLang}'><code class='language-${usedLang}'>${highlightedSource}</code></pre>`
|
|
},
|
|
}
|