How to use the smooth-scrollbar.use function in smooth-scrollbar

import React from 'react';
import ReactDOM from 'react-dom';
import Scrollbar from '../src/react-smooth-scrollbar.js';
import SmoothScrollbar from 'smooth-scrollbar';
import OverscrollPlugin from 'smooth-scrollbar/plugins/overscroll';

SmoothScrollbar.use(OverscrollPlugin);

class App extends React.Component {
    state = {
        damping: 0.1,
        count: 3,
    };

    randomDamping() {
        const nextState = {
            damping: Math.random() * 0.5 + 0.1,
            count: Math.random() * 10 | 0,
        };

        console.log(nextState);

        this.setState(nextState);

static pluginName = 'mobile';
                static defaultOptions = {
                    speed: variables.scrollBarMobileSpeed
                };
                transformDelta(delta, fromEvent) {
                    if (fromEvent.type !== 'touchend') {
                        return delta;
                    }

                    return {
                        x: delta.x * this.options.speed,
                        y: delta.y * this.options.speed
                    };
                }
            }
            Scrollbar.use(MobilePlugin);
        }
        variables.scrollBar = Scrollbar.init(
            variables.element,
            variables.scrollBarOptions
        );
        let position = 0,
            direction,
            isVisible;
        variables.scrollBar.addListener(status => {
            if (status.offset.y > position) {
                direction = 'down';
            } else {
                direction = 'up';
            }
            position = status.offset.y;
            for (let a = 0; a < variables.elements.length; a++) {

import * as dat from 'dat-gui';
import Scrollbar from 'smooth-scrollbar';
import OverscrollPlugin from 'smooth-scrollbar/plugins/overscroll';

Scrollbar.use(OverscrollPlugin);

const options = {
  damping: 0.1,
  thumbMinSize: 20,
  renderByPixels: !('ontouchstart' in document),
  alwaysShowTracks: false,
  continuousScrolling: true,
};

const overscrollOptions = {
  enable: true,
  effect: navigator.userAgent.match(/Android/) ? 'glow' : 'bounce',
  damping: 0.2,
  maxOverscroll: 150,
  glowColor: '#222a2d',
};

import React from 'react';
import PropTypes from 'prop-types';
import SmoothScrollbar from 'smooth-scrollbar';
import OverscrollPlugin from 'smooth-scrollbar/plugins/overscroll';

SmoothScrollbar.use(OverscrollPlugin);

class Scrollbar extends React.Component {
  static propTypes = {
    damping: PropTypes.number,
    thumbMinSize: PropTypes.number,
    syncCallbacks: PropTypes.bool,
    renderByPixels: PropTypes.bool,
    alwaysShowTracks: PropTypes.bool,
    continuousScrolling: PropTypes.bool,
    plugins: PropTypes.object,
    onScroll: PropTypes.func,
    children: PropTypes.node,
    innerRef: PropTypes.func,
  };

  static defaultProps = {

import { TweenMax as TM } from 'gsap/all'
import Scrollbar from 'smooth-scrollbar'
import OverscrollPlugin from 'smooth-scrollbar/plugins/overscroll'
import { map } from './utils/utils'

import Scene from './Scene'
import HorizontalScrollPlugin from './utils/HorizontalScrollPlugin'

Scrollbar.use(HorizontalScrollPlugin, OverscrollPlugin)

const offsetTitle = 100


export default class Stage {

    constructor() {
        this.progress = 0

        this.$els = {
            title       : document.querySelector('.page-title'),
            progress    : document.querySelector('.slideshow__progress'),
            progressCtn : document.querySelector('.slideshow__progress-ctn'),
            scene       : document.getElementById('scene'),
        }