
* Shiki Code block Experimental * refactor * update code * remove console.log * add transformers to namespace * some validations * fix components paths * fix ruff * add a high-level component * fix mapping * fix mapping * python 3.9+ * see if this fixes the tests * fix pyi and annotations * minimal update of theme and language map * add hack for reflex-web/flexdown * unit test file commit * [ENG-3895] [ENG-3896] Update styling for shiki code block * strip transformer triggers * minor refactor * linter * fix pyright * pyi fix * add unit tests * sneaky pyright ignore * the transformer trigger regex should remove the language comment character * minor refactor * fix silly mistake * component mapping in markdown should use the first child for codeblock * use ternary operator in numbers.py, move code block args to class for docs discoverability * precommit * pyright fix * remove id on copy button animation * pyright fix for real * pyi fix * pyi fix fr * check if svg exists * copy event chain * do a concatenation instead of first child * added comment --------- Co-authored-by: Carlos <cutillascarlos@gmail.com>
30 lines
791 B
JavaScript
30 lines
791 B
JavaScript
import { useEffect, useState } from "react"
|
|
import { codeToHtml} from "shiki"
|
|
|
|
export function Code ({code, theme, language, transformers, ...divProps}) {
|
|
const [codeResult, setCodeResult] = useState("")
|
|
useEffect(() => {
|
|
async function fetchCode() {
|
|
let final_code;
|
|
|
|
if (Array.isArray(code)) {
|
|
final_code = code[0];
|
|
} else {
|
|
final_code = code;
|
|
}
|
|
const result = await codeToHtml(final_code, {
|
|
lang: language,
|
|
theme,
|
|
transformers
|
|
});
|
|
setCodeResult(result);
|
|
}
|
|
fetchCode();
|
|
}, [code, language, theme, transformers]
|
|
|
|
)
|
|
return (
|
|
<div dangerouslySetInnerHTML={{__html: codeResult}} {...divProps} ></div>
|
|
)
|
|
}
|