zod doesn’t revalidate array/object onChange

This sandbox demonstrates the problem.

I have this schema:

  const schema = z.object({
    portals: z.array(
      z
        .object({
          firstName: z.string()
        })
        .refine((data) => data.firstName !== "", {
          message: "First name is required"
        })
    ),
    lastName: z.string().refine((data) => data !== "", {
      message: "Last name is required"
    })
  });

• firstName is a string inside an object inside an array;
• firstName only gets revalidated on onSubmit.
• lastName is just a string;
• lastName gets revalidated on onSubmit and onChange.

In my real scenario, I have an array which I’d like to revalidate onChange, but I’m unable to.

I’ve heard I could user React Hook Form’s trigger() method but I’m looking for a solution which doesn’t causes re-render at root level.

Does anyone have a solution for this?

Thanks!

@Edit:
For anyone reading, a terrible workaround is to use React Hook Form’s setError on the input onChange event and set the error manually. The problem with this is that it causes re-render at root level and is likely to cause performance issues when the error is set if you have a large array.