fix(ShikiCodeblocks): spoilers (#298)
* fix(ShikiCodeblocks): spoilers * fix a settings bug i thikn
This commit is contained in:
parent
2d08dd8a9c
commit
2de461985d
@ -46,9 +46,11 @@ export interface HighlighterProps {
|
||||
}
|
||||
|
||||
export const createHighlighter = (props: HighlighterProps) => (
|
||||
<ErrorBoundary>
|
||||
<Highlighter {...props} />
|
||||
</ErrorBoundary>
|
||||
<pre className={cl("container")}>
|
||||
<ErrorBoundary>
|
||||
<Highlighter {...props} />
|
||||
</ErrorBoundary>
|
||||
</pre>
|
||||
);
|
||||
export const Highlighter = ({
|
||||
lang,
|
||||
@ -66,7 +68,7 @@ export const Highlighter = ({
|
||||
const shikiLang = lang ? resolveLang(lang) : null;
|
||||
const useHljs = shouldUseHljs({ lang, tryHljs });
|
||||
|
||||
const [preRef, isIntersecting] = useIntersection(true);
|
||||
const [rootRef, isIntersecting] = useIntersection(true);
|
||||
|
||||
const [tokens] = useAwaiter(async () => {
|
||||
if (!shikiLang || useHljs || !isIntersecting) return null;
|
||||
@ -93,8 +95,8 @@ export const Highlighter = ({
|
||||
if (isPreview) preClasses.push(cl("preview"));
|
||||
|
||||
return (
|
||||
<pre
|
||||
ref={preRef}
|
||||
<div
|
||||
ref={rootRef}
|
||||
className={preClasses.join(" ")}
|
||||
style={{
|
||||
backgroundColor: useHljs
|
||||
@ -123,7 +125,7 @@ export const Highlighter = ({
|
||||
theme={themeBase}
|
||||
/>}
|
||||
</code>
|
||||
</pre>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -17,17 +17,28 @@
|
||||
*/
|
||||
|
||||
import { useSettings } from "@api/settings";
|
||||
import { React } from "@webpack/common";
|
||||
|
||||
import { shiki } from "../api/shiki";
|
||||
import { ShikiSettings } from "../types";
|
||||
|
||||
export function useShikiSettings(settingKeys: (keyof ShikiSettings)[], overrides?: Record<string, any>) {
|
||||
const settings = useSettings(settingKeys.map(key => `plugins.ShikiCodeblocks.${key}`)).plugins.ShikiCodeblocks as ShikiSettings;
|
||||
const [isLoading, setLoading] = React.useState(false);
|
||||
|
||||
const withOverrides = { ...settings, ...overrides };
|
||||
|
||||
const themeUrl = withOverrides.customTheme || withOverrides.theme;
|
||||
if (themeUrl !== shiki.currentThemeUrl) shiki.setTheme(themeUrl);
|
||||
|
||||
if (overrides) {
|
||||
const willChangeTheme = shiki.currentThemeUrl && themeUrl !== shiki.currentThemeUrl;
|
||||
const noOverrides = Object.keys(overrides).length === 0;
|
||||
|
||||
if (isLoading && (!willChangeTheme || noOverrides)) setLoading(false);
|
||||
if ((!isLoading && willChangeTheme)) {
|
||||
setLoading(true);
|
||||
shiki.setTheme(themeUrl);
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
...withOverrides,
|
||||
|
@ -1,5 +1,8 @@
|
||||
.shiki-root {
|
||||
border-radius: 4px;
|
||||
|
||||
/* fallback background */
|
||||
background-color: var(--background-secondary);
|
||||
}
|
||||
|
||||
.shiki-root code {
|
||||
|
Loading…
x
Reference in New Issue
Block a user