Merge pull request #435 from appwrite/fix-id-component-copy

fix: id component copy on click

CONTRIBUTING.md

@@ -40,12 +40,15 @@ git clone https://github.com/appwrite/console.git appwrite-console
 ```
 
 ### 2. Install dependencies with npm
+
 Navigate to the Appwrite Console repository and install dependencies.
+
 ```bash
 cd appwrite-console && npm install
 ```
 
 ### 3. Install and run Appwrite locally
+
 When you run the Appwrite Console locally, it needs to point to a backend as well. The easiest way to do this is to run an Appwrite instance locally.
 
 Follow the [install instructions](https://appwrite.io/docs/installation) in the Appwrite docs.

src/lib/components/id.svelte

@@ -46,22 +46,22 @@
     }
 </script>
 
-<div
-    class="interactive-text-output is-buttons-on-top"
-    style:min-inline-size="0"
-    style:display="inline-flex">
-    <span
-        style:white-space="nowrap"
-        class="text u-line-height-1-5"
-        style:overflow="hidden"
-        use:truncateText>
-        <slot />
-    </span>
-    <div class="interactive-text-output-buttons">
-        <Copy {value} {event}>
+<Copy {value} {event}>
+    <div
+        class="interactive-text-output is-buttons-on-top"
+        style:min-inline-size="0"
+        style:display="inline-flex">
+        <span
+            style:white-space="nowrap"
+            class="text u-line-height-1-5"
+            style:overflow="hidden"
+            use:truncateText>
+            <slot />
+        </span>
+        <div class="interactive-text-output-buttons">
             <button class="interactive-text-output-button is-hidden" aria-label="copy text">
                 <span class="icon-duplicate" aria-hidden="true" />
             </button>
-        </Copy>
+        </div>
     </div>
-</div>
+</Copy>