1.2.0 • Published 3 years ago
@xico2k/react-scroll-area v1.2.0
react-scroll-area
A scroll area wrapper to mimic Facebook Scroll Area
Installation
With npm:
$ npm i @xico2k/react-scroll-area
or with yarn:
$ yarn add @xico2k/react-scroll-area
Usage
On your component add:
import ScrollArea from '@xico2k/react-scroll-area';
To render:
<ScrollArea>
Some Content
</ScrollArea>
Props
All props are optional.
Name | Type | Default | Description |
---|---|---|---|
width | string / number | Ex: 100% / 100px / 100 | |
height | string / number | Ex: 100% / 100px / 100 | |
trackHidden | bool | false | |
trackHideTime | int | 1000 | Milliseconds |
minHandlerHeight | int | 70 | Pixels |
trackMargin | int | 4 | Pixels |
onScroll | func | callback with { scrollTop: 50, innerHeight: 100, outerHeight: 50, complete: 0.5 } | |
className | string | class added to the outer container | |
innerClassName | string | class added to the inner container | |
overflowClassName | string | class added to the overflow container | |
trackClassName | string | class added to the track container | |
handlerClassName | string | class added to the handler container |
Methods
- goToBottom(duration = 400);
- goToTop(duration = 400);
- goToPos(pos = 50, duration = 400);
- triggerScroll();