大改变

components/points/BindInviteCard.tsx

@@ -0,0 +1,49 @@
+import Image from "next/image";
+import { Button } from "@heroui/react";
+
+interface BindInviteCardProps {
+  placeholder?: string;
+  onApply?: (code: string) => void;
+}
+
+export default function BindInviteCard({
+  placeholder = "ENTER CODE",
+  onApply,
+}: BindInviteCardProps) {
+  return (
+    <div className="flex-[32] bg-bg-surface dark:bg-gray-800 rounded-3xl border border-border-gray dark:border-gray-700 p-8 flex flex-col gap-6">
+      {/* Header */}
+      <div className="flex items-center gap-3 h-6">
+        <Image src="/icon0.svg" alt="" width={24} height={24} />
+        <span className="text-body-default font-bold text-text-primary dark:text-white leading-[150%]">
+          BIND INVITE
+        </span>
+      </div>
+
+      {/* Description */}
+      <p className="text-caption-tiny font-regular text-text-tertiary dark:text-gray-400 leading-[150%] tracking-[0.01em]">
+        Were you invited? Enter the code here to boost your base yield by +0.5%.
+      </p>
+
+      {/* Input and Button */}
+      <div className="flex flex-col gap-4">
+        {/* Input Field */}
+        <div className="flex items-center gap-2">
+          <div className="flex-1 bg-bg-subtle dark:bg-gray-700 rounded-xl border border-border-gray dark:border-gray-600 px-4 py-3 h-[46px] flex items-center">
+            <span className="text-body-default font-bold text-[#d1d5db] dark:text-gray-500 leading-[150%] font-jetbrains">
+              {placeholder}
+            </span>
+          </div>
+        </div>
+
+        {/* Apply Button */}
+        <Button
+          onClick={() => onApply?.("")}
+          className="bg-text-primary dark:bg-white rounded-xl h-11 text-body-small font-bold text-white dark:text-gray-900"
+        >
+          Apply
+        </Button>
+      </div>
+    </div>
+  );
+}