import clsx from 'clsx';
import React, { HTMLAttributes } from 'react';
import styles from './index.module.scss';

interface ButtonProps extends HTMLAttributes<HTMLButtonElement> {
  children?: React.ReactNode;
  type?: 'button' | 'submit' | 'reset' | undefined;
  size?: 'lg' | 'md' | 'sm';
  className?: string;
}

const Button = ({ children, type, size, className, ...props }: ButtonProps) => {
  return (
    <button
      className={clsx(styles.button, className)}
      type={type}
      data-size={size}
      {...props}
    >
      {children}
    </button>
  );
};

export default Button;