React Collapsable

A collapsable react component, animated using CSS transitions based on the height of your content.
Installation
npm i react-collapsable -S
or with yarn;
yarn add react-collapsable
Usage
import React, { useState } from 'react'
import Collapsable from 'react-collapsable'
const myComponent = () => {
const [isOpen, toggleOpen] = useState(false);
return (
<div>
<button onClick={() => toggleOpen(!isOpen)}>Toggle</button>
<Collapsable isOpen={isOpen}>
<h1>My Content In Here!</h1>
</Collapsable>
</div>
)
}
Props
isOpen (boolean) | | |
minAnimationDuration (in seconds) | | 0.3 |
maxAnimationDuration (in seconds) | | 1 |
speedDivider (in milliseconds) | | 1000 |
easing (css string) | | "ease-in-out" |