@skbkontur/react-ui 0.0.0-7dc91ef93e → 0.0.0-7f260475fb

package/components/ScrollContainer/ScrollContainer.helpers.js

@@ -0,0 +1,50 @@
+import { MIN_SCROLL_SIZE, scrollSizeParametersNames } from './ScrollContainer.constants.js';
+export var getScrollSizeParams = function (inner, axis) {
+    var _a = scrollSizeParametersNames[axis], offset = _a.offset, size = _a.size, pos = _a.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, 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,
+    };
+};
+export var getScrollYOffset = function (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;
+};
+export var convertScrollbarXScrollState = function (state) {
+    var scrollBarState = {
+        begin: 'left',
+        end: 'right',
+        middle: 'scroll',
+    };
+    return scrollBarState[state];
+};
+export var convertScrollbarYScrollState = function (state) {
+    var scrollBarState = {
+        begin: 'top',
+        end: 'bottom',
+        middle: 'scroll',
+    };
+    return scrollBarState[state];
+};
+//# sourceMappingURL=ScrollContainer.helpers.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollContainer.helpers.js","sourceRoot":"","sources":["../../../components/ScrollContainer/ScrollContainer.helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAI5F,MAAM,CAAC,IAAM,mBAAmB,GAAG,UAAC,KAAkB,EAAE,IAAe;IAC/D,IAAA,KAAwB,yBAAyB,CAAC,IAAI,CAAC,EAArD,MAAM,YAAA,EAAE,IAAI,UAAA,EAAE,GAAG,SAAoC,CAAC;IAE9D,IAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;IAChC,IAAM,YAAY,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IAChC,IAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IAEpC,IAAM,YAAY,GAAG,aAAa,GAAG,WAAW,CAAC;IAEjD,IAAI,UAAU,GAAG,CAAC,CAAC;IACnB,IAAI,SAAS,GAAG,CAAC,CAAC;IAElB,IAAI,YAAY,EAAE,CAAC;QACjB,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,aAAa,GAAG,WAAW,CAAC,GAAG,aAAa,EAAE,eAAe,CAAC,CAAC;QACtF,SAAS,GAAG,CAAC,YAAY,GAAG,CAAC,WAAW,GAAG,aAAa,CAAC,CAAC,GAAG,CAAC,aAAa,GAAG,UAAU,CAAC,CAAC;QAE1F,gCAAgC;QAChC,UAAU,GAAG,aAAa,IAAI,CAAC,GAAG,GAAG,aAAa,CAAC,GAAG,UAAU,CAAC;QACjE,SAAS,GAAG,aAAa,IAAI,CAAC,GAAG,GAAG,aAAa,CAAC,GAAG,SAAS,CAAC;IACjE,CAAC;IAED,OAAO;QACL,YAAY,cAAA;QACZ,UAAU,YAAA;QACV,SAAS,WAAA;KACV,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,gBAAgB,GAAG,UAAC,OAAoB,EAAE,SAAsB;IAC3E,IAAM,gBAAgB,GAAG,OAAO,CAAC,SAAS,CAAC;IAE3C,IAAI,SAAS,CAAC,SAAS,GAAG,gBAAgB,EAAE,CAAC;QAC3C,OAAO,gBAAgB,CAAC;IAC1B,CAAC;IAED,IAAM,MAAM,GAAG,gBAAgB,GAAG,OAAO,CAAC,YAAY,GAAG,SAAS,CAAC,YAAY,CAAC;IAChF,IAAI,SAAS,CAAC,SAAS,GAAG,MAAM,EAAE,CAAC;QACjC,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,OAAO,SAAS,CAAC,SAAS,CAAC;AAC7B,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,4BAA4B,GAAG,UAAC,KAA2B;IACtE,IAAM,cAAc,GAA8D;QAChF,KAAK,EAAE,MAAM;QACb,GAAG,EAAE,OAAO;QACZ,MAAM,EAAE,QAAQ;KACjB,CAAC;IAEF,OAAO,cAAc,CAAC,KAAK,CAAC,CAAC;AAC/B,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,4BAA4B,GAAG,UAAC,KAA2B;IACtE,IAAM,cAAc,GAA8D;QAChF,KAAK,EAAE,KAAK;QACZ,GAAG,EAAE,QAAQ;QACb,MAAM,EAAE,QAAQ;KACjB,CAAC;IAEF,OAAO,cAAc,CAAC,KAAK,CAAC,CAAC;AAC/B,CAAC,CAAC","sourcesContent":["import { MIN_SCROLL_SIZE, scrollSizeParametersNames } from './ScrollContainer.constants.js';\nimport type { ScrollBarScrollState } from './ScrollBar.js';\nimport type { ScrollContainerScrollStateX, ScrollContainerScrollStateY } from './ScrollContainer.js';\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"]}

package/components/ScrollContainer/ScrollContainer.js

