{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "contact-02",
  "title": "Contact 02",
  "description": "A simple contact form",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button",
    "card",
    "checkbox",
    "input",
    "label",
    "textarea"
  ],
  "files": [
    {
      "path": "src/registry/blocks/radix/contact-02/components/contact.tsx",
      "content": "import { MailIcon, MapPinIcon, MessageCircle, PhoneIcon } from \"lucide-react\";\nimport Link from \"next/link\";\nimport { Button } from \"@/registry/bases/radix/ui/button\";\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardHeader,\n  CardTitle,\n} from \"@/registry/bases/radix/ui/card\";\nimport { Checkbox } from \"@/registry/bases/radix/ui/checkbox\";\nimport { Input } from \"@/registry/bases/radix/ui/input\";\nimport { Label } from \"@/registry/bases/radix/ui/label\";\nimport { Textarea } from \"@/registry/bases/radix/ui/textarea\";\n\nconst Contact = () => (\n  <div className=\"py-20\">\n    <div className=\"mx-auto w-full max-w-(--breakpoint-xl) px-6 xl:px-0\">\n      <b className=\"font-medium text-muted-foreground text-sm uppercase tracking-wide\">\n        Contact Us\n      </b>\n      <h2 className=\"mt-3 font-medium text-4xl tracking-[-0.035em]\">\n        Chat with our friendly team!\n      </h2>\n      <p className=\"mt-3 text-lg text-muted-foreground md:text-xl\">\n        We&apos;d love to hear from you. Please fill out this form or shoot us\n        an email.\n      </p>\n      <div className=\"mt-16 flex flex-col gap-16 md:gap-10 lg:flex-row\">\n        <div className=\"grid w-full max-w-3xl grid-cols-1 gap-1 rounded-xl border bg-muted p-1 *:rounded-lg *:border *:bg-background *:p-6 sm:grid-cols-2 lg:col-span-2 dark:*:border-foreground/20\">\n          <div>\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-xl border border-foreground/3 bg-foreground/5 text-foreground dark:border-foreground/20 dark:bg-foreground/10\">\n              <MailIcon />\n            </div>\n            <h3 className=\"mt-6 font-medium text-xl\">Email</h3>\n            <p className=\"my-2.5 text-muted-foreground\">\n              Our friendly team is here to help.\n            </p>\n            <Link\n              className=\"font-medium text-primary\"\n              href=\"mailto:akashmoradiya3444@gmail.com\"\n            >\n              akashmoradiya3444@gmail.com\n            </Link>\n          </div>\n          <div>\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-xl border border-foreground/3 bg-foreground/5 text-foreground dark:bg-foreground/10\">\n              <MessageCircle />\n            </div>\n            <h3 className=\"mt-6 font-medium text-xl\">Live chat</h3>\n            <p className=\"my-2.5 text-muted-foreground\">\n              Our friendly team is here to help.\n            </p>\n            <Link className=\"font-medium text-primary\" href=\"#\">\n              Start new chat\n            </Link>\n          </div>\n          <div>\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-xl border border-foreground/3 bg-foreground/5 text-foreground dark:bg-foreground/10\">\n              <MapPinIcon />\n            </div>\n            <h3 className=\"mt-6 font-medium text-xl\">Office</h3>\n            <p className=\"my-2.5 text-muted-foreground\">\n              Come say hello at our office HQ.\n            </p>\n            <Link\n              className=\"font-medium text-primary\"\n              href=\"https://map.google.com\"\n              target=\"_blank\"\n            >\n              100 Smith Street Collingwood <br /> VIC 3066 AU\n            </Link>\n          </div>\n          <div>\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-xl border border-foreground/3 bg-foreground/5 text-foreground dark:bg-foreground/10\">\n              <PhoneIcon />\n            </div>\n            <h3 className=\"mt-6 font-medium text-xl\">Phone</h3>\n            <p className=\"my-2.5 text-muted-foreground\">\n              Mon-Fri from 8am to 5pm.\n            </p>\n            <Link\n              className=\"font-medium text-primary\"\n              href=\"tel:akashmoradiya3444@gmail.com\"\n            >\n              +1 (555) 000-0000\n            </Link>\n          </div>\n        </div>\n\n        {/* Form */}\n        <div className=\"w-full max-w-lg rounded-xl border bg-muted p-1\">\n          <Card className=\"relative isolate rounded-lg bg-background shadow-none lg:ms-auto dark:border-foreground/20\">\n            <CardHeader className=\"gap-1\">\n              <CardTitle className=\"font-medium text-xl\">Contact Us</CardTitle>\n              <CardDescription className=\"text-base\">\n                We'd love to hear from you. Please fill out this form.\n              </CardDescription>\n            </CardHeader>\n            <CardContent className=\"mt-2\">\n              <form>\n                <div className=\"grid gap-x-8 gap-y-6 md:grid-cols-2\">\n                  <div className=\"col-span-2 sm:col-span-1\">\n                    <Label htmlFor=\"firstName\">First Name</Label>\n                    <Input\n                      className=\"mt-2 bg-white shadow-none\"\n                      id=\"firstName\"\n                      placeholder=\"First name\"\n                    />\n                  </div>\n                  <div className=\"col-span-2 sm:col-span-1\">\n                    <Label htmlFor=\"lastName\">Last Name</Label>\n                    <Input\n                      className=\"mt-2 bg-white shadow-none\"\n                      id=\"lastName\"\n                      placeholder=\"Last name\"\n                    />\n                  </div>\n                  <div className=\"col-span-2\">\n                    <Label htmlFor=\"email\">Email</Label>\n                    <Input\n                      className=\"mt-2 bg-white shadow-none\"\n                      id=\"email\"\n                      placeholder=\"Email\"\n                      type=\"email\"\n                    />\n                  </div>\n                  <div className=\"col-span-2\">\n                    <Label htmlFor=\"message\">Message</Label>\n                    <Textarea\n                      className=\"mt-2 bg-white shadow-none\"\n                      id=\"message\"\n                      placeholder=\"Message\"\n                      rows={6}\n                    />\n                  </div>\n                  <div className=\"col-span-2 flex items-center gap-2\">\n                    <Checkbox className=\"bg-background\" id=\"acceptTerms\" />\n                    <Label className=\"gap-0\" htmlFor=\"acceptTerms\">\n                      You agree to our\n                      <Link className=\"ml-1 underline\" href=\"#\">\n                        terms and conditions\n                      </Link>\n                      <span>.</span>\n                    </Label>\n                  </div>\n                </div>\n                <Button className=\"mt-6 w-full\" size=\"lg\">\n                  Submit\n                </Button>\n              </form>\n            </CardContent>\n          </Card>\n        </div>\n      </div>\n    </div>\n  </div>\n);\n\nexport default Contact;\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}