From 6c9351ccd26d3a50230eee131a9612269b2fddcb Mon Sep 17 00:00:00 2001
From: cfngc4594 <cfngc4594@gmail.com>
Date: Wed, 7 May 2025 13:32:26 +0800
Subject: [PATCH] feat(components): add TooltipButton component

- A reusable button with tooltip functionality
- Supports customizable delay, tooltip content, and className
- Uses shadcn/ui Tooltip and Button components
---
 src/components/tooltip-button.tsx | 47 +++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 src/components/tooltip-button.tsx

diff --git a/src/components/tooltip-button.tsx b/src/components/tooltip-button.tsx
new file mode 100644
index 0000000..935a935
--- /dev/null
+++ b/src/components/tooltip-button.tsx
@@ -0,0 +1,47 @@
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
+import { cn } from "@/lib/utils";
+import { Button, ButtonProps } from "@/components/ui/button";
+
+interface TooltipButtonProps extends ButtonProps {
+  children: React.ReactNode;
+  delayDuration?: number;
+  tooltipContent: string;
+  className?: string;
+}
+
+const TooltipButton = ({
+  children,
+  delayDuration = 0,
+  tooltipContent,
+  className,
+  ...props
+}: TooltipButtonProps) => {
+  return (
+    <TooltipProvider delayDuration={delayDuration}>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Button
+            variant="outline"
+            className={cn(
+              "h-6 w-6 px-1.5 py-0.5 border-none shadow-none hover:bg-muted",
+              className
+            )}
+            {...props}
+          >
+            {children}
+          </Button>
+        </TooltipTrigger>
+        <TooltipContent className="px-2 py-1 text-xs">
+          {tooltipContent}
+        </TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
+  );
+};
+
+export { TooltipButton };