import React from 'react'
import styles from './ModalButton.module.css'

interface Props {
  children: React.ReactNode
  onClick?: () => void
  variant?: 'primary' | 'secondary' | 'outlined'
  icon?: React.ReactNode
  type?: 'button' | 'submit'
  disabled?: boolean
  className?: string
}

const ModalButton: React.FC<Props> = ({
  children,
  onClick,
  variant = 'outlined',
  icon,
  type = 'button',
  disabled = false,
  className = ''
}) => {
  const variantClass = styles[variant] || styles.outlined

  return (
    <button
      type={type}
      onClick={onClick}
      disabled={disabled}
      className={`${styles.button} ${variantClass} ${className}`}
    >
      {icon && <span className={styles.icon}>{icon}</span>}
      {children}
    </button>
  )
}

export default ModalButton