import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';

const Root = styled.p`
  font-family: ${props => props.theme.fonts.text};
  font-style: normal;
  font-weight: 400;
  font-size: ${props => props.theme.fontSizes.paragraph};
  text-decoration: ${props => props.decoration};
  margin-top: 0px;
  color: ${props => props.color};
`;

const Paragraph = props => {
  const { color, children, decoration } = props;

  return (
    <Root color={color} decoration={decoration}>
      {children}
    </Root>
  );
};

Paragraph.propTypes = {
  color: PropTypes.string,
  children: PropTypes.any,
  decoration: PropTypes.string
};

Paragraph.defaultProps = {
  color: '#212121',
  children: '',
  decoration: ''
};

export default Paragraph;