cant use objects with useStore() - causes maximum update depth reached.

  const schema = z.object({
    employee_id: z.number(),
    date_range: z.object({
      start: z.date(),
      end: z.date()
    })
  });

  const form = useAppForm({
    defaultValues: {
      employee_id: 0,
      date_range: {
        start: startOfMonth(new Date()),
        end: new Date()
      }
    },
    validationLogic: revalidateLogic(),
    validators: {
      onDynamic: schema,
    },
  });

  const schema = z.object({
    employee_id: z.number(),
    date_range: z.object({
      start: z.date(),
      end: z.date()
    })
  });

  const form = useAppForm({
    defaultValues: {
      employee_id: 0,
      date_range: {
        start: startOfMonth(new Date()),
        end: new Date()
      }
    },
    validationLogic: revalidateLogic(),
    validators: {
      onDynamic: schema,
    },
  });

Uncaught Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.

Uncaught Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.

 const dateRange = useStore(form.store, (state) => state.values.date_range);

 const dateRange = useStore(form.store, (state) => state.values.date_range);

 const dateRangeStart = useStore(form.store, (state) => state.values.date_range.start);

 const dateRangeStart = useStore(form.store, (state) => state.values.date_range.start);