0.1.15 • Published 6 years ago
bs-react-transition-group v0.1.15
bs-react-transition-group
Usage
type state = {start: bool};
type action =
| Start
| End;
let component = ReasonReact.reducerComponent("Example");
let make = (_children) => {
...component,
initialState: () => {start: false},
reducer: (action, state) =>
switch (action) {
| Start => ReasonReact.Update({...state, start: true})
| End => ReasonReact.Update({...state, start:false})
},
render: self =>
<div>
<Transition timeout=600 in_=self.state.start>
...((animationState) =>
switch(animationState) {
| Transition.Entering => (ReasonReact.string("State: " ++ "Entering"))
| Transition.Entered => (ReasonReact.string("State: " ++ "Entered"))
| _ => (ReasonReact.string("State: " ++ Transition.stringOfState(animationState)))
}
)
</Transition>
<button onClick=(_ => self.send(Start)) disabled={self.state.start}>
(ReasonReact.string("Start Animation"))
</button>
<button onClick=(_ => self.send(End)) disabled= {! self.state.start}>
(ReasonReact.string("End Animation"))
</button>
</div>
};