onChange listener on object field not triggered when nested properties change

[JackFazackerley]

I'm trying to get an OnChange listener to trigger when anything under an object changes rather than on a specific field. I'm unsure if this is intentionally not triggering or is a bug.

Example Code:

"use client";

import { Button } from "@/components/ui/button";
import { createFieldMap } from "@tanstack/react-form";
import { createFormHook, createFormHookContexts } from "@tanstack/react-form";

export const { fieldContext, formContext, useFieldContext, useFormContext } = createFormHookContexts()

export const { useAppForm, withForm, withFieldGroup } = createFormHook({
    fieldContext,
    formContext,
    fieldComponents: {},
    formComponents: {},
})

export default function Page() {
    const form = useAppForm({
        defaultValues: defaultCreatePeople,
    })

    const fieldMap = createFieldMap(defaultCreatePeople)

    return (
        <div className="min-h-screen flex items-center justify-center">
            <FormFields form={form} fields={fieldMap} />
        </div>
    )
}

interface Person {
    name: string
}

interface CreatePeople {
    people: Person[]
}

export const defaultPerson: Person = {
    name: ""
}

export const defaultCreatePeople: CreatePeople = {
    people: []
}

const FormFields = withFieldGroup({
    defaultValues: defaultCreatePeople,
    render: ({ group }) => {
        return (
            <group.Field name="people" mode="array" listeners={{
                onChange: ({ value }) => {
                    console.log("array", value); // triggered only when mutating the array, not objects themselves.
                }
            }}>
                {(field) => {
                    return (
                        <div>
                            <Button type="button" onClick={() => {
                                field.pushValue(defaultPerson)
                            }} >Add Person</Button>
                            <div className="grid gap-6">
                                {field.state.value.map((contact, i) => {
                                    return (
                                        <div key={i} className="flex gap-2 items-center">
                                            <group.Field name={`people[${i}]`} listeners={{
                                                onChange: ({ value }) => {
                                                    console.log("object", value); // never triggered
                                                }
                                            }}>
                                                {(field) => {
                                                    return (
                                                        <group.Field
                                                            name={`people[${i}].name`}
                                                            children={(field) => (
                                                                <input
                                                                    value={field.state.value}
                                                                    onBlur={field.handleBlur}
                                                                    onChange={(e) => field.handleChange(e.target.value)}
                                                                />
                                                            )}
                                                        />
                                                    )
                                                }}
                                            </group.Field>
                                            <Button className="self-end" type="button" onClick={() => {
                                                field.removeValue(i)
                                            }} >Remove</Button>
                                        </div>
                                    )
                                })}
                            </div>
                        </div>
                    )
                }}
            </group.Field>
        )
    },
})

I've simplified the example but in my app I have a FieldGroup which contains the input fields for an object and then a secondary FieldGroup which iterates over them and uses the previous as a component.