import type { VariantProps } from "@karma/cva";
import { cva, cx } from "@karma/cva";
import * as React from "react";

const tableHeadVariants = cva({
  base: "h-12 px-4 text-left align-middle font-medium [&:has([role=checkbox])]:pr-0",

  variants: {
    variant: {
      default: "text-muted-foreground",
      primary: "text-primary",
      accent: "text-accent",
      muted: "text-muted-foreground",
    },
  },
  defaultVariants: {
    variant: "default",
  },
});

export type TableHeadProps = React.ThHTMLAttributes<HTMLTableCellElement> &
  VariantProps<typeof tableHeadVariants>;

const TableHead = React.forwardRef<HTMLTableCellElement, TableHeadProps>(
  ({ className, variant, ...props }, ref) => (
    <th
      ref={ref}
      className={cx(tableHeadVariants({ variant }), className)}
      {...props}
    />
  ),
);
TableHead.displayName = "TableHead";

export { TableHead };