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

const tableRowVariants = cva({
  base: "border-b transition-colors",

  variants: {
    variant: {
      default: "hover:bg-muted/50 data-[state=selected]:bg-muted",
      primary: "hover:bg-primary/10 data-[state=selected]:bg-primary/20",
      accent: "hover:bg-accent/10 data-[state=selected]:bg-accent/20",
      muted: "hover:bg-muted/70 data-[state=selected]:bg-muted",
    },
  },
  defaultVariants: {
    variant: "default",
  },
});

export type TableRowProps = React.HTMLAttributes<HTMLTableRowElement> &
  VariantProps<typeof tableRowVariants>;

export const TableRow = React.forwardRef<HTMLTableRowElement, TableRowProps>(
  ({ className, variant, ...props }, ref) => (
    <tr
      ref={ref}
      className={cx(tableRowVariants({ variant }), className)}
      {...props}
    />
  ),
);
TableRow.displayName = "TableRow";