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

package/cjs/components/ScrollContainer/ScrollBar.js

@@ -0,0 +1,286 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ScrollBar = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+var _globalObject = require("@skbkontur/global-object");
+
+
+
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _Emotion = require("../../lib/theming/Emotion");
+var _isInstanceOf = require("../../lib/isInstanceOf");
+
+var _ScrollContainer = require("./ScrollContainer.constants");
+var _ScrollContainer2 = require("./ScrollContainer.styles");
+var _ScrollContainer3 = require("./ScrollContainer.helpers");var
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ScrollBar = exports.ScrollBar = /*#__PURE__*/function (_React$Component) {function ScrollBar() {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.
+
+    containerRef = /*#__PURE__*/_react.default.createRef();_this.
+
+
+
+    state = (0, _extends2.default)({},
+    _ScrollContainer.defaultScrollbarState);_this.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    renderMain = function () {var _cx, _inlineStyles;
+      var state = _this.state;
+      var props = _this.props;
+
+      if (!state.active) {
+        return null;
+      }
+
+      var _scrollSizeParameters = _ScrollContainer.scrollSizeParametersNames[_this.props.axis],customScrollPos = _scrollSizeParameters.customScrollPos,customScrollSize = _scrollSizeParameters.customScrollSize;
+
+      var classNames = (0, _Emotion.cx)(props.className, _ScrollContainer2.styles.scrollBar(_this.theme), _this.scrollBarStyles, (_cx = {}, _cx[
+      _ScrollContainer2.styles.scrollBarInvert(_this.theme)] = props.invert, _cx[
+      _ScrollContainer2.styles.visibleScrollBar()] = props.isVisible, _cx)
+      );
+
+      var inlineStyles = (_inlineStyles = {}, _inlineStyles[
+      customScrollPos] = state.pos + "%", _inlineStyles[
+      customScrollSize] = state.size + "%", _inlineStyles);
+
+
+      return /*#__PURE__*/(
+        _react.default.createElement("div", { ref: _this.containerRef, className: _this.scrollBarContainerClassNames, style: props.offset }, /*#__PURE__*/
+        _react.default.createElement("div", {
+          ref: _this.refScroll,
+          style: inlineStyles,
+          className: classNames,
+          onMouseDown: _this.handleScrollMouseDown,
+          "data-tid": "ScrollContainer__ScrollBar-" + props.axis }
+        )
+        ));
+
+    };_this.
+
+    reflow = function () {
+      if (!_this.inner) {
+        return;
+      }
+
+      var props = _this.props;
+      var state = _this.state;
+
+      var _getScrollSizeParams = (0, _ScrollContainer3.getScrollSizeParams)(_this.inner, props.axis),scrollSize = _getScrollSizeParams.scrollSize,scrollPos = _getScrollSizeParams.scrollPos,scrollActive = _getScrollSizeParams.scrollActive;
+
+      if (!scrollActive && !state.active) {
+        return;
+      }
+
+      if (state.active !== scrollActive || state.size !== scrollSize || state.pos !== scrollPos) {
+        var scrollState = _this.getImmediateScrollState();
+
+        if (state.pos !== scrollPos) {
+          _this.props.onScroll == null || _this.props.onScroll(props.axis, scrollState, state.scrollState);
+        }
+
+        _this.setState((0, _extends2.default)({},
+        _this.state, {
+          active: scrollActive,
+          size: scrollSize,
+          pos: scrollPos,
+          scrollState: scrollState })
+        );
+      }
+    };_this.
+
+    setInnerElement = function (inner) {
+      _this.inner = inner;
+      _this.reflow();
+    };_this.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    refScroll = function (element) {
+      var handleScrollWheel = function handleScrollWheel(event) {return _this.handleScrollWheel(event, _this.props.axis);};
+
+      if (!_this.node && element) {
+        element.addEventListener('wheel', handleScrollWheel, { passive: false });
+      }
+      if (_this.node && !element) {
+        _this.node.removeEventListener('wheel', handleScrollWheel);
+      }
+      _this.node = element;
+    };_this.
+
+    handleScrollMouseDown = function (event) {
+      if (!_this.inner) {
+        return;
+      }
+
+      var _scrollSizeParameters2 = _ScrollContainer.scrollSizeParametersNames[_this.props.axis],offset = _scrollSizeParameters2.offset,size = _scrollSizeParameters2.size,pos = _scrollSizeParameters2.pos,coord = _scrollSizeParameters2.coord;
+
+      var initialCoord = event[coord];
+      var target = _globalObject.globalObject.document;
+      var initialScrollPos = _this.inner[pos];
+      var state = _this.state;
+
+      var mouseMove = function mouseMove(mouseMoveEvent) {
+        if (!_this.inner || !_this.containerRef.current) {
+          return;
+        }
+
+        var remainingScrollingContent = _this.inner[size] - _this.inner[offset];
+        var remainingScrollingSpace = _this.containerRef.current[offset] / 100 * (100 - state.size);
+
+        var ratio = remainingScrollingContent / remainingScrollingSpace;
+        var delta = (mouseMoveEvent[coord] - initialCoord) * ratio;
+
+        _this.inner[pos] = initialScrollPos + delta;
+
+        if (mouseMoveEvent.preventDefault) {
+          mouseMoveEvent.preventDefault();
+        }
+
+        if (Object.prototype.hasOwnProperty.call(mouseMoveEvent, 'returnValue')) {
+
+          mouseMoveEvent.
+
+
+          returnValue = false;
+        }
+      };
+
+      var mouseUp = function mouseUp() {
+        target == null || target.removeEventListener('mousemove', mouseMove);
+        target == null || target.removeEventListener('mouseup', mouseUp);
+        _this.setState((0, _extends2.default)({}, _this.state, { scrollingByMouseDrag: false }));
+      };
+
+      target == null || target.addEventListener('mousemove', mouseMove);
+      target == null || target.addEventListener('mouseup', mouseUp);
+      _this.setState((0, _extends2.default)({}, _this.state, { scrollingByMouseDrag: true }));
+
+      event.preventDefault();
+    };_this.
+
+    handleScrollWheel = function (event, axis) {
+      if (!_this.inner || !(0, _isInstanceOf.isInstanceOf)(event, _globalObject.globalObject.WheelEvent) || axis === 'x' && !event.shiftKey) {
+        return;
+      }
+
+      var _scrollSizeParameters3 = _ScrollContainer.scrollSizeParametersNames[axis],offset = _scrollSizeParameters3.offset,size = _scrollSizeParameters3.size,pos = _scrollSizeParameters3.pos;
+
+      var scrollSize = _this.inner[size];
+      var scrollPos = _this.inner[pos];
+      var offsetHeight = _this.inner[offset];
+
+      if (event.deltaY > 0 && scrollSize <= scrollPos + offsetHeight) {
+        return;
+      }
+      if (event.deltaY < 0 && scrollPos <= 0) {
+        return;
+      }
+
+      _this.inner[pos] += event.deltaY;
+
+      event.preventDefault();
+    };_this.
+
+    getImmediateScrollState = function () {
+      var _scrollSizeParameters4 = _ScrollContainer.scrollSizeParametersNames[_this.props.axis],pos = _scrollSizeParameters4.pos,size = _scrollSizeParameters4.size,clientSize = _scrollSizeParameters4.clientSize;
+
+      if (!_this.inner || _this.inner[pos] === 0) {
+        return 'begin';
+      }
+      // Zoom in Chrome causes problems
+      // https://github.com/skbkontur/retail-ui/pull/2705#issue-806286945
+      var maxScrollPos = _this.inner[size] - _this.inner[clientSize];
+      if (Math.abs(maxScrollPos - _this.inner[pos]) <= 1) {
+        return 'end';
+      }
+
+      return 'middle';
+    };return _this;}(0, _inheritsLoose2.default)(ScrollBar, _React$Component);var _proto = ScrollBar.prototype;_proto.componentDidMount = function componentDidMount() {this.reflow();};_proto.componentDidUpdate = function componentDidUpdate() {this.reflow();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.setHover = function setHover(hover) {if (this.state.active && this.state.hover !== hover) {this.setState((0, _extends2.default)({}, this.state, { hover: hover }));}};_proto.getHover = function getHover() {return this.state.hover;};return (0, _createClass2.default)(ScrollBar, [{ key: "scrollBarState", get: function get() {return this.state.scrollState;} }, { key: "scrollBarStyles", get: function get() {var _cx3;var state = this.state;if (this.props.axis === 'x') {var _cx2;return (0, _Emotion.cx)(_ScrollContainer2.styles.scrollBarX(this.theme), _ScrollContainer2.globalClasses.scrollbarX, (_cx2 = {}, _cx2[_ScrollContainer2.styles.scrollBarXHover(this.theme)] = state.hover || state.scrollingByMouseDrag, _cx2));}return (0, _Emotion.cx)(_ScrollContainer2.styles.scrollBarY(this.theme), _ScrollContainer2.globalClasses.scrollbarY, (_cx3 = {}, _cx3[_ScrollContainer2.styles.scrollBarYHover(this.theme)] = state.hover || state.scrollingByMouseDrag, _cx3));} }, { key: "scrollBarContainerClassNames", get: function get() {var axis = this.props.axis;if (axis === 'x') {return (0, _Emotion.cx)(_ScrollContainer2.globalClasses.scrollbarContainerX, _ScrollContainer2.styles.scrollBarContainerX(this.theme));}return (0, _Emotion.cx)(_ScrollContainer2.globalClasses.scrollbarContainerY, _ScrollContainer2.styles.scrollBarContainerY());} }]);}(_react.default.Component);

package/cjs/components/ScrollContainer/ScrollBar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_globalObject","_ThemeContext","_Emotion","_isInstanceOf","_ScrollContainer","_ScrollContainer2","_ScrollContainer3","ScrollBar","exports","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","containerRef","React","createRef","state","_extends2","default","defaultScrollbarState","renderMain","_cx","_inlineStyles","props","active","_scrollSizeParameters","scrollSizeParametersNames","axis","customScrollPos","customScrollSize","classNames","cx","className","styles","scrollBar","theme","scrollBarStyles","scrollBarInvert","invert","visibleScrollBar","isVisible","inlineStyles","pos","size","createElement","ref","scrollBarContainerClassNames","style","offset","refScroll","onMouseDown","handleScrollMouseDown","reflow","inner","_getScrollSizeParams","getScrollSizeParams","scrollSize","scrollPos","scrollActive","scrollState","getImmediateScrollState","onScroll","setState","setInnerElement","element","handleScrollWheel","event","node","addEventListener","passive","removeEventListener","_scrollSizeParameters2","coord","initialCoord","target","globalObject","document","initialScrollPos","mouseMove","mouseMoveEvent","current","remainingScrollingContent","remainingScrollingSpace","ratio","delta","preventDefault","Object","prototype","hasOwnProperty","returnValue","mouseUp","scrollingByMouseDrag","isInstanceOf","WheelEvent","shiftKey","_scrollSizeParameters3","offsetHeight","deltaY","_scrollSizeParameters4","clientSize","maxScrollPos","Math","abs","_inheritsLoose2","_proto","componentDidMount","componentDidUpdate","render","_this2","ThemeContext","Consumer","setHover","hover","getHover","_createClass2","key","get","_cx3","_cx2","scrollBarX","globalClasses","scrollbarX","scrollBarXHover","scrollBarY","scrollbarY","scrollBarYHover","scrollbarContainerX","scrollBarContainerX","scrollbarContainerY","scrollBarContainerY","Component"],"sources":["ScrollBar.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport type { Nullable } from '../../typings/utility-types';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\n\nimport { defaultScrollbarState, scrollSizeParametersNames } from './ScrollContainer.constants';\nimport { styles, globalClasses } from './ScrollContainer.styles';\nimport { getScrollSizeParams } from './ScrollContainer.helpers';\nimport type { ScrollContainerProps } from './ScrollContainer';\n\nexport type ScrollAxis = 'x' | 'y';\nexport type ScrollBarScrollState = 'begin' | 'middle' | 'end';\n\nexport interface ScrollBarState {\n  active: boolean;\n  hover: boolean;\n  scrollingByMouseDrag: boolean;\n  size: number; // in percentages\n  pos: number; // in percentages\n  scrollState: ScrollBarScrollState;\n}\n\nexport interface ScrollBarProps {\n  /** Инвертирует цвет скроллбара. */\n  invert: boolean;\n\n  /** Задает ось скроллбара. */\n  axis: ScrollAxis;\n\n  /** Задает HTML-атрибут class. */\n  className?: string;\n\n  /** Задает функцию, которая вызывается при скролле. */\n  onScroll?: (axis: ScrollAxis, state: ScrollBarScrollState, prevState: ScrollBarScrollState) => void;\n\n  /** Задает отступ от края экрана. */\n  offset: ScrollContainerProps['offsetY'] | ScrollContainerProps['offsetX'];\n\n  /** Отключает анимацию. */\n  disableAnimations?: boolean;\n\n  /** Определяет, виден ли скроллбар. */\n  isVisible: boolean;\n}\n\nexport class ScrollBar extends React.Component<ScrollBarProps, ScrollBarState> {\n  private inner: Nullable<HTMLElement>;\n  private containerRef = React.createRef<HTMLDivElement>();\n  private theme!: Theme;\n\n  public node: Nullable<HTMLElement>;\n  public state: ScrollBarState = {\n    ...defaultScrollbarState,\n  };\n\n  public componentDidMount() {\n    this.reflow();\n  }\n\n  public componentDidUpdate() {\n    this.reflow();\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain = () => {\n    const state = this.state;\n    const props = this.props;\n\n    if (!state.active) {\n      return null;\n    }\n\n    const { customScrollPos, customScrollSize } = scrollSizeParametersNames[this.props.axis];\n\n    const classNames = cx(props.className, styles.scrollBar(this.theme), this.scrollBarStyles, {\n      [styles.scrollBarInvert(this.theme)]: props.invert,\n      [styles.visibleScrollBar()]: props.isVisible,\n    });\n\n    const inlineStyles: React.CSSProperties = {\n      [customScrollPos]: `${state.pos}%`,\n      [customScrollSize]: `${state.size}%`,\n    };\n\n    return (\n      <div ref={this.containerRef} className={this.scrollBarContainerClassNames} style={props.offset}>\n        <div\n          ref={this.refScroll}\n          style={inlineStyles}\n          className={classNames}\n          onMouseDown={this.handleScrollMouseDown}\n          data-tid={`ScrollContainer__ScrollBar-${props.axis}`}\n        />\n      </div>\n    );\n  };\n\n  public reflow = () => {\n    if (!this.inner) {\n      return;\n    }\n\n    const props = this.props;\n    const state = this.state;\n\n    const { scrollSize, scrollPos, scrollActive } = getScrollSizeParams(this.inner, props.axis);\n\n    if (!scrollActive && !state.active) {\n      return;\n    }\n\n    if (state.active !== scrollActive || state.size !== scrollSize || state.pos !== scrollPos) {\n      const scrollState = this.getImmediateScrollState();\n\n      if (state.pos !== scrollPos) {\n        this.props.onScroll?.(props.axis, scrollState, state.scrollState);\n      }\n\n      this.setState({\n        ...this.state,\n        active: scrollActive,\n        size: scrollSize,\n        pos: scrollPos,\n        scrollState,\n      });\n    }\n  };\n\n  public setInnerElement = (inner: Nullable<HTMLElement>) => {\n    this.inner = inner;\n    this.reflow();\n  };\n\n  public setHover(hover: boolean) {\n    if (this.state.active && this.state.hover !== hover) {\n      this.setState({ ...this.state, hover });\n    }\n  }\n\n  public getHover() {\n    return this.state.hover;\n  }\n\n  public get scrollBarState() {\n    return this.state.scrollState;\n  }\n\n  private get scrollBarStyles() {\n    const state = this.state;\n\n    if (this.props.axis === 'x') {\n      return cx(styles.scrollBarX(this.theme), globalClasses.scrollbarX, {\n        [styles.scrollBarXHover(this.theme)]: state.hover || state.scrollingByMouseDrag,\n      });\n    }\n\n    return cx(styles.scrollBarY(this.theme), globalClasses.scrollbarY, {\n      [styles.scrollBarYHover(this.theme)]: state.hover || state.scrollingByMouseDrag,\n    });\n  }\n\n  private get scrollBarContainerClassNames() {\n    const { axis } = this.props;\n\n    if (axis === 'x') {\n      return cx(globalClasses.scrollbarContainerX, styles.scrollBarContainerX(this.theme));\n    }\n\n    return cx(globalClasses.scrollbarContainerY, styles.scrollBarContainerY());\n  }\n\n  private refScroll = (element: HTMLElement | null) => {\n    const handleScrollWheel = (event: Event) => this.handleScrollWheel(event, this.props.axis);\n\n    if (!this.node && element) {\n      element.addEventListener('wheel', handleScrollWheel, { passive: false });\n    }\n    if (this.node && !element) {\n      this.node.removeEventListener('wheel', handleScrollWheel);\n    }\n    this.node = element;\n  };\n\n  private handleScrollMouseDown = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!this.inner) {\n      return;\n    }\n\n    const { offset, size, pos, coord } = scrollSizeParametersNames[this.props.axis];\n\n    const initialCoord = event[coord];\n    const target = globalObject.document;\n    const initialScrollPos = this.inner[pos];\n    const state = this.state;\n\n    const mouseMove = (mouseMoveEvent: MouseEvent) => {\n      if (!this.inner || !this.containerRef.current) {\n        return;\n      }\n\n      const remainingScrollingContent = this.inner[size] - this.inner[offset];\n      const remainingScrollingSpace = (this.containerRef.current[offset] / 100) * (100 - state.size);\n\n      const ratio = remainingScrollingContent / remainingScrollingSpace;\n      const delta = (mouseMoveEvent[coord] - initialCoord) * ratio;\n\n      this.inner[pos] = initialScrollPos + delta;\n\n      if (mouseMoveEvent.preventDefault) {\n        mouseMoveEvent.preventDefault();\n      }\n\n      if (Object.prototype.hasOwnProperty.call(mouseMoveEvent, 'returnValue')) {\n        (\n          mouseMoveEvent as MouseEvent & {\n            returnValue: boolean;\n          }\n        ).returnValue = false;\n      }\n    };\n\n    const mouseUp = () => {\n      target?.removeEventListener('mousemove', mouseMove);\n      target?.removeEventListener('mouseup', mouseUp);\n      this.setState({ ...this.state, scrollingByMouseDrag: false });\n    };\n\n    target?.addEventListener('mousemove', mouseMove);\n    target?.addEventListener('mouseup', mouseUp);\n    this.setState({ ...this.state, scrollingByMouseDrag: true });\n\n    event.preventDefault();\n  };\n\n  private handleScrollWheel = (event: Event, axis: ScrollAxis) => {\n    if (!this.inner || !isInstanceOf(event, globalObject.WheelEvent) || (axis === 'x' && !event.shiftKey)) {\n      return;\n    }\n\n    const { offset, size, pos } = scrollSizeParametersNames[axis];\n\n    const scrollSize = this.inner[size];\n    const scrollPos = this.inner[pos];\n    const offsetHeight = this.inner[offset];\n\n    if (event.deltaY > 0 && scrollSize <= scrollPos + offsetHeight) {\n      return;\n    }\n    if (event.deltaY < 0 && scrollPos <= 0) {\n      return;\n    }\n\n    this.inner[pos] += event.deltaY;\n\n    event.preventDefault();\n  };\n\n  private getImmediateScrollState = (): ScrollBarScrollState => {\n    const { pos, size, clientSize } = scrollSizeParametersNames[this.props.axis];\n\n    if (!this.inner || this.inner[pos] === 0) {\n      return 'begin';\n    }\n    // Zoom in Chrome causes problems\n    // https://github.com/skbkontur/retail-ui/pull/2705#issue-806286945\n    const maxScrollPos = this.inner[size] - this.inner[clientSize];\n    if (Math.abs(maxScrollPos - this.inner[pos]) <= 1) {\n      return 'end';\n    }\n\n    return 'middle';\n  };\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,23 @@
+import type { 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";
+    };
+};

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

@@ -0,0 +1,35 @@
+"use strict";exports.__esModule = true;exports.scrollSizeParametersNames = exports.defaultScrollbarState = exports.MIN_SCROLL_SIZE = void 0;
+
+var MIN_SCROLL_SIZE = exports.MIN_SCROLL_SIZE = 20;
+
+var defaultScrollbarState = exports.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'
+};
+
+var scrollSizeParametersNames = exports.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/cjs/components/ScrollContainer/ScrollContainer.constants.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MIN_SCROLL_SIZE","exports","defaultScrollbarState","size","pos","hover","active","scrollingByMouseDrag","scrollState","scrollSizeParametersNames","x","offset","coord","clientSize","customScrollPos","customScrollSize","y"],"sources":["ScrollContainer.constants.ts"],"sourcesContent":["import type { 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"],"mappings":";;AAEO,IAAMA,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG,EAAE;;AAE1B,IAAME,qBAAqC,GAAAD,OAAA,CAAAC,qBAAA,GAAG;EACnDC,IAAI,EAAE,CAAC;EACPC,GAAG,EAAE,CAAC;EACN;EACAC,KAAK,EAAE,KAAK;EACZC,MAAM,EAAE,KAAK;EACb;EACAC,oBAAoB,EAAE,KAAK;EAC3BC,WAAW,EAAE;AACf,CAAC;;AAEM,IAAMC,yBAAyB,GAAAR,OAAA,CAAAQ,yBAAA,GAAG;EACvCC,CAAC,EAAE;IACDC,MAAM,EAAE,aAAa;IACrBR,IAAI,EAAE,aAAa;IACnBC,GAAG,EAAE,YAAY;IACjBQ,KAAK,EAAE,SAAS;IAChBC,UAAU,EAAE,aAAa;IACzBC,eAAe,EAAE,MAAM;IACvBC,gBAAgB,EAAE;EACpB,CAAC;EACDC,CAAC,EAAE;IACDL,MAAM,EAAE,cAAc;IACtBR,IAAI,EAAE,cAAc;IACpBC,GAAG,EAAE,WAAW;IAChBQ,KAAK,EAAE,SAAS;IAChBC,UAAU,EAAE,cAAc;IAC1BC,eAAe,EAAE,KAAK;IACtBC,gBAAgB,EAAE;EACpB;AACF,CAAU","ignoreList":[]}

package/cjs/components/ScrollContainer/ScrollContainer.d.ts

@@ -0,0 +1,121 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import type { CommonProps } from '../../internal/CommonWrapper';
+import type { Nullable } from '../../typings/utility-types';
+import type { ScrollAxis } from './ScrollBar';
+export type ScrollContainerScrollStateX = 'left' | 'scroll' | 'right';
+export type ScrollContainerScrollStateY = 'top' | 'scroll' | 'bottom';
+export type ScrollContainerScrollState = ScrollContainerScrollStateY;
+export type ScrollBehaviour = 'auto' | 'smooth';
+type OffsetCSSPropsY = 'top' | 'right' | 'bottom';
+type OffsetCSSPropsX = 'right' | 'bottom' | 'left';
+export interface ScrollContainerProps extends CommonProps {
+    /** Инвертирует цвет скроллбара.
+     * @default false */
+    invert?: boolean;
+    /** Задает максимальную высоту. */
+    maxHeight?: React.CSSProperties['maxHeight'];
+    /** Задает максимальную ширину. */
+    maxWidth?: React.CSSProperties['maxWidth'];
+    /** Отключает скролл окна, когда меню открыто.
+     * @default false */
+    preventWindowScroll?: boolean;
+    /** Задает поведение скролла. (https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior)
+     * @default 'auto' */
+    scrollBehaviour?: ScrollBehaviour;
+    /** Задает функцию, которая вызывается при скроле по горизонтали. */
+    onScrollStateChangeX?: (scrollState: ScrollContainerScrollStateX) => void;
+    /** Задает функцию, которая вызывается при скроле по вертикали. */
+    onScrollStateChangeY?: (scrollState: ScrollContainerScrollStateY) => void;
+    /** Задает функцию, которая вызывается при скроле.
+     * @deprecated use onScroll */
+    onScrollStateChange?: (scrollYState: ScrollContainerScrollState) => void;
+    /** Задает функцию, которая вызывается при скроле. */
+    onScroll?: (e: React.UIEvent<HTMLDivElement>) => void;
+    /** Отключает кастомный скролл. */
+    disabled?: boolean;
+    /** Задает смещение вертикального скроллбара. */
+    offsetY?: Partial<Record<OffsetCSSPropsY, React.CSSProperties[OffsetCSSPropsY]>>;
+    /** Задает смещение горизонтального скроллбара. */
+    offsetX?: Partial<Record<OffsetCSSPropsX, React.CSSProperties[OffsetCSSPropsX]>>;
+    /** Определяет, нужно ли показывать скроллбар. */
+    showScrollBar?: 'always' | 'scroll' | 'hover' | 'never';
+    /** Устанавливает задержку в миллисекундах перед скрытием скроллбара.
+     * Работает только при hideScrollBar = true или showScrollBar = 'scroll' | 'hover'. */
+    hideScrollBarDelay?: number;
+    /** Отключает анимацию. */
+    disableAnimations?: boolean;
+    scrollRef?: React.Ref<HTMLDivElement | null>;
+}
+export declare const ScrollContainerDataTids: {
+    readonly root: "ScrollContainer__root";
+    readonly inner: "ScrollContainer__inner";
+};
+type DefaultProps = Required<Pick<ScrollContainerProps, 'invert' | 'scrollBehaviour' | 'preventWindowScroll' | 'disableAnimations' | 'hideScrollBarDelay' | 'showScrollBar'>>;
+interface ScrollContainerState {
+    isScrollBarXVisible: boolean;
+    isScrollBarYVisible: boolean;
+    isHovered: boolean;
+}
+/**
+ * `ScrollContainer` используется для создания контейнера с кастомными полосами прокрутки, который обеспечивает прокрутку содержимого по горизонтали или вертикали.
+ */
+export declare class ScrollContainer extends React.Component<ScrollContainerProps, ScrollContainerState> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    inner: Nullable<HTMLElement>;
+    static propTypes: {
+        invert: PropTypes.Requireable<boolean>;
+        maxWidth: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+        maxHeight: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+        scrollBehaviour: PropTypes.Requireable<string>;
+        preventWindowScroll: PropTypes.Requireable<boolean>;
+        onScrollStateChange: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    static defaultProps: DefaultProps;
+    private getProps;
+    private scrollX;
+    private scrollY;
+    private setRootNode;
+    private initialIsScrollBarVisible;
+    state: ScrollContainerState;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: ScrollContainerProps): void;
+    render: () => string | number | boolean | React.JSX.Element | Iterable<React.ReactNode> | null | undefined;
+    /**
+     * @public
+     * @param {Element} element
+     */
+    scrollTo(element: Nullable<HTMLElement>): void;
+    /**
+     * @public
+     */
+    scrollToTop(): void;
+    /**
+     * @public
+     */
+    scrollToBottom(): void;
+    /**
+     * @public
+     */
+    scrollToLeft(): void;
+    /**
+     * @public
+     */
+    scrollToRight(): void;
+    hasScrollBar(axis: ScrollAxis): boolean;
+    private renderScrollbar;
+    private handleScrollStateChange;
+    private handleScroll;
+    private refScrollBarY;
+    private refScrollBarX;
+    private refInner;
+    private handleNativeScroll;
+    private showScrollBarOnMouseWheel;
+    private readonly hideScrollBar;
+    private handleInnerScrollWheel;
+    private handleMouseMove;
+    private handleMouseLeave;
+    private updateInnerElement;
+}
+export {};

