@progress/kendo-angular-progressbar 3.1.2-dev.202210121050 → 3.1.2-dev.202211080935
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/kendo-angular-progressbar.umd.js +1 -1
- package/chunk/chunk-progressbar.component.d.ts +8 -5
- package/circularprogressbar/circular-progressbar.component.d.ts +6 -2
- package/common/localization/custom-messages.component.d.ts +18 -0
- package/common/localization/localized-messages.directive.d.ts +16 -0
- package/common/localization/messages.d.ts +17 -0
- package/common/progressbar-base.d.ts +6 -3
- package/esm2015/chunk/chunk-progressbar.component.js +19 -6
- package/esm2015/circularprogressbar/circular-progressbar.component.js +44 -8
- package/esm2015/common/localization/custom-messages.component.js +41 -0
- package/esm2015/common/localization/localized-messages.directive.js +36 -0
- package/esm2015/common/localization/messages.js +23 -0
- package/esm2015/common/progressbar-base.js +12 -8
- package/esm2015/main.js +2 -0
- package/esm2015/package-metadata.js +1 -1
- package/esm2015/progressbar.component.js +19 -7
- package/esm2015/progressbar.module.js +22 -3
- package/fesm2015/kendo-angular-progressbar.js +194 -35
- package/main.d.ts +2 -0
- package/package.json +1 -1
- package/progressbar.component.d.ts +8 -7
- package/progressbar.module.d.ts +6 -4
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { Directive, forwardRef } from '@angular/core';
|
|
6
|
+
import { ProgressBarMessages } from './messages';
|
|
7
|
+
import * as i0 from "@angular/core";
|
|
8
|
+
import * as i1 from "@progress/kendo-angular-l10n";
|
|
9
|
+
/**
|
|
10
|
+
* @hidden
|
|
11
|
+
*/
|
|
12
|
+
export class LocalizedProgressBarMessagesDirective extends ProgressBarMessages {
|
|
13
|
+
constructor(service) {
|
|
14
|
+
super();
|
|
15
|
+
this.service = service;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
LocalizedProgressBarMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: LocalizedProgressBarMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
19
|
+
LocalizedProgressBarMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: LocalizedProgressBarMessagesDirective, selector: "[kendoProgressBarLocalizedMessages]", providers: [
|
|
20
|
+
{
|
|
21
|
+
provide: ProgressBarMessages,
|
|
22
|
+
useExisting: forwardRef(() => LocalizedProgressBarMessagesDirective)
|
|
23
|
+
}
|
|
24
|
+
], usesInheritance: true, ngImport: i0 });
|
|
25
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: LocalizedProgressBarMessagesDirective, decorators: [{
|
|
26
|
+
type: Directive,
|
|
27
|
+
args: [{
|
|
28
|
+
providers: [
|
|
29
|
+
{
|
|
30
|
+
provide: ProgressBarMessages,
|
|
31
|
+
useExisting: forwardRef(() => LocalizedProgressBarMessagesDirective)
|
|
32
|
+
}
|
|
33
|
+
],
|
|
34
|
+
selector: `[kendoProgressBarLocalizedMessages]`
|
|
35
|
+
}]
|
|
36
|
+
}], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { Directive, Input } from '@angular/core';
|
|
6
|
+
import { ComponentMessages } from '@progress/kendo-angular-l10n';
|
|
7
|
+
import * as i0 from "@angular/core";
|
|
8
|
+
/**
|
|
9
|
+
* @hidden
|
|
10
|
+
*/
|
|
11
|
+
export class ProgressBarMessages extends ComponentMessages {
|
|
12
|
+
}
|
|
13
|
+
ProgressBarMessages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarMessages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
14
|
+
ProgressBarMessages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ProgressBarMessages, selector: "kendo-progressbar-messages-base", inputs: { progressBarLabel: "progressBarLabel" }, usesInheritance: true, ngImport: i0 });
|
|
15
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarMessages, decorators: [{
|
|
16
|
+
type: Directive,
|
|
17
|
+
args: [{
|
|
18
|
+
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
19
|
+
selector: 'kendo-progressbar-messages-base'
|
|
20
|
+
}]
|
|
21
|
+
}], propDecorators: { progressBarLabel: [{
|
|
22
|
+
type: Input
|
|
23
|
+
}] } });
|
|
@@ -15,9 +15,11 @@ export class ProgressBarBase {
|
|
|
15
15
|
/**
|
|
16
16
|
* @hidden
|
|
17
17
|
*/
|
|
18
|
-
constructor(localization) {
|
|
18
|
+
constructor(elem, renderer, localization) {
|
|
19
|
+
this.elem = elem;
|
|
20
|
+
this.renderer = renderer;
|
|
19
21
|
this.localization = localization;
|
|
20
|
-
this.
|
|
22
|
+
this.hostClasses = true;
|
|
21
23
|
this.roleAttribute = 'progressbar';
|
|
22
24
|
/**
|
|
23
25
|
* The maximum value of the ProgressBar.
|
|
@@ -131,6 +133,11 @@ export class ProgressBarBase {
|
|
|
131
133
|
get _progressRatio() {
|
|
132
134
|
return calculateRatio(this.min, this.max, this.displayValue);
|
|
133
135
|
}
|
|
136
|
+
ngAfterViewInit() {
|
|
137
|
+
const elem = this.elem.nativeElement;
|
|
138
|
+
const label = this.localization.get('progressBarLabel');
|
|
139
|
+
this.renderer.setAttribute(elem, 'aria-label', label);
|
|
140
|
+
}
|
|
134
141
|
ngOnChanges(changes) {
|
|
135
142
|
const min = extractValueFromChanges(changes, 'min', this.min);
|
|
136
143
|
const max = extractValueFromChanges(changes, 'max', this.max);
|
|
@@ -158,17 +165,14 @@ export class ProgressBarBase {
|
|
|
158
165
|
}
|
|
159
166
|
}
|
|
160
167
|
}
|
|
161
|
-
ProgressBarBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarBase, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
162
|
-
ProgressBarBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ProgressBarBase, selector: "ng-component", inputs: { max: "max", min: "min", value: "value", orientation: "orientation", disabled: "disabled", reverse: "reverse", indeterminate: "indeterminate" }, host: { properties: { "class.k-
|
|
168
|
+
ProgressBarBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarBase, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
169
|
+
ProgressBarBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ProgressBarBase, 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: true, ngImport: i0, template: '', isInline: true });
|
|
163
170
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarBase, decorators: [{
|
|
164
171
|
type: Component,
|
|
165
172
|
args: [{
|
|
166
173
|
template: ''
|
|
167
174
|
}]
|
|
168
|
-
}], ctorParameters: function () { return [{ type: i1.LocalizationService }]; }, propDecorators: {
|
|
169
|
-
type: HostBinding,
|
|
170
|
-
args: ['class.k-widget']
|
|
171
|
-
}, {
|
|
175
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }]; }, propDecorators: { hostClasses: [{
|
|
172
176
|
type: HostBinding,
|
|
173
177
|
args: ['class.k-progressbar']
|
|
174
178
|
}], isHorizontal: [{
|
package/esm2015/main.js
CHANGED
|
@@ -7,3 +7,5 @@ export { ChunkProgressBarComponent } from './chunk/chunk-progressbar.component';
|
|
|
7
7
|
export { CircularProgressBarComponent } from './circularprogressbar/circular-progressbar.component';
|
|
8
8
|
export { ProgressBarModule } from './progressbar.module';
|
|
9
9
|
export { CircularProgressbarCenterTemplateDirective } from './circularprogressbar/center-template.directive';
|
|
10
|
+
export { LocalizedProgressBarMessagesDirective } from './common/localization/localized-messages.directive';
|
|
11
|
+
export { ProgressBarCustomMessagesComponent } from './common/localization/custom-messages.component';
|
|
@@ -9,7 +9,7 @@ export const packageMetadata = {
|
|
|
9
9
|
name: '@progress/kendo-angular-progressbar',
|
|
10
10
|
productName: 'Kendo UI for Angular',
|
|
11
11
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
12
|
-
publishDate:
|
|
12
|
+
publishDate: 1667900115,
|
|
13
13
|
version: '',
|
|
14
14
|
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'
|
|
15
15
|
};
|
|
@@ -9,7 +9,8 @@ import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
|
|
|
9
9
|
import { hasObservers } from '@progress/kendo-angular-common';
|
|
10
10
|
import * as i0 from "@angular/core";
|
|
11
11
|
import * as i1 from "@progress/kendo-angular-l10n";
|
|
12
|
-
import * as i2 from "
|
|
12
|
+
import * as i2 from "./common/localization/localized-messages.directive";
|
|
13
|
+
import * as i3 from "@angular/common";
|
|
13
14
|
/**
|
|
14
15
|
* Represents the [Kendo UI ProgressBar component for Angular]({% slug overview_progressbar %}).
|
|
15
16
|
*
|
|
@@ -31,11 +32,12 @@ export class ProgressBarComponent extends ProgressBarBase {
|
|
|
31
32
|
/**
|
|
32
33
|
* @hidden
|
|
33
34
|
*/
|
|
34
|
-
constructor(localization,
|
|
35
|
-
super(localization);
|
|
35
|
+
constructor(localization, elem, renderer, zone) {
|
|
36
|
+
super(elem, renderer, localization);
|
|
36
37
|
this.localization = localization;
|
|
37
|
-
this.
|
|
38
|
+
this.elem = elem;
|
|
38
39
|
this.renderer = renderer;
|
|
40
|
+
this.zone = zone;
|
|
39
41
|
/**
|
|
40
42
|
* Determines whether the status label will be visible.
|
|
41
43
|
* Defaults to `true`—the label will be visible and displayed with the default
|
|
@@ -216,7 +218,7 @@ export class ProgressBarComponent extends ProgressBarBase {
|
|
|
216
218
|
});
|
|
217
219
|
}
|
|
218
220
|
}
|
|
219
|
-
ProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarComponent, deps: [{ token: i1.LocalizationService }, { token: i0.
|
|
221
|
+
ProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
220
222
|
ProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ProgressBarComponent, selector: "kendo-progressbar", inputs: { label: "label", progressCssStyle: "progressCssStyle", progressCssClass: "progressCssClass", emptyCssStyle: "emptyCssStyle", emptyCssClass: "emptyCssClass", animation: "animation" }, outputs: { animationEnd: "animationEnd" }, providers: [
|
|
221
223
|
LocalizationService,
|
|
222
224
|
{
|
|
@@ -224,6 +226,11 @@ ProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
|
|
|
224
226
|
useValue: 'kendo.progressbar'
|
|
225
227
|
}
|
|
226
228
|
], viewQueries: [{ propertyName: "progressStatusElement", first: true, predicate: ["progressStatus"], descendants: true }, { propertyName: "progressStatusWrapperElement", first: true, predicate: ["progressStatusWrap"], descendants: true }], exportAs: ["kendoProgressBar"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
|
|
229
|
+
<ng-container kendoProgressBarLocalizedMessages
|
|
230
|
+
i18n-progressBarLabel="kendo.progressbar.progressBarLabel|The aria-label attribute for the ProgressBar component."
|
|
231
|
+
progressBarLabel="Progressbar"
|
|
232
|
+
>
|
|
233
|
+
</ng-container>
|
|
227
234
|
<span class="k-progress-status-wrap"
|
|
228
235
|
[class.k-progress-start]="isPositionStart"
|
|
229
236
|
[class.k-progress-center]="isPositionCenter"
|
|
@@ -253,13 +260,18 @@ ProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
|
|
|
253
260
|
<span *ngIf="showLabel" class="k-progress-status">{{formattedLabelValue}}</span>
|
|
254
261
|
</span>
|
|
255
262
|
</div>
|
|
256
|
-
`, isInline: true, directives: [{ type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type:
|
|
263
|
+
`, isInline: true, directives: [{ type: i2.LocalizedProgressBarMessagesDirective, selector: "[kendoProgressBarLocalizedMessages]" }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
257
264
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarComponent, decorators: [{
|
|
258
265
|
type: Component,
|
|
259
266
|
args: [{
|
|
260
267
|
exportAs: 'kendoProgressBar',
|
|
261
268
|
selector: 'kendo-progressbar',
|
|
262
269
|
template: `
|
|
270
|
+
<ng-container kendoProgressBarLocalizedMessages
|
|
271
|
+
i18n-progressBarLabel="kendo.progressbar.progressBarLabel|The aria-label attribute for the ProgressBar component."
|
|
272
|
+
progressBarLabel="Progressbar"
|
|
273
|
+
>
|
|
274
|
+
</ng-container>
|
|
263
275
|
<span class="k-progress-status-wrap"
|
|
264
276
|
[class.k-progress-start]="isPositionStart"
|
|
265
277
|
[class.k-progress-center]="isPositionCenter"
|
|
@@ -298,7 +310,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
|
|
|
298
310
|
}
|
|
299
311
|
]
|
|
300
312
|
}]
|
|
301
|
-
}], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.
|
|
313
|
+
}], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }]; }, propDecorators: { label: [{
|
|
302
314
|
type: Input
|
|
303
315
|
}], progressCssStyle: [{
|
|
304
316
|
type: Input
|
|
@@ -9,11 +9,20 @@ import { ProgressBarComponent } from './progressbar.component';
|
|
|
9
9
|
import { ResizeSensorModule } from '@progress/kendo-angular-common';
|
|
10
10
|
import { CircularProgressBarComponent } from './circularprogressbar/circular-progressbar.component';
|
|
11
11
|
import { CircularProgressbarCenterTemplateDirective } from './circularprogressbar/center-template.directive';
|
|
12
|
+
import { LocalizedProgressBarMessagesDirective } from './common/localization/localized-messages.directive';
|
|
13
|
+
import { ProgressBarCustomMessagesComponent } from './common/localization/custom-messages.component';
|
|
12
14
|
import * as i0 from "@angular/core";
|
|
13
|
-
const COMPONENT_DIRECTIVES = [
|
|
15
|
+
const COMPONENT_DIRECTIVES = [
|
|
16
|
+
ProgressBarComponent,
|
|
17
|
+
ChunkProgressBarComponent,
|
|
18
|
+
CircularProgressBarComponent,
|
|
19
|
+
CircularProgressbarCenterTemplateDirective,
|
|
20
|
+
LocalizedProgressBarMessagesDirective,
|
|
21
|
+
ProgressBarCustomMessagesComponent
|
|
22
|
+
];
|
|
14
23
|
const MODULES = [CommonModule, ResizeSensorModule];
|
|
15
24
|
/**
|
|
16
|
-
* Represents the [NgModule](
|
|
25
|
+
* Represents the [NgModule](link:site.data.urls.angular['ngmodules'])
|
|
17
26
|
* definition for the ProgressBar components.
|
|
18
27
|
*
|
|
19
28
|
* @example
|
|
@@ -46,7 +55,17 @@ const MODULES = [CommonModule, ResizeSensorModule];
|
|
|
46
55
|
export class ProgressBarModule {
|
|
47
56
|
}
|
|
48
57
|
ProgressBarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
49
|
-
ProgressBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarModule, declarations: [ProgressBarComponent,
|
|
58
|
+
ProgressBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarModule, declarations: [ProgressBarComponent,
|
|
59
|
+
ChunkProgressBarComponent,
|
|
60
|
+
CircularProgressBarComponent,
|
|
61
|
+
CircularProgressbarCenterTemplateDirective,
|
|
62
|
+
LocalizedProgressBarMessagesDirective,
|
|
63
|
+
ProgressBarCustomMessagesComponent], imports: [CommonModule, ResizeSensorModule], exports: [ProgressBarComponent,
|
|
64
|
+
ChunkProgressBarComponent,
|
|
65
|
+
CircularProgressBarComponent,
|
|
66
|
+
CircularProgressbarCenterTemplateDirective,
|
|
67
|
+
LocalizedProgressBarMessagesDirective,
|
|
68
|
+
ProgressBarCustomMessagesComponent] });
|
|
50
69
|
ProgressBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarModule, imports: [MODULES] });
|
|
51
70
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProgressBarModule, decorators: [{
|
|
52
71
|
type: NgModule,
|