import React, { ReactNode, FormEventHandler, forwardRef } from 'react';

export interface FormProps {
  children: ReactNode;
  onSubmit?: FormEventHandler<HTMLFormElement>;
  noValidate?: boolean;
  className?: string;
  'data-testid'?: string;
}

export const Form = forwardRef<HTMLFormElement, FormProps>(({
  children,
  onSubmit,
  noValidate = true,
  className,
  'data-testid': testId
}, ref) => {
  return (
    <form
      ref={ref}
      onSubmit={onSubmit}
      noValidate={noValidate}
      className={className}
      style={{ width: '100%' }}
      data-testid={testId}
    >
      {children}
    </form>
  );
});

Form.displayName = 'Form';