@skbkontur/react-ui 0.0.0-e66a3400ba → 0.0.0-ea6161656e

package/components/ScrollContainer/ScrollContainer/ScrollContainer.js

@@ -0,0 +1,406 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { globalObject } from '@skbkontur/global-object';
+import debounce from 'lodash.debounce';
+import { isInstanceOf } from "../../../lib/isInstanceOf";
+import * as LayoutEvents from "../../../lib/LayoutEvents";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { isIE11 } from "../../../lib/client";
+import { rootNode } from "../../../lib/rootNode";
+import { getDOMRect } from "../../../lib/dom/getDOMRect";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { isTestEnv } from "../../../lib/currentEnvironment";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
+import { getStyles, globalClasses } from "../ScrollContainer.styles";
+import { scrollSizeParametersNames } from "../ScrollContainer.constants";
+import { convertScrollbarXScrollState, convertScrollbarYScrollState, getScrollYOffset } from "../ScrollContainer.helpers";
+import { ScrollBar } from "../ScrollBar";
+export var ScrollContainerDataTids = {
+  root: 'ScrollContainer__root',
+  inner: 'ScrollContainer__inner'
+};
+export var ScrollContainer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(ScrollContainer, _React$Component);
+
+  function ScrollContainer() {
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(ScrollContainer.defaultProps);
+    _this.initialIsScrollBarVisible = !_this.getProps().hideScrollBar && _this.getProps().showScrollBar === 'always';
+    _this.state = {
+      isScrollBarXVisible: _this.initialIsScrollBarVisible,
+      isScrollBarYVisible: _this.initialIsScrollBarVisible,
+      isHovered: false
+    };
+
+    _this.renderMain = function () {
+      var props = _this.props;
+
+      if (_this.props.disabled) {
+        return _this.props.children;
+      }
+
+      var innerStyle = {
+        scrollBehavior: _this.getProps().scrollBehaviour,
+        maxHeight: props.maxHeight,
+        maxWidth: props.maxWidth
+      };
+
+      var scrollbarY = _this.renderScrollbar('y');
+
+      var scrollbarX = _this.renderScrollbar('x');
+
+      var styles = getStyles(_this.emotion);
+      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+        rootNodeRef: _this.setRootNode
+      }, _this.props), /*#__PURE__*/React.createElement("div", {
+        "data-tid": ScrollContainerDataTids.root,
+        className: styles.root(),
+        onMouseMove: _this.handleMouseMove,
+        onMouseLeave: _this.handleMouseLeave
+      }, scrollbarY, scrollbarX, /*#__PURE__*/React.createElement("div", {
+        style: innerStyle,
+        ref: _this.refInner,
+        className: _this.emotion.cx(styles.inner(), globalClasses.inner, isIE11 && styles.innerIE11()),
+        "data-tid": ScrollContainerDataTids.inner,
+        onScroll: _this.handleNativeScroll
+      }, props.children)));
+    };
+
+    _this.renderScrollbar = function (axis) {
+      var _this$getProps = _this.getProps(),
+          offsetY = _this$getProps.offsetY,
+          offsetX = _this$getProps.offsetX,
+          invert = _this$getProps.invert,
+          disableAnimations = _this$getProps.disableAnimations;
+
+      var isAxisX = axis === 'x';
+      var refScrollBar = isAxisX ? _this.refScrollBarX : _this.refScrollBarY;
+      var offset = isAxisX ? offsetX : offsetY;
+      var isVisible = isAxisX ? _this.state.isScrollBarXVisible : _this.state.isScrollBarYVisible;
+      return /*#__PURE__*/React.createElement(ScrollBar, {
+        axis: axis,
+        ref: refScrollBar,
+        invert: invert,
+        onScroll: _this.handleScroll,
+        offset: offset,
+        disableAnimations: disableAnimations,
+        isVisible: isVisible
+      });
+    };
+
+    _this.handleScrollStateChange = function (scrollState, axis) {
+      if (!_this.scrollY || !_this.scrollX) {
+        return;
+      }
+
+      if (axis === 'x') {
+        var scrollXState = convertScrollbarXScrollState(scrollState);
+        _this.props.onScrollStateChangeX == null ? void 0 : _this.props.onScrollStateChangeX(scrollXState);
+        return;
+      }
+
+      var scrollYState = convertScrollbarYScrollState(scrollState);
+      _this.props.onScrollStateChange == null ? void 0 : _this.props.onScrollStateChange(scrollYState);
+      _this.props.onScrollStateChangeY == null ? void 0 : _this.props.onScrollStateChangeY(scrollYState);
+    };
+
+    _this.handleScroll = function (axis, scrollState, prevScrollState) {
+      if (scrollState !== prevScrollState) {
+        _this.handleScrollStateChange(scrollState, axis);
+      }
+
+      var _this$getProps2 = _this.getProps(),
+          hideScrollBar = _this$getProps2.hideScrollBar,
+          showScrollBar = _this$getProps2.showScrollBar;
+
+      (hideScrollBar || showScrollBar === 'scroll') && _this.showScrollBarOnMouseWheel(axis);
+    };
+
+    _this.refScrollBarY = function (scrollbar) {
+      _this.scrollY = scrollbar;
+    };
+
+    _this.refScrollBarX = function (scrollbar) {
+      _this.scrollX = scrollbar;
+    };
+
+    _this.refInner = function (element) {
+      if (!_this.inner && element && _this.getProps().preventWindowScroll) {
+        element.addEventListener('wheel', _this.handleInnerScrollWheel, {
+          passive: false
+        });
+      }
+
+      if (_this.inner && !element) {
+        _this.inner.removeEventListener('wheel', _this.handleInnerScrollWheel);
+      }
+
+      _this.inner = element;
+    };
+
+    _this.handleNativeScroll = function (event) {
+      var _this$scrollY, _this$scrollX;
+
+      (_this$scrollY = _this.scrollY) == null ? void 0 : _this$scrollY.reflow();
+      (_this$scrollX = _this.scrollX) == null ? void 0 : _this$scrollX.reflow();
+      _this.props.onScroll == null ? void 0 : _this.props.onScroll(event);
+
+      if (_this.getProps().preventWindowScroll) {
+        event.preventDefault();
+        return;
+      }
+
+      LayoutEvents.emit();
+    };
+
+    _this.showScrollBarOnMouseWheel = function (axis) {
+      var isScrollBarVisible = axis === 'x' ? _this.state.isScrollBarXVisible : _this.state.isScrollBarYVisible;
+
+      if (!isScrollBarVisible) {
+        axis === 'x' ? _this.setState({
+          isScrollBarXVisible: true
+        }) : _this.setState({
+          isScrollBarYVisible: true
+        });
+      }
+
+      _this.hideScrollBar(axis);
+    };
+
+    _this.hideScrollBar = debounce(function (axis) {
+      var _this$scrollX2, _this$scrollY2;
+
+      if (_this.state.isHovered) {
+        return;
+      }
+
+      var isScrollBarXHovered = (_this$scrollX2 = _this.scrollX) == null ? void 0 : _this$scrollX2.getHover();
+      var isScrollBarYHovered = (_this$scrollY2 = _this.scrollY) == null ? void 0 : _this$scrollY2.getHover();
+
+      if (axis === 'both') {
+        !isScrollBarXHovered && !isScrollBarYHovered ? _this.setState({
+          isScrollBarXVisible: false,
+          isScrollBarYVisible: false
+        }) : _this.hideScrollBar('both');
+      } else if (axis === 'x') {
+        !isScrollBarXHovered ? _this.setState({
+          isScrollBarXVisible: false
+        }) : _this.hideScrollBar('x');
+      } else {
+        !isScrollBarYHovered ? _this.setState({
+          isScrollBarYVisible: false
+        }) : _this.hideScrollBar('y');
+      }
+    }, _this.getProps().hideScrollBarDelay);
+
+    _this.handleInnerScrollWheel = function (event) {
+      if (!_this.inner || !isInstanceOf(event, globalObject.WheelEvent)) {
+        return;
+      }
+
+      var axis = event.shiftKey ? 'x' : 'y';
+
+      if (_this.hasScrollBar(axis)) {
+        var _scrollSizeParameters = scrollSizeParametersNames[axis],
+            pos = _scrollSizeParameters.pos,
+            size = _scrollSizeParameters.size,
+            offset = _scrollSizeParameters.offset;
+
+        if (event.deltaY > 0 && _this.inner[size] <= _this.inner[pos] + _this.inner[offset]) {
+          event.preventDefault();
+          return false;
+        }
+
+        if (event.deltaY < 0 && _this.inner[pos] <= 0) {
+          event.preventDefault();
+          return false;
+        }
+      }
+    };
+
+    _this.handleMouseMove = function (event) {
+      var _this$scrollY3, _this$scrollX3;
+
+      var right = getDOMRect(event.currentTarget).right - event.pageX;
+      var bottom = getDOMRect(event.currentTarget).bottom - event.pageY;
+      (_this$scrollY3 = _this.scrollY) == null ? void 0 : _this$scrollY3.setHover(right <= 12);
+      (_this$scrollX3 = _this.scrollX) == null ? void 0 : _this$scrollX3.setHover(right >= 12 && bottom <= 12);
+      _this.getProps().showScrollBar === 'hover' && !_this.state.isHovered && _this.setState({
+        isScrollBarXVisible: true,
+        isScrollBarYVisible: true,
+        isHovered: true
+      });
+    };
+
+    _this.handleMouseLeave = function () {
+      var _this$scrollY4, _this$scrollX4;
+
+      (_this$scrollY4 = _this.scrollY) == null ? void 0 : _this$scrollY4.setHover(false);
+      (_this$scrollX4 = _this.scrollX) == null ? void 0 : _this$scrollX4.setHover(false);
+
+      if (_this.getProps().showScrollBar === 'hover') {
+        _this.setState({
+          isHovered: false
+        });
+
+        _this.hideScrollBar('both');
+      }
+    };
+
+    _this.updateInnerElement = function () {
+      var _this$scrollX5, _this$scrollY5;
+
+      (_this$scrollX5 = _this.scrollX) == null ? void 0 : _this$scrollX5.setInnerElement(_this.inner);
+      (_this$scrollY5 = _this.scrollY) == null ? void 0 : _this$scrollY5.setInnerElement(_this.inner);
+    };
+
+    return _this;
+  }
+
+  var _proto = ScrollContainer.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    this.updateInnerElement();
+  };
+
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    var preventWindowScroll = this.getProps().preventWindowScroll;
+
+    if (this.inner) {
+      if (prevProps.preventWindowScroll && !preventWindowScroll) {
+        this.inner.removeEventListener('wheel', this.handleInnerScrollWheel);
+      }
+
+      if (!prevProps.preventWindowScroll && preventWindowScroll) {
+        this.inner.addEventListener('wheel', this.handleInnerScrollWheel, {
+          passive: false
+        });
+      }
+    }
+
+    if (prevProps.disabled !== this.props.disabled && !this.props.disabled) {
+      this.updateInnerElement();
+    }
+
+    if (prevProps.showScrollBar !== this.props.showScrollBar) {
+      if (this.props.showScrollBar === 'always') {
+        this.setState({
+          isScrollBarXVisible: true,
+          isScrollBarYVisible: true
+        });
+      } else if (this.props.showScrollBar === 'never') {
+        this.setState({
+          isScrollBarXVisible: false,
+          isScrollBarYVisible: false
+        });
+      }
+    }
+  };
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement(EmotionConsumer, null, function (emotion) {
+      _this2.emotion = emotion;
+      return _this2.renderMain();
+    });
+  };
+  /**
+  * @public
+  * @param {Element} element
+  */
+
+
+  _proto.scrollTo = function scrollTo(element) {
+    if (!element || !this.inner) {
+      return;
+    }
+
+    this.inner.scrollLeft = element.offsetLeft;
+    this.inner.scrollTop = getScrollYOffset(element, this.inner);
+  }
+  /**
+  * @public
+  */
+  ;
+
+  _proto.scrollToTop = function scrollToTop() {
+    if (!this.inner) {
+      return;
+    }
+
+    this.inner.scrollTop = 0;
+  }
+  /**
+  * @public
+  */
+  ;
+
+  _proto.scrollToBottom = function scrollToBottom() {
+    if (!this.inner) {
+      return;
+    }
+
+    this.inner.scrollTop = this.inner.scrollHeight - this.inner.offsetHeight;
+  }
+  /**
+  * @public
+  */
+  ;
+
+  _proto.scrollToLeft = function scrollToLeft() {
+    if (!this.inner) {
+      return;
+    }
+
+    this.inner.scrollLeft = 0;
+  }
+  /**
+  * @public
+  */
+  ;
+
+  _proto.scrollToRight = function scrollToRight() {
+    if (!this.inner) {
+      return;
+    }
+
+    this.inner.scrollLeft = this.inner.scrollWidth - this.inner.offsetWidth;
+  };
+
+  _proto.hasScrollBar = function hasScrollBar(axis) {
+    if (!this.inner) {
+      return false;
+    }
+
+    return axis === 'x' ? this.inner.offsetWidth < this.inner.scrollWidth : this.inner.offsetHeight < this.inner.scrollHeight;
+  };
+
+  return ScrollContainer;
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'ScrollContainer', _class2.displayName = 'ScrollContainer', _class2.propTypes = {
+  invert: PropTypes.bool,
+  maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  scrollBehaviour: PropTypes.oneOf(['auto', 'smooth']),
+  preventWindowScroll: PropTypes.bool,
+  onScrollStateChange: PropTypes.func
+}, _class2.defaultProps = {
+  invert: false,
+  scrollBehaviour: 'auto',
+  preventWindowScroll: false,
+  hideScrollBar: false,
+  disableAnimations: isTestEnv,
+  hideScrollBarDelay: 500,
+  showScrollBar: 'always'
+}, _temp)) || _class;

