Fix copy button

src/button/Button.jsx

@@ -15,6 +15,7 @@ const variantToClassName = {
   toolbar: [styles.toolbarButton],
   icon: [styles.iconButton],
   copy: [styles.copyButton],
+  iconCopy: [styles.iconCopyButton],
 };
 
 export const Button = forwardRef(

src/button/Button.module.css

@@ -16,7 +16,8 @@ limitations under the License.
 
 .button,
 .toolbarButton,
-.iconButton {
+.iconButton,
+.iconCopyButton {
   position: relative;
   display: flex;
   justify-content: center;
@@ -154,3 +155,17 @@ limitations under the License.
 .copyButton.on svg * {
   stroke: white;
 }
+
+.iconCopyButton svg * {
+  fill: var(--textColor3);
+}
+
+.iconCopyButton:hover svg * {
+  fill: #0dbd8b;
+}
+
+.iconCopyButton.on svg *,
+.iconCopyButton.on:hover svg * {
+  fill: transparent;
+  stroke: #0dbd8b;
+}

src/button/CopyButton.jsx

@@ -4,14 +4,15 @@ import { ReactComponent as CheckIcon } from "../icons/Check.svg";
 import { ReactComponent as CopyIcon } from "../icons/Copy.svg";
 import { Button } from "./Button";
 
-export function CopyButton({ value, children, variant, ...rest }) {
+export function CopyButton({ value, children, onClassName, variant, ...rest }) {
   const [isCopied, setCopied] = useClipboard(value, { successDuration: 3000 });
 
   return (
     <Button
       {...rest}
-      variant={variant || "copy"}
+      variant={variant === "icon" ? "iconCopy" : "copy"}
       on={isCopied}
+      onClassName={onClassName}
       onPress={setCopied}
       iconStyle={isCopied ? "stroke" : "fill"}
     >