From 5e6ab9d3287f1c3196bd5131a7a3d7eab68d102a Mon Sep 17 00:00:00 2001 From: Tyson Nero Date: Fri, 11 May 2018 09:42:27 -0400 Subject: [PATCH] Allow custom scroll container This adds the ability to set scroll containers other than the wrapped component for more custom implementations --- README.md | 1 + src/index.js | 3 ++- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index d890b5a..45c481e 100644 --- a/README.md +++ b/README.md @@ -152,6 +152,7 @@ Apply the withScrolling function to any html-identifier ("div", "ul" etc) or rea * `verticalStrength` - a function that returns the strength of the vertical scroll direction * `strengthMultiplier` - strength multiplier, play around with this (default 30) * `onScrollChange` - a function that is called when `scrollLeft` or `scrollTop` of the component are changed. Called with those two arguments in that order. + * `scrollContainer` - a custom Element to attach event listeners to for scrolling. Defaults to the wrapped react component. The strength functions are both called with two arguments. An object representing the rectangle occupied by the Scrollzone, and an object representing the coordinates of mouse. diff --git a/src/index.js b/src/index.js index dcffbd3..4c5e56c 100644 --- a/src/index.js +++ b/src/index.js @@ -60,6 +60,7 @@ export default function createScrollingComponent(WrappedComponent) { verticalStrength: PropTypes.func, horizontalStrength: PropTypes.func, strengthMultiplier: PropTypes.number, + scrollContainer: PropTypes.instanceOf(typeof Element !== 'undefined' ? Element : Object), }; static defaultProps = { @@ -85,7 +86,7 @@ export default function createScrollingComponent(WrappedComponent) { } componentDidMount() { - this.container = findDOMNode(this.wrappedInstance); + this.container = this.props.scrollContainer || findDOMNode(this.wrappedInstance); this.container.addEventListener('dragover', this.handleEvent); // touchmove events don't seem to work across siblings, so we unfortunately // have to attach the listeners to the body