"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from "react";
export function LicenseActivationForm({ email, onSubmit, onBack, error, }) {
    const [name, setName] = useState("");
    const [companyName, setCompanyName] = useState("");
    const [isSubmitting, setIsSubmitting] = useState(false);
    const [validationError, setValidationError] = useState();
    const handleSubmit = async (e) => {
        e.preventDefault();
        setValidationError(undefined);
        // Basic validation
        if (!name.trim() || !companyName.trim()) {
            setValidationError("All fields are required");
            return;
        }
        setIsSubmitting(true);
        try {
            await onSubmit(email.trim(), name.trim(), companyName.trim());
        }
        finally {
            setIsSubmitting(false);
        }
    };
    return (_jsxs("div", { className: "w-full max-w-md", children: [_jsx("h2", { className: "text-3xl font-bold text-gray-900 text-center tracking-tight", children: "Start Your Trial" }), _jsx("p", { className: "mt-3 text-gray-500 text-center leading-relaxed", children: "Enter your details to start a free trial." }), _jsxs("p", { className: "mt-1 text-sm text-gray-500 text-center", children: ["Email: ", _jsx("span", { className: "font-medium text-gray-700", children: email })] }), _jsxs("form", { onSubmit: handleSubmit, className: "mt-6 space-y-4", children: [_jsxs("div", { children: [_jsx("label", { htmlFor: "name", className: "block text-sm font-medium text-gray-500", children: "Your Name" }), _jsx("input", { type: "text", id: "name", value: name, onChange: (e) => setName(e.target.value), className: "mt-1 block h-11 w-full rounded-xl border border-gray-200 bg-white px-4 py-3 text-gray-900 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500/30", placeholder: "John Smith", required: true, disabled: isSubmitting, autoFocus: true })] }), _jsxs("div", { children: [_jsx("label", { htmlFor: "company", className: "block text-sm font-medium text-gray-500", children: "Company Name" }), _jsx("input", { type: "text", id: "company", value: companyName, onChange: (e) => setCompanyName(e.target.value), className: "mt-1 block h-11 w-full rounded-xl border border-gray-200 bg-white px-4 py-3 text-gray-900 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500/30", placeholder: "Acme Corp", required: true, disabled: isSubmitting })] }), (error || validationError) && (_jsx("div", { className: "rounded-xl border border-red-100 bg-red-50 p-3 text-sm text-red-800", children: validationError || error })), _jsxs("div", { className: "flex gap-3", children: [onBack && (_jsx("button", { type: "button", onClick: onBack, disabled: isSubmitting, className: "flex-1 rounded-full h-10 border border-gray-200 px-6 text-xs font-bold uppercase tracking-widest text-gray-500 transition-colors hover:bg-gray-50 disabled:opacity-50", children: "Back" })), _jsx("button", { type: "submit", disabled: isSubmitting, className: `${onBack ? "flex-1" : "w-full"} rounded-full h-10 bg-blue-600 px-8 text-xs font-black uppercase tracking-widest text-white shadow-lg shadow-blue-200 transition-all hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-50`, children: isSubmitting ? (_jsxs("span", { className: "flex items-center justify-center gap-2", children: [_jsxs("svg", { className: "h-5 w-5 animate-spin", viewBox: "0 0 24 24", fill: "none", children: [_jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), _jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), "Processing..."] })) : ("Start Trial") })] })] }), _jsxs("p", { className: "mt-6 text-center text-xs text-gray-500", children: ["By continuing, you agree to our", " ", _jsx("a", { href: "#", className: "text-blue-600 hover:underline", children: "Terms of Service" }), " ", "and", " ", _jsx("a", { href: "#", className: "text-blue-600 hover:underline", children: "Privacy Policy" })] })] }));
}
//# sourceMappingURL=LicenseActivationForm.js.map