beautify-scrollbar - npm Package Compare versions

Comparing version 0.0.2 to 1.0.0

dist/index.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.BeautifyScrollbar=e():t.BeautifyScrollbar=e()}(window,function(){return function(t){var e={};function i(n){if(e[n])return e[n].exports;var o=e[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,i),o.l=!0,o.exports}return i.m=t,i.c=e,i.d=function(t,e,n){i.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:n})},i.r=function(t){Object.defineProperty(t,"__esModule",{value:!0})},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=0)}([function(t,e,i){"use strict";i.r(e),i(2);var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};function o(t){var e=window.document.createElement("div");return e.className=t,e}function s(t){t.remove?t.remove():t.parentNode&&t.parentNode.removeChild(t)}function r(t,e){if("object"===(void 0===e?"undefined":n(e))){for(var i in e){var o=e[i];"number"==typeof o&&(o+="px"),t.style[i]=o}return t}}var l=function(){function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),"string"==typeof e&&(e=document.querySelector(e)),!e||!e.nodeName)throw new Error("no element is specified to initialize BeautifyScrollBar");if(this.element=e,this.ownerDocument=this.element.ownerDocument||document,this.rect=this.element.getBoundingClientRect(),this.options=Object.assign({},{wheelSpeed:1},i),this.xBar=null,this.xThumb=null,this.xThumbWidth=null,this.yBar=null,this.yThumb=null,this.yThumbHeight=null,this.startingMousePageY=0,this.startingMousePageX=0,this.startingScrollTop=0,this.startingScrollLeft=0,this.yScrollFactor=0,this.xScrollFactor=0,this.dragDirect="",this.wheelEventHandler=this._wheelEventHandler.bind(this),this.mouseMoveHandler=this._mouseMoveHandler.bind(this),this.mouseUpHandler=this._mouseUpHandler.bind(this),this.element.classList)this.element.classList.add("beautify-scroll-container");else{var n=this.element.className;this.element.className=n+" beautify-scroll-container"}this.contentWidth=isNaN(this.options.contentWidth)?Math.max(this.element.scrollWidth,e.clientWidth):this.options.contentWidth,this.contentHeight=isNaN(this.options.contentHeight)?Math.max(this.element.scrollHeight,e.clientHeight):this.options.contentHeight,this.containerWidth=this.rect.width||e.clientWidth,this.containerHeight=this.rect.height||e.clientHeight,this.maxScrollLeft=this.contentWidth-this.containerWidth,this.maxScrollTop=this.contentHeight-this.containerHeight,this.maxScrollTop&&this.createBarEle(),this.bindWheelEvent()}return t.prototype.updateContentHeight=function(t){this.contentHeight=t,this.maxScrollTop=t-this.containerHeight,this.yBar||this.createBarEle()},t.prototype.createBarEle=function(){this.maxScrollTop>0&&(this.yBar=o("beautify-scroll__y-bar"),this.element.appendChild(this.yBar),r(this.yBar,{height:this.containerHeight,right:0,top:0}),this.yBar.setAttribute("tabindex",0),this.yThumb=o("beautify-scroll__y-thumb"),this.yBar.appendChild(this.yThumb),this.yThumbHeight=parseInt(this.containerHeight*this.containerHeight/this.contentHeight,10),r(this.yThumb,{top:0,height:this.yThumbHeight}),this.yScrollFactor=(this.contentHeight-this.containerHeight)/(this.containerHeight-this.yThumbHeight),this.yThumb.addEventListener("mousedown",this.mouseDownHandler.bind(this,"y"),!1)),this.maxScrollLeft>0&&(this.xBar=o("beautify-scroll__x-bar"),this.element.appendChild(this.xBar),r(this.xBar,{left:0,width:this.containerWidth,bottom:0}),this.xBar.setAttribute("tabindex",0),this.xThumb=o("beautify-scroll__x-thumb"),this.xBar.appendChild(this.xThumb),this.xThumbWidth=parseInt(this.containerWidth*this.containerWidth/this.contentWidth,10),r(this.xThumb,{left:0,width:this.xThumbWidth}),this.xScrollFactor=(this.contentWidth-this.containerWidth)/(this.containerWidth-this.xThumbWidth),this.xThumb.addEventListener("mousedown",this.mouseDownHandler.bind(this,"x"),!1))},t.prototype.bindWheelEvent=function(){void 0!==window.onwheel?this.element.addEventListener("wheel",this.wheelEventHandler,!1):void 0!==window.onmousewheel&&this.element.addEventListener("mousewheel",this.wheelEventHandler,!1)},t.prototype._mouseMoveHandler=function(t){if(t.stopPropagation(),t.preventDefault(),"x"===this.dragDirect){var e=this.startingScrollLeft+this.xScrollFactor*(t.pageX-this.startingMousePageX);this.element.scrollLeft=e>this.maxScrollLeft?this.maxScrollLeft:e}else if("y"===this.dragDirect){var i=this.startingScrollTop+this.yScrollFactor*(t.pageY-this.startingMousePageY);this.element.scrollTop=i>this.maxScrollTop?this.maxScrollTop:i}this.updateScrollBarStyle()},t.prototype._mouseUpHandler=function(t){t.stopPropagation(),t.preventDefault(),this.ownerDocument.removeEventListener("mousemove",this.mouseMoveHandler),this.ownerDocument.removeEventListener("mouseup",this.mouseUpHandler)},t.prototype.mouseDownHandler=function(t,e){e.stopPropagation(),e.preventDefault(),"x"===t&&(this.startingMousePageX=e.pageX,this.startingScrollLeft=this.element.scrollLeft),"y"===t&&(this.startingMousePageY=e.pageY,this.startingScrollTop=this.element.scrollTop),this.dragDirect=t,this.ownerDocument.addEventListener("mousemove",this.mouseMoveHandler,!1),this.ownerDocument.addEventListener("mouseup",this.mouseUpHandler,!1)},t.prototype.updateScrollBarStyle=function(){this.yBar&&r(this.yBar,{top:this.element.scrollTop,height:this.containerHeight,right:-this.element.scrollLeft});var t=parseInt(this.element.scrollTop*(this.containerHeight-this.yThumbHeight)/this.maxScrollTop,10);this.yThumb&&r(this.yThumb,{top:t,height:this.yThumbHeight}),this.xBar&&r(this.xBar,{left:this.element.scrollLeft,width:this.containerWidth,bottom:-this.element.scrollTop});var e=parseInt(this.element.scrollLeft*(this.containerWidth-this.xThumbWidth)/this.maxScrollLeft,10);this.xThumb&&r(this.xThumb,{left:e,width:this.xThumbWidth}),"function"==typeof this.options.callBack&&this.options.callBack({scrollLeft:this.element.scrollLeft,scrollTop:this.element.scrollTop})},t.prototype._wheelEventHandler=function(t){t.stopPropagation(),this.maxScrollTop>0&&t.preventDefault();var e=function(t){var e=t.deltaX,i=-1*t.deltaY;return void 0!==e&&void 0!==i||(e=-1*t.wheelDeltaX/6,i=t.wheelDeltaY/6),t.deltaMode&&1===t.deltaMode&&(e*=10,i*=10),e!=e&&i!=i&&(e=0,i=t.wheelDelta),t.shiftKey?[-i,-e]:[e,i]}(t),i=e[0],n=e[1];if(this.shouldUpdateScrollTop(n)){var o=this.element.scrollTop-n*this.options.wheelSpeed;this.element.scrollTop=o>this.maxScrollTop?this.maxScrollTop:o}if(this.shouldUpdateScrollLeft(i)){var s=this.element.scrollLeft+i*this.options.wheelSpeed;this.element.scrollLeft=s>this.maxScrollLeft?this.maxScrollLeft:s}this.updateScrollBarStyle()},t.prototype.shouldUpdateScrollLeft=function(t){return!(this.element.scrollLeft===this.maxScrollLeft&&t>0||0===this.element.scrollLeft&&t<=0)},t.prototype.shouldUpdateScrollTop=function(t){return!(this.element.scrollTop===this.maxScrollTop&&t<0||0===this.element.scrollTop&&t>=0)},t.prototype.removeAllEventListener=function(){this.element.removeEventListener("wheel",this.wheelEventHandler),this.element.removeEventListener("mousewheel",this.wheelEventHandler),this.xThumb&&this.xThumb.removeAllEventListener("mousedown"),this.yThumb&&this.yThumb.removeAllEventListener("mousedown")},t.prototype.removeClasses=function(){this.element.className=this.element.className.split(" ").filter(function(t){return!t.match(/^beautify\-scroll\-container$/)}).join(" ")},t.prototype.destroy=function(){this.removeAllEventListener(),this.removeClasses(),this.element=null,this.yBar&&s(this.yBar),this.xBar&&s(this.xBar),this.xBar=null,this.xThumb=null,this.xThumbWidth=null,this.yBar=null,this.yThumb=null,this.yThumbHeight=null,this.wheelEventHandler=null,this.mouseMoveHandler=null,this.mouseUpHandler=null},t}();e.default=l},function(t,e){t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var i=function(t,e){var i,n=t[1]||"",o=t[3];if(!o)return n;if(e&&"function"==typeof btoa){var s=(i=o,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */"),r=o.sources.map(function(t){return"/*# sourceURL="+o.sourceRoot+t+" */"});return[n].concat(r).concat([s]).join("\n")}return[n].join("\n")}(e,t);return e[2]?"@media "+e[2]+"{"+i+"}":i}).join("")},e.i=function(t,i){"string"==typeof t&&(t=[[null,t,""]]);for(var n={},o=0;o<this.length;o++){var s=this[o][0];"number"==typeof s&&(n[s]=!0)}for(o=0;o<t.length;o++){var r=t[o];"number"==typeof r[0]&&n[r[0]]||(i&&!r[2]?r[2]=i:i&&(r[2]="("+r[2]+") and ("+i+")"),e.push(r))}},e}},function(t,e,i){(t.exports=i(1)(!1)).push([t.i,"/* scrollbar start */\n.beautify-scroll-container {\n  position: relative !important;\n  overflow: hidden !important;\n  -webkit-box-sizing: border-box !important;\n          box-sizing: border-box !important;\n  overflow-anchor: none;\n}\n.beautify-scroll-container:hover .beautify-scroll__y-bar {\n  width: 5px;\n}\n.beautify-scroll-container:hover .beautify-scroll__x-bar {\n  height: 5px;\n}\n.beautify-scroll-container:hover .beautify-scroll__y-thumb,\n.beautify-scroll-container:hover .beautify-scroll__x-thumb {\n  opacity: 0.75;\n}\n.beautify-scroll__y-bar,\n.beautify-scroll__x-bar {\n  position: absolute;\n  background-color: transparent;\n  z-index: 100;\n  -webkit-transition: all .2s linear;\n  -o-transition: all .2s linear;\n  transition: all .2s linear;\n}\n.beautify-scroll__y-bar {\n  width: 0px;\n  -webkit-transition: width 0.2s ease-in-out;\n  -o-transition: width 0.2s ease-in-out;\n  transition: width 0.2s ease-in-out;\n}\n.beautify-scroll__x-bar {\n  height: 0px;\n  -webkit-transition: height 0.2s ease-in-out;\n  -o-transition: height 0.2s ease-in-out;\n  transition: height 0.2s ease-in-out;\n}\n.beautify-scroll__y-thumb,\n.beautify-scroll__x-thumb {\n  position: absolute;\n  border-radius: 6px;\n  background-color: #aaa;\n  opacity: 0;\n  -webkit-transition: all .2s linear;\n  -o-transition: all .2s linear;\n  transition: all .2s linear;\n}\n.beautify-scroll__x-thumb {\n  height: 5px;\n}\n.beautify-scroll__y-thumb {\n  width: 5px;\n}\n/* scrollbar end */\n",""])}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.BeautifyScrollbar=e():t.BeautifyScrollbar=e()}(window,function(){return function(t){var e={};function i(n){if(e[n])return e[n].exports;var o=e[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,i),o.l=!0,o.exports}return i.m=t,i.c=e,i.d=function(t,e,n){i.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:n})},i.r=function(t){Object.defineProperty(t,"__esModule",{value:!0})},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=0)}([function(t,e,i){"use strict";i.r(e),i(2);var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};function o(t){var e=window.document.createElement("div");return e.className=t,e}function s(t){t.remove?t.remove():t.parentNode&&t.parentNode.removeChild(t)}function h(t,e){if("object"===(void 0===e?"undefined":n(e))){for(var i in e){var o=e[i];"number"==typeof o&&(o+="px"),t.style[i]=o}return t}}function r(t){var e=(t.getAttribute("class")||"").replace(/^\s+|\s+$/g,"").split(/\s+/);return""===e[0]&&e.shift(),e}function l(t,e){if(e&&"string"==typeof e&&t&&t.nodeName){for(var i=[],n=r(t),o=e.split(" "),s=0;s<o.length;s++){var h=o[s];h&&(t.classList?t.classList.remove(h):n.splice(n.indexOf(h),1))}i=n,t.classList||t.setAttribute("class",i.join(" "))}}function a(t,e){if(e&&"string"==typeof e&&t&&t.nodeName){for(var i=r(t),n=e.split(" "),o=0;o<n.length;o++){var s=n[o];s&&(t.classList?t.classList.add(s):i.push(s))}t.classList||t.setAttribute("class",i.join(" "))}}var c=function(t){if("function"==typeof window.CustomEvent)return new CustomEvent(t,{bubbles:!1,cancelable:!1,detail:null});var e=document.createEvent("CustomEvent");return e.initCustomEvent(t,!1,!1,null),e},u=function(){function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),"string"==typeof e&&(e=document.querySelector(e)),!e||!e.nodeName)throw new Error("no element is specified to initialize BeautifyScrollBar");if(this.element=e,this.ownerDocument=this.element.ownerDocument||document,this.rect=this.element.getBoundingClientRect(),!this.rect.height)throw new Error("the height of container can not be 0");this.options=Object.assign({},{wheelSpeed:1,threshold:0,shownScrollbarX:!0,shownScrollbarY:!0,maxThumbXLength:void 0,maxThumbYLength:void 0},i,{threshold:isNaN(i.threshold)||i.threshold<=0?0:i.threshold,wheelSpeed:isNaN(i.wheelSpeed)||i.wheelSpeed<=0?1:i.wheelSpeed,maxThumbXLength:isNaN(i.maxThumbXLength)||i.maxThumbXLength<=0?void 0:i.maxThumbXLength,maxThumbYLength:isNaN(i.maxThumbYLength)||i.maxThumbYLength<=0?void 0:i.maxThumbYLength}),this.lastScrollLeft=0,this.lastScrollTop=0,this.xBar=null,this.xThumb=null,this.xThumbWidth=null,this.yBar=null,this.yThumb=null,this.yThumbHeight=null,this.startingMousePageY=0,this.startingMousePageX=0,this.startingScrollTop=0,this.startingScrollLeft=0,this.yScrollFactor=0,this.xScrollFactor=0,this.dragDirect="",this.wheelEventHandler=this._wheelEventHandler.bind(this),this.docMouseMoveHandler=this._docMouseMoveHandler.bind(this),this.docMouseUpHandler=this._docMouseUpHandler.bind(this),a(this.element,"beautify-scroll-container"),this._computed(),this._createBarEle(),this._bindEvent()}return t.prototype._computed=function(){this.contentWidth=isNaN(this.options.contentWidth)?Math.max(this.element.scrollWidth,this.rect.width):this.options.contentWidth,this.contentHeight=isNaN(this.options.contentHeight)?Math.max(this.element.scrollHeight,this.rect.height):this.options.contentHeight,this.containerWidth=this.rect.width,this.containerHeight=this.rect.height,this.maxScrollLeft=this.contentWidth-this.containerWidth,this.maxScrollTop=this.contentHeight-this.containerHeight},t.prototype._createBarEle=function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(this.maxScrollTop>0&&this.options.shownScrollbarY){var e=0,i=0,n=0;this.yBar||(this.yBar=o("beautify-scroll__y-bar"),this.element.appendChild(this.yBar),this.yBar.setAttribute("tabindex",-1),this.yThumb=o("beautify-scroll__y-thumb"),this.yBar.appendChild(this.yThumb),this.yThumb.addEventListener("mousedown",this._mouseDownHandler.bind(this,"y"),!1)),t&&(e=this.yBar.style.top,i=this.yBar.style.right,n=this.yThumb.style.top),h(this.yBar,{height:this.containerHeight,right:i,top:e});var s=parseInt(this.containerHeight*this.containerHeight/this.contentHeight,10);this.yThumbHeight=isNaN(this.options.maxThumbYLength)||s<=this.options.maxThumbYLength?s:this.options.maxThumbYLength,h(this.yThumb,{top:n,height:this.yThumbHeight}),this.yScrollFactor=(this.contentHeight-this.containerHeight)/(this.containerHeight-this.yThumbHeight)}if(this.maxScrollLeft>0&&this.options.shownScrollbarX){var r=0,l=0,a=0;this.xBar||(this.xBar=o("beautify-scroll__x-bar"),this.element.appendChild(this.xBar),this.xBar.setAttribute("tabindex",-1),this.xThumb=o("beautify-scroll__x-thumb"),this.xBar.appendChild(this.xThumb),this.xThumb.addEventListener("mousedown",this._mouseDownHandler.bind(this,"x"),!1)),t&&(r=this.xBar.style.left,l=this.xBar.style.bottom,a=this.xThumb.style.left),h(this.xBar,{left:r,width:this.containerWidth,bottom:l});var c=parseInt(this.containerWidth*this.containerWidth/this.contentWidth,10);this.xThumbWidth=isNaN(this.options.maxThumbXLength)||c<=this.options.maxThumbXLength?c:this.options.maxThumbXLength,h(this.xThumb,{left:a,width:this.xThumbWidth}),this.xScrollFactor=(this.contentWidth-this.containerWidth)/(this.containerWidth-this.xThumbWidth)}},t.prototype._bindEvent=function(){var t=this;void 0!==window.onwheel?this.element.addEventListener("wheel",this.wheelEventHandler,!1):void 0!==window.onmousewheel&&this.element.addEventListener("mousewheel",this.wheelEventHandler,!1),this.element.addEventListener("mouseenter",function(){t.yThumb&&a(t.yThumb,"shown"),t.xThumb&&a(t.xThumb,"shown")},!1),this.element.addEventListener("mouseleave",function(){t.yThumb&&l(t.yThumb,"shown"),t.xThumb&&l(t.xThumb,"shown")},!1)},t.prototype._handleScrollDiff=function(){var t=this.element.scrollTop-this.lastScrollTop;0===this.element.scrollTop&&t&&this.element.dispatchEvent(c("bs-y-reach-start")),this.element.scrollTop===this.maxScrollTop&&t&&this.element.dispatchEvent(c("bs-y-reach-end")),0===this.element.scrollLeft&&t&&this.element.dispatchEvent(c("bs-x-reach-start")),this.element.scrollLeft===this.maxScrollLeft&&t&&this.element.dispatchEvent(c("bs-x-reach-end")),this.element.scrollHeight-this.element.scrollTop-this.rect.height<=this.options.threshold&&this.element.dispatchEvent(c("bs-threshold"))},t.prototype._updateScrollBarStyle=function(){this.yBar&&h(this.yBar,{top:this.element.scrollTop,height:this.containerHeight,right:-this.element.scrollLeft});var t=parseInt(this.element.scrollTop*(this.containerHeight-this.yThumbHeight)/this.maxScrollTop,10);this.yThumb&&h(this.yThumb,{top:t,height:this.yThumbHeight}),this.xBar&&h(this.xBar,{left:this.element.scrollLeft,width:this.containerWidth,bottom:-this.element.scrollTop});var e=parseInt(this.element.scrollLeft*(this.containerWidth-this.xThumbWidth)/this.maxScrollLeft,10);this.xThumb&&h(this.xThumb,{left:e,width:this.xThumbWidth})},t.prototype._docMouseMoveHandler=function(t){if(t.stopPropagation(),t.preventDefault(),this.lastScrollLeft=this.element.scrollLeft,this.lastScrollTop=this.element.scrollTop,"x"===this.dragDirect){var e=this.startingScrollLeft+this.xScrollFactor*(t.pageX-this.startingMousePageX);this.element.scrollLeft=e>this.maxScrollLeft?this.maxScrollLeft:e}else if("y"===this.dragDirect){var i=this.startingScrollTop+this.yScrollFactor*(t.pageY-this.startingMousePageY);this.element.scrollTop=i>this.maxScrollTop?this.maxScrollTop:i}this._handleScrollDiff(),this._updateScrollBarStyle()},t.prototype._docMouseUpHandler=function(t){t.stopPropagation(),t.preventDefault(),"x"===this.dragDirect&&this.xThumb&&l(this.xThumb,"focus"),"y"===this.dragDirect&&this.yThumb&&l(this.yThumb,"focus"),this.ownerDocument.removeEventListener("mousemove",this.docMouseMoveHandler),this.ownerDocument.removeEventListener("mouseup",this.docMouseUpHandler)},t.prototype._mouseDownHandler=function(t,e){e.stopPropagation(),e.preventDefault(),"x"===t&&(this.startingMousePageX=e.pageX,this.startingScrollLeft=this.element.scrollLeft,this.xThumb&&a(this.xThumb,"focus")),"y"===t&&(this.startingMousePageY=e.pageY,this.startingScrollTop=this.element.scrollTop,this.yThumb&&a(this.yThumb,"focus")),this.dragDirect=t,this.ownerDocument.addEventListener("mousemove",this.docMouseMoveHandler,!1),this.ownerDocument.addEventListener("mouseup",this.docMouseUpHandler,!1)},t.prototype._wheelEventHandler=function(t){t.stopPropagation(),this.maxScrollTop>0&&t.preventDefault();var e=function(t){var e=t.deltaX,i=-1*t.deltaY;return void 0!==e&&void 0!==i||(e=-1*t.wheelDeltaX/6,i=t.wheelDeltaY/6),t.deltaMode&&1===t.deltaMode&&(e*=10,i*=10),e!=e&&i!=i&&(e=0,i=t.wheelDelta),t.shiftKey?[-i,-e]:[e,i]}(t),i=e[0],n=e[1];if(this.lastScrollLeft=this.element.scrollLeft,this.lastScrollTop=this.element.scrollTop,this._shouldUpdateScrollLeft(i)){var o=this.element.scrollLeft+i*this.options.wheelSpeed;this.element.scrollLeft=o>this.maxScrollLeft?this.maxScrollLeft:o}if(this._shouldUpdateScrollTop(n)){var s=this.element.scrollTop-n*this.options.wheelSpeed;this.element.scrollTop=s>this.maxScrollTop?this.maxScrollTop:s}this._handleScrollDiff(),this._updateScrollBarStyle()},t.prototype._shouldUpdateScrollLeft=function(t){return!(0===this.element.scrollLeft&&t<=0||this.element.scrollLeft===this.maxScrollLeft&&t>0)},t.prototype._shouldUpdateScrollTop=function(t){return!(0===this.element.scrollTop&&t>=0||this.element.scrollTop===this.maxScrollTop&&t<0)},t.prototype._unbindEvent=function(){this.element.removeEventListener("mouseenter"),this.element.removeEventListener("mouseleave"),this.element.removeEventListener("wheel",this.wheelEventHandler),this.element.removeEventListener("mousewheel",this.wheelEventHandler),this.xThumb&&this.xThumb.removeAllEventListener("mousedown"),this.yThumb&&this.yThumb.removeAllEventListener("mousedown")},t.prototype.update=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};this.element&&(this.options=Object.assign({},this.options,t),this._computed(),this._createBarEle(!0))},t.prototype.destroy=function(){this.element&&(this._unbindEvent(),l(this.element,"beautify-scroll-container"),this.element=null,this.yBar&&s(this.yBar),this.xBar&&s(this.xBar),this.xBar=null,this.xThumb=null,this.xThumbWidth=null,this.yBar=null,this.yThumb=null,this.yThumbHeight=null,this.wheelEventHandler=null,this.docMouseMoveHandler=null,this.docMouseUpHandler=null)},t}();e.default=u},function(t,e){t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var i=function(t,e){var i,n=t[1]||"",o=t[3];if(!o)return n;if(e&&"function"==typeof btoa){var s=(i=o,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */"),h=o.sources.map(function(t){return"/*# sourceURL="+o.sourceRoot+t+" */"});return[n].concat(h).concat([s]).join("\n")}return[n].join("\n")}(e,t);return e[2]?"@media "+e[2]+"{"+i+"}":i}).join("")},e.i=function(t,i){"string"==typeof t&&(t=[[null,t,""]]);for(var n={},o=0;o<this.length;o++){var s=this[o][0];"number"==typeof s&&(n[s]=!0)}for(o=0;o<t.length;o++){var h=t[o];"number"==typeof h[0]&&n[h[0]]||(i&&!h[2]?h[2]=i:i&&(h[2]="("+h[2]+") and ("+i+")"),e.push(h))}},e}},function(t,e,i){(t.exports=i(1)(!1)).push([t.i,"/* scrollbar start */\n.beautify-scroll-container {\n  position: relative !important;\n  overflow: hidden !important;\n  -webkit-box-sizing: border-box !important;\n          box-sizing: border-box !important;\n  overflow-anchor: none;\n}\n.beautify-scroll__y-bar,\n.beautify-scroll__x-bar {\n  position: absolute;\n  z-index: 100;\n  background-color: transparent;\n}\n.beautify-scroll__y-bar {\n  width: 10px;\n}\n.beautify-scroll__x-bar {\n  height: 10px;\n}\n.beautify-scroll__y-thumb,\n.beautify-scroll__x-thumb {\n  position: absolute;\n  border-radius: 6px;\n  background-color: #B8B8B8;\n  opacity: 0;\n  -webkit-transition: all .2s linear;\n  -o-transition: all .2s linear;\n  transition: all .2s linear;\n}\n.beautify-scroll__y-thumb:hover,\n.beautify-scroll__x-thumb:hover {\n  background-color: #777777;\n}\n.beautify-scroll__y-thumb.shown,\n.beautify-scroll__x-thumb.shown {\n  opacity: 1;\n}\n.beautify-scroll__y-thumb.focus,\n.beautify-scroll__x-thumb.focus {\n  opacity: 1;\n  background-color: #777777;\n}\n.beautify-scroll__x-thumb {\n  height: 7px;\n  bottom: 0;\n}\n.beautify-scroll__y-thumb {\n  width: 7px;\n  right: 0;\n}\n/* scrollbar end */\n",""])}])});

package.json

 {
   "name": "beautify-scrollbar",
-  "version": "0.0.2",
+  "version": "1.0.0",
   "description": "Beautify browser's scrollbars",
@@ -5,0 +5,0 @@ "author": "dwqs",

README.md

@@ -28,2 +28,7 @@ [![build pass](https://api.travis-ci.org/dwqs/beautify-scrollbar.svg?branch=master)](https://travis-ci.org/dwqs/beautify-scrollbar) [![js-standard-style](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com) ![npm-version](https://img.shields.io/npm/v/beautify-scrollbar.svg) ![license](https://img.shields.io/npm/l/beautify-scrollbar.svg)
 const bs = new BeautifyScrollbar('#container');
+
+// or with options
+const bs = new BeautifyScrollbar('#container', {
+    wheelSpeed: 2
+});
 ```
@@ -33,2 +38,78 @@
 
+>Note: the height of this container element which is returned by `getBoundingClientRect()` can not be 0, it must hava a `height` style.
+
+## Options
+### wheelSpeed
+**Type:** `Number`
+
+**Default:** `1`
+
+The scroll speed applied to mousewheel event.
+
+### threshold
+**Type:** `Number`
+
+**Default:** `1`
+
+The threshold value to trigger next-fetch in infinite scrolling.
+
+### shownScrollbarX
+**Type:** `Boolean`
+
+**Default:** `true`
+
+When set to false, the scroll bar in X axis will not be available, regardless of the content width.
+
+### shownScrollbarY
+**Type:** `Boolean`
+
+**Default:** `true`
+
+When set to false, the scroll bar in Y axis will not be available, regardless of the content height.
+
+### maxThumbXLength
+**Type:** `Number`
+
+**Default:** `undefined`
+
+When set to an integer value, the X thumb part of the scrollbar will not expand over that number of pixels.
+
+### maxThumbYLength 
+**Type:** `Number`
+
+**Default:** `undefined`
+
+When set to an integer value, the Y thumb part of the scrollbar will not expand over that number of pixels.
+
+## Events
+`beautify-scrollbar` dispatches custom events.
+
+```js
+container.addEventListener('bs-x-reach-end', () => ..., false);
+```
+
+### `bs-y-reach-start`
+This event fires when scrolling reaches the start of the y-axis.
+
+### `bs-y-reach-end`
+This event fires when scrolling reaches the end of the y-axis.
+
+### `bs-x-reach-start`
+This event fires when scrolling reaches the start of the x-axis.
+
+### `bs-x-reach-end`
+This event fires when scrolling reaches the end of the x-axis.
+
+### `bs-threshold`
+This event fires when `diff-value` is lte the `options.threshold`.
+
+>diff-value = container.scrollHeight - container.scrollTop - container.height
+
+## API
+### update([options])
+Update some props of instance when you need. Maybe it's useful when it combines with [v2-lazy-list](https://github.com/dwqs/v2-lazy-list);
+
+### destroy
+Destroy the instance and will unbind events whose instance bind.
+
 ## Development
@@ -35,0 +116,0 @@ ```

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

19960

increased by29.69%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

125

increased by184.09%

No dependency changes