import TBody from './TBody'
import TD from './TD'
import TH from './TH'
import THead from './THead'
import TR from './TR'
import { tableVariants } from './variants'

import type { TableProps } from './table'
import ScrollWrapper from './ScrollWrapper'

function Table({
  className,
  intent,
  borderRadius,
  variant,
  layout,
  width = '100%',
  children,
  ...props
}: TableProps) {
  const classNames = tableVariants({
    className,
    borderRadius,
    intent,
    layout,
    variant,
  })

  return (
    <ScrollWrapper>
      <table className={classNames} style={{ width }} {...props}>
        {children}
      </table>
    </ScrollWrapper>
  )
}

Table.THead = THead
Table.TH = TH
Table.TBody = TBody
Table.TD = TD
Table.TR = TR

export default Table