import type { Ref, RefAttributes, ReactNode } from "react";
import classNames from "classnames/dedupe";

export interface CellProps extends RefAttributes<HTMLTableCellElement> {
  children?: ReactNode;
  className?: string;
  colSpan?: number;
  rowSpan?: number;
}

export type CellRef = Ref<HTMLTableCellElement>;

const Cell = ({ ref, ...props }: CellProps) => {
  const classes = classNames(
    "mobius",
    "mobius-table__body-cell",
    props.className,
  );

  return <td ref={ref} {...props} className={classes} />;
};

Cell.displayName = "Table.Cell";
export { Cell };
