🚚 (mv) separating card from other components

features/auth/ui/components/FullNameInput.tsx

@@ -0,0 +1,38 @@
+"use client";
+
+import React, { useState } from "react";
+import { Button, Input } from "@heroui/react";
+import DebugPage from "@/app/debug/DebugPage";
+
+type Props = {
+  changeCurrentPage: React.Dispatch<React.SetStateAction<React.JSX.Element>>;
+};
+
+const FullNameInput = ({ changeCurrentPage }: Props) => {
+  const [fullName, setFullName] = useState("");
+
+  return (
+    <>
+      <Input
+        className="w-full "
+        label="Full Name"
+        type="name"
+        variant="bordered"
+        onChange={(e) => setFullName(e.target.value)}
+        classNames={{
+          input: "text-md font-light pt-4",
+          inputWrapper: "flex gap-10",
+        }}
+      />
+      <Button
+        onPress={() => changeCurrentPage(<DebugPage />)}
+        className="mt-2 w-full"
+        color="primary"
+      >
+        Continue
+      </Button>
+    </>
+  );
+};
+
+export default FullNameInput;