@geneui/components 3.0.0-next-06dadf3-29102024 → 3.0.0-next-63cb5e7-01112024

package/Scrollbar/index.js

@@ -1,1585 +0,0 @@
-import { _ as _extends$1 } from '../_rollupPluginBabelHelpers-a83240e1.js';
-import React__default, { forwardRef, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import { c as classnames } from '../index-031ff73c.js';
-import { c as commonjsGlobal } from '../_commonjsHelpers-24198af3.js';
-import { j as customScrollbarConfig } from '../configs-00612ce0.js';
-import { s as styleInject } from '../style-inject.es-746bb8ed.js';
-
-var lib = {};
-
-var Scrollbars = {};
-
-var rafExports = {};
-var raf$1 = {
-  get exports(){ return rafExports; },
-  set exports(v){ rafExports = v; },
-};
-
-var performanceNowExports = {};
-var performanceNow = {
-  get exports(){ return performanceNowExports; },
-  set exports(v){ performanceNowExports = v; },
-};
-
-// Generated by CoffeeScript 1.12.2
-(function() {
-  var getNanoSeconds, hrtime, loadTime, moduleLoadTime, nodeLoadTime, upTime;
-
-  if ((typeof performance !== "undefined" && performance !== null) && performance.now) {
-    performanceNow.exports = function() {
-      return performance.now();
-    };
-  } else if ((typeof process !== "undefined" && process !== null) && process.hrtime) {
-    performanceNow.exports = function() {
-      return (getNanoSeconds() - nodeLoadTime) / 1e6;
-    };
-    hrtime = process.hrtime;
-    getNanoSeconds = function() {
-      var hr;
-      hr = hrtime();
-      return hr[0] * 1e9 + hr[1];
-    };
-    moduleLoadTime = getNanoSeconds();
-    upTime = process.uptime() * 1e9;
-    nodeLoadTime = moduleLoadTime - upTime;
-  } else if (Date.now) {
-    performanceNow.exports = function() {
-      return Date.now() - loadTime;
-    };
-    loadTime = Date.now();
-  } else {
-    performanceNow.exports = function() {
-      return new Date().getTime() - loadTime;
-    };
-    loadTime = new Date().getTime();
-  }
-
-}).call(commonjsGlobal);
-
-var now = performanceNowExports
-  , root = typeof window === 'undefined' ? commonjsGlobal : window
-  , vendors = ['moz', 'webkit']
-  , suffix = 'AnimationFrame'
-  , raf = root['request' + suffix]
-  , caf = root['cancel' + suffix] || root['cancelRequest' + suffix];
-
-for(var i = 0; !raf && i < vendors.length; i++) {
-  raf = root[vendors[i] + 'Request' + suffix];
-  caf = root[vendors[i] + 'Cancel' + suffix]
-      || root[vendors[i] + 'CancelRequest' + suffix];
-}
-
-// Some versions of FF have rAF but not cAF
-if(!raf || !caf) {
-  var last = 0
-    , id = 0
-    , queue = []
-    , frameDuration = 1000 / 60;
-
-  raf = function(callback) {
-    if(queue.length === 0) {
-      var _now = now()
-        , next = Math.max(0, frameDuration - (_now - last));
-      last = next + _now;
-      setTimeout(function() {
-        var cp = queue.slice(0);
-        // Clear queue here to prevent
-        // callbacks from appending listeners
-        // to the current frame's queue
-        queue.length = 0;
-        for(var i = 0; i < cp.length; i++) {
-          if(!cp[i].cancelled) {
-            try{
-              cp[i].callback(last);
-            } catch(e) {
-              setTimeout(function() { throw e }, 0);
-            }
-          }
-        }
-      }, Math.round(next));
-    }
-    queue.push({
-      handle: ++id,
-      callback: callback,
-      cancelled: false
-    });
-    return id
-  };
-
-  caf = function(handle) {
-    for(var i = 0; i < queue.length; i++) {
-      if(queue[i].handle === handle) {
-        queue[i].cancelled = true;
-      }
-    }
-  };
-}
-
-raf$1.exports = function(fn) {
-  // Wrap in a new function to prevent
-  // `cancel` potentially being assigned
-  // to the native rAF function
-  return raf.call(root, fn)
-};
-rafExports.cancel = function() {
-  caf.apply(root, arguments);
-};
-rafExports.polyfill = function(object) {
-  if (!object) {
-    object = root;
-  }
-  object.requestAnimationFrame = raf;
-  object.cancelAnimationFrame = caf;
-};
-
-var domCssExports = {};
-var domCss = {
-  get exports(){ return domCssExports; },
-  set exports(v){ domCssExports = v; },
-};
-
-var div = null;
-var prefixes = [ 'Webkit', 'Moz', 'O', 'ms' ];
-
-var prefixStyle = function prefixStyle (prop) {
-  // re-use a dummy div
-  if (!div) {
-    div = document.createElement('div');
-  }
-
-  var style = div.style;
-
-  // prop exists without prefix
-  if (prop in style) {
-    return prop
-  }
-
-  // borderRadius -> BorderRadius
-  var titleCase = prop.charAt(0).toUpperCase() + prop.slice(1);
-
-  // find the vendor-prefixed prop
-  for (var i = prefixes.length; i >= 0; i--) {
-    var name = prefixes[i] + titleCase;
-    // e.g. WebkitBorderRadius or webkitBorderRadius
-    if (name in style) {
-      return name
-    }
-  }
-
-  return false
-};
-
-/**
- * Export.
- */
-
-var toNoCase_1 = toNoCase;
-
-/**
- * Test whether a string is camel-case.
- */
-
-var hasSpace = /\s/;
-var hasSeparator = /(_|-|\.|:)/;
-var hasCamel = /([a-z][A-Z]|[A-Z][a-z])/;
-
-/**
- * Remove any starting case from a `string`, like camel or snake, but keep
- * spaces and punctuation that may be important otherwise.
- *
- * @param {String} string
- * @return {String}
- */
-
-function toNoCase(string) {
-  if (hasSpace.test(string)) return string.toLowerCase()
-  if (hasSeparator.test(string)) return (unseparate(string) || string).toLowerCase()
-  if (hasCamel.test(string)) return uncamelize(string).toLowerCase()
-  return string.toLowerCase()
-}
-
-/**
- * Separator splitter.
- */
-
-var separatorSplitter = /[\W_]+(.|$)/g;
-
-/**
- * Un-separate a `string`.
- *
- * @param {String} string
- * @return {String}
- */
-
-function unseparate(string) {
-  return string.replace(separatorSplitter, function (m, next) {
-    return next ? ' ' + next : ''
-  })
-}
-
-/**
- * Camelcase splitter.
- */
-
-var camelSplitter = /(.)([A-Z]+)/g;
-
-/**
- * Un-camelcase a `string`.
- *
- * @param {String} string
- * @return {String}
- */
-
-function uncamelize(string) {
-  return string.replace(camelSplitter, function (m, previous, uppers) {
-    return previous + ' ' + uppers.toLowerCase().split('').join(' ')
-  })
-}
-
-var clean = toNoCase_1;
-
-/**
- * Export.
- */
-
-var toSpaceCase_1 = toSpaceCase;
-
-/**
- * Convert a `string` to space case.
- *
- * @param {String} string
- * @return {String}
- */
-
-function toSpaceCase(string) {
-  return clean(string).replace(/[\W_]+(.|$)/g, function (matches, match) {
-    return match ? ' ' + match : ''
-  }).trim()
-}
-
-var space = toSpaceCase_1;
-
-/**
- * Export.
- */
-
-var toCamelCase_1 = toCamelCase$1;
-
-/**
- * Convert a `string` to camel case.
- *
- * @param {String} string
- * @return {String}
- */
-
-function toCamelCase$1(string) {
-  return space(string).replace(/\s(\w)/g, function (matches, letter) {
-    return letter.toUpperCase()
-  })
-}
-
-/* The following list is defined in React's core */
-
-var IS_UNITLESS = {
-  animationIterationCount: true,
-  boxFlex: true,
-  boxFlexGroup: true,
-  boxOrdinalGroup: true,
-  columnCount: true,
-  flex: true,
-  flexGrow: true,
-  flexPositive: true,
-  flexShrink: true,
-  flexNegative: true,
-  flexOrder: true,
-  gridRow: true,
-  gridColumn: true,
-  fontWeight: true,
-  lineClamp: true,
-  lineHeight: true,
-  opacity: true,
-  order: true,
-  orphans: true,
-  tabSize: true,
-  widows: true,
-  zIndex: true,
-  zoom: true,
-
-  // SVG-related properties
-  fillOpacity: true,
-  stopOpacity: true,
-  strokeDashoffset: true,
-  strokeOpacity: true,
-  strokeWidth: true
-};
-
-var addPxToStyle$1 = function(name, value) {
-  if(typeof value === 'number' && !IS_UNITLESS[ name ]) {
-    return value + 'px';
-  } else {
-    return value;
-  }
-};
-
-var prefix = prefixStyle;
-var toCamelCase = toCamelCase_1;
-var cache = { 'float': 'cssFloat' };
-var addPxToStyle = addPxToStyle$1;
-
-function style (element, property, value) {
-  var camel = cache[property];
-  if (typeof camel === 'undefined') {
-    camel = detect(property);
-  }
-
-  // may be false if CSS prop is unsupported
-  if (camel) {
-    if (value === undefined) {
-      return element.style[camel]
-    }
-
-    element.style[camel] = addPxToStyle(camel, value);
-  }
-}
-
-function each (element, properties) {
-  for (var k in properties) {
-    if (properties.hasOwnProperty(k)) {
-      style(element, k, properties[k]);
-    }
-  }
-}
-
-function detect (cssProp) {
-  var camel = toCamelCase(cssProp);
-  var result = prefix(camel);
-  cache[camel] = cache[cssProp] = cache[result] = result;
-  return result
-}
-
-function set () {
-  if (arguments.length === 2) {
-    if (typeof arguments[1] === 'string') {
-      arguments[0].style.cssText = arguments[1];
-    } else {
-      each(arguments[0], arguments[1]);
-    }
-  } else {
-    style(arguments[0], arguments[1], arguments[2]);
-  }
-}
-
-domCss.exports = set;
-domCssExports.set = set;
-
-domCssExports.get = function (element, properties) {
-  if (Array.isArray(properties)) {
-    return properties.reduce(function (obj, prop) {
-      obj[prop] = style(element, prop || '');
-      return obj
-    }, {})
-  } else {
-    return style(element, properties || '')
-  }
-};
-
-var isString = {};
-
-(function (exports) {
-
-	Object.defineProperty(exports, "__esModule", {
-	    value: true
-	});
-	exports["default"] = isString;
-	function isString(maybe) {
-	    return typeof maybe === 'string';
-	}
-} (isString));
-
-var getScrollbarWidth = {};
-
-(function (exports) {
-
-	Object.defineProperty(exports, "__esModule", {
-	    value: true
-	});
-	exports["default"] = getScrollbarWidth;
-
-	var _domCss = domCssExports;
-
-	var _domCss2 = _interopRequireDefault(_domCss);
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-	var scrollbarWidth = false;
-
-	function getScrollbarWidth() {
-	    if (scrollbarWidth !== false) return scrollbarWidth;
-	    /* istanbul ignore else */
-	    if (typeof document !== 'undefined') {
-	        var div = document.createElement('div');
-	        (0, _domCss2["default"])(div, {
-	            width: 100,
-	            height: 100,
-	            position: 'absolute',
-	            top: -9999,
-	            overflow: 'scroll',
-	            MsOverflowStyle: 'scrollbar'
-	        });
-	        document.body.appendChild(div);
-	        scrollbarWidth = div.offsetWidth - div.clientWidth;
-	        document.body.removeChild(div);
-	    } else {
-	        scrollbarWidth = 0;
-	    }
-	    return scrollbarWidth || 0;
-	}
-} (getScrollbarWidth));
-
-var returnFalse = {};
-
-(function (exports) {
-
-	Object.defineProperty(exports, "__esModule", {
-	    value: true
-	});
-	exports["default"] = returnFalse;
-	function returnFalse() {
-	    return false;
-	}
-} (returnFalse));
-
-var getInnerWidth = {};
-
-(function (exports) {
-
-	Object.defineProperty(exports, "__esModule", {
-	    value: true
-	});
-	exports["default"] = getInnerWidth;
-	function getInnerWidth(el) {
-	    var clientWidth = el.clientWidth;
-
-	    var _getComputedStyle = getComputedStyle(el),
-	        paddingLeft = _getComputedStyle.paddingLeft,
-	        paddingRight = _getComputedStyle.paddingRight;
-
-	    return clientWidth - parseFloat(paddingLeft) - parseFloat(paddingRight);
-	}
-} (getInnerWidth));
-
-var getInnerHeight = {};
-
-(function (exports) {
-
-	Object.defineProperty(exports, "__esModule", {
-	    value: true
-	});
-	exports["default"] = getInnerHeight;
-	function getInnerHeight(el) {
-	    var clientHeight = el.clientHeight;
-
-	    var _getComputedStyle = getComputedStyle(el),
-	        paddingTop = _getComputedStyle.paddingTop,
-	        paddingBottom = _getComputedStyle.paddingBottom;
-
-	    return clientHeight - parseFloat(paddingTop) - parseFloat(paddingBottom);
-	}
-} (getInnerHeight));
-
-var styles = {};
-
-Object.defineProperty(styles, "__esModule", {
-    value: true
-});
-styles.containerStyleDefault = {
-    position: 'relative',
-    overflow: 'hidden',
-    width: '100%',
-    height: '100%'
-};
-
-// Overrides containerStyleDefault properties
-styles.containerStyleAutoHeight = {
-    height: 'auto'
-};
-
-styles.viewStyleDefault = {
-    position: 'absolute',
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-    overflow: 'scroll',
-    WebkitOverflowScrolling: 'touch'
-};
-
-// Overrides viewStyleDefault properties
-styles.viewStyleAutoHeight = {
-    position: 'relative',
-    top: undefined,
-    left: undefined,
-    right: undefined,
-    bottom: undefined
-};
-
-styles.viewStyleUniversalInitial = {
-    overflow: 'hidden',
-    marginRight: 0,
-    marginBottom: 0
-};
-
-styles.trackHorizontalStyleDefault = {
-    position: 'absolute',
-    height: 6
-};
-
-styles.trackVerticalStyleDefault = {
-    position: 'absolute',
-    width: 6
-};
-
-styles.thumbHorizontalStyleDefault = {
-    position: 'relative',
-    display: 'block',
-    height: '100%'
-};
-
-styles.thumbVerticalStyleDefault = {
-    position: 'relative',
-    display: 'block',
-    width: '100%'
-};
-
-styles.disableSelectStyle = {
-    userSelect: 'none'
-};
-
-styles.disableSelectStyleReset = {
-    userSelect: ''
-};
-
-var defaultRenderElements = {};
-
-Object.defineProperty(defaultRenderElements, "__esModule", {
-    value: true
-});
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-defaultRenderElements.renderViewDefault = renderViewDefault;
-defaultRenderElements.renderTrackHorizontalDefault = renderTrackHorizontalDefault;
-defaultRenderElements.renderTrackVerticalDefault = renderTrackVerticalDefault;
-defaultRenderElements.renderThumbHorizontalDefault = renderThumbHorizontalDefault;
-defaultRenderElements.renderThumbVerticalDefault = renderThumbVerticalDefault;
-
-var _react = React__default;
-
-var _react2 = _interopRequireDefault(_react);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
-
-/* eslint-disable react/prop-types */
-
-function renderViewDefault(props) {
-    return _react2["default"].createElement('div', props);
-}
-
-function renderTrackHorizontalDefault(_ref) {
-    var style = _ref.style,
-        props = _objectWithoutProperties(_ref, ['style']);
-
-    var finalStyle = _extends({}, style, {
-        right: 2,
-        bottom: 2,
-        left: 2,
-        borderRadius: 3
-    });
-    return _react2["default"].createElement('div', _extends({ style: finalStyle }, props));
-}
-
-function renderTrackVerticalDefault(_ref2) {
-    var style = _ref2.style,
-        props = _objectWithoutProperties(_ref2, ['style']);
-
-    var finalStyle = _extends({}, style, {
-        right: 2,
-        bottom: 2,
-        top: 2,
-        borderRadius: 3
-    });
-    return _react2["default"].createElement('div', _extends({ style: finalStyle }, props));
-}
-
-function renderThumbHorizontalDefault(_ref3) {
-    var style = _ref3.style,
-        props = _objectWithoutProperties(_ref3, ['style']);
-
-    var finalStyle = _extends({}, style, {
-        cursor: 'pointer',
-        borderRadius: 'inherit',
-        backgroundColor: 'rgba(0,0,0,.2)'
-    });
-    return _react2["default"].createElement('div', _extends({ style: finalStyle }, props));
-}
-
-function renderThumbVerticalDefault(_ref4) {
-    var style = _ref4.style,
-        props = _objectWithoutProperties(_ref4, ['style']);
-
-    var finalStyle = _extends({}, style, {
-        cursor: 'pointer',
-        borderRadius: 'inherit',
-        backgroundColor: 'rgba(0,0,0,.2)'
-    });
-    return _react2["default"].createElement('div', _extends({ style: finalStyle }, props));
-}
-
-(function (exports) {
-
-	Object.defineProperty(exports, "__esModule", {
-	    value: true
-	});
-
-	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-	var _raf2 = rafExports;
-
-	var _raf3 = _interopRequireDefault(_raf2);
-
-	var _domCss = domCssExports;
-
-	var _domCss2 = _interopRequireDefault(_domCss);
-
-	var _react = React__default;
-
-	var _propTypes = PropTypes;
-
-	var _propTypes2 = _interopRequireDefault(_propTypes);
-
-	var _isString = isString;
-
-	var _isString2 = _interopRequireDefault(_isString);
-
-	var _getScrollbarWidth = getScrollbarWidth;
-
-	var _getScrollbarWidth2 = _interopRequireDefault(_getScrollbarWidth);
-
-	var _returnFalse = returnFalse;
-
-	var _returnFalse2 = _interopRequireDefault(_returnFalse);
-
-	var _getInnerWidth = getInnerWidth;
-
-	var _getInnerWidth2 = _interopRequireDefault(_getInnerWidth);
-
-	var _getInnerHeight = getInnerHeight;
-
-	var _getInnerHeight2 = _interopRequireDefault(_getInnerHeight);
-
-	var _styles = styles;
-
-	var _defaultRenderElements = defaultRenderElements;
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-	function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
-
-	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-	var Scrollbars = function (_Component) {
-	    _inherits(Scrollbars, _Component);
-
-	    function Scrollbars(props) {
-	        var _ref;
-
-	        _classCallCheck(this, Scrollbars);
-
-	        for (var _len = arguments.length, rest = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-	            rest[_key - 1] = arguments[_key];
-	        }
-
-	        var _this = _possibleConstructorReturn(this, (_ref = Scrollbars.__proto__ || Object.getPrototypeOf(Scrollbars)).call.apply(_ref, [this, props].concat(rest)));
-
-	        _this.getScrollLeft = _this.getScrollLeft.bind(_this);
-	        _this.getScrollTop = _this.getScrollTop.bind(_this);
-	        _this.getScrollWidth = _this.getScrollWidth.bind(_this);
-	        _this.getScrollHeight = _this.getScrollHeight.bind(_this);
-	        _this.getClientWidth = _this.getClientWidth.bind(_this);
-	        _this.getClientHeight = _this.getClientHeight.bind(_this);
-	        _this.getValues = _this.getValues.bind(_this);
-	        _this.getThumbHorizontalWidth = _this.getThumbHorizontalWidth.bind(_this);
-	        _this.getThumbVerticalHeight = _this.getThumbVerticalHeight.bind(_this);
-	        _this.getScrollLeftForOffset = _this.getScrollLeftForOffset.bind(_this);
-	        _this.getScrollTopForOffset = _this.getScrollTopForOffset.bind(_this);
-
-	        _this.scrollLeft = _this.scrollLeft.bind(_this);
-	        _this.scrollTop = _this.scrollTop.bind(_this);
-	        _this.scrollToLeft = _this.scrollToLeft.bind(_this);
-	        _this.scrollToTop = _this.scrollToTop.bind(_this);
-	        _this.scrollToRight = _this.scrollToRight.bind(_this);
-	        _this.scrollToBottom = _this.scrollToBottom.bind(_this);
-
-	        _this.handleTrackMouseEnter = _this.handleTrackMouseEnter.bind(_this);
-	        _this.handleTrackMouseLeave = _this.handleTrackMouseLeave.bind(_this);
-	        _this.handleHorizontalTrackMouseDown = _this.handleHorizontalTrackMouseDown.bind(_this);
-	        _this.handleVerticalTrackMouseDown = _this.handleVerticalTrackMouseDown.bind(_this);
-	        _this.handleHorizontalThumbMouseDown = _this.handleHorizontalThumbMouseDown.bind(_this);
-	        _this.handleVerticalThumbMouseDown = _this.handleVerticalThumbMouseDown.bind(_this);
-	        _this.handleWindowResize = _this.handleWindowResize.bind(_this);
-	        _this.handleScroll = _this.handleScroll.bind(_this);
-	        _this.handleDrag = _this.handleDrag.bind(_this);
-	        _this.handleDragEnd = _this.handleDragEnd.bind(_this);
-
-	        _this.state = {
-	            didMountUniversal: false
-	        };
-	        return _this;
-	    }
-
-	    _createClass(Scrollbars, [{
-	        key: 'componentDidMount',
-	        value: function componentDidMount() {
-	            this.addListeners();
-	            this.update();
-	            this.componentDidMountUniversal();
-	        }
-	    }, {
-	        key: 'componentDidMountUniversal',
-	        value: function componentDidMountUniversal() {
-	            // eslint-disable-line react/sort-comp
-	            var universal = this.props.universal;
-
-	            if (!universal) return;
-	            this.setState({ didMountUniversal: true });
-	        }
-	    }, {
-	        key: 'componentDidUpdate',
-	        value: function componentDidUpdate() {
-	            this.update();
-	        }
-	    }, {
-	        key: 'componentWillUnmount',
-	        value: function componentWillUnmount() {
-	            this.removeListeners();
-	            (0, _raf2.cancel)(this.requestFrame);
-	            clearTimeout(this.hideTracksTimeout);
-	            clearInterval(this.detectScrollingInterval);
-	        }
-	    }, {
-	        key: 'getScrollLeft',
-	        value: function getScrollLeft() {
-	            if (!this.view) return 0;
-	            return this.view.scrollLeft;
-	        }
-	    }, {
-	        key: 'getScrollTop',
-	        value: function getScrollTop() {
-	            if (!this.view) return 0;
-	            return this.view.scrollTop;
-	        }
-	    }, {
-	        key: 'getScrollWidth',
-	        value: function getScrollWidth() {
-	            if (!this.view) return 0;
-	            return this.view.scrollWidth;
-	        }
-	    }, {
-	        key: 'getScrollHeight',
-	        value: function getScrollHeight() {
-	            if (!this.view) return 0;
-	            return this.view.scrollHeight;
-	        }
-	    }, {
-	        key: 'getClientWidth',
-	        value: function getClientWidth() {
-	            if (!this.view) return 0;
-	            return this.view.clientWidth;
-	        }
-	    }, {
-	        key: 'getClientHeight',
-	        value: function getClientHeight() {
-	            if (!this.view) return 0;
-	            return this.view.clientHeight;
-	        }
-	    }, {
-	        key: 'getValues',
-	        value: function getValues() {
-	            var _ref2 = this.view || {},
-	                _ref2$scrollLeft = _ref2.scrollLeft,
-	                scrollLeft = _ref2$scrollLeft === undefined ? 0 : _ref2$scrollLeft,
-	                _ref2$scrollTop = _ref2.scrollTop,
-	                scrollTop = _ref2$scrollTop === undefined ? 0 : _ref2$scrollTop,
-	                _ref2$scrollWidth = _ref2.scrollWidth,
-	                scrollWidth = _ref2$scrollWidth === undefined ? 0 : _ref2$scrollWidth,
-	                _ref2$scrollHeight = _ref2.scrollHeight,
-	                scrollHeight = _ref2$scrollHeight === undefined ? 0 : _ref2$scrollHeight,
-	                _ref2$clientWidth = _ref2.clientWidth,
-	                clientWidth = _ref2$clientWidth === undefined ? 0 : _ref2$clientWidth,
-	                _ref2$clientHeight = _ref2.clientHeight,
-	                clientHeight = _ref2$clientHeight === undefined ? 0 : _ref2$clientHeight;
-
-	            return {
-	                left: scrollLeft / (scrollWidth - clientWidth) || 0,
-	                top: scrollTop / (scrollHeight - clientHeight) || 0,
-	                scrollLeft: scrollLeft,
-	                scrollTop: scrollTop,
-	                scrollWidth: scrollWidth,
-	                scrollHeight: scrollHeight,
-	                clientWidth: clientWidth,
-	                clientHeight: clientHeight
-	            };
-	        }
-	    }, {
-	        key: 'getThumbHorizontalWidth',
-	        value: function getThumbHorizontalWidth() {
-	            var _props = this.props,
-	                thumbSize = _props.thumbSize,
-	                thumbMinSize = _props.thumbMinSize;
-	            var _view = this.view,
-	                scrollWidth = _view.scrollWidth,
-	                clientWidth = _view.clientWidth;
-
-	            var trackWidth = (0, _getInnerWidth2["default"])(this.trackHorizontal);
-	            var width = Math.ceil(clientWidth / scrollWidth * trackWidth);
-	            if (trackWidth === width) return 0;
-	            if (thumbSize) return thumbSize;
-	            return Math.max(width, thumbMinSize);
-	        }
-	    }, {
-	        key: 'getThumbVerticalHeight',
-	        value: function getThumbVerticalHeight() {
-	            var _props2 = this.props,
-	                thumbSize = _props2.thumbSize,
-	                thumbMinSize = _props2.thumbMinSize;
-	            var _view2 = this.view,
-	                scrollHeight = _view2.scrollHeight,
-	                clientHeight = _view2.clientHeight;
-
-	            var trackHeight = (0, _getInnerHeight2["default"])(this.trackVertical);
-	            var height = Math.ceil(clientHeight / scrollHeight * trackHeight);
-	            if (trackHeight === height) return 0;
-	            if (thumbSize) return thumbSize;
-	            return Math.max(height, thumbMinSize);
-	        }
-	    }, {
-	        key: 'getScrollLeftForOffset',
-	        value: function getScrollLeftForOffset(offset) {
-	            var _view3 = this.view,
-	                scrollWidth = _view3.scrollWidth,
-	                clientWidth = _view3.clientWidth;
-
-	            var trackWidth = (0, _getInnerWidth2["default"])(this.trackHorizontal);
-	            var thumbWidth = this.getThumbHorizontalWidth();
-	            return offset / (trackWidth - thumbWidth) * (scrollWidth - clientWidth);
-	        }
-	    }, {
-	        key: 'getScrollTopForOffset',
-	        value: function getScrollTopForOffset(offset) {
-	            var _view4 = this.view,
-	                scrollHeight = _view4.scrollHeight,
-	                clientHeight = _view4.clientHeight;
-
-	            var trackHeight = (0, _getInnerHeight2["default"])(this.trackVertical);
-	            var thumbHeight = this.getThumbVerticalHeight();
-	            return offset / (trackHeight - thumbHeight) * (scrollHeight - clientHeight);
-	        }
-	    }, {
-	        key: 'scrollLeft',
-	        value: function scrollLeft() {
-	            var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-
-	            if (!this.view) return;
-	            this.view.scrollLeft = left;
-	        }
-	    }, {
-	        key: 'scrollTop',
-	        value: function scrollTop() {
-	            var top = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-
-	            if (!this.view) return;
-	            this.view.scrollTop = top;
-	        }
-	    }, {
-	        key: 'scrollToLeft',
-	        value: function scrollToLeft() {
-	            if (!this.view) return;
-	            this.view.scrollLeft = 0;
-	        }
-	    }, {
-	        key: 'scrollToTop',
-	        value: function scrollToTop() {
-	            if (!this.view) return;
-	            this.view.scrollTop = 0;
-	        }
-	    }, {
-	        key: 'scrollToRight',
-	        value: function scrollToRight() {
-	            if (!this.view) return;
-	            this.view.scrollLeft = this.view.scrollWidth;
-	        }
-	    }, {
-	        key: 'scrollToBottom',
-	        value: function scrollToBottom() {
-	            if (!this.view) return;
-	            this.view.scrollTop = this.view.scrollHeight;
-	        }
-	    }, {
-	        key: 'addListeners',
-	        value: function addListeners() {
-	            /* istanbul ignore if */
-	            if (typeof document === 'undefined' || !this.view) return;
-	            var view = this.view,
-	                trackHorizontal = this.trackHorizontal,
-	                trackVertical = this.trackVertical,
-	                thumbHorizontal = this.thumbHorizontal,
-	                thumbVertical = this.thumbVertical;
-
-	            view.addEventListener('scroll', this.handleScroll);
-	            if (!(0, _getScrollbarWidth2["default"])()) return;
-	            trackHorizontal.addEventListener('mouseenter', this.handleTrackMouseEnter);
-	            trackHorizontal.addEventListener('mouseleave', this.handleTrackMouseLeave);
-	            trackHorizontal.addEventListener('mousedown', this.handleHorizontalTrackMouseDown);
-	            trackVertical.addEventListener('mouseenter', this.handleTrackMouseEnter);
-	            trackVertical.addEventListener('mouseleave', this.handleTrackMouseLeave);
-	            trackVertical.addEventListener('mousedown', this.handleVerticalTrackMouseDown);
-	            thumbHorizontal.addEventListener('mousedown', this.handleHorizontalThumbMouseDown);
-	            thumbVertical.addEventListener('mousedown', this.handleVerticalThumbMouseDown);
-	            window.addEventListener('resize', this.handleWindowResize);
-	        }
-	    }, {
-	        key: 'removeListeners',
-	        value: function removeListeners() {
-	            /* istanbul ignore if */
-	            if (typeof document === 'undefined' || !this.view) return;
-	            var view = this.view,
-	                trackHorizontal = this.trackHorizontal,
-	                trackVertical = this.trackVertical,
-	                thumbHorizontal = this.thumbHorizontal,
-	                thumbVertical = this.thumbVertical;
-
-	            view.removeEventListener('scroll', this.handleScroll);
-	            if (!(0, _getScrollbarWidth2["default"])()) return;
-	            trackHorizontal.removeEventListener('mouseenter', this.handleTrackMouseEnter);
-	            trackHorizontal.removeEventListener('mouseleave', this.handleTrackMouseLeave);
-	            trackHorizontal.removeEventListener('mousedown', this.handleHorizontalTrackMouseDown);
-	            trackVertical.removeEventListener('mouseenter', this.handleTrackMouseEnter);
-	            trackVertical.removeEventListener('mouseleave', this.handleTrackMouseLeave);
-	            trackVertical.removeEventListener('mousedown', this.handleVerticalTrackMouseDown);
-	            thumbHorizontal.removeEventListener('mousedown', this.handleHorizontalThumbMouseDown);
-	            thumbVertical.removeEventListener('mousedown', this.handleVerticalThumbMouseDown);
-	            window.removeEventListener('resize', this.handleWindowResize);
-	            // Possibly setup by `handleDragStart`
-	            this.teardownDragging();
-	        }
-	    }, {
-	        key: 'handleScroll',
-	        value: function handleScroll(event) {
-	            var _this2 = this;
-
-	            var _props3 = this.props,
-	                onScroll = _props3.onScroll,
-	                onScrollFrame = _props3.onScrollFrame;
-
-	            if (onScroll) onScroll(event);
-	            this.update(function (values) {
-	                var scrollLeft = values.scrollLeft,
-	                    scrollTop = values.scrollTop;
-
-	                _this2.viewScrollLeft = scrollLeft;
-	                _this2.viewScrollTop = scrollTop;
-	                if (onScrollFrame) onScrollFrame(values);
-	            });
-	            this.detectScrolling();
-	        }
-	    }, {
-	        key: 'handleScrollStart',
-	        value: function handleScrollStart() {
-	            var onScrollStart = this.props.onScrollStart;
-
-	            if (onScrollStart) onScrollStart();
-	            this.handleScrollStartAutoHide();
-	        }
-	    }, {
-	        key: 'handleScrollStartAutoHide',
-	        value: function handleScrollStartAutoHide() {
-	            var autoHide = this.props.autoHide;
-
-	            if (!autoHide) return;
-	            this.showTracks();
-	        }
-	    }, {
-	        key: 'handleScrollStop',
-	        value: function handleScrollStop() {
-	            var onScrollStop = this.props.onScrollStop;
-
-	            if (onScrollStop) onScrollStop();
-	            this.handleScrollStopAutoHide();
-	        }
-	    }, {
-	        key: 'handleScrollStopAutoHide',
-	        value: function handleScrollStopAutoHide() {
-	            var autoHide = this.props.autoHide;
-
-	            if (!autoHide) return;
-	            this.hideTracks();
-	        }
-	    }, {
-	        key: 'handleWindowResize',
-	        value: function handleWindowResize() {
-	            this.update();
-	        }
-	    }, {
-	        key: 'handleHorizontalTrackMouseDown',
-	        value: function handleHorizontalTrackMouseDown(event) {
-	            event.preventDefault();
-	            var target = event.target,
-	                clientX = event.clientX;
-
-	            var _target$getBoundingCl = target.getBoundingClientRect(),
-	                targetLeft = _target$getBoundingCl.left;
-
-	            var thumbWidth = this.getThumbHorizontalWidth();
-	            var offset = Math.abs(targetLeft - clientX) - thumbWidth / 2;
-	            this.view.scrollLeft = this.getScrollLeftForOffset(offset);
-	        }
-	    }, {
-	        key: 'handleVerticalTrackMouseDown',
-	        value: function handleVerticalTrackMouseDown(event) {
-	            event.preventDefault();
-	            var target = event.target,
-	                clientY = event.clientY;
-
-	            var _target$getBoundingCl2 = target.getBoundingClientRect(),
-	                targetTop = _target$getBoundingCl2.top;
-
-	            var thumbHeight = this.getThumbVerticalHeight();
-	            var offset = Math.abs(targetTop - clientY) - thumbHeight / 2;
-	            this.view.scrollTop = this.getScrollTopForOffset(offset);
-	        }
-	    }, {
-	        key: 'handleHorizontalThumbMouseDown',
-	        value: function handleHorizontalThumbMouseDown(event) {
-	            event.preventDefault();
-	            this.handleDragStart(event);
-	            var target = event.target,
-	                clientX = event.clientX;
-	            var offsetWidth = target.offsetWidth;
-
-	            var _target$getBoundingCl3 = target.getBoundingClientRect(),
-	                left = _target$getBoundingCl3.left;
-
-	            this.prevPageX = offsetWidth - (clientX - left);
-	        }
-	    }, {
-	        key: 'handleVerticalThumbMouseDown',
-	        value: function handleVerticalThumbMouseDown(event) {
-	            event.preventDefault();
-	            this.handleDragStart(event);
-	            var target = event.target,
-	                clientY = event.clientY;
-	            var offsetHeight = target.offsetHeight;
-
-	            var _target$getBoundingCl4 = target.getBoundingClientRect(),
-	                top = _target$getBoundingCl4.top;
-
-	            this.prevPageY = offsetHeight - (clientY - top);
-	        }
-	    }, {
-	        key: 'setupDragging',
-	        value: function setupDragging() {
-	            (0, _domCss2["default"])(document.body, _styles.disableSelectStyle);
-	            document.addEventListener('mousemove', this.handleDrag);
-	            document.addEventListener('mouseup', this.handleDragEnd);
-	            document.onselectstart = _returnFalse2["default"];
-	        }
-	    }, {
-	        key: 'teardownDragging',
-	        value: function teardownDragging() {
-	            (0, _domCss2["default"])(document.body, _styles.disableSelectStyleReset);
-	            document.removeEventListener('mousemove', this.handleDrag);
-	            document.removeEventListener('mouseup', this.handleDragEnd);
-	            document.onselectstart = undefined;
-	        }
-	    }, {
-	        key: 'handleDragStart',
-	        value: function handleDragStart(event) {
-	            this.dragging = true;
-	            event.stopImmediatePropagation();
-	            this.setupDragging();
-	        }
-	    }, {
-	        key: 'handleDrag',
-	        value: function handleDrag(event) {
-	            if (this.prevPageX) {
-	                var clientX = event.clientX;
-
-	                var _trackHorizontal$getB = this.trackHorizontal.getBoundingClientRect(),
-	                    trackLeft = _trackHorizontal$getB.left;
-
-	                var thumbWidth = this.getThumbHorizontalWidth();
-	                var clickPosition = thumbWidth - this.prevPageX;
-	                var offset = -trackLeft + clientX - clickPosition;
-	                this.view.scrollLeft = this.getScrollLeftForOffset(offset);
-	            }
-	            if (this.prevPageY) {
-	                var clientY = event.clientY;
-
-	                var _trackVertical$getBou = this.trackVertical.getBoundingClientRect(),
-	                    trackTop = _trackVertical$getBou.top;
-
-	                var thumbHeight = this.getThumbVerticalHeight();
-	                var _clickPosition = thumbHeight - this.prevPageY;
-	                var _offset = -trackTop + clientY - _clickPosition;
-	                this.view.scrollTop = this.getScrollTopForOffset(_offset);
-	            }
-	            return false;
-	        }
-	    }, {
-	        key: 'handleDragEnd',
-	        value: function handleDragEnd() {
-	            this.dragging = false;
-	            this.prevPageX = this.prevPageY = 0;
-	            this.teardownDragging();
-	            this.handleDragEndAutoHide();
-	        }
-	    }, {
-	        key: 'handleDragEndAutoHide',
-	        value: function handleDragEndAutoHide() {
-	            var autoHide = this.props.autoHide;
-
-	            if (!autoHide) return;
-	            this.hideTracks();
-	        }
-	    }, {
-	        key: 'handleTrackMouseEnter',
-	        value: function handleTrackMouseEnter() {
-	            this.trackMouseOver = true;
-	            this.handleTrackMouseEnterAutoHide();
-	        }
-	    }, {
-	        key: 'handleTrackMouseEnterAutoHide',
-	        value: function handleTrackMouseEnterAutoHide() {
-	            var autoHide = this.props.autoHide;
-
-	            if (!autoHide) return;
-	            this.showTracks();
-	        }
-	    }, {
-	        key: 'handleTrackMouseLeave',
-	        value: function handleTrackMouseLeave() {
-	            this.trackMouseOver = false;
-	            this.handleTrackMouseLeaveAutoHide();
-	        }
-	    }, {
-	        key: 'handleTrackMouseLeaveAutoHide',
-	        value: function handleTrackMouseLeaveAutoHide() {
-	            var autoHide = this.props.autoHide;
-
-	            if (!autoHide) return;
-	            this.hideTracks();
-	        }
-	    }, {
-	        key: 'showTracks',
-	        value: function showTracks() {
-	            clearTimeout(this.hideTracksTimeout);
-	            (0, _domCss2["default"])(this.trackHorizontal, { opacity: 1 });
-	            (0, _domCss2["default"])(this.trackVertical, { opacity: 1 });
-	        }
-	    }, {
-	        key: 'hideTracks',
-	        value: function hideTracks() {
-	            var _this3 = this;
-
-	            if (this.dragging) return;
-	            if (this.scrolling) return;
-	            if (this.trackMouseOver) return;
-	            var autoHideTimeout = this.props.autoHideTimeout;
-
-	            clearTimeout(this.hideTracksTimeout);
-	            this.hideTracksTimeout = setTimeout(function () {
-	                (0, _domCss2["default"])(_this3.trackHorizontal, { opacity: 0 });
-	                (0, _domCss2["default"])(_this3.trackVertical, { opacity: 0 });
-	            }, autoHideTimeout);
-	        }
-	    }, {
-	        key: 'detectScrolling',
-	        value: function detectScrolling() {
-	            var _this4 = this;
-
-	            if (this.scrolling) return;
-	            this.scrolling = true;
-	            this.handleScrollStart();
-	            this.detectScrollingInterval = setInterval(function () {
-	                if (_this4.lastViewScrollLeft === _this4.viewScrollLeft && _this4.lastViewScrollTop === _this4.viewScrollTop) {
-	                    clearInterval(_this4.detectScrollingInterval);
-	                    _this4.scrolling = false;
-	                    _this4.handleScrollStop();
-	                }
-	                _this4.lastViewScrollLeft = _this4.viewScrollLeft;
-	                _this4.lastViewScrollTop = _this4.viewScrollTop;
-	            }, 100);
-	        }
-	    }, {
-	        key: 'raf',
-	        value: function raf(callback) {
-	            var _this5 = this;
-
-	            if (this.requestFrame) _raf3["default"].cancel(this.requestFrame);
-	            this.requestFrame = (0, _raf3["default"])(function () {
-	                _this5.requestFrame = undefined;
-	                callback();
-	            });
-	        }
-	    }, {
-	        key: 'update',
-	        value: function update(callback) {
-	            var _this6 = this;
-
-	            this.raf(function () {
-	                return _this6._update(callback);
-	            });
-	        }
-	    }, {
-	        key: '_update',
-	        value: function _update(callback) {
-	            var _props4 = this.props,
-	                onUpdate = _props4.onUpdate,
-	                hideTracksWhenNotNeeded = _props4.hideTracksWhenNotNeeded;
-
-	            var values = this.getValues();
-	            if ((0, _getScrollbarWidth2["default"])()) {
-	                var scrollLeft = values.scrollLeft,
-	                    clientWidth = values.clientWidth,
-	                    scrollWidth = values.scrollWidth;
-
-	                var trackHorizontalWidth = (0, _getInnerWidth2["default"])(this.trackHorizontal);
-	                var thumbHorizontalWidth = this.getThumbHorizontalWidth();
-	                var thumbHorizontalX = scrollLeft / (scrollWidth - clientWidth) * (trackHorizontalWidth - thumbHorizontalWidth);
-	                var thumbHorizontalStyle = {
-	                    width: thumbHorizontalWidth,
-	                    transform: 'translateX(' + thumbHorizontalX + 'px)'
-	                };
-	                var scrollTop = values.scrollTop,
-	                    clientHeight = values.clientHeight,
-	                    scrollHeight = values.scrollHeight;
-
-	                var trackVerticalHeight = (0, _getInnerHeight2["default"])(this.trackVertical);
-	                var thumbVerticalHeight = this.getThumbVerticalHeight();
-	                var thumbVerticalY = scrollTop / (scrollHeight - clientHeight) * (trackVerticalHeight - thumbVerticalHeight);
-	                var thumbVerticalStyle = {
-	                    height: thumbVerticalHeight,
-	                    transform: 'translateY(' + thumbVerticalY + 'px)'
-	                };
-	                if (hideTracksWhenNotNeeded) {
-	                    var trackHorizontalStyle = {
-	                        visibility: scrollWidth > clientWidth ? 'visible' : 'hidden'
-	                    };
-	                    var trackVerticalStyle = {
-	                        visibility: scrollHeight > clientHeight ? 'visible' : 'hidden'
-	                    };
-	                    (0, _domCss2["default"])(this.trackHorizontal, trackHorizontalStyle);
-	                    (0, _domCss2["default"])(this.trackVertical, trackVerticalStyle);
-	                }
-	                (0, _domCss2["default"])(this.thumbHorizontal, thumbHorizontalStyle);
-	                (0, _domCss2["default"])(this.thumbVertical, thumbVerticalStyle);
-	            }
-	            if (onUpdate) onUpdate(values);
-	            if (typeof callback !== 'function') return;
-	            callback(values);
-	        }
-	    }, {
-	        key: 'render',
-	        value: function render() {
-	            var _this7 = this;
-
-	            var scrollbarWidth = (0, _getScrollbarWidth2["default"])();
-	            /* eslint-disable no-unused-vars */
-
-	            var _props5 = this.props;
-	                _props5.onScroll;
-	                _props5.onScrollFrame;
-	                _props5.onScrollStart;
-	                _props5.onScrollStop;
-	                _props5.onUpdate;
-	                var renderView = _props5.renderView,
-	                renderTrackHorizontal = _props5.renderTrackHorizontal,
-	                renderTrackVertical = _props5.renderTrackVertical,
-	                renderThumbHorizontal = _props5.renderThumbHorizontal,
-	                renderThumbVertical = _props5.renderThumbVertical,
-	                tagName = _props5.tagName;
-	                _props5.hideTracksWhenNotNeeded;
-	                var autoHide = _props5.autoHide;
-	                _props5.autoHideTimeout;
-	                var autoHideDuration = _props5.autoHideDuration;
-	                _props5.thumbSize;
-	                _props5.thumbMinSize;
-	                var universal = _props5.universal,
-	                autoHeight = _props5.autoHeight,
-	                autoHeightMin = _props5.autoHeightMin,
-	                autoHeightMax = _props5.autoHeightMax,
-	                style = _props5.style,
-	                children = _props5.children,
-	                props = _objectWithoutProperties(_props5, ['onScroll', 'onScrollFrame', 'onScrollStart', 'onScrollStop', 'onUpdate', 'renderView', 'renderTrackHorizontal', 'renderTrackVertical', 'renderThumbHorizontal', 'renderThumbVertical', 'tagName', 'hideTracksWhenNotNeeded', 'autoHide', 'autoHideTimeout', 'autoHideDuration', 'thumbSize', 'thumbMinSize', 'universal', 'autoHeight', 'autoHeightMin', 'autoHeightMax', 'style', 'children']);
-	            /* eslint-enable no-unused-vars */
-
-	            var didMountUniversal = this.state.didMountUniversal;
-
-
-	            var containerStyle = _extends({}, _styles.containerStyleDefault, autoHeight && _extends({}, _styles.containerStyleAutoHeight, {
-	                minHeight: autoHeightMin,
-	                maxHeight: autoHeightMax
-	            }), style);
-
-	            var viewStyle = _extends({}, _styles.viewStyleDefault, {
-	                // Hide scrollbars by setting a negative margin
-	                marginRight: scrollbarWidth ? -scrollbarWidth : 0,
-	                marginBottom: scrollbarWidth ? -scrollbarWidth : 0
-	            }, autoHeight && _extends({}, _styles.viewStyleAutoHeight, {
-	                // Add scrollbarWidth to autoHeight in order to compensate negative margins
-	                minHeight: (0, _isString2["default"])(autoHeightMin) ? 'calc(' + autoHeightMin + ' + ' + scrollbarWidth + 'px)' : autoHeightMin + scrollbarWidth,
-	                maxHeight: (0, _isString2["default"])(autoHeightMax) ? 'calc(' + autoHeightMax + ' + ' + scrollbarWidth + 'px)' : autoHeightMax + scrollbarWidth
-	            }), autoHeight && universal && !didMountUniversal && {
-	                minHeight: autoHeightMin,
-	                maxHeight: autoHeightMax
-	            }, universal && !didMountUniversal && _styles.viewStyleUniversalInitial);
-
-	            var trackAutoHeightStyle = {
-	                transition: 'opacity ' + autoHideDuration + 'ms',
-	                opacity: 0
-	            };
-
-	            var trackHorizontalStyle = _extends({}, _styles.trackHorizontalStyleDefault, autoHide && trackAutoHeightStyle, (!scrollbarWidth || universal && !didMountUniversal) && {
-	                display: 'none'
-	            });
-
-	            var trackVerticalStyle = _extends({}, _styles.trackVerticalStyleDefault, autoHide && trackAutoHeightStyle, (!scrollbarWidth || universal && !didMountUniversal) && {
-	                display: 'none'
-	            });
-
-	            return (0, _react.createElement)(tagName, _extends({}, props, { style: containerStyle, ref: function ref(_ref3) {
-	                    _this7.container = _ref3;
-	                } }), [(0, _react.cloneElement)(renderView({ style: viewStyle }), { key: 'view', ref: function ref(_ref4) {
-	                    _this7.view = _ref4;
-	                } }, children), (0, _react.cloneElement)(renderTrackHorizontal({ style: trackHorizontalStyle }), { key: 'trackHorizontal', ref: function ref(_ref5) {
-	                    _this7.trackHorizontal = _ref5;
-	                } }, (0, _react.cloneElement)(renderThumbHorizontal({ style: _styles.thumbHorizontalStyleDefault }), { ref: function ref(_ref6) {
-	                    _this7.thumbHorizontal = _ref6;
-	                } })), (0, _react.cloneElement)(renderTrackVertical({ style: trackVerticalStyle }), { key: 'trackVertical', ref: function ref(_ref7) {
-	                    _this7.trackVertical = _ref7;
-	                } }, (0, _react.cloneElement)(renderThumbVertical({ style: _styles.thumbVerticalStyleDefault }), { ref: function ref(_ref8) {
-	                    _this7.thumbVertical = _ref8;
-	                } }))]);
-	        }
-	    }]);
-
-	    return Scrollbars;
-	}(_react.Component);
-
-	exports["default"] = Scrollbars;
-
-
-	Scrollbars.propTypes = {
-	    onScroll: _propTypes2["default"].func,
-	    onScrollFrame: _propTypes2["default"].func,
-	    onScrollStart: _propTypes2["default"].func,
-	    onScrollStop: _propTypes2["default"].func,
-	    onUpdate: _propTypes2["default"].func,
-	    renderView: _propTypes2["default"].func,
-	    renderTrackHorizontal: _propTypes2["default"].func,
-	    renderTrackVertical: _propTypes2["default"].func,
-	    renderThumbHorizontal: _propTypes2["default"].func,
-	    renderThumbVertical: _propTypes2["default"].func,
-	    tagName: _propTypes2["default"].string,
-	    thumbSize: _propTypes2["default"].number,
-	    thumbMinSize: _propTypes2["default"].number,
-	    hideTracksWhenNotNeeded: _propTypes2["default"].bool,
-	    autoHide: _propTypes2["default"].bool,
-	    autoHideTimeout: _propTypes2["default"].number,
-	    autoHideDuration: _propTypes2["default"].number,
-	    autoHeight: _propTypes2["default"].bool,
-	    autoHeightMin: _propTypes2["default"].oneOfType([_propTypes2["default"].number, _propTypes2["default"].string]),
-	    autoHeightMax: _propTypes2["default"].oneOfType([_propTypes2["default"].number, _propTypes2["default"].string]),
-	    universal: _propTypes2["default"].bool,
-	    style: _propTypes2["default"].object,
-	    children: _propTypes2["default"].node
-	};
-
-	Scrollbars.defaultProps = {
-	    renderView: _defaultRenderElements.renderViewDefault,
-	    renderTrackHorizontal: _defaultRenderElements.renderTrackHorizontalDefault,
-	    renderTrackVertical: _defaultRenderElements.renderTrackVerticalDefault,
-	    renderThumbHorizontal: _defaultRenderElements.renderThumbHorizontalDefault,
-	    renderThumbVertical: _defaultRenderElements.renderThumbVerticalDefault,
-	    tagName: 'div',
-	    thumbMinSize: 30,
-	    hideTracksWhenNotNeeded: false,
-	    autoHide: false,
-	    autoHideTimeout: 1000,
-	    autoHideDuration: 200,
-	    autoHeight: false,
-	    autoHeightMin: 0,
-	    autoHeightMax: 200,
-	    universal: false
-	};
-} (Scrollbars));
-
-(function (exports) {
-
-	Object.defineProperty(exports, "__esModule", {
-	  value: true
-	});
-	exports.Scrollbars = undefined;
-
-	var _Scrollbars = Scrollbars;
-
-	var _Scrollbars2 = _interopRequireDefault(_Scrollbars);
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-	exports["default"] = _Scrollbars2["default"];
-	exports.Scrollbars = _Scrollbars2["default"];
-} (lib));
-
-var css_248z = "[data-gene-ui-version=\"2.16.4\"] .scroll-holder{position:relative}[data-gene-ui-version=\"2.16.4\"] .scroll-holder .scroll-thumb{background:rgba(var(--background-sc-rgb),.05);border-radius:var(--scrollbar-size,16px);transition:background .3s,transform .25s}[data-gene-ui-version=\"2.16.4\"] .scroll-holder .scroll-track{cursor:pointer;position:absolute;transition:opacity .3s}[data-gene-ui-version=\"2.16.4\"] .scroll-holder .scroll-track.horizontal{bottom:0;height:var(--scrollbar-size,16px)!important;left:0;padding:var(--scrollbar-space,4px) var(--scrollbar-gutter,10px);width:100%!important}[data-gene-ui-version=\"2.16.4\"] .scroll-holder .scroll-track.vertical{height:100%!important;padding:var(--scrollbar-gutter,10px) var(--scrollbar-space,4px);top:0;width:var(--scrollbar-size,16px)!important}html:not([dir=rtl]) .scroll-holder .scroll-track.vertical{right:0}html[dir=rtl] .scroll-holder .scroll-track.vertical{left:0}[data-gene-ui-version=\"2.16.4\"] .scroll-holder .scroll-track:active .scroll-thumb,[data-gene-ui-version=\"2.16.4\"] .scroll-holder .scroll-track:hover .scroll-thumb{background:rgba(var(--background-sc-rgb),.1);transition:background .3s}[data-gene-ui-version=\"2.16.4\"] .scroll-holder:not(:hover,:active) .scroll-track{opacity:0}[data-gene-ui-version=\"2.16.4\"] .scroll-holder .scroll-content{margin-bottom:var(--sb-margin-bottom);margin-inline-end:var(--sb-margin-side);z-index:0}[data-gene-ui-version=\"2.16.4\"] .scroll-holder.s-small{--scrollbar-size:10px;--scrollbar-thumbSize:4px;--scrollbar-gutter:3px;--scrollbar-space:3px}";
-styleInject(css_248z);
-
-const easeOutQuad = t => t * (2 - t);
-const smoothScrollTo = (element, to, duration) => {
-  const start = element.viewScrollTop || 0;
-  const change = to - start;
-  const startTime = performance.now();
-  let animationFrameId;
-  const animateScroll = timestamp => {
-    const elapsed = timestamp - startTime;
-    const progress = Math.min(elapsed / duration, 1);
-    const easeProgress = easeOutQuad(progress);
-    element.scrollTop(start + change * easeProgress);
-    if (progress < 1) {
-      animationFrameId = requestAnimationFrame(animateScroll);
-    }
-  };
-  animationFrameId = requestAnimationFrame(animateScroll);
-  const cancelScroll = () => {
-    if (animationFrameId) {
-      cancelAnimationFrame(animationFrameId);
-    }
-  };
-  return cancelScroll;
-};
-const CustomScrollbar = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    children,
-    className,
-    size,
-    scrollTop,
-    withSmoothScroll,
-    ...restProps
-  } = _ref;
-  useEffect(() => {
-    const element = ref === null || ref === void 0 ? void 0 : ref.current;
-    if (!element) return;
-    let cancelScroll;
-    if (withSmoothScroll) {
-      cancelScroll = smoothScrollTo(element, scrollTop, 500);
-    } else {
-      element.scrollTop(scrollTop);
-    }
-
-    // Clean up the cancellation function if the component unmounts
-    // or if there's a change in the scroll position
-    return () => {
-      cancelScroll && cancelScroll();
-    };
-  }, [scrollTop]);
-  return /*#__PURE__*/React__default.createElement(lib.Scrollbars, _extends$1({
-    ref: ref,
-    renderView: _ref2 => {
-      let {
-        style,
-        ...props
-      } = _ref2;
-      return /*#__PURE__*/React__default.createElement("div", _extends$1({}, props, {
-        style: {
-          ...style,
-          margin: null,
-          '--sb-margin-bottom': "".concat(style.marginBottom, "px"),
-          '--sb-margin-side': "".concat(style.marginRight, "px")
-          /* This change will return the CORE-395 bug due to the fact that we
-           * used a virtualized-list in the ScrollBar everywhere.
-           * ...
-           * overflow: 'auto'
-           */
-        },
-        className: "scroll-content"
-      }));
-    },
-    renderTrackHorizontal: props => /*#__PURE__*/React__default.createElement("div", _extends$1({}, props, {
-      className: "scroll-track horizontal"
-    })),
-    renderTrackVertical: props => /*#__PURE__*/React__default.createElement("div", _extends$1({}, props, {
-      className: "scroll-track vertical"
-    })),
-    renderThumbHorizontal: props => /*#__PURE__*/React__default.createElement("div", _extends$1({}, props, {
-      className: "scroll-thumb horizontal"
-    })),
-    renderThumbVertical: props => /*#__PURE__*/React__default.createElement("div", _extends$1({}, props, {
-      className: "scroll-thumb vertical"
-    })),
-    className: classnames('scroll-holder', "s-".concat(size), className),
-    thumbMinSize: 0,
-    hideTracksWhenNotNeeded: true
-  }, restProps), children);
-});
-CustomScrollbar.propTypes = {
-  /**
-   * Any valid React node
-   */
-  children: PropTypes.node.isRequired,
-  /**
-   * Enable auto-height mode. When true container grows with content.
-   */
-  autoHeight: PropTypes.bool,
-  /**
-   * Set a minimum height for auto-height mode.
-   */
-  autoHeightMin: PropTypes.number,
-  /**
-   * Set a maximum height for auto-height mode
-   */
-  autoHeightMax: PropTypes.number,
-  /**
-   * Set the size for scrollbar thickness
-   */
-  size: PropTypes.oneOf(customScrollbarConfig.size),
-  /**
-   * Set scrollbar top position dynamically.
-   * Prop works when ref is provided.
-   */
-  scrollTop: PropTypes.number,
-  /**
-   * This prop works with `scrollTop` prop
-   * and provide auto scroll type if true
-   * then auto scrolling will be smoother
-   */
-  withSmoothScroll: PropTypes.bool
-};
-CustomScrollbar.defaultProps = {
-  autoHeight: false,
-  autoHeightMin: 0,
-  autoHeightMax: 5000,
-  size: customScrollbarConfig.size[0],
-  scrollTop: 0,
-  withSmoothScroll: false
-};
-
-export { CustomScrollbar as default };