// "use client" // uncomment when required for: hooks, event handlers, browser APIs /** * @name Footer 05 * @description A mega footer with extensive sitemap-style navigation. * Multiple column groups organized by category with detailed links. * * @slots footer, footer-container, footer-top, footer-brand, footer-brand-logo, * footer-brand-name, footer-brand-description, footer-columns, footer-column-group, * footer-column-group-title, footer-column, footer-column-title, footer-column-links, * footer-link, footer-link-badge, footer-bottom, footer-bottom-left, footer-copyright, * footer-bottom-right, footer-legal-links, footer-legal-link * @variant mega * * @registryDependencies * @dependencies */ import * as React from "react" import { cn } from "@/registry/lib/utils" // ============================================================================ // TYPES // ============================================================================ interface FooterLinkConfig { id: string label: string href: string badge?: string } interface FooterColumnConfig { id: string title: string links: FooterLinkConfig[] } interface FooterColumnGroupConfig { id: string title: string columns: FooterColumnConfig[] } interface Footer05Props { brandName?: string brandLogo?: string brandDescription?: string columnGroups?: FooterColumnGroupConfig[] legalLinks?: FooterLinkConfig[] copyright?: string className?: string idBase?: string } // ============================================================================ // DEFAULT DATA // ============================================================================ const defaultColumnGroups: FooterColumnGroupConfig[] = [ { id: "group-1", title: "Products", columns: [ { id: "col-1", title: "Platform", links: [ { id: "link-1", label: "Overview", href: "#" }, { id: "link-2", label: "Features", href: "#" }, { id: "link-3", label: "Integrations", href: "#" }, { id: "link-4", label: "Pricing", href: "#" }, ], }, { id: "col-2", title: "Solutions", links: [ { id: "link-5", label: "Enterprise", href: "#" }, { id: "link-6", label: "Startups", href: "#" }, { id: "link-7", label: "Teams", href: "#" }, { id: "link-8", label: "Developers", href: "#" }, ], }, ], }, { id: "group-2", title: "Resources", columns: [ { id: "col-3", title: "Learn", links: [ { id: "link-9", label: "Documentation", href: "#" }, { id: "link-10", label: "Tutorials", href: "#" }, { id: "link-11", label: "API Reference", href: "#" }, { id: "link-12", label: "Guides", href: "#" }, ], }, { id: "col-4", title: "Community", links: [ { id: "link-13", label: "Blog", href: "#" }, { id: "link-14", label: "Forum", href: "#" }, { id: "link-15", label: "Discord", href: "#", badge: "New" }, { id: "link-16", label: "Events", href: "#" }, ], }, ], }, { id: "group-3", title: "Company", columns: [ { id: "col-5", title: "About", links: [ { id: "link-17", label: "Our Story", href: "#" }, { id: "link-18", label: "Careers", href: "#", badge: "Hiring" }, { id: "link-19", label: "Press", href: "#" }, { id: "link-20", label: "Partners", href: "#" }, ], }, { id: "col-6", title: "Support", links: [ { id: "link-21", label: "Help Center", href: "#" }, { id: "link-22", label: "Contact", href: "#" }, { id: "link-23", label: "Status", href: "#" }, { id: "link-24", label: "Security", href: "#" }, ], }, ], }, ] const defaultLegalLinks: FooterLinkConfig[] = [ { id: "legal-1", label: "Privacy Policy", href: "#" }, { id: "legal-2", label: "Terms of Service", href: "#" }, { id: "legal-3", label: "Cookie Policy", href: "#" }, { id: "legal-4", label: "GDPR", href: "#" }, ] // ============================================================================ // COMPONENT // ============================================================================ function Footer05({ brandName = "Acme Inc", brandLogo, brandDescription = "Building the future of software development with modern tools and best practices.", columnGroups = defaultColumnGroups, legalLinks = defaultLegalLinks, copyright = `© ${new Date().getFullYear()} Acme Inc. All rights reserved.`, className, idBase = "footer-05", }: Footer05Props) { const headingId = `${idBase}-heading` return ( ) } export default Footer05 export { Footer05, type Footer05Props }