developit / preact-transition-group

transition-group ui component for preact
https://npm.im/preact-transition-group
52 stars 9 forks source link

Connect() with Unistore / Redux / etc #7

Open mattdesl opened 6 years ago

mattdesl commented 6 years ago

Right now you can't use connect('foo')(MyAnimatedComponent) since the connect wrapper receives the animation events instead of the animated component.

I realize this may not be easily fixable, since it's a very domain specific problem (trying to mix connect() with transition group).

In my case I re-published unistore with a "magic variable" to identify unistore wrappers, and re-published preact-transition-group with a check for that magic variable to decide which comopnent should have the animation enter/leave functions called. This is obviously a pretty hack solution, but maybe there is another way around this worth discussing?

For reference, you can see my test here. It ends up being a really clean app with animation support, since connect() and transition groups in this version will play nicely together.

https://codesandbox.io/s/z22zn2946m

developit commented 6 years ago

Ah - I think we need to have connect() in Unistore hoist methods from the child class, similar to hoist-non-react-statics.

Interestingly, the React version doesn't do this either - maybe it's just something <TransitionGroup> never properly accounted for?