diff --git a/dist/reactCustomScroll.js b/dist/reactCustomScroll.js index d62e059..87c92d9 100644 --- a/dist/reactCustomScroll.js +++ b/dist/reactCustomScroll.js @@ -1 +1 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(function(){try{return require("prop-types")}catch(e){}}(),require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["prop-types","react","react-dom"],t):"object"==typeof exports?exports.ReactCustomScroll=t(function(){try{return require("prop-types")}catch(e){}}(),require("react"),require("react-dom")):e.ReactCustomScroll=t(e["prop-types"],e.react,e["react-dom"])}("undefined"!=typeof self?self:this,(function(e,t,o){return(()=>{"use strict";var r={229:t=>{if(void 0===e){var o=new Error("Cannot find module 'prop-types'");throw o.code="MODULE_NOT_FOUND",o}t.exports=e},297:e=>{e.exports=t},268:e=>{e.exports=o}},n={};function l(e){var t=n[e];if(void 0!==t)return t.exports;var o=n[e]={exports:{}};return r[e](o,o.exports,l),o.exports}l.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return l.d(t,{a:t}),t},l.d=(e,t)=>{for(var o in t)l.o(t,o)&&!l.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},l.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),l.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};return(()=>{l.r(i),l.d(i,{default:()=>S});var e=l(297),t=l.n(e),o=l(268),r=l.n(o);const n={"custom-scroll":"rcs-custom-scroll",customScroll:"rcs-custom-scroll","outer-container":"rcs-outer-container",outerContainer:"rcs-outer-container",positioning:"rcs-positioning","custom-scrollbar":"rcs-custom-scrollbar",customScrollbar:"rcs-custom-scrollbar","inner-container":"rcs-inner-container",innerContainer:"rcs-inner-container","content-scrolled":"rcs-content-scrolled",contentScrolled:"rcs-content-scrolled","scroll-handle-dragged":"rcs-scroll-handle-dragged",scrollHandleDragged:"rcs-scroll-handle-dragged","custom-scrollbar-rtl":"rcs-custom-scrollbar-rtl",customScrollbarRtl:"rcs-custom-scrollbar-rtl","custom-scroll-handle":"rcs-custom-scroll-handle",customScrollHandle:"rcs-custom-scroll-handle","inner-handle":"rcs-inner-handle",innerHandle:"rcs-inner-handle"};function c(e){return(c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function s(e,t){for(var o=0;o(o=o||0===o?o:e)?(console.error("min limit is greater than max limit"),e):eo?o:e};function g(e,t){return e.clientX>t.left&&e.clientXt.top&&e.clientY1;o.hasScroll!==e&&(o.hasScroll=e,o.forceUpdate())})),h(p(o),"updateScrollPosition",(function(e){var t=o.getScrolledElement(),r=d(e,0,o.contentHeight-o.visibleHeight);t.scrollTop=r,o.setState({scrollPos:r})})),h(p(o),"onClick",(function(e){if(o.hasScroll&&o.isMouseEventOnCustomScrollbar(e)&&!o.isMouseEventOnScrollHandle(e)){var t=o.calculateNewScrollHandleTop(e),r=o.getScrollValueFromHandlePosition(t);o.updateScrollPosition(r)}})),h(p(o),"isMouseEventOnCustomScrollbar",(function(e){if(!o.customScrollbarRef.current)return!1;var t=r().findDOMNode(p(o)).getBoundingClientRect(),n=o.customScrollbarRef.current.getBoundingClientRect(),l=o.props.rtl?{left:t.left,right:n.right}:{left:n.left,width:t.right};return g(e,Object.assign({},{left:t.left,right:t.right,top:t.top,height:t.height},l))})),h(p(o),"isMouseEventOnScrollHandle",(function(e){return!!o.scrollHandleRef.current&&function(e,t){return g(e,t.getBoundingClientRect())}(e,r().findDOMNode(o.scrollHandleRef.current))})),h(p(o),"calculateNewScrollHandleTop",(function(e){var t=r().findDOMNode(p(o)).getBoundingClientRect().top+window.pageYOffset,n=e.pageY-t,l=o.getScrollHandleStyle().top;return n>l+o.scrollHandleHeight?l+Math.min(o.scrollHandleHeight,o.visibleHeight-o.scrollHandleHeight):l-Math.max(o.scrollHandleHeight,0)})),h(p(o),"getScrollValueFromHandlePosition",(function(e){return e/o.scrollRatio})),h(p(o),"getScrollHandleStyle",(function(){var e=o.state.scrollPos*o.scrollRatio;return o.scrollHandleHeight=o.visibleHeight*o.scrollRatio,{height:o.scrollHandleHeight,top:e}})),h(p(o),"adjustCustomScrollPosToContentPos",(function(e){o.setState({scrollPos:e})})),h(p(o),"onScroll",(function(e){o.props.freezePosition||(o.hideScrollThumb(),o.adjustCustomScrollPosToContentPos(e.currentTarget.scrollTop),o.props.onScroll&&o.props.onScroll(e))})),h(p(o),"getScrolledElement",(function(){return o.innerContainerRef.current})),h(p(o),"onMouseDown",(function(e){o.hasScroll&&o.isMouseEventOnScrollHandle(e)&&(o.startDragHandlePos=o.getScrollHandleStyle().top,o.startDragMousePos=e.pageY,o.setState({onDrag:!0}),document.addEventListener("mousemove",o.onHandleDrag,{passive:!1}),document.addEventListener("mouseup",o.onHandleDragEnd,{passive:!1}))})),h(p(o),"onTouchStart",(function(){o.setState({onDrag:!0})})),h(p(o),"onHandleDrag",(function(e){e.preventDefault();var t=e.pageY-o.startDragMousePos,r=d(o.startDragHandlePos+t,0,o.visibleHeight-o.scrollHandleHeight),n=o.getScrollValueFromHandlePosition(r);o.updateScrollPosition(n)})),h(p(o),"onHandleDragEnd",(function(e){o.setState({onDrag:!1}),e.preventDefault(),document.removeEventListener("mousemove",o.onHandleDrag),document.removeEventListener("mouseup",o.onHandleDragEnd)})),h(p(o),"blockOuterScroll",(function(e){if(!o.props.allowOuterScroll){var t=e.currentTarget,r=e.currentTarget.scrollHeight-e.currentTarget.offsetHeight,n=e.deltaY%3?e.deltaY:10*e.deltaY;t.scrollTop+n<=0?(t.scrollTop=0,e.preventDefault()):t.scrollTop+n>=r&&(t.scrollTop=r,e.preventDefault()),e.stopPropagation()}})),h(p(o),"getInnerContainerClasses",(function(){return o.state.scrollPos&&o.props.addScrolledClass?"".concat(n.innerContainer," ").concat(n.contentScrolled):n.innerContainer})),h(p(o),"getScrollStyles",(function(){var e=o.scrollbarYWidth||20,t=o.props.rtl?"marginLeft":"marginRight",r={height:o.props.heightRelativeToParent||o.props.flex?"100%":""};r[t]=-1*e;var n={height:o.props.heightRelativeToParent||o.props.flex?"100%":"",overflowY:o.props.freezePosition?"hidden":"visible"};return n[t]=o.scrollbarYWidth?0:e,{innerContainer:r,contentWrapper:n}})),h(p(o),"getOuterContainerStyle",(function(){return{height:o.props.heightRelativeToParent||o.props.flex?"100%":""}})),h(p(o),"getRootStyles",(function(){var e={};return o.props.heightRelativeToParent?e.height=o.props.heightRelativeToParent:o.props.flex&&(e.flex=o.props.flex),e})),h(p(o),"enforceMinHandleHeight",(function(e){var t=o.props.minScrollHandleHeight;if(e.height>=t)return e;var r=(t-e.height)*(o.state.scrollPos/(o.contentHeight-o.visibleHeight));return{height:t,top:e.top-r}})),o.scrollbarYWidth=0,o.state={scrollPos:0,onDrag:!1},o.hideScrollThumb=function(e,t){var r;function n(){clearTimeout(r)}function l(){n(),r=setTimeout((function(){o.setState({onDrag:!1})}),500)}return l.cancel=n,l}(),o}return l=S,(i=[{key:"componentDidMount",value:function(){void 0!==this.props.scrollTo?this.updateScrollPosition(this.props.scrollTo):this.forceUpdate(),this.innerContainerRef.current&&this.innerContainerRef.current.addEventListener("wheel",this.blockOuterScroll,{passive:!1})}},{key:"componentDidUpdate",value:function(e,t){var o=this.contentHeight,r=this.visibleHeight,n=this.getScrolledElement(),l=t.scrollPos>=o-r;this.contentHeight=n.scrollHeight,this.scrollbarYWidth=n.offsetWidth-n.clientWidth,this.visibleHeight=n.clientHeight,this.scrollRatio=this.contentHeight?this.visibleHeight/this.contentHeight:1,this.toggleScrollIfNeeded();var i=this.state===t;(this.props.freezePosition||e.freezePosition)&&this.adjustFreezePosition(e),void 0!==this.props.scrollTo&&this.props.scrollTo!==e.scrollTo?this.updateScrollPosition(this.props.scrollTo):this.props.keepAtBottom&&i&&l&&this.updateScrollPosition(this.contentHeight-this.visibleHeight)}},{key:"componentWillUnmount",value:function(){this.hideScrollThumb.cancel(),document.removeEventListener("mousemove",this.onHandleDrag),document.removeEventListener("mouseup",this.onHandleDragEnd),this.innerContainerRef.current&&this.innerContainerRef.current.removeEventListener("wheel",this.blockOuterScroll)}},{key:"render",value:function(){var e=this.getScrollStyles(),o=this.getRootStyles(),r=this.enforceMinHandleHeight(this.getScrollHandleStyle()),l=[this.props.className||"",n.customScroll,this.state.onDrag?n.scrollHandleDragged:""].join(" ");return t().createElement("div",{className:l,style:o},t().createElement("div",{className:n.outerContainer,style:this.getOuterContainerStyle(),onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onClick:this.onClick},this.hasScroll?t().createElement("div",{className:n.positioning},t().createElement("div",{ref:this.customScrollbarRef,className:"".concat(n.customScrollbar," ").concat(this.props.rtl?n.customScrollbarRtl:""),key:"scrollbar"},t().createElement("div",{ref:this.scrollHandleRef,className:n.customScrollHandle,style:r},t().createElement("div",{className:this.props.handleClass})))):null,t().createElement("div",{ref:this.innerContainerRef,className:this.getInnerContainerClasses(),style:e.innerContainer,onScroll:this.onScroll},t().createElement("div",{className:n.contentWrapper,ref:this.contentWrapperRef,style:e.contentWrapper},this.props.children))))}}])&&s(l.prototype,i),S}(e.Component);try{var v=l(229);m.propTypes={children:v.any,allowOuterScroll:v.bool,heightRelativeToParent:v.string,onScroll:v.func,addScrolledClass:v.bool,freezePosition:v.bool,handleClass:v.string,minScrollHandleHeight:v.number,flex:v.string,rtl:v.bool,scrollTo:v.number,keepAtBottom:v.bool,className:v.string}}catch(e){}m.defaultProps={handleClass:n.innerHandle,minScrollHandleHeight:38};const S=m})(),i})()})); \ No newline at end of file +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("react-dom"),function(){try{return require("prop-types")}catch(e){}}()):"function"==typeof define&&define.amd?define(["react","react-dom","prop-types"],t):"object"==typeof exports?exports.ReactCustomScroll=t(require("react"),require("react-dom"),function(){try{return require("prop-types")}catch(e){}}()):e.ReactCustomScroll=t(e.react,e["react-dom"],e["prop-types"])}("undefined"!=typeof self?self:this,(function(e,t,r){return function(e){var t={};function r(o){if(t[o])return t[o].exports;var n=t[o]={i:o,l:!1,exports:{}};return e[o].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,o){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(o,n,function(t){return e[t]}.bind(null,n));return o},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=2)}([function(t,r){t.exports=e},function(e,r){e.exports=t},function(e,t,r){e.exports=r(4)},function(e,t){if(void 0===r){var o=new Error("Cannot find module 'prop-types'");throw o.code="MODULE_NOT_FOUND",o}e.exports=r},function(e,t,r){"use strict";r.r(t);var o=r(0),n=r.n(o),l=r(1),i=r.n(l),c=r(5),s=r.n(c);function a(e){return(a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function u(e,t){for(var r=0;r(r=r||0===r?r:e)?(console.error("min limit is greater than max limit"),e):er?r:e};function S(e,t){return e.clientX>t.left&&e.clientXt.top&&e.clientY1;t.hasScroll!==e&&(t.hasScroll=e,t.forceUpdate())})),m(h(t),"updateScrollPosition",(function(e){var r=t.getScrolledElement(),o=v(e,0,t.contentHeight-t.visibleHeight);r.scrollTop=o,t.setState({scrollPos:o})})),m(h(t),"onClick",(function(e){if(t.hasScroll&&t.isMouseEventOnCustomScrollbar(e)&&!t.isMouseEventOnScrollHandle(e)){var r=t.calculateNewScrollHandleTop(e),o=t.getScrollValueFromHandlePosition(r);t.updateScrollPosition(o)}})),m(h(t),"isMouseEventOnCustomScrollbar",(function(e){if(!t.customScrollbarRef.current)return!1;var r=i.a.findDOMNode(h(t)).getBoundingClientRect(),o=t.customScrollbarRef.current.getBoundingClientRect(),n=t.props.rtl?{left:r.left,right:o.right}:{left:o.left,width:r.right};return S(e,Object.assign({},{left:r.left,right:r.right,top:r.top,height:r.height},n))})),m(h(t),"isMouseEventOnScrollHandle",(function(e){return!!t.scrollHandleRef.current&&function(e,t){return S(e,t.getBoundingClientRect())}(e,i.a.findDOMNode(t.scrollHandleRef.current))})),m(h(t),"calculateNewScrollHandleTop",(function(e){var r=i.a.findDOMNode(h(t)).getBoundingClientRect().top+window.pageYOffset,o=e.pageY-r,n=t.getScrollHandleStyle().top;return o>n+t.scrollHandleHeight?n+Math.min(t.scrollHandleHeight,t.visibleHeight-t.scrollHandleHeight):n-Math.max(t.scrollHandleHeight,0)})),m(h(t),"getScrollValueFromHandlePosition",(function(e){return e/t.scrollRatio})),m(h(t),"getScrollHandleStyle",(function(){var e=t.state.scrollPos*t.scrollRatio;return t.scrollHandleHeight=t.visibleHeight*t.scrollRatio,{height:t.scrollHandleHeight,top:e}})),m(h(t),"adjustCustomScrollPosToContentPos",(function(e){t.setState({scrollPos:e})})),m(h(t),"onScroll",(function(e){t.props.freezePosition||(t.hideScrollThumb(),t.adjustCustomScrollPosToContentPos(e.currentTarget.scrollTop),t.props.onScroll&&t.props.onScroll(e))})),m(h(t),"getScrolledElement",(function(){return t.innerContainerRef.current})),m(h(t),"onMouseDown",(function(e){t.hasScroll&&t.isMouseEventOnScrollHandle(e)&&(t.startDragHandlePos=t.getScrollHandleStyle().top,t.startDragMousePos=e.pageY,t.setState({onDrag:!0}),document.addEventListener("mousemove",t.onHandleDrag,{passive:!1}),document.addEventListener("mouseup",t.onHandleDragEnd,{passive:!1}))})),m(h(t),"onTouchStart",(function(){t.setState({onDrag:!0})})),m(h(t),"onHandleDrag",(function(e){e.preventDefault();var r=e.pageY-t.startDragMousePos,o=v(t.startDragHandlePos+r,0,t.visibleHeight-t.scrollHandleHeight),n=t.getScrollValueFromHandlePosition(o);t.updateScrollPosition(n)})),m(h(t),"onHandleDragEnd",(function(e){t.setState({onDrag:!1}),e.preventDefault(),document.removeEventListener("mousemove",t.onHandleDrag,{passive:!1}),document.removeEventListener("mouseup",t.onHandleDragEnd,{passive:!1})})),m(h(t),"blockOuterScroll",(function(e){if(!t.props.allowOuterScroll){var r=e.currentTarget,o=e.currentTarget.scrollHeight-e.currentTarget.offsetHeight,n=e.deltaY%3?e.deltaY:10*e.deltaY;r.scrollTop+n<=0?(r.scrollTop=0,e.preventDefault()):r.scrollTop+n>=o&&(r.scrollTop=o,e.preventDefault()),e.stopPropagation()}})),m(h(t),"getInnerContainerClasses",(function(){return t.state.scrollPos&&t.props.addScrolledClass?"".concat(s.a.innerContainer," ").concat(s.a.contentScrolled):s.a.innerContainer})),m(h(t),"getScrollStyles",(function(){var e=t.scrollbarYWidth||20,r=t.props.rtl?"marginLeft":"marginRight",o={height:t.props.heightRelativeToParent||t.props.flex?"100%":""};o[r]=-1*e;var n={height:t.props.heightRelativeToParent||t.props.flex?"100%":"",overflowY:t.props.freezePosition?"hidden":"visible"};return n[r]=t.scrollbarYWidth?0:e,{innerContainer:o,contentWrapper:n}})),m(h(t),"getOuterContainerStyle",(function(){return{height:t.props.heightRelativeToParent||t.props.flex?"100%":""}})),m(h(t),"getRootStyles",(function(){var e={};return t.props.heightRelativeToParent?e.height=t.props.heightRelativeToParent:t.props.flex&&(e.flex=t.props.flex),e})),m(h(t),"enforceMinHandleHeight",(function(e){var r=t.props.minScrollHandleHeight;if(e.height>=r)return e;var o=(r-e.height)*(t.state.scrollPos/(t.contentHeight-t.visibleHeight));return{height:r,top:e.top-o}})),t.scrollbarYWidth=0,t.state={scrollPos:0,onDrag:!1},t.hideScrollThumb=function(e,t){var r;function o(){clearTimeout(r)}function n(){o(),r=setTimeout((function(){e()}),t)}return n.cancel=o,n}((function(){t.setState({onDrag:!1})}),500),t}return t=a,(r=[{key:"componentDidMount",value:function(){void 0!==this.props.scrollTo?this.updateScrollPosition(this.props.scrollTo):this.forceUpdate(),this.innerContainerRef.current&&this.innerContainerRef.current.addEventListener("wheel",this.blockOuterScroll,{passive:!1})}},{key:"componentDidUpdate",value:function(e,t){var r=this.contentHeight,o=this.visibleHeight,n=this.getScrolledElement(),l=t.scrollPos>=r-o;this.contentHeight=n.scrollHeight,this.scrollbarYWidth=n.offsetWidth-n.clientWidth,this.visibleHeight=n.clientHeight,this.scrollRatio=this.contentHeight?this.visibleHeight/this.contentHeight:1,this.toggleScrollIfNeeded();var i=this.state===t;(this.props.freezePosition||e.freezePosition)&&this.adjustFreezePosition(e),void 0!==this.props.scrollTo&&this.props.scrollTo!==e.scrollTo?this.updateScrollPosition(this.props.scrollTo):this.props.keepAtBottom&&i&&l&&this.updateScrollPosition(this.contentHeight-this.visibleHeight)}},{key:"componentWillUnmount",value:function(){this.hideScrollThumb.cancel(),document.removeEventListener("mousemove",this.onHandleDrag,{passive:!1}),document.removeEventListener("mouseup",this.onHandleDragEnd,{passive:!1}),this.innerContainerRef.current&&this.innerContainerRef.current.removeEventListener("wheel",this.blockOuterScroll)}},{key:"render",value:function(){var e=this.getScrollStyles(),t=this.getRootStyles(),r=this.enforceMinHandleHeight(this.getScrollHandleStyle());return n.a.createElement("div",{className:"".concat(s.a.customScroll," ").concat(this.state.onDrag?s.a.scrollHandleDragged:""),style:t},n.a.createElement("div",{className:s.a.outerContainer,style:this.getOuterContainerStyle(),onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onClick:this.onClick},this.hasScroll?n.a.createElement("div",{className:s.a.positioning},n.a.createElement("div",{ref:this.customScrollbarRef,className:"".concat(s.a.customScrollbar," ").concat(this.props.rtl?s.a.customScrollbarRtl:""),key:"scrollbar"},n.a.createElement("div",{ref:this.scrollHandleRef,className:s.a.customScrollHandle,style:r},n.a.createElement("div",{className:this.props.handleClass})))):null,n.a.createElement("div",{ref:this.innerContainerRef,className:this.getInnerContainerClasses(),style:e.innerContainer,onScroll:this.onScroll},n.a.createElement("div",{className:s.a.contentWrapper,ref:this.contentWrapperRef,style:e.contentWrapper},this.props.children))))}}])&&u(t.prototype,r),l&&u(t,l),a}(o.Component);try{var y=r(3);b.propTypes={children:y.any,allowOuterScroll:y.bool,heightRelativeToParent:y.string,onScroll:y.func,addScrolledClass:y.bool,freezePosition:y.bool,handleClass:y.string,minScrollHandleHeight:y.number,flex:y.string,rtl:y.bool,scrollTo:y.number,keepAtBottom:y.bool}}catch(e){}b.defaultProps={handleClass:s.a.innerHandle,minScrollHandleHeight:38};t.default=b},function(e,t){e.exports={"custom-scroll":"rcs-custom-scroll",customScroll:"rcs-custom-scroll","outer-container":"rcs-outer-container",outerContainer:"rcs-outer-container",positioning:"rcs-positioning","custom-scrollbar":"rcs-custom-scrollbar",customScrollbar:"rcs-custom-scrollbar","inner-container":"rcs-inner-container",innerContainer:"rcs-inner-container","content-scrolled":"rcs-content-scrolled",contentScrolled:"rcs-content-scrolled","scroll-handle-dragged":"rcs-scroll-handle-dragged",scrollHandleDragged:"rcs-scroll-handle-dragged","custom-scrollbar-rtl":"rcs-custom-scrollbar-rtl",customScrollbarRtl:"rcs-custom-scrollbar-rtl","custom-scroll-handle":"rcs-custom-scroll-handle",customScrollHandle:"rcs-custom-scroll-handle","inner-handle":"rcs-inner-handle",innerHandle:"rcs-inner-handle"}}])})); \ No newline at end of file diff --git a/src/main/customScroll.js b/src/main/customScroll.js index 62c6e66..3870156 100644 --- a/src/main/customScroll.js +++ b/src/main/customScroll.js @@ -86,9 +86,10 @@ class CustomScroll extends Component { componentWillUnmount() { this.hideScrollThumb.cancel() - document.removeEventListener('mousemove', this.onHandleDrag) - document.removeEventListener('mouseup', this.onHandleDragEnd) + document.removeEventListener('mousemove', this.onHandleDrag, { passive: false }) + document.removeEventListener('mouseup', this.onHandleDragEnd, { passive: false }) + if (this.innerContainerRef.current) { this.innerContainerRef.current.removeEventListener('wheel', this.blockOuterScroll) } @@ -263,8 +264,8 @@ class CustomScroll extends Component { onDrag: false }) e.preventDefault() - document.removeEventListener('mousemove', this.onHandleDrag) - document.removeEventListener('mouseup', this.onHandleDragEnd) + document.removeEventListener('mousemove', this.onHandleDrag, { passive: false }) + document.removeEventListener('mouseup', this.onHandleDragEnd, { passive: false }) } blockOuterScroll = (e) => {