import _useObserve from "parsec-hooks/lib/observeHooks";
import React, { useEffect, useRef } from 'react';
import { View } from 'remax/one';
export default (function (_ref) {
  var children = _ref.children,
      className = _ref.className,
      onHidden = _ref.onHidden,
      onVisible = _ref.onVisible;
  var ref = useRef(null);

  var visible = _useObserve(ref);

  useEffect(function () {
    if (visible) {
      onVisible === null || onVisible === void 0 ? void 0 : onVisible();
    } else {
      onHidden === null || onHidden === void 0 ? void 0 : onHidden();
    }
  }, [visible, onVisible, onHidden]);
  return /*#__PURE__*/React.createElement("div", {
    ref: ref,
    className: className
  }, children || /*#__PURE__*/React.createElement(View, {
    style: {
      height: '1px',
      width: '1px'
    }
  }));
});