@@ -0,0 +1,310 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import React from 'react';
+import { globalObject } from '@skbkontur/global-object';
+import debounce from 'lodash.debounce';
+import { isInstanceOf } from '../../lib/isInstanceOf.js';
+import * as LayoutEvents from '../../lib/LayoutEvents.js';
+import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { cx } from '../../lib/theming/Emotion.js';
+import { rootNode } from '../../lib/rootNode/index.js';
+import { getDOMRect } from '../../lib/dom/getDOMRect.js';
+import { createPropsGetter } from '../../lib/createPropsGetter.js';
+import { isTestEnv } from '../../lib/currentEnvironment.js';
+import { callChildRef } from '../../lib/callChildRef/callChildRef.js';
+import { styles, globalClasses } from './ScrollContainer.styles.js';
+import { scrollSizeParametersNames } from './ScrollContainer.constants.js';
+import { getScrollYOffset, convertScrollbarXScrollState, convertScrollbarYScrollState, } from './ScrollContainer.helpers.js';
+import { ScrollBar } from './ScrollBar.js';
+export var ScrollContainerDataTids = {
+    root: 'ScrollContainer__root',
+    inner: 'ScrollContainer__inner',
+};
+/**
+ * `ScrollContainer` используется для создания контейнера с кастомными полосами прокрутки, который обеспечивает прокрутку содержимого по горизонтали или вертикали.
+ */
+var ScrollContainer = /** @class */ (function (_super) {
+    __extends(ScrollContainer, _super);
+    function ScrollContainer() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.getProps = createPropsGetter(ScrollContainer_1.defaultProps);
+        _this.initialIsScrollBarVisible = _this.getProps().showScrollBar === 'always';
+        _this.state = {
+            isScrollBarXVisible: _this.initialIsScrollBarVisible,
+            isScrollBarYVisible: _this.initialIsScrollBarVisible,
+            isHovered: false,
+        };
+        _this.render = 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');
+            return (React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.props),
+                React.createElement("div", { "data-tid": ScrollContainerDataTids.root, className: styles.root(), onMouseMove: _this.handleMouseMove, onMouseLeave: _this.handleMouseLeave },
+                    scrollbarY,
+                    scrollbarX,
+                    React.createElement("div", { style: innerStyle, ref: _this.refInner, className: cx(styles.inner(), globalClasses.inner), "data-tid": ScrollContainerDataTids.inner, onScroll: _this.handleNativeScroll }, props.children))));
+        };
+        _this.renderScrollbar = function (axis) {
+            var _a = _this.getProps(), offsetY = _a.offsetY, offsetX = _a.offsetX, invert = _a.invert, disableAnimations = _a.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 (React.createElement(ScrollBar, { axis: axis, ref: refScrollBar, invert: invert, onScroll: _this.handleScroll, offset: offset, disableAnimations: disableAnimations, isVisible: isVisible }));
+        };
+        _this.handleScrollStateChange = function (scrollState, axis) {
+            var _a, _b, _c, _d, _e, _f;
+            if (!_this.scrollY || !_this.scrollX) {
+                return;
+            }
+            if (axis === 'x') {
+                var scrollXState = convertScrollbarXScrollState(scrollState);
+                (_b = (_a = _this.props).onScrollStateChangeX) === null || _b === void 0 ? void 0 : _b.call(_a, scrollXState);
+                return;
+            }
+            var scrollYState = convertScrollbarYScrollState(scrollState);
+            (_d = (_c = _this.props).onScrollStateChange) === null || _d === void 0 ? void 0 : _d.call(_c, scrollYState);
+            (_f = (_e = _this.props).onScrollStateChangeY) === null || _f === void 0 ? void 0 : _f.call(_e, scrollYState);
+        };
+        _this.handleScroll = function (axis, scrollState, prevScrollState) {
+            if (scrollState !== prevScrollState) {
+                _this.handleScrollStateChange(scrollState, axis);
+            }
+            var showScrollBar = _this.getProps().showScrollBar;
+            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;
+            if (_this.props.scrollRef) {
+                callChildRef(_this.props.scrollRef, element);
+            }
+        };
+        _this.handleNativeScroll = function (event) {
+            var _a, _b, _c, _d;
+            (_a = _this.scrollY) === null || _a === void 0 ? void 0 : _a.reflow();
+            (_b = _this.scrollX) === null || _b === void 0 ? void 0 : _b.reflow();
+            (_d = (_c = _this.props).onScroll) === null || _d === void 0 ? void 0 : _d.call(_c, 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 _a, _b;
+            if (_this.state.isHovered) {
+                return;
+            }
+            var isScrollBarXHovered = (_a = _this.scrollX) === null || _a === void 0 ? void 0 : _a.getHover();
+            var isScrollBarYHovered = (_b = _this.scrollY) === null || _b === void 0 ? void 0 : _b.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 _a = scrollSizeParametersNames[axis], pos = _a.pos, size = _a.size, offset = _a.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 _a, _b;
+            var right = getDOMRect(event.currentTarget).right - event.pageX;
+            var bottom = getDOMRect(event.currentTarget).bottom - event.pageY;
+            (_a = _this.scrollY) === null || _a === void 0 ? void 0 : _a.setHover(right <= 12);
+            (_b = _this.scrollX) === null || _b === void 0 ? void 0 : _b.setHover(right >= 12 && bottom <= 12);
+            _this.getProps().showScrollBar === 'hover' &&
+                !_this.state.isHovered &&
+                _this.setState({ isScrollBarXVisible: true, isScrollBarYVisible: true, isHovered: true });
+        };
+        _this.handleMouseLeave = function () {
+            var _a, _b;
+            (_a = _this.scrollY) === null || _a === void 0 ? void 0 : _a.setHover(false);
+            (_b = _this.scrollX) === null || _b === void 0 ? void 0 : _b.setHover(false);
+            if (_this.getProps().showScrollBar === 'hover') {
+                _this.setState({ isHovered: false });
+                _this.hideScrollBar('both');
+            }
+        };
+        _this.updateInnerElement = function () {
+            var _a, _b;
+            (_a = _this.scrollX) === null || _a === void 0 ? void 0 : _a.setInnerElement(_this.inner);
+            (_b = _this.scrollY) === null || _b === void 0 ? void 0 : _b.setInnerElement(_this.inner);
+        };
+        return _this;
+    }
+    ScrollContainer_1 = ScrollContainer;
+    ScrollContainer.prototype.componentDidMount = function () {
+        this.updateInnerElement();
+    };
+    ScrollContainer.prototype.componentDidUpdate = function (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 });
+            }
+        }
+    };
+    /**
+     * @public
+     * @param {Element} element
+     */
+    ScrollContainer.prototype.scrollTo = function (element) {
+        if (!element || !this.inner) {
+            return;
+        }
+        this.inner.scrollLeft = element.offsetLeft;
+        this.inner.scrollTop = getScrollYOffset(element, this.inner);
+    };
+    /**
+     * @public
+     */
+    ScrollContainer.prototype.scrollToTop = function () {
+        if (!this.inner) {
+            return;
+        }
+        this.inner.scrollTop = 0;
+    };
+    /**
+     * @public
+     */
+    ScrollContainer.prototype.scrollToBottom = function () {
+        if (!this.inner) {
+            return;
+        }
+        this.inner.scrollTop = this.inner.scrollHeight - this.inner.offsetHeight;
+    };
+    /**
+     * @public
+     */
+    ScrollContainer.prototype.scrollToLeft = function () {
+        if (!this.inner) {
+            return;
+        }
+        this.inner.scrollLeft = 0;
+    };
+    /**
+     * @public
+     */
+    ScrollContainer.prototype.scrollToRight = function () {
+        if (!this.inner) {
+            return;
+        }
+        this.inner.scrollLeft = this.inner.scrollWidth - this.inner.offsetWidth;
+    };
+    ScrollContainer.prototype.hasScrollBar = function (axis) {
+        if (!this.inner) {
+            return false;
+        }
+        return axis === 'x'
+            ? this.inner.offsetWidth < this.inner.scrollWidth
+            : this.inner.offsetHeight < this.inner.scrollHeight;
+    };
+    var ScrollContainer_1;
+    ScrollContainer.__KONTUR_REACT_UI__ = 'ScrollContainer';
+    ScrollContainer.displayName = 'ScrollContainer';
+    ScrollContainer.defaultProps = {
+        invert: false,
+        scrollBehaviour: 'auto',
+        preventWindowScroll: false,
+        disableAnimations: isTestEnv,
+        hideScrollBarDelay: 500,
+        showScrollBar: 'always',
+    };
+    ScrollContainer = ScrollContainer_1 = __decorate([
+        rootNode
+    ], ScrollContainer);
+    return ScrollContainer;
+}(React.Component));
+export { ScrollContainer };
+//# sourceMappingURL=ScrollContainer.js.map

