azure-devops-ui/Components/Intersection/Intersection.min.js

React components for building web UI in Azure DevOps

import{__assign,__extends}from"tslib";import"../../CommonImports";import"../../Core/core.css";import*as React from"react";import{createMergedRef}from"../../Util";for(var defaultThreshold=[],index=0;index<=100;index++)defaultThreshold.push(index/100);var IntersectionContextImpl=function(){function t(){var n=this;this.callbacks=[],this.pending=[],this.rootMargin=0,this.root=document.body,this.onIntersect=function(t){if(n.observer)for(var e=0,o=n.callbacks;e<o.length;e++)(0,o[e])(t,n.observer)}}return t.prototype.connect=function(t,e,o){void 0===e&&(e=0),void 0===o&&(o=defaultThreshold),this.observer=new IntersectionObserver(this.onIntersect,{root:t,rootMargin:e+"px",threshold:o}),this.rootMargin=e,this.root=t;for(var n=0,r=this.pending;n<r.length;n++){var s=r[n];this.observer.observe(s)}},t.prototype.disconnect=function(){this.observer&&this.observer.disconnect()},t.prototype.observe=function(t){this.observer?this.observer.observe(t):this.pending.push(t)},t.prototype.register=function(t){this.callbacks.push(t)},t.prototype.unobserve=function(t){var e=this.pending.indexOf(t);0<=e&&this.pending.splice(e,1),this.observer&&this.observer.unobserve(t)},t.prototype.unregister=function(t){t=this.callbacks.indexOf(t);0<=t&&this.callbacks.splice(t,1)},t}(),IntersectionContext=React.createContext(new IntersectionContextImpl),Intersection=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.mergedRef=createMergedRef(),e.rootElement=React.createRef(),e.state=new IntersectionContextImpl,e.onScroll=function(t){e.state.onIntersect([])},e}return __extends(e,t),e.prototype.render=function(){var e=this,o=React.Children.only(this.props.children),t=o.props.onScroll?function(t){o.props.onScroll&&o.props.onScroll(t),e.onScroll(t)}:this.onScroll;return React.createElement(IntersectionContext.Provider,{value:this.state},React.cloneElement(o,__assign(__assign({},o.props),{ref:this.mergedRef(this.rootElement,o.ref),onScroll:t}),o.props.children))},e.prototype.componentDidMount=function(){var t=this.props,e=t.observationElement,t=t.rootElement,o=null;t?(o="string"==typeof t?document.querySelector(t):"function"==typeof t?t():t)&&(o.addEventListener("scroll",this.onScroll),this.externalElement=o):this.rootElement&&(o=this.rootElement.current),o&&(this.state.connect(o,this.props.rootMargin,this.props.threshold),this.props.onIntersect&&this.state.register(this.props.onIntersect),e)&&(t=void 0,t="string"==typeof e?document.querySelector(e):"function"==typeof e?e():e)&&this.state.observe(t)},e.prototype.componentWillUnmount=function(){this.externalElement&&this.externalElement.removeEventListener("scroll",this.onScroll),this.state.disconnect()},e}(React.Component);export{IntersectionContext,Intersection};