30 lines
803 B
TypeScript
30 lines
803 B
TypeScript
import type { ReactNode } from "react";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface SettingsGroupProps {
|
|
title: string;
|
|
description?: string;
|
|
children: ReactNode;
|
|
className?: string;
|
|
}
|
|
|
|
export function SettingsGroup({ title, description, children, className }: SettingsGroupProps) {
|
|
return (
|
|
<section
|
|
className={cn(
|
|
"surface-panel rounded-[1.7rem] border-0 px-4 py-5 shadow-none sm:px-6",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="space-y-1">
|
|
<h3 className="text-foreground text-sm font-semibold tracking-tight">{title}</h3>
|
|
{description ? (
|
|
<p className="text-muted-foreground text-[13px] leading-relaxed">{description}</p>
|
|
) : null}
|
|
</div>
|
|
<div className="mt-5 space-y-4">{children}</div>
|
|
</section>
|
|
);
|
|
}
|