'use client'

import * as Form from '@radix-ui/react-form'

export default function SignupEmailComponent() {
    return (
        <Form.Root>
            <Form.Message match="valueMissing" name={"email"}>
                Please enter your email address.
            </Form.Message>
            <Form.Message match="typeMismatch" name={"email"}>
                Please enter a valid email address.
            </Form.Message>
            <div className="flex gap-2 items-center">
                <Form.Field className="grow" name="email">
                    <Form.Control asChild>
                        <input type="email" className="w-full" placeholder="[email protected]" required />
                    </Form.Control>
                </Form.Field>
                <Form.Submit asChild>
                    <button className="link-button">Submit</button>
                </Form.Submit>
            </div>
        </Form.Root>
    )
}