package/components/ScrollContainer/ScrollContainer/ScrollContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ScrollContainer.tsx"],"names":["React","PropTypes","globalObject","debounce","isInstanceOf","LayoutEvents","CommonWrapper","isIE11","rootNode","getDOMRect","createPropsGetter","isTestEnv","EmotionConsumer","getStyles","globalClasses","scrollSizeParametersNames","convertScrollbarXScrollState","convertScrollbarYScrollState","getScrollYOffset","ScrollBar","ScrollContainerDataTids","root","inner","ScrollContainer","getProps","defaultProps","initialIsScrollBarVisible","hideScrollBar","showScrollBar","state","isScrollBarXVisible","isScrollBarYVisible","isHovered","renderMain","props","disabled","children","innerStyle","scrollBehavior","scrollBehaviour","maxHeight","maxWidth","scrollbarY","renderScrollbar","scrollbarX","styles","emotion","setRootNode","handleMouseMove","handleMouseLeave","refInner","cx","innerIE11","handleNativeScroll","axis","offsetY","offsetX","invert","disableAnimations","isAxisX","refScrollBar","refScrollBarX","refScrollBarY","offset","isVisible","handleScroll","handleScrollStateChange","scrollState","scrollY","scrollX","scrollXState","onScrollStateChangeX","scrollYState","onScrollStateChange","onScrollStateChangeY","prevScrollState","showScrollBarOnMouseWheel","scrollbar","element","preventWindowScroll","addEventListener","handleInnerScrollWheel","passive","removeEventListener","event","reflow","onScroll","preventDefault","emit","isScrollBarVisible","setState","isScrollBarXHovered","getHover","isScrollBarYHovered","hideScrollBarDelay","WheelEvent","shiftKey","hasScrollBar","pos","size","deltaY","right","currentTarget","pageX","bottom","pageY","setHover","updateInnerElement","setInnerElement","componentDidMount","componentDidUpdate","prevProps","render","scrollTo","scrollLeft","offsetLeft","scrollTop","scrollToTop","scrollToBottom","scrollHeight","offsetHeight","scrollToLeft","scrollToRight","scrollWidth","offsetWidth","Component","__KONTUR_REACT_UI__","displayName","propTypes","bool","oneOfType","string","number","oneOf","func"],"mappings":"2JAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,YAAT,QAA6B,0BAA7B;AACA,OAAOC,QAAP,MAAqB,iBAArB;;;AAGA,SAASC,YAAT,QAA6B,wBAA7B;AACA,OAAO,KAAKC,YAAZ,MAA8B,wBAA9B;AACA,SAAsBC,aAAtB,QAA2C,8BAA3C;;AAEA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SAASC,QAAT,QAAuC,oBAAvC;AACA,SAASC,UAAT,QAA2B,0BAA3B;AACA,SAASC,iBAAT,QAAkC,6BAAlC;AACA,SAASC,SAAT,QAA0B,8BAA1B;AACA,SAASC,eAAT,QAAgC,2BAAhC;;AAEA,SAASC,SAAT,EAAoBC,aAApB,QAAyC,0BAAzC;AACA,SAASC,yBAAT,QAA0C,6BAA1C;AACA;AACEC,4BADF;AAEEC,4BAFF;AAGEC,gBAHF;AAIO,2BAJP;AAKA,SAAqBC,SAArB,QAA4D,aAA5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8DA,OAAO,IAAMC,uBAAuB,GAAG;AACrCC,EAAAA,IAAI,EAAE,uBAD+B;AAErCC,EAAAA,KAAK,EAAE,wBAF8B,EAAhC;;;;;;;;;;;;;;;;;;;;;;;AAyBP,WAAaC,eAAb,GADCf,QACD;;;;;;;;;;;;;;;;;;;;;;;;;AAyBUgB,IAAAA,QAzBV,GAyBqBd,iBAAiB,CAACa,eAAe,CAACE,YAAjB,CAzBtC;;;;;AA8BUC,IAAAA,yBA9BV,GA8BsC,CAAC,MAAKF,QAAL,GAAgBG,aAAjB,IAAkC,MAAKH,QAAL,GAAgBI,aAAhB,KAAkC,QA9B1G;;;AAiCSC,IAAAA,KAjCT,GAiCuC;AACnCC,MAAAA,mBAAmB,EAAE,MAAKJ,yBADS;AAEnCK,MAAAA,mBAAmB,EAAE,MAAKL,yBAFS;AAGnCM,MAAAA,SAAS,EAAE,KAHwB,EAjCvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8ESC,IAAAA,UA9ET,GA8EsB,YAAM;AACxB,UAAMC,KAAK,GAAG,MAAKA,KAAnB;;AAEA,UAAI,MAAKA,KAAL,CAAWC,QAAf,EAAyB;AACvB,eAAO,MAAKD,KAAL,CAAWE,QAAlB;AACD;;AAED,UAAMC,UAA+B,GAAG;AACtCC,QAAAA,cAAc,EAAE,MAAKd,QAAL,GAAgBe,eADM;AAEtCC,QAAAA,SAAS,EAAEN,KAAK,CAACM,SAFqB;AAGtCC,QAAAA,QAAQ,EAAEP,KAAK,CAACO,QAHsB,EAAxC;;;AAMA,UAAMC,UAAU,GAAG,MAAKC,eAAL,CAAqB,GAArB,CAAnB;AACA,UAAMC,UAAU,GAAG,MAAKD,eAAL,CAAqB,GAArB,CAAnB;AACA,UAAME,MAAM,GAAGhC,SAAS,CAAC,MAAKiC,OAAN,CAAxB;AACA;AACE,4BAAC,aAAD,aAAe,WAAW,EAAE,MAAKC,WAAjC,IAAkD,MAAKb,KAAvD;AACE;AACE,sBAAUd,uBAAuB,CAACC,IADpC;AAEE,UAAA,SAAS,EAAEwB,MAAM,CAACxB,IAAP,EAFb;AAGE,UAAA,WAAW,EAAE,MAAK2B,eAHpB;AAIE,UAAA,YAAY,EAAE,MAAKC,gBAJrB;;AAMGP,QAAAA,UANH;AAOGE,QAAAA,UAPH;AAQE;AACE,UAAA,KAAK,EAAEP,UADT;AAEE,UAAA,GAAG,EAAE,MAAKa,QAFZ;AAGE,UAAA,SAAS,EAAE,MAAKJ,OAAL,CAAaK,EAAb,CAAgBN,MAAM,CAACvB,KAAP,EAAhB,EAAgCR,aAAa,CAACQ,KAA9C,EAAqDf,MAAM,IAAIsC,MAAM,CAACO,SAAP,EAA/D,CAHb;AAIE,sBAAUhC,uBAAuB,CAACE,KAJpC;AAKE,UAAA,QAAQ,EAAE,MAAK+B,kBALjB;;AAOGnB,QAAAA,KAAK,CAACE,QAPT,CARF,CADF,CADF;;;;;AAsBD,KApHH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsLUO,IAAAA,eAtLV,GAsL4B,UAACW,IAAD,EAAsB;AAC9C,2BAAwD,MAAK9B,QAAL,EAAxD,CAAQ+B,OAAR,kBAAQA,OAAR,CAAiBC,OAAjB,kBAAiBA,OAAjB,CAA0BC,MAA1B,kBAA0BA,MAA1B,CAAkCC,iBAAlC,kBAAkCA,iBAAlC;AACA,UAAMC,OAAO,GAAGL,IAAI,KAAK,GAAzB;AACA,UAAMM,YAAY,GAAGD,OAAO,GAAG,MAAKE,aAAR,GAAwB,MAAKC,aAAzD;AACA,UAAMC,MAAM,GAAGJ,OAAO,GAAGH,OAAH,GAAaD,OAAnC;AACA,UAAMS,SAAS,GAAGL,OAAO,GAAG,MAAK9B,KAAL,CAAWC,mBAAd,GAAoC,MAAKD,KAAL,CAAWE,mBAAxE;;AAEA;AACE,4BAAC,SAAD;AACE,UAAA,IAAI,EAAEuB,IADR;AAEE,UAAA,GAAG,EAAEM,YAFP;AAGE,UAAA,MAAM,EAAEH,MAHV;AAIE,UAAA,QAAQ,EAAE,MAAKQ,YAJjB;AAKE,UAAA,MAAM,EAAEF,MALV;AAME,UAAA,iBAAiB,EAAEL,iBANrB;AAOE,UAAA,SAAS,EAAEM,SAPb,GADF;;;AAWD,KAxMH;;AA0MUE,IAAAA,uBA1MV,GA0MoC,UAACC,WAAD,EAAoCb,IAApC,EAAyD;AACzF,UAAI,CAAC,MAAKc,OAAN,IAAiB,CAAC,MAAKC,OAA3B,EAAoC;AAClC;AACD;;AAED,UAAIf,IAAI,KAAK,GAAb,EAAkB;AAChB,YAAMgB,YAAY,GAAGtD,4BAA4B,CAACmD,WAAD,CAAjD;;AAEA,cAAKjC,KAAL,CAAWqC,oBAAX,0BAAKrC,KAAL,CAAWqC,oBAAX,CAAkCD,YAAlC;AACA;AACD;;AAED,UAAME,YAAY,GAAGvD,4BAA4B,CAACkD,WAAD,CAAjD;;AAEA,YAAKjC,KAAL,CAAWuC,mBAAX,0BAAKvC,KAAL,CAAWuC,mBAAX,CAAiCD,YAAjC;AACA,YAAKtC,KAAL,CAAWwC,oBAAX,0BAAKxC,KAAL,CAAWwC,oBAAX,CAAkCF,YAAlC;AACD,KA1NH;;AA4NUP,IAAAA,YA5NV,GA4NyB;AACrBX,IAAAA,IADqB;AAErBa,IAAAA,WAFqB;AAGrBQ,IAAAA,eAHqB;AAIlB;AACH,UAAIR,WAAW,KAAKQ,eAApB,EAAqC;AACnC,cAAKT,uBAAL,CAA6BC,WAA7B,EAA0Cb,IAA1C;AACD;AACD,4BAAyC,MAAK9B,QAAL,EAAzC,CAAQG,aAAR,mBAAQA,aAAR,CAAuBC,aAAvB,mBAAuBA,aAAvB;AACA,OAACD,aAAa,IAAIC,aAAa,KAAK,QAApC,KAAiD,MAAKgD,yBAAL,CAA+BtB,IAA/B,CAAjD;AACD,KAtOH;;AAwOUQ,IAAAA,aAxOV,GAwO0B,UAACe,SAAD,EAAoC;AAC1D,YAAKT,OAAL,GAAeS,SAAf;AACD,KA1OH;;AA4OUhB,IAAAA,aA5OV,GA4O0B,UAACgB,SAAD,EAAoC;AAC1D,YAAKR,OAAL,GAAeQ,SAAf;AACD,KA9OH;;AAgPU3B,IAAAA,QAhPV,GAgPqB,UAAC4B,OAAD,EAAiC;AAClD,UAAI,CAAC,MAAKxD,KAAN,IAAewD,OAAf,IAA0B,MAAKtD,QAAL,GAAgBuD,mBAA9C,EAAmE;AACjED,QAAAA,OAAO,CAACE,gBAAR,CAAyB,OAAzB,EAAkC,MAAKC,sBAAvC,EAA+D,EAAEC,OAAO,EAAE,KAAX,EAA/D;AACD;AACD,UAAI,MAAK5D,KAAL,IAAc,CAACwD,OAAnB,EAA4B;AAC1B,cAAKxD,KAAL,CAAW6D,mBAAX,CAA+B,OAA/B,EAAwC,MAAKF,sBAA7C;AACD;AACD,YAAK3D,KAAL,GAAawD,OAAb;AACD,KAxPH;;AA0PUzB,IAAAA,kBA1PV,GA0P+B,UAAC+B,KAAD,EAA0C;AACrE,6BAAKhB,OAAL,mCAAciB,MAAd;AACA,6BAAKhB,OAAL,mCAAcgB,MAAd;;AAEA,YAAKnD,KAAL,CAAWoD,QAAX,0BAAKpD,KAAL,CAAWoD,QAAX,CAAsBF,KAAtB;AACA,UAAI,MAAK5D,QAAL,GAAgBuD,mBAApB,EAAyC;AACvCK,QAAAA,KAAK,CAACG,cAAN;AACA;AACD;AACDlF,MAAAA,YAAY,CAACmF,IAAb;AACD,KApQH;;AAsQUZ,IAAAA,yBAtQV,GAsQsC,UAACtB,IAAD,EAAsB;AACxD,UAAMmC,kBAAkB,GAAGnC,IAAI,KAAK,GAAT,GAAe,MAAKzB,KAAL,CAAWC,mBAA1B,GAAgD,MAAKD,KAAL,CAAWE,mBAAtF;AACA,UAAI,CAAC0D,kBAAL,EAAyB;AACvBnC,QAAAA,IAAI,KAAK,GAAT,GAAe,MAAKoC,QAAL,CAAc,EAAE5D,mBAAmB,EAAE,IAAvB,EAAd,CAAf,GAA8D,MAAK4D,QAAL,CAAc,EAAE3D,mBAAmB,EAAE,IAAvB,EAAd,CAA9D;AACD;AACD,YAAKJ,aAAL,CAAmB2B,IAAnB;AACD,KA5QH;;AA8QmB3B,IAAAA,aA9QnB,GA8QmCxB,QAAQ,CAAC,UAACmD,IAAD,EAA+B;AACvE,UAAI,MAAKzB,KAAL,CAAWG,SAAf,EAA0B;AACxB;AACD;AACD,UAAM2D,mBAAmB,qBAAG,MAAKtB,OAAR,qBAAG,eAAcuB,QAAd,EAA5B;AACA,UAAMC,mBAAmB,qBAAG,MAAKzB,OAAR,qBAAG,eAAcwB,QAAd,EAA5B;AACA,UAAItC,IAAI,KAAK,MAAb,EAAqB;AACnB,SAACqC,mBAAD,IAAwB,CAACE,mBAAzB;AACI,cAAKH,QAAL,CAAc,EAAE5D,mBAAmB,EAAE,KAAvB,EAA8BC,mBAAmB,EAAE,KAAnD,EAAd,CADJ;AAEI,cAAKJ,aAAL,CAAmB,MAAnB,CAFJ;AAGD,OAJD,MAIO,IAAI2B,IAAI,KAAK,GAAb,EAAkB;AACvB,SAACqC,mBAAD,GAAuB,MAAKD,QAAL,CAAc,EAAE5D,mBAAmB,EAAE,KAAvB,EAAd,CAAvB,GAAuE,MAAKH,aAAL,CAAmB,GAAnB,CAAvE;AACD,OAFM,MAEA;AACL,SAACkE,mBAAD,GAAuB,MAAKH,QAAL,CAAc,EAAE3D,mBAAmB,EAAE,KAAvB,EAAd,CAAvB,GAAuE,MAAKJ,aAAL,CAAmB,GAAnB,CAAvE;AACD;AACF,KAfwC,EAetC,MAAKH,QAAL,GAAgBsE,kBAfsB,CA9Q3C;;AA+RUb,IAAAA,sBA/RV,GA+RmC,UAACG,KAAD,EAAkB;AACjD,UAAI,CAAC,MAAK9D,KAAN,IAAe,CAAClB,YAAY,CAACgF,KAAD,EAAQlF,YAAY,CAAC6F,UAArB,CAAhC,EAAkE;AAChE;AACD;;AAED,UAAMzC,IAAgB,GAAG8B,KAAK,CAACY,QAAN,GAAiB,GAAjB,GAAuB,GAAhD;;AAEA,UAAI,MAAKC,YAAL,CAAkB3C,IAAlB,CAAJ,EAA6B;AAC3B,oCAA8BvC,yBAAyB,CAACuC,IAAD,CAAvD,CAAQ4C,GAAR,yBAAQA,GAAR,CAAaC,IAAb,yBAAaA,IAAb,CAAmBpC,MAAnB,yBAAmBA,MAAnB;;AAEA,YAAIqB,KAAK,CAACgB,MAAN,GAAe,CAAf,IAAoB,MAAK9E,KAAL,CAAW6E,IAAX,KAAoB,MAAK7E,KAAL,CAAW4E,GAAX,IAAkB,MAAK5E,KAAL,CAAWyC,MAAX,CAA9D,EAAkF;AAChFqB,UAAAA,KAAK,CAACG,cAAN;AACA,iBAAO,KAAP;AACD;AACD,YAAIH,KAAK,CAACgB,MAAN,GAAe,CAAf,IAAoB,MAAK9E,KAAL,CAAW4E,GAAX,KAAmB,CAA3C,EAA8C;AAC5Cd,UAAAA,KAAK,CAACG,cAAN;AACA,iBAAO,KAAP;AACD;AACF;AACF,KAlTH;;AAoTUvC,IAAAA,eApTV,GAoT4B,UAACoC,KAAD,EAA6C;AACrE,UAAMiB,KAAK,GAAG5F,UAAU,CAAC2E,KAAK,CAACkB,aAAP,CAAV,CAAgCD,KAAhC,GAAwCjB,KAAK,CAACmB,KAA5D;AACA,UAAMC,MAAM,GAAG/F,UAAU,CAAC2E,KAAK,CAACkB,aAAP,CAAV,CAAgCE,MAAhC,GAAyCpB,KAAK,CAACqB,KAA9D;;AAEA,8BAAKrC,OAAL,oCAAcsC,QAAd,CAAuBL,KAAK,IAAI,EAAhC;AACA,8BAAKhC,OAAL,oCAAcqC,QAAd,CAAuBL,KAAK,IAAI,EAAT,IAAeG,MAAM,IAAI,EAAhD;;AAEA,YAAKhF,QAAL,GAAgBI,aAAhB,KAAkC,OAAlC;AACE,OAAC,MAAKC,KAAL,CAAWG,SADd;AAEE,YAAK0D,QAAL,CAAc,EAAE5D,mBAAmB,EAAE,IAAvB,EAA6BC,mBAAmB,EAAE,IAAlD,EAAwDC,SAAS,EAAE,IAAnE,EAAd,CAFF;AAGD,KA9TH;;AAgUUiB,IAAAA,gBAhUV,GAgU6B,YAAM;AAC/B,8BAAKmB,OAAL,oCAAcsC,QAAd,CAAuB,KAAvB;AACA,8BAAKrC,OAAL,oCAAcqC,QAAd,CAAuB,KAAvB;AACA,UAAI,MAAKlF,QAAL,GAAgBI,aAAhB,KAAkC,OAAtC,EAA+C;AAC7C,cAAK8D,QAAL,CAAc,EAAE1D,SAAS,EAAE,KAAb,EAAd;AACA,cAAKL,aAAL,CAAmB,MAAnB;AACD;AACF,KAvUH;;AAyUUgF,IAAAA,kBAzUV,GAyU+B,YAAM;AACjC,8BAAKtC,OAAL,oCAAcuC,eAAd,CAA8B,MAAKtF,KAAnC;AACA,8BAAK8C,OAAL,oCAAcwC,eAAd,CAA8B,MAAKtF,KAAnC;AACD,KA5UH,6DAuCSuF,iBAvCT,GAuCE,6BAA2B,CACzB,KAAKF,kBAAL,GACD,CAzCH,QA2CSG,kBA3CT,GA2CE,4BAA0BC,SAA1B,EAA2D,CACzD,IAAMhC,mBAAmB,GAAG,KAAKvD,QAAL,GAAgBuD,mBAA5C,CACA,IAAI,KAAKzD,KAAT,EAAgB,CACd,IAAIyF,SAAS,CAAChC,mBAAV,IAAiC,CAACA,mBAAtC,EAA2D,CACzD,KAAKzD,KAAL,CAAW6D,mBAAX,CAA+B,OAA/B,EAAwC,KAAKF,sBAA7C,EACD,CACD,IAAI,CAAC8B,SAAS,CAAChC,mBAAX,IAAkCA,mBAAtC,EAA2D,CACzD,KAAKzD,KAAL,CAAW0D,gBAAX,CAA4B,OAA5B,EAAqC,KAAKC,sBAA1C,EAAkE,EAAEC,OAAO,EAAE,KAAX,EAAlE,EACD,CACF,CAED,IAAI6B,SAAS,CAAC5E,QAAV,KAAuB,KAAKD,KAAL,CAAWC,QAAlC,IAA8C,CAAC,KAAKD,KAAL,CAAWC,QAA9D,EAAwE,CACtE,KAAKwE,kBAAL,GACD,CAED,IAAII,SAAS,CAACnF,aAAV,KAA4B,KAAKM,KAAL,CAAWN,aAA3C,EAA0D,CACxD,IAAI,KAAKM,KAAL,CAAWN,aAAX,KAA6B,QAAjC,EAA2C,CACzC,KAAK8D,QAAL,CAAc,EAAE5D,mBAAmB,EAAE,IAAvB,EAA6BC,mBAAmB,EAAE,IAAlD,EAAd,EACD,CAFD,MAEO,IAAI,KAAKG,KAAL,CAAWN,aAAX,KAA6B,OAAjC,EAA0C,CAC/C,KAAK8D,QAAL,CAAc,EAAE5D,mBAAmB,EAAE,KAAvB,EAA8BC,mBAAmB,EAAE,KAAnD,EAAd,EACD,CACF,CACF,CAjEH,QAmESiF,MAnET,GAmEE,kBAAgB,mBACd,oBACE,oBAAC,eAAD,QACG,UAAClE,OAAD,EAAa,CACZ,MAAI,CAACA,OAAL,GAAeA,OAAf,CACA,OAAO,MAAI,CAACb,UAAL,EAAP,CACD,CAJH,CADF,CAQD,CA5EH,EAsHE;AACF;AACA;AACA,KAzHA,OA0HSgF,QA1HT,GA0HE,kBAAgBnC,OAAhB,EAAgD,CAC9C,IAAI,CAACA,OAAD,IAAY,CAAC,KAAKxD,KAAtB,EAA6B,CAC3B,OACD,CAED,KAAKA,KAAL,CAAW4F,UAAX,GAAwBpC,OAAO,CAACqC,UAAhC,CACA,KAAK7F,KAAL,CAAW8F,SAAX,GAAuBlG,gBAAgB,CAAC4D,OAAD,EAAU,KAAKxD,KAAf,CAAvC,CACD,CAjIH,CAmIE;AACF;AACA,KArIA,QAsIS+F,WAtIT,GAsIE,uBAAqB,CACnB,IAAI,CAAC,KAAK/F,KAAV,EAAiB,CACf,OACD,CACD,KAAKA,KAAL,CAAW8F,SAAX,GAAuB,CAAvB,CACD,CA3IH,CA6IE;AACF;AACA,KA/IA,QAgJSE,cAhJT,GAgJE,0BAAwB,CACtB,IAAI,CAAC,KAAKhG,KAAV,EAAiB,CACf,OACD,CACD,KAAKA,KAAL,CAAW8F,SAAX,GAAuB,KAAK9F,KAAL,CAAWiG,YAAX,GAA0B,KAAKjG,KAAL,CAAWkG,YAA5D,CACD,CArJH,CAuJE;AACF;AACA,KAzJA,QA0JSC,YA1JT,GA0JE,wBAAsB,CACpB,IAAI,CAAC,KAAKnG,KAAV,EAAiB,CACf,OACD,CACD,KAAKA,KAAL,CAAW4F,UAAX,GAAwB,CAAxB,CACD,CA/JH,CAiKE;AACF;AACA,KAnKA,QAoKSQ,aApKT,GAoKE,yBAAuB,CACrB,IAAI,CAAC,KAAKpG,KAAV,EAAiB,CACf,OACD,CAED,KAAKA,KAAL,CAAW4F,UAAX,GAAwB,KAAK5F,KAAL,CAAWqG,WAAX,GAAyB,KAAKrG,KAAL,CAAWsG,WAA5D,CACD,CA1KH,QA4KS3B,YA5KT,GA4KE,sBAAoB3C,IAApB,EAAsC,CACpC,IAAI,CAAC,KAAKhC,KAAV,EAAiB,CACf,OAAO,KAAP,CACD,CAED,OAAOgC,IAAI,KAAK,GAAT,GACH,KAAKhC,KAAL,CAAWsG,WAAX,GAAyB,KAAKtG,KAAL,CAAWqG,WADjC,GAEH,KAAKrG,KAAL,CAAWkG,YAAX,GAA0B,KAAKlG,KAAL,CAAWiG,YAFzC,CAGD,CApLH,0BAAqCvH,KAAK,CAAC6H,SAA3C,WACgBC,mBADhB,GACsC,iBADtC,UAEgBC,WAFhB,GAE8B,iBAF9B,UAMgBC,SANhB,GAM4B,EACxBvE,MAAM,EAAExD,SAAS,CAACgI,IADM,EAExBxF,QAAQ,EAAExC,SAAS,CAACiI,SAAV,CAAoB,CAACjI,SAAS,CAACkI,MAAX,EAAmBlI,SAAS,CAACmI,MAA7B,CAApB,CAFc,EAGxB5F,SAAS,EAAEvC,SAAS,CAACiI,SAAV,CAAoB,CAACjI,SAAS,CAACkI,MAAX,EAAmBlI,SAAS,CAACmI,MAA7B,CAApB,CAHa,EAIxB7F,eAAe,EAAEtC,SAAS,CAACoI,KAAV,CAAgB,CAAC,MAAD,EAAS,QAAT,CAAhB,CAJO,EAKxBtD,mBAAmB,EAAE9E,SAAS,CAACgI,IALP,EAMxBxD,mBAAmB,EAAExE,SAAS,CAACqI,IANP,EAN5B,UAegB7G,YAfhB,GAe6C,EACzCgC,MAAM,EAAE,KADiC,EAEzClB,eAAe,EAAE,MAFwB,EAGzCwC,mBAAmB,EAAE,KAHoB,EAIzCpD,aAAa,EAAE,KAJ0B,EAKzC+B,iBAAiB,EAAE/C,SALsB,EAMzCmF,kBAAkB,EAAE,GANqB,EAOzClE,aAAa,EAAE,QAP0B,EAf7C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { globalObject } from '@skbkontur/global-object';\nimport debounce from 'lodash.debounce';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { isInstanceOf } from '../../lib/isInstanceOf';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { Nullable } from '../../typings/utility-types';\nimport { isIE11 } from '../../lib/client';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\n\nimport { getStyles, globalClasses } from './ScrollContainer.styles';\nimport { scrollSizeParametersNames } from './ScrollContainer.constants';\nimport {\n  convertScrollbarXScrollState,\n  convertScrollbarYScrollState,\n  getScrollYOffset,\n} from './ScrollContainer.helpers';\nimport { ScrollAxis, ScrollBar, ScrollBarScrollState } from './ScrollBar';\n\nexport type ScrollContainerScrollStateX = 'left' | 'scroll' | 'right';\nexport type ScrollContainerScrollStateY = 'top' | 'scroll' | 'bottom';\nexport type ScrollContainerScrollState = ScrollContainerScrollStateY; // deprecated\nexport type ScrollBehaviour = 'auto' | 'smooth';\n\ntype OffsetCSSPropsY = 'top' | 'right' | 'bottom';\ntype OffsetCSSPropsX = 'right' | 'bottom' | 'left';\n\nexport interface ScrollContainerProps extends CommonProps {\n  /**\n   * Инвертировать цвет скроллбара\n   * @default false\n   */\n  invert?: boolean;\n  maxHeight?: React.CSSProperties['maxHeight'];\n  maxWidth?: React.CSSProperties['maxWidth'];\n  /**\n   * @default false\n   */\n  preventWindowScroll?: boolean;\n  /**\n   * Поведение скролла (https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior)\n   * @default 'auto'\n   */\n  scrollBehaviour?: ScrollBehaviour;\n  onScrollStateChangeX?: (scrollState: ScrollContainerScrollStateX) => void;\n  onScrollStateChangeY?: (scrollState: ScrollContainerScrollStateY) => void;\n  onScrollStateChange?: (scrollYState: ScrollContainerScrollState) => void; // deprecated\n  onScroll?: (e: React.UIEvent<HTMLDivElement>) => void;\n  /**\n   * Отключение кастомного скролла\n   */\n  disabled?: boolean;\n  /**\n   * Смещение вертикального скроллбара\n   */\n  offsetY?: Partial<Record<OffsetCSSPropsY, React.CSSProperties[OffsetCSSPropsY]>>;\n  /**\n   * Смещение горизонтального скроллбара\n   */\n  offsetX?: Partial<Record<OffsetCSSPropsX, React.CSSProperties[OffsetCSSPropsX]>>;\n  /**\n   * Скрывать скроллбар при отсутствии активности пользователя\n   * @deprecated use showScrollBar\n   */\n  hideScrollBar?: boolean;\n  /**\n   * Показывать скроллбар\n   */\n  showScrollBar?: 'always' | 'scroll' | 'hover' | 'never';\n  /**\n   * Задержка перед скрытием скроллбара, ms. Работает только если `hideScrollBar = true` или `showScrollBar = 'scroll' | 'hover'`\n   */\n  hideScrollBarDelay?: number;\n  /**\n   * Отключить анимации\n   */\n  disableAnimations?: boolean;\n}\n\nexport const ScrollContainerDataTids = {\n  root: 'ScrollContainer__root',\n  inner: 'ScrollContainer__inner',\n} as const;\n\ntype DefaultProps = Required<\n  Pick<\n    ScrollContainerProps,\n    | 'invert'\n    | 'scrollBehaviour'\n    | 'preventWindowScroll'\n    | 'hideScrollBar'\n    | 'disableAnimations'\n    | 'hideScrollBarDelay'\n    | 'showScrollBar'\n  >\n>;\n\ninterface ScrollContainerState {\n  isScrollBarXVisible: boolean;\n  isScrollBarYVisible: boolean;\n  isHovered: boolean;\n}\n\n@rootNode\nexport class ScrollContainer extends React.Component<ScrollContainerProps, ScrollContainerState> {\n  public static __KONTUR_REACT_UI__ = 'ScrollContainer';\n  public static displayName = 'ScrollContainer';\n\n  public inner: Nullable<HTMLElement>;\n\n  public static propTypes = {\n    invert: PropTypes.bool,\n    maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    scrollBehaviour: PropTypes.oneOf(['auto', 'smooth']),\n    preventWindowScroll: PropTypes.bool,\n    onScrollStateChange: PropTypes.func,\n  };\n\n  public static defaultProps: DefaultProps = {\n    invert: false,\n    scrollBehaviour: 'auto',\n    preventWindowScroll: false,\n    hideScrollBar: false,\n    disableAnimations: isTestEnv,\n    hideScrollBarDelay: 500,\n    showScrollBar: 'always',\n  };\n\n  private getProps = createPropsGetter(ScrollContainer.defaultProps);\n\n  private scrollX: Nullable<ScrollBar>;\n  private scrollY: Nullable<ScrollBar>;\n  private setRootNode!: TSetRootNode;\n  private initialIsScrollBarVisible = !this.getProps().hideScrollBar && this.getProps().showScrollBar === 'always';\n  private emotion!: Emotion;\n\n  public state: ScrollContainerState = {\n    isScrollBarXVisible: this.initialIsScrollBarVisible,\n    isScrollBarYVisible: this.initialIsScrollBarVisible,\n    isHovered: false,\n  };\n\n  public componentDidMount() {\n    this.updateInnerElement();\n  }\n\n  public componentDidUpdate(prevProps: ScrollContainerProps) {\n    const preventWindowScroll = this.getProps().preventWindowScroll;\n    if (this.inner) {\n      if (prevProps.preventWindowScroll && !preventWindowScroll) {\n        this.inner.removeEventListener('wheel', this.handleInnerScrollWheel);\n      }\n      if (!prevProps.preventWindowScroll && preventWindowScroll) {\n        this.inner.addEventListener('wheel', this.handleInnerScrollWheel, { passive: false });\n      }\n    }\n\n    if (prevProps.disabled !== this.props.disabled && !this.props.disabled) {\n      this.updateInnerElement();\n    }\n\n    if (prevProps.showScrollBar !== this.props.showScrollBar) {\n      if (this.props.showScrollBar === 'always') {\n        this.setState({ isScrollBarXVisible: true, isScrollBarYVisible: true });\n      } else if (this.props.showScrollBar === 'never') {\n        this.setState({ isScrollBarXVisible: false, isScrollBarYVisible: false });\n      }\n    }\n  }\n\n  public render() {\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          return this.renderMain();\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  public renderMain = () => {\n    const props = this.props;\n\n    if (this.props.disabled) {\n      return this.props.children;\n    }\n\n    const innerStyle: React.CSSProperties = {\n      scrollBehavior: this.getProps().scrollBehaviour,\n      maxHeight: props.maxHeight,\n      maxWidth: props.maxWidth,\n    };\n\n    const scrollbarY = this.renderScrollbar('y');\n    const scrollbarX = this.renderScrollbar('x');\n    const styles = getStyles(this.emotion);\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <div\n          data-tid={ScrollContainerDataTids.root}\n          className={styles.root()}\n          onMouseMove={this.handleMouseMove}\n          onMouseLeave={this.handleMouseLeave}\n        >\n          {scrollbarY}\n          {scrollbarX}\n          <div\n            style={innerStyle}\n            ref={this.refInner}\n            className={this.emotion.cx(styles.inner(), globalClasses.inner, isIE11 && styles.innerIE11())}\n            data-tid={ScrollContainerDataTids.inner}\n            onScroll={this.handleNativeScroll}\n          >\n            {props.children}\n          </div>\n        </div>\n      </CommonWrapper>\n    );\n  };\n\n  /**\n   * @public\n   * @param {Element} element\n   */\n  public scrollTo(element: Nullable<HTMLElement>) {\n    if (!element || !this.inner) {\n      return;\n    }\n\n    this.inner.scrollLeft = element.offsetLeft;\n    this.inner.scrollTop = getScrollYOffset(element, this.inner);\n  }\n\n  /**\n   * @public\n   */\n  public scrollToTop() {\n    if (!this.inner) {\n      return;\n    }\n    this.inner.scrollTop = 0;\n  }\n\n  /**\n   * @public\n   */\n  public scrollToBottom() {\n    if (!this.inner) {\n      return;\n    }\n    this.inner.scrollTop = this.inner.scrollHeight - this.inner.offsetHeight;\n  }\n\n  /**\n   * @public\n   */\n  public scrollToLeft() {\n    if (!this.inner) {\n      return;\n    }\n    this.inner.scrollLeft = 0;\n  }\n\n  /**\n   * @public\n   */\n  public scrollToRight() {\n    if (!this.inner) {\n      return;\n    }\n\n    this.inner.scrollLeft = this.inner.scrollWidth - this.inner.offsetWidth;\n  }\n\n  public hasScrollBar(axis: ScrollAxis) {\n    if (!this.inner) {\n      return false;\n    }\n\n    return axis === 'x'\n      ? this.inner.offsetWidth < this.inner.scrollWidth\n      : this.inner.offsetHeight < this.inner.scrollHeight;\n  }\n\n  private renderScrollbar = (axis: ScrollAxis) => {\n    const { offsetY, offsetX, invert, disableAnimations } = this.getProps();\n    const isAxisX = axis === 'x';\n    const refScrollBar = isAxisX ? this.refScrollBarX : this.refScrollBarY;\n    const offset = isAxisX ? offsetX : offsetY;\n    const isVisible = isAxisX ? this.state.isScrollBarXVisible : this.state.isScrollBarYVisible;\n\n    return (\n      <ScrollBar\n        axis={axis}\n        ref={refScrollBar}\n        invert={invert}\n        onScroll={this.handleScroll}\n        offset={offset}\n        disableAnimations={disableAnimations}\n        isVisible={isVisible}\n      />\n    );\n  };\n\n  private handleScrollStateChange = (scrollState: ScrollBarScrollState, axis: ScrollAxis) => {\n    if (!this.scrollY || !this.scrollX) {\n      return;\n    }\n\n    if (axis === 'x') {\n      const scrollXState = convertScrollbarXScrollState(scrollState);\n\n      this.props.onScrollStateChangeX?.(scrollXState);\n      return;\n    }\n\n    const scrollYState = convertScrollbarYScrollState(scrollState);\n\n    this.props.onScrollStateChange?.(scrollYState);\n    this.props.onScrollStateChangeY?.(scrollYState);\n  };\n\n  private handleScroll = (\n    axis: ScrollAxis,\n    scrollState: ScrollBarScrollState,\n    prevScrollState: ScrollBarScrollState,\n  ) => {\n    if (scrollState !== prevScrollState) {\n      this.handleScrollStateChange(scrollState, axis);\n    }\n    const { hideScrollBar, showScrollBar } = this.getProps();\n    (hideScrollBar || showScrollBar === 'scroll') && this.showScrollBarOnMouseWheel(axis);\n  };\n\n  private refScrollBarY = (scrollbar: Nullable<ScrollBar>) => {\n    this.scrollY = scrollbar;\n  };\n\n  private refScrollBarX = (scrollbar: Nullable<ScrollBar>) => {\n    this.scrollX = scrollbar;\n  };\n\n  private refInner = (element: HTMLElement | null) => {\n    if (!this.inner && element && this.getProps().preventWindowScroll) {\n      element.addEventListener('wheel', this.handleInnerScrollWheel, { passive: false });\n    }\n    if (this.inner && !element) {\n      this.inner.removeEventListener('wheel', this.handleInnerScrollWheel);\n    }\n    this.inner = element;\n  };\n\n  private handleNativeScroll = (event: React.UIEvent<HTMLDivElement>) => {\n    this.scrollY?.reflow();\n    this.scrollX?.reflow();\n\n    this.props.onScroll?.(event);\n    if (this.getProps().preventWindowScroll) {\n      event.preventDefault();\n      return;\n    }\n    LayoutEvents.emit();\n  };\n\n  private showScrollBarOnMouseWheel = (axis: ScrollAxis) => {\n    const isScrollBarVisible = axis === 'x' ? this.state.isScrollBarXVisible : this.state.isScrollBarYVisible;\n    if (!isScrollBarVisible) {\n      axis === 'x' ? this.setState({ isScrollBarXVisible: true }) : this.setState({ isScrollBarYVisible: true });\n    }\n    this.hideScrollBar(axis);\n  };\n\n  private readonly hideScrollBar = debounce((axis: ScrollAxis | 'both') => {\n    if (this.state.isHovered) {\n      return;\n    }\n    const isScrollBarXHovered = this.scrollX?.getHover();\n    const isScrollBarYHovered = this.scrollY?.getHover();\n    if (axis === 'both') {\n      !isScrollBarXHovered && !isScrollBarYHovered\n        ? this.setState({ isScrollBarXVisible: false, isScrollBarYVisible: false })\n        : this.hideScrollBar('both');\n    } else if (axis === 'x') {\n      !isScrollBarXHovered ? this.setState({ isScrollBarXVisible: false }) : this.hideScrollBar('x');\n    } else {\n      !isScrollBarYHovered ? this.setState({ isScrollBarYVisible: false }) : this.hideScrollBar('y');\n    }\n  }, this.getProps().hideScrollBarDelay);\n\n  private handleInnerScrollWheel = (event: Event) => {\n    if (!this.inner || !isInstanceOf(event, globalObject.WheelEvent)) {\n      return;\n    }\n\n    const axis: ScrollAxis = event.shiftKey ? 'x' : 'y';\n\n    if (this.hasScrollBar(axis)) {\n      const { pos, size, offset } = scrollSizeParametersNames[axis];\n\n      if (event.deltaY > 0 && this.inner[size] <= this.inner[pos] + this.inner[offset]) {\n        event.preventDefault();\n        return false;\n      }\n      if (event.deltaY < 0 && this.inner[pos] <= 0) {\n        event.preventDefault();\n        return false;\n      }\n    }\n  };\n\n  private handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    const right = getDOMRect(event.currentTarget).right - event.pageX;\n    const bottom = getDOMRect(event.currentTarget).bottom - event.pageY;\n\n    this.scrollY?.setHover(right <= 12);\n    this.scrollX?.setHover(right >= 12 && bottom <= 12);\n\n    this.getProps().showScrollBar === 'hover' &&\n      !this.state.isHovered &&\n      this.setState({ isScrollBarXVisible: true, isScrollBarYVisible: true, isHovered: true });\n  };\n\n  private handleMouseLeave = () => {\n    this.scrollY?.setHover(false);\n    this.scrollX?.setHover(false);\n    if (this.getProps().showScrollBar === 'hover') {\n      this.setState({ isHovered: false });\n      this.hideScrollBar('both');\n    }\n  };\n\n  private updateInnerElement = () => {\n    this.scrollX?.setInnerElement(this.inner);\n    this.scrollY?.setInnerElement(this.inner);\n  };\n}\n"]}

