@progress/kendo-angular-indicators 24.2.2 → 25.0.0-develop.2

package/fesm2022/progress-kendo-angular-indicators.mjs

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
-import { HostBinding, Component, Input, isDevMode, ChangeDetectionStrategy, NgModule } from '@angular/core';
+import { HostBinding, ChangeDetectionStrategy, Component, signal, computed, effect, Input, isDevMode, NgModule } from '@angular/core';
 import * as i1 from '@progress/kendo-angular-l10n';
 import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
 import { validatePackage } from '@progress/kendo-licensing';
@@ -43,16 +43,16 @@ class BadgeContainerComponent {
             this.dynamicRTLSubscription.unsubscribe();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: BadgeContainerComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: BadgeContainerComponent, isStandalone: true, selector: "kendo-badge-container", host: { properties: { "class.k-badge-container": "this.hostClass", "attr.dir": "this.direction" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BadgeContainerComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: BadgeContainerComponent, isStandalone: true, selector: "kendo-badge-container", host: { properties: { "class.k-badge-container": "this.hostClass", "attr.dir": "this.direction" } }, providers: [
             LocalizationService,
             {
                 provide: L10N_PREFIX,
                 useValue: 'kendo.badge.component'
             }
-        ], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+        ], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: BadgeContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BadgeContainerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-badge-container',
@@ -64,7 +64,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                         }
                     ],
                     template: `<ng-content></ng-content>`,
