import React, { FC } from 'react';
import { ButtonProps } from 'types';
import { buttonTextSizeDecorator } from 'utils';
import Text from '../Text';
import * as S from './styles';

export const Button: FC<ButtonProps> = ({
	children,
	size,
	testId,
	weight,
	...rest
}) => {
	return (
		<S.Button data-testid={testId} {...{ ...rest, size }}>
			{children && (
				<Text
					testId={`${testId}-text`}
					block
					size={buttonTextSizeDecorator(size)}
					weight={weight}>
					{children}
				</Text>
			)}
		</S.Button>
	);
};

Button.defaultProps = {
	background: '#851bb7',
	elevation: 4,
	size: 'medium',
	testId: 'button',
	variant: 'regular',
};

export default Button;