Code Block

import { CodeBlockUI } from "@/components/ui/code-block-ui";

export default function Example() {
  return <CodeBlockUI />;
}

import { forwardRef } from "react";
import { cn } from "@/lib/utils";

const CodeBlockUI = forwardRef(({ className, children, language, ...props }, ref) => (
  <div ref={ref} className={cn("relative rounded-lg border bg-muted", className)} {...props}>
    {language && <div className="flex items-center justify-between border-b px-4 py-2"><span className="text-xs font-medium text-muted-foreground">{language}</span></div>}
    <pre className="overflow-auto p-4"><code className="text-sm font-mono">{children}</code></pre>
  </div>
));
CodeBlockUI.displayName = "CodeBlockUI";

export { CodeBlockUI };