package/components/ScrollContainer/ScrollContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollContainer.js","sourceRoot":"","sources":["../../../components/ScrollContainer/ScrollContainer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,QAAQ,MAAM,iBAAiB,CAAC;AAEvC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,KAAK,YAAY,MAAM,2BAA2B,CAAC;AAE1D,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAEtE,OAAO,EAAE,EAAE,EAAE,MAAM,8BAA8B,CAAC;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAEtE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EACL,gBAAgB,EAChB,4BAA4B,EAC5B,4BAA4B,GAC7B,MAAM,8BAA8B,CAAC;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AA+D3C,MAAM,CAAC,IAAM,uBAAuB,GAAG;IACrC,IAAI,EAAE,uBAAuB;IAC7B,KAAK,EAAE,wBAAwB;CACvB,CAAC;AAeX;;GAEG;AAEH;IAAqC,mCAA2D;IAAhG;;QAeU,cAAQ,GAAG,iBAAiB,CAAC,iBAAe,CAAC,YAAY,CAAC,CAAC;QAM3D,+BAAyB,GAAG,KAAI,CAAC,QAAQ,EAAE,CAAC,aAAa,KAAK,QAAQ,CAAC;QAExE,WAAK,GAAyB;YACnC,mBAAmB,EAAE,KAAI,CAAC,yBAAyB;YACnD,mBAAmB,EAAE,KAAI,CAAC,yBAAyB;YACnD,SAAS,EAAE,KAAK;SACjB,CAAC;QA8BK,YAAM,GAAG;YACd,IAAM,KAAK,GAAG,KAAI,CAAC,KAAK,CAAC;YAEzB,IAAI,KAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;gBACxB,OAAO,KAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;YAC7B,CAAC;YAED,IAAM,UAAU,GAAwB;gBACtC,cAAc,EAAE,KAAI,CAAC,QAAQ,EAAE,CAAC,eAAe;gBAC/C,SAAS,EAAE,KAAK,CAAC,SAAS;gBAC1B,QAAQ,EAAE,KAAK,CAAC,QAAQ;aACzB,CAAC;YAEF,IAAM,UAAU,GAAG,KAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;YAC7C,IAAM,UAAU,GAAG,KAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;YAE7C,OAAO,CACL,oBAAC,aAAa,aAAC,WAAW,EAAE,KAAI,CAAC,WAAW,IAAM,KAAI,CAAC,KAAK;gBAC1D,yCACY,uBAAuB,CAAC,IAAI,EACtC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,EACxB,WAAW,EAAE,KAAI,CAAC,eAAe,EACjC,YAAY,EAAE,KAAI,CAAC,gBAAgB;oBAElC,UAAU;oBACV,UAAU;oBACX,6BACE,KAAK,EAAE,UAAU,EACjB,GAAG,EAAE,KAAI,CAAC,QAAQ,EAClB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,aAAa,CAAC,KAAK,CAAC,cACxC,uBAAuB,CAAC,KAAK,EACvC,QAAQ,EAAE,KAAI,CAAC,kBAAkB,IAEhC,KAAK,CAAC,QAAQ,CACX,CACF,CACQ,CACjB,CAAC;QACJ,CAAC,CAAC;QAkEM,qBAAe,GAAG,UAAC,IAAgB;YACnC,IAAA,KAAkD,KAAI,CAAC,QAAQ,EAAE,EAA/D,OAAO,aAAA,EAAE,OAAO,aAAA,EAAE,MAAM,YAAA,EAAE,iBAAiB,uBAAoB,CAAC;YACxE,IAAM,OAAO,GAAG,IAAI,KAAK,GAAG,CAAC;YAC7B,IAAM,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC,KAAI,CAAC,aAAa,CAAC,CAAC,CAAC,KAAI,CAAC,aAAa,CAAC;YACvE,IAAM,MAAM,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;YAC3C,IAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,KAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,KAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC;YAE5F,OAAO,CACL,oBAAC,SAAS,IACR,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,YAAY,EACjB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,KAAI,CAAC,YAAY,EAC3B,MAAM,EAAE,MAAM,EACd,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,SAAS,GACpB,CACH,CAAC;QACJ,CAAC,CAAC;QAEM,6BAAuB,GAAG,UAAC,WAAiC,EAAE,IAAgB;;YACpF,IAAI,CAAC,KAAI,CAAC,OAAO,IAAI,CAAC,KAAI,CAAC,OAAO,EAAE,CAAC;gBACnC,OAAO;YACT,CAAC;YAED,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC;gBACjB,IAAM,YAAY,GAAG,4BAA4B,CAAC,WAAW,CAAC,CAAC;gBAE/D,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,oBAAoB,mDAAG,YAAY,CAAC,CAAC;gBAChD,OAAO;YACT,CAAC;YAED,IAAM,YAAY,GAAG,4BAA4B,CAAC,WAAW,CAAC,CAAC;YAE/D,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,mBAAmB,mDAAG,YAAY,CAAC,CAAC;YAC/C,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,oBAAoB,mDAAG,YAAY,CAAC,CAAC;QAClD,CAAC,CAAC;QAEM,kBAAY,GAAG,UACrB,IAAgB,EAChB,WAAiC,EACjC,eAAqC;YAErC,IAAI,WAAW,KAAK,eAAe,EAAE,CAAC;gBACpC,KAAI,CAAC,uBAAuB,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;YAClD,CAAC;YACO,IAAA,aAAa,GAAK,KAAI,CAAC,QAAQ,EAAE,cAApB,CAAqB;YAC1C,aAAa,KAAK,QAAQ,IAAI,KAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,CAAC;QACrE,CAAC,CAAC;QAEM,mBAAa,GAAG,UAAC,SAA8B;YACrD,KAAI,CAAC,OAAO,GAAG,SAAS,CAAC;QAC3B,CAAC,CAAC;QAEM,mBAAa,GAAG,UAAC,SAA8B;YACrD,KAAI,CAAC,OAAO,GAAG,SAAS,CAAC;QAC3B,CAAC,CAAC;QAEM,cAAQ,GAAG,UAAC,OAA2B;YAC7C,IAAI,CAAC,KAAI,CAAC,KAAK,IAAI,OAAO,IAAI,KAAI,CAAC,QAAQ,EAAE,CAAC,mBAAmB,EAAE,CAAC;gBAClE,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAI,CAAC,sBAAsB,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;YACrF,CAAC;YACD,IAAI,KAAI,CAAC,KAAK,IAAI,CAAC,OAAO,EAAE,CAAC;gBAC3B,KAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,OAAO,EAAE,KAAI,CAAC,sBAAsB,CAAC,CAAC;YACvE,CAAC;YACD,KAAI,CAAC,KAAK,GAAG,OAAO,CAAC;YAErB,IAAI,KAAI,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC;gBACzB,YAAY,CAAC,KAAI,CAAC,KAAK,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;YAC9C,CAAC;QACH,CAAC,CAAC;QAEM,wBAAkB,GAAG,UAAC,KAAoC;;YAChE,MAAA,KAAI,CAAC,OAAO,0CAAE,MAAM,EAAE,CAAC;YACvB,MAAA,KAAI,CAAC,OAAO,0CAAE,MAAM,EAAE,CAAC;YAEvB,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,QAAQ,mDAAG,KAAK,CAAC,CAAC;YAC7B,IAAI,KAAI,CAAC,QAAQ,EAAE,CAAC,mBAAmB,EAAE,CAAC;gBACxC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;YACT,CAAC;YACD,YAAY,CAAC,IAAI,EAAE,CAAC;QACtB,CAAC,CAAC;QAEM,+BAAyB,GAAG,UAAC,IAAgB;YACnD,IAAM,kBAAkB,GAAG,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,KAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,KAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC;YAC1G,IAAI,CAAC,kBAAkB,EAAE,CAAC;gBACxB,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,KAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,KAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,IAAI,EAAE,CAAC,CAAC;YAC7G,CAAC;YACD,KAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAC3B,CAAC,CAAC;QAEe,mBAAa,GAAG,QAAQ,CAAC,UAAC,IAAyB;;YAClE,IAAI,KAAI,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC;gBACzB,OAAO;YACT,CAAC;YACD,IAAM,mBAAmB,GAAG,MAAA,KAAI,CAAC,OAAO,0CAAE,QAAQ,EAAE,CAAC;YACrD,IAAM,mBAAmB,GAAG,MAAA,KAAI,CAAC,OAAO,0CAAE,QAAQ,EAAE,CAAC;YACrD,IAAI,IAAI,KAAK,MAAM,EAAE,CAAC;gBACpB,CAAC,mBAAmB,IAAI,CAAC,mBAAmB;oBAC1C,CAAC,CAAC,KAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,CAAC;oBAC3E,CAAC,CAAC,KAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;YACjC,CAAC;iBAAM,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC;gBACxB,CAAC,mBAAmB,CAAC,CAAC,CAAC,KAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,KAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YACjG,CAAC;iBAAM,CAAC;gBACN,CAAC,mBAAmB,CAAC,CAAC,CAAC,KAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,KAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YACjG,CAAC;QACH,CAAC,EAAE,KAAI,CAAC,QAAQ,EAAE,CAAC,kBAAkB,CAAC,CAAC;QAE/B,4BAAsB,GAAG,UAAC,KAAY;YAC5C,IAAI,CAAC,KAAI,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,YAAY,CAAC,UAAU,CAAC,EAAE,CAAC;gBACjE,OAAO;YACT,CAAC;YAED,IAAM,IAAI,GAAe,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;YAEpD,IAAI,KAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;gBACtB,IAAA,KAAwB,yBAAyB,CAAC,IAAI,CAAC,EAArD,GAAG,SAAA,EAAE,IAAI,UAAA,EAAE,MAAM,YAAoC,CAAC;gBAE9D,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,KAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;oBACjF,KAAK,CAAC,cAAc,EAAE,CAAC;oBACvB,OAAO,KAAK,CAAC;gBACf,CAAC;gBACD,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;oBAC7C,KAAK,CAAC,cAAc,EAAE,CAAC;oBACvB,OAAO,KAAK,CAAC;gBACf,CAAC;YACH,CAAC;QACH,CAAC,CAAC;QAEM,qBAAe,GAAG,UAAC,KAAuC;;YAChE,IAAM,KAAK,GAAG,UAAU,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;YAClE,IAAM,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC;YAEpE,MAAA,KAAI,CAAC,OAAO,0CAAE,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;YACpC,MAAA,KAAI,CAAC,OAAO,0CAAE,QAAQ,CAAC,KAAK,IAAI,EAAE,IAAI,MAAM,IAAI,EAAE,CAAC,CAAC;YAEpD,KAAI,CAAC,QAAQ,EAAE,CAAC,aAAa,KAAK,OAAO;gBACvC,CAAC,KAAI,CAAC,KAAK,CAAC,SAAS;gBACrB,KAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,IAAI,EAAE,mBAAmB,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;QAC7F,CAAC,CAAC;QAEM,sBAAgB,GAAG;;YACzB,MAAA,KAAI,CAAC,OAAO,0CAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;YAC9B,MAAA,KAAI,CAAC,OAAO,0CAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;YAC9B,IAAI,KAAI,CAAC,QAAQ,EAAE,CAAC,aAAa,KAAK,OAAO,EAAE,CAAC;gBAC9C,KAAI,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;gBACpC,KAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;YAC7B,CAAC;QACH,CAAC,CAAC;QAEM,wBAAkB,GAAG;;YAC3B,MAAA,KAAI,CAAC,OAAO,0CAAE,eAAe,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC;YAC1C,MAAA,KAAI,CAAC,OAAO,0CAAE,eAAe,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC;QAC5C,CAAC,CAAC;;IACJ,CAAC;wBA5TY,eAAe;IA6BnB,2CAAiB,GAAxB;QACE,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAEM,4CAAkB,GAAzB,UAA0B,SAA+B;QACvD,IAAM,mBAAmB,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,mBAAmB,CAAC;QAChE,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,IAAI,SAAS,CAAC,mBAAmB,IAAI,CAAC,mBAAmB,EAAE,CAAC;gBAC1D,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC;YACvE,CAAC;YACD,IAAI,CAAC,SAAS,CAAC,mBAAmB,IAAI,mBAAmB,EAAE,CAAC;gBAC1D,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,sBAAsB,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;YACxF,CAAC;QACH,CAAC;QAED,IAAI,SAAS,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;YACvE,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;QAED,IAAI,SAAS,CAAC,aAAa,KAAK,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,CAAC;YACzD,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,KAAK,QAAQ,EAAE,CAAC;gBAC1C,IAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,IAAI,EAAE,mBAAmB,EAAE,IAAI,EAAE,CAAC,CAAC;YAC1E,CAAC;iBAAM,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,KAAK,OAAO,EAAE,CAAC;gBAChD,IAAI,CAAC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,CAAC,CAAC;YAC5E,CAAC;QACH,CAAC;IACH,CAAC;IA0CD;;;OAGG;IACI,kCAAQ,GAAf,UAAgB,OAA8B;QAC5C,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAC5B,OAAO;QACT,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;QAC3C,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/D,CAAC;IAED;;OAEG;IACI,qCAAW,GAAlB;QACE,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC;IAC3B,CAAC;IAED;;OAEG;IACI,wCAAc,GAArB;QACE,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;IAC3E,CAAC;IAED;;OAEG;IACI,sCAAY,GAAnB;QACE,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC;IAC5B,CAAC;IAED;;OAEG;IACI,uCAAa,GAApB;QACE,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC;IAC1E,CAAC;IAEM,sCAAY,GAAnB,UAAoB,IAAgB;QAClC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,IAAI,KAAK,GAAG;YACjB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW;YACjD,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;IACxD,CAAC;;IA9Ja,mCAAmB,GAAG,iBAAiB,AAApB,CAAqB;IACxC,2BAAW,GAAG,iBAAiB,AAApB,CAAqB;IAIhC,4BAAY,GAAiB;QACzC,MAAM,EAAE,KAAK;QACb,eAAe,EAAE,MAAM;QACvB,mBAAmB,EAAE,KAAK;QAC1B,iBAAiB,EAAE,SAAS;QAC5B,kBAAkB,EAAE,GAAG;QACvB,aAAa,EAAE,QAAQ;KACxB,AAPyB,CAOxB;IAbS,eAAe;QAD3B,QAAQ;OACI,eAAe,CA4T3B;IAAD,sBAAC;CAAA,AA5TD,CAAqC,KAAK,CAAC,SAAS,GA4TnD;SA5TY,eAAe","sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\nimport debounce from 'lodash.debounce';\n\nimport { isInstanceOf } from '../../lib/isInstanceOf.js';\nimport * as LayoutEvents from '../../lib/LayoutEvents.js';\nimport type { CommonProps } from '../../internal/CommonWrapper/types.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { cx } from '../../lib/theming/Emotion.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode//rootNodeDecorator.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { getDOMRect } from '../../lib/dom/getDOMRect.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { isTestEnv } from '../../lib/currentEnvironment.js';\nimport { callChildRef } from '../../lib/callChildRef/callChildRef.js';\n\nimport { styles, globalClasses } from './ScrollContainer.styles.js';\nimport { scrollSizeParametersNames } from './ScrollContainer.constants.js';\nimport {\n  getScrollYOffset,\n  convertScrollbarXScrollState,\n  convertScrollbarYScrollState,\n} from './ScrollContainer.helpers.js';\nimport type { ScrollAxis, ScrollBarScrollState } from './ScrollBar.js';\nimport { ScrollBar } from './ScrollBar.js';\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   * @default false */\n  invert?: boolean;\n\n  /** Задает максимальную высоту. */\n  maxHeight?: React.CSSProperties['maxHeight'];\n\n  /** Задает максимальную ширину. */\n  maxWidth?: React.CSSProperties['maxWidth'];\n\n  /** Отключает скролл окна, когда меню открыто.\n   * @default false */\n  preventWindowScroll?: boolean;\n\n  /** Задает поведение скролла. (https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior)\n   * @default 'auto' */\n  scrollBehaviour?: ScrollBehaviour;\n\n  /** Задает функцию, которая вызывается при скроле по горизонтали. */\n  onScrollStateChangeX?: (scrollState: ScrollContainerScrollStateX) => void;\n\n  /** Задает функцию, которая вызывается при скроле по вертикали. */\n  onScrollStateChangeY?: (scrollState: ScrollContainerScrollStateY) => void;\n\n  /** Задает функцию, которая вызывается при скроле.\n   * @deprecated use onScroll */\n  onScrollStateChange?: (scrollYState: ScrollContainerScrollState) => void;\n\n  /** Задает функцию, которая вызывается при скроле. */\n  onScroll?: (e: React.UIEvent<HTMLDivElement>) => void;\n\n  /** Отключает кастомный скролл. */\n  disabled?: boolean;\n\n  /** Задает смещение вертикального скроллбара. */\n  offsetY?: Partial<Record<OffsetCSSPropsY, React.CSSProperties[OffsetCSSPropsY]>>;\n\n  /** Задает смещение горизонтального скроллбара. */\n  offsetX?: Partial<Record<OffsetCSSPropsX, React.CSSProperties[OffsetCSSPropsX]>>;\n\n  /** Определяет, нужно ли показывать скроллбар. */\n  showScrollBar?: 'always' | 'scroll' | 'hover' | 'never';\n\n  /** Устанавливает задержку в миллисекундах перед скрытием скроллбара.\n   * Работает только при hideScrollBar = true или showScrollBar = 'scroll' | 'hover'. */\n  hideScrollBarDelay?: number;\n\n  /** Отключает анимацию. */\n  disableAnimations?: boolean;\n  scrollRef?: React.Ref<HTMLDivElement | null>;\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' | 'scrollBehaviour' | 'preventWindowScroll' | 'disableAnimations' | 'hideScrollBarDelay' | 'showScrollBar'\n  >\n>;\n\ninterface ScrollContainerState {\n  isScrollBarXVisible: boolean;\n  isScrollBarYVisible: boolean;\n  isHovered: boolean;\n}\n\n/**\n * `ScrollContainer` используется для создания контейнера с кастомными полосами прокрутки, который обеспечивает прокрутку содержимого по горизонтали или вертикали.\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 defaultProps: DefaultProps = {\n    invert: false,\n    scrollBehaviour: 'auto',\n    preventWindowScroll: 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  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private initialIsScrollBarVisible = this.getProps().showScrollBar === 'always';\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    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\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={cx(styles.inner(), globalClasses.inner)}\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 { showScrollBar } = this.getProps();\n    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    if (this.props.scrollRef) {\n      callChildRef(this.props.scrollRef, element);\n    }\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.styles.d.ts

