Изменение положения div с помощью динамической реакции-позы, реакции и редукции

Question

Я собрал эту маленькую песочницу, чтобы продемонстрировать: https://codesandbox.io/s/64xv97y45n

Фиолетовый div в верхнем левом углу должен двигаться, когда набираются буквы.Когда печатается буква, значение currIndex (в настоящее время активное поле) в хранилище с избыточностью увеличивается или уменьшается соответственно.Затем редуктор использует currIndex для вычисления currentCoords или новой абсолютной позиции div (для целей прикрепленной песочницы, «чуть правее»).Свойство магазина currentCoords затем передается как опора для управления динамической позой пурпурного div.Но div отказывается обновить свою позу.Redux DevTools говорит мне, что currentCoords обновляется должным образом или, по крайней мере, достаточно хорошо, чтобы немного двигаться.Что не так?

Соответствующая логика:

 const reducer = (state = initState, action) => {
      switch (action.type) {
        case "KEYPRESS":
          return {
            ...state,
            number: [...state.number, action.key],
            currIndex: ++state.currIndex,
            currentCoords: state.boxCoords[state.currIndex]
          };

<SNIP>

const Cursor = posed.div({
  visible: {
    opacity: 1,
    x: ({ xPos }) => xPos,
    y: ({ yPos }) => yPos
  },

  hidden: {
    opacity: 0
  }
});

<SNIP>



<Cursor
            className="cursor"
            initialPose="visible"
            xPos={this.props.currentCoords.x}
            yPos={this.props.currentCoords.y}
          />