First of all, love the tool. It's a very neat way to visualize how TanStack Form and TanStack Table work.
I wanted to point out a very small issue I encounter in the form builder when dealing with optional/required fields, particularly the email field. I get the same issue when I'm using Zod and TanStack and it's that if a field with a non-standard validator like the email field is set as optional, then it will still fail validation if left blank.
For normal text fields, marking them as optional works fine. But if email is optional, it will still say required if left blank. I see the schema uses email: z.email().optional(),. I'm not sure what best practice would be, but personally I've started using z.union([z.email(), z.literal("")]) when I want an email or URL or other field type to be optional. Would love to see if anyone else has any best practices for this though.
Thanks for making this really cool tool!
Example form
First of all, love the tool. It's a very neat way to visualize how TanStack Form and TanStack Table work.
I wanted to point out a very small issue I encounter in the form builder when dealing with optional/required fields, particularly the email field. I get the same issue when I'm using Zod and TanStack and it's that if a field with a non-standard validator like the email field is set as optional, then it will still fail validation if left blank.
For normal text fields, marking them as optional works fine. But if email is optional, it will still say required if left blank. I see the schema uses
email: z.email().optional(),. I'm not sure what best practice would be, but personally I've started using z.union([z.email(), z.literal("")]) when I want an email or URL or other field type to be optional. Would love to see if anyone else has any best practices for this though.Thanks for making this really cool tool!
Example form