@@ -1,22 +1,21 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const globalClasses: {
-    scrollbarX: string;
-    scrollbarY: string;
-    scrollbarContainerX: string;
-    scrollbarContainerY: string;
-    inner: string;
-};
-export declare const styles: {
-    root(): string;
-    inner(): string;
-    innerIE11(): string;
-    scrollBar(t: Theme): string;
-    visibleScrollBar(): string;
-    scrollBarInvert(t: Theme): string;
-    scrollBarContainerY(): string;
-    scrollBarY(t: Theme): string;
-    scrollBarYHover(t: Theme): string;
-    scrollBarContainerX(t: Theme): string;
-    scrollBarX(t: Theme): string;
-    scrollBarXHover(t: Theme): string;
-};
+import type { Theme } from '../../lib/theming/Theme.js';
+export declare const globalClasses: {
+    scrollbarX: string;
+    scrollbarY: string;
+    scrollbarContainerX: string;
+    scrollbarContainerY: string;
+    inner: string;
+};
+export declare const styles: {
+    root(): string;
+    inner(): string;
+    scrollBar(t: Theme): string;
+    visibleScrollBar(): string;
+    scrollBarInvert(t: Theme): string;
+    scrollBarContainerY(): string;
+    scrollBarY(t: Theme): string;
+    scrollBarYHover(t: Theme): string;
+    scrollBarContainerX(t: Theme): string;
+    scrollBarX(t: Theme): string;
+    scrollBarXHover(t: Theme): string;
+};