package/components/ScrollContainer/ScrollContainer/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/ScrollContainer/ScrollContainer.js",
+  "module": "ScrollContainer",
+  "types": "../ScrollContainer.d.ts",
+  "sideEffects": false
+}

package/components/ScrollContainer/ScrollContainer.constants/ScrollContainer.constants.js

@@ -0,0 +1,31 @@
+export var MIN_SCROLL_SIZE = 20;
+export var defaultScrollbarState = {
+  size: 0,
+  pos: 0,
+  // Mouse is moving where big scrollbar can be located.
+  hover: false,
+  active: false,
+  // True when scroll is following mouse (mouse down on scroll).
+  scrollingByMouseDrag: false,
+  scrollState: 'begin'
+};
+export var scrollSizeParametersNames = {
+  x: {
+    offset: 'offsetWidth',
+    size: 'scrollWidth',
+    pos: 'scrollLeft',
+    coord: 'clientX',
+    clientSize: 'clientWidth',
+    customScrollPos: 'left',
+    customScrollSize: 'width'
+  },
+  y: {
+    offset: 'offsetHeight',
+    size: 'scrollHeight',
+    pos: 'scrollTop',
+    coord: 'clientY',
+    clientSize: 'clientHeight',
+    customScrollPos: 'top',
+    customScrollSize: 'height'
+  }
+};

