react-custom-scrollbars - npm Package Compare versions

Comparing version 2.2.1 to 2.2.2

lib/Scrollbars/index.js

@@ -21,2 +21,4 @@ 'use strict';
 
+var _reactDom = require('react-dom');
+
 var _getScrollbarWidth = require('../utils/getScrollbarWidth');
@@ -65,2 +67,3 @@
         this.update();
+        this.validate();
     },
@@ -134,2 +137,28 @@ componentDidUpdate: function componentDidUpdate() {
     },
+    validate: function validate() {
+        if (!(0, _getScrollbarWidth2.default)()) return;
+        var root = (0, _reactDom.findDOMNode)(this);
+        var _refs = this.refs;
+        var barHorizontal = _refs.barHorizontal;
+        var barVertical = _refs.barVertical;
+        var rootClientHeight = root.clientHeight;
+        var barHorizontalClientHeight = barHorizontal.clientHeight;
+        var barVerticalClientWidth = barVertical.clientWidth;
+
+        var display = _domCss2.default.get(root, 'display');
+
+        if (display === 'none') return;
+        if (!rootClientHeight) {
+            console.error( // eslint-disable-line no-console
+            '<Scrollbars>: Component has no static height. ' + 'This can happen if the root element has no CSS or is displayed as inline block.');
+        }
+        if (!barHorizontalClientHeight) {
+            console.error( // eslint-disable-line no-console
+            '<Scrollbars>: Horizontal bar has no height. ' + 'Make sure you set the height property if you use a ' + 'custom render method like `renderScrollbarHorizontal`');
+        }
+        if (!barVerticalClientWidth) {
+            console.error( // eslint-disable-line no-console
+            '<Scrollbars>: Vertical bar has no width. ' + 'Make sure you set the width property if you use a ' + 'custom render method like `renderScrollbarVertical`');
+        }
+    },
     scrollTop: function scrollTop() {
@@ -196,6 +225,6 @@ var top = arguments.length <= 0 || arguments[0] === undefined ? 0 : arguments[0];
     handleVerticalTrackMouseDown: function handleVerticalTrackMouseDown(event) {
-        var _refs = this.refs;
-        var thumbVertical = _refs.thumbVertical;
-        var barVertical = _refs.barVertical;
-        var view = _refs.view;
+        var _refs2 = this.refs;
+        var thumbVertical = _refs2.thumbVertical;
+        var barVertical = _refs2.barVertical;
+        var view = _refs2.view;
 
@@ -208,6 +237,6 @@ var offset = Math.abs(event.target.getBoundingClientRect().top - event.clientY);
     handleHorizontalTrackMouseDown: function handleHorizontalTrackMouseDown() {
-        var _refs2 = this.refs;
-        var thumbHorizontal = _refs2.thumbHorizontal;
-        var barHorizontal = _refs2.barHorizontal;
-        var view = _refs2.view;
+        var _refs3 = this.refs;
+        var thumbHorizontal = _refs3.thumbHorizontal;
+        var barHorizontal = _refs3.barHorizontal;
+        var view = _refs3.view;
 
@@ -239,6 +268,6 @@ var offset = Math.abs(event.target.getBoundingClientRect().left - event.clientX);
         if (this.prevPageY) {
-            var _refs3 = this.refs;
-            var barVertical = _refs3.barVertical;
-            var thumbVertical = _refs3.thumbVertical;
-            var view = _refs3.view;
+            var _refs4 = this.refs;
+            var barVertical = _refs4.barVertical;
+            var thumbVertical = _refs4.thumbVertical;
+            var view = _refs4.view;
 
@@ -252,6 +281,6 @@ var offset = (barVertical.getBoundingClientRect().top - event.clientY) * -1;
         if (this.prevPageX) {
-            var _refs4 = this.refs;
-            var barHorizontal = _refs4.barHorizontal;
-            var thumbHorizontal = _refs4.thumbHorizontal;
-            var view = _refs4.view;
+            var _refs5 = this.refs;
+            var barHorizontal = _refs5.barHorizontal;
+            var thumbHorizontal = _refs5.thumbHorizontal;
+            var view = _refs5.view;
 
@@ -294,7 +323,5 @@ var offset = (barHorizontal.getBoundingClientRect().left - event.clientX) * -1;
     update: function update(callback) {
-        var _refs5 = this.refs;
-        var thumbHorizontal = _refs5.thumbHorizontal;
-        var thumbVertical = _refs5.thumbVertical;
-        var barHorizontal = _refs5.barHorizontal;
-        var barVertical = _refs5.barVertical;
+        var _refs6 = this.refs;
+        var thumbHorizontal = _refs6.thumbHorizontal;
+        var thumbVertical = _refs6.thumbVertical;
 
@@ -325,6 +352,2 @@ var _getInnerSizePercenta = this.getInnerSizePercentage();
                 (0, _domCss2.default)(thumbVertical, thumbVerticalStyle);
-
-                // Hide scrollbars, when view does not overflow container
-                if (widthPercentageInner >= 100) (0, _domCss2.default)(barHorizontal, { height: 0 });
-                if (heightPercentageInner >= 100) (0, _domCss2.default)(barVertical, { width: 0 });
             }
@@ -331,0 +354,0 @@ if (typeof callback !== 'function') return;

package.json

 {
   "name": "react-custom-scrollbars",
-  "version": "2.2.1",
+  "version": "2.2.2",
   "description": "React scrollbars component",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

No alert changes

Improved metrics

Total package byte prevSize

35893

increased by3.08%

Lines of code

557

increased by3.92%

No dependency changes