import '@/components/ui/button.css'
import type { DetailedHTMLProps, FC, InputHTMLAttributes } from 'react'
import type { MergeOmitting } from '@/types/helpers'

export type UploadButtonProps = MergeOmitting<
  DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,
  {
    id: string
    label?: string
  }
>
const UploadButton: FC<UploadButtonProps> = ({ id, label, ...inputProps }) => {
  return (
    <>
      <input type="file" id={id} {...inputProps} />
      <label htmlFor={id} className={`st-rnd-button button-neutral`}>
        {label || 'Upload'}
      </label>
    </>
  )
}

export default UploadButton