package/cjs/components/ScrollContainer/ScrollContainer.helpers.d.ts

@@ -0,0 +1,10 @@
+import type { ScrollBarScrollState } from './ScrollBar';
+import type { ScrollContainerScrollStateX, ScrollContainerScrollStateY } from './ScrollContainer';
+export declare const getScrollSizeParams: (inner: HTMLElement, axis: 'x' | 'y') => {
+    scrollActive: boolean;
+    scrollSize: number;
+    scrollPos: number;
+};
+export declare const getScrollYOffset: (element: HTMLElement, container: HTMLElement) => number;
+export declare const convertScrollbarXScrollState: (state: ScrollBarScrollState) => ScrollContainerScrollStateX;
+export declare const convertScrollbarYScrollState: (state: ScrollBarScrollState) => ScrollContainerScrollStateY;

package/cjs/components/ScrollContainer/ScrollContainer.helpers.js

@@ -0,0 +1,66 @@
+"use strict";exports.__esModule = true;exports.getScrollYOffset = exports.getScrollSizeParams = exports.convertScrollbarYScrollState = exports.convertScrollbarXScrollState = void 0;var _ScrollContainer = require("./ScrollContainer.constants");
+
+
+
+var getScrollSizeParams = exports.getScrollSizeParams = function getScrollSizeParams(inner, axis) {
+  var _scrollSizeParameters = _ScrollContainer.scrollSizeParametersNames[axis],offset = _scrollSizeParameters.offset,size = _scrollSizeParameters.size,pos = _scrollSizeParameters.pos;
+
+  var contentSize = inner[size];
+  var scrollOffset = inner[pos];
+  var containerSize = inner[offset];
+
+  var scrollActive = containerSize < contentSize;
+
+  var scrollSize = 0;
+  var scrollPos = 0;
+
+  if (scrollActive) {
+    scrollSize = Math.max(containerSize / contentSize * containerSize, _ScrollContainer.MIN_SCROLL_SIZE);
+    scrollPos = scrollOffset / (contentSize - containerSize) * (containerSize - scrollSize);
+
+    // Convert pixels to percentages
+    scrollSize = containerSize && 100 / containerSize * scrollSize;
+    scrollPos = containerSize && 100 / containerSize * scrollPos;
+  }
+
+  return {
+    scrollActive: scrollActive,
+    scrollSize: scrollSize,
+    scrollPos: scrollPos
+  };
+};
+
+var getScrollYOffset = exports.getScrollYOffset = function getScrollYOffset(element, container) {
+  var elementTopOffset = element.offsetTop;
+
+  if (container.scrollTop > elementTopOffset) {
+    return elementTopOffset;
+  }
+
+  var offset = elementTopOffset + element.scrollHeight - container.offsetHeight;
+  if (container.scrollTop < offset) {
+    return offset;
+  }
+
+  return container.scrollTop;
+};
+
+var convertScrollbarXScrollState = exports.convertScrollbarXScrollState = function convertScrollbarXScrollState(state) {
+  var scrollBarState = {
+    begin: 'left',
+    end: 'right',
+    middle: 'scroll'
+  };
+
+  return scrollBarState[state];
+};
+
+var convertScrollbarYScrollState = exports.convertScrollbarYScrollState = function convertScrollbarYScrollState(state) {
+  var scrollBarState = {
+    begin: 'top',
+    end: 'bottom',
+    middle: 'scroll'
+  };
+
+  return scrollBarState[state];
+};

