From 1d445bb8e896c254341c07adaea958a487fa3b8f Mon Sep 17 00:00:00 2001
From: winches <329487092@qq.com>
Date: Wed, 18 Dec 2024 15:50:23 +0800
Subject: [PATCH 1/3] fix: clipboard get the different unicode whitespace

---
 packages/hooks/use-clipboard/src/index.ts | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/hooks/use-clipboard/src/index.ts b/packages/hooks/use-clipboard/src/index.ts
index 0063a4ca0b..ed61684e5b 100644
--- a/packages/hooks/use-clipboard/src/index.ts
+++ b/packages/hooks/use-clipboard/src/index.ts
@@ -33,18 +33,26 @@ export function useClipboard({timeout = 2000}: UseClipboardProps = {}) {
     [onClearTimeout, timeout],
   );
 
+  const transformWhitespace = useCallback((text: string) => {
+    // Manually replace all whitespace to avoid get different unicode characters;
+    return text.replace(/\s/g, " ");
+  }, []);
+
   const copy = useCallback(
     (valueToCopy: any) => {
       if ("clipboard" in navigator) {
+        const decodedValue =
+          typeof valueToCopy === "string" ? transformWhitespace(valueToCopy) : valueToCopy;
+
         navigator.clipboard
-          .writeText(valueToCopy)
+          .writeText(decodedValue)
           .then(() => handleCopyResult(true))
           .catch((err) => setError(err));
       } else {
         setError(new Error("useClipboard: navigator.clipboard is not supported"));
       }
     },
-    [handleCopyResult],
+    [handleCopyResult, transformWhitespace],
   );
 
   const reset = useCallback(() => {

From ad5cd068a6305018ac60a42c608dac3f53cfc78e Mon Sep 17 00:00:00 2001
From: winches <329487092@qq.com>
Date: Wed, 18 Dec 2024 15:52:08 +0800
Subject: [PATCH 2/3] fix: clipboard get the different unicode whitespace

---
 .changeset/rich-moles-compare.md | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 .changeset/rich-moles-compare.md

diff --git a/.changeset/rich-moles-compare.md b/.changeset/rich-moles-compare.md
new file mode 100644
index 0000000000..133be65aa5
--- /dev/null
+++ b/.changeset/rich-moles-compare.md
@@ -0,0 +1,6 @@
+---
+"@nextui-org/use-clipboard": patch
+"@nextui-org/snippet": patch
+---
+
+Fix clipboard get different unicode whitespace (#4225)

From f11aebe22f4880280416c32581581d904bc284cf Mon Sep 17 00:00:00 2001
From: WK Wong <wingkwong.code@gmail.com>
Date: Wed, 18 Dec 2024 19:40:00 +0800
Subject: [PATCH 3/3] fix(snippet): incorrect MultiLine story

---
 .../snippet/stories/snippet.stories.tsx       | 29 ++-----------------
 1 file changed, 3 insertions(+), 26 deletions(-)

diff --git a/packages/components/snippet/stories/snippet.stories.tsx b/packages/components/snippet/stories/snippet.stories.tsx
index 7f8b1011cf..00c5f9b0fc 100644
--- a/packages/components/snippet/stories/snippet.stories.tsx
+++ b/packages/components/snippet/stories/snippet.stories.tsx
@@ -92,32 +92,9 @@ export const MultiLine = {
   args: {
     ...defaultProps,
     children: [
-      // "npm install @nextui-org/react",
-      // "yarn add @nextui-org/react",
-      // "pnpm add @nextui-org/react",
-      `
-{
-  "name": "Next.js PWA",
-  "short_name": "NextPWA",
-  "description": "A Progressive Web App built with Next.js and React",
-  "start_url": "/",
-  "display": "standalone",
-  "background_color": "#ffffff",
-  "theme_color": "#000000",
-  "icons": [
-    {
-      "src": "/icon-192x192.png",
-      "sizes": "192x192",
-      "type": "image/png"
-    },
-    {
-      "src": "/icon-512x512.png",
-      "sizes": "512x512",
-      "type": "image/png"
-    }
-  ]
-}
-`,
+      "npm install @nextui-org/react",
+      "yarn add @nextui-org/react",
+      "pnpm add @nextui-org/react",
     ],
   },
 };