import React from 'react';
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
import type { FlexAxisValue, FlexSpaceCommon } from '@coinbase/cds-common/types/BoxBaseProps';
import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
import { type CellBaseProps } from '../cells/Cell';
import { type TextBaseProps } from '../typography/Text';
export type TableCellTag = 'td' | 'th' | 'div';
type TableCellSharedProps = (React.TdHTMLAttributes<HTMLTableCellElement> &
  React.ThHTMLAttributes<HTMLTableCellElement>) &
  SharedProps;
export type TableCellBaseProps = TableCellSharedProps & {
  /**
   * Element (icon, asset, image, etc) to display at the start of the cell
   * @default undefined
   */
  start?: React.ReactElement;
  /**
   * Element (icon, asset, image, etc) to display at the end of the cell
   * @default undefined
   */
  end?: React.ReactElement;
  /**
   * The color for all text components rendered inside the TableCell.
   * Use titleColor and subtitleColor if you need to be more specific
   * @default undefined
   */
  color?: ThemeVars.Color | 'currentColor';
  /**
   * This prop us useful for right-aligning the last column
   * @default 'flex-start'
   */
  justifyContent?: FlexAxisValue | FlexSpaceCommon | 'space-evenly';
  /**
   * This prop us useful for aligning the last item to the right, or top-aligning cells
   * @default 'center'
   */
  alignItems?: CellBaseProps['alignItems'];
  /**
   * The colSpan attribute defines the number of columns a cell should span
   * @default 1
   */
  colSpan?: number;
  /**
   * Used for <th> elements. Defines the cells that the header element relates to
   */
  scope?: 'col' | 'row' | 'colgroup' | 'rowgroup';
  /**
   * Should the title/subtitle text truncate
   * @default false
   */
  overflow?: TextBaseProps['overflow'];
  /**
   * Direction provides content flow control.
   * Use vertical to inherit a VStask, horizontal for an HStack
   * @default vertical
   */
  direction?: 'vertical' | 'horizontal';
  /**
   * As a convenience, the width prop will set the css width and maxWidth props
   * @default undefined
   */
  width?: TableCellSharedProps['width'];
  /**
   * The spacing to use on the parent wrapper of Cell
   */
  outerSpacing?: CellBaseProps['outerSpacing'];
  /**
   * The spacing to use on the inner content of Cell
   * @default { spacingHorizontal: 0 }
   */
  innerSpacing?: CellBaseProps['innerSpacing'];
};
type TableCellPropsWithInputs = TableCellBaseProps & {
  /** Children to render within the cell. */
  children?: never;
  /**
   * If a title is provided, the default type style
   * will be inferred from context. If the cell is rendered
   * in a TableHeader, it will render with font="headline". But when
   * rendered in a TableBody the text will render with font="body".
   * @default undefined
   */
  title: string;
  titleColor?: ThemeVars.Color | 'currentColor';
  /**
   * A subtitle will appear below the title with font="label2".
   * @default undefined
   */
  subtitle?: string;
  subtitleColor?: ThemeVars.Color | 'currentColor';
};
type TableCellPropsWithChildren = TableCellBaseProps & {
  /**
   * If children are provided, title, subtitle and description MUST be unset
   * @default undefined
   */
  children: NonNullable<React.ReactNode | React.ReactNode[]>;
  title?: never;
  titleColor?: never;
  subtitle?: never;
  subtitleColor?: never;
};
export type TableCellProps = (TableCellPropsWithInputs | TableCellPropsWithChildren) & {
  /**
   * Callback to fire when pressed
   * @default noop
   */
  onClick?: React.MouseEventHandler;
  /**
   * Use as="th" to mark this cell as a header for screen readers
   * @default `th` when rendered inside a TableHeader, `td` when rendered inside a TableBody or TableFooter
   */
  as?: 'td' | 'th';
  /**
   * @danger This is a migration escape hatch. It is not intended to be used normally.
   */
  className?: string;
  /**
   * @deprecated. This will be removed in a future major release.
   * @deprecationExpectedRemoval v9
   * HTML width attribute to help with column layout.
   * This prop should _only_ be used to unblock migration efforts
   * @default undefined
   */
  dangerouslySetHtmlWidth?: TableCellSharedProps['width'];
};
export declare const TableCell: React.MemoExoticComponent<
  (_props: TableCellProps) => import('react/jsx-runtime').JSX.Element
>;
export {};
//# sourceMappingURL=TableCell.d.ts.map