59 lines
1.6 KiB
TypeScript
59 lines
1.6 KiB
TypeScript
"use client";
|
||
|
||
import Link from "next/link";
|
||
|
||
export type Crumb = { label: string; href?: string };
|
||
|
||
type Props = {
|
||
title: string;
|
||
crumbs: Crumb[];
|
||
note?: string;
|
||
underlineWidthClass?: string;
|
||
className?: string;
|
||
wrapClassName?: string;
|
||
hideFooterLine?: boolean;
|
||
hideGuideText?: boolean;
|
||
};
|
||
|
||
export default function SubPageHeader({
|
||
// title,
|
||
crumbs,
|
||
// note = "* 는 필수 값입니다.",
|
||
// underlineWidthClass = "w-40",
|
||
className = "",
|
||
wrapClassName = "",
|
||
// hideFooterLine = false,
|
||
// hideGuideText = false,
|
||
}: Props) {
|
||
return (
|
||
<section className={`text-black pr-[100px] ${className}`}>
|
||
<div className={`pb-5 ${wrapClassName}`}>
|
||
<div className="flex flex-col gap-5">
|
||
{/* 우측 브레드크럼 */}
|
||
<nav className="text-sm text-black/70" aria-label="breadcrumb">
|
||
{crumbs.map((c, i) => (
|
||
<span key={`${c.label}-${i}`}>
|
||
{c.href ? (
|
||
<Link href={c.href} className="hover:text-sky-500">
|
||
{c.label}
|
||
</Link>
|
||
) : (
|
||
<span className="text-black/90">{c.label}</span>
|
||
)}
|
||
{i < crumbs.length - 1 && <span className="mx-2">›</span>}
|
||
</span>
|
||
))}
|
||
</nav>
|
||
</div>
|
||
{/* 하단 라인 + 안내문 */}
|
||
{/* {!hideGuideText && (
|
||
<div className="mt-6 border-t border-black/10 pt-4 text-sm text-black/70">
|
||
<span className="text-red-400">*</span>
|
||
{note.replace("*", "")}
|
||
</div>
|
||
)} */}
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|