import React from 'react'
import PropTypes from 'prop-types'
import { CardContent } from './CardContent'
import { getCardContentTokens } from './helpers'

/**
 * Renders the fallback Card content: no full-bleed, not interactive,
 * just children. The default layout when none of the specialized variants apply.
 */
export const DefaultContent = ({
  tokens,
  variant,
  withFooter,
  backgroundImage,
  fullBleedContentChildrenAlign,
  children,
  testID
}) => (
  <CardContent
    tokens={getCardContentTokens(tokens, {
      backgroundImage,
      fullBleedContentChildrenAlign
    })}
    variant={variant}
    withFooter={withFooter}
    backgroundImage={backgroundImage}
    data-testid={testID && `${testID}-card-content`}
  >
    {children}
  </CardContent>
)

DefaultContent.propTypes = {
  tokens: PropTypes.object,
  variant: PropTypes.object,
  withFooter: PropTypes.bool,
  backgroundImage: PropTypes.object,
  fullBleedContentChildrenAlign: PropTypes.string,
  children: PropTypes.node,
  testID: PropTypes.string
}