Installation • Basic usage • Supported features
Installation
yarn add @reasonbr/bs-react-reveal react-reveal
Add the package to the bsconfig.json
{
"bs-dependencies": [
"@reasonbr/bs-react-reveal"
]
}
Usage
open ReactReveal;
[@react.component]
let make = () => {
<Fade>
<h1>{React.string("Fade animation...")</h1>
</Fade>
}
Status
This is project is still WIP
, but you can use all the components provided by react-reveal with the almost all props.
Supported features
- Components:
-
Reveal
:⚠️ - Not yet[WIP]
-
Fade
:✅ -
Flip
:✅ -
Rotate
:✅ -
Zoom
:✅ -
Bounce
:✅ -
Slide
:✅ -
Roll
:✅ -
LightSpeed
:✅ -
Jump
:✅ -
Flash
:✅ -
HeadShake
:✅ -
Jello
:✅ -
Pulse
:✅ -
RubberBand
:✅ -
Shake
:✅ -
Spin
:✅ -
Swing
:✅ -
Tada
:✅ -
Wobble
:✅
-
- Component props:
-
duration
:✅ -
delay
:✅ -
left
:✅ -
right
:✅ -
top
:✅ -
bottom
:✅ -
count
:✅ -
forever
:✅ -
mirror
:✅ -
opposite
:✅ -
distance
:✅ -
spy
:✅ ⚠️ - Only int values for now[WIP]
-
when
:✅ ⚠️ - Only bool values for now[WIP]
-
in
:✅ -⚠️ Only bool values for now[WIP]
-
appear
:✅ -
enter
:✅ -
exit
:✅ -
timeout
:✅ -
mountOnEnter
:✅ -
unmountOnExit
:✅ -
force
:✅ -
refProp
:⚠️ - Not yet[WIP]
-
innerRef
:⚠️ - Not yet[WIP]
-
cascade
:✅ -
collapse
:✅ -
fraction
:✅ -
ssrFadeout
:✅ -
ssrReveal
:✅ -
wait
:✅ -
onReveal
:✅
-
-
HOC's
:⚠️ - Not yet[WIP]
-
Custom effects
:⚠️ - Not yet[WIP]
Docs
Check the official react-reveal documentation.