What is the correct way to update a property in touched store that is array of objects?

[arteforme]

I have a use case where I need to allow a user to enter box dimension info for one or more boxes. The form initially begins with fields for a single box, but I allow the user to add additional box info as needed by clicking on a button that will dynamically add additional form fields. To account for that scenario, I'm calling `updateValidatedField. Below is my schema

let boxSchema = object({
    height: number().required(),
  });

let shippingSchema = object({
    boxes: array(boxSchema).min(1).required(),
});

The initial state of the touched store is {"boxes": [{}]}. After calling updateValidateField, the shape of touched is {"boxes":true} which is not what I'm expecting. After looking through source, it looks like the root cause is on line 76

If instead, I call updateField, touched is not updated and so I'd need to call updateTouched as well. For example:

updateField("boxes", shippingInfo.boxes);
updateTouched("boxes", [...$touched.boxes, {}]);

Which produces the result I'm expecting {"boxes":[{},{}]}. Is this the route I should be taking?

Please see this codesandbox.io for example