search

davidmfoley / react-router-modal

Simple modals for react-router 4
MIT License
153 stars 20 forks source link

Transition animation? #4

Closed Vija02 closed 6 years ago

Vija02 commented 7 years ago

First of all, thanks for the library! I was just about to create the same exact thing. What do you think about supporting transitions here? (Like fade in/fade out)

davidmfoley commented 6 years ago

This is on the roadmap. I will likely implement it with css classes for 'in' and 'out' states and an "out" transition timeouts that can be set on ModalContainer and/or overridden on the individual Modal or ModalRoute invocations. It's a little bit tricky on mount since the "in" class needs to be added in a subsequent RAF-invoked function after initial render, but I think it will provide the most flexibility when supporting media queries, etc. Any thoughts?

blarfoon commented 6 years ago

any update on this?

davidmfoley commented 6 years ago

I've got this pretty close to working in master. Just need to add some examples and test in a few non-chrome browsers to make sure the "in" animations work.

davidmfoley commented 6 years ago

This is included in v1.4.0

Examples are here: https://davidmfoley.github.io/react-router-modal-examples/transitions

davidmfoley commented 6 years ago

(The docs are a bit underwhelming; I'll make these better)