azure-devops-ui
Version:
React components for building web UI in Azure DevOps
1 lines • 2.54 kB
JavaScript
import{__extends}from"tslib";import"../../CommonImports";import"../../Core/core.css";import"./ProgressBar.css";import*as React from"react";import{ObservableLike}from"../../Core/Observable";import{TimerManagement}from"../../Core/TimerManagement";import{Observer}from"../../Observer";import{css}from"../../Util";var IndeterminateProgressBar=function(r){function e(e){var t=r.call(this,e)||this;return t.timerManagement=new TimerManagement,t.transitionDurations=350,t.randomize25=function(e){return.25*(Math.random()*e*2+(1-e))},t.randomize75=function(e){return.75*(Math.random()*e*2+(1-e))},t.asymptoticApproach=function(e){return 1-1/Math.sqrt(e+1)},t.done=function(){t.state.progress!==1/0&&t.setState({progress:1/0})},t.increment=function(){t.state.progress!==1/0&&t.setState({progress:t.state.progress+t.randomize25(1)})},t.reset=function(){0!==t.state.progress&&t.setState({progress:0})},t.shouldRun=function(){return null!=t.props.loading},t.updateProgress=function(e){e?t.reset():t.done()},t.state={progress:0},t}return __extends(e,r),Object.defineProperty(e.prototype,"transitionDuration",{get:function(){return this.state.progress?this.transitionDurations:0},enumerable:!1,configurable:!0}),e.prototype.render=function(){var e=this;return React.createElement(Observer,{loading:{observableValue:this.props.loading,filter:this.updateProgress}},function(){return React.createElement("span",{className:css(e.props.className,"bolt-progress-bar-container flex-row flex-noshrink flex-grow scroll-hidden")},React.createElement("span",{className:css(e.props.progressBarClassName,"bolt-progress-bar-bar",e.state.progress===1/0&&"complete"),style:{transform:"scaleX(".concat(e.asymptoticApproach(e.state.progress),")")}}))})},e.prototype.componentDidMount=function(){this.shouldRun()&&this.scheduleUpdate(this.increment,0,!1)},e.prototype.componentDidUpdate=function(e){var t=this;this.shouldRun()&&(this.state.progress==1/0?this.props.loadingAnimationComplete&&this.timerManagement.setTimeout(function(){t.props.loadingAnimationComplete&&t.props.loadingAnimationComplete()},this.transitionDuration):this.scheduleUpdate(this.increment,this.transitionDuration,!1)),void 0===this.props.loading?this.reset():void 0!==e.loading&&!ObservableLike.getValue(e.loading)||ObservableLike.getValue(this.props.loading)||this.done()},e.prototype.componentWillUnmount=function(){this.timerManagement.dispose()},e.prototype.scheduleUpdate=function(e,t,r){this.timerManagement.setTimeout(function(){e()},t)},e}(React.PureComponent);export{IndeterminateProgressBar};