package/components/ScrollContainer/ScrollContainer.styles.js

@@ -0,0 +1,49 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion.js';
+export var globalClasses = prefix('scroll-container')({
+    scrollbarX: 'scrollbar-x',
+    scrollbarY: 'scrollbar-y',
+    scrollbarContainerX: 'scrollbar-container-x',
+    scrollbarContainerY: 'scrollbar-container-y',
+    inner: 'inner',
+});
+export var styles = memoizeStyle({
+    root: function () {
+        return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      height: 100%;\n      overflow: hidden;\n      position: relative;\n    "], ["\n      height: 100%;\n      overflow: hidden;\n      position: relative;\n    "])));
+    },
+    inner: function () {
+        return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      position: relative;\n      overflow: scroll;\n      height: 100%;\n      width: 100%;\n\n      /* Hide scrobars without losing functionality */\n      scrollbar-width: none;\n      -ms-overflow-style: none;\n      &::-webkit-scrollbar {\n        width: 0;\n        height: 0;\n      }\n    "], ["\n      position: relative;\n      overflow: scroll;\n      height: 100%;\n      width: 100%;\n\n      /* Hide scrobars without losing functionality */\n      scrollbar-width: none;\n      -ms-overflow-style: none;\n      &::-webkit-scrollbar {\n        width: 0;\n        height: 0;\n      }\n    "])));
+    },
+    scrollBar: function (t) {
+        return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      position: absolute;\n      z-index: 200;\n      border-radius: 5px;\n      background: ", ";\n      opacity: 0;\n      transition:\n        opacity 0.3s ease-out,\n        width 0.2s,\n        height 0.2s;\n    "], ["\n      position: absolute;\n      z-index: 200;\n      border-radius: 5px;\n      background: ", ";\n      opacity: 0;\n      transition:\n        opacity 0.3s ease-out,\n        width 0.2s,\n        height 0.2s;\n    "])), t.scrollContainerScrollBarColor);
+    },
+    visibleScrollBar: function () {
+        return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      opacity: 1;\n      transition:\n        opacity 0.1s ease-out,\n        width 0.2s,\n        height 0.2s;\n    "], ["\n      opacity: 1;\n      transition:\n        opacity 0.1s ease-out,\n        width 0.2s,\n        height 0.2s;\n    "])));
+    },
+    scrollBarInvert: function (t) {
+        return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      background: #ccc;\n      background: ", ";\n    "], ["\n      background: #ccc;\n      background: ", ";\n    "])), t.scrollContainerScrollBarInvertColor);
+    },
+    scrollBarContainerY: function () {
+        return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      position: absolute;\n      right: 2px;\n      top: 1px;\n      bottom: 1px;\n      width: 0;\n    "], ["\n      position: absolute;\n      right: 2px;\n      top: 1px;\n      bottom: 1px;\n      width: 0;\n    "])));
+    },
+    scrollBarY: function (t) {
+        return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      right: 0;\n      width: ", ";\n    "], ["\n      right: 0;\n      width: ", ";\n    "])), t.scrollContainerScrollBarSize);
+    },
+    scrollBarYHover: function (t) {
+        return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      width: ", ";\n    "], ["\n      width: ", ";\n    "])), t.scrollContainerScrollBarHoverSize);
+    },
+    scrollBarContainerX: function (t) {
+        return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      position: absolute;\n      right: 1px;\n      bottom: 1px;\n      left: 1px;\n      height: 0;\n\n      .", " ~ & {\n        margin-right: calc(", " + 3px) !important;\n      }\n\n      & ~ .", " {\n        &::after {\n          content: ' ';\n          width: 100%;\n          display: block;\n          height: calc(", " + 2px);\n        }\n      }\n    "], ["\n      position: absolute;\n      right: 1px;\n      bottom: 1px;\n      left: 1px;\n      height: 0;\n\n      .", " ~ & {\n        margin-right: calc(", " + 3px) !important;\n      }\n\n      & ~ .", " {\n        &::after {\n          content: ' ';\n          width: 100%;\n          display: block;\n          height: calc(", " + 2px);\n        }\n      }\n    "])), globalClasses.scrollbarContainerY, t.scrollContainerScrollBarHoverSize, globalClasses.inner, t.scrollContainerScrollBarHoverSize);
+    },
+    scrollBarX: function (t) {
+        return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      bottom: 0;\n      height: ", ";\n    "], ["\n      bottom: 0;\n      height: ", ";\n    "])), t.scrollContainerScrollBarSize);
+    },
+    scrollBarXHover: function (t) {
+        return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      height: ", ";\n    "], ["\n      height: ", ";\n    "])), t.scrollContainerScrollBarHoverSize);
+    },
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11;
+//# sourceMappingURL=ScrollContainer.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollContainer.styles.js","sourceRoot":"","sources":["../../../components/ScrollContainer/ScrollContainer.styles.ts"],"names":[],"mappings":";;;;AAAA,OAAO,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAGzE,MAAM,CAAC,IAAM,aAAa,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAC;IACtD,UAAU,EAAE,aAAa;IACzB,UAAU,EAAE,aAAa;IACzB,mBAAmB,EAAE,uBAAuB;IAC5C,mBAAmB,EAAE,uBAAuB;IAC5C,KAAK,EAAE,OAAO;CACf,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,MAAM,GAAG,YAAY,CAAC;IACjC,IAAI;QACF,OAAO,GAAG,oJAAA,iFAIT,KAAC;IACJ,CAAC;IAED,KAAK;QACH,OAAO,GAAG,+WAAA,4SAaT,KAAC;IACJ,CAAC;IAED,SAAS,YAAC,CAAQ;QAChB,OAAO,GAAG,gSAAA,iGAIM,EAA+B,0HAM9C,KANe,CAAC,CAAC,6BAA6B,EAM7C;IACJ,CAAC;IAED,gBAAgB;QACd,OAAO,GAAG,4LAAA,yHAMT,KAAC;IACJ,CAAC;IAED,eAAe,YAAC,CAAQ;QACtB,OAAO,GAAG,6HAAA,+CAEM,EAAqC,SACpD,KADe,CAAC,CAAC,mCAAmC,EACnD;IACJ,CAAC;IAED,mBAAmB;QACjB,OAAO,GAAG,+KAAA,4GAMT,KAAC;IACJ,CAAC;IAED,UAAU,YAAC,CAAQ;QACjB,OAAO,GAAG,gHAAA,kCAEC,EAA8B,SACxC,KADU,CAAC,CAAC,4BAA4B,EACvC;IACJ,CAAC;IAED,eAAe,YAAC,CAAQ;QACtB,OAAO,GAAG,+FAAA,iBACC,EAAmC,SAC7C,KADU,CAAC,CAAC,iCAAiC,EAC5C;IACJ,CAAC;IAED,mBAAmB,YAAC,CAAQ;QAC1B,OAAO,GAAG,ibAAA,mHAOL,EAAiC,qCACb,EAAmC,6CAGnD,EAAmB,6HAKP,EAAmC,oCAGvD,KAZI,aAAa,CAAC,mBAAmB,EACb,CAAC,CAAC,iCAAiC,EAGnD,aAAa,CAAC,KAAK,EAKP,CAAC,CAAC,iCAAiC,EAGtD;IACJ,CAAC;IAED,UAAU,YAAC,CAAQ;QACjB,OAAO,GAAG,oHAAA,oCAEE,EAA8B,SACzC,KADW,CAAC,CAAC,4BAA4B,EACxC;IACJ,CAAC;IAED,eAAe,YAAC,CAAQ;QACtB,OAAO,GAAG,kGAAA,kBACE,EAAmC,SAC9C,KADW,CAAC,CAAC,iCAAiC,EAC7C;IACJ,CAAC;CACF,CAAC,CAAC","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nexport const globalClasses = prefix('scroll-container')({\n  scrollbarX: 'scrollbar-x',\n  scrollbarY: 'scrollbar-y',\n  scrollbarContainerX: 'scrollbar-container-x',\n  scrollbarContainerY: 'scrollbar-container-y',\n  inner: 'inner',\n});\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      height: 100%;\n      overflow: hidden;\n      position: relative;\n    `;\n  },\n\n  inner() {\n    return css`\n      position: relative;\n      overflow: scroll;\n      height: 100%;\n      width: 100%;\n\n      /* Hide scrobars without losing functionality */\n      scrollbar-width: none;\n      -ms-overflow-style: none;\n      &::-webkit-scrollbar {\n        width: 0;\n        height: 0;\n      }\n    `;\n  },\n\n  scrollBar(t: Theme) {\n    return css`\n      position: absolute;\n      z-index: 200;\n      border-radius: 5px;\n      background: ${t.scrollContainerScrollBarColor};\n      opacity: 0;\n      transition:\n        opacity 0.3s ease-out,\n        width 0.2s,\n        height 0.2s;\n    `;\n  },\n\n  visibleScrollBar() {\n    return css`\n      opacity: 1;\n      transition:\n        opacity 0.1s ease-out,\n        width 0.2s,\n        height 0.2s;\n    `;\n  },\n\n  scrollBarInvert(t: Theme) {\n    return css`\n      background: #ccc;\n      background: ${t.scrollContainerScrollBarInvertColor};\n    `;\n  },\n\n  scrollBarContainerY() {\n    return css`\n      position: absolute;\n      right: 2px;\n      top: 1px;\n      bottom: 1px;\n      width: 0;\n    `;\n  },\n\n  scrollBarY(t: Theme) {\n    return css`\n      right: 0;\n      width: ${t.scrollContainerScrollBarSize};\n    `;\n  },\n\n  scrollBarYHover(t: Theme) {\n    return css`\n      width: ${t.scrollContainerScrollBarHoverSize};\n    `;\n  },\n\n  scrollBarContainerX(t: Theme) {\n    return css`\n      position: absolute;\n      right: 1px;\n      bottom: 1px;\n      left: 1px;\n      height: 0;\n\n      .${globalClasses.scrollbarContainerY} ~ & {\n        margin-right: calc(${t.scrollContainerScrollBarHoverSize} + 3px) !important;\n      }\n\n      & ~ .${globalClasses.inner} {\n        &::after {\n          content: ' ';\n          width: 100%;\n          display: block;\n          height: calc(${t.scrollContainerScrollBarHoverSize} + 2px);\n        }\n      }\n    `;\n  },\n\n  scrollBarX(t: Theme) {\n    return css`\n      bottom: 0;\n      height: ${t.scrollContainerScrollBarSize};\n    `;\n  },\n\n  scrollBarXHover(t: Theme) {\n    return css`\n      height: ${t.scrollContainerScrollBarHoverSize};\n    `;\n  },\n});\n"]}

package/components/ScrollContainer/__creevey__/ScrollContainer.creevey.d.mts

@@ -1 +1 @@
-export {};
+export {};