Cart state is inconsistent

Hi, I have a React App with Snipcart added to the index.html. I would like to update my Cart component’s state from Snipcart (outside of React app). I have set up event handlers: item.added, item.removed to update React Component state. This works fine, the only problem is the value of Snipcart.store.getState(): cart.total and cart.items are inconsistent.
In item.added, total is 0, the items array has the added cart item.
In item.removed, total has the old value, the items array is already empty.

A good solution would be to have a cart.updated event with the current cartState as the parameter, something similar to cart.created or cart.reset.

I know that I could use Displaying number of items and total price, but I cannot format it properly with mui.com. That’s why I created a custom React component and set state from outside.

I just ran into this issue as well. I want to develop my own Component in my Nuxt app to display the current state. I want to update my local component depending on Snipcart events and Snipcart.store.getState(). How come, that the fundamentals like total are wrong?

As @bvamos wrote: Listen to any item event, e.g. item.removed, add an item to the cart and remove it again, inspect cart in Snipcart store and see that the total is not 0, even though there is no item in the cart.

Apparently, it is caused by the fact, that the item events are dispatched right after the specific action happened (item removed, item updated, item added), but before the cart state is updated. Is there any way to react to a completely updated cart state?