import type * as React from "react" import { cn } from "@/lib/utils" export type TableProps = React.ComponentProps<"table"> & { /** * When true, render only the `` (no inner overflow wrapper). * Use when the parent already provides scrolling so sticky headers work and you avoid nested scrollbars. */ disableScrollContainer?: boolean } export function Table({ className, disableScrollContainer, ...props }: TableProps): React.ReactElement { const tableClass = cn( "w-full caption-bottom in-data-[slot=frame]:border-separate in-data-[slot=frame]:border-spacing-0 text-sm", className ) if (disableScrollContainer) { return

} return (

) } export function TableHeader({ className, ...props }: React.ComponentProps<"thead">): React.ReactElement { return ( ) } export function TableBody({ className, ...props }: React.ComponentProps<"tbody">): React.ReactElement { return ( ) } export function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">): React.ReactElement { return ( tr]:last:border-b-0 in-data-[slot=frame]:*:[tr]:hover:bg-transparent", className )} data-slot="table-footer" {...props} /> ) } export function TableRow({ className, ...props }: React.ComponentProps<"tr">): React.ReactElement { return ( ) } export function TableHead({ className, ...props }: React.ComponentProps<"th">): React.ReactElement { return (

) }
) } export function TableCell({ className, ...props }: React.ComponentProps<"td">): React.ReactElement { return (	) } export function TableCaption({ className, ...props }: React.ComponentProps<"caption">): React.ReactElement { return (

Table

Installation

API

Table