Реактивная пружина оживляет не тот компонент

Question

Я пытаюсь оживить новый заказ из компонента. Вместо этого, реакция весны запускает анимацию для содержимого, которое уже находится в форме, когда я переключаю видимость для формы

return (
        <Fragment>
            <div className='dashboard-main-neworder' onClick={newOrder}>
                <img alt='New Order' src={addorder}></img>
                <span>New Order</span>
            </div>
            <Transition
                native
                items={selected}
                from={{ opacity: 0, marginTop: -500 }}
                enter={{ opacity: 1, marginTop: 0 }}
                leave={{ opacity: 0 }}
            >
                {selected =>
                    selected &&
                    (props => (
                        <animated.div style={props}>
                            <NewOrderForm newOrder={newOrder}></NewOrderForm>
                        </animated.div>
                    ))
                }
            </Transition>
        </Fragment>
    );
};