"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _react = _interopRequireWildcard(require("react"));

var _reactIntersectionObserver = require("react-intersection-observer");

var _mobxReactLite = require("mobx-react-lite");

var _TableContext = _interopRequireDefault(require("./TableContext"));

var _TableHeaderCell = _interopRequireDefault(require("./TableHeaderCell"));

var TableVirtualHeaderCell = function TableVirtualHeaderCell(props) {
  var columnGroup = props.columnGroup;

  var _useContext = (0, _react.useContext)(_TableContext["default"]),
      tableStore = _useContext.tableStore;

  var _useInView = (0, _reactIntersectionObserver.useInView)({
    root: tableStore.node.wrapper,
    rootMargin: '100px',
    initialInView: true
  }),
      ref = _useInView.ref,
      inView = _useInView.inView;

  (0, _react.useEffect)(function () {
    columnGroup.setInView(inView);
    return function () {
      if (columnGroup.inView !== undefined) {
        columnGroup.setInView(undefined);
      }
    };
  }, [columnGroup, inView]);
  return /*#__PURE__*/_react["default"].createElement(_TableHeaderCell["default"], (0, _extends2["default"])({}, props, {
    intersectionRef: ref
  }));
};

TableVirtualHeaderCell.displayName = 'TableVirtualHeaderCell';

var _default = (0, _mobxReactLite.observer)(TableVirtualHeaderCell);

exports["default"] = _default;
//# sourceMappingURL=TableVirtualHeaderCell.js.map
