PythonBlock.tsx•1.15 kB
import { useMemo } from "react";
import { python } from "@codemirror/lang-python";
import { githubDark, githubLight } from "@uiw/codemirror-theme-github";
import CodeMirror, {
BasicSetupOptions,
ReactCodeMirrorProps,
} from "@uiw/react-codemirror";
import { useTheme } from "@phoenix/contexts";
type PythonBlockProps = Omit<
ReactCodeMirrorProps,
"theme" | "extensions" | "editable"
> & {
basicSetup?: BasicSetupOptions;
};
export function PythonBlock(props: PythonBlockProps) {
const { theme } = useTheme();
const codeMirrorTheme = theme === "light" ? githubLight : githubDark;
const { basicSetup: propsBasicSetup = {} } = props;
const basicSetup = useMemo(() => {
return {
lineNumbers: false,
foldGutter: true,
bracketMatching: true,
syntaxHighlighting: true,
highlightActiveLine: false,
highlightActiveLineGutter: false,
...(propsBasicSetup as object),
};
}, [propsBasicSetup]);
return (
<CodeMirror
value={props.value}
extensions={[python()]}
editable={false}
theme={codeMirrorTheme}
{...props}
basicSetup={basicSetup}
/>
);
}