Date: Sun, 27 Apr 2025 14:49:43 +0530
Subject: [PATCH 1/2] [added a copy button]
---
src/components/code-example.tsx | 12 ++++++--
src/components/copy-button.tsx | 53 +++++++++++++++++++++++++++++++++
2 files changed, 62 insertions(+), 3 deletions(-)
create mode 100644 src/components/copy-button.tsx
diff --git a/src/components/code-example.tsx b/src/components/code-example.tsx
index 70347cfa0..e3d216f0c 100644
--- a/src/components/code-example.tsx
+++ b/src/components/code-example.tsx
@@ -14,6 +14,7 @@ import linesToDiv from "./lines-to-div";
import atApplyInjection from "./syntax-highlighter/at-apply.json";
import atRulesInjection from "./syntax-highlighter/at-rules.json";
import themeFnInjection from "./syntax-highlighter/theme-fn.json";
+import { CopyButton } from "./copy-button";
export function js(strings: TemplateStringsArray, ...args: any[]) {
return { lang: "js", code: dedent(strings, ...args) };
@@ -50,7 +51,7 @@ export async function CodeExample({
}) {
return (
- {filename ? : null}
+ {filename ? : null}
);
@@ -189,8 +190,13 @@ export function RawHighlightedCode({
return ;
}
-function CodeExampleFilename({ filename }: { filename: string }) {
- return {filename}
;
+function CodeExampleFilename({ filename, code }: { filename: string; code?: string }) {
+ return (
+
+ {filename}
+ {code && }
+
+ );
}
const highlighter = await createHighlighter({
diff --git a/src/components/copy-button.tsx b/src/components/copy-button.tsx
new file mode 100644
index 000000000..fb03b0192
--- /dev/null
+++ b/src/components/copy-button.tsx
@@ -0,0 +1,53 @@
+'use client'
+
+import { useState } from 'react'
+
+export function CopyButton({ code }: { code: string }) {
+ const [copied, setCopied] = useState(false)
+
+ const handleCopy = async () => {
+ try {
+ await navigator.clipboard.writeText(code)
+ setCopied(true)
+ setTimeout(() => setCopied(false), 2000)
+ } catch (err) {
+ console.error('Failed to copy:', err)
+ }
+ }
+
+ return (
+
+ )
+}
\ No newline at end of file
From 35d0d1a7b9cd1be90e562ffc523ca4f66faffecd Mon Sep 17 00:00:00 2001
From: sayanChaterjee
Date: Sun, 27 Apr 2025 17:47:27 +0530
Subject: [PATCH 2/2] [fix of the copy-button]
---
src/components/code-example.tsx | 9 ++++++++-
1 file changed, 8 insertions(+), 1 deletion(-)
diff --git a/src/components/code-example.tsx b/src/components/code-example.tsx
index e3d216f0c..412b8e962 100644
--- a/src/components/code-example.tsx
+++ b/src/components/code-example.tsx
@@ -190,11 +190,18 @@ export function RawHighlightedCode({
return ;
}
+function cleanCodeForCopy(code:string) {
+ return code
+ .split('\n')
+ .filter(line => !line.includes('[!code highlight'))
+ .join('\n');
+}
+
function CodeExampleFilename({ filename, code }: { filename: string; code?: string }) {
return (
{filename}
- {code && }
+ {code && }
);
}