import React, { ComponentProps } from 'react';
import { Box } from '../Box';

type SeparatorProps = ComponentProps<typeof Box> & {
  orientation?: 'horizontal' | 'vertical';
};

export const Separator = ({
  orientation = 'horizontal',
  width = orientation === 'horizontal' ? '100%' : 1,
  height = orientation === 'horizontal' ? 1 : 50,
  backgroundColor = 'gray60',
  ...rest
}: SeparatorProps) => {
  return (
    <Box
      width={width}
      height={height}
      backgroundColor={backgroundColor}
      {...rest}
    />
  );
};