Footer 3

1"use client";
2 
3import SmoothButton from "@/components/smoothui/smooth-button";
4import { Github, Linkedin, Twitter, Youtube } from "lucide-react";
5import { motion, useReducedMotion } from "motion/react";
6import type { ReactNode } from "react";
7 
8const ANIMATION_DURATION = 0.25;
9const DELAY_INCREMENT = 0.05;
10const HOVER_SCALE = 1.1;
11const TAP_SCALE = 0.95;
12const DELAY_NEWSLETTER = 6;
13const DELAY_BOTTOM = 7;
14 
15export interface FooterMegaProps {
16  columns?: Array<{
17    title: string;
18    links: Array<{ label: string; href: string }>;
19  }>;
20  copyright?: string;
21  description?: string;
22  logo?: ReactNode;
23  newsletter?: {
24    title: string;
25    description: string;
26    placeholder: string;
27    buttonText: string;
28  };
29  socialLinks?: Array<{
30    icon: ReactNode;
31    href: string;
32    label: string;
33  }>;
34}
35 
36const defaultColumns = [
37  {
38    links: [
39      { href: "#features", label: "Features" },
40      { href: "#pricing", label: "Pricing" },
41      { href: "#changelog", label: "Changelog" },
42      { href: "#docs", label: "Documentation" },
43    ],
44    title: "Product",
45  },
46  {
47    links: [
48      { href: "#about", label: "About" },
49      { href: "#blog", label: "Blog" },
50      { href: "#careers", label: "Careers" },
51      { href: "#contact", label: "Contact" },
52    ],
53    title: "Company",
54  },
55  {
56    links: [
57      { href: "#community", label: "Community" },
58      { href: "#github", label: "GitHub" },
59      { href: "#discord", label: "Discord" },
60      { href: "#help", label: "Help Center" },
61    ],
62    title: "Resources",
63  },
64  {
65    links: [
66      { href: "#privacy", label: "Privacy Policy" },
67      { href: "#terms", label: "Terms of Service" },
68      { href: "#cookies", label: "Cookie Policy" },
69    ],
70    title: "Legal",
71  },
72];
73 
74const defaultSocialLinks = [
75  {
76    href: "https://twitter.com",
77    icon: <Twitter className="h-5 w-5" />,
78    label: "Twitter",
79  },
80  {
81    href: "https://github.com",
82    icon: <Github className="h-5 w-5" />,
83    label: "GitHub",
84  },
85  {
86    href: "https://linkedin.com",
87    icon: <Linkedin className="h-5 w-5" />,
88    label: "LinkedIn",
89  },
90  {
91    href: "https://youtube.com",
92    icon: <Youtube className="h-5 w-5" />,
93    label: "YouTube",
94  },
95];
96 
97export const FooterMega = ({
98  logo = <span className="font-bold text-2xl text-foreground">SmoothUI</span>,
99  description = "Beautiful animated React components for building modern user interfaces with smooth animations and delightful interactions.",
100  columns = defaultColumns,
101// … truncated