40 lines
1 KiB
TypeScript
40 lines
1 KiB
TypeScript
import React from 'react';
|
|
|
|
interface TableContainerProps {
|
|
title: string;
|
|
children: React.ReactNode;
|
|
buttons?: React.ReactNode;
|
|
className?: string;
|
|
}
|
|
|
|
const TableContainer: React.FC<TableContainerProps> = ({
|
|
title,
|
|
children,
|
|
buttons,
|
|
className = ''
|
|
}) => {
|
|
return (
|
|
<div className={`w-full bg-white rounded-lg shadow-sm overflow-hidden ${className}`}>
|
|
<div className="w-full">
|
|
<div className="border-b border-gray-200">
|
|
<div className="px-4 sm:px-6 py-4">
|
|
<div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
|
|
<h1 className="text-lg sm:text-xl font-semibold text-gray-900">{title}</h1>
|
|
{buttons && (
|
|
<div className="flex flex-wrap items-center gap-2">
|
|
{buttons}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="w-full overflow-hidden">
|
|
{children}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default TableContainer;
|