diff --git a/components/CodeBlock.tsx b/components/CodeBlock.tsx new file mode 100644 index 0000000..9a0aa0d --- /dev/null +++ b/components/CodeBlock.tsx @@ -0,0 +1,37 @@ +import { render } from "@deno/gfm"; +import CopyText from "./CopyText.tsx"; + +import "prismjs/components/prism-typescript?no-check"; +import "prismjs/components/prism-bash?no-check"; + +export default function CodeBlock( + { code, setup }: { code: string; setup?: string }, +) { + const setup__html = setup && render(`\`\`\`bash\n${setup}\n\`\`\``); + const __html = render(`\`\`\`ts\n${code}\n\`\`\``); + return ( +
+ {setup__html && ( +
+
+
+
+
+ +
+ )} +
+
+
+
+
+
+
+ ); +} diff --git a/components/CopyText.tsx b/components/CopyText.tsx index 3c2b900..fb24e7b 100644 --- a/components/CopyText.tsx +++ b/components/CopyText.tsx @@ -3,8 +3,8 @@ import { useSignal } from "@preact/signals"; export default function CopyText({ text }: { text: string }) { const copied = useSignal(false); return ( -
-
{text}
+
+
{text}