25 lines
717 B
TypeScript
25 lines
717 B
TypeScript
|
import type { ReactNode } from "react";
|
||
|
|
|
||
|
|
export function SectionCard({
|
||
|
|
title,
|
||
|
|
description,
|
||
|
|
children,
|
||
|
|
footer,
|
||
|
|
}: {
|
||
|
|
title: string;
|
||
|
|
description?: string;
|
||
|
|
children: ReactNode;
|
||
|
|
footer?: ReactNode;
|
||
|
|
}) {
|
||
|
|
return (
|
||
|
|
<section className="rounded-2xl bg-white shadow-sm ring-1 ring-gray-100">
|
||
|
|
<header className="border-b border-gray-100 px-6 py-5">
|
||
|
|
<h2 className="text-lg font-semibold text-gray-900">{title}</h2>
|
||
|
|
{description ? <p className="mt-1 text-sm text-gray-500">{description}</p> : null}
|
||
|
|
</header>
|
||
|
|
<div className="space-y-5 px-6 py-6">{children}</div>
|
||
|
|
{footer ? <div className="border-t border-gray-100 px-6 py-4">{footer}</div> : null}
|
||
|
|
</section>
|
||
|
|
);
|
||
|
|
}
|