import clsx from "clsx";
import CopyButton from "../CopyButton";
import type { ComponentPropsWithoutRef } from "react";
import styles from "./Code.module.css";
export type CodeProps = ComponentPropsWithoutRef<"code"> & {
"data-language"?: string;
"data-theme"?: string;
};
// a simple wrapper component that "intelligently" picks between inline code and code blocks (w/ optional syntax
// highlighting & a clipboard button)
const Code = ({
"data-language": dataLanguage,
"data-theme": dataTheme, // eslint-disable-line @typescript-eslint/no-unused-vars
className,
children,
...rest
}: CodeProps) => {
// detect if this input has already been touched by shiki via rehype-pretty-code
if (dataLanguage) {
// full multi-line code blocks with copy-to-clipboard button
return (
<>
{children}
>
);
}
// simple inline code in paragraphs, headings, etc. (never highlighted)
return (
{children}
);
};
export default Code;