UNPKG

@netdata/netdata-ui

Version:

netdata UI kit

53 lines 2.45 kB
var _excluded = ["height", "width", "fallback", "root", "rootMargin", "threshold", "onVisibility", "children", "ref"]; function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; } import React, { useRef } from "react"; import usePrevious from "../../hooks/usePrevious"; import Flex from "../templates/flex"; import useIntersection from "../../hooks/useIntersection"; import setParentRef from "../../mixins/set-ref"; var getContent = function getContent(value) { return typeof value === "function" ? value() : value; }; var Intersection = function Intersection(_ref) { var _ref$height = _ref.height, height = _ref$height === void 0 ? "100%" : _ref$height, _ref$width = _ref.width, width = _ref$width === void 0 ? "100%" : _ref$width, _ref$fallback = _ref.fallback, fallback = _ref$fallback === void 0 ? null : _ref$fallback, root = _ref.root, _ref$rootMargin = _ref.rootMargin, rootMargin = _ref$rootMargin === void 0 ? "0px" : _ref$rootMargin, _ref$threshold = _ref.threshold, threshold = _ref$threshold === void 0 ? 0 : _ref$threshold, onVisibility = _ref.onVisibility, children = _ref.children, parentRef = _ref.ref, rest = _objectWithoutPropertiesLoose(_ref, _excluded); var _useIntersection = useIntersection({ root: root, rootMargin: rootMargin, threshold: threshold, onVisibility: onVisibility }), setRef = _useIntersection[0], ref = _useIntersection[1], visible = _useIntersection[2]; var prevVisible = usePrevious(visible); var lastHeightRef = useRef(height); if (visible !== prevVisible && !visible && ref.current) { lastHeightRef.current = ref.current.clientHeight + "px"; } return /*#__PURE__*/React.createElement(Flex, _extends({ ref: function ref(element) { setRef(element); setParentRef(parentRef, element); }, width: width, height: visible ? height : { min: lastHeightRef.current } }, rest), getContent(visible ? children : fallback)); }; export default Intersection;