115 lines
3.4 KiB
TypeScript
115 lines
3.4 KiB
TypeScript
"use client";
|
|
|
|
import { memo } from "react";
|
|
import Image from "next/image";
|
|
import SocialLinks from "@/components/shared/SocialLinks";
|
|
import FooterColumns from "@/components/shared/FooterColumns";
|
|
import { cls } from "@/lib/utils";
|
|
import type { SocialLink } from "@/components/shared/SocialLinks";
|
|
import type { FooterColumn } from "@/components/shared/FooterColumns";
|
|
|
|
interface FooterSocialProps {
|
|
logoSrc?: string;
|
|
logoText?: string;
|
|
logoWidth?: number;
|
|
logoHeight?: number;
|
|
columns: FooterColumn[];
|
|
socialLinks?: SocialLink[];
|
|
copyrightText?: string;
|
|
ariaLabel?: string;
|
|
className?: string;
|
|
containerClassName?: string;
|
|
logoContainerClassName?: string;
|
|
logoClassName?: string;
|
|
logoTextClassName?: string;
|
|
copyrightTextClassName?: string;
|
|
socialContainerClassName?: string;
|
|
socialIconClassName?: string;
|
|
columnsClassName?: string;
|
|
columnClassName?: string;
|
|
columnTitleClassName?: string;
|
|
columnItemClassName?: string;
|
|
}
|
|
|
|
const FooterSocial = memo<FooterSocialProps>(function FooterSocial({
|
|
logoSrc,
|
|
logoText = "Webild",
|
|
logoWidth = 120,
|
|
logoHeight = 40,
|
|
columns,
|
|
socialLinks,
|
|
copyrightText = "© Finerpoint, Inc. 2025",
|
|
ariaLabel = "Site footer",
|
|
className = "",
|
|
containerClassName = "",
|
|
logoContainerClassName = "",
|
|
logoClassName = "",
|
|
logoTextClassName = "",
|
|
copyrightTextClassName = "",
|
|
socialContainerClassName = "",
|
|
socialIconClassName = "",
|
|
columnsClassName = "",
|
|
columnClassName = "",
|
|
columnTitleClassName = "",
|
|
columnItemClassName = "",
|
|
}) {
|
|
return (
|
|
<footer
|
|
role="contentinfo"
|
|
aria-label={ariaLabel}
|
|
className={cls("relative overflow-hidden w-full text-foreground py-15", className)}
|
|
>
|
|
<div
|
|
className={cls("relative w-content-width mx-auto", containerClassName)}
|
|
>
|
|
<div className="flex flex-col md:flex-row gap-14 md:gap-20 justify-between">
|
|
<div className={cls("flex flex-col gap-15", logoContainerClassName)}>
|
|
<div className="flex flex-col gap-0">
|
|
{logoSrc ? (
|
|
<div className="flex-shrink-0">
|
|
<Image
|
|
src={logoSrc}
|
|
alt="Logo"
|
|
width={logoWidth}
|
|
height={logoHeight}
|
|
className={cls("object-contain", logoClassName)}
|
|
unoptimized={logoSrc.startsWith('http') || logoSrc.startsWith('//')}
|
|
aria-hidden={true}
|
|
/>
|
|
</div>
|
|
) : (
|
|
<h2 className={cls("text-4xl font-medium", logoTextClassName)}>
|
|
{logoText}
|
|
</h2>
|
|
)}
|
|
<p className={cls("text-sm text-accent/75", copyrightTextClassName)}>
|
|
{copyrightText}
|
|
</p>
|
|
</div>
|
|
|
|
{socialLinks && socialLinks.length > 0 && (
|
|
<SocialLinks
|
|
socialLinks={socialLinks}
|
|
className={socialContainerClassName}
|
|
iconClassName={socialIconClassName}
|
|
/>
|
|
)}
|
|
</div>
|
|
|
|
<FooterColumns
|
|
columns={columns}
|
|
className={columnsClassName}
|
|
columnClassName={columnClassName}
|
|
columnTitleClassName={columnTitleClassName}
|
|
columnItemClassName={columnItemClassName}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
});
|
|
|
|
FooterSocial.displayName = "FooterSocial";
|
|
|
|
export default FooterSocial;
|