@progress/kendo-angular-gauges 4.1.2 → 5.0.0-dev.202204131907

package/dist/fesm5/index.js

@@ -1,2031 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { __decorate, __metadata, __extends, __param } from 'tslib';
-import { Injectable, NgModule, Input, ViewChild, ElementRef, HostBinding, Directive, Optional, TemplateRef, ContentChild, Component, ChangeDetectionStrategy, ChangeDetectorRef, Renderer2, NgZone, ContentChildren, QueryList } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ResizeSensorModule, ResizeSensorComponent } from '@progress/kendo-angular-common';
-export { ResizeSensorComponent } from '@progress/kendo-angular-common';
-import { IntlService } from '@progress/kendo-angular-intl';
-import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
-import { exportImage, exportSVG, drawDOM } from '@progress/kendo-drawing';
-import { validatePackage } from '@progress/kendo-licensing';
-import { ArcGauge, LinearGauge, RadialGauge, CircularGauge } from '@progress/kendo-charts';
-
-function isObject(value) {
-    return typeof value === "object";
-}
-function diffOptions(original, current) {
-    if (Object.keys(original).length !== Object.keys(current).length) {
-        return true;
-    }
-    for (var field in original) {
-        if (field !== 'value' && original.hasOwnProperty(field)) {
-            var originalValue = original[field];
-            var currentValue = current[field];
-            var diff = isObject(originalValue) && isObject(currentValue) ?
-                diffOptions(originalValue, currentValue) : originalValue !== currentValue;
-            if (diff) {
-                return true;
-            }
-        }
-    }
-}
-function diffPointerOptions(original, current) {
-    if (!original || !current) {
-        return true;
-    }
-    original = [].concat(original);
-    current = [].concat(current);
-    if (original.length !== current.length) {
-        return true;
-    }
-    for (var idx = 0; idx < original.length; idx++) {
-        if (diffOptions(original[idx], current[idx])) {
-            return true;
-        }
-    }
-}
-/**
- * @hidden
- */
-var ConfigurationService = /** @class */ (function () {
-    function ConfigurationService() {
-        this.options = {};
-    }
-    ConfigurationService.prototype.copyChanges = function (prefix, changes) {
-        for (var propertyName in changes) {
-            if (!changes.hasOwnProperty(propertyName)) {
-                continue;
-            }
-            var value = changes[propertyName].currentValue;
-            var optionName = (prefix ? prefix + '.' : '') + propertyName;
-            this.set(optionName, value);
-        }
-    };
-    ConfigurationService.prototype.read = function () {
-        this.hasChanges = false;
-        this.valueChange = false;
-        return this.options;
-    };
-    ConfigurationService.prototype.readValues = function () {
-        this.valueChange = false;
-        var pointers = [].concat(this.options.pointer);
-        return pointers.map(function (pointer) { return pointer.value; });
-    };
-    ConfigurationService.prototype.readValue = function () {
-        this.valueChange = false;
-        return this.options.value;
-    };
-    ConfigurationService.prototype.set = function (field, value) {
-        var _a = this.optionContext(field), key = _a.key, options = _a.options;
-        if (!this.hasChanges && (key === 'value' || (key === 'pointer' && !diffPointerOptions(this.options.pointer, value)))) {
-            this.valueChange = true;
-        }
-        else {
-            this.hasChanges = true;
-            this.valueChange = false;
-        }
-        options[key] = value;
-    };
-    ConfigurationService.prototype.optionContext = function (field) {
-        var parts = field.split('.');
-        var options = this.options;
-        var key = parts.shift();
-        while (parts.length > 0) {
-            options = options[key] = options[key] || {};
-            key = parts.shift();
-        }
-        return { key: key, options: options };
-    };
-    ConfigurationService = __decorate([
-        Injectable()
-    ], ConfigurationService);
-    return ConfigurationService;
-}());
-
-/**
- * @hidden
- */
-var CollectionChangesService = /** @class */ (function () {
-    function CollectionChangesService() {
-    }
-    CollectionChangesService = __decorate([
-        Injectable()
-    ], CollectionChangesService);
-    return CollectionChangesService;
-}());
-
-var template = "\n    <div class=\"k-var--gauge-pointer\"></div>\n    <div class=\"k-var--gauge-track\"></div>\n    <div class=\"k-var--normal-text-color\"></div>\n";
-/**
- * @hidden
- */
-var ThemeService = /** @class */ (function () {
-    function ThemeService() {
-    }
-    ThemeService.prototype.read = function () {
-        if (!this.options) {
-            this.load();
-        }
-        return this.options;
-    };
-    ThemeService.prototype.load = function () {
-        if (typeof document === 'undefined') {
-            this.options = {};
-            return;
-        }
-        var container = document.createElement('div');
-        container.style.display = 'none';
-        container.innerHTML = template;
-        document.body.appendChild(container);
-        try {
-            var pointerColor = this.getColor(container, 'gauge-pointer');
-            var rangePlaceholder = this.getColor(container, 'gauge-track');
-            var textColor = this.getColor(container, 'normal-text-color');
-            this.options = {
-                pointer: {
-                    color: pointerColor
-                },
-                scale: {
-                    labels: {
-                        color: textColor
-                    },
-                    rangePlaceholderColor: rangePlaceholder,
-                    minorTicks: {
-                        color: textColor
-                    },
-                    majorTicks: {
-                        color: textColor
-                    },
-                    line: {
-                        color: textColor
-                    }
-                }
-            };
-        }
-        finally {
-            document.body.removeChild(container);
-        }
-    };
-    ThemeService.prototype.getColor = function (container, varName) {
-        return window.getComputedStyle(container.querySelector(".k-var--" + varName)).backgroundColor;
-    };
-    ThemeService = __decorate([
-        Injectable()
-    ], ThemeService);
-    return ThemeService;
-}());
-
-/**
- * @hidden
- */
-var SharedModule = /** @class */ (function () {
-    function SharedModule() {
-    }
-    SharedModule = __decorate([
-        NgModule({
-            exports: [ResizeSensorModule],
-            providers: [
-                ThemeService
-            ]
-        })
-    ], SharedModule);
-    return SharedModule;
-}());
-
-/**
- * @hidden
- */
-var CollectionComponent = /** @class */ (function () {
-    function CollectionComponent(key, configurationService, collectionChangesService) {
-        this.key = key;
-        this.configurationService = configurationService;
-        this.collectionChangesService = collectionChangesService;
-    }
-    CollectionComponent.prototype.ngOnDestroy = function () {
-        this.subscription.unsubscribe();
-        this.configurationService.set(this.key, []);
-    };
-    CollectionComponent.prototype.ngAfterContentInit = function () {
-        var _this = this;
-        this.subscription = this.children.changes.subscribe(function () { return _this.collectionChangesService.hasChanges = true; });
-    };
-    CollectionComponent.prototype.ngAfterContentChecked = function () {
-        if (this.collectionChangesService.hasChanges) {
-            this.configurationService.set(this.key, this.readItems());
-            this.collectionChangesService.hasChanges = false;
-        }
-    };
-    CollectionComponent.prototype.readItems = function () {
-        return this.children.map(function (child) { return Object.assign({}, child.configurationService.read()); });
-    };
-    return CollectionComponent;
-}());
-
-/**
- * @hidden
- */
-var CollectionItemComponent = /** @class */ (function () {
-    function CollectionItemComponent(configurationService, collectionChangesService) {
-        this.configurationService = configurationService;
-        this.collectionChangesService = collectionChangesService;
-    }
-    CollectionItemComponent.prototype.ngOnChanges = function (changes) {
-        this.configurationService.copyChanges('', changes);
-        this.collectionChangesService.hasChanges = true;
-    };
-    return CollectionItemComponent;
-}());
-
-/**
- * @hidden
- */
-var packageMetadata = {
-    name: '@progress/kendo-angular-gauges',
-    productName: 'Kendo UI for Angular',
-    productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1642594016,
-    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'
-};
-
-var inDocument = function (element) {
-    var node = element;
-    while (node && node !== document.body) {
-        node = node.parentNode;
-    }
-    return Boolean(node);
-};
-/**
- * @hidden
- */
-var GaugeComponent = /** @class */ (function () {
-    function GaugeComponent(configurationService, themeService, intlService, localizationService, element, renderer, ngZone) {
-        this.configurationService = configurationService;
-        this.themeService = themeService;
-        this.intlService = intlService;
-        this.localizationService = localizationService;
-        this.element = element;
-        this.renderer = renderer;
-        this.ngZone = ngZone;
-        /**
-         * The maximum number of times the Gauge resizes per second.
-         * Defaults to `10`. To disable the automatic resizing, set `resizeRateLimit` to `0`.
-         */
-        this.resizeRateLimit = 10;
-        this.className = true;
-        this.theme = null;
-        this.rtl = false;
-        validatePackage(packageMetadata);
-    }
-    GaugeComponent.prototype.ngOnInit = function () {
-        this.setDirection();
-        this.subscriptions = this.intlService.changes.subscribe(this.intlChange.bind(this));
-        this.subscriptions.add(this.localizationService.changes.subscribe(this.rtlChange.bind(this)));
-    };
-    GaugeComponent.prototype.ngAfterViewChecked = function () {
-        var _this = this;
-        if (typeof document === 'undefined') {
-            return;
-        }
-        var updateMethod;
-        if (!this.instance) {
-            updateMethod = this.init;
-        }
-        else if (this.configurationService.hasChanges) {
-            updateMethod = this.updateOptions;
-        }
-        else if (this.configurationService.valueChange) {
-            updateMethod = this.setValues;
-        }
-        if (updateMethod) {
-            clearTimeout(this.redrawTimeout);
-            if (!this.instance && !inDocument(this.element.nativeElement)) { // required in case the gauge is initialized by ng-content outside of the DOM
-                this.defer(function () {
-                    _this.updateCall(updateMethod);
-                });
-            }
-            else {
-                this.updateCall(updateMethod);
-            }
-        }
-    };
-    GaugeComponent.prototype.updateCall = function (updateMethod) {
-        this.updateDirection();
-        updateMethod.call(this);
-        this.updateSize();
-    };
-    GaugeComponent.prototype.updateOptions = function () {
-        this.instance.setOptions(this.configurationService.read());
-    };
-    GaugeComponent.prototype.setValues = function () {
-        this.instance.allValues(this.configurationService.readValues());
-    };
-    GaugeComponent.prototype.ngOnChanges = function (changes) {
-        this.configurationService.copyChanges('', changes);
-    };
-    GaugeComponent.prototype.ngOnDestroy = function () {
-        if (this.instance) {
-            this.instance.destroy();
-        }
-        this.subscriptions.unsubscribe();
-        clearTimeout(this.redrawTimeout);
-    };
-    /**
-     * Exports the Gauge as an image. The export operation is asynchronous and returns a promise.
-     *
-     * @param {ImageExportOptions} options - The parameters for the exported image.
-     * @returns {Promise<string>} - A promise that will be resolved with a PNG image that is encoded as a Data URI.
-     */
-    GaugeComponent.prototype.exportImage = function (options) {
-        if (options === void 0) { options = {}; }
-        return this.exportVisual().then(function (visual) {
-            return exportImage(visual, options);
-        });
-    };
-    /**
-     * Exports the Gauge as an SVG document. The export operation is asynchronous and returns a promise.
-     *
-     * @param {SVGExportOptions} options - The parameters for the exported file.
-     * @returns {Promise<string>} - A promise that will be resolved with an SVG document that is encoded as a Data URI.
-     */
-    GaugeComponent.prototype.exportSVG = function (options) {
-        if (options === void 0) { options = {}; }
-        return this.exportVisual().then(function (visual) {
-            return exportSVG(visual, options);
-        });
-    };
-    /**
-     * Exports the Gauge as a Drawing `Scene`.
-     *
-     * @returns {Promise<Group>} - A promise that will be resolved with the export visual.
-     */
-    GaugeComponent.prototype.exportVisual = function () {
-        return Promise.resolve(this.instance.exportVisual());
-    };
-    /**
-     * @hidden
-     */
-    GaugeComponent.prototype.onResize = function (_event) {
-        if (this.autoResize) {
-            this.resize();
-        }
-    };
-    /**
-     * Detects the size of the container and redraws the Gauge.
-     * Resizing is automatic unless you set the `resizeRateLimit` option to `0`.
-     */
-    GaugeComponent.prototype.resize = function () {
-        if (this.instance) {
-            this.instance.resize();
-        }
-    };
-    GaugeComponent.prototype.init = function () {
-        if (!this.surfaceElement) {
-            return;
-        }
-        this.createInstance(this.surfaceElement.nativeElement, this.configurationService.read(), this.themeService.read(), {
-            intlService: this.intlService,
-            rtl: this.rtl
-        });
-    };
-    Object.defineProperty(GaugeComponent.prototype, "autoResize", {
-        get: function () {
-            return this.resizeRateLimit > 0;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    GaugeComponent.prototype.updateSize = function () {
-        this.resizeSensor.acceptSize();
-    };
-    GaugeComponent.prototype.intlChange = function () {
-        if (this.instance) {
-            this.deferredRedraw();
-        }
-    };
-    GaugeComponent.prototype.rtlChange = function () {
-        if (this.instance && this.rtl !== this.isRTL) {
-            this.deferredRedraw();
-        }
-    };
-    GaugeComponent.prototype.deferredRedraw = function () {
-        var _this = this;
-        this.defer(function () {
-            _this.updateDirection();
-            _this.instance.noTransitionsRedraw();
-        });
-    };
-    GaugeComponent.prototype.defer = function (callback) {
-        var _this = this;
-        this.ngZone.runOutsideAngular(function () {
-            clearTimeout(_this.redrawTimeout);
-            _this.redrawTimeout = setTimeout(callback, 0);
-        });
-    };
-    GaugeComponent.prototype.updateDirection = function () {
-        var current = this.isRTL;
-        if (this.rtl !== current) {
-            this.setDirection();
-            if (this.instance) {
-                this.instance.setDirection(current);
-            }
-        }
-    };
-    GaugeComponent.prototype.setDirection = function () {
-        this.rtl = this.isRTL;
-        if (this.element) {
-            this.renderer.setAttribute(this.element.nativeElement, 'dir', this.rtl ? 'rtl' : 'ltr');
-        }
-    };
-    Object.defineProperty(GaugeComponent.prototype, "isRTL", {
-        get: function () {
-            return Boolean(this.localizationService.rtl);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], GaugeComponent.prototype, "gaugeArea", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], GaugeComponent.prototype, "renderAs", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], GaugeComponent.prototype, "resizeRateLimit", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], GaugeComponent.prototype, "scale", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Boolean)
-    ], GaugeComponent.prototype, "transitions", void 0);
-    __decorate([
-        ViewChild('surface', { static: true }),
-        __metadata("design:type", ElementRef)
-    ], GaugeComponent.prototype, "surfaceElement", void 0);
-    __decorate([
-        ViewChild(ResizeSensorComponent, { static: true }),
-        __metadata("design:type", ResizeSensorComponent)
-    ], GaugeComponent.prototype, "resizeSensor", void 0);
-    __decorate([
-        HostBinding('class.k-gauge'),
-        __metadata("design:type", Boolean)
-    ], GaugeComponent.prototype, "className", void 0);
-    return GaugeComponent;
-}());
-
-/**
- * @hidden
- */
-var SettingsComponent = /** @class */ (function () {
-    function SettingsComponent(key, configurationService) {
-        this.key = key;
-        this.configurationService = configurationService;
-    }
-    SettingsComponent.prototype.ngOnChanges = function (changes) {
-        this.configurationService.copyChanges(this.key, changes);
-    };
-    SettingsComponent.prototype.ngOnDestroy = function () {
-        this.configurationService.set(this.key, null);
-    };
-    return SettingsComponent;
-}());
-
-/**
- * @hidden
- */
-var GaugeAreaComponent = /** @class */ (function (_super) {
-    __extends(GaugeAreaComponent, _super);
-    function GaugeAreaComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], GaugeAreaComponent.prototype, "background", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], GaugeAreaComponent.prototype, "border", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], GaugeAreaComponent.prototype, "height", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], GaugeAreaComponent.prototype, "margin", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], GaugeAreaComponent.prototype, "width", void 0);
-    return GaugeAreaComponent;
-}(SettingsComponent));
-
-/**
- * @hidden
- */
-var LabelsComponent = /** @class */ (function (_super) {
-    __extends(LabelsComponent, _super);
-    function LabelsComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], LabelsComponent.prototype, "background", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LabelsComponent.prototype, "border", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], LabelsComponent.prototype, "color", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], LabelsComponent.prototype, "font", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], LabelsComponent.prototype, "format", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LabelsComponent.prototype, "margin", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LabelsComponent.prototype, "padding", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Function)
-    ], LabelsComponent.prototype, "content", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Boolean)
-    ], LabelsComponent.prototype, "visible", void 0);
-    return LabelsComponent;
-}(SettingsComponent));
-
-/**
- * @hidden
- */
-var RangeComponent = /** @class */ (function (_super) {
-    __extends(RangeComponent, _super);
-    function RangeComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RangeComponent.prototype, "from", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RangeComponent.prototype, "to", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RangeComponent.prototype, "opacity", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], RangeComponent.prototype, "color", void 0);
-    return RangeComponent;
-}(CollectionItemComponent));
-
-/**
- * @hidden
- */
-var ScaleComponent = /** @class */ (function (_super) {
-    __extends(ScaleComponent, _super);
-    function ScaleComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], ScaleComponent.prototype, "labels", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], ScaleComponent.prototype, "majorTicks", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], ScaleComponent.prototype, "minorTicks", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ScaleComponent.prototype, "min", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ScaleComponent.prototype, "max", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ScaleComponent.prototype, "minorUnit", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ScaleComponent.prototype, "majorUnit", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Boolean)
-    ], ScaleComponent.prototype, "reverse", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ScaleComponent.prototype, "rangeSize", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], ScaleComponent.prototype, "rangePlaceholderColor", void 0);
-    return ScaleComponent;
-}(SettingsComponent));
-
-/**
- * A directive that selects a [template]({{ site.data.urls.angular['templatesyntax'] }})
- * within the `<kendo-arcgauge>` component which will be used for the center template
- * ([more information and example]({% slug centertemplate_arcgauge %})).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-arcgauge [value]="value">
- *             <ng-template kendoArcGaugeCenterTemplate let-value="value">
- *                 {{ value }}%
- *             </ng-template>
- *         </kendo-arcgauge>
- *
- *     `
- * })
- * export class AppComponent {
- *   public value: number = 10;
- * }
- *
- * ```
- */
-var ArcCenterTemplateDirective = /** @class */ (function () {
-    function ArcCenterTemplateDirective(templateRef) {
-        this.templateRef = templateRef;
-    }
-    ArcCenterTemplateDirective = __decorate([
-        Directive({
-            selector: '[kendoArcGaugeCenterTemplate]'
-        }),
-        __param(0, Optional()),
-        __metadata("design:paramtypes", [TemplateRef])
-    ], ArcCenterTemplateDirective);
-    return ArcCenterTemplateDirective;
-}());
-
-/* tslint:disable:use-life-cycle-interface */
-/**
- * Represents the [Kendo UI ArcGauge component for Angular]({% slug overview_arcgauge_gauges %}).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *   selector: 'my-app',
- *   template: `
- *      <kendo-arcgauge [value]="value" [scale]="{ max: 100 }">
- *          <ng-template kendoArcGaugeCenterTemplate let-value="value">
- *              {{ value }}%
- *          </ng-template>
- *      </kendo-arcgauge>
- *   `
- * })
- * class AppComponent {
- *   public value: number = 10;
- * }
- *
- * ```
- */
-var ArcGaugeComponent = /** @class */ (function (_super) {
-    __extends(ArcGaugeComponent, _super);
-    function ArcGaugeComponent(changeDetector, configurationService, themeService, intlService, localizationService, element, renderer, ngZone) {
-        var _this = _super.call(this, configurationService, themeService, intlService, localizationService, element, renderer, ngZone) || this;
-        _this.changeDetector = changeDetector;
-        _this.className = true;
-        _this.centerTemplateContext = {};
-        return _this;
-    }
-    ArcGaugeComponent.prototype.ngOnInit = function () {
-        _super.prototype.ngOnInit.call(this);
-        if (this.element) {
-            this.renderer.setStyle(this.element.nativeElement, 'position', 'relative');
-        }
-    };
-    ArcGaugeComponent.prototype.ngAfterViewChecked = function () {
-        _super.prototype.ngAfterViewChecked.call(this);
-        if (this.labelElement && !this.centerTemplate) {
-            this.changeDetector.detectChanges();
-        }
-        else if (!this.labelElement && this.centerTemplate) {
-            this.updateCenterTemplate();
-        }
-    };
-    /**
-     * Exports the gauge as a Drawing `Scene`.
-     *
-     * @returns {Promise<Group>} - A promise that will be resolved with the export visual.
-     */
-    ArcGaugeComponent.prototype.exportVisual = function () {
-        return drawDOM(this.element.nativeElement);
-    };
-    /**
-     * Detects the size of the container and redraws the Gauge.
-     * Resizing is automatic unless you set the `resizeRateLimit` option to `0`.
-     */
-    ArcGaugeComponent.prototype.resize = function () {
-        _super.prototype.resize.call(this);
-        this.updateCenterTemplate();
-    };
-    ArcGaugeComponent.prototype.createInstance = function (element, options, theme, context) {
-        this.instance = new ArcGauge(element, options, theme, context);
-        this.updateElements();
-    };
-    ArcGaugeComponent.prototype.updateOptions = function () {
-        _super.prototype.updateOptions.call(this);
-        this.updateElements();
-    };
-    ArcGaugeComponent.prototype.setValues = function () {
-        var value = this.configurationService.readValue();
-        this.instance.value(value);
-        this.updateCenterTemplate();
-    };
-    ArcGaugeComponent.prototype.updateElements = function () {
-        this.resizeSensor.acceptSize();
-        this.updateCenterTemplate();
-    };
-    ArcGaugeComponent.prototype.updateCenterTemplate = function () {
-        if (!this.instance || !this.centerTemplate) {
-            return;
-        }
-        this.centerTemplateContext.value = this.instance.value();
-        this.centerTemplateContext.color = this.instance.currentColor();
-        this.changeDetector.detectChanges();
-        this.positionLabel();
-    };
-    ArcGaugeComponent.prototype.positionLabel = function () {
-        if (!this.labelElement) {
-            return;
-        }
-        var element = this.labelElement.nativeElement;
-        var width = element.offsetWidth;
-        var height = element.offsetHeight;
-        var position = this.instance.centerLabelPosition(width, height);
-        element.style.top = position.top + "px";
-        element.style.left = position.left + "px";
-    };
-    //tslint:disable-next-line: no-empty
-    ArcGaugeComponent.prototype.updateSize = function () {
-    };
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ArcGaugeComponent.prototype, "value", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], ArcGaugeComponent.prototype, "color", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Array)
-    ], ArcGaugeComponent.prototype, "colors", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ArcGaugeComponent.prototype, "opacity", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], ArcGaugeComponent.prototype, "scale", void 0);
-    __decorate([
-        ContentChild(ArcCenterTemplateDirective, { static: false }),
-        __metadata("design:type", ArcCenterTemplateDirective)
-    ], ArcGaugeComponent.prototype, "centerTemplate", void 0);
-    __decorate([
-        ViewChild("label", { static: false }),
-        __metadata("design:type", ElementRef)
-    ], ArcGaugeComponent.prototype, "labelElement", void 0);
-    __decorate([
-        HostBinding('class.k-arcgauge'),
-        __metadata("design:type", Boolean)
-    ], ArcGaugeComponent.prototype, "className", void 0);
-    ArcGaugeComponent = __decorate([
-        Component({
-            changeDetection: ChangeDetectionStrategy.OnPush,
-            exportAs: 'kendoArcGauge',
-            providers: [
-                ConfigurationService,
-                LocalizationService,
-                {
-                    provide: L10N_PREFIX,
-                    useValue: 'kendo.arcgauge'
-                }
-            ],
-            selector: 'kendo-arcgauge',
-            template: "\n    <div #surface class='k-chart-surface'></div>\n    <div class=\"k-arcgauge-label\" *ngIf=\"centerTemplate\" #label>\n        <ng-template [ngTemplateOutlet]=\"centerTemplate.templateRef\" [ngTemplateOutletContext]=\"centerTemplateContext\"></ng-template>\n    </div>\n    <kendo-resize-sensor (resize)=\"onResize($event)\" [rateLimit]=\"resizeRateLimit\"></kendo-resize-sensor>\n  "
-        }),
-        __metadata("design:paramtypes", [ChangeDetectorRef,
-            ConfigurationService,
-            ThemeService,
-            IntlService,
-            LocalizationService,
-            ElementRef,
-            Renderer2,
-            NgZone])
-    ], ArcGaugeComponent);
-    return ArcGaugeComponent;
-}(GaugeComponent));
-
-/**
- * The configuration options of the ArcGauge area.
- * Represents the entire visible area of the ArcGauge.
- */
-var ArcGaugeAreaComponent = /** @class */ (function (_super) {
-    __extends(ArcGaugeAreaComponent, _super);
-    function ArcGaugeAreaComponent(configurationService) {
-        var _this = _super.call(this, 'gaugeArea', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    ArcGaugeAreaComponent = __decorate([
-        Component({
-            selector: 'kendo-arcgauge-area',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], ArcGaugeAreaComponent);
-    return ArcGaugeAreaComponent;
-}(GaugeAreaComponent));
-
-/**
- * The configuration options for the scale of the ArcGauge
- * ([see example]({% slug scaleoptions_arcgauge %})).
- */
-var ArcScaleComponent = /** @class */ (function (_super) {
-    __extends(ArcScaleComponent, _super);
-    function ArcScaleComponent(configurationService) {
-        var _this = _super.call(this, 'scale', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], ArcScaleComponent.prototype, "labels", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ArcScaleComponent.prototype, "rangeDistance", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], ArcScaleComponent.prototype, "rangeLineCap", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ArcScaleComponent.prototype, "startAngle", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ArcScaleComponent.prototype, "endAngle", void 0);
-    ArcScaleComponent = __decorate([
-        Component({
-            selector: 'kendo-arcgauge-scale',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], ArcScaleComponent);
-    return ArcScaleComponent;
-}(ScaleComponent));
-
-/**
- * The configuration options for the scale labels of the RadialGauge.
- */
-var RadialLabelsComponent = /** @class */ (function (_super) {
-    __extends(RadialLabelsComponent, _super);
-    function RadialLabelsComponent(configurationService) {
-        var _this = _super.call(this, 'scale.labels', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], RadialLabelsComponent.prototype, "position", void 0);
-    RadialLabelsComponent = __decorate([
-        Component({
-            selector: 'kendo-radialgauge-scale-labels',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], RadialLabelsComponent);
-    return RadialLabelsComponent;
-}(LabelsComponent));
-
-/**
- * The configuration options for the scale labels of the ArcGauge.
- */
-var ArcLabelsComponent = /** @class */ (function (_super) {
-    __extends(ArcLabelsComponent, _super);
-    function ArcLabelsComponent(configurationService) {
-        var _this = _super.call(this, configurationService) || this;
-        _this.configurationService = configurationService;
-        configurationService.set(_this.key + ".visible", true);
-        return _this;
-    }
-    ArcLabelsComponent = __decorate([
-        Component({
-            selector: 'kendo-arcgauge-scale-labels',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], ArcLabelsComponent);
-    return ArcLabelsComponent;
-}(RadialLabelsComponent));
-
-/**
- * The configuration options for an ArcGauge color item.
- */
-var ColorComponent = /** @class */ (function (_super) {
-    __extends(ColorComponent, _super);
-    function ColorComponent(configurationService, collectionChangesService) {
-        return _super.call(this, configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], ColorComponent.prototype, "color", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ColorComponent.prototype, "opacity", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ColorComponent.prototype, "from", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], ColorComponent.prototype, "to", void 0);
-    ColorComponent = __decorate([
-        Component({
-            providers: [ConfigurationService],
-            selector: 'kendo-arcgauge-color',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], ColorComponent);
-    return ColorComponent;
-}(CollectionItemComponent));
-
-/**
- * A collection of one or more ArcGauge colors
- * ([more information and example]({% slug colorranges_arcgauge %})).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-arcgauge [value]="value">
- *              <kendo-arcgauge-colors>
- *                  <kendo-arcgauge-color *ngFor="let item of colors"
- *                      [from]="item.from" [to]="item.to" [color]="item.color">
- *                  </kendo-arcgauge-color>
- *              </kendo-arcgauge-colors>
- *         </kendo-arcgauge>
- *     `
- * })
- * export class AppComponent {
- *     public value: number = 10;
- *
- *     public colors: any[] = [{
- *         to: 25,
- *         color: '#0058e9'
- *     }, {
- *         from: 25,
- *         to: 50,
- *         color: '#37b400'
- *     }, {
- *         from: 50,
- *         to: 75,
- *         color: '#ffc000'
- *     }, {
- *         from: 75,
- *         color: '#f31700'
- *     }];
- * }
- *
- * ```
- */
-var ColorsComponent = /** @class */ (function (_super) {
-    __extends(ColorsComponent, _super);
-    function ColorsComponent(configurationService, collectionChangesService) {
-        return _super.call(this, 'colors', configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        ContentChildren(ColorComponent),
-        __metadata("design:type", QueryList)
-    ], ColorsComponent.prototype, "children", void 0);
-    ColorsComponent = __decorate([
-        Component({
-            providers: [CollectionChangesService],
-            selector: 'kendo-arcgauge-colors',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], ColorsComponent);
-    return ColorsComponent;
-}(CollectionComponent));
-
-var DIRECTIVES = [ArcGaugeComponent, ArcCenterTemplateDirective, ArcGaugeAreaComponent, ArcScaleComponent, ArcLabelsComponent,
-    ColorsComponent, ColorComponent];
-/**
- * A [module]({{ site.data.urls.angular['ngmodules'] }}) that includes the ArcGauge component and its directives.
- * Imports the `ArcGaugeModule` into your application
- * [root module]({{ site.data.urls.angular['ngmodules'] }}#angular-modularity) or any other sub-module
- * that will use the ArcGauge component.
- *
- * @example
- * ```ts-no-run
- * import { NgModule } from '@angular/core';
- * import { BrowserModule } from '@angular/platform-browser';
- * import { ArcGaugeModule } from '@progress/kendo-angular-gauges';
- * import { AppComponent } from './app.component';
- *
- * _@NgModule({
- *     bootstrap:    [AppComponent],
- *     declarations: [AppComponent],
- *     imports:      [BrowserModule, ArcGaugeModule]
- * })
- * export class AppModule {
- * }
- * ```
- */
-var ArcGaugeModule = /** @class */ (function () {
-    function ArcGaugeModule() {
-    }
-    ArcGaugeModule = __decorate([
-        NgModule({
-            declarations: [DIRECTIVES],
-            exports: [DIRECTIVES],
-            imports: [SharedModule, CommonModule]
-        })
-    ], ArcGaugeModule);
-    return ArcGaugeModule;
-}());
-
-/**
- * Represents the [Kendo UI LinearGauge component for Angular]({% slug overview_lineargauge_gauges %}).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *   selector: 'my-app',
- *   template: `
- *      <kendo-lineargauge [pointer]="{ value: value }">
- *      </kendo-lineargauge>
- *   `
- * })
- * class AppComponent {
- *   public value: number = 10;
- * }
- *
- * ```
- */
-var LinearGaugeComponent = /** @class */ (function (_super) {
-    __extends(LinearGaugeComponent, _super);
-    function LinearGaugeComponent(configurationService, themeService, intlService, localizationService, element, renderer, ngZone) {
-        return _super.call(this, configurationService, themeService, intlService, localizationService, element, renderer, ngZone) || this;
-    }
-    LinearGaugeComponent.prototype.createInstance = function (element, options, theme, context) {
-        this.instance = new LinearGauge(element, options, theme, context);
-    };
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LinearGaugeComponent.prototype, "pointer", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LinearGaugeComponent.prototype, "scale", void 0);
-    LinearGaugeComponent = __decorate([
-        Component({
-            changeDetection: ChangeDetectionStrategy.OnPush,
-            exportAs: 'kendoLinearGauge',
-            providers: [
-                ConfigurationService,
-                LocalizationService,
-                {
-                    provide: L10N_PREFIX,
-                    useValue: 'kendo.lineargauge'
-                }
-            ],
-            selector: 'kendo-lineargauge',
-            template: "\n    <div #surface class='k-chart-surface'></div>\n    <kendo-resize-sensor (resize)=\"onResize($event)\" [rateLimit]=\"resizeRateLimit\"></kendo-resize-sensor>\n  "
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            ThemeService,
-            IntlService,
-            LocalizationService,
-            ElementRef,
-            Renderer2,
-            NgZone])
-    ], LinearGaugeComponent);
-    return LinearGaugeComponent;
-}(GaugeComponent));
-
-/**
- * The configuration options for the LinearGauge area.
- * Represents the entire visible area of the LinearGauge.
- */
-var LinearGaugeAreaComponent = /** @class */ (function (_super) {
-    __extends(LinearGaugeAreaComponent, _super);
-    function LinearGaugeAreaComponent(configurationService) {
-        var _this = _super.call(this, 'gaugeArea', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    LinearGaugeAreaComponent = __decorate([
-        Component({
-            selector: 'kendo-lineargauge-area',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], LinearGaugeAreaComponent);
-    return LinearGaugeAreaComponent;
-}(GaugeAreaComponent));
-
-/**
- * The configuration options for the scale of the LinearGauge
- * ([see example]({% slug scaleoptions_lineargauge %})).
- */
-var LinearScaleComponent = /** @class */ (function (_super) {
-    __extends(LinearScaleComponent, _super);
-    function LinearScaleComponent(configurationService) {
-        var _this = _super.call(this, 'scale', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LinearScaleComponent.prototype, "line", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Array)
-    ], LinearScaleComponent.prototype, "ranges", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Boolean)
-    ], LinearScaleComponent.prototype, "mirror", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Boolean)
-    ], LinearScaleComponent.prototype, "vertical", void 0);
-    LinearScaleComponent = __decorate([
-        Component({
-            selector: 'kendo-lineargauge-scale',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], LinearScaleComponent);
-    return LinearScaleComponent;
-}(ScaleComponent));
-
-/**
- * The configuration options for the scale labels of the LinearGauge.
- */
-var LinearLabelsComponent = /** @class */ (function (_super) {
-    __extends(LinearLabelsComponent, _super);
-    function LinearLabelsComponent(configurationService) {
-        var _this = _super.call(this, 'scale.labels', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    LinearLabelsComponent = __decorate([
-        Component({
-            selector: 'kendo-lineargauge-scale-labels',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], LinearLabelsComponent);
-    return LinearLabelsComponent;
-}(LabelsComponent));
-
-/**
- * The configuration options for a pointer item of a LinearGauge.
- */
-var LinearPointerComponent = /** @class */ (function (_super) {
-    __extends(LinearPointerComponent, _super);
-    function LinearPointerComponent(configurationService, collectionChangesService) {
-        return _super.call(this, configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LinearPointerComponent.prototype, "border", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], LinearPointerComponent.prototype, "color", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], LinearPointerComponent.prototype, "margin", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], LinearPointerComponent.prototype, "opacity", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], LinearPointerComponent.prototype, "shape", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], LinearPointerComponent.prototype, "size", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], LinearPointerComponent.prototype, "value", void 0);
-    LinearPointerComponent = __decorate([
-        Component({
-            providers: [ConfigurationService],
-            selector: 'kendo-lineargauge-pointer',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], LinearPointerComponent);
-    return LinearPointerComponent;
-}(CollectionItemComponent));
-
-/**
- * A collection of one or more LinearGauge pointers
- * ([more information]({% slug multiplepointers_lineargauge %})).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-lineargauge>
- *             <kendo-lineargauge-pointers>
- *                 <kendo-lineargauge-pointer *ngFor="let pointer of pointers"
- *                     [value]="pointer.value" [color]="pointer.color" shape="barIndicator">
- *                 </kendo-lineargauge-pointer>
- *             </kendo-lineargauge-pointers>
- *         </kendo-lineargauge>
- *     `
- * })
- * export class AppComponent {
- *     public pointers: any[] = [{
- *         value: 10,
- *         color: '#ff4500'
- *     }, {
- *         value: 12,
- *         color: '#28b4c8'
- *     }, {
- *         value: 20,
- *         color: '#8b0000'
- *     }];
- * }
- *
- * ```
- */
-var LinearPointersComponent = /** @class */ (function (_super) {
-    __extends(LinearPointersComponent, _super);
-    function LinearPointersComponent(configurationService, collectionChangesService) {
-        return _super.call(this, 'pointer', configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        ContentChildren(LinearPointerComponent),
-        __metadata("design:type", QueryList)
-    ], LinearPointersComponent.prototype, "children", void 0);
-    LinearPointersComponent = __decorate([
-        Component({
-            providers: [CollectionChangesService],
-            selector: 'kendo-lineargauge-pointers',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], LinearPointersComponent);
-    return LinearPointersComponent;
-}(CollectionComponent));
-
-/**
- * The configuration options for a scale range item of a LinearGauge.
- */
-var LinearRangeComponent = /** @class */ (function (_super) {
-    __extends(LinearRangeComponent, _super);
-    function LinearRangeComponent(configurationService, collectionChangesService) {
-        return _super.call(this, configurationService, collectionChangesService) || this;
-    }
-    LinearRangeComponent = __decorate([
-        Component({
-            providers: [ConfigurationService],
-            selector: 'kendo-lineargauge-scale-range',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], LinearRangeComponent);
-    return LinearRangeComponent;
-}(RangeComponent));
-
-/**
- * A collection of one or more LinearGauge scale ranges
- * ([more information and example]({% slug scaleranghes_lineargauge %})).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-lineargauge>
- *             <kendo-lineargauge-scale>
- *                 <kendo-lineargauge-scale-ranges>
- *                     <kendo-lineargauge-scale-range *ngFor="let range of ranges"
- *                         [from]="range.from" [to]="range.to" [color]="range.color">
- *                     </kendo-lineargauge-scale-range>
- *                 </kendo-lineargauge-scale-ranges>
- *             </kendo-lineargauge-scale>
- *         </kendo-lineargauge>
- *     `
- * })
- * export class AppComponent {
- *     public ranges: any[] = [{
- *         from: 0,
- *         to: 15,
- *         color: '#ffd246'
- *     }, {
- *         from: 15,
- *         to: 30,
- *         color: '#28b4c8'
- *     }, {
- *         from: 30,
- *         to: 50,
- *         color: '#78d237'
- *     }];
- * }
- *
- * ```
- */
-var LinearRangesComponent = /** @class */ (function (_super) {
-    __extends(LinearRangesComponent, _super);
-    function LinearRangesComponent(configurationService, collectionChangesService) {
-        return _super.call(this, 'scale.ranges', configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        ContentChildren(LinearRangeComponent),
-        __metadata("design:type", QueryList)
-    ], LinearRangesComponent.prototype, "children", void 0);
-    LinearRangesComponent = __decorate([
-        Component({
-            providers: [CollectionChangesService],
-            selector: 'kendo-lineargauge-scale-ranges',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], LinearRangesComponent);
-    return LinearRangesComponent;
-}(CollectionComponent));
-
-var DIRECTIVES$1 = [LinearGaugeComponent, LinearGaugeAreaComponent, LinearScaleComponent, LinearLabelsComponent,
-    LinearPointersComponent, LinearPointerComponent, LinearRangeComponent, LinearRangesComponent];
-/**
- * A [module]({{ site.data.urls.angular['ngmodules'] }}) that includes the LinearGauge component and its directives.
- * Imports the `LinearGaugeModule` into your application
- * [root module]({{ site.data.urls.angular['ngmodules'] }}#angular-modularity) or any other sub-module
- * that will use the LinearGauge component.
- *
- * @example
- * ```ts-no-run
- * import { NgModule } from '@angular/core';
- * import { BrowserModule } from '@angular/platform-browser';
- * import { LinearGaugeModule } from '@progress/kendo-angular-gauges';
- * import { AppComponent } from './app.component';
- *
- * _@NgModule({
- *     bootstrap:    [AppComponent],
- *     declarations: [AppComponent],
- *     imports:      [BrowserModule, LinearGaugeModule]
- * })
- * export class AppModule {
- * }
- * ```
- */
-var LinearGaugeModule = /** @class */ (function () {
-    function LinearGaugeModule() {
-    }
-    LinearGaugeModule = __decorate([
-        NgModule({
-            declarations: [DIRECTIVES$1],
-            exports: [DIRECTIVES$1],
-            imports: [SharedModule]
-        })
-    ], LinearGaugeModule);
-    return LinearGaugeModule;
-}());
-
-/**
- * Represents the [Kendo UI RadialGauge component for Angular]({% slug overview_radialgauge_gauges %}).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *   selector: 'my-app',
- *   template: `
- *      <kendo-radialgauge [pointer]="{ value: value }">
- *      </kendo-radialgauge>
- *   `
- * })
- * class AppComponent {
- *   public value: number = 10;
- * }
- *
- * ```
- */
-var RadialGaugeComponent = /** @class */ (function (_super) {
-    __extends(RadialGaugeComponent, _super);
-    function RadialGaugeComponent(configurationService, themeService, intlService, localizationService, element, renderer, ngZone) {
-        return _super.call(this, configurationService, themeService, intlService, localizationService, element, renderer, ngZone) || this;
-    }
-    RadialGaugeComponent.prototype.createInstance = function (element, options, theme, context) {
-        this.instance = new RadialGauge(element, options, theme, context);
-    };
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], RadialGaugeComponent.prototype, "pointer", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], RadialGaugeComponent.prototype, "scale", void 0);
-    RadialGaugeComponent = __decorate([
-        Component({
-            changeDetection: ChangeDetectionStrategy.OnPush,
-            exportAs: 'kendoRadialGauge',
-            providers: [
-                ConfigurationService,
-                LocalizationService,
-                {
-                    provide: L10N_PREFIX,
-                    useValue: 'kendo.radialgauge'
-                }
-            ],
-            selector: 'kendo-radialgauge',
-            template: "\n    <div #surface class='k-chart-surface'></div>\n    <kendo-resize-sensor (resize)=\"onResize($event)\" [rateLimit]=\"resizeRateLimit\"></kendo-resize-sensor>\n  "
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            ThemeService,
-            IntlService,
-            LocalizationService,
-            ElementRef,
-            Renderer2,
-            NgZone])
-    ], RadialGaugeComponent);
-    return RadialGaugeComponent;
-}(GaugeComponent));
-
-/**
- * The configuration options for the RadialGauge area.
- * Represents the entire visible area of the RadialGauge.
- */
-var RadialGaugeAreaComponent = /** @class */ (function (_super) {
-    __extends(RadialGaugeAreaComponent, _super);
-    function RadialGaugeAreaComponent(configurationService) {
-        var _this = _super.call(this, 'gaugeArea', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    RadialGaugeAreaComponent = __decorate([
-        Component({
-            selector: 'kendo-radialgauge-area',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], RadialGaugeAreaComponent);
-    return RadialGaugeAreaComponent;
-}(GaugeAreaComponent));
-
-/**
- * The configuration options for the scale of the RadialGauge
- * ([more information and example]({% slug scaleoptions_radialgauge %})).
- */
-var RadialScaleComponent = /** @class */ (function (_super) {
-    __extends(RadialScaleComponent, _super);
-    function RadialScaleComponent(configurationService) {
-        var _this = _super.call(this, 'scale', configurationService) || this;
-        _this.configurationService = configurationService;
-        return _this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], RadialScaleComponent.prototype, "labels", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RadialScaleComponent.prototype, "rangeDistance", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Array)
-    ], RadialScaleComponent.prototype, "ranges", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RadialScaleComponent.prototype, "startAngle", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RadialScaleComponent.prototype, "endAngle", void 0);
-    RadialScaleComponent = __decorate([
-        Component({
-            selector: 'kendo-radialgauge-scale',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService])
-    ], RadialScaleComponent);
-    return RadialScaleComponent;
-}(ScaleComponent));
-
-/**
- * The configuration options for a pointer item of a RadialGauge.
- */
-var RadialPointerComponent = /** @class */ (function (_super) {
-    __extends(RadialPointerComponent, _super);
-    function RadialPointerComponent(configurationService, collectionChangesService) {
-        return _super.call(this, configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], RadialPointerComponent.prototype, "cap", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", String)
-    ], RadialPointerComponent.prototype, "color", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RadialPointerComponent.prototype, "length", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Number)
-    ], RadialPointerComponent.prototype, "value", void 0);
-    RadialPointerComponent = __decorate([
-        Component({
-            providers: [ConfigurationService],
-            selector: 'kendo-radialgauge-pointer',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], RadialPointerComponent);
-    return RadialPointerComponent;
-}(CollectionItemComponent));
-
-/**
- * A collection of one or more RadialGauge pointers
- * ([more information and example]({% slug multiplepointers_radialgauge %})).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-radialgauge>
- *             <kendo-radialgauge-pointers>
- *                 <kendo-radialgauge-pointer *ngFor="let pointer of pointers"
- *                     [value]="pointer.value" [color]="pointer.color">
- *                 </kendo-radialgauge-pointer>
- *             </kendo-radialgauge-pointers>
- *         </kendo-radialgauge>
- *     `
- * })
- * export class AppComponent {
- *     public pointers: any[] = [{
- *         value: 10,
- *         color: '#ffd246'
- *     }, {
- *         value: 20,
- *         color: '#28b4c8'
- *     }, {
- *         value: 30,
- *         color: '#78d237'
- *     }];
- * }
- *
- * ```
- */
-var RadialPointersComponent = /** @class */ (function (_super) {
-    __extends(RadialPointersComponent, _super);
-    function RadialPointersComponent(configurationService, collectionChangesService) {
-        return _super.call(this, 'pointer', configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        ContentChildren(RadialPointerComponent),
-        __metadata("design:type", QueryList)
-    ], RadialPointersComponent.prototype, "children", void 0);
-    RadialPointersComponent = __decorate([
-        Component({
-            providers: [CollectionChangesService],
-            selector: 'kendo-radialgauge-pointers',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], RadialPointersComponent);
-    return RadialPointersComponent;
-}(CollectionComponent));
-
-/**
- * The configuration options for a scale range item of a RadialGauge.
- */
-var RadialRangeComponent = /** @class */ (function (_super) {
-    __extends(RadialRangeComponent, _super);
-    function RadialRangeComponent(configurationService, collectionChangesService) {
-        return _super.call(this, configurationService, collectionChangesService) || this;
-    }
-    RadialRangeComponent = __decorate([
-        Component({
-            providers: [ConfigurationService],
-            selector: 'kendo-radialgauge-scale-range',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], RadialRangeComponent);
-    return RadialRangeComponent;
-}(RangeComponent));
-
-/**
- * A collection of one or more RadialGauge scale ranges
- * ([more information and example]({% slug scaleranghes_radialgauge %})).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-radialgauge>
- *             <kendo-radialgauge-scale>
- *                 <kendo-radialgauge-scale-ranges>
- *                     <kendo-radialgauge-scale-range *ngFor="let range of ranges"
- *                         [from]="range.from" [to]="range.to" [color]="range.color">
- *                     </kendo-radialgauge-scale-range>
- *                 </kendo-radialgauge-scale-ranges>
- *             </kendo-radialgauge-scale>
- *         </kendo-radialgauge>
- *     `
- * })
- * export class AppComponent {
- *     public ranges: any[] = [{
- *         from: 0,
- *         to: 15,
- *         color: '#ffd246'
- *     }, {
- *         from: 15,
- *         to: 30,
- *         color: '#28b4c8'
- *     }, {
- *         from: 30,
- *         to: 50,
- *         color: '#78d237'
- *     }];
- * }
- *
- * ```
- */
-var RadialRangesComponent = /** @class */ (function (_super) {
-    __extends(RadialRangesComponent, _super);
-    function RadialRangesComponent(configurationService, collectionChangesService) {
-        return _super.call(this, 'scale.ranges', configurationService, collectionChangesService) || this;
-    }
-    __decorate([
-        ContentChildren(RadialRangeComponent),
-        __metadata("design:type", QueryList)
-    ], RadialRangesComponent.prototype, "children", void 0);
-    RadialRangesComponent = __decorate([
-        Component({
-            providers: [CollectionChangesService],
-            selector: 'kendo-radialgauge-scale-ranges',
-            template: ''
-        }),
-        __metadata("design:paramtypes", [ConfigurationService,
-            CollectionChangesService])
-    ], RadialRangesComponent);
-    return RadialRangesComponent;
-}(CollectionComponent));
-
-var DIRECTIVES$2 = [RadialGaugeComponent, RadialGaugeAreaComponent, RadialScaleComponent, RadialLabelsComponent,
-    RadialPointersComponent, RadialPointerComponent, RadialRangeComponent, RadialRangesComponent];
-/**
- * A [module]({{ site.data.urls.angular['ngmodules'] }}) that includes the RadialGauge component and its directives.
- * Imports the `RadialGaugeModule` into your application
- * [root module]({{ site.data.urls.angular['ngmodules'] }}#angular-modularity) or any other sub-module
- * that will use the RadialGauge component.
- *
- * @example
- * ```ts-no-run
- * import { NgModule } from '@angular/core';
- * import { BrowserModule } from '@angular/platform-browser';
- * import { RadialGaugeModule } from '@progress/kendo-angular-gauges';
- * import { AppComponent } from './app.component';
- *
- * _@NgModule({
- *     bootstrap:    [AppComponent],
- *     declarations: [AppComponent],
- *     imports:      [BrowserModule, RadialGaugeModule]
- * })
- * export class AppModule {
- * }
- * ```
- */
-var RadialGaugeModule = /** @class */ (function () {
-    function RadialGaugeModule() {
-    }
-    RadialGaugeModule = __decorate([
-        NgModule({
-            declarations: [DIRECTIVES$2],
-            exports: [DIRECTIVES$2],
-            imports: [SharedModule]
-        })
-    ], RadialGaugeModule);
-    return RadialGaugeModule;
-}());
-
-/**
- * A directive that selects a [template]({{ site.data.urls.angular['templatesyntax'] }})
- * within the `<kendo-circulargauge>` component which will be used for the center template
- * ([more information and example]({% slug centertemplate_circulargauge %})).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *     selector: 'my-app',
- *     template: `
- *         <kendo-circulargauge [value]="value">
- *             <ng-template kendoCircularGaugeCenterTemplate let-value="value">
- *                 {{ value }}%
- *             </ng-template>
- *         </kendo-circulargauge>
- *
- *     `
- * })
- * export class AppComponent {
- *   public value: number = 10;
- * }
- *
- * ```
- */
-var CircularGaugeCenterTemplateDirective = /** @class */ (function () {
-    function CircularGaugeCenterTemplateDirective(templateRef) {
-        this.templateRef = templateRef;
-    }
-    CircularGaugeCenterTemplateDirective = __decorate([
-        Directive({
-            selector: '[kendoCircularGaugeCenterTemplate]'
-        }),
-        __param(0, Optional()),
-        __metadata("design:paramtypes", [TemplateRef])
-    ], CircularGaugeCenterTemplateDirective);
-    return CircularGaugeCenterTemplateDirective;
-}());
-
-/**
- * Represents the [Kendo UI CircularGauge component for Angular]({% slug overview_circulargauge_gauges %}).
- *
- * @example
- * ```ts
- * import { Component } from '@angular/core';
- *
- * _@Component({
- *   selector: 'my-app',
- *   template: `
- *      <kendo-circulargauge [value]="value" [scale]="{ max: 100 }">
- *          <ng-template kendoCircularGaugeCenterTemplate let-value="value">
- *              {{ value }}%
- *          </ng-template>
- *      </kendo-circulargauge>
- *   `
- * })
- * class AppComponent {
- *   public value: number = 10;
- * }
- *
- * ```
- */
-var CircularGaugeComponent = /** @class */ (function (_super) {
-    __extends(CircularGaugeComponent, _super);
-    function CircularGaugeComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CircularGaugeComponent.prototype.createInstance = function (element, options, theme, context) {
-        this.instance = new CircularGauge(element, options, theme, context);
-        this.updateElements();
-    };
-    __decorate([
-        Input(),
-        __metadata("design:type", Object)
-    ], CircularGaugeComponent.prototype, "scale", void 0);
-    __decorate([
-        ContentChild(CircularGaugeCenterTemplateDirective, { static: false }),
-        __metadata("design:type", CircularGaugeCenterTemplateDirective)
-    ], CircularGaugeComponent.prototype, "centerTemplate", void 0);
-    CircularGaugeComponent = __decorate([
-        Component({
-            changeDetection: ChangeDetectionStrategy.OnPush,
-            exportAs: 'kendoCircularGauge',
-            providers: [
-                ConfigurationService,
-                LocalizationService,
-                {
-                    provide: L10N_PREFIX,
-                    useValue: 'kendo.circulargauge'
-                }
-            ],
-            selector: 'kendo-circulargauge',
-            template: "\n    <div #surface class='k-chart-surface'></div>\n    <div class=\"k-arcgauge-label\" *ngIf=\"centerTemplate\" #label>\n        <ng-template [ngTemplateOutlet]=\"centerTemplate.templateRef\" [ngTemplateOutletContext]=\"centerTemplateContext\"></ng-template>\n    </div>\n    <kendo-resize-sensor (resize)=\"onResize($event)\" [rateLimit]=\"resizeRateLimit\"></kendo-resize-sensor>\n  "
-        })
-    ], CircularGaugeComponent);
-    return CircularGaugeComponent;
-}(ArcGaugeComponent));
-
-/**
- * The configuration options of the Circular Gauge area.
- * Represents the entire visible area of the Circular Gauge.
- */
-var CircularGaugeAreaComponent = /** @class */ (function (_super) {
-    __extends(CircularGaugeAreaComponent, _super);
-    function CircularGaugeAreaComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CircularGaugeAreaComponent = __decorate([
-        Component({
-            selector: 'kendo-circulargauge-area',
-            template: ''
-        })
-    ], CircularGaugeAreaComponent);
-    return CircularGaugeAreaComponent;
-}(ArcGaugeAreaComponent));
-
-/**
- * The configuration options for the scale of the Circular Gauge
- * ([see example]({% slug scaleoptions_circulargauge %})).
- */
-var CircularGaugeScaleComponent = /** @class */ (function (_super) {
-    __extends(CircularGaugeScaleComponent, _super);
-    function CircularGaugeScaleComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CircularGaugeScaleComponent = __decorate([
-        Component({
-            selector: 'kendo-circulargauge-scale',
-            template: ''
-        })
-    ], CircularGaugeScaleComponent);
-    return CircularGaugeScaleComponent;
-}(ArcScaleComponent));
-
-/**
- * The configuration options for the scale labels of the Circular Gauge.
- */
-var CircularGaugeLabelsComponent = /** @class */ (function (_super) {
-    __extends(CircularGaugeLabelsComponent, _super);
-    function CircularGaugeLabelsComponent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CircularGaugeLabelsComponent = __decorate([
-        Component({
-            selector: 'kendo-circulargauge-scale-labels',
-            template: ''
-        })
-    ], CircularGaugeLabelsComponent);
-    return CircularGaugeLabelsComponent;
-}(ArcLabelsComponent));
-
-var DIRECTIVES$3 = [
-    CircularGaugeComponent,
-    CircularGaugeCenterTemplateDirective,
-    CircularGaugeAreaComponent,
-    CircularGaugeScaleComponent,
-    CircularGaugeLabelsComponent
-];
-/**
- * A [module]({{ site.data.urls.angular['ngmodules'] }}) that includes the CircularGauge component and its directives.
- * Imports the `CircularGaugeModule` into your application
- * [root module]({{ site.data.urls.angular['ngmodules'] }}#angular-modularity) or any other sub-module
- * that will use the CircularGauge component.
- *
- * @example
- * ```ts-no-run
- * import { NgModule } from '@angular/core';
- * import { BrowserModule } from '@angular/platform-browser';
- * import { CircularGaugeModule } from '@progress/kendo-angular-gauges';
- * import { AppComponent } from './app.component';
- *
- * _@NgModule({
- *     bootstrap:    [AppComponent],
- *     declarations: [AppComponent],
- *     imports:      [BrowserModule, CircularGaugeModule]
- * })
- * export class AppModule {
- * }
- * ```
- */
-var CircularGaugeModule = /** @class */ (function () {
-    function CircularGaugeModule() {
-    }
-    CircularGaugeModule = __decorate([
-        NgModule({
-            declarations: [DIRECTIVES$3],
-            exports: [DIRECTIVES$3],
-            imports: [SharedModule, CommonModule]
-        })
-    ], CircularGaugeModule);
-    return CircularGaugeModule;
-}());
-
-/**
- * A [module]({{ site.data.urls.angular['ngmodules'] }}) that includes all Gauge components and directives.
- *
- * Imports the `GaugesModule` into your application
- * [root module]({{ site.data.urls.angular['ngmodules'] }}#angular-modularity) or any other sub-module
- * that will use the Gauge components.
- *
- * @example
- * ```ts-no-run
- * import { NgModule } from '@angular/core';
- * import { BrowserModule } from '@angular/platform-browser';
- * import { GaugesModule } from '@progress/kendo-angular-charts';
- * import { AppComponent } from './app.component';
- *
- * _@NgModule({
- *     bootstrap:    [AppComponent],
- *     declarations: [AppComponent],
- *     imports:      [BrowserModule, GaugesModule]
- * })
- * export class AppModule {
- * }
- * ```
- */
-var GaugesModule = /** @class */ (function () {
-    function GaugesModule() {
-    }
-    GaugesModule = __decorate([
-        NgModule({
-            exports: [ArcGaugeModule, CircularGaugeModule, LinearGaugeModule, RadialGaugeModule]
-        })
-    ], GaugesModule);
-    return GaugesModule;
-}());
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { CircularGaugeCenterTemplateDirective, CircularGaugeComponent, CircularGaugeModule, CircularGaugeAreaComponent, CircularGaugeLabelsComponent, CircularGaugeScaleComponent, SharedModule, ArcGaugeModule, LinearGaugeModule, RadialGaugeModule, GaugesModule, CollectionComponent, CollectionItemComponent, GaugeComponent, GaugeAreaComponent, LabelsComponent, RangeComponent, ScaleComponent, SettingsComponent, ConfigurationService, CollectionChangesService, ThemeService, ArcGaugeComponent, ArcGaugeAreaComponent, ArcScaleComponent, ArcLabelsComponent, ArcCenterTemplateDirective, ColorsComponent, ColorComponent, LinearGaugeComponent, LinearGaugeAreaComponent, LinearScaleComponent, LinearLabelsComponent, LinearPointersComponent, LinearPointerComponent, LinearRangeComponent, LinearRangesComponent, RadialGaugeComponent, RadialGaugeAreaComponent, RadialScaleComponent, RadialLabelsComponent, RadialPointersComponent, RadialPointerComponent, RadialRangeComponent, RadialRangesComponent };