package/components/ScrollContainer/ScrollContainer.constants/ScrollContainer.constants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ScrollContainer.constants.ts"],"names":["MIN_SCROLL_SIZE","defaultScrollbarState","size","pos","hover","active","scrollingByMouseDrag","scrollState","scrollSizeParametersNames","x","offset","coord","clientSize","customScrollPos","customScrollSize","y"],"mappings":";;AAEA,OAAO,IAAMA,eAAe,GAAG,EAAxB;;AAEP,OAAO,IAAMC,qBAAqC,GAAG;AACnDC,EAAAA,IAAI,EAAE,CAD6C;AAEnDC,EAAAA,GAAG,EAAE,CAF8C;AAGnD;AACAC,EAAAA,KAAK,EAAE,KAJ4C;AAKnDC,EAAAA,MAAM,EAAE,KAL2C;AAMnD;AACAC,EAAAA,oBAAoB,EAAE,KAP6B;AAQnDC,EAAAA,WAAW,EAAE,OARsC,EAA9C;;;AAWP,OAAO,IAAMC,yBAAyB,GAAG;AACvCC,EAAAA,CAAC,EAAE;AACDC,IAAAA,MAAM,EAAE,aADP;AAEDR,IAAAA,IAAI,EAAE,aAFL;AAGDC,IAAAA,GAAG,EAAE,YAHJ;AAIDQ,IAAAA,KAAK,EAAE,SAJN;AAKDC,IAAAA,UAAU,EAAE,aALX;AAMDC,IAAAA,eAAe,EAAE,MANhB;AAODC,IAAAA,gBAAgB,EAAE,OAPjB,EADoC;;AAUvCC,EAAAA,CAAC,EAAE;AACDL,IAAAA,MAAM,EAAE,cADP;AAEDR,IAAAA,IAAI,EAAE,cAFL;AAGDC,IAAAA,GAAG,EAAE,WAHJ;AAIDQ,IAAAA,KAAK,EAAE,SAJN;AAKDC,IAAAA,UAAU,EAAE,cALX;AAMDC,IAAAA,eAAe,EAAE,KANhB;AAODC,IAAAA,gBAAgB,EAAE,QAPjB,EAVoC,EAAlC","sourcesContent":["import { ScrollBarState } from './ScrollBar';\n\nexport const MIN_SCROLL_SIZE = 20;\n\nexport const defaultScrollbarState: ScrollBarState = {\n  size: 0,\n  pos: 0,\n  // Mouse is moving where big scrollbar can be located.\n  hover: false,\n  active: false,\n  // True when scroll is following mouse (mouse down on scroll).\n  scrollingByMouseDrag: false,\n  scrollState: 'begin',\n};\n\nexport const scrollSizeParametersNames = {\n  x: {\n    offset: 'offsetWidth',\n    size: 'scrollWidth',\n    pos: 'scrollLeft',\n    coord: 'clientX',\n    clientSize: 'clientWidth',\n    customScrollPos: 'left',\n    customScrollSize: 'width',\n  },\n  y: {\n    offset: 'offsetHeight',\n    size: 'scrollHeight',\n    pos: 'scrollTop',\n    coord: 'clientY',\n    clientSize: 'clientHeight',\n    customScrollPos: 'top',\n    customScrollSize: 'height',\n  },\n} as const;\n"]}

package/components/ScrollContainer/ScrollContainer.constants/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/ScrollContainer/ScrollContainer.constants.js",
+  "module": "ScrollContainer.constants",
+  "types": "../ScrollContainer.constants.d.ts",
+  "sideEffects": false
+}

package/components/ScrollContainer/ScrollContainer.constants.d.ts

@@ -0,0 +1,23 @@
+import { ScrollBarState } from './ScrollBar';
+export declare const MIN_SCROLL_SIZE = 20;
+export declare const defaultScrollbarState: ScrollBarState;
+export declare const scrollSizeParametersNames: {
+    readonly x: {
+        readonly offset: "offsetWidth";
+        readonly size: "scrollWidth";
+        readonly pos: "scrollLeft";
+        readonly coord: "clientX";
+        readonly clientSize: "clientWidth";
+        readonly customScrollPos: "left";
+        readonly customScrollSize: "width";
+    };
+    readonly y: {
+        readonly offset: "offsetHeight";
+        readonly size: "scrollHeight";
+        readonly pos: "scrollTop";
+        readonly coord: "clientY";
+        readonly clientSize: "clientHeight";
+        readonly customScrollPos: "top";
+        readonly customScrollSize: "height";
+    };
+};