{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "team-04",
  "title": "Team 04",
  "description": "A simple team block",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button"
  ],
  "files": [
    {
      "path": "src/registry/blocks/radix/team-04/components/team.tsx",
      "content": "import { DribbbleIcon, TwitchIcon, TwitterIcon } from \"lucide-react\";\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { Button } from \"@/registry/bases/radix/ui/button\";\n\nconst teamMembers = [\n  {\n    name: \"John Doe\",\n    title: \"Founder & CEO\",\n    bio: \"Former founder of Opendoor. Early staff at Spotify.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/3785079/pexels-photo-3785079.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n  {\n    name: \"Jane Doe\",\n    title: \"Engineering Manager\",\n    bio: \"Lead engineering teams at Figma and Protocol Labs.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/1520760/pexels-photo-1520760.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n  {\n    name: \"Bob Smith\",\n    title: \"Product Manager\",\n    bio: \"Former PM for Linear, Lambda School, and On Deck.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/91227/pexels-photo-91227.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n  {\n    name: \"Peter Johnson\",\n    title: \"Frontend Developer\",\n    bio: \"Former frontend dev for Linear, Coinbase, and Postscript.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/2379005/pexels-photo-2379005.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n  {\n    name: \"David Lee\",\n    title: \"Backend Developer\",\n    bio: \"Lead backend dev at Clearbit. Former Clearbit and Loom.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/2182970/pexels-photo-2182970.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n  {\n    name: \"Sarah Williams\",\n    title: \"Product Designer\",\n    bio: \"Founding design team at Figma. Former Pleo and Stripe.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/733872/pexels-photo-733872.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n  {\n    name: \"Michael Brown\",\n    title: \"UX Researcher\",\n    bio: \"Lead user research for Slack. Contractor for Netflix.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/1681010/pexels-photo-1681010.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n  {\n    name: \"Elizabeth Johnson\",\n    title: \"Customer Success\",\n    bio: \"Lead CX at Wealthsimple. Former PagerDuty.\",\n    imageUrl:\n      \"https://images.pexels.com/photos/2613260/pexels-photo-2613260.jpeg?auto=compress&cs=tinysrgb&w=600\",\n  },\n];\n\nconst Team = () => {\n  return (\n    <div className=\"mx-auto flex max-w-(--breakpoint-xl) flex-col justify-center gap-16 px-6 py-20 lg:px-8\">\n      <div className=\"mx-auto max-w-2xl text-center\">\n        <b className=\"text-center font-medium text-muted-foreground text-sm uppercase\">\n          We&apos;re hiring!\n        </b>\n        <h2 className=\"mt-3 font-medium text-4xl tracking-[-0.04em] sm:text-[2.75rem]\">\n          Team behind the product\n        </h2>\n        <p className=\"mt-4 text-pretty text-base text-muted-foreground sm:text-xl\">\n          Our philosophy is simple — hire a team of diverse, passionate people\n          and foster a culture that empowers you to do you best work.\n        </p>\n        <div className=\"mt-8 flex flex-col gap-3 sm:flex-row-reverse sm:justify-center\">\n          <Button size=\"lg\">Open Positions</Button>\n          <Button size=\"lg\" variant=\"outline\">\n            About Us\n          </Button>\n        </div>\n      </div>\n\n      <div className=\"grid w-full grid-cols-1 gap-x-10 gap-y-12 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4\">\n        {teamMembers.map((member) => (\n          <div\n            className=\"flex flex-col items-center rounded-lg bg-accent px-6 py-8 text-center\"\n            key={member.name}\n          >\n            <Image\n              alt={member.name}\n              className=\"h-16 w-16 shrink-0 rounded-full bg-accent object-cover sm:h-20 sm:w-20\"\n              height={120}\n              src={member.imageUrl}\n              width={120}\n            />\n            <h3 className=\"mt-5 font-medium text-lg\">{member.name}</h3>\n            <p className=\"text-muted-foreground text-sm\">{member.title}</p>\n            <p className=\"mt-3 mb-6 text-pretty\">{member.bio}</p>\n            <div className=\"mt-auto flex items-center gap-4\">\n              <Link href=\"#\" target=\"_blank\">\n                <TwitterIcon className=\"h-5 w-5 stroke-muted-foreground\" />\n              </Link>\n              <Link href=\"#\" target=\"_blank\">\n                <DribbbleIcon className=\"h-5 w-5 stroke-muted-foreground\" />\n              </Link>\n              <Link href=\"#\" target=\"_blank\">\n                <TwitchIcon className=\"h-5 w-5 stroke-muted-foreground\" />\n              </Link>\n            </div>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default Team;\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}