"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.StickyDataTids = exports.Sticky = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
var _shallowequal = _interopRequireDefault(require("shallowequal"));
var _globalObject = require("@skbkontur/global-object");

var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));

var _utils = require("../../lib/utils");
var _ZIndex = require("../../internal/ZIndex");

var _CommonWrapper = require("../../internal/CommonWrapper");
var _Emotion = require("../../lib/theming/Emotion");

var _rootNode = require("../../lib/rootNode");
var _getDOMRect3 = require("../../lib/dom/getDOMRect");
var _createPropsGetter = require("../../lib/createPropsGetter");

var _featureFlagsContext = require("../../lib/featureFlagsContext");

var _Sticky2 = require("./Sticky.styles");var _class, _Sticky;

var MAX_REFLOW_RETRIES = 5;


























var StickyDataTids = exports.StickyDataTids = {
  root: 'Sticky__root'
};



/**
 * `Sticky` позволяет закреплять элемент интерфейса в определенной позиции на экране при прокрутке страницы.
 * Это полезно для создания "прилипающих" элементов, которые остаются видимыми при прокрутке содержимого.
 */var

Sticky = exports.Sticky = (0, _rootNode.rootNode)(_class = (_Sticky = /*#__PURE__*/function (_React$Component) {function Sticky() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.





    getProps = (0, _createPropsGetter.createPropsGetter)(Sticky.defaultProps);_this.

    state = {
      fixed: false,
      deltaHeight: 0,
      stopped: false,
      relativeTop: 0
    };_this.



    layoutSubscription = { remove: null };_this.
    reflowCounter = 0;_this.

















































































    refWrapper = function (ref) {return _this.wrapper = ref;};_this.

    refInner = function (ref) {return _this.inner = ref;};

    /**
     * Пересчитать габариты и позицию залипшего элемента
     *
     * @public
     */_this.
    reflow = function () {var _globalObject$documen;
      if (!((_globalObject$documen = _globalObject.globalObject.document) != null && _globalObject$documen.documentElement)) {
        throw Error('There is no "documentElement" in document');
      }

      var windowHeight = _globalObject.globalObject.innerHeight || _globalObject.globalObject.document.documentElement.clientHeight;
      if (!_this.wrapper || !_this.inner) {
        return;
      }
      var _getDOMRect = (0, _getDOMRect3.getDOMRect)(_this.wrapper),top = _getDOMRect.top,bottom = _getDOMRect.bottom,left = _getDOMRect.left,width = _getDOMRect.width;
      var _getDOMRect2 = (0, _getDOMRect3.getDOMRect)(_this.inner),height = _getDOMRect2.height;
      var _this$props = _this.props,getStop = _this$props.getStop,side = _this$props.side;
      var _this$state = _this.state,prevFixed = _this$state.fixed,_this$state$height = _this$state.height,prevHeight = _this$state$height === void 0 ? height : _this$state$height;
      var offset = _this.getProps().offset;
      var fixed = side === 'top' ? Math.ceil(top) < offset : Math.floor(bottom) > windowHeight - offset;

      _this.setState({ fixed: fixed, left: left });

      if (fixed && !prevFixed) {
        _this.setState({ width: width, height: height });
      }

      if (fixed) {
        _this.setState({ width: width });
        var stop = getStop && getStop();
        if (stop) {
          var deltaHeight = prevHeight - height;
          var stopRect = (0, _getDOMRect3.getDOMRect)(stop);
          var outerHeight = height + offset;
          var stopped = false;
          var relativeTop = 0;

          if (side === 'top') {
            stopped = stopRect.top - outerHeight < 0;
            relativeTop = stopRect.top - prevHeight - top;
          } else {
            stopped = stopRect.bottom + outerHeight > windowHeight;
            relativeTop = stopRect.bottom - top;
          }

          _this.setState({ relativeTop: relativeTop, deltaHeight: deltaHeight, stopped: stopped });
        }
      }
    };return _this;}(0, _inheritsLoose2.default)(Sticky, _React$Component);var _proto = Sticky.prototype;_proto.componentDidMount = function componentDidMount() {this.reflow();this.layoutSubscription = LayoutEvents.addListener(this.reflow);};_proto.componentWillUnmount = function componentWillUnmount() {if (this.layoutSubscription.remove) {this.layoutSubscription.remove();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {if (!(0, _shallowequal.default)(prevProps, this.props) || !(0, _shallowequal.default)(prevState, this.state)) {if (this.reflowCounter < MAX_REFLOW_RETRIES) {this.featureFlags.stickyReduceLayoutEvents ? this.reflow() : LayoutEvents.emit();this.reflowCounter += 1;return;}}this.reflowCounter = 0;};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_featureFlagsContext.ReactUIFeatureFlagsContext.Consumer, null, function (flags) {_this2.featureFlags = (0, _featureFlagsContext.getFullReactUIFlagsContext)(flags);return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx;var children = this.props.children;var side = this.props.side;var offset = this.getProps().offset;var _this$state2 = this.state,fixed = _this$state2.fixed,stopped = _this$state2.stopped,relativeTop = _this$state2.relativeTop,deltaHeight = _this$state2.deltaHeight,width = _this$state2.width,height = _this$state2.height,left = _this$state2.left;var innerStyle = {};if (fixed) {if (stopped) {innerStyle.top = relativeTop;innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;} else {innerStyle.width = width;innerStyle[side] = offset;innerStyle.left = left;}}if ((0, _utils.isFunction)(children)) {children = children(fixed);}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("div", { "data-tid": StickyDataTids.root, ref: this.refWrapper, className: _Sticky2.styles.wrapper() }, /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: "Sticky", applyZIndex: fixed, className: (0, _Emotion.cx)(_Sticky2.styles.inner(), (_cx = {}, _cx[_Sticky2.styles.fixed()] = fixed && !stopped, _cx[_Sticky2.styles.stopped()] = stopped, _cx)), style: innerStyle, wrapperRef: this.refInner }, /*#__PURE__*/_react.default.createElement("div", { className: _Sticky2.styles.container() }, children)), fixed && !stopped ? /*#__PURE__*/_react.default.createElement("div", { style: { width: width, height: height } }) : null));};return Sticky;}(_react.default.Component), _Sticky.__KONTUR_REACT_UI__ = 'Sticky', _Sticky.displayName = 'Sticky', _Sticky.defaultProps = { offset: 0 }, _Sticky)) || _class;