@progress/kendo-angular-progressbar 3.1.2-dev.202210121050 → 3.1.2-dev.202211080935

package/bundles/kendo-angular-progressbar.umd.js

@@ -2,4 +2,4 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-l10n"),require("@progress/kendo-angular-common"),require("@angular/common"),require("rxjs"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("KendoAngularProgressbar",["exports","@angular/core","@progress/kendo-licensing","@progress/kendo-angular-l10n","@progress/kendo-angular-common","@angular/common","rxjs","rxjs/operators"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularProgressbar={},e.ng.core,e.KendoLicensing,e.KendoAngularL10N,e.KendoAngularCommon,e.ng.common,e.rxjs,e.rxjs.operators)}(this,function(e,a,i,t,n,r,o,l){"use strict";function s(r){var s;return r&&r.__esModule?r:(s=Object.create(null),r&&Object.keys(r).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(r,e),Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:function(){return r[e]}}))}),s.default=r,Object.freeze(s))}var p=s(a),u=s(t),c=s(n),h=s(r),g=function(e,t){return(g=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}))(e,t)};function m(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}g(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}Object.create;Object.create;function d(e,t,r,s){var n,i,a,o,l=1===(n=e.toString().split(".")).length?""+n[0]:n[0]+"."+n[1].substr(0,S);if("boolean"!=typeof s){if("string"!=typeof s.format)return"function"==typeof s.format?s.format(e):l;switch(s.format){case"value":return l;case"percent":return Math.floor((i=e,a=t,o=Math.abs((r-a)/100),Math.abs((i-a)/o)))+"%";default:return l}}return l}function y(e,t,r){return Math.max(Math.min(r,t),e)}function f(e,t,r){return Math.max((r-e)/(t-e),1e-4)}function b(e,t,r){return e[t]&&void 0!==e[t].currentValue?e[t].currentValue:r}function v(e,t){e.forEach(function(e){t[e.method](e.el,e.attr,""+e.attrValue)})}function C(e){return e.style.width&&e.style.height}var k={name:"@progress/kendo-angular-progressbar",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1665571783,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},S=3,P=(Object.defineProperty(V.prototype,"isHorizontal",{get:function(){return"horizontal"===this.orientation},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"isVertical",{get:function(){return"vertical"===this.orientation},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"disabledClass",{get:function(){return this.disabled},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"reverseClass",{get:function(){return this.reverse},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"indeterminateClass",{get:function(){return this.indeterminate},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"dirAttribute",{get:function(){return this.direction},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"ariaMinAttribute",{get:function(){return String(this.min)},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"ariaMaxAttribute",{get:function(){return String(this.max)},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"ariaValueAttribute",{get:function(){return this.indeterminate?void 0:String(this.displayValue)},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"isCompleted",{get:function(){return this.value===this.max},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"statusWidth",{get:function(){return"horizontal"===this.orientation?100*this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"statusHeight",{get:function(){return"vertical"===this.orientation?100*this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"statusWrapperWidth",{get:function(){return"horizontal"===this.orientation?100/this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"statusWrapperHeight",{get:function(){return"vertical"===this.orientation?100/this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(V.prototype,"_progressRatio",{get:function(){return f(this.min,this.max,this.displayValue)},enumerable:!1,configurable:!0}),V.prototype.ngOnChanges=function(e){var t=b(e,"min",this.min),r=b(e,"max",this.max),s=b(e,"value",this.value);if(e.min||e.max||e.value){if(e.min||e.max){var n=t,i=r;if(a.isDevMode&&i<n)throw new Error("The max value should be greater than the min.")}e.value&&(null!=s&&!Number.isNaN(s)||(this.value=t),i=this.displayValue,this.displayValue=y(this.min,this.max,s),this.previousValue=i),this.min=t,this.max=r,this.displayValue=y(this.min,this.max,s)}},V.prototype.ngOnDestroy=function(){this.localizationChangeSubscription&&this.localizationChangeSubscription.unsubscribe()},V);function V(e){var t=this;this.localization=e,this.widgetClasses=!0,this.roleAttribute="progressbar",this.max=100,this.min=0,this.value=0,this.orientation="horizontal",this.disabled=!1,this.reverse=!1,this.indeterminate=!1,this.displayValue=0,this.previousValue=0,i.validatePackage(k),this.localizationChangeSubscription=e.changes.subscribe(function(e){e=e.rtl;t.direction=e?"rtl":"ltr"})}P.ɵfac=p.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:P,deps:[{token:u.LocalizationService}],target:p.ɵɵFactoryTarget.Component}),P.ɵcmp=p.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:P,selector:"ng-component",inputs:{max:"max",min:"min",value:"value",orientation:"orientation",disabled:"disabled",reverse:"reverse",indeterminate:"indeterminate"},host:{properties:{"class.k-widget":"this.widgetClasses","class.k-progressbar":"this.widgetClasses","class.k-progressbar-horizontal":"this.isHorizontal","class.k-progressbar-vertical":"this.isVertical","class.k-disabled":"this.disabledClass","class.k-progressbar-reverse":"this.reverseClass","class.k-progressbar-indeterminate":"this.indeterminateClass","attr.dir":"this.dirAttribute","attr.role":"this.roleAttribute","attr.aria-valuemin":"this.ariaMinAttribute","attr.aria-valuemax":"this.ariaMaxAttribute","attr.aria-valuenow":"this.ariaValueAttribute"}},usesOnChanges:!0,ngImport:p,template:"",isInline:!0}),p.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:P,decorators:[{type:a.Component,args:[{template:""}]}],ctorParameters:function(){return[{type:u.LocalizationService}]},propDecorators:{widgetClasses:[{type:a.HostBinding,args:["class.k-widget"]},{type:a.HostBinding,args:["class.k-progressbar"]}],isHorizontal:[{type:a.HostBinding,args:["class.k-progressbar-horizontal"]}],isVertical:[{type:a.HostBinding,args:["class.k-progressbar-vertical"]}],disabledClass:[{type:a.HostBinding,args:["class.k-disabled"]}],reverseClass:[{type:a.HostBinding,args:["class.k-progressbar-reverse"]}],indeterminateClass:[{type:a.HostBinding,args:["class.k-progressbar-indeterminate"]}],dirAttribute:[{type:a.HostBinding,args:["attr.dir"]}],roleAttribute:[{type:a.HostBinding,args:["attr.role"]}],ariaMinAttribute:[{type:a.HostBinding,args:["attr.aria-valuemin"]}],ariaMaxAttribute:[{type:a.HostBinding,args:["attr.aria-valuemax"]}],ariaValueAttribute:[{type:a.HostBinding,args:["attr.aria-valuenow"]}],max:[{type:a.Input}],min:[{type:a.Input}],value:[{type:a.Input}],orientation:[{type:a.Input}],disabled:[{type:a.Input}],reverse:[{type:a.Input}],indeterminate:[{type:a.Input}]}});m(x,I=P),Object.defineProperty(x.prototype,"showLabel",{get:function(){return"boolean"==typeof this.label?this.label:(this.label&&!this.label.hasOwnProperty("visible")&&(this.label.visible=!0),this.label.visible)},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"labelPosition",{get:function(){return"boolean"==typeof this.label?"end":(this.label&&!this.label.hasOwnProperty("position")&&(this.label.position="end"),this.label.position)},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"isPositionStart",{get:function(){return"start"===this.labelPosition},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"isPositionCenter",{get:function(){return"center"===this.labelPosition},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"isPositionEnd",{get:function(){return"end"===this.labelPosition},enumerable:!1,configurable:!0}),Object.defineProperty(x.prototype,"formattedLabelValue",{get:function(){return d(this.displayValue,this.min,this.max,this.label)},enumerable:!1,configurable:!0}),x.prototype.ngOnChanges=function(e){var t,r,s,n;I.prototype.ngOnChanges.call(this,e),this.isAnimationInProgress&&(r=e,t=Boolean(r.animation),r=t&&r.animation.currentValue,t&&!r&&(this.cancelCurrentAnimation=!0)),t=e,r=this.animation,s=this.previousValue,n=this.displayValue,r&&"undefined"!=typeof requestAnimationFrame&&t.value&&s!==n&&!e.value.firstChange&&this.startAnimation(this.previousValue)},x.prototype.ngOnDestroy=function(){this.animationFrame&&cancelAnimationFrame(this.animationFrame)},x.prototype.startAnimation=function(s){var n=this,i=(this.isAnimationInProgress=!0,this.progressStatusElement.nativeElement),a=this.progressStatusWrapperElement.nativeElement,o=this.getAnimationOptions(s);this.zone.runOutsideAngular(function(){n.animationFrame&&cancelAnimationFrame(n.animationFrame);function r(){var e=(new Date).getTime()-o.startTime,e=Math.min(e/o.duration,1),t=o.startSize+o.deltaSize*e;n.renderValueChange(i,a,o.property,t,100/t*100),e<1?n.cancelCurrentAnimation?n.resetProgress(i,a,o.property):n.animationFrame=requestAnimationFrame(r):n.stopAnimation(s)}r()})},Object.defineProperty(x.prototype,"animationDuration",{get:function(){return"boolean"==typeof this.animation?400:(this.animation&&!this.animation.hasOwnProperty("duration")&&(this.animation.duration=400),this.animation.duration)},enumerable:!1,configurable:!0}),x.prototype.stopAnimation=function(e){var t=this;n.hasObservers(this.animationEnd)&&this.zone.run(function(){t.animationEnd.emit({from:e,to:t.displayValue})}),this.zone.run(function(){t.isAnimationInProgress=!1})},x.prototype.getAnimationOptions=function(e){var t="horizontal"===this.orientation,e=f(this.min,this.max,e),r=t?100*e:100,e=t?100:100*e,s=t?"width":"height",n=(new Date).getTime(),i=t?this.statusWidth-r:this.statusHeight-e;return{property:s,startTime:n,startSize:t?r:e,deltaSize:i,duration:this.animationDuration*Math.abs(i/100)}},x.prototype.renderValueChange=function(e,t,r,s,n){this.renderer.setStyle(e,r,s+"%"),this.renderer.setStyle(t,r,n+"%")},x.prototype.resetProgress=function(e,t,r){var s=this,n=f(this.min,this.max,this.value);this.renderValueChange(e,t,r,100*n,100/n),this.zone.run(function(){s.cancelCurrentAnimation=!1,s.isAnimationInProgress=!1})};var I,O=x;function x(e,t,r){var s=I.call(this,e)||this;return s.localization=e,s.zone=t,s.renderer=r,s.label=!0,s.animation=!1,s.animationEnd=new a.EventEmitter,s}O.ɵfac=p.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:O,deps:[{token:u.LocalizationService},{token:p.NgZone},{token:p.Renderer2}],target:p.ɵɵFactoryTarget.Component}),O.ɵcmp=p.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:O,selector:"kendo-progressbar",inputs:{label:"label",progressCssStyle:"progressCssStyle",progressCssClass:"progressCssClass",emptyCssStyle:"emptyCssStyle",emptyCssClass:"emptyCssClass",animation:"animation"},outputs:{animationEnd:"animationEnd"},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.progressbar"}],viewQueries:[{propertyName:"progressStatusElement",first:!0,predicate:["progressStatus"],descendants:!0},{propertyName:"progressStatusWrapperElement",first:!0,predicate:["progressStatusWrap"],descendants:!0}],exportAs:["kendoProgressBar"],usesInheritance:!0,usesOnChanges:!0,ngImport:p,template:'\n        <span class="k-progress-status-wrap"\n            [class.k-progress-start]="isPositionStart"\n            [class.k-progress-center]="isPositionCenter"\n            [class.k-progress-end]="isPositionEnd"\n            [ngStyle]="emptyCssStyle"\n            [ngClass]="emptyCssClass">\n            <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n        </span>\n        <div\n            #progressStatus\n            class="k-selected"\n            [class.k-complete]="isCompleted"\n            [ngStyle]="progressCssStyle"\n            [ngClass]="progressCssClass"\n            [style.width.%]="statusWidth"\n            [style.height.%]="statusHeight"\n            >\n            <span\n                #progressStatusWrap\n                class="k-progress-status-wrap"\n                [style.width.%]="statusWrapperWidth"\n                [style.height.%]="statusWrapperHeight"\n                [class.k-progress-start]="isPositionStart"\n                [class.k-progress-center]="isPositionCenter"\n                [class.k-progress-end]="isPositionEnd"\n                >\n                <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n            </span>\n        </div>\n       ',isInline:!0,directives:[{type:h.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]},{type:h.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:h.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]}]}),p.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:O,decorators:[{type:a.Component,args:[{exportAs:"kendoProgressBar",selector:"kendo-progressbar",template:'\n        <span class="k-progress-status-wrap"\n            [class.k-progress-start]="isPositionStart"\n            [class.k-progress-center]="isPositionCenter"\n            [class.k-progress-end]="isPositionEnd"\n            [ngStyle]="emptyCssStyle"\n            [ngClass]="emptyCssClass">\n            <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n        </span>\n        <div\n            #progressStatus\n            class="k-selected"\n            [class.k-complete]="isCompleted"\n            [ngStyle]="progressCssStyle"\n            [ngClass]="progressCssClass"\n            [style.width.%]="statusWidth"\n            [style.height.%]="statusHeight"\n            >\n            <span\n                #progressStatusWrap\n                class="k-progress-status-wrap"\n                [style.width.%]="statusWrapperWidth"\n                [style.height.%]="statusWrapperHeight"\n                [class.k-progress-start]="isPositionStart"\n                [class.k-progress-center]="isPositionCenter"\n                [class.k-progress-end]="isPositionEnd"\n                >\n                <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n            </span>\n        </div>\n       ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.progressbar"}]}]}],ctorParameters:function(){return[{type:u.LocalizationService},{type:p.NgZone},{type:p.Renderer2}]},propDecorators:{label:[{type:a.Input}],progressCssStyle:[{type:a.Input}],progressCssClass:[{type:a.Input}],emptyCssStyle:[{type:a.Input}],emptyCssClass:[{type:a.Input}],animation:[{type:a.Input}],animationEnd:[{type:a.Output}],progressStatusElement:[{type:a.ViewChild,args:["progressStatus",{static:!1}]}],progressStatusWrapperElement:[{type:a.ViewChild,args:["progressStatusWrap",{static:!1}]}]}});m(w,E=P),Object.defineProperty(w.prototype,"chunks",{get:function(){for(var e,t=this.chunkCount,r=Array(t).fill(!1),s=Math.floor(this._progressRatio*t),n=0;n<s;n++)r[n]=!0;return t=this.orientation,e=this.reverse,("vertical"===t&&!e||"horizontal"===t&&e)&&r.reverse(),r},enumerable:!1,configurable:!0}),Object.defineProperty(w.prototype,"chunkSizePercentage",{get:function(){return 100/this.chunkCount},enumerable:!1,configurable:!0}),Object.defineProperty(w.prototype,"orientationStyles",{get:function(){return"horizontal"===this.orientation?(this._orientationStyles.width=this.chunkSizePercentage+"%",this._orientationStyles.height=void 0):(this._orientationStyles.height=this.chunkSizePercentage+"%",this._orientationStyles.width=void 0),this._orientationStyles},enumerable:!1,configurable:!0});var E,P=w;function w(e){var t=E.call(this,e)||this;return t.localization=e,t.chunkCount=5,t._orientationStyles={width:t.chunkSizePercentage+"%"},t}P.ɵfac=p.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:P,deps:[{token:u.LocalizationService}],target:p.ɵɵFactoryTarget.Component}),P.ɵcmp=p.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:P,selector:"kendo-chunkprogressbar",inputs:{chunkCount:"chunkCount",progressCssStyle:"progressCssStyle",progressCssClass:"progressCssClass",emptyCssStyle:"emptyCssStyle",emptyCssClass:"emptyCssClass"},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.chunkprogressbar"}],exportAs:["kendoChunkProgressBar"],usesInheritance:!0,ngImport:p,template:'\n        <ul class="k-reset">\n            <li class="k-item" *ngFor="let chunk of chunks; let i = index;"\n                [class.k-first]="i === 0"\n                [class.k-last]="i === chunkCount - 1"\n                [class.k-selected]="chunk"\n                [ngClass]="chunk ? progressCssClass : emptyCssClass"\n                [ngStyle]="chunk ? progressCssStyle : emptyCssStyle"\n                [style.width]="orientationStyles.width"\n                [style.height]="orientationStyles.height"\n                >\n            </li>\n        </ul>\n    ',isInline:!0,directives:[{type:h.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]},{type:h.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:h.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]}]}),p.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:P,decorators:[{type:a.Component,args:[{exportAs:"kendoChunkProgressBar",selector:"kendo-chunkprogressbar",template:'\n        <ul class="k-reset">\n            <li class="k-item" *ngFor="let chunk of chunks; let i = index;"\n                [class.k-first]="i === 0"\n                [class.k-last]="i === chunkCount - 1"\n                [class.k-selected]="chunk"\n                [ngClass]="chunk ? progressCssClass : emptyCssClass"\n                [ngStyle]="chunk ? progressCssStyle : emptyCssStyle"\n                [style.width]="orientationStyles.width"\n                [style.height]="orientationStyles.height"\n                >\n            </li>\n        </ul>\n    ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.chunkprogressbar"}]}]}],ctorParameters:function(){return[{type:u.LocalizationService}]},propDecorators:{chunkCount:[{type:a.Input}],progressCssStyle:[{type:a.Input}],progressCssClass:[{type:a.Input}],emptyCssStyle:[{type:a.Input}],emptyCssClass:[{type:a.Input}]}});var A=function(e){this.templateRef=e},z=(A.ɵfac=p.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:A,deps:[{token:p.TemplateRef}],target:p.ɵɵFactoryTarget.Directive}),A.ɵdir=p.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:A,selector:"[kendoCircularProgressbarCenterTemplate]",ngImport:p}),p.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:A,decorators:[{type:a.Directive,args:[{selector:"[kendoCircularProgressbarCenterTemplate]"}]}],ctorParameters:function(){return[{type:p.TemplateRef}]}}),Object.defineProperty(T.prototype,"value",{get:function(){return this._value},set:function(e){e>this.max&&this.handleErrors("value > max"),e<this.min&&this.handleErrors("value < min"),this.previousValue=this.value,this._value=e},enumerable:!1,configurable:!0}),Object.defineProperty(T.prototype,"max",{get:function(){return this._max},set:function(e){e<this.min&&this.handleErrors("max < min"),this._max=e},enumerable:!1,configurable:!0}),Object.defineProperty(T.prototype,"min",{get:function(){return this._min},set:function(e){e>this.max&&this.handleErrors("max < min"),this._min=e},enumerable:!1,configurable:!0}),Object.defineProperty(T.prototype,"indeterminate",{get:function(){return this._indeterminate},set:function(e){this._indeterminate=e},enumerable:!1,configurable:!0}),T.prototype.ngAfterViewInit=function(){this.initProgressArc()},T.prototype.ngOnChanges=function(e){var t;n.isChanged("value",e,!0)&&this.progress&&(this.animation?this.progressbarAnimation():(t=this.value-this.min,this.internalValue=e.value.currentValue,this.calculateProgress(t))),e.opacity&&this.progress&&v([{method:"setAttribute",el:this.progress.nativeElement,attr:"opacity",attrValue:this.opacity}],this.renderer),e.indeterminate&&!e.indeterminate.firstChange&&this.indeterminateState()},T.prototype.ngOnDestroy=function(){this.subscriptions.unsubscribe()},T.prototype.onResize=function(e){this.setStyles();var t=this.animation?this.internalValue:this.value;this.calculateProgress(t),this.updateCenterTemplate(t)},T.prototype.initProgressArc=function(){var e;this.setStyles(),this.indeterminate?this.indeterminateState():this.animation?this.progressbarAnimation():(e=this.value-this.min,this.calculateProgress(e))},T.prototype.calculateProgress=function(e){var t=this,r=(this.progressColor&&this.updateProgressColor(e),this.zone.onStable.pipe(l.take(1)).subscribe(function(){t.updateCenterTemplate(e+t.min)}),this.progress.nativeElement),s=this.progress.nativeElement.r.baseVal.value,s=Math.PI*(2*s),n=s-(this.rtl?-1*s:s)*(e/(this.max-this.min));v([{method:"setStyle",el:r,attr:"strokeDasharray",attrValue:s},{method:"setStyle",el:r,attr:"strokeDashoffset",attrValue:n}],this.renderer)},T.prototype.progressbarAnimation=function(){var e=this.internalValue>this.value-this.min,t=this.value>=this.previousValue,r=this.internalValue<this.value-this.min,s=this.value<=this.previousValue;e&&t||r&&s||(this.calculateProgress(this.internalValue),e=this.internalValue,n.hasObservers(this.animationEnd)&&this.animationEnd.emit({from:e,to:this.internalValue}),t?this.internalValue+=1:--this.internalValue,requestAnimationFrame(this.progressbarAnimation.bind(this)))},T.prototype.setStyles=function(){var e=this.progress.nativeElement,t=this.scale.nativeElement,r=this.surface.nativeElement,s=this.element.nativeElement,n=s.getBoundingClientRect().width,s=(C(s)||(n=200,v([{method:"setStyle",el:r,attr:"width",attrValue:"200px"},{method:"setStyle",el:r,attr:"height",attrValue:"200px"}],this.renderer)),[{method:"setAttribute",el:e,attr:"r",attrValue:n/2-10},{method:"setAttribute",el:e,attr:"cx",attrValue:n/2},{method:"setAttribute",el:e,attr:"cy",attrValue:n/2},{method:"setAttribute",el:e,attr:"opacity",attrValue:this.opacity},{method:"setAttribute",el:t,attr:"r",attrValue:n/2-10},{method:"setAttribute",el:t,attr:"cx",attrValue:n/2},{method:"setAttribute",el:t,attr:"cy",attrValue:n/2}]);v(s,this.renderer)},T.prototype.indeterminateState=function(){var e,t,r,s=this.progress.nativeElement;this.indeterminate?(this.calculateProgress(this.value-this.min),e=this.rtl?{from:360,to:0}:{from:0,to:360},t=void 0,t=[{method:"setStyle",el:s,attr:"transform-origin",attrValue:"center"},{method:"setStyle",el:s,attr:"fill",attrValue:"none"},{method:"setStyle",el:s,attr:"stroke-linecap",attrValue:"round"},{method:"setStyle",el:s,attr:"stroke",attrValue:(t=this.progressColor?t:getComputedStyle(s).stroke)||this.currentColor}],v(t,this.renderer),this.renderer.removeClass(s,"k-circular-progressbar-arc"),s.innerHTML='<animateTransform attributeName="transform" type="rotate" from="'+e.from+' 0 0" to="'+e.to+' 0 0" dur="1s" repeatCount="indefinite" />'):(this.renderer.addClass(s,"k-circular-progressbar-arc"),r=this.renderer,[{method:"removeStyle",el:s,attr:"transform-origin"},{method:"removeStyle",el:s,attr:"fill"},{method:"removeStyle",el:s,attr:"stroke-linecap"}].forEach(function(e){r[e.method](e.el,e.attr)}),s.innerHTML="",this.animation&&this.progressbarAnimation())},T.prototype.updateCenterTemplate=function(e){this.centerTemplate&&(this.centerTemplateContext.value=e,this.centerTemplateContext.color=this.currentColor,this.cdr.detectChanges(),this.positionLabel())},T.prototype.positionLabel=function(){var e=this.labelElement.nativeElement,t=this.element.nativeElement,r=this.surface.nativeElement,t=(r=(C(t)?(s=(t=t.getBoundingClientRect()).width,t):(s=(t=r.getBoundingClientRect()).width,t)).height,s/2-e.offsetWidth/2),s=r/2-e.offsetHeight/2;v([{method:"setStyle",el:e,attr:"left",attrValue:t+"px"},{method:"setStyle",el:e,attr:"top",attrValue:s+"px"}],this.renderer)},Object.defineProperty(T.prototype,"currentColor",{get:function(){return this.progress.nativeElement.style.stroke},enumerable:!1,configurable:!0}),T.prototype.updateProgressColor=function(e){var t=this.progress.nativeElement;if("string"==typeof this.progressColor)this.renderer.setStyle(t,"stroke",this.progressColor);else for(var r=0;r<this.progressColor.length;r++){var s=this.progressColor[r].from,n=this.progressColor[r].to;if(s<=e&&e<=n||!s&&e<=n){this.renderer.setStyle(t,"stroke",this.progressColor[r].color);break}!n&&s<=e&&this.renderer.setStyle(t,"stroke",this.progressColor[r].color)}},T.prototype.handleErrors=function(e){if(a.isDevMode())switch(e){case"value > max":throw new Error("The value of the CircularProgressbar cannot exceed the max value");case"value < min":throw new Error("The value of the CircularProgressbar cannot be lower than the min value");case"max < min":throw new Error("The min value cannot be higher than the max value")}},T.prototype.setDirection=function(){this.rtl=this.localizationService.rtl,this.element&&this.renderer.setAttribute(this.element.nativeElement,"dir",this.rtl?"rtl":"ltr"),this.labelElement&&this.renderer.setAttribute(this.labelElement.nativeElement,"dir",this.rtl?"rtl":"ltr")},T.prototype.rtlChange=function(){this.element&&this.rtl!==this.localizationService.rtl&&this.setDirection()},T);function T(e,t,r,s,n){this.renderer=e,this.cdr=t,this.localizationService=r,this.element=s,this.zone=n,this.hostClasses=!0,this.animation=!1,this.opacity=1,this.animationEnd=new a.EventEmitter,this.centerTemplateContext={},this._indeterminate=!1,this._max=100,this._min=0,this._value=0,this.previousValue=0,this.internalValue=0,this.subscriptions=new o.Subscription,i.validatePackage(k),this.subscriptions.add(this.localizationService.changes.subscribe(this.rtlChange.bind(this)))}z.ɵfac=p.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:z,deps:[{token:p.Renderer2},{token:p.ChangeDetectorRef},{token:u.LocalizationService},{token:p.ElementRef},{token:p.NgZone}],target:p.ɵɵFactoryTarget.Component}),z.ɵcmp=p.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:z,selector:"kendo-circularprogressbar",inputs:{value:"value",max:"max",min:"min",animation:"animation",opacity:"opacity",indeterminate:"indeterminate",progressColor:"progressColor"},outputs:{animationEnd:"animationEnd"},host:{properties:{"class.k-circular-progressbar":"this.hostClasses"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.circularprogressbar"}],queries:[{propertyName:"centerTemplate",first:!0,predicate:A,descendants:!0}],viewQueries:[{propertyName:"progress",first:!0,predicate:["progress"],descendants:!0},{propertyName:"scale",first:!0,predicate:["scale"],descendants:!0},{propertyName:"labelElement",first:!0,predicate:["label"],descendants:!0},{propertyName:"surface",first:!0,predicate:["surface"],descendants:!0}],exportAs:["kendoCircularProgressBar"],usesOnChanges:!0,ngImport:p,template:'\n        <div #surface class="k-circular-progressbar-surface">\n            <div>\n                <svg #svg>\n                    <g>\n                        <circle class="k-circular-progressbar-scale" #scale stroke-width="9.5"></circle>\n                        <circle class="k-circular-progressbar-arc" #progress stroke-width="9.5"></circle>\n                    </g>\n                </svg>\n                <div class="k-circular-progressbar-label" *ngIf="centerTemplate" #label>\n                    <ng-template [ngTemplateOutlet]="centerTemplate.templateRef" [ngTemplateOutletContext]="centerTemplateContext"></ng-template>\n                </div>\n            </div>\n        </div>\n        <kendo-resize-sensor (resize)="onResize($event)"></kendo-resize-sensor>\n    ',isInline:!0,components:[{type:c.ResizeSensorComponent,selector:"kendo-resize-sensor",inputs:["rateLimit"],outputs:["resize"]}],directives:[{type:h.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:h.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]}]}),p.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:z,decorators:[{type:a.Component,args:[{exportAs:"kendoCircularProgressBar",selector:"kendo-circularprogressbar",template:'\n        <div #surface class="k-circular-progressbar-surface">\n            <div>\n                <svg #svg>\n                    <g>\n                        <circle class="k-circular-progressbar-scale" #scale stroke-width="9.5"></circle>\n                        <circle class="k-circular-progressbar-arc" #progress stroke-width="9.5"></circle>\n                    </g>\n                </svg>\n                <div class="k-circular-progressbar-label" *ngIf="centerTemplate" #label>\n                    <ng-template [ngTemplateOutlet]="centerTemplate.templateRef" [ngTemplateOutletContext]="centerTemplateContext"></ng-template>\n                </div>\n            </div>\n        </div>\n        <kendo-resize-sensor (resize)="onResize($event)"></kendo-resize-sensor>\n    ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.circularprogressbar"}]}]}],ctorParameters:function(){return[{type:p.Renderer2},{type:p.ChangeDetectorRef},{type:u.LocalizationService},{type:p.ElementRef},{type:p.NgZone}]},propDecorators:{hostClasses:[{type:a.HostBinding,args:["class.k-circular-progressbar"]}],value:[{type:a.Input}],max:[{type:a.Input}],min:[{type:a.Input}],animation:[{type:a.Input}],opacity:[{type:a.Input}],indeterminate:[{type:a.Input}],progressColor:[{type:a.Input}],animationEnd:[{type:a.Output}],progress:[{type:a.ViewChild,args:["progress"]}],scale:[{type:a.ViewChild,args:["scale"]}],labelElement:[{type:a.ViewChild,args:["label"]}],surface:[{type:a.ViewChild,args:["surface"]}],centerTemplate:[{type:a.ContentChild,args:[A]}]}});c=[O,P,z,A],h=[r.CommonModule,n.ResizeSensorModule],t=function(){};t.ɵfac=p.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:t,deps:[],target:p.ɵɵFactoryTarget.NgModule}),t.ɵmod=p.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:t,declarations:[O,P,z,A],imports:[r.CommonModule,n.ResizeSensorModule],exports:[O,P,z,A]}),t.ɵinj=p.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:t,imports:[h]}),p.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:p,type:t,decorators:[{type:a.NgModule,args:[{declarations:c,exports:c,imports:h}]}]}),e.ChunkProgressBarComponent=P,e.CircularProgressBarComponent=z,e.CircularProgressbarCenterTemplateDirective=A,e.ProgressBarComponent=O,e.ProgressBarModule=t,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@progress/kendo-licensing"),require("@progress/kendo-angular-l10n"),require("@progress/kendo-angular-common"),require("@angular/common"),require("rxjs"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("KendoAngularProgressbar",["exports","@angular/core","@progress/kendo-licensing","@progress/kendo-angular-l10n","@progress/kendo-angular-common","@angular/common","rxjs","rxjs/operators"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoAngularProgressbar={},e.ng.core,e.KendoLicensing,e.KendoAngularL10N,e.KendoAngularCommon,e.ng.common,e.rxjs,e.rxjs.operators)}(this,function(e,a,i,t,n,r,M,j){"use strict";function s(r){var s;return r&&r.__esModule?r:(s=Object.create(null),r&&Object.keys(r).forEach(function(e){var t;"default"!==e&&(t=Object.getOwnPropertyDescriptor(r,e),Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:function(){return r[e]}}))}),s.default=r,Object.freeze(s))}var o=s(a),l=s(t),p=s(n),c=s(r),u=function(e,t){return(u=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}))(e,t)};function g(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}u(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}Object.create;Object.create;function R(e,t,r,s){var n,i,a,o,l=1===(n=e.toString().split(".")).length?""+n[0]:n[0]+"."+n[1].substr(0,_);if("boolean"!=typeof s){if("string"!=typeof s.format)return"function"==typeof s.format?s.format(e):l;switch(s.format){case"value":return l;case"percent":return Math.floor((i=e,a=t,o=Math.abs((r-a)/100),Math.abs((i-a)/o)))+"%";default:return l}}return l}function h(e,t,r){return Math.max(Math.min(r,t),e)}function m(e,t,r){return Math.max((r-e)/(t-e),1e-4)}function d(e,t,r){return e[t]&&void 0!==e[t].currentValue?e[t].currentValue:r}function y(e,t){e.forEach(function(e){t[e.method](e.el,e.attr,""+e.attrValue)})}function b(e){return e.style.width&&e.style.height}var f={name:"@progress/kendo-angular-progressbar",productName:"Kendo UI for Angular",productCodes:["KENDOUIANGULAR","KENDOUICOMPLETE"],publishDate:1667900115,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"},_=3,v=(Object.defineProperty(C.prototype,"isHorizontal",{get:function(){return"horizontal"===this.orientation},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"isVertical",{get:function(){return"vertical"===this.orientation},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"disabledClass",{get:function(){return this.disabled},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"reverseClass",{get:function(){return this.reverse},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"indeterminateClass",{get:function(){return this.indeterminate},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"dirAttribute",{get:function(){return this.direction},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"ariaMinAttribute",{get:function(){return String(this.min)},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"ariaMaxAttribute",{get:function(){return String(this.max)},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"ariaValueAttribute",{get:function(){return this.indeterminate?void 0:String(this.displayValue)},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"isCompleted",{get:function(){return this.value===this.max},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"statusWidth",{get:function(){return"horizontal"===this.orientation?100*this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"statusHeight",{get:function(){return"vertical"===this.orientation?100*this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"statusWrapperWidth",{get:function(){return"horizontal"===this.orientation?100/this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"statusWrapperHeight",{get:function(){return"vertical"===this.orientation?100/this._progressRatio:100},enumerable:!1,configurable:!0}),Object.defineProperty(C.prototype,"_progressRatio",{get:function(){return m(this.min,this.max,this.displayValue)},enumerable:!1,configurable:!0}),C.prototype.ngAfterViewInit=function(){var e=this.elem.nativeElement,t=this.localization.get("progressBarLabel");this.renderer.setAttribute(e,"aria-label",t)},C.prototype.ngOnChanges=function(e){var t=d(e,"min",this.min),r=d(e,"max",this.max),s=d(e,"value",this.value);if(e.min||e.max||e.value){if(e.min||e.max){var n=t,i=r;if(a.isDevMode&&i<n)throw new Error("The max value should be greater than the min.")}e.value&&(null!=s&&!Number.isNaN(s)||(this.value=t),i=this.displayValue,this.displayValue=h(this.min,this.max,s),this.previousValue=i),this.min=t,this.max=r,this.displayValue=h(this.min,this.max,s)}},C.prototype.ngOnDestroy=function(){this.localizationChangeSubscription&&this.localizationChangeSubscription.unsubscribe()},C);function C(e,t,r){var s=this;this.elem=e,this.renderer=t,this.localization=r,this.hostClasses=!0,this.roleAttribute="progressbar",this.max=100,this.min=0,this.value=0,this.orientation="horizontal",this.disabled=!1,this.reverse=!1,this.indeterminate=!1,this.displayValue=0,this.previousValue=0,i.validatePackage(f),this.localizationChangeSubscription=r.changes.subscribe(function(e){e=e.rtl;s.direction=e?"rtl":"ltr"})}v.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:v,deps:[{token:o.ElementRef},{token:o.Renderer2},{token:l.LocalizationService}],target:o.ɵɵFactoryTarget.Component}),v.ɵcmp=o.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:v,selector:"ng-component",inputs:{max:"max",min:"min",value:"value",orientation:"orientation",disabled:"disabled",reverse:"reverse",indeterminate:"indeterminate"},host:{properties:{"class.k-progressbar":"this.hostClasses","class.k-progressbar-horizontal":"this.isHorizontal","class.k-progressbar-vertical":"this.isVertical","class.k-disabled":"this.disabledClass","class.k-progressbar-reverse":"this.reverseClass","class.k-progressbar-indeterminate":"this.indeterminateClass","attr.dir":"this.dirAttribute","attr.role":"this.roleAttribute","attr.aria-valuemin":"this.ariaMinAttribute","attr.aria-valuemax":"this.ariaMaxAttribute","attr.aria-valuenow":"this.ariaValueAttribute"}},usesOnChanges:!0,ngImport:o,template:"",isInline:!0}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:v,decorators:[{type:a.Component,args:[{template:""}]}],ctorParameters:function(){return[{type:o.ElementRef},{type:o.Renderer2},{type:l.LocalizationService}]},propDecorators:{hostClasses:[{type:a.HostBinding,args:["class.k-progressbar"]}],isHorizontal:[{type:a.HostBinding,args:["class.k-progressbar-horizontal"]}],isVertical:[{type:a.HostBinding,args:["class.k-progressbar-vertical"]}],disabledClass:[{type:a.HostBinding,args:["class.k-disabled"]}],reverseClass:[{type:a.HostBinding,args:["class.k-progressbar-reverse"]}],indeterminateClass:[{type:a.HostBinding,args:["class.k-progressbar-indeterminate"]}],dirAttribute:[{type:a.HostBinding,args:["attr.dir"]}],roleAttribute:[{type:a.HostBinding,args:["attr.role"]}],ariaMinAttribute:[{type:a.HostBinding,args:["attr.aria-valuemin"]}],ariaMaxAttribute:[{type:a.HostBinding,args:["attr.aria-valuemax"]}],ariaValueAttribute:[{type:a.HostBinding,args:["attr.aria-valuenow"]}],max:[{type:a.Input}],min:[{type:a.Input}],value:[{type:a.Input}],orientation:[{type:a.Input}],disabled:[{type:a.Input}],reverse:[{type:a.Input}],indeterminate:[{type:a.Input}]}});g(S,k=t.ComponentMessages);var k,P=S;function S(){return null!==k&&k.apply(this,arguments)||this}P.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:P,deps:null,target:o.ɵɵFactoryTarget.Directive}),P.ɵdir=o.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:P,selector:"kendo-progressbar-messages-base",inputs:{progressBarLabel:"progressBarLabel"},usesInheritance:!0,ngImport:o}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:P,decorators:[{type:a.Directive,args:[{selector:"kendo-progressbar-messages-base"}]}],propDecorators:{progressBarLabel:[{type:a.Input}]}});g(E,V=P);var V,I=E;function E(e){var t=V.call(this)||this;return t.service=e,t}I.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:I,deps:[{token:l.LocalizationService}],target:o.ɵɵFactoryTarget.Directive}),I.ɵdir=o.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:I,selector:"[kendoProgressBarLocalizedMessages]",providers:[{provide:P,useExisting:a.forwardRef(function(){return I})}],usesInheritance:!0,ngImport:o}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:I,decorators:[{type:a.Directive,args:[{providers:[{provide:P,useExisting:a.forwardRef(function(){return I})}],selector:"[kendoProgressBarLocalizedMessages]"}]}],ctorParameters:function(){return[{type:l.LocalizationService}]}});g(A,x=v),Object.defineProperty(A.prototype,"showLabel",{get:function(){return"boolean"==typeof this.label?this.label:(this.label&&!this.label.hasOwnProperty("visible")&&(this.label.visible=!0),this.label.visible)},enumerable:!1,configurable:!0}),Object.defineProperty(A.prototype,"labelPosition",{get:function(){return"boolean"==typeof this.label?"end":(this.label&&!this.label.hasOwnProperty("position")&&(this.label.position="end"),this.label.position)},enumerable:!1,configurable:!0}),Object.defineProperty(A.prototype,"isPositionStart",{get:function(){return"start"===this.labelPosition},enumerable:!1,configurable:!0}),Object.defineProperty(A.prototype,"isPositionCenter",{get:function(){return"center"===this.labelPosition},enumerable:!1,configurable:!0}),Object.defineProperty(A.prototype,"isPositionEnd",{get:function(){return"end"===this.labelPosition},enumerable:!1,configurable:!0}),Object.defineProperty(A.prototype,"formattedLabelValue",{get:function(){return R(this.displayValue,this.min,this.max,this.label)},enumerable:!1,configurable:!0}),A.prototype.ngOnChanges=function(e){var t,r,s,n;x.prototype.ngOnChanges.call(this,e),this.isAnimationInProgress&&(r=e,t=Boolean(r.animation),r=t&&r.animation.currentValue,t)&&!r&&(this.cancelCurrentAnimation=!0),t=e,r=this.animation,s=this.previousValue,n=this.displayValue,r&&"undefined"!=typeof requestAnimationFrame&&t.value&&s!==n&&!e.value.firstChange&&this.startAnimation(this.previousValue)},A.prototype.ngOnDestroy=function(){this.animationFrame&&cancelAnimationFrame(this.animationFrame)},A.prototype.startAnimation=function(s){var n=this,i=(this.isAnimationInProgress=!0,this.progressStatusElement.nativeElement),a=this.progressStatusWrapperElement.nativeElement,o=this.getAnimationOptions(s);this.zone.runOutsideAngular(function(){n.animationFrame&&cancelAnimationFrame(n.animationFrame);function r(){var e=(new Date).getTime()-o.startTime,e=Math.min(e/o.duration,1),t=o.startSize+o.deltaSize*e;n.renderValueChange(i,a,o.property,t,100/t*100),e<1?n.cancelCurrentAnimation?n.resetProgress(i,a,o.property):n.animationFrame=requestAnimationFrame(r):n.stopAnimation(s)}r()})},Object.defineProperty(A.prototype,"animationDuration",{get:function(){return"boolean"==typeof this.animation?400:(this.animation&&!this.animation.hasOwnProperty("duration")&&(this.animation.duration=400),this.animation.duration)},enumerable:!1,configurable:!0}),A.prototype.stopAnimation=function(e){var t=this;n.hasObservers(this.animationEnd)&&this.zone.run(function(){t.animationEnd.emit({from:e,to:t.displayValue})}),this.zone.run(function(){t.isAnimationInProgress=!1})},A.prototype.getAnimationOptions=function(e){var t="horizontal"===this.orientation,e=m(this.min,this.max,e),r=t?100*e:100,e=t?100:100*e,s=t?"width":"height",n=(new Date).getTime(),i=t?this.statusWidth-r:this.statusHeight-e;return{property:s,startTime:n,startSize:t?r:e,deltaSize:i,duration:this.animationDuration*Math.abs(i/100)}},A.prototype.renderValueChange=function(e,t,r,s,n){this.renderer.setStyle(e,r,s+"%"),this.renderer.setStyle(t,r,n+"%")},A.prototype.resetProgress=function(e,t,r){var s=this,n=m(this.min,this.max,this.value);this.renderValueChange(e,t,r,100*n,100/n),this.zone.run(function(){s.cancelCurrentAnimation=!1,s.isAnimationInProgress=!1})};var x,z=A;function A(e,t,r,s){var n=x.call(this,t,r,e)||this;return n.localization=e,n.elem=t,n.renderer=r,n.zone=s,n.label=!0,n.animation=!1,n.animationEnd=new a.EventEmitter,n}z.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:z,deps:[{token:l.LocalizationService},{token:o.ElementRef},{token:o.Renderer2},{token:o.NgZone}],target:o.ɵɵFactoryTarget.Component}),z.ɵcmp=o.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:z,selector:"kendo-progressbar",inputs:{label:"label",progressCssStyle:"progressCssStyle",progressCssClass:"progressCssClass",emptyCssStyle:"emptyCssStyle",emptyCssClass:"emptyCssClass",animation:"animation"},outputs:{animationEnd:"animationEnd"},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.progressbar"}],viewQueries:[{propertyName:"progressStatusElement",first:!0,predicate:["progressStatus"],descendants:!0},{propertyName:"progressStatusWrapperElement",first:!0,predicate:["progressStatusWrap"],descendants:!0}],exportAs:["kendoProgressBar"],usesInheritance:!0,usesOnChanges:!0,ngImport:o,template:'\n        <ng-container kendoProgressBarLocalizedMessages\n            i18n-progressBarLabel="kendo.progressbar.progressBarLabel|The aria-label attribute for the ProgressBar component."\n            progressBarLabel="Progressbar"\n        >\n        </ng-container>\n        <span class="k-progress-status-wrap"\n            [class.k-progress-start]="isPositionStart"\n            [class.k-progress-center]="isPositionCenter"\n            [class.k-progress-end]="isPositionEnd"\n            [ngStyle]="emptyCssStyle"\n            [ngClass]="emptyCssClass">\n            <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n        </span>\n        <div\n            #progressStatus\n            class="k-selected"\n            [class.k-complete]="isCompleted"\n            [ngStyle]="progressCssStyle"\n            [ngClass]="progressCssClass"\n            [style.width.%]="statusWidth"\n            [style.height.%]="statusHeight"\n            >\n            <span\n                #progressStatusWrap\n                class="k-progress-status-wrap"\n                [style.width.%]="statusWrapperWidth"\n                [style.height.%]="statusWrapperHeight"\n                [class.k-progress-start]="isPositionStart"\n                [class.k-progress-center]="isPositionCenter"\n                [class.k-progress-end]="isPositionEnd"\n                >\n                <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n            </span>\n        </div>\n       ',isInline:!0,directives:[{type:I,selector:"[kendoProgressBarLocalizedMessages]"},{type:c.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]},{type:c.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:c.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]}]}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:z,decorators:[{type:a.Component,args:[{exportAs:"kendoProgressBar",selector:"kendo-progressbar",template:'\n        <ng-container kendoProgressBarLocalizedMessages\n            i18n-progressBarLabel="kendo.progressbar.progressBarLabel|The aria-label attribute for the ProgressBar component."\n            progressBarLabel="Progressbar"\n        >\n        </ng-container>\n        <span class="k-progress-status-wrap"\n            [class.k-progress-start]="isPositionStart"\n            [class.k-progress-center]="isPositionCenter"\n            [class.k-progress-end]="isPositionEnd"\n            [ngStyle]="emptyCssStyle"\n            [ngClass]="emptyCssClass">\n            <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n        </span>\n        <div\n            #progressStatus\n            class="k-selected"\n            [class.k-complete]="isCompleted"\n            [ngStyle]="progressCssStyle"\n            [ngClass]="progressCssClass"\n            [style.width.%]="statusWidth"\n            [style.height.%]="statusHeight"\n            >\n            <span\n                #progressStatusWrap\n                class="k-progress-status-wrap"\n                [style.width.%]="statusWrapperWidth"\n                [style.height.%]="statusWrapperHeight"\n                [class.k-progress-start]="isPositionStart"\n                [class.k-progress-center]="isPositionCenter"\n                [class.k-progress-end]="isPositionEnd"\n                >\n                <span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>\n            </span>\n        </div>\n       ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.progressbar"}]}]}],ctorParameters:function(){return[{type:l.LocalizationService},{type:o.ElementRef},{type:o.Renderer2},{type:o.NgZone}]},propDecorators:{label:[{type:a.Input}],progressCssStyle:[{type:a.Input}],progressCssClass:[{type:a.Input}],emptyCssStyle:[{type:a.Input}],emptyCssClass:[{type:a.Input}],animation:[{type:a.Input}],animationEnd:[{type:a.Output}],progressStatusElement:[{type:a.ViewChild,args:["progressStatus",{static:!1}]}],progressStatusWrapperElement:[{type:a.ViewChild,args:["progressStatusWrap",{static:!1}]}]}});g(O,F=v),Object.defineProperty(O.prototype,"chunks",{get:function(){for(var e,t=this.chunkCount,r=Array(t).fill(!1),s=Math.floor(this._progressRatio*t),n=0;n<s;n++)r[n]=!0;return t=this.orientation,e=this.reverse,("vertical"===t&&!e||"horizontal"===t&&e)&&r.reverse(),r},enumerable:!1,configurable:!0}),Object.defineProperty(O.prototype,"chunkSizePercentage",{get:function(){return 100/this.chunkCount},enumerable:!1,configurable:!0}),Object.defineProperty(O.prototype,"orientationStyles",{get:function(){return"horizontal"===this.orientation?(this._orientationStyles.width=this.chunkSizePercentage+"%",this._orientationStyles.height=void 0):(this._orientationStyles.height=this.chunkSizePercentage+"%",this._orientationStyles.width=void 0),this._orientationStyles},enumerable:!1,configurable:!0});var F,v=O;function O(e,t,r){var s=F.call(this,t,r,e)||this;return s.localization=e,s.elem=t,s.renderer=r,s.chunkCount=5,s._orientationStyles={width:s.chunkSizePercentage+"%"},s}v.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:v,deps:[{token:l.LocalizationService},{token:o.ElementRef},{token:o.Renderer2}],target:o.ɵɵFactoryTarget.Component}),v.ɵcmp=o.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:v,selector:"kendo-chunkprogressbar",inputs:{chunkCount:"chunkCount",progressCssStyle:"progressCssStyle",progressCssClass:"progressCssClass",emptyCssStyle:"emptyCssStyle",emptyCssClass:"emptyCssClass"},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.chunkprogressbar"}],exportAs:["kendoChunkProgressBar"],usesInheritance:!0,ngImport:o,template:'\n        <ng-container kendoProgressBarLocalizedMessages\n            i18n-progressBarLabel="kendo.chunkprogressbar.progressBarLabel|The aria-label attribute for the ChunkProgressBar component."\n            progressBarLabel="Chunk progressbar"\n        >\n        </ng-container>\n        <ul class="k-reset">\n            <li class="k-item" *ngFor="let chunk of chunks; let i = index;"\n                [class.k-first]="i === 0"\n                [class.k-last]="i === chunkCount - 1"\n                [class.k-selected]="chunk"\n                [ngClass]="chunk ? progressCssClass : emptyCssClass"\n                [ngStyle]="chunk ? progressCssStyle : emptyCssStyle"\n                [style.width]="orientationStyles.width"\n                [style.height]="orientationStyles.height"\n                >\n            </li>\n        </ul>\n    ',isInline:!0,directives:[{type:I,selector:"[kendoProgressBarLocalizedMessages]"},{type:c.NgForOf,selector:"[ngFor][ngForOf]",inputs:["ngForOf","ngForTrackBy","ngForTemplate"]},{type:c.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{type:c.NgStyle,selector:"[ngStyle]",inputs:["ngStyle"]}]}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:v,decorators:[{type:a.Component,args:[{exportAs:"kendoChunkProgressBar",selector:"kendo-chunkprogressbar",template:'\n        <ng-container kendoProgressBarLocalizedMessages\n            i18n-progressBarLabel="kendo.chunkprogressbar.progressBarLabel|The aria-label attribute for the ChunkProgressBar component."\n            progressBarLabel="Chunk progressbar"\n        >\n        </ng-container>\n        <ul class="k-reset">\n            <li class="k-item" *ngFor="let chunk of chunks; let i = index;"\n                [class.k-first]="i === 0"\n                [class.k-last]="i === chunkCount - 1"\n                [class.k-selected]="chunk"\n                [ngClass]="chunk ? progressCssClass : emptyCssClass"\n                [ngStyle]="chunk ? progressCssStyle : emptyCssStyle"\n                [style.width]="orientationStyles.width"\n                [style.height]="orientationStyles.height"\n                >\n            </li>\n        </ul>\n    ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.chunkprogressbar"}]}]}],ctorParameters:function(){return[{type:l.LocalizationService},{type:o.ElementRef},{type:o.Renderer2}]},propDecorators:{chunkCount:[{type:a.Input}],progressCssStyle:[{type:a.Input}],progressCssClass:[{type:a.Input}],emptyCssStyle:[{type:a.Input}],emptyCssClass:[{type:a.Input}]}});var L=function(e){this.templateRef=e},w=(L.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:L,deps:[{token:o.TemplateRef}],target:o.ɵɵFactoryTarget.Directive}),L.ɵdir=o.ɵɵngDeclareDirective({minVersion:"12.0.0",version:"12.2.16",type:L,selector:"[kendoCircularProgressbarCenterTemplate]",ngImport:o}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:L,decorators:[{type:a.Directive,args:[{selector:"[kendoCircularProgressbarCenterTemplate]"}]}],ctorParameters:function(){return[{type:o.TemplateRef}]}}),Object.defineProperty(B.prototype,"ariaMinAttribute",{get:function(){return String(this.min)},enumerable:!1,configurable:!0}),Object.defineProperty(B.prototype,"ariaMaxAttribute",{get:function(){return String(this.max)},enumerable:!1,configurable:!0}),Object.defineProperty(B.prototype,"ariaValueAttribute",{get:function(){return this.indeterminate?void 0:String(this.value)},enumerable:!1,configurable:!0}),Object.defineProperty(B.prototype,"value",{get:function(){return this._value},set:function(e){e>this.max&&this.handleErrors("value > max"),e<this.min&&this.handleErrors("value < min"),this.previousValue=this.value,this._value=e},enumerable:!1,configurable:!0}),Object.defineProperty(B.prototype,"max",{get:function(){return this._max},set:function(e){e<this.min&&this.handleErrors("max < min"),this._max=e},enumerable:!1,configurable:!0}),Object.defineProperty(B.prototype,"min",{get:function(){return this._min},set:function(e){e>this.max&&this.handleErrors("max < min"),this._min=e},enumerable:!1,configurable:!0}),Object.defineProperty(B.prototype,"indeterminate",{get:function(){return this._indeterminate},set:function(e){this._indeterminate=e},enumerable:!1,configurable:!0}),B.prototype.ngAfterViewInit=function(){var e=this.element.nativeElement,t=this.localization.get("progressBarLabel");this.renderer.setAttribute(e,"aria-label",t),this.initProgressArc()},B.prototype.ngOnChanges=function(e){var t;n.isChanged("value",e,!0)&&this.progress&&(this.animation?this.progressbarAnimation():(t=this.value-this.min,this.internalValue=e.value.currentValue,this.calculateProgress(t))),e.opacity&&this.progress&&y([{method:"setAttribute",el:this.progress.nativeElement,attr:"opacity",attrValue:this.opacity}],this.renderer),e.indeterminate&&!e.indeterminate.firstChange&&this.indeterminateState()},B.prototype.ngOnDestroy=function(){this.subscriptions.unsubscribe()},B.prototype.onResize=function(e){this.setStyles();var t=this.animation?this.internalValue:this.value;this.calculateProgress(t),this.updateCenterTemplate(t)},B.prototype.initProgressArc=function(){var e;this.setStyles(),this.indeterminate?this.indeterminateState():this.animation?this.progressbarAnimation():(e=this.value-this.min,this.calculateProgress(e))},B.prototype.calculateProgress=function(e){var t=this,r=(this.progressColor&&this.updateProgressColor(e),this.zone.onStable.pipe(j.take(1)).subscribe(function(){t.updateCenterTemplate(e+t.min)}),this.progress.nativeElement),s=this.progress.nativeElement.r.baseVal.value,s=Math.PI*(2*s),n=s-(this.rtl?-1*s:s)*(e/(this.max-this.min));y([{method:"setStyle",el:r,attr:"strokeDasharray",attrValue:s},{method:"setStyle",el:r,attr:"strokeDashoffset",attrValue:n}],this.renderer)},B.prototype.progressbarAnimation=function(){var e=this.internalValue>this.value-this.min,t=this.value>=this.previousValue,r=this.internalValue<this.value-this.min,s=this.value<=this.previousValue;e&&t||r&&s||(this.calculateProgress(this.internalValue),e=this.internalValue,n.hasObservers(this.animationEnd)&&this.animationEnd.emit({from:e,to:this.internalValue}),t?this.internalValue+=1:--this.internalValue,requestAnimationFrame(this.progressbarAnimation.bind(this)))},B.prototype.setStyles=function(){var e=this.progress.nativeElement,t=this.scale.nativeElement,r=this.surface.nativeElement,s=this.element.nativeElement,n=s.getBoundingClientRect().width,s=(b(s)||(n=200,y([{method:"setStyle",el:r,attr:"width",attrValue:"200px"},{method:"setStyle",el:r,attr:"height",attrValue:"200px"}],this.renderer)),[{method:"setAttribute",el:e,attr:"r",attrValue:n/2-10},{method:"setAttribute",el:e,attr:"cx",attrValue:n/2},{method:"setAttribute",el:e,attr:"cy",attrValue:n/2},{method:"setAttribute",el:e,attr:"opacity",attrValue:this.opacity},{method:"setAttribute",el:t,attr:"r",attrValue:n/2-10},{method:"setAttribute",el:t,attr:"cx",attrValue:n/2},{method:"setAttribute",el:t,attr:"cy",attrValue:n/2}]);y(s,this.renderer)},B.prototype.indeterminateState=function(){var e,t,r,s=this.progress.nativeElement;this.indeterminate?(this.calculateProgress(this.value-this.min),e=this.rtl?{from:360,to:0}:{from:0,to:360},t=void 0,t=[{method:"setStyle",el:s,attr:"transform-origin",attrValue:"center"},{method:"setStyle",el:s,attr:"fill",attrValue:"none"},{method:"setStyle",el:s,attr:"stroke-linecap",attrValue:"round"},{method:"setStyle",el:s,attr:"stroke",attrValue:(t=this.progressColor?t:getComputedStyle(s).stroke)||this.currentColor}],y(t,this.renderer),this.renderer.removeClass(s,"k-circular-progressbar-arc"),s.innerHTML='<animateTransform attributeName="transform" type="rotate" from="'+e.from+' 0 0" to="'+e.to+' 0 0" dur="1s" repeatCount="indefinite" />'):(this.renderer.addClass(s,"k-circular-progressbar-arc"),r=this.renderer,[{method:"removeStyle",el:s,attr:"transform-origin"},{method:"removeStyle",el:s,attr:"fill"},{method:"removeStyle",el:s,attr:"stroke-linecap"}].forEach(function(e){r[e.method](e.el,e.attr)}),s.innerHTML="",this.animation&&this.progressbarAnimation())},B.prototype.updateCenterTemplate=function(e){this.centerTemplate&&(this.centerTemplateContext.value=e,this.centerTemplateContext.color=this.currentColor,this.cdr.detectChanges(),this.positionLabel())},B.prototype.positionLabel=function(){var e=this.labelElement.nativeElement,t=this.element.nativeElement,r=this.surface.nativeElement,t=(r=(b(t)?(s=(t=t.getBoundingClientRect()).width,t):(s=(t=r.getBoundingClientRect()).width,t)).height,s/2-e.offsetWidth/2),s=r/2-e.offsetHeight/2;y([{method:"setStyle",el:e,attr:"left",attrValue:t+"px"},{method:"setStyle",el:e,attr:"top",attrValue:s+"px"}],this.renderer)},Object.defineProperty(B.prototype,"currentColor",{get:function(){return this.progress.nativeElement.style.stroke},enumerable:!1,configurable:!0}),B.prototype.updateProgressColor=function(e){var t=this.progress.nativeElement;if("string"==typeof this.progressColor)this.renderer.setStyle(t,"stroke",this.progressColor);else for(var r=0;r<this.progressColor.length;r++){var s=this.progressColor[r].from,n=this.progressColor[r].to;if(s<=e&&e<=n||!s&&e<=n){this.renderer.setStyle(t,"stroke",this.progressColor[r].color);break}!n&&s<=e&&this.renderer.setStyle(t,"stroke",this.progressColor[r].color)}},B.prototype.handleErrors=function(e){if(a.isDevMode())switch(e){case"value > max":throw new Error("The value of the CircularProgressbar cannot exceed the max value");case"value < min":throw new Error("The value of the CircularProgressbar cannot be lower than the min value");case"max < min":throw new Error("The min value cannot be higher than the max value")}},B.prototype.setDirection=function(){this.rtl=this.localization.rtl,this.element&&this.renderer.setAttribute(this.element.nativeElement,"dir",this.rtl?"rtl":"ltr"),this.labelElement&&this.renderer.setAttribute(this.labelElement.nativeElement,"dir",this.rtl?"rtl":"ltr")},B.prototype.rtlChange=function(){this.element&&this.rtl!==this.localization.rtl&&this.setDirection()},B);function B(e,t,r,s,n){this.renderer=e,this.cdr=t,this.localization=r,this.element=s,this.zone=n,this.hostClasses=!0,this.roleAttribute="progressbar",this.animation=!1,this.opacity=1,this.animationEnd=new a.EventEmitter,this.centerTemplateContext={},this._indeterminate=!1,this._max=100,this._min=0,this._value=0,this.previousValue=0,this.internalValue=0,this.subscriptions=new M.Subscription,i.validatePackage(f),this.subscriptions.add(this.localization.changes.subscribe(this.rtlChange.bind(this)))}w.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:w,deps:[{token:o.Renderer2},{token:o.ChangeDetectorRef},{token:l.LocalizationService},{token:o.ElementRef},{token:o.NgZone}],target:o.ɵɵFactoryTarget.Component}),w.ɵcmp=o.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:w,selector:"kendo-circularprogressbar",inputs:{value:"value",max:"max",min:"min",animation:"animation",opacity:"opacity",indeterminate:"indeterminate",progressColor:"progressColor"},outputs:{animationEnd:"animationEnd"},host:{properties:{"class.k-circular-progressbar":"this.hostClasses","attr.aria-valuemin":"this.ariaMinAttribute","attr.aria-valuemax":"this.ariaMaxAttribute","attr.aria-valuenow":"this.ariaValueAttribute","attr.role":"this.roleAttribute"}},providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.circularprogressbar"}],queries:[{propertyName:"centerTemplate",first:!0,predicate:L,descendants:!0}],viewQueries:[{propertyName:"progress",first:!0,predicate:["progress"],descendants:!0},{propertyName:"scale",first:!0,predicate:["scale"],descendants:!0},{propertyName:"labelElement",first:!0,predicate:["label"],descendants:!0},{propertyName:"surface",first:!0,predicate:["surface"],descendants:!0}],exportAs:["kendoCircularProgressBar"],usesOnChanges:!0,ngImport:o,template:'\n        <ng-container kendoProgressBarLocalizedMessages\n            i18n-progressBarLabel="kendo.circularprogressbar.progressBarLabel|The aria-label attribute for the Circular ProgressBar component."\n            progressBarLabel="Circular progressbar"\n        >\n        </ng-container>\n        <div #surface class="k-circular-progressbar-surface">\n            <div>\n                <svg #svg>\n                    <g>\n                        <circle class="k-circular-progressbar-scale" #scale stroke-width="9.5"></circle>\n                        <circle class="k-circular-progressbar-arc" #progress stroke-width="9.5"></circle>\n                    </g>\n                </svg>\n                <div class="k-circular-progressbar-label" *ngIf="centerTemplate" #label>\n                    <ng-template [ngTemplateOutlet]="centerTemplate.templateRef" [ngTemplateOutletContext]="centerTemplateContext"></ng-template>\n                </div>\n            </div>\n        </div>\n        <kendo-resize-sensor (resize)="onResize($event)"></kendo-resize-sensor>\n    ',isInline:!0,components:[{type:p.ResizeSensorComponent,selector:"kendo-resize-sensor",inputs:["rateLimit"],outputs:["resize"]}],directives:[{type:I,selector:"[kendoProgressBarLocalizedMessages]"},{type:c.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{type:c.NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet"]}]}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:w,decorators:[{type:a.Component,args:[{exportAs:"kendoCircularProgressBar",selector:"kendo-circularprogressbar",template:'\n        <ng-container kendoProgressBarLocalizedMessages\n            i18n-progressBarLabel="kendo.circularprogressbar.progressBarLabel|The aria-label attribute for the Circular ProgressBar component."\n            progressBarLabel="Circular progressbar"\n        >\n        </ng-container>\n        <div #surface class="k-circular-progressbar-surface">\n            <div>\n                <svg #svg>\n                    <g>\n                        <circle class="k-circular-progressbar-scale" #scale stroke-width="9.5"></circle>\n                        <circle class="k-circular-progressbar-arc" #progress stroke-width="9.5"></circle>\n                    </g>\n                </svg>\n                <div class="k-circular-progressbar-label" *ngIf="centerTemplate" #label>\n                    <ng-template [ngTemplateOutlet]="centerTemplate.templateRef" [ngTemplateOutletContext]="centerTemplateContext"></ng-template>\n                </div>\n            </div>\n        </div>\n        <kendo-resize-sensor (resize)="onResize($event)"></kendo-resize-sensor>\n    ',providers:[t.LocalizationService,{provide:t.L10N_PREFIX,useValue:"kendo.circularprogressbar"}]}]}],ctorParameters:function(){return[{type:o.Renderer2},{type:o.ChangeDetectorRef},{type:l.LocalizationService},{type:o.ElementRef},{type:o.NgZone}]},propDecorators:{hostClasses:[{type:a.HostBinding,args:["class.k-circular-progressbar"]}],ariaMinAttribute:[{type:a.HostBinding,args:["attr.aria-valuemin"]}],ariaMaxAttribute:[{type:a.HostBinding,args:["attr.aria-valuemax"]}],ariaValueAttribute:[{type:a.HostBinding,args:["attr.aria-valuenow"]}],roleAttribute:[{type:a.HostBinding,args:["attr.role"]}],value:[{type:a.Input}],max:[{type:a.Input}],min:[{type:a.Input}],animation:[{type:a.Input}],opacity:[{type:a.Input}],indeterminate:[{type:a.Input}],progressColor:[{type:a.Input}],animationEnd:[{type:a.Output}],progress:[{type:a.ViewChild,args:["progress"]}],scale:[{type:a.ViewChild,args:["scale"]}],labelElement:[{type:a.ViewChild,args:["label"]}],surface:[{type:a.ViewChild,args:["surface"]}],centerTemplate:[{type:a.ContentChild,args:[L]}]}});g(T,N=P),Object.defineProperty(T.prototype,"override",{get:function(){return!0},enumerable:!1,configurable:!0});var N,D=T;function T(e){var t=N.call(this)||this;return t.service=e,t}D.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:D,deps:[{token:l.LocalizationService}],target:o.ɵɵFactoryTarget.Component}),D.ɵcmp=o.ɵɵngDeclareComponent({minVersion:"12.0.0",version:"12.2.16",type:D,selector:"kendo-progressbar-messages",providers:[{provide:P,useExisting:a.forwardRef(function(){return D})}],usesInheritance:!0,ngImport:o,template:"",isInline:!0}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:D,decorators:[{type:a.Component,args:[{providers:[{provide:P,useExisting:a.forwardRef(function(){return D})}],selector:"kendo-progressbar-messages",template:""}]}],ctorParameters:function(){return[{type:l.LocalizationService}]}});p=[z,v,w,L,I,D],c=[r.CommonModule,n.ResizeSensorModule],t=function(){};t.ɵfac=o.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:t,deps:[],target:o.ɵɵFactoryTarget.NgModule}),t.ɵmod=o.ɵɵngDeclareNgModule({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:t,declarations:[z,v,w,L,I,D],imports:[r.CommonModule,n.ResizeSensorModule],exports:[z,v,w,L,I,D]}),t.ɵinj=o.ɵɵngDeclareInjector({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:t,imports:[c]}),o.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"12.2.16",ngImport:o,type:t,decorators:[{type:a.NgModule,args:[{declarations:p,exports:p,imports:c}]}]}),e.ChunkProgressBarComponent=v,e.CircularProgressBarComponent=w,e.CircularProgressbarCenterTemplateDirective=L,e.LocalizedProgressBarMessagesDirective=I,e.ProgressBarComponent=z,e.ProgressBarCustomMessagesComponent=D,e.ProgressBarModule=t,Object.defineProperty(e,"__esModule",{value:!0})});

package/chunk/chunk-progressbar.component.d.ts

@@ -3,6 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { ProgressBarBase } from '../common/progressbar-base';
+import { ElementRef, Renderer2 } from '@angular/core';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import * as i0 from "@angular/core";
 /**
@@ -24,6 +25,8 @@ import * as i0 from "@angular/core";
  */
 export declare class ChunkProgressBarComponent extends ProgressBarBase {
     localization: LocalizationService;
+    elem: ElementRef;
+    renderer: Renderer2;
     /**
      * Sets the number of chunks into which the ChunkProgressBar will be split.
      * Defaults to `5`.
@@ -35,28 +38,28 @@ export declare class ChunkProgressBarComponent extends ProgressBarBase {
     get chunks(): boolean[];
     /**
      * The CSS styles that will be rendered on the full chunk elements ([see example]({% slug chunkprogressbar_appearance %})).
-     * Supports the type of values that are supported by [`ngStyle`]({{ site.data.urls.angular['ngstyleapi'] }}).
+     * Supports the type of values that are supported by [`ngStyle`](link:site.data.urls.angular['ngstyleapi']).
      */
     progressCssStyle: {
         [key: string]: string;
     };
     /**
      * The CSS classes that will be rendered on the full chunk elements ([see example]({% slug chunkprogressbar_appearance %})).
-     * Supports the type of values that are supported by [`ngClass`]({{ site.data.urls.angular['ngclassapi'] }}).
+     * Supports the type of values that are supported by [`ngClass`](link:site.data.urls.angular['ngclassapi']).
      */
     progressCssClass: string | string[] | Set<string> | {
         [key: string]: any;
     };
     /**
      * The CSS styles that will be rendered on the empty chunk elements ([see example]({% slug chunkprogressbar_appearance %})).
-     * Supports the type of values that are supported by [`ngStyle`]({{ site.data.urls.angular['ngstyleapi'] }}).
+     * Supports the type of values that are supported by [`ngStyle`](link:site.data.urls.angular['ngstyleapi']).
      */
     emptyCssStyle: {
         [key: string]: string;
     };
     /**
      * The CSS classes that will be rendered on the empty chunk elements ([see example]({% slug chunkprogressbar_appearance %})).
-     * Supports the type of values that are supported by [`ngClass`]({{ site.data.urls.angular['ngclassapi'] }}).
+     * Supports the type of values that are supported by [`ngClass`](link:site.data.urls.angular['ngclassapi']).
      */
     emptyCssClass: string | string[] | Set<string> | {
         [key: string]: any;
@@ -73,7 +76,7 @@ export declare class ChunkProgressBarComponent extends ProgressBarBase {
     /**
      * @hidden
      */
-    constructor(localization: LocalizationService);
+    constructor(localization: LocalizationService, elem: ElementRef, renderer: Renderer2);
     static ɵfac: i0.ɵɵFactoryDeclaration<ChunkProgressBarComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ChunkProgressBarComponent, "kendo-chunkprogressbar", ["kendoChunkProgressBar"], { "chunkCount": "chunkCount"; "progressCssStyle": "progressCssStyle"; "progressCssClass": "progressCssClass"; "emptyCssStyle": "emptyCssStyle"; "emptyCssClass": "emptyCssClass"; }, {}, never, never>;
 }

package/circularprogressbar/circular-progressbar.component.d.ts

@@ -28,10 +28,14 @@ import * as i0 from "@angular/core";
 export declare class CircularProgressBarComponent implements AfterViewInit, OnChanges, OnDestroy {
     private renderer;
     private cdr;
-    private localizationService;
+    private localization;
     private element;
     private zone;
     hostClasses: boolean;
+    get ariaMinAttribute(): string;
+    get ariaMaxAttribute(): string;
+    get ariaValueAttribute(): string;
+    roleAttribute: string;
     /**
      * Sets the default value of the Circular Progressbar between `min` and `max`.
      *
@@ -92,7 +96,7 @@ export declare class CircularProgressBarComponent implements AfterViewInit, OnCh
     private internalValue;
     private rtl;
     private subscriptions;
-    constructor(renderer: Renderer2, cdr: ChangeDetectorRef, localizationService: LocalizationService, element: ElementRef, zone: NgZone);
+    constructor(renderer: Renderer2, cdr: ChangeDetectorRef, localization: LocalizationService, element: ElementRef, zone: NgZone);
     ngAfterViewInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngOnDestroy(): void;

package/common/localization/custom-messages.component.d.ts

@@ -0,0 +1,18 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { ProgressBarMessages } from './messages';
+import * as i0 from "@angular/core";
+/**
+ * Custom component messages override default component messages
+ * ([see example]({% slug rtl_layout %})).
+ */
+export declare class ProgressBarCustomMessagesComponent extends ProgressBarMessages {
+    protected service: LocalizationService;
+    constructor(service: LocalizationService);
+    protected get override(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ProgressBarCustomMessagesComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ProgressBarCustomMessagesComponent, "kendo-progressbar-messages", never, {}, {}, never, never>;
+}

package/common/localization/localized-messages.directive.d.ts

@@ -0,0 +1,16 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { ProgressBarMessages } from './messages';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export declare class LocalizedProgressBarMessagesDirective extends ProgressBarMessages {
+    protected service: LocalizationService;
+    constructor(service: LocalizationService);
+    static ɵfac: i0.ɵɵFactoryDeclaration<LocalizedProgressBarMessagesDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<LocalizedProgressBarMessagesDirective, "[kendoProgressBarLocalizedMessages]", never, {}, {}, never>;
+}

package/common/localization/messages.d.ts

@@ -0,0 +1,17 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ComponentMessages } from '@progress/kendo-angular-l10n';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export declare class ProgressBarMessages extends ComponentMessages {
+    /**
+     * The aria-label attribute for the ProgressBar component.
+     */
+    progressBarLabel: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ProgressBarMessages, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ProgressBarMessages, "kendo-progressbar-messages-base", never, { "progressBarLabel": "progressBarLabel"; }, {}, never>;
+}

package/common/progressbar-base.d.ts

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { LocalizationService } from '@progress/kendo-angular-l10n';
-import { OnChanges, SimpleChanges } from '@angular/core';
+import { OnChanges, SimpleChanges, ElementRef, Renderer2 } from '@angular/core';
 import { Subscription } from 'rxjs';
 import { ProgressBarOrientation } from '../types/progressbar-orientation';
 import * as i0 from "@angular/core";
@@ -11,8 +11,10 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export declare abstract class ProgressBarBase implements OnChanges {
+    protected elem: ElementRef;
+    protected renderer: Renderer2;
     protected localization: LocalizationService;
-    widgetClasses: boolean;
+    hostClasses: boolean;
     get isHorizontal(): boolean;
     get isVertical(): boolean;
     get disabledClass(): boolean;
@@ -96,7 +98,8 @@ export declare abstract class ProgressBarBase implements OnChanges {
     /**
      * @hidden
      */
-    constructor(localization: LocalizationService);
+    constructor(elem: ElementRef, renderer: Renderer2, localization: LocalizationService);
+    ngAfterViewInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ProgressBarBase, never>;

package/esm2015/chunk/chunk-progressbar.component.js

@@ -8,7 +8,8 @@ import { reverseChunks } from '../common/util';
 import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
-import * as i2 from "@angular/common";
+import * as i2 from "../common/localization/localized-messages.directive";
+import * as i3 from "@angular/common";
 /**
  * Represents the [Kendo UI ChunkProgressBar component for Angular]({% slug overview_chunkprogressbar %}).
  *
@@ -30,9 +31,11 @@ export class ChunkProgressBarComponent extends ProgressBarBase {
     /**
      * @hidden
      */
-    constructor(localization) {
-        super(localization);
+    constructor(localization, elem, renderer) {
+        super(elem, renderer, localization);
         this.localization = localization;
+        this.elem = elem;
+        this.renderer = renderer;
         /**
          * Sets the number of chunks into which the ChunkProgressBar will be split.
          * Defaults to `5`.
@@ -78,7 +81,7 @@ export class ChunkProgressBarComponent extends ProgressBarBase {
         return this._orientationStyles;
     }
 }
-ChunkProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChunkProgressBarComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+ChunkProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChunkProgressBarComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
 ChunkProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ChunkProgressBarComponent, selector: "kendo-chunkprogressbar", inputs: { chunkCount: "chunkCount", progressCssStyle: "progressCssStyle", progressCssClass: "progressCssClass", emptyCssStyle: "emptyCssStyle", emptyCssClass: "emptyCssClass" }, providers: [
         LocalizationService,
         {
@@ -86,6 +89,11 @@ ChunkProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             useValue: 'kendo.chunkprogressbar'
         }
     ], exportAs: ["kendoChunkProgressBar"], usesInheritance: true, ngImport: i0, template: `
+        <ng-container kendoProgressBarLocalizedMessages
+            i18n-progressBarLabel="kendo.chunkprogressbar.progressBarLabel|The aria-label attribute for the ChunkProgressBar component."
+            progressBarLabel="Chunk progressbar"
+        >
+        </ng-container>
         <ul class="k-reset">
             <li class="k-item" *ngFor="let chunk of chunks; let i = index;"
                 [class.k-first]="i === 0"
@@ -98,13 +106,18 @@ ChunkProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
                 >
             </li>
         </ul>
-    `, isInline: true, directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    `, isInline: true, directives: [{ type: i2.LocalizedProgressBarMessagesDirective, selector: "[kendoProgressBarLocalizedMessages]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChunkProgressBarComponent, decorators: [{
             type: Component,
             args: [{
                     exportAs: 'kendoChunkProgressBar',
                     selector: 'kendo-chunkprogressbar',
                     template: `
+        <ng-container kendoProgressBarLocalizedMessages
+            i18n-progressBarLabel="kendo.chunkprogressbar.progressBarLabel|The aria-label attribute for the ChunkProgressBar component."
+            progressBarLabel="Chunk progressbar"
+        >
+        </ng-container>
         <ul class="k-reset">
             <li class="k-item" *ngFor="let chunk of chunks; let i = index;"
                 [class.k-first]="i === 0"
@@ -126,7 +139,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         }
                     ]
                 }]
-        }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; }, propDecorators: { chunkCount: [{
+        }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { chunkCount: [{
                 type: Input
             }], progressCssStyle: [{
                 type: Input

package/esm2015/circularprogressbar/circular-progressbar.component.js

@@ -14,7 +14,8 @@ import { CircularProgressbarCenterTemplateDirective } from './center-template.di
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
 import * as i2 from "@progress/kendo-angular-common";
-import * as i3 from "@angular/common";
+import * as i3 from "../common/localization/localized-messages.directive";
+import * as i4 from "@angular/common";
 const DEFAULT_SURFACE_SIZE = 200;
 /**
  * Represents the [Kendo UI Circular ProgressBar component for Angular]({% slug overview_circularprogressbar %}).
@@ -33,13 +34,14 @@ const DEFAULT_SURFACE_SIZE = 200;
  * ```
  */
 export class CircularProgressBarComponent {
-    constructor(renderer, cdr, localizationService, element, zone) {
+    constructor(renderer, cdr, localization, element, zone) {
         this.renderer = renderer;
         this.cdr = cdr;
-        this.localizationService = localizationService;
+        this.localization = localization;
         this.element = element;
         this.zone = zone;
         this.hostClasses = true;
+        this.roleAttribute = 'progressbar';
         /**
          * Indicates whether an animation will be played on value changes.
          *
@@ -64,7 +66,16 @@ export class CircularProgressBarComponent {
         this.internalValue = 0;
         this.subscriptions = new Subscription();
         validatePackage(packageMetadata);
-        this.subscriptions.add(this.localizationService.changes.subscribe(this.rtlChange.bind(this)));
+        this.subscriptions.add(this.localization.changes.subscribe(this.rtlChange.bind(this)));
+    }
+    get ariaMinAttribute() {
+        return String(this.min);
+    }
+    get ariaMaxAttribute() {
+        return String(this.max);
+    }
+    get ariaValueAttribute() {
+        return this.indeterminate ? undefined : String(this.value);
     }
     /**
      * Sets the default value of the Circular Progressbar between `min` and `max`.
@@ -123,6 +134,9 @@ export class CircularProgressBarComponent {
         return this._indeterminate;
     }
     ngAfterViewInit() {
+        const elem = this.element.nativeElement;
+        const ariaLabel = this.localization.get('progressBarLabel');
+        this.renderer.setAttribute(elem, 'aria-label', ariaLabel);
         this.initProgressArc();
     }
     ngOnChanges(changes) {
@@ -348,7 +362,7 @@ export class CircularProgressBarComponent {
         }
     }
     setDirection() {
-        this.rtl = this.localizationService.rtl;
+        this.rtl = this.localization.rtl;
         if (this.element) {
             this.renderer.setAttribute(this.element.nativeElement, 'dir', this.rtl ? 'rtl' : 'ltr');
         }
@@ -357,19 +371,24 @@ export class CircularProgressBarComponent {
         }
     }
     rtlChange() {
-        if (this.element && this.rtl !== this.localizationService.rtl) {
+        if (this.element && this.rtl !== this.localization.rtl) {
             this.setDirection();
         }
     }
 }
 CircularProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CircularProgressBarComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.LocalizationService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-CircularProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CircularProgressBarComponent, selector: "kendo-circularprogressbar", inputs: { value: "value", max: "max", min: "min", animation: "animation", opacity: "opacity", indeterminate: "indeterminate", progressColor: "progressColor" }, outputs: { animationEnd: "animationEnd" }, host: { properties: { "class.k-circular-progressbar": "this.hostClasses" } }, providers: [
+CircularProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CircularProgressBarComponent, selector: "kendo-circularprogressbar", inputs: { value: "value", max: "max", min: "min", animation: "animation", opacity: "opacity", indeterminate: "indeterminate", progressColor: "progressColor" }, outputs: { animationEnd: "animationEnd" }, host: { properties: { "class.k-circular-progressbar": "this.hostClasses", "attr.aria-valuemin": "this.ariaMinAttribute", "attr.aria-valuemax": "this.ariaMaxAttribute", "attr.aria-valuenow": "this.ariaValueAttribute", "attr.role": "this.roleAttribute" } }, providers: [
         LocalizationService,
         {
             provide: L10N_PREFIX,
             useValue: 'kendo.circularprogressbar'
         }
     ], queries: [{ propertyName: "centerTemplate", first: true, predicate: CircularProgressbarCenterTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "progress", first: true, predicate: ["progress"], descendants: true }, { propertyName: "scale", first: true, predicate: ["scale"], descendants: true }, { propertyName: "labelElement", first: true, predicate: ["label"], descendants: true }, { propertyName: "surface", first: true, predicate: ["surface"], descendants: true }], exportAs: ["kendoCircularProgressBar"], usesOnChanges: true, ngImport: i0, template: `
+        <ng-container kendoProgressBarLocalizedMessages
+            i18n-progressBarLabel="kendo.circularprogressbar.progressBarLabel|The aria-label attribute for the Circular ProgressBar component."
+            progressBarLabel="Circular progressbar"
+        >
+        </ng-container>
         <div #surface class="k-circular-progressbar-surface">
             <div>
                 <svg #svg>
@@ -384,13 +403,18 @@ CircularProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
             </div>
         </div>
         <kendo-resize-sensor (resize)="onResize($event)"></kendo-resize-sensor>
-    `, isInline: true, components: [{ type: i2.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    `, isInline: true, components: [{ type: i2.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i3.LocalizedProgressBarMessagesDirective, selector: "[kendoProgressBarLocalizedMessages]" }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CircularProgressBarComponent, decorators: [{
             type: Component,
             args: [{
                     exportAs: 'kendoCircularProgressBar',
                     selector: 'kendo-circularprogressbar',
                     template: `
+        <ng-container kendoProgressBarLocalizedMessages
+            i18n-progressBarLabel="kendo.circularprogressbar.progressBarLabel|The aria-label attribute for the Circular ProgressBar component."
+            progressBarLabel="Circular progressbar"
+        >
+        </ng-container>
         <div #surface class="k-circular-progressbar-surface">
             <div>
                 <svg #svg>
@@ -416,6 +440,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i1.LocalizationService }, { type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-circular-progressbar']
+            }], ariaMinAttribute: [{
+                type: HostBinding,
+                args: ['attr.aria-valuemin']
+            }], ariaMaxAttribute: [{
+                type: HostBinding,
+                args: ['attr.aria-valuemax']
+            }], ariaValueAttribute: [{
+                type: HostBinding,
+                args: ['attr.aria-valuenow']
+            }], roleAttribute: [{
+                type: HostBinding,
+                args: ['attr.role']
             }], value: [{
                 type: Input
             }], max: [{

package/esm2015/common/localization/custom-messages.component.js

@@ -0,0 +1,41 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component, forwardRef } from '@angular/core';
+import { ProgressBarMessages } from './messages';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-l10n";
+/**
+ * Custom component messages override default component messages
+ * ([see example]({% slug rtl_layout %})).
+ */
+export class ProgressBarCustomMessagesComponent extends ProgressBarMessages {
+    constructor(service) {
+        super();
+        this.service = service;
+    }
+    get override() {
+        return true;
+    }
+}
+ProgressBarCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarCustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+ProgressBarCustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ProgressBarCustomMessagesComponent, selector: "kendo-progressbar-messages", providers: [
+        {
+            provide: ProgressBarMessages,
+            useExisting: forwardRef(() => ProgressBarCustomMessagesComponent)
+        }
+    ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarCustomMessagesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    providers: [
+                        {
+                            provide: ProgressBarMessages,
+                            useExisting: forwardRef(() => ProgressBarCustomMessagesComponent)
+                        }
+                    ],
+                    selector: 'kendo-progressbar-messages',
+                    template: ``
+                }]
+        }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });