React Animated Show More
This is a simple, fully-customizable component that expands an area of text to show the rest of it.
Try out the demo for yourself.
Features
- Supports custom toggle component, otherwise shows "Show more" or "Show less"
toggle
(React component) – should implement propisOpen
- Configurable properties
height
(in pixels, default:200
)speed
(in milliseconds, default:300
)shadowColor
(any colour format, default:#fff
)
Peer dependencies
- React v16.8+ (uses hooks)
Usage
Installation
With NPM:
npm install --save react-animated-show-more
With Yarn:
yarn add react-animated-show-more
The component wraps around your lengthy text section.
import React from 'react';import AnimatedShowMore from 'react-animated-show-more'; // ... <AnimatedShowMore = = = ="#000"> /* Lots of stuff goes here */ <DemoText /> </AnimatedShowMore>
Contributing
How can I contribute?
- Report bugs in the issue queue
- Solve bugs in the issue queue
- Add features (check the issue queue for ideas)
- Write documentation
Feel free to make pull requests or issues to make this project better 👯