@xico2k/react-scroll-area

react-scroll-area

A scroll area wrapper to mimic Facebook Scroll Area

Demo

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();