{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "footer11",
  "title": "Centered Social Footer",
  "description": "Vertically stacked footer with centered logo, navigation links, social media icons, and copyright. Perfect for portfolios and personal brands wanting a symmetrical layout.",
  "dependencies": [
    "clsx",
    "tailwind-merge",
    "lucide-react"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/footer11/footer11.tsx",
      "content": "\"use client\";\n\nimport { Github, Linkedin, Twitter } from \"lucide-react\";\nimport Link from \"next/link\";\nimport { cn } from \"@/lib/utils\";\n\ninterface NavLink {\n  label: string;\n  href?: string;\n}\n\ninterface SocialLink {\n  icon: \"twitter\" | \"github\" | \"linkedin\";\n  href?: string;\n  label?: string;\n}\n\ninterface Footer11Props {\n  logo?: {\n    text?: string;\n    href?: string;\n  };\n  navLinks?: NavLink[];\n  socialLinks?: SocialLink[];\n  copyright?: string;\n  className?: string;\n}\n\nconst socialIcons = {\n  twitter: Twitter,\n  github: Github,\n  linkedin: Linkedin,\n};\n\nexport const footer11Demo: Footer11Props = {\n  logo: {\n    text: \"Beste Inc.\",\n    href: \"https://beste.co\",\n  },\n  navLinks: [\n    { label: \"About\", href: \"https://beste.co\" },\n    { label: \"Features\", href: \"https://beste.co\" },\n    { label: \"Pricing\", href: \"https://beste.co\" },\n    { label: \"Blog\", href: \"https://beste.co\" },\n    { label: \"Contact\", href: \"https://beste.co\" },\n  ],\n  socialLinks: [\n    { icon: \"twitter\", href: \"https://beste.co\", label: \"Twitter\" },\n    { icon: \"github\", href: \"https://beste.co\", label: \"GitHub\" },\n    { icon: \"linkedin\", href: \"https://beste.co\", label: \"LinkedIn\" },\n  ],\n  copyright: \"© 2026 Beste Inc. All rights reserved.\",\n};\n\nexport function Footer11({\n  logo,\n  navLinks = [],\n  socialLinks = [],\n  copyright,\n  className,\n}: Footer11Props) {\n  return (\n    <footer className={cn(\"py-16 md:py-24\", className)}>\n      <div className=\"mx-auto max-w-6xl px-4 md:px-6\">\n        <div className=\"flex flex-col items-center text-center\">\n          {logo?.text && (\n            <Link\n              href={logo.href ?? \"#\"}\n              className=\"text-xl font-bold tracking-tight\"\n            >\n              {logo.text}\n            </Link>\n          )}\n          {navLinks.length > 0 && (\n            <nav className=\"mt-8 flex flex-wrap justify-center gap-4 md:gap-6\">\n              {navLinks.map((link, index) => (\n                <Link\n                  key={index}\n                  href={link.href ?? \"#\"}\n                  className=\"text-sm text-muted-foreground transition-colors hover:text-foreground\"\n                >\n                  {link.label}\n                </Link>\n              ))}\n            </nav>\n          )}\n          {socialLinks.length > 0 && (\n            <div className=\"mt-8 flex gap-4\">\n              {socialLinks.map((social, index) => {\n                const Icon = socialIcons[social.icon];\n                return (\n                  <Link\n                    key={index}\n                    href={social.href ?? \"#\"}\n                    className=\"text-muted-foreground transition-colors hover:text-foreground\"\n                    aria-label={social.label}\n                  >\n                    <Icon className=\"size-5\" />\n                  </Link>\n                );\n              })}\n            </div>\n          )}\n          {copyright && (\n            <p className=\"mt-8 text-sm text-muted-foreground\">{copyright}</p>\n          )}\n        </div>\n      </div>\n    </footer>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/beste/block/footer11.tsx"
    }
  ],
  "type": "registry:block"
}