Footer Enterprise

1"use client";
2 
3import * as React from "react";
4import Link from "next/link";
5 
6/* ── types ─────────────────────────────────────────────────────── */
7interface FooterLink {
8  label: string;
9  href: string;
10}
11 
12interface FooterColumn {
13  title: string;
14  links: FooterLink[];
15}
16 
17interface FooterSocial {
18  icon: React.ComponentType<{ className?: string }>;
19  href: string;
20  label?: string;
21}
22 
23interface FooterEnterpriseProps {
24  /** Custom brand mark — any ReactNode (SVG, icon, emoji). Falls back to a default geometric mark. */
25  brandMark?: React.ReactNode;
26  brandName?: string;
27  description?: string;
28  columns?: FooterColumn[];
29  socials?: FooterSocial[];
30  bottomLinks?: FooterLink[];
31  copyright?: string;
32}
33 
34/* ── default mark ─────────────────────────────────────────────── */
35function DefaultMark() {
36  return (
37    <svg
38      width="20"
39      height="20"
40      viewBox="0 0 20 20"
41      fill="none"
42      className="size-5"
43      aria-hidden="true"
44    >
45      <rect width="20" height="20" rx="5" className="fill-foreground" />
46      <rect
47        x="5"
48        y="5"
49        width="10"
50        height="10"
51        rx="2.5"
52        className="fill-background"
53      />
54    </svg>
55  );
56}
57 
58/* ── defaults ─────────────────────────────────────────────────── */
59const defaults = {
60  brandName: "ruixen ui",
61  description:
62    "Modern, fast, and customizable React components — built with Tailwind CSS, TypeScript, and accessibility in mind.",
63  columns: [
64    {
65      title: "Product",
66      links: [
67        { label: "Components", href: "#" },
68        { label: "Templates", href: "#" },
69        { label: "Pro", href: "#" },
70        { label: "Pricing", href: "#" },
71      ],
72    },
73    {
74      title: "Solutions",
75      links: [
76        { label: "Startups", href: "#" },
77        { label: "Enterprise", href: "#" },
78        { label: "Developers", href: "#" },
79        { label: "Designers", href: "#" },
80      ],
81    },
82    {
83      title: "Developers",
84      links: [
85        { label: "Documentation", href: "#" },
86        { label: "API Reference", href: "#" },
87        { label: "CLI", href: "#" },
88        { label: "Changelog", href: "#" },
89      ],
90    },
91    {
92// … truncated