"use client"; import * as React from "react"; import { type VariantProps, cva } from "class-variance-authority"; import { cn } from "@/lib/utils"; import { Table as ShadcnTable, TableBody as ShadcnTableBody, TableCaption as ShadcnTableCaption, TableCell as ShadcnTableCell, TableFooter as ShadcnTableFooter, TableHead as ShadcnTableHead, TableHeader as ShadcnTableHeader, TableRow as ShadcnTableRow, } from "@/components/ui/table"; import "./styles/retro.css"; export const tableVariants = cva("", { variants: { variant: { default: "p-4 py-2.5 border-y-6 border-foreground dark:border-ring", borderless: "", }, font: { normal: "", retro: "retro", }, }, defaultVariants: { font: "retro", variant: "default", }, }); function Table({ className, font, variant, ...props }: React.ComponentProps<"table"> & { font?: VariantProps["font"]; variant?: VariantProps["variant"]; }) { return (

{variant !== "borderless" && ( ); } function TableHeader({ className, ...props }: React.ComponentProps<"thead">) { return ( ); } function TableBody({ className, ...props }: React.ComponentProps<"tbody">) { return ; } function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) { return ; } function TableRow({ className, ...props }: React.ComponentProps<"tr">) { return ( ); } function TableHead({ className, ...props }: React.ComponentProps<"th">) { return ; } function TableCell({ className, ...props }: React.ComponentProps<"td">) { return ; } function TableCaption({ className, ...props }: React.ComponentProps<"caption">) { return ; } export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, };

Installation

Files

components

Styles