{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "team-section-1",
  "title": "Team Section 1",
  "description": "Team member showcase with social links and descriptions",
  "dependencies": [
    "@icons-pack/react-simple-icons"
  ],
  "registryDependencies": [
    "avatar",
    "https://shadcndesign-free.vercel.app/r/styles.json",
    "https://shadcndesign-free.vercel.app/r/tagline.json"
  ],
  "files": [
    {
      "path": "components/pro-blocks/landing-page/team-sections/team-section-1.tsx",
      "content": "\"use client\";\n\nimport { Avatar, AvatarImage } from \"@/components/ui/avatar\";\nimport Link from \"next/link\";\nimport { Tagline } from \"@/components/pro-blocks/landing-page/tagline\";\nimport { SiFacebook, SiInstagram, SiX } from \"@icons-pack/react-simple-icons\";\n\nexport function TeamSection1() {\n  const teamMembers = [\n    {\n      name: \"Ricky Smith\",\n      role: \"CEO\",\n      description:\n        \"Leads the company with a clear vision, guiding strategic growth and fostering innovation to ensure long-term success.\",\n      facebook: \"#\",\n      instagram: \"#\",\n      x: \"#\",\n      image: \"https://github.com/shadcn.png\",\n    },\n    {\n      name: \"Kurt Bates\",\n      role: \"Innovation Specialist\",\n      description:\n        \"Drives innovation efforts, exploring new technologies and strategies to keep the company ahead of industry trends.\",\n      facebook: \"#\",\n      instagram: \"#\",\n      x: \"#\",\n      image: \"https://github.com/shadcn.png\",\n    },\n    {\n      name: \"Dennis Callis\",\n      role: \"Designer\",\n      description:\n        \"Creates beautiful, innovative, and functional designs that effectively communicate the brand and engage the audience.\",\n      facebook: \"#\",\n      instagram: \"#\",\n      x: \"#\",\n      image: \"https://github.com/shadcn.png\",\n    },\n    {\n      name: \"Frances Swann\",\n      role: \"UI/UX Designer\",\n      description:\n        \"Crafts seamless, intuitive user interfaces and experiences that ensure products are both easy to use and visually appealing.\",\n      facebook: \"#\",\n      instagram: \"#\",\n      x: \"#\",\n      image: \"https://github.com/shadcn.png\",\n    },\n    {\n      name: \"Corina McCoy\",\n      role: \"Culture Curator\",\n      description:\n        \"Nurtures company culture, ensuring a positive, inclusive environment where creativity, collaboration, and growth thrive.\",\n      facebook: \"#\",\n      instagram: \"#\",\n      x: \"#\",\n      image: \"https://github.com/shadcn.png\",\n    },\n    {\n      name: \"Rhonda Rhodes\",\n      role: \"Innovation Specialist\",\n      description:\n        \"Shapes and communicates the brand's identity, developing strategies that enhance recognition and build lasting customer loyalty.\",\n      facebook: \"#\",\n      instagram: \"#\",\n      x: \"#\",\n      image: \"https://github.com/shadcn.png\",\n    },\n  ];\n\n  return (\n    <section className=\"bg-background section-padding-y\">\n      <div className=\"container-padding-x mx-auto max-w-7xl\">\n        <div className=\"flex flex-col items-center gap-10 md:gap-12\">\n          <div className=\"section-title-gap-lg flex max-w-xl flex-col items-center text-center\">\n            <Tagline>Team section</Tagline>\n            <h2 className=\"heading-lg text-foreground\">\n              Showcase that builds connection\n            </h2>\n            <p className=\"text-muted-foreground text-lg/8 text-pretty\">\n              Add a concise value statement that highlights your team's\n              expertise and culture while maintaining a professional tone.\n            </p>\n          </div>\n\n          <div className=\"grid grid-cols-1 gap-12 md:grid-cols-2 lg:grid-cols-3 lg:gap-x-6 lg:gap-y-12\">\n            {teamMembers.map((member, index) => (\n              <div\n                key={index}\n                className=\"flex flex-col items-center gap-4 text-center\"\n              >\n                <div className=\"flex flex-col items-center gap-4\">\n                  <Avatar className=\"h-16 w-16 rounded-xl\">\n                    <AvatarImage src={member.image} alt={member.name} />\n                  </Avatar>\n                  <div className=\"flex flex-col\">\n                    <p className=\"text-foreground text-base font-semibold\">\n                      {member.name}\n                    </p>\n                    <p className=\"text-muted-foreground text-base\">\n                      {member.role}\n                    </p>\n                  </div>\n                </div>\n                <p className=\"text-muted-foreground text-base\">\n                  {member.description}\n                </p>\n                <div className=\"flex gap-4\">\n                  <Link\n                    href={member.facebook}\n                    target=\"_blank\"\n                    className=\"text-muted-foreground hover:text-primary cursor-pointer\"\n                  >\n                    <SiFacebook className=\"size-6\" />\n                  </Link>\n                  <Link\n                    href={member.x}\n                    target=\"_blank\"\n                    className=\"text-muted-foreground hover:text-primary cursor-pointer\"\n                  >\n                    <SiInstagram className=\"size-6\" />\n                  </Link>\n                  <Link\n                    href={member.x}\n                    target=\"_blank\"\n                    className=\"text-muted-foreground hover:text-primary cursor-pointer\"\n                  >\n                    <SiX className=\"size-6\" />\n                  </Link>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </div>\n    </section>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/pro-blocks/landing-page/team-sections/team-section-1.tsx"
    }
  ],
  "type": "registry:component"
}