height-transition

    0.2.1 • Public • Published

    Basic Height Transition Library for React

    Simple height transition for collapse elements.

    Installation

    This library written with react-hook so you have to install version of react 16.8.4 or above.

    npm i height-transition -S

    Setup

    Just connect your button with its ref and pass to props HeightTransition component.

    import React, { Fragment, useRef } from 'react';
    import HeightTransition from 'height-transition';
     
    const App = () => {
       const toggleElem = useRef(null);
         return (
        <Fragment>
          <button ref={toggleElem}>Toggle</button>
          <HeightTransition 
             styles={styles} 
             toggle={toggleElem} 
             animation="ease-out" 
             time="100ms"
             >
            Your Content
          </HeightTransition>
        </Fragment>
      );
    }

    API

    Api Description Default
    styles Set your own style.
    toggle Set your element ref
    animation Set your animation style default : "ease"
    time Set your animation time default : "300ms"

    Live Example

    Checkout

    License

    MIT

    Install

    npm i height-transition

    DownloadsWeekly Downloads

    2

    Version

    0.2.1

    License

    none

    Unpacked Size

    11.6 kB

    Total Files

    8

    Last publish

    Collaborators

    • metinsut