UNPKG

@angular/material

Version:
29 lines (27 loc) 11.4 kB
!function(r,a){"object"==typeof exports&&"undefined"!=typeof module?a(exports,require("@angular/core"),require("@angular/common"),require("@angular/material/core"),require("@angular/cdk/coercion"),require("@angular/platform-browser/animations"),require("rxjs"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("@angular/material/progress-bar",["exports","@angular/core","@angular/common","@angular/material/core","@angular/cdk/coercion","@angular/platform-browser/animations","rxjs","rxjs/operators"],a):a(((r=r||self).ng=r.ng||{},r.ng.material=r.ng.material||{},r.ng.material.progressBar={}),r.ng.core,r.ng.common,r.ng.material.core,r.ng.cdk.coercion,r.ng.platformBrowser.animations,r.rxjs,r.rxjs.operators)}(this,(function(r,a,e,t,n,o,i,s){"use strict"; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */var m=function(r,a){return(m=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(r,a){r.__proto__=a}||function(r,a){for(var e in a)a.hasOwnProperty(e)&&(r[e]=a[e])})(r,a)},p=t.mixinColor((function l(r){this._elementRef=r}),"primary"),c=new a.InjectionToken("mat-progress-bar-location",{providedIn:"root",factory:b});function b(){var r=a.inject(e.DOCUMENT),t=r?r.location:null;return{getPathname:function(){return t?t.pathname+t.search:""}}}var g=0,u=function(r){function e(e,t,n,o){var s=r.call(this,e)||this;s._elementRef=e,s._ngZone=t,s._animationMode=n,s._isNoopAnimation=!1,s._value=0,s._bufferValue=0,s.animationEnd=new a.EventEmitter,s._animationEndSubscription=i.Subscription.EMPTY,s.mode="determinate",s.progressbarId="mat-progress-bar-"+g++;var m=o?o.getPathname().split("#")[0]:"";return s._rectangleFillValue="url('"+m+"#"+s.progressbarId+"')",s._isNoopAnimation="NoopAnimations"===n,s}return function t(r,a){function e(){this.constructor=r}m(r,a),r.prototype=null===a?Object.create(a):(e.prototype=a.prototype,new e)}(e,r),Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(r){this._value=f(n.coerceNumberProperty(r)||0)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"bufferValue",{get:function(){return this._bufferValue},set:function(r){this._bufferValue=f(r||0)},enumerable:!0,configurable:!0}),e.prototype._primaryTransform=function(){return{transform:"scaleX("+this.value/100+")"}},e.prototype._bufferTransform=function(){return"buffer"===this.mode?{transform:"scaleX("+this.bufferValue/100+")"}:null},e.prototype.ngAfterViewInit=function(){var r=this;this._ngZone.runOutsideAngular((function(){var a=r._primaryValueBar.nativeElement;r._animationEndSubscription=i.fromEvent(a,"transitionend").pipe(s.filter((function(r){return r.target===a}))).subscribe((function(){"determinate"!==r.mode&&"buffer"!==r.mode||r._ngZone.run((function(){return r.animationEnd.next({value:r.value})}))}))}))},e.prototype.ngOnDestroy=function(){this._animationEndSubscription.unsubscribe()},e.decorators=[{type:a.Component,args:[{selector:"mat-progress-bar",exportAs:"matProgressBar",host:{role:"progressbar","aria-valuemin":"0","aria-valuemax":"100","[attr.aria-valuenow]":'(mode === "indeterminate" || mode === "query") ? null : value',"[attr.mode]":"mode",class:"mat-progress-bar","[class._mat-animation-noopable]":"_isNoopAnimation"},inputs:["color"],template:'\x3c!--\n The background div is named as such because it appears below the other divs and is not sized based\n on values.\n--\x3e\n<svg width="100%" height="4" focusable="false" class="mat-progress-bar-background mat-progress-bar-element">\n <defs>\n <pattern [id]="progressbarId" x="4" y="0" width="8" height="4" patternUnits="userSpaceOnUse">\n <circle cx="2" cy="2" r="2"/>\n </pattern>\n </defs>\n <rect [attr.fill]="_rectangleFillValue" width="100%" height="100%"/>\n</svg>\n<div class="mat-progress-bar-buffer mat-progress-bar-element" [ngStyle]="_bufferTransform()"></div>\n<div class="mat-progress-bar-primary mat-progress-bar-fill mat-progress-bar-element" [ngStyle]="_primaryTransform()" #primaryValueBar></div>\n<div class="mat-progress-bar-secondary mat-progress-bar-fill mat-progress-bar-element"></div>\n',changeDetection:a.ChangeDetectionStrategy.OnPush,encapsulation:a.ViewEncapsulation.None,styles:['.mat-progress-bar{display:block;height:4px;overflow:hidden;position:relative;transition:opacity 250ms linear;width:100%}._mat-animation-noopable.mat-progress-bar{transition:none;animation:none}.mat-progress-bar .mat-progress-bar-element,.mat-progress-bar .mat-progress-bar-fill::after{height:100%;position:absolute;width:100%}.mat-progress-bar .mat-progress-bar-background{width:calc(100% + 10px)}.cdk-high-contrast-active .mat-progress-bar .mat-progress-bar-background{display:none}.mat-progress-bar .mat-progress-bar-buffer{transform-origin:top left;transition:transform 250ms ease}.cdk-high-contrast-active .mat-progress-bar .mat-progress-bar-buffer{border-top:solid 5px;opacity:.5}.mat-progress-bar .mat-progress-bar-secondary{display:none}.mat-progress-bar .mat-progress-bar-fill{animation:none;transform-origin:top left;transition:transform 250ms ease}.cdk-high-contrast-active .mat-progress-bar .mat-progress-bar-fill{border-top:solid 4px}.mat-progress-bar .mat-progress-bar-fill::after{animation:none;content:"";display:inline-block;left:0}.mat-progress-bar[dir=rtl],[dir=rtl] .mat-progress-bar{transform:rotateY(180deg)}.mat-progress-bar[mode=query]{transform:rotateZ(180deg)}.mat-progress-bar[mode=query][dir=rtl],[dir=rtl] .mat-progress-bar[mode=query]{transform:rotateZ(180deg) rotateY(180deg)}.mat-progress-bar[mode=indeterminate] .mat-progress-bar-fill,.mat-progress-bar[mode=query] .mat-progress-bar-fill{transition:none}.mat-progress-bar[mode=indeterminate] .mat-progress-bar-primary,.mat-progress-bar[mode=query] .mat-progress-bar-primary{-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:mat-progress-bar-primary-indeterminate-translate 2000ms infinite linear;left:-145.166611%}.mat-progress-bar[mode=indeterminate] .mat-progress-bar-primary.mat-progress-bar-fill::after,.mat-progress-bar[mode=query] .mat-progress-bar-primary.mat-progress-bar-fill::after{-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:mat-progress-bar-primary-indeterminate-scale 2000ms infinite linear}.mat-progress-bar[mode=indeterminate] .mat-progress-bar-secondary,.mat-progress-bar[mode=query] .mat-progress-bar-secondary{-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:mat-progress-bar-secondary-indeterminate-translate 2000ms infinite linear;left:-54.888891%;display:block}.mat-progress-bar[mode=indeterminate] .mat-progress-bar-secondary.mat-progress-bar-fill::after,.mat-progress-bar[mode=query] .mat-progress-bar-secondary.mat-progress-bar-fill::after{-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:mat-progress-bar-secondary-indeterminate-scale 2000ms infinite linear}.mat-progress-bar[mode=buffer] .mat-progress-bar-background{-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:mat-progress-bar-background-scroll 250ms infinite linear;display:block}.mat-progress-bar._mat-animation-noopable .mat-progress-bar-fill,.mat-progress-bar._mat-animation-noopable .mat-progress-bar-fill::after,.mat-progress-bar._mat-animation-noopable .mat-progress-bar-buffer,.mat-progress-bar._mat-animation-noopable .mat-progress-bar-primary,.mat-progress-bar._mat-animation-noopable .mat-progress-bar-primary.mat-progress-bar-fill::after,.mat-progress-bar._mat-animation-noopable .mat-progress-bar-secondary,.mat-progress-bar._mat-animation-noopable .mat-progress-bar-secondary.mat-progress-bar-fill::after,.mat-progress-bar._mat-animation-noopable .mat-progress-bar-background{animation:none;transition-duration:1ms}@keyframes mat-progress-bar-primary-indeterminate-translate{0%{transform:translateX(0)}20%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(0)}59.15%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(83.67142%)}100%{transform:translateX(200.611057%)}}@keyframes mat-progress-bar-primary-indeterminate-scale{0%{transform:scaleX(0.08)}36.65%{animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);transform:scaleX(0.08)}69.15%{animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);transform:scaleX(0.661479)}100%{transform:scaleX(0.08)}}@keyframes mat-progress-bar-secondary-indeterminate-translate{0%{animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);transform:translateX(0)}25%{animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);transform:translateX(37.651913%)}48.35%{animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);transform:translateX(84.386165%)}100%{transform:translateX(160.277782%)}}@keyframes mat-progress-bar-secondary-indeterminate-scale{0%{animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);transform:scaleX(0.08)}19.15%{animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);transform:scaleX(0.457104)}44.15%{animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);transform:scaleX(0.72796)}100%{transform:scaleX(0.08)}}@keyframes mat-progress-bar-background-scroll{to{transform:translateX(-8px)}}\n']}]}],e.ctorParameters=function(){return[{type:a.ElementRef},{type:a.NgZone},{type:String,decorators:[{type:a.Optional},{type:a.Inject,args:[o.ANIMATION_MODULE_TYPE]}]},{type:void 0,decorators:[{type:a.Optional},{type:a.Inject,args:[c]}]}]},e.propDecorators={value:[{type:a.Input}],bufferValue:[{type:a.Input}],_primaryValueBar:[{type:a.ViewChild,args:["primaryValueBar"]}],animationEnd:[{type:a.Output}],mode:[{type:a.Input}]},e}(p);function f(r,a,e){return void 0===a&&(a=0),void 0===e&&(e=100),Math.max(a,Math.min(e,r))} /** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */var d=function(){function r(){}return r.decorators=[{type:a.NgModule,args:[{imports:[e.CommonModule,t.MatCommonModule],exports:[u,t.MatCommonModule],declarations:[u]}]}],r}(); /** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */r.MAT_PROGRESS_BAR_LOCATION=c,r.MAT_PROGRESS_BAR_LOCATION_FACTORY=b,r.MatProgressBar=u,r.MatProgressBarModule=d,Object.defineProperty(r,"__esModule",{value:!0})}));