// Client/Server Component // "use client" // uncomment when required for: hooks, event handlers, browser APIs /** * @name Contact 01 * @description A simple, centered contact form with name, email, and message * fields. Clean layout with optional heading and description. * * @slots contact, contact-container, contact-header, contact-heading, * contact-description, contact-form, contact-form-row, contact-field, * contact-submit * @variant centered * * @registryDependencies button input textarea label * @dependencies lucide-react */ import * as React from "react" import { Send } from "lucide-react" import { cn } from "@/registry/lib/utils" import { Button } from "@/registry/ui/button" import { Input } from "@/registry/ui/input" import { Textarea } from "@/registry/ui/textarea" import { Label } from "@/registry/ui/label" // ============================================================================ // TYPES // ============================================================================ interface Contact01Props { /** Section heading */ heading?: string /** Section description */ description?: string /** Submit button text */ submitText?: string /** Additional CSS classes */ className?: string } // ============================================================================ // COMPONENT // ============================================================================ function Contact01({ heading = "Get in touch", description = "Have a question or want to work together? Fill out the form below and we'll get back to you as soon as possible.", submitText = "Send message", className, }: Contact01Props) { return (

{/* Header */}

{heading}

{description && (

{description}

)}

{/* Form */}