"use client"; import * as React from "react"; import { motion } from "motion/react"; import { ComposeForm } from "./compose-form"; import { ContactMethods } from "./contact-methods"; import { TerminalContact } from "./terminal-contact"; import { toast } from "./toast"; import { type ContactInfo } from "./vcard"; const defaultContact: ContactInfo = { name: "Maya Kapoor", title: "Design Engineer", org: "Kinetic Labs", email: "maya@kinetic.dev", phone: "+91 98765 43210", location: "Bengaluru, India", website: "https://kinetic-ui.chaitanya-nk.com", socials: [ { url: "https://www.linkedin.com/in/maya-kapoor" }, { url: "https://github.com/maya-kapoor" }, { url: "https://x.com/mayakapoor", label: "x-twitter" }, { url: "https://instagram.com/maya.designs" }, ], }; export type ContactPageProps = { contact?: ContactInfo; /** Sends the compose form. Wire this to your API route, Resend, Formspree… */ onSend?: (data: { name: string; email: string; topic: string; message: string; files: File[] }) => Promise | void; /** Bot-check widget (e.g. Cloudflare Turnstile) and whether it has passed. */ verification?: React.ReactNode; verified?: boolean; /** IANA zone for the "it's 4:12 pm here" line. */ timeZone?: string; }; /** Portfolio contact page: a terminal-style contact card beside an email-style compose form. */ export function ContactPage({ contact = defaultContact, onSend, verification, verified, timeZone = "Asia/Kolkata" }: ContactPageProps) { return (

Contact

Let's build something together.

Pick whatever's easiest: copy my details, save my card, or send a note right here.

{ if (onSend) return onSend(d); await toast.promise(new Promise((r) => setTimeout(r, 1000)), { loading: "Sending…", success: "Message sent", error: "Couldn't send" }); }} />

); }

Contact Page

Installation