import React from 'react';

import { Title, Subtitle, Body } from './styled';

type Props = {
  variant?: 'title' | 'subtitle' | 'body';
  light?: boolean;
  children: React.ReactNode;
  style?: {};
  align?: 'left' | 'center' | 'right';
};

const Typography: React.FC<Props> = ({
  variant = 'title',
  children,
  ...rest
}: Props) => {
  let Component = Body;
  if (variant === 'title') {
    Component = Title;
  }
  if (variant === 'subtitle') {
    Component = Subtitle;
  }

  return <Component {...rest}>{children}</Component>;
};

export default Typography;