package/cjs/components/ScrollContainer/ScrollContainer.helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_ScrollContainer","require","getScrollSizeParams","exports","inner","axis","_scrollSizeParameters","scrollSizeParametersNames","offset","size","pos","contentSize","scrollOffset","containerSize","scrollActive","scrollSize","scrollPos","Math","max","MIN_SCROLL_SIZE","getScrollYOffset","element","container","elementTopOffset","offsetTop","scrollTop","scrollHeight","offsetHeight","convertScrollbarXScrollState","state","scrollBarState","begin","end","middle","convertScrollbarYScrollState"],"sources":["ScrollContainer.helpers.ts"],"sourcesContent":["import { MIN_SCROLL_SIZE, scrollSizeParametersNames } from './ScrollContainer.constants';\nimport type { ScrollBarScrollState } from './ScrollBar';\nimport type { ScrollContainerScrollStateX, ScrollContainerScrollStateY } from './ScrollContainer';\n\nexport const getScrollSizeParams = (inner: HTMLElement, axis: 'x' | 'y') => {\n  const { offset, size, pos } = scrollSizeParametersNames[axis];\n\n  const contentSize = inner[size];\n  const scrollOffset = inner[pos];\n  const containerSize = inner[offset];\n\n  const scrollActive = containerSize < contentSize;\n\n  let scrollSize = 0;\n  let scrollPos = 0;\n\n  if (scrollActive) {\n    scrollSize = Math.max((containerSize / contentSize) * containerSize, MIN_SCROLL_SIZE);\n    scrollPos = (scrollOffset / (contentSize - containerSize)) * (containerSize - scrollSize);\n\n    // Convert pixels to percentages\n    scrollSize = containerSize && (100 / containerSize) * scrollSize;\n    scrollPos = containerSize && (100 / containerSize) * scrollPos;\n  }\n\n  return {\n    scrollActive,\n    scrollSize,\n    scrollPos,\n  };\n};\n\nexport const getScrollYOffset = (element: HTMLElement, container: HTMLElement) => {\n  const elementTopOffset = element.offsetTop;\n\n  if (container.scrollTop > elementTopOffset) {\n    return elementTopOffset;\n  }\n\n  const offset = elementTopOffset + element.scrollHeight - container.offsetHeight;\n  if (container.scrollTop < offset) {\n    return offset;\n  }\n\n  return container.scrollTop;\n};\n\nexport const convertScrollbarXScrollState = (state: ScrollBarScrollState): ScrollContainerScrollStateX => {\n  const scrollBarState: Record<ScrollBarScrollState, ScrollContainerScrollStateX> = {\n    begin: 'left',\n    end: 'right',\n    middle: 'scroll',\n  };\n\n  return scrollBarState[state];\n};\n\nexport const convertScrollbarYScrollState = (state: ScrollBarScrollState): ScrollContainerScrollStateY => {\n  const scrollBarState: Record<ScrollBarScrollState, ScrollContainerScrollStateY> = {\n    begin: 'top',\n    end: 'bottom',\n    middle: 'scroll',\n  };\n\n  return scrollBarState[state];\n};\n"],"mappings":"qLAAA,IAAAA,gBAAA,GAAAC,OAAA;;;;AAIO,IAAMC,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAG,SAAtBA,mBAAmBA,CAAIE,KAAkB,EAAEC,IAAe,EAAK;EAC1E,IAAAC,qBAAA,GAA8BC,0CAAyB,CAACF,IAAI,CAAC,CAArDG,MAAM,GAAAF,qBAAA,CAANE,MAAM,CAAEC,IAAI,GAAAH,qBAAA,CAAJG,IAAI,CAAEC,GAAG,GAAAJ,qBAAA,CAAHI,GAAG;;EAEzB,IAAMC,WAAW,GAAGP,KAAK,CAACK,IAAI,CAAC;EAC/B,IAAMG,YAAY,GAAGR,KAAK,CAACM,GAAG,CAAC;EAC/B,IAAMG,aAAa,GAAGT,KAAK,CAACI,MAAM,CAAC;;EAEnC,IAAMM,YAAY,GAAGD,aAAa,GAAGF,WAAW;;EAEhD,IAAII,UAAU,GAAG,CAAC;EAClB,IAAIC,SAAS,GAAG,CAAC;;EAEjB,IAAIF,YAAY,EAAE;IAChBC,UAAU,GAAGE,IAAI,CAACC,GAAG,CAAEL,aAAa,GAAGF,WAAW,GAAIE,aAAa,EAAEM,gCAAe,CAAC;IACrFH,SAAS,GAAIJ,YAAY,IAAID,WAAW,GAAGE,aAAa,CAAC,IAAKA,aAAa,GAAGE,UAAU,CAAC;;IAEzF;IACAA,UAAU,GAAGF,aAAa,IAAK,GAAG,GAAGA,aAAa,GAAIE,UAAU;IAChEC,SAAS,GAAGH,aAAa,IAAK,GAAG,GAAGA,aAAa,GAAIG,SAAS;EAChE;;EAEA,OAAO;IACLF,YAAY,EAAZA,YAAY;IACZC,UAAU,EAAVA,UAAU;IACVC,SAAS,EAATA;EACF,CAAC;AACH,CAAC;;AAEM,IAAMI,gBAAgB,GAAAjB,OAAA,CAAAiB,gBAAA,GAAG,SAAnBA,gBAAgBA,CAAIC,OAAoB,EAAEC,SAAsB,EAAK;EAChF,IAAMC,gBAAgB,GAAGF,OAAO,CAACG,SAAS;;EAE1C,IAAIF,SAAS,CAACG,SAAS,GAAGF,gBAAgB,EAAE;IAC1C,OAAOA,gBAAgB;EACzB;;EAEA,IAAMf,MAAM,GAAGe,gBAAgB,GAAGF,OAAO,CAACK,YAAY,GAAGJ,SAAS,CAACK,YAAY;EAC/E,IAAIL,SAAS,CAACG,SAAS,GAAGjB,MAAM,EAAE;IAChC,OAAOA,MAAM;EACf;;EAEA,OAAOc,SAAS,CAACG,SAAS;AAC5B,CAAC;;AAEM,IAAMG,4BAA4B,GAAAzB,OAAA,CAAAyB,4BAAA,GAAG,SAA/BA,4BAA4BA,CAAIC,KAA2B,EAAkC;EACxG,IAAMC,cAAyE,GAAG;IAChFC,KAAK,EAAE,MAAM;IACbC,GAAG,EAAE,OAAO;IACZC,MAAM,EAAE;EACV,CAAC;;EAED,OAAOH,cAAc,CAACD,KAAK,CAAC;AAC9B,CAAC;;AAEM,IAAMK,4BAA4B,GAAA/B,OAAA,CAAA+B,4BAAA,GAAG,SAA/BA,4BAA4BA,CAAIL,KAA2B,EAAkC;EACxG,IAAMC,cAAyE,GAAG;IAChFC,KAAK,EAAE,KAAK;IACZC,GAAG,EAAE,QAAQ;IACbC,MAAM,EAAE;EACV,CAAC;;EAED,OAAOH,cAAc,CAACD,KAAK,CAAC;AAC9B,CAAC","ignoreList":[]}