Add objects or arrays to reactive and listen to object / array changes?

[pwFoo]

Hi,
I played arround with ArrowJS and have some questions.

1. Looks like add an object or array to an existing reactive not working? It's not handled as reactive (object / array) and don't know the $on() method?

data = r({})
data.obj = {a: "b"}
data.arr = []

2. I know it's possible to listen to array changes like that:

data = r({ arr: [] })
data.$on("arr", ()=>{} )

But it's missing the change itself. No way to work with the added, modified or removed item? Would be great to observe hole objects / arrays too?

data = r({ arr: [] })
data.arr.$on("*", ()=>{} )

[davie-robertson]

Create a new instance when you update or mutate the object/array using ...

See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax