import React , { ReactElement , useMemo } from "react" ; import { ReactMarkdownProps } from "react-markdown/lib/ast-to-react" ; import SyntaxHighlighter from "react-syntax-highlighter" ; import { atomOneDark } from "react-syntax-highlighter/dist/cjs/styles/hljs" ; function Code ( { className , children , inline , } ) { const language = useMemo < string > ( ( ) => typeof className === "string" ? className . replace ( "language-" , "" ) : "" , [ ] ) ; return ( < SyntaxHighlighter style = { atomOneDark } customStyle = { inline && ! language ? { display : "inline" , padding : "0.2em" } : { } } language = { language || "text" } > { String ( children ) . replace ( /\n$/ , "" ) } < /SyntaxHighlighter>); } export default Code ;