Component-wrapper for collapse animation with react-motion for elements with variable (and dynamic) height
npm install --save react-collapse// TODOhttp://nkbt.github.io/react-collapse/example
// TODO<Collapse isOpened={true || false}>
<div>Random content</div>
</Collapse>Expands or collapses content.
One or multiple children with static, variable or dynamic height.
<Collapse isOpened={true}>
<p>Paragraph of text</p>
<p>Another paragraph is also OK</p>
<p>Images and any other content are ok too</p>
<img src="nyancat.gif">
</Collapse>If content's height is known ahead it is possible to bypass the process of content height calculation by passing optional fixedHeight prop with number of pixels.
<Collapse isOpened={true} fixedHeight={100}>
<div>Animated container will always expand to 100px height</div>
</Collapse>All other props are applied to a container that is being resized. So it is possible to pass style or className, for example.
<Collapse isOpened={true}
style={{width: 200, border: '1px solid red'}}
className="collapse">
<div>
Animated container has red border, 200px width
and has `class="collapse"`
</div>
</Collapse>To run example covering all ReactCollapse features, use npm start, which will compile src/example/Example.js
git clone [email protected]:nkbt/react-collapse.git
cd react-collapse
npm install
npm start
# then
open http://localhost:8080MIT