53 lines
1.2 KiB
TypeScript
53 lines
1.2 KiB
TypeScript
import * as React from "react";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
export function Table({ children }: { children: React.ReactNode }) {
|
|
return (
|
|
<div className="overflow-x-auto rounded-xl border border-border bg-card">
|
|
<table className="w-full border-collapse text-sm">{children}</table>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function THead({ children }: { children: React.ReactNode }) {
|
|
return (
|
|
<thead className="border-b border-border bg-muted/50 text-left text-xs uppercase tracking-wide text-muted-foreground">
|
|
{children}
|
|
</thead>
|
|
);
|
|
}
|
|
|
|
export function TH({
|
|
children,
|
|
className,
|
|
}: {
|
|
children?: React.ReactNode;
|
|
className?: string;
|
|
}) {
|
|
return <th className={cn("px-4 py-3 font-medium", className)}>{children}</th>;
|
|
}
|
|
|
|
export function TR({
|
|
children,
|
|
className,
|
|
}: {
|
|
children: React.ReactNode;
|
|
className?: string;
|
|
}) {
|
|
return (
|
|
<tr className={cn("border-b border-border last:border-0 align-top", className)}>
|
|
{children}
|
|
</tr>
|
|
);
|
|
}
|
|
|
|
export function TD({
|
|
children,
|
|
className,
|
|
}: {
|
|
children?: React.ReactNode;
|
|
className?: string;
|
|
}) {
|
|
return <td className={cn("px-4 py-3 text-foreground", className)}>{children}</td>;
|
|
}
|