{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "footer-block-shadcnui",
  "type": "registry:block",
  "title": "Footer Block",
  "description": "Comprehensive footer with links, newsletter signup, social icons, and scroll-to-top",
  "registryDependencies": [
    "button"
  ],
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-shadcn/src/components/sections/footer-block.tsx",
      "content": "\"use client\";\n\nimport { Badge } from \"@/components/ui/badge\";\nimport { Button } from \"@/components/ui/button\";\nimport { Card } from \"@/components/ui/card\";\nimport { Input } from \"@/components/ui/input\";\nimport { motion, useReducedMotion } from \"framer-motion\";\nimport {\n  ArrowUp,\n  Facebook,\n  Github,\n  Instagram,\n  Linkedin,\n  Mail,\n  MapPin,\n  Phone,\n  Twitter,\n} from \"lucide-react\";\n\nconst footerLinks = [\n  {\n    title: \"Product\",\n    links: [\"Features\", \"Pricing\", \"Documentation\", \"API Reference\"],\n  },\n  {\n    title: \"Company\",\n    links: [\"About Us\", \"Careers\", \"Blog\", \"Press Kit\"],\n  },\n  {\n    title: \"Resources\",\n    links: [\"Community\", \"Help Center\", \"Partners\", \"Status\"],\n  },\n  {\n    title: \"Legal\",\n    links: [\"Privacy\", \"Terms\", \"Cookie Policy\", \"Licenses\"],\n  },\n];\n\nconst socialLinks = [\n  { icon: Twitter, label: \"Twitter\", href: \"#\" },\n  { icon: Facebook, label: \"Facebook\", href: \"#\" },\n  { icon: Instagram, label: \"Instagram\", href: \"#\" },\n  { icon: Linkedin, label: \"LinkedIn\", href: \"#\" },\n  { icon: Github, label: \"GitHub\", href: \"#\" },\n];\n\nexport function FooterBlock() {\n  const scrollToTop = () => {\n    window.scrollTo({ top: 0, behavior: \"smooth\" });\n  };\n\n  const shouldReduceMotion = useReducedMotion();\n\n  return (\n    <footer\n      aria-labelledby=\"footer-heading\"\n      className=\"relative w-full overflow-hidden border-t border-border bg-card/90 backdrop-blur-xl\"\n    >\n      <div aria-hidden className=\"pointer-events-none absolute inset-0 -z-10\">\n        <motion.div\n          className=\"absolute -top-32 left-1/2 h-80 w-80 -translate-x-1/2 rounded-full bg-primary/20 blur-[160px]\"\n          animate={\n            shouldReduceMotion\n              ? undefined\n              : { opacity: [0.2, 0.45, 0.2], scale: [0.9, 1.05, 0.95] }\n          }\n          transition={\n            shouldReduceMotion\n              ? undefined\n              : { duration: 12, repeat: Infinity, ease: \"easeInOut\" }\n          }\n        />\n        <motion.div\n          className=\"absolute -bottom-36 right-0 h-96 w-96 rounded-full bg-[hsl(var(--primary)_/_0.18)] blur-[200px]\"\n          animate={\n            shouldReduceMotion\n              ? undefined\n              : { opacity: [0.18, 0.4, 0.18], rotate: [0, 25, 0] }\n          }\n          transition={\n            shouldReduceMotion\n              ? undefined\n              : { duration: 16, repeat: Infinity, ease: \"linear\" }\n          }\n        />\n      </div>\n      <h2 id=\"footer-heading\" className=\"sr-only\">\n        Site footer\n      </h2>\n      {/* Main Footer Content */}\n      <div className=\"mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8\">\n        <div className=\"grid gap-8 md:grid-cols-2 lg:grid-cols-6\">\n          {/* Brand & Newsletter */}\n          <motion.div\n            initial={{ opacity: 0, y: 20 }}\n            whileInView={{ opacity: 1, y: 0 }}\n            viewport={{ once: true }}\n            transition={{ duration: 0.5 }}\n            className=\"lg:col-span-2\"\n          >\n            <motion.div\n              whileHover={shouldReduceMotion ? undefined : { scale: 1.05 }}\n              transition={{ duration: 0.2 }}\n              className=\"mb-4 inline-flex items-center gap-3\"\n            >\n              <Card className=\"rounded-2xl border border-border/60 bg-card/80 px-3 py-1 text-xs uppercase tracking-[0.32em] text-muted-foreground shadow-[0_10px_30px_-20px_rgba(15,23,42,0.8)]\">\n                Brand\n              </Card>\n              <Badge\n                variant=\"outline\"\n                className=\"text-xs text-muted-foreground\"\n              >\n                Since 2018\n              </Badge>\n            </motion.div>\n            <p className=\"mb-4 max-w-md text-sm text-muted-foreground\">\n              Building amazing products with modern technologies. Join us on our\n              journey to create better user experiences.\n            </p>\n\n            {/* Newsletter */}\n            <div className=\"mb-4\">\n              <p className=\"mb-2 text-sm font-medium text-foreground\">\n                Subscribe to our newsletter\n              </p>\n              <div className=\"flex gap-2\">\n                <Input\n                  type=\"email\"\n                  placeholder=\"Enter your email\"\n                  className=\"h-10 rounded-xl border-border/60 bg-background/60 backdrop-blur placeholder:text-muted-foreground\"\n                />\n                <Button\n                  size=\"sm\"\n                  className=\"h-10 rounded-xl border border-border/60 bg-primary/90 px-4 text-primary-foreground shadow-[0_12px_35px_-20px_rgba(15,23,42,0.7)] hover:bg-primary\"\n                  aria-label=\"Subscribe\"\n                >\n                  <Mail className=\"h-4 w-4\" aria-hidden />\n                </Button>\n              </div>\n            </div>\n\n            {/* Contact Info */}\n            <div className=\"space-y-2 text-sm text-muted-foreground\">\n              <motion.div\n                whileHover={shouldReduceMotion ? undefined : { x: 5 }}\n                className=\"flex items-center gap-2\"\n              >\n                <MapPin className=\"h-4 w-4\" aria-hidden />\n                <span>123 Business St, City 12345</span>\n              </motion.div>\n              <motion.div\n                whileHover={shouldReduceMotion ? undefined : { x: 5 }}\n                className=\"flex items-center gap-2\"\n              >\n                <Phone className=\"h-4 w-4\" aria-hidden />\n                <span>+1 (555) 123-4567</span>\n              </motion.div>\n              <motion.div\n                whileHover={shouldReduceMotion ? undefined : { x: 5 }}\n                className=\"flex items-center gap-2\"\n              >\n                <Mail className=\"h-4 w-4\" aria-hidden />\n                <span>hello@example.com</span>\n              </motion.div>\n            </div>\n          </motion.div>\n\n          {/* Footer Links */}\n          {footerLinks.map((section, sectionIndex) => (\n            <motion.div\n              key={section.title}\n              initial={{ opacity: 0, y: 20 }}\n              whileInView={{ opacity: 1, y: 0 }}\n              viewport={{ once: true }}\n              transition={{ duration: 0.5, delay: sectionIndex * 0.1 }}\n            >\n              <h4 className=\"mb-4 text-sm font-semibold text-foreground/90\">\n                {section.title}\n              </h4>\n              <ul className=\"space-y-2\">\n                {section.links.map((link, linkIndex) => (\n                  <motion.li\n                    key={link}\n                    initial={{ opacity: 0, x: -10 }}\n                    whileInView={{ opacity: 1, x: 0 }}\n                    viewport={{ once: true }}\n                    transition={{ delay: linkIndex * 0.05 }}\n                  >\n                    <motion.a\n                      href=\"#\"\n                      whileHover={\n                        shouldReduceMotion\n                          ? undefined\n                          : { x: 5, color: \"hsl(var(--primary))\" }\n                      }\n                      className=\"text-sm text-muted-foreground transition-colors hover:text-foreground\"\n                    >\n                      {link}\n                    </motion.a>\n                  </motion.li>\n                ))}\n              </ul>\n            </motion.div>\n          ))}\n        </div>\n\n        {/* Divider */}\n        <motion.div\n          initial={{ scaleX: 0 }}\n          whileInView={{ scaleX: 1 }}\n          viewport={{ once: true }}\n          transition={{ duration: 0.8, delay: 0.4 }}\n          className=\"my-10 h-px bg-border/70\"\n        />\n\n        {/* Bottom Bar */}\n        <div className=\"flex flex-col items-center justify-between gap-4 md:flex-row\">\n          {/* Social Links */}\n          <motion.div\n            initial={{ opacity: 0 }}\n            whileInView={{ opacity: 1 }}\n            viewport={{ once: true }}\n            transition={{ delay: 0.5 }}\n            className=\"flex gap-2\"\n          >\n            {socialLinks.map((social, index) => (\n              <motion.div\n                key={social.label}\n                initial={{ scale: 0 }}\n                whileInView={{ scale: 1 }}\n                viewport={{ once: true }}\n                transition={{\n                  type: \"spring\",\n                  stiffness: 300,\n                  damping: 20,\n                  delay: 0.6 + index * 0.05,\n                }}\n              >\n                <Button\n                  size=\"icon\"\n                  variant=\"ghost\"\n                  className=\"h-9 w-9 rounded-full border border-border/60 bg-white/5 text-muted-foreground transition-colors hover:bg-primary/10 hover:text-primary\"\n                  aria-label={social.label}\n                >\n                  <motion.div\n                    transition={{ duration: shouldReduceMotion ? 0.25 : 0.3 }}\n                  >\n                    <social.icon className=\"h-4 w-4\" aria-hidden />\n                  </motion.div>\n                </Button>\n              </motion.div>\n            ))}\n          </motion.div>\n\n          {/* Copyright */}\n          <motion.div\n            initial={{ opacity: 0 }}\n            whileInView={{ opacity: 1 }}\n            viewport={{ once: true }}\n            transition={{ delay: 0.6 }}\n            className=\"flex items-center gap-2 text-sm text-muted-foreground\"\n          >\n            <span>© 2024 Brand. All rights reserved.</span>\n            <Badge variant=\"outline\" className=\"text-xs\">\n              v1.0.0\n            </Badge>\n          </motion.div>\n\n          {/* Scroll to Top */}\n          <motion.div\n            initial={{ opacity: 0 }}\n            whileInView={{ opacity: 1 }}\n            viewport={{ once: true }}\n            transition={{ delay: 0.7 }}\n          >\n            <Button\n              size=\"icon\"\n              variant=\"outline\"\n              className=\"h-9 w-9 rounded-full border-border/60\"\n              onClick={scrollToTop}\n            >\n              <motion.div\n                animate={shouldReduceMotion ? undefined : { y: [0, -3, 0] }}\n                transition={\n                  shouldReduceMotion\n                    ? undefined\n                    : { repeat: Infinity, duration: 1.5 }\n                }\n              >\n                <ArrowUp className=\"h-4 w-4\" aria-hidden />\n              </motion.div>\n            </Button>\n          </motion.div>\n        </div>\n      </div>\n    </footer>\n  );\n}\n",
      "type": "registry:block",
      "target": "components/uitripled/footer-block-shadcnui.tsx"
    }
  ]
}