Animations not triggering

[ghost]

Where should I look for clues on what could be the possible reason animations aren't triggering?

[souporserious]

Hmm weird, sorry about that. Can you provide any code snippets so I can help diagnose?

[ghost]

I was doing something like this:

import Transition from 'react-motion-ui-pack';
import { spring } from 'react-motion';
...

export class LoginModal extends React.Component {
  render() {
    return (
      <Transition
        component={false} // don't use a wrapping component
        enter={{ opacity: 1, translateY: spring(0, { stiffness: 400, damping: 10 }) }}
        leave={{ opacity: 0, translateY: 250 }}
      >
         { !this.props.isUserAuthenticated && <Overlay key="p">
         ...
         </Overlay>
         }
      </Transition>
    );
  }
}

where <Overlay /> is a component made with styled-components.

I remember react-motion-ui-pack working for a different project of mine, so it was weird why it wasn't working here. Thanks for your hard work!

[mightym]

Try wrapping your component into a div or some other el. I'm having the same issue. https://github.com/souporserious/react-motion-ui-pack/issues/74