import React from 'react';
import { Box, BoxProps } from '@chakra-ui/react';

export interface CardSubsectionProps extends BoxProps {
  children?: React.ReactNode;
}

export function CardSubsection({ children, ...rest }: CardSubsectionProps) {
  return (
    <Box
      {...rest}
      sx={{
        '& + &': {
          mt: '16px',
          pt: '16px',
          borderTopWidth: '1px',
        },
        ...rest.sx,
      }}
    >
      {children}
    </Box>
  );
}