TanStackT
TanStack9mo ago
3 replies
verbal-lime

Hi I'm using latest version of tanstack/form

i want to pass the form as prop to the presentation component
but i'm finding issue with the types can you help
import React from 'react';
import { useForm } from '@tanstack/react-form';
import { z } from 'zod';
import LoginForm from '../../../components/Forms/Login';
export const loginSchema = z.object({
  email: z.string().email('Invalid email'),
  password: z.string().min(6, 'Password must be at least 6 characters'),
});

export type LoginValues = z.infer<typeof loginSchema>;

const LoginContainer: React.FC = () => {
  const form = useForm({
    defaultValues: {
      email: '',
      password: '',
    },
    onSubmit: async ({ value }: { value: LoginValues }) => {
      console.log('Form submitted:', value);
    },
    validators: {
      onSubmit: loginSchema,
    },
  });
  console.log('Form state:', typeof form);
  return <LoginForm form={form as any} />;
};

export default LoginContainer;
Was this page helpful?