'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _extends = require('@babel/runtime/helpers/extends');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var ErrorCatch = require('@prom-ui/core/ErrorCatch');
var useInView = require('@prom-ui/core/useInView');

function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }

function _interopNamespaceCompat(e) {
    if (e && typeof e === 'object' && 'default' in e) return e;
    var n = Object.create(null);
    if (e) {
        Object.keys(e).forEach(function (k) {
            if (k !== 'default') {
                var d = Object.getOwnPropertyDescriptor(e, k);
                Object.defineProperty(n, k, d.get ? d : {
                    enumerable: true,
                    get: function () { return e[k]; }
                });
            }
        });
    }
    n.default = e;
    return Object.freeze(n);
}

var _extends__default = /*#__PURE__*/_interopDefaultCompat(_extends);
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultCompat(_objectWithoutProperties);
var React__namespace = /*#__PURE__*/_interopNamespaceCompat(React);

var _excluded = ["isActive", "children", "fallback", "onChange", "rootMargin"],
  _excluded2 = ["errorCatchName"];
var ViewportApp = function ViewportApp(_ref) {
  var _ref$isActive = _ref.isActive,
    isActive = _ref$isActive === void 0 ? true : _ref$isActive,
    children = _ref.children,
    fallback = _ref.fallback,
    onChange = _ref.onChange,
    _ref$rootMargin = _ref.rootMargin,
    rootMargin = _ref$rootMargin === void 0 ? '40% 0px' : _ref$rootMargin,
    props = _objectWithoutProperties__default.default(_ref, _excluded);
  var _useInView = useInView.useInView({
      triggerOnce: true,
      skip: !isActive,
      rootMargin: rootMargin,
      onChange: onChange
    }),
    ref = _useInView.ref,
    inView = _useInView.inView;
  if (!isActive || inView) {
    return children;
  }
  return /*#__PURE__*/React__namespace.createElement("div", _extends__default.default({
    style: {
      minHeight: 1
    },
    "data-qaid": "viewport",
    "data-testid": "viewport"
  }, props, {
    ref: ref
  }), fallback);
};
var Viewport = function Viewport(_ref2) {
  var _ref2$errorCatchName = _ref2.errorCatchName,
    errorCatchName = _ref2$errorCatchName === void 0 ? 'Viewport' : _ref2$errorCatchName,
    props = _objectWithoutProperties__default.default(_ref2, _excluded2);
  return /*#__PURE__*/React__namespace.createElement(ErrorCatch.ErrorCatch, {
    name: errorCatchName
  }, /*#__PURE__*/React__namespace.createElement(ViewportApp, props));
};
Viewport.displayName = 'Viewport';

exports.Viewport = Viewport;
