(rerender)
| 28 | typeof document !== 'undefined' && document.documentElement.classList.contains('dark') |
| 29 | |
| 30 | export function createHighlight(rerender) { |
| 31 | let hl = null |
| 32 | let disposed = false |
| 33 | getHighlighter().then((h) => { |
| 34 | if (disposed) return |
| 35 | hl = h |
| 36 | rerender?.() |
| 37 | }) |
| 38 | |
| 39 | // Re-highlight when the docs theme toggles (next-themes flips `class` on <html>). |
| 40 | let observer = null |
| 41 | if (typeof MutationObserver !== 'undefined') { |
| 42 | observer = new MutationObserver(() => rerender?.()) |
| 43 | observer.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] }) |
| 44 | } |
| 45 | |
| 46 | const highlight = (code) => { |
| 47 | if (!hl) return escapeHtml(code) // plain text until Shiki finishes loading |
| 48 | const html = hl.codeToHtml(code, { lang: 'python', theme: isDark() ? 'github-dark' : 'github-light' }) |
| 49 | // CodeJar sets the return value as the editor's innerHTML, so drop Shiki's <pre><code> wrapper. |
| 50 | let inner = html.replace(/^<pre[^>]*>\s*<code[^>]*>/, '').replace(/<\/code>\s*<\/pre>\s*$/, '') |
| 51 | // For code ending in \n, Shiki adds a trailing empty `<span class="line"></span>` the caret can't reach. Drop it so the HTML ends with the \n text node (Prism-style) and stays editable. |
| 52 | if (code.endsWith('\n')) inner = inner.replace(/<span class="line"><\/span>$/, '') |
| 53 | return inner |
| 54 | } |
| 55 | // Disconnect the <html> observer and ignore a late getHighlighter() resolve, so the editor closure can be GC'd on unmount. |
| 56 | highlight.dispose = () => { disposed = true; observer?.disconnect() } |
| 57 | return highlight |
| 58 | } |
no test coverage detected