export type SubmitButtonProps = {
  loading?: boolean;
  label?:
    | {
        default: string;
        loading: string;
      }
    | string;
} & React.ButtonHTMLAttributes<HTMLButtonElement>;

export function SubmitButton({ loading, label, ...props }: SubmitButtonProps) {
  return (
    <button
      type="submit"
      disabled={loading}
      style={{
        padding: '10px 14px',
        borderRadius: 6,
        border: 'none',
        backgroundColor: 'var(--iris-9)',
        color: 'white',
      }}
      {...props}
    >
      {loading ? (typeof label === 'string' ? 'Submitting…' : label?.loading ?? 'Submitting…') : typeof label === 'string' ? label : label?.default ?? 'Submit'}
    </button>
  );
}

export function ResetButton(props: React.ButtonHTMLAttributes<HTMLButtonElement>) {
  return (
    <button type="reset" {...props} style={{ padding: '10px 14px', borderRadius: 6, border: '1px solid var(--gray-5)', background: 'white', ...props.style }}>
      {props.children ?? 'Reset'}
    </button>
  );
}