add ui sounds to button

src/button.tsx

@@ -4,6 +4,7 @@ import { type MotionProps, motion } from "motion/react";
 import type * as React from "react";
 import type { ComponentProps, FC } from "react";
 import { cn } from "@/lib/utils";
+import useInterfaceSound from "./hooks/useInterfaceSound";
 
 const buttonVariants = cva(
 	"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-medium transition-color \
@@ -44,6 +45,9 @@ function Button({
 	variant,
 	size,
 	asChild = false,
+	onClick,
+	onMouseEnter,
+	onMouseLeave,
 	...props
 }: React.ComponentProps<"button"> &
 	VariantProps<typeof buttonVariants> & {
@@ -51,10 +55,20 @@ function Button({
 	}) {
 	const Comp = asChild ? Slot : "button";
 
+	const { play } = useInterfaceSound();
+
 	return (
 		<Comp
 			data-slot="button"
 			className={cn(buttonVariants({ variant, size, className }))}
+			onClick={(e) => {
+				onClick?.(e);
+				play({ id: "click1" });
+			}}
+			onMouseEnter={(e) => {
+				play({ id: "click2" });
+				onMouseEnter?.(e);
+			}}
 			{...props}
 		/>
 	);