React-transitioning-container NPM

Installation

$ yarn add react-transitioning-container # or using npm

Usage

import React from 'react';
import TransitioningContainer from 'react-transitioning-container';
import LargeContent from './LargeContent';
import SmallContent from './SmallContent';

export default function App({ isLarge }) {
  return (
    <TransitioningContainer duration={500}>
      {isLarge ? <LargeContent /> : <SmallContent />}
    </TransitioningContainer>
  );
}

API

<TransitioningContainer> component accepts these following props:

Name	Description	Type
`duration`	Transition duration in ms.	`number`
`timingFunction?`	Transition timing function. Default: `'ease'`	`string`
`children`	Its size changes will trigger the container transition.	`Node` or `string`
`...others`	Other valid attributes to be added to the root `div`.	`any`