feat: introduce login page

packages/web/src/components/Form/index.tsx

@@ -3,15 +3,16 @@ import { FormProvider, useForm, FieldValues, SubmitHandler, UseFormReturn } from
 import type { UseFormProps } from 'react-hook-form';
 
 type FormProps = {
-  children: React.ReactNode;
+  children?: React.ReactNode;
   defaultValues?: UseFormProps['defaultValues'];
   onSubmit?: SubmitHandler<FieldValues>;
+  render?: (props: UseFormReturn) => React.ReactNode;
 }
 
 const noop = () => null;
 
 export default function Form(props: FormProps): React.ReactElement {
-  const { children, onSubmit = noop, defaultValues, ...formProps } = props;
+  const { children, onSubmit = noop, defaultValues, render, ...formProps } = props;
   const methods: UseFormReturn = useForm({
     defaultValues,
   });
@@ -23,7 +24,7 @@ export default function Form(props: FormProps): React.ReactElement {
   return (
     <FormProvider {...methods}>
       <form onSubmit={methods.handleSubmit(onSubmit)} {...formProps}>
-        {children}
+        {render ? render(methods) : children}
       </form>
     </FormProvider>
   );