You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

43 lines
802 B

  1. import React from 'react';
  2. import PropTypes from 'prop-types';
  3. import scrollTop from '../scroll';
  4. export default class Column extends React.PureComponent {
  5. static propTypes = {
  6. children: PropTypes.node,
  7. };
  8. scrollTop () {
  9. const scrollable = this.node.querySelector('.scrollable');
  10. if (!scrollable) {
  11. return;
  12. }
  13. this._interruptScrollAnimation = scrollTop(scrollable);
  14. }
  15. handleWheel = () => {
  16. if (typeof this._interruptScrollAnimation !== 'function') {
  17. return;
  18. }
  19. this._interruptScrollAnimation();
  20. }
  21. setRef = c => {
  22. this.node = c;
  23. }
  24. render () {
  25. const { children } = this.props;
  26. return (
  27. <div role='region' className='column' ref={this.setRef} onWheel={this.handleWheel}>
  28. {children}
  29. </div>
  30. );
  31. }
  32. }