-                    standalone: true
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush
                 }]
         }], ctorParameters: () => [{ type: i1.LocalizationService }], propDecorators: { hostClass: [{
                 type: HostBinding,
@@ -82,8 +83,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1783511368,
-    version: '24.2.2',
+    publishDate: 1783688539,
+    version: '25.0.0-develop.2',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -127,44 +128,101 @@ class BadgeComponent {
      *
      * @default "{ vertical: 'top', horizontal: 'end' }"
      */
-    get align() {
-        return this.badgeAlign;
-    }
     set align(align) {
-        this.badgeAlign = Object.assign(this.badgeAlign, align);
+        this._align.set({ ...this._align(), ...align });
+    }
+    get align() {
+        return this._align();
     }
     /**
      * Specifies the size of the Badge ([see example](https://www.telerik.com/kendo-angular-ui/components/indicators/badge/appearance#size)). The default value is set by the Kendo theme.
      */
-    size;
+    set size(value) {
+        this._size.set(value);
+    }
+    get size() {
+        return this._size();
+    }
     /**
      * Specifies the appearance fill style of the Badge ([see example](https://www.telerik.com/kendo-angular-ui/components/indicators/badge/appearance#fill)). The default value is set by the Kendo theme.
      */
-    fill;
+    set fill(value) {
+        this._fill.set(value);
+    }
+    get fill() {
+        return this._fill();
+    }
     /**
      * Specifies the theme color of the Badge.
      * The theme color applies as background and border color, while also amending the text color accordingly
      * ([see example](https://www.telerik.com/kendo-angular-ui/components/indicators/badge/appearance#theme-color)). The default value is set by the Kendo theme.
      */
-    themeColor;
+    set themeColor(value) {
+        this._themeColor.set(value);
+    }
+    get themeColor() {
+        return this._themeColor();
+    }
     /**
      * Specifies the roundness of the Badge ([see example](https://www.telerik.com/kendo-angular-ui/components/indicators/badge/appearance#rounded)). The default value is set by the Kendo theme.
      */
-    rounded;
+    set rounded(value) {
+        this._rounded.set(value);
+    }
+    get rounded() {
+        return this._rounded();
+    }
     /**
      * Specifies the position of the Badge relative to the edge of the parent container element ([see example](https://www.telerik.com/kendo-angular-ui/components/indicators/badge/align-and-position#position)).
      *
      * @default edge
      */
-    position = 'edge';
+    set position(value) {
+        this._position.set(value);
+    }
+    get position() {
+        return this._position();
+    }
     /**
      * Specifies whether to render additional `cutout` border around the Badge ([see example](https://www.telerik.com/kendo-angular-ui/components/indicators/badge/appearance#cutout-border)).
      *
      * @default false
      */
-    cutoutBorder = false;
+    set cutoutBorder(value) {
+        this._cutoutBorder.set(value);
+    }
+    get cutoutBorder() {
+        return this._cutoutBorder();
+    }
+    _align = signal({ vertical: 'top', horizontal: 'end' }, ...(ngDevMode ? [{ debugName: "_align" }] : []));
+    _size = signal(undefined, ...(ngDevMode ? [{ debugName: "_size" }] : []));
+    _fill = signal(undefined, ...(ngDevMode ? [{ debugName: "_fill" }] : []));
+    _themeColor = signal(undefined, ...(ngDevMode ? [{ debugName: "_themeColor" }] : []));
+    _rounded = signal(undefined, ...(ngDevMode ? [{ debugName: "_rounded" }] : []));
+    _position = signal('edge', ...(ngDevMode ? [{ debugName: "_position" }] : []));
+    _cutoutBorder = signal(false, ...(ngDevMode ? [{ debugName: "_cutoutBorder" }] : []));
     badgeClasses = [];
-    badgeAlign = { vertical: 'top', horizontal: 'end' };
+    computedBadgeClasses = computed(() => [
+        this._themeColor() ? `k-badge-${this._themeColor()}` : '',
+        this._fill() ? `k-badge-${this._fill()}` : '',
+        SIZE_CLASSES$1[this._size()],
+        ROUNDED_CLASSES[this._rounded()],
+        `k-${this._align().vertical}-${this._align().horizontal}`,
+        `k-badge-${this._position()}`
+    ].filter((className) => className), ...(ngDevMode ? [{ debugName: "computedBadgeClasses" }] : []));
+    badgeClassEffect = effect(() => {
+        const newClasses = this.computedBadgeClasses();
+        const element = this.element.nativeElement;
+        this.badgeClasses.forEach((className) => {
+            this.renderer.removeClass(element, className);
+        });
+        newClasses.forEach((className) => {
+            if (className) {
+                this.renderer.addClass(element, className);
+            }
+        });
+        this.badgeClasses = newClasses;
+    }, ...(ngDevMode ? [{ debugName: "badgeClassEffect" }] : []));
     dynamicRTLSubscription;
     rtl = false;
     constructor(element, renderer, localizationService) {
@@ -178,48 +236,28 @@ class BadgeComponent {
         });
     }
     ngAfterViewInit() {
+        // Trigger initial class application if effect hasn't run yet
         if (!this.badgeClasses.length) {
             this.setBadgeClasses();
         }
     }
-    ngOnChanges() {
-        this.setBadgeClasses();
-    }
     ngOnDestroy() {
         if (this.dynamicRTLSubscription) {
             this.dynamicRTLSubscription.unsubscribe();
         }
     }
-    alignClass() {
-        return `k-${this.badgeAlign.vertical}-${this.badgeAlign.horizontal}`;
-    }
-    positionClass() {
-        return `k-badge-${this.position}`;
-    }
-    sizeClass() {
-        return SIZE_CLASSES$1[this.size];
-    }
-    roundedClass() {
-        return ROUNDED_CLASSES[this.rounded];
-    }
-    themeColorClass() {
-        return this.themeColor ? `k-badge-${this.themeColor}` : '';
-    }
-    fillClass() {
-        return this.fill ? `k-badge-${this.fill}` : '';
-    }
     setBadgeClasses() {
         const element = this.element.nativeElement;
         this.badgeClasses.forEach((className) => {
             this.renderer.removeClass(element, className);
         });
         this.badgeClasses = [
-            this.themeColorClass(),
-            this.fillClass(),
-            this.sizeClass(),
-            this.roundedClass(),
-            this.alignClass(),
-            this.positionClass()
+            this._themeColor() ? `k-badge-${this._themeColor()}` : '',
+            this._fill() ? `k-badge-${this._fill()}` : '',
+            SIZE_CLASSES$1[this._size()],
+            ROUNDED_CLASSES[this._rounded()],
+            `k-${this._align().vertical}-${this._align().horizontal}`,
+            `k-badge-${this._position()}`
         ].filter((className) => className);
         this.badgeClasses.forEach((className) => {
             if (className) {
@@ -227,16 +265,16 @@ class BadgeComponent {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: BadgeComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: BadgeComponent, isStandalone: true, selector: "kendo-badge", inputs: { align: "align", size: "size", fill: "fill", themeColor: "themeColor", rounded: "rounded", position: "position", cutoutBorder: "cutoutBorder" }, host: { properties: { "class.k-badge": "this.hostClass", "class.k-badge-border-cutout": "this.cutoutBorderClass", "attr.dir": "this.direction" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BadgeComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: BadgeComponent, isStandalone: true, selector: "kendo-badge", inputs: { align: "align", size: "size", fill: "fill", themeColor: "themeColor", rounded: "rounded", position: "position", cutoutBorder: "cutoutBorder" }, host: { properties: { "class.k-badge": "this.hostClass", "class.k-badge-border-cutout": "this.cutoutBorderClass", "attr.dir": "this.direction" } }, providers: [
             LocalizationService,
             {
                 provide: L10N_PREFIX,
                 useValue: 'kendo.badge.component'
             }
-        ], usesOnChanges: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+        ], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: BadgeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BadgeComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-badge',
@@ -248,7 +286,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                         }
                     ],
                     template: `<ng-content></ng-content>`,
-                    standalone: true
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }], propDecorators: { hostClass: [{
                 type: HostBinding,
@@ -312,38 +351,38 @@ class LoaderComponent {
      * @default pulsing
      */
     set type(type) {
-        this.renderer.removeClass(this.loader, TYPE_CLASSES[this.type]);
+        this.renderer.removeClass(this.loader, TYPE_CLASSES[this._type()]);
         this.renderer.addClass(this.loader, TYPE_CLASSES[type]);
-        this._type = type;
+        this._type.set(type);
     }
     get type() {
-        return this._type;
+        return this._type();
     }
     /**
      * Specifies the theme color of the Loader. The default value is set by the Kendo theme.
      */
     set themeColor(themeColor) {
-        this.renderer.removeClass(this.loader, `k-loader-${this.themeColor}`);
+        this.renderer.removeClass(this.loader, `k-loader-${this._themeColor()}`);
         this.renderer.addClass(this.loader, `k-loader-${themeColor}`);
-        this._themeColor = themeColor;
+        this._themeColor.set(themeColor);
     }
     get themeColor() {
-        return this._themeColor;
+        return this._themeColor();
     }
     /**
      * Specifies the size of the Loader. The default value is set by the Kendo theme.
      */
     set size(size) {
-        this.renderer.removeClass(this.loader, SIZE_CLASSES[this.size]);
+        this.renderer.removeClass(this.loader, SIZE_CLASSES[this._size()]);
         this.renderer.addClass(this.loader, SIZE_CLASSES[size]);
-        this._size = size;
+        this._size.set(size);
     }
     get size() {
-        return this._size;
+        return this._size();
     }
-    _type = 'pulsing';
-    _themeColor;
-    _size;
+    _type = signal('pulsing', ...(ngDevMode ? [{ debugName: "_type" }] : []));
+    _themeColor = signal(undefined, ...(ngDevMode ? [{ debugName: "_themeColor" }] : []));
+    _size = signal(undefined, ...(ngDevMode ? [{ debugName: "_size" }] : []));
     loader;
     constructor(element, renderer) {
         this.element = element;
@@ -365,16 +404,16 @@ class LoaderComponent {
         this.themeColor && this.renderer.addClass(this.loader, `k-loader-${this.themeColor}`);
         this.size && this.renderer.addClass(this.loader, SIZE_CLASSES[this.size]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: LoaderComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: LoaderComponent, isStandalone: true, selector: "kendo-loader", inputs: { type: "type", themeColor: "themeColor", size: "size" }, host: { properties: { "class.k-loader": "this.hostClass", "attr.role": "this.role" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LoaderComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: LoaderComponent, isStandalone: true, selector: "kendo-loader", inputs: { type: "type", themeColor: "themeColor", size: "size" }, host: { properties: { "class.k-loader": "this.hostClass", "attr.role": "this.role" } }, ngImport: i0, template: `
         <div class="k-loader-canvas">
           @for (segment of segmentCount; track $index) {
             <span class="k-loader-segment"></span>
           }
         </div>
-        `, isInline: true });
+        `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: LoaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LoaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-loader',
@@ -386,7 +425,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
         </div>
         `,
                     standalone: true,
-                    imports: []
+                    imports: [],
+                    changeDetection: ChangeDetectionStrategy.OnPush
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { hostClass: [{
                 type: HostBinding,
@@ -458,16 +498,17 @@ class SkeletonComponent {
         if (isDevMode() && validAnimations.indexOf(animation) === -1) {
             throw new Error(skeletonAnimationError(animation));
         }
-        if (this.animation) {
-            this.renderer.removeClass(this.hostElement.nativeElement, ANIMATION_CLASSES[this.animation]);
+        const currentAnimation = this._animation();
+        if (currentAnimation && ANIMATION_CLASSES[currentAnimation]) {
+            this.renderer.removeClass(this.hostElement.nativeElement, ANIMATION_CLASSES[currentAnimation]);
         }
         if (animation) {
             this.renderer.addClass(this.hostElement.nativeElement, ANIMATION_CLASSES[animation]);
         }
-        this._animation = animation;
+        this._animation.set(animation);
     }
     get animation() {
-        return this._animation;
+        return this._animation();
     }
     /**
      * Specifies the shape of the Skeleton.
@@ -478,12 +519,12 @@ class SkeletonComponent {
         if (isDevMode() && validShapes.indexOf(shape) === -1) {
             throw new Error(skeletonShapeError(shape));
         }
-        this.renderer.removeClass(this.hostElement.nativeElement, SHAPE_CLASSES[this.shape]);
+        this.renderer.removeClass(this.hostElement.nativeElement, SHAPE_CLASSES[this._shape()]);
         this.renderer.addClass(this.hostElement.nativeElement, SHAPE_CLASSES[shape]);
-        this._shape = shape;
+        this._shape.set(shape);
     }
     get shape() {
-        return this._shape;
+        return this._shape();
     }
     /**
      * Specifies the width of the Skeleton component.
@@ -491,8 +532,12 @@ class SkeletonComponent {
      * Accepts a string like `100px`, `3em`, or `50%`, or an integer number for pixels.
      */
     set width(width) {
+        this._width.set(width);
         this.renderer.setStyle(this.hostElement.nativeElement, "width", typeof width === "string" ? width : width + "px");
     }
+    get width() {
+        return this._width();
+    }
     /**
      * Specifies the height of the Skeleton component.
      * Required for `circle` and `rectangle` shapes.
@@ -500,10 +545,16 @@ class SkeletonComponent {
      * Accepts a string like `100px`, `3em`, or `50%`, or an integer number for pixels.
      */
     set height(height) {
+        this._height.set(height);
         this.renderer.setStyle(this.hostElement.nativeElement, "height", typeof height === "string" ? height : height + "px");
     }
-    _animation = "pulse";
-    _shape = 'text';
+    get height() {
+        return this._height();
+    }
+    _animation = signal("pulse", ...(ngDevMode ? [{ debugName: "_animation" }] : []));
+    _shape = signal('text', ...(ngDevMode ? [{ debugName: "_shape" }] : []));
+    _width = signal(undefined, ...(ngDevMode ? [{ debugName: "_width" }] : []));
+    _height = signal(undefined, ...(ngDevMode ? [{ debugName: "_height" }] : []));
     constructor(renderer, hostElement) {
         this.renderer = renderer;
         this.hostElement = hostElement;
@@ -515,10 +566,10 @@ class SkeletonComponent {
             hostElement.classList.add(ANIMATION_CLASSES[this.animation]);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SkeletonComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: SkeletonComponent, isStandalone: true, selector: "kendo-skeleton", inputs: { animation: "animation", shape: "shape", width: "width", height: "height" }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SkeletonComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: SkeletonComponent, isStandalone: true, selector: "kendo-skeleton", inputs: { animation: "animation", shape: "shape", width: "width", height: "height" }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SkeletonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SkeletonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: "kendo-skeleton",
@@ -576,11 +627,11 @@ const KENDO_INDICATORS = [
  * definition for the Badge and BadgeContainer components.
  */
 class BadgeModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: BadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.25", ngImport: i0, type: BadgeModule, imports: [BadgeComponent, BadgeContainerComponent], exports: [BadgeComponent, BadgeContainerComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: BadgeModule });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: BadgeModule, imports: [BadgeComponent, BadgeContainerComponent], exports: [BadgeComponent, BadgeContainerComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BadgeModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: BadgeModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BadgeModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [...KENDO_BADGECONTAINER],
@@ -594,11 +645,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
  * definition for the Loader component.
  */
 class LoaderModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: LoaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.25", ngImport: i0, type: LoaderModule, imports: [LoaderComponent], exports: [LoaderComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: LoaderModule });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LoaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: LoaderModule, imports: [LoaderComponent], exports: [LoaderComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LoaderModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: LoaderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LoaderModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [...KENDO_LOADER],
@@ -612,11 +663,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
  * definition for the Skeleton component.
  */
 class SkeletonModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SkeletonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.25", ngImport: i0, type: SkeletonModule, imports: [SkeletonComponent], exports: [SkeletonComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SkeletonModule });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SkeletonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: SkeletonModule, imports: [SkeletonComponent], exports: [SkeletonComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SkeletonModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SkeletonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SkeletonModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [...KENDO_SKELETON],
@@ -648,11 +699,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
  * ```
  */
 class IndicatorsModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: IndicatorsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.25", ngImport: i0, type: IndicatorsModule, imports: [BadgeComponent, BadgeContainerComponent, LoaderComponent, SkeletonComponent], exports: [BadgeComponent, BadgeContainerComponent, LoaderComponent, SkeletonComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: IndicatorsModule });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IndicatorsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: IndicatorsModule, imports: [BadgeComponent, BadgeContainerComponent, LoaderComponent, SkeletonComponent], exports: [BadgeComponent, BadgeContainerComponent, LoaderComponent, SkeletonComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IndicatorsModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: IndicatorsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IndicatorsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...KENDO_INDICATORS],