Files
HRM-System/resources/js/components/settings-section.tsx
2026-04-13 08:16:56 +08:00

36 lines
965 B
TypeScript
Executable File

import { ReactNode } from 'react';
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
interface SettingsSectionProps {
title: string;
description?: string;
children: ReactNode;
action?: ReactNode;
}
export function SettingsSection({ title, description, children, action }: SettingsSectionProps) {
return (
<Card className="mb-6">
<CardHeader className="pb-3">
<div className="flex items-center justify-between">
<div>
<CardTitle className="text-lg font-medium">{title}</CardTitle>
{description && (
<CardDescription className="mt-1.5">
{description}
</CardDescription>
)}
</div>
{action && (
<div>
{action}
</div>
)}
</div>
</CardHeader>
<CardContent>
{children}
</CardContent>
</Card>
);
}