@spike-rabbit/charts-ng 49.0.0 → 49.13.0

package/fesm2022/spike-rabbit-charts-ng-gauge.mjs

@@ -0,0 +1,371 @@
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, inject, LOCALE_ID, computed, SimpleChange, ChangeDetectionStrategy, Component } from '@angular/core';
+import { echarts, SiChartBaseComponent } from '@spike-rabbit/charts-ng/common';
+import { SiCustomLegendComponent } from '@spike-rabbit/charts-ng/custom-legend';
+import { SiChartLoadingSpinnerComponent } from '@spike-rabbit/charts-ng/loading-spinner';
+import { GaugeChart } from 'echarts/charts';
+
+/**
+ * Copyright (c) Siemens 2016 - 2026
+ * SPDX-License-Identifier: MIT
+ */
+echarts.use([GaugeChart]);
+class SiChartGaugeComponent extends SiChartBaseComponent {
+    /** @defaultValue 0 */
+    minValue = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "minValue" }] : /* istanbul ignore next */ []));
+    /** @defaultValue 100 */
+    maxValue = input(100, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "maxValue" }] : /* istanbul ignore next */ []));
+    /** @defaultValue 0 */
+    value = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    splitSteps = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "splitSteps" }] : /* istanbul ignore next */ []));
+    /** @defaultValue true */
+    responsiveSplitSteps = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "responsiveSplitSteps" }] : /* istanbul ignore next */ []));
+    /** @defaultValue '%' */
+    unit = input('%', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "unit" }] : /* istanbul ignore next */ []));
+    /** @defaultValue false */
+    unitsOnSplit = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "unitsOnSplit" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom formatter for axis labels.
+     * Takes precedence when specified, i.e. number of decimals, unit etc needs
+     * to be set by the user using this formatter.
+     */
+    labelFormatter = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "labelFormatter" }] : /* istanbul ignore next */ []));
+    /**
+     * Custom formatter for value.
+     * Takes precedence when specified, i.e. number of decimals needs
+     * to be set by the user using this formatter.
+     */
+    valueFormatter = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "valueFormatter" }] : /* istanbul ignore next */ []));
+    /**
+     * Min number of decimals.
+     * Possible values are from 0 to 100.
+     * @defaultValue 0
+     */
+    minNumberOfDecimals = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "minNumberOfDecimals" }] : /* istanbul ignore next */ []));
+    /**
+     * Max number of decimals.
+     * Possible values are from 0 to 100.
+     * @defaultValue 0
+     */
+    maxNumberOfDecimals = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "maxNumberOfDecimals" }] : /* istanbul ignore next */ []));
+    /**
+     * Number of decimals on the axis.
+     * Possible values are from 0 to 100.
+     * @defaultValue 0
+     */
+    axisNumberOfDecimals = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "axisNumberOfDecimals" }] : /* istanbul ignore next */ []));
+    /** @defaultValue false */
+    hideAxisLabels = input(false, { ...(ngDevMode ? { debugName: "hideAxisLabels" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Segments on the arc from 0 (implicit) to 1 (explicit)
+     * E.g. 0.2 means from 0 to 0.2 of the possible range (maxValue - minValue)
+     *
+     * @defaultValue [0.2, 0.8, 1]
+     */
+    segments = input([0.2, 0.8, 1], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "segments" }] : /* istanbul ignore next */ []));
+    /**
+     * Colors for the defined segments.
+     * If there are less colors then segments, the colors will be repeated. Defaults to the standard color palette
+     */
+    colors = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "colors" }] : /* istanbul ignore next */ []));
+    locale = inject(LOCALE_ID).toString();
+    numberFormat = computed(() => {
+        const minDecimals = this.minNumberOfDecimals();
+        return new Intl.NumberFormat(this.locale, {
+            minimumFractionDigits: minDecimals,
+            maximumFractionDigits: Math.max(minDecimals, this.maxNumberOfDecimals())
+        });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "numberFormat" }] : /* istanbul ignore next */ []));
+    axisNumberFormat = computed(() => {
+        const decimals = this.axisNumberOfDecimals();
+        return new Intl.NumberFormat(this.locale, {
+            minimumFractionDigits: decimals,
+            maximumFractionDigits: decimals
+        });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "axisNumberFormat" }] : /* istanbul ignore next */ []));
+    afterChartInit() {
+        super.afterChartInit();
+        this.applyOptions();
+        this.updateColors();
+        this.refreshSeries();
+    }
+    updateColors() {
+        // gauge doesn't respect color palette, it needs a bit convincing
+        const effectiveOpts = this.getOptionNoClone();
+        const colors = this.colors() ?? effectiveOpts.color;
+        const hasIndicator = !!this.segments().length;
+        let newColors;
+        if (hasIndicator) {
+            newColors = this.segments().map((threshold, index) => {
+                const color = colors[index % colors.length];
+                return [threshold, color];
+            });
+        }
+        else {
+            const colorsValue = this.colors();
+            const dataColor = colorsValue?.length
+                ? colorsValue[0]
+                : this.getThemeCustomValue(['gauge', 'defaultColor'], colors[0]);
+            newColors = [[1, dataColor]];
+        }
+        if (hasIndicator) {
+            this.setAxisLineColor(newColors, this.actualOptions.series[0].axisLine);
+        }
+        this.actualOptions.series[0].axisLine.show = hasIndicator;
+        this.setAxisLineColor(newColors, this.actualOptions.series[2].axisLine);
+        this.refreshSeries();
+    }
+    setAxisLineColor(colors, axisLine) {
+        axisLine.lineStyle = axisLine.lineStyle ?? {};
+        axisLine.lineStyle.color = colors;
+    }
+    getResponsiveConfig() {
+        const marginY = 12;
+        const maxHeight = this.curHeight - marginY;
+        const dim = Math.min(this.curWidth / 2, maxHeight);
+        const top = dim < maxHeight ? this.curHeight / 2 + dim / 2 : maxHeight;
+        if (dim < 150) {
+            const splits = dim < 100 ? 1 : 4;
+            const axisLabelDist = dim < 100 ? -6 : 0;
+            return {
+                outerRadius: dim - 4,
+                center: ['50%', top],
+                progressWidth: 8,
+                indicatorWidth: 1,
+                gap: 2,
+                splits,
+                axisLabelDist,
+                axisFontSize: 12,
+                valueFontSize: 18,
+                unitFontSize: 12
+            };
+        }
+        if (dim < 200) {
+            return {
+                outerRadius: dim - 7,
+                center: ['50%', top],
+                progressWidth: 14,
+                indicatorWidth: 3,
+                gap: 3,
+                splits: 6,
+                axisLabelDist: 12,
+                axisFontSize: 16,
+                valueFontSize: 30,
+                unitFontSize: 14
+            };
+        }
+        return {
+            outerRadius: dim - 12,
+            center: ['50%', top],
+            progressWidth: 24,
+            indicatorWidth: 4,
+            gap: 5,
+            splits: 0,
+            axisLabelDist: 20,
+            axisFontSize: 20,
+            valueFontSize: 40,
+            unitFontSize: 14
+        };
+    }
+    axisLabelFormatter = (value) => {
+        const formatted = this.axisNumberFormat().format(Number(value));
+        return this.unitsOnSplit() ? `${formatted} ${this.unit()}` : formatted;
+    };
+    applyOptions() {
+        const resp = this.getResponsiveConfig();
+        const hasIndicator = !!this.segments().length;
+        const splitNumber = this.responsiveSplitSteps() && resp.splits ? resp.splits : this.splitSteps();
+        const grey = this.getThemeCustomValue(['gauge', 'grey'], '#F0F2F5');
+        const axisColor = this.getThemeCustomValue(['gauge', 'unit'], '#656A6F');
+        const indicator = {
+            type: 'gauge',
+            radius: resp.outerRadius - resp.progressWidth - resp.gap,
+            startAngle: 180,
+            endAngle: 0,
+            min: this.minValue(),
+            max: this.maxValue(),
+            center: resp.center,
+            axisLine: {
+                show: hasIndicator,
+                lineStyle: { width: resp.indicatorWidth }
+            },
+            axisTick: {
+                length: 0,
+                splitNumber: 1,
+                lineStyle: {
+                    width: 2,
+                    color: axisColor
+                }
+            },
+            splitLine: {
+                length: 0,
+                lineStyle: {
+                    width: 1,
+                    color: axisColor
+                }
+            },
+            axisLabel: { show: false }
+        };
+        const labelDistance = resp.axisLabelDist + (hasIndicator ? resp.indicatorWidth + resp.gap : 0);
+        const shade = {
+            type: 'gauge',
+            radius: resp.outerRadius,
+            startAngle: 180,
+            endAngle: 0,
+            min: this.minValue(),
+            max: this.maxValue(),
+            splitNumber,
+            axisTick: { show: false },
+            splitLine: { show: false },
+            title: { show: false },
+            center: resp.center,
+            axisLine: {
+                lineStyle: {
+                    width: resp.progressWidth,
+                    opacity: 0.6,
+                    color: [[1, grey]]
+                }
+            },
+            axisLabel: {
+                show: !this.hideAxisLabels(),
+                distance: labelDistance,
+                color: axisColor,
+                fontSize: resp.axisFontSize,
+                formatter: this.labelFormatter() ?? this.axisLabelFormatter
+            }
+        };
+        const data = {
+            type: 'gauge',
+            silent: false,
+            radius: resp.outerRadius,
+            startAngle: 180,
+            endAngle: 0,
+            min: this.minValue(),
+            max: this.maxValue(),
+            splitNumber,
+            progress: {
+                show: true,
+                itemStyle: { color: 'auto' },
+                width: resp.progressWidth
+            },
+            emphasis: {
+                // This code is added to avoid flickering when the progress is hovered and
+                // when mouse effects are enabled with `silent: false` flag. The issue occurs
+                // because of the progress.itemStyle.color is set to `auto` which tries to
+                // calculate the color dynamically and it conflicts with the mouse hover action
+                // which tries to apply the hover style
+                itemStyle: { color: 'auto' }
+            },
+            pointer: {
+                show: true,
+                length: '0%',
+                itemStyle: {
+                    color: 'auto',
+                    opacity: 0.001
+                }
+            },
+            center: resp.center,
+            axisLine: {
+                show: false,
+                lineStyle: { opacity: 0.6 }
+            },
+            axisTick: { show: false },
+            splitLine: { show: false },
+            axisLabel: { show: false },
+            title: { show: false },
+            detail: {
+                offsetCenter: [0, -0.5 * resp.valueFontSize],
+                valueAnimation: true,
+                formatter: this.valueFormatterInternal(),
+                rich: {
+                    value: {
+                        fontSize: resp.valueFontSize,
+                        lineHeight: resp.valueFontSize,
+                        fontWeight: 600
+                    },
+                    unit: {
+                        fontSize: resp.unitFontSize,
+                        lineHeight: resp.unitFontSize,
+                        padding: [0, 0, (resp.unitFontSize - resp.valueFontSize) / 2, 0]
+                    }
+                }
+            },
+            data: [{ value: this.value() }]
+        };
+        const series = [indicator, shade, data];
+        this.showLegend.set(false);
+        this.actualOptions.series = series;
+        this.applyTitles();
+    }
+    valueFormatterInternal() {
+        const unit = this.unit();
+        const valueFormatter = this.valueFormatter();
+        const labelFormatter = this.labelFormatter();
+        const formattedUnit = unit ? (unit.length > 5 ? `\n{unit|${unit}}` : ` {unit|${unit}}`) : '';
+        return (value) => {
+            if (valueFormatter) {
+                return `{value|${valueFormatter(value)}}${formattedUnit}`;
+            }
+            // DEPRECATED: Use the new input `valueFormatter` to format the value.
+            // labelFormatter should be removed from here in future versions.
+            if (labelFormatter) {
+                return labelFormatter(value);
+            }
+            return `{value|${this.numberFormat().format(value)}}${formattedUnit}`;
+        };
+    }
+    ngOnChanges(changes) {
+        if (this.chart && (changes.palette || changes.colors || changes.segments)) {
+            this.updateColors();
+        }
+        changes.forceAll = new SimpleChange(false, true, false);
+        super.ngOnChanges(changes);
+    }
+    applyDataZoom() { }
+    afterChartResize() {
+        this.applyOptions();
+        this.refreshSeries();
+    }
+    /**
+     * Update gauge chart value.
+     */
+    setValue(value) {
+        const optionSeries = this.actualOptions.series;
+        optionSeries[2].data[0].value = value;
+        this.refreshSeries();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiChartGaugeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SiChartGaugeComponent, isStandalone: true, selector: "si-chart-gauge", inputs: { minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, splitSteps: { classPropertyName: "splitSteps", publicName: "splitSteps", isSignal: true, isRequired: false, transformFunction: null }, responsiveSplitSteps: { classPropertyName: "responsiveSplitSteps", publicName: "responsiveSplitSteps", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, unitsOnSplit: { classPropertyName: "unitsOnSplit", publicName: "unitsOnSplit", isSignal: true, isRequired: false, transformFunction: null }, labelFormatter: { classPropertyName: "labelFormatter", publicName: "labelFormatter", isSignal: true, isRequired: false, transformFunction: null }, valueFormatter: { classPropertyName: "valueFormatter", publicName: "valueFormatter", isSignal: true, isRequired: false, transformFunction: null }, minNumberOfDecimals: { classPropertyName: "minNumberOfDecimals", publicName: "minNumberOfDecimals", isSignal: true, isRequired: false, transformFunction: null }, maxNumberOfDecimals: { classPropertyName: "maxNumberOfDecimals", publicName: "maxNumberOfDecimals", isSignal: true, isRequired: false, transformFunction: null }, axisNumberOfDecimals: { classPropertyName: "axisNumberOfDecimals", publicName: "axisNumberOfDecimals", isSignal: true, isRequired: false, transformFunction: null }, hideAxisLabels: { classPropertyName: "hideAxisLabels", publicName: "hideAxisLabels", isSignal: true, isRequired: false, transformFunction: null }, segments: { classPropertyName: "segments", publicName: "segments", isSignal: true, isRequired: false, transformFunction: null }, colors: { classPropertyName: "colors", publicName: "colors", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n  <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n    <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n    @if (subTitle()) {\n      <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n    }\n  </div>\n}\n\n<div\n  #chartContainerWrapper\n  class=\"chart-container-wrapper\"\n  [class.chart-scroll]=\"containerHeight()\"\n  [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n  <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n    @if (showCustomLegend()) {\n      @for (cl of customLegend; track $index) {\n        <si-custom-legend\n          #siCustomLegend\n          class=\"custom-legend\"\n          [style.top.px]=\"cl.top\"\n          [title]=\"title()\"\n          [subTitle]=\"subTitle()\"\n          [customLegend]=\"cl\"\n          [style.background-color]=\"backgroundColor()\"\n          [titleColor]=\"titleColor()\"\n          [subTitleColor]=\"subTitleColor()\"\n          [textColor]=\"textColor()\"\n          (legendIconClickEvent)=\"handleLegendClick($event)\"\n          (legendClickEvent)=\"handleLegendClick($event)\"\n          (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n          (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n        />\n      }\n    }\n    <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n  </div>\n</div>\n@if (externalZoomSlider()) {\n  <div\n    #externalZoomSlider\n    class=\"external-zoom-container\"\n    [class.has-time-range-bar]=\"showTimeRangeBar()\"\n    [style.--time-bar-height.px]=\"timeBarHeight()\"\n  ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n  <div\n    class=\"time-range-bar\"\n    [style.bottom.px]=\"timeBarBottom()\"\n    [style.padding-left.px]=\"timeBarLeft()\"\n    [style.padding-right.px]=\"timeBarRight()\"\n  >\n    <ng-content select=\"[slot=timeRangeBar]\" />\n  </div>\n}\n\n@if (inProgress()) {\n  <div class=\"progress-container\">\n    <si-chart-loading-spinner />\n  </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiChartGaugeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'si-chart-gauge', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Eager, template: "@if (showCustomLegend() && (title() || subTitle())) {\n  <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n    <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n    @if (subTitle()) {\n      <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n    }\n  </div>\n}\n\n<div\n  #chartContainerWrapper\n  class=\"chart-container-wrapper\"\n  [class.chart-scroll]=\"containerHeight()\"\n  [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n  <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n    @if (showCustomLegend()) {\n      @for (cl of customLegend; track $index) {\n        <si-custom-legend\n          #siCustomLegend\n          class=\"custom-legend\"\n          [style.top.px]=\"cl.top\"\n          [title]=\"title()\"\n          [subTitle]=\"subTitle()\"\n          [customLegend]=\"cl\"\n          [style.background-color]=\"backgroundColor()\"\n          [titleColor]=\"titleColor()\"\n          [subTitleColor]=\"subTitleColor()\"\n          [textColor]=\"textColor()\"\n          (legendIconClickEvent)=\"handleLegendClick($event)\"\n          (legendClickEvent)=\"handleLegendClick($event)\"\n          (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n          (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n        />\n      }\n    }\n    <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n  </div>\n</div>\n@if (externalZoomSlider()) {\n  <div\n    #externalZoomSlider\n    class=\"external-zoom-container\"\n    [class.has-time-range-bar]=\"showTimeRangeBar()\"\n    [style.--time-bar-height.px]=\"timeBarHeight()\"\n  ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n  <div\n    class=\"time-range-bar\"\n    [style.bottom.px]=\"timeBarBottom()\"\n    [style.padding-left.px]=\"timeBarLeft()\"\n    [style.padding-right.px]=\"timeBarRight()\"\n  >\n    <ng-content select=\"[slot=timeRangeBar]\" />\n  </div>\n}\n\n@if (inProgress()) {\n  <div class=\"progress-container\">\n    <si-chart-loading-spinner />\n  </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
+        }], propDecorators: { minValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "minValue", required: false }] }], maxValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxValue", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], splitSteps: [{ type: i0.Input, args: [{ isSignal: true, alias: "splitSteps", required: false }] }], responsiveSplitSteps: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsiveSplitSteps", required: false }] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: false }] }], unitsOnSplit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unitsOnSplit", required: false }] }], labelFormatter: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelFormatter", required: false }] }], valueFormatter: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueFormatter", required: false }] }], minNumberOfDecimals: [{ type: i0.Input, args: [{ isSignal: true, alias: "minNumberOfDecimals", required: false }] }], maxNumberOfDecimals: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxNumberOfDecimals", required: false }] }], axisNumberOfDecimals: [{ type: i0.Input, args: [{ isSignal: true, alias: "axisNumberOfDecimals", required: false }] }], hideAxisLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideAxisLabels", required: false }] }], segments: [{ type: i0.Input, args: [{ isSignal: true, alias: "segments", required: false }] }], colors: [{ type: i0.Input, args: [{ isSignal: true, alias: "colors", required: false }] }] } });
+
+/**
+ * Copyright (c) Siemens 2016 - 2026
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SiChartGaugeComponent };
+//# sourceMappingURL=spike-rabbit-charts-ng-gauge.mjs.map

package/fesm2022/spike-rabbit-charts-ng-gauge.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"spike-rabbit-charts-ng-gauge.mjs","sources":["../../../../projects/charts-ng/gauge/si-chart-gauge.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/gauge/index.ts","../../../../projects/charts-ng/gauge/spike-rabbit-charts-ng-gauge.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  LOCALE_ID,\n  OnChanges,\n  SimpleChange,\n  SimpleChanges\n} from '@angular/core';\nimport { SiChartBaseComponent, GaugeSeriesOption, echarts } from '@spike-rabbit/charts-ng/common';\nimport { SiCustomLegendComponent } from '@spike-rabbit/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@spike-rabbit/charts-ng/loading-spinner';\nimport { GaugeChart } from 'echarts/charts';\n\nimport { GaugeChartSeries } from './si-chart-gauge.interface';\n\necharts.use([GaugeChart]);\n\n@Component({\n  selector: 'si-chart-gauge',\n  imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n  templateUrl: '../common/si-chart-base.component.html',\n  styleUrl: '../common/si-chart-base.component.scss',\n  changeDetection: ChangeDetectionStrategy.Eager\n})\nexport class SiChartGaugeComponent extends SiChartBaseComponent implements OnChanges {\n  /** @defaultValue 0 */\n  readonly minValue = input(0);\n  /** @defaultValue 100 */\n  readonly maxValue = input(100);\n  /** @defaultValue 0 */\n  readonly value = input(0);\n  readonly splitSteps = input<number>();\n  /** @defaultValue true */\n  readonly responsiveSplitSteps = input(true);\n  /** @defaultValue '%' */\n  readonly unit = input('%');\n  /** @defaultValue false */\n  readonly unitsOnSplit = input(false);\n  /**\n   * Custom formatter for axis labels.\n   * Takes precedence when specified, i.e. number of decimals, unit etc needs\n   * to be set by the user using this formatter.\n   */\n  readonly labelFormatter = input<(val: number) => string>();\n  /**\n   * Custom formatter for value.\n   * Takes precedence when specified, i.e. number of decimals needs\n   * to be set by the user using this formatter.\n   */\n  readonly valueFormatter = input<(val: number) => string>();\n  /**\n   * Min number of decimals.\n   * Possible values are from 0 to 100.\n   * @defaultValue 0\n   */\n  readonly minNumberOfDecimals = input(0);\n  /**\n   * Max number of decimals.\n   * Possible values are from 0 to 100.\n   * @defaultValue 0\n   */\n  readonly maxNumberOfDecimals = input(0);\n  /**\n   * Number of decimals on the axis.\n   * Possible values are from 0 to 100.\n   * @defaultValue 0\n   */\n  readonly axisNumberOfDecimals = input(0);\n  /** @defaultValue false */\n  readonly hideAxisLabels = input(false, { transform: booleanAttribute });\n  /**\n   * Segments on the arc from 0 (implicit) to 1 (explicit)\n   * E.g. 0.2 means from 0 to 0.2 of the possible range (maxValue - minValue)\n   *\n   * @defaultValue [0.2, 0.8, 1]\n   */\n  readonly segments = input<number[]>([0.2, 0.8, 1]);\n  /**\n   * Colors for the defined segments.\n   * If there are less colors then segments, the colors will be repeated. Defaults to the standard color palette\n   */\n  readonly colors = input<string[]>();\n\n  private readonly locale = inject(LOCALE_ID).toString();\n  private readonly numberFormat = computed(() => {\n    const minDecimals = this.minNumberOfDecimals();\n    return new Intl.NumberFormat(this.locale, {\n      minimumFractionDigits: minDecimals,\n      maximumFractionDigits: Math.max(minDecimals, this.maxNumberOfDecimals())\n    });\n  });\n\n  private readonly axisNumberFormat = computed(() => {\n    const decimals = this.axisNumberOfDecimals();\n    return new Intl.NumberFormat(this.locale, {\n      minimumFractionDigits: decimals,\n      maximumFractionDigits: decimals\n    });\n  });\n\n  protected override afterChartInit(): void {\n    super.afterChartInit();\n    this.applyOptions();\n    this.updateColors();\n    this.refreshSeries();\n  }\n\n  private updateColors(): void {\n    // gauge doesn't respect color palette, it needs a bit convincing\n    const effectiveOpts: any = this.getOptionNoClone();\n    const colors: string[] = this.colors() ?? effectiveOpts.color;\n    const hasIndicator = !!this.segments().length;\n\n    let newColors: [number, string][];\n    if (hasIndicator) {\n      newColors = this.segments().map((threshold, index) => {\n        const color = colors[index % colors.length];\n        return [threshold, color];\n      });\n    } else {\n      const colorsValue = this.colors();\n      const dataColor = colorsValue?.length\n        ? colorsValue[0]\n        : this.getThemeCustomValue(['gauge', 'defaultColor'], colors[0]);\n      newColors = [[1, dataColor]];\n    }\n\n    if (hasIndicator) {\n      this.setAxisLineColor(newColors, (this.actualOptions.series![0] as any).axisLine);\n    }\n    (this.actualOptions.series![0] as any).axisLine.show = hasIndicator;\n\n    this.setAxisLineColor(newColors, (this.actualOptions.series![2] as any).axisLine);\n    this.refreshSeries();\n  }\n\n  private setAxisLineColor(colors: [number, string][], axisLine: any): void {\n    axisLine.lineStyle = axisLine.lineStyle ?? {};\n    axisLine.lineStyle.color = colors;\n  }\n\n  private getResponsiveConfig(): {\n    outerRadius: number;\n    center: (string | number)[];\n    progressWidth: number;\n    indicatorWidth: number;\n    gap: number;\n    splits: number;\n    axisLabelDist: number;\n    axisFontSize: number;\n    valueFontSize: number;\n    unitFontSize: number;\n  } {\n    const marginY = 12;\n    const maxHeight = this.curHeight - marginY;\n    const dim = Math.min(this.curWidth / 2, maxHeight);\n    const top = dim < maxHeight ? this.curHeight / 2 + dim / 2 : maxHeight;\n\n    if (dim < 150) {\n      const splits = dim < 100 ? 1 : 4;\n      const axisLabelDist = dim < 100 ? -6 : 0;\n      return {\n        outerRadius: dim - 4,\n        center: ['50%', top],\n        progressWidth: 8,\n        indicatorWidth: 1,\n        gap: 2,\n        splits,\n        axisLabelDist,\n        axisFontSize: 12,\n        valueFontSize: 18,\n        unitFontSize: 12\n      };\n    }\n\n    if (dim < 200) {\n      return {\n        outerRadius: dim - 7,\n        center: ['50%', top],\n        progressWidth: 14,\n        indicatorWidth: 3,\n        gap: 3,\n        splits: 6,\n        axisLabelDist: 12,\n        axisFontSize: 16,\n        valueFontSize: 30,\n        unitFontSize: 14\n      };\n    }\n\n    return {\n      outerRadius: dim - 12,\n      center: ['50%', top],\n      progressWidth: 24,\n      indicatorWidth: 4,\n      gap: 5,\n      splits: 0,\n      axisLabelDist: 20,\n      axisFontSize: 20,\n      valueFontSize: 40,\n      unitFontSize: 14\n    };\n  }\n\n  private readonly axisLabelFormatter = (value: any): string => {\n    const formatted = this.axisNumberFormat().format(Number(value));\n    return this.unitsOnSplit() ? `${formatted} ${this.unit()}` : formatted;\n  };\n\n  protected override applyOptions(): void {\n    const resp = this.getResponsiveConfig();\n    const hasIndicator = !!this.segments().length;\n\n    const splitNumber =\n      this.responsiveSplitSteps() && resp.splits ? resp.splits : this.splitSteps();\n    const grey = this.getThemeCustomValue(['gauge', 'grey'], '#F0F2F5');\n    const axisColor = this.getThemeCustomValue(['gauge', 'unit'], '#656A6F');\n\n    const indicator: GaugeSeriesOption = {\n      type: 'gauge',\n      radius: resp.outerRadius - resp.progressWidth - resp.gap,\n      startAngle: 180,\n      endAngle: 0,\n      min: this.minValue(),\n      max: this.maxValue(),\n      center: resp.center,\n      axisLine: {\n        show: hasIndicator,\n        lineStyle: { width: resp.indicatorWidth }\n      },\n      axisTick: {\n        length: 0,\n        splitNumber: 1,\n        lineStyle: {\n          width: 2,\n          color: axisColor\n        }\n      },\n      splitLine: {\n        length: 0,\n        lineStyle: {\n          width: 1,\n          color: axisColor\n        }\n      },\n      axisLabel: { show: false }\n    };\n\n    const labelDistance = resp.axisLabelDist + (hasIndicator ? resp.indicatorWidth + resp.gap : 0);\n\n    const shade: GaugeSeriesOption = {\n      type: 'gauge',\n      radius: resp.outerRadius,\n      startAngle: 180,\n      endAngle: 0,\n      min: this.minValue(),\n      max: this.maxValue(),\n      splitNumber,\n      axisTick: { show: false },\n      splitLine: { show: false },\n      title: { show: false },\n      center: resp.center,\n      axisLine: {\n        lineStyle: {\n          width: resp.progressWidth,\n          opacity: 0.6,\n          color: [[1, grey]]\n        }\n      },\n      axisLabel: {\n        show: !this.hideAxisLabels(),\n        distance: labelDistance,\n        color: axisColor,\n        fontSize: resp.axisFontSize,\n        formatter: this.labelFormatter() ?? this.axisLabelFormatter\n      }\n    };\n\n    const data: GaugeSeriesOption = {\n      type: 'gauge',\n      silent: false,\n      radius: resp.outerRadius,\n      startAngle: 180,\n      endAngle: 0,\n      min: this.minValue(),\n      max: this.maxValue(),\n      splitNumber,\n      progress: {\n        show: true,\n        itemStyle: { color: 'auto' },\n        width: resp.progressWidth\n      },\n      emphasis: {\n        // This code is added to avoid flickering when the progress is hovered and\n        // when mouse effects are enabled with `silent: false` flag. The issue occurs\n        // because of the progress.itemStyle.color is set to `auto` which tries to\n        // calculate the color dynamically and it conflicts with the mouse hover action\n        // which tries to apply the hover style\n        itemStyle: { color: 'auto' }\n      },\n      pointer: {\n        show: true,\n        length: '0%',\n        itemStyle: {\n          color: 'auto',\n          opacity: 0.001\n        }\n      },\n      center: resp.center,\n      axisLine: {\n        show: false,\n        lineStyle: { opacity: 0.6 }\n      },\n      axisTick: { show: false },\n      splitLine: { show: false },\n      axisLabel: { show: false },\n      title: { show: false },\n      detail: {\n        offsetCenter: [0, -0.5 * resp.valueFontSize],\n        valueAnimation: true,\n        formatter: this.valueFormatterInternal(),\n        rich: {\n          value: {\n            fontSize: resp.valueFontSize,\n            lineHeight: resp.valueFontSize,\n            fontWeight: 600\n          },\n          unit: {\n            fontSize: resp.unitFontSize,\n            lineHeight: resp.unitFontSize,\n            padding: [0, 0, (resp.unitFontSize - resp.valueFontSize) / 2, 0]\n          }\n        }\n      },\n      data: [{ value: this.value() }]\n    };\n\n    const series: GaugeSeriesOption[] = [indicator, shade, data];\n\n    this.showLegend.set(false);\n    this.actualOptions.series = series;\n\n    this.applyTitles();\n  }\n\n  private valueFormatterInternal(): (val: number) => string {\n    const unit = this.unit();\n    const valueFormatter = this.valueFormatter();\n    const labelFormatter = this.labelFormatter();\n\n    const formattedUnit = unit ? (unit.length > 5 ? `\\n{unit|${unit}}` : ` {unit|${unit}}`) : '';\n\n    return (value: number): string => {\n      if (valueFormatter) {\n        return `{value|${valueFormatter(value)}}${formattedUnit}`;\n      }\n      // DEPRECATED: Use the new input `valueFormatter` to format the value.\n      // labelFormatter should be removed from here in future versions.\n      if (labelFormatter) {\n        return labelFormatter(value);\n      }\n      return `{value|${this.numberFormat().format(value)}}${formattedUnit}`;\n    };\n  }\n\n  override ngOnChanges(changes: SimpleChanges<unknown>): void {\n    if (this.chart && (changes.palette || changes.colors || changes.segments)) {\n      this.updateColors();\n    }\n    changes.forceAll = new SimpleChange(false, true, false);\n    super.ngOnChanges(changes);\n  }\n\n  protected override applyDataZoom(): void {}\n\n  protected override afterChartResize(): void {\n    this.applyOptions();\n    this.refreshSeries();\n  }\n\n  /**\n   * Update gauge chart value.\n   */\n  setValue(value: number): void {\n    const optionSeries = this.actualOptions.series as GaugeChartSeries[];\n    optionSeries[2].data[0].value = value;\n    this.refreshSeries();\n  }\n}\n","@if (showCustomLegend() && (title() || subTitle())) {\n  <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n    <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n    @if (subTitle()) {\n      <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n    }\n  </div>\n}\n\n<div\n  #chartContainerWrapper\n  class=\"chart-container-wrapper\"\n  [class.chart-scroll]=\"containerHeight()\"\n  [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n  <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n    @if (showCustomLegend()) {\n      @for (cl of customLegend; track $index) {\n        <si-custom-legend\n          #siCustomLegend\n          class=\"custom-legend\"\n          [style.top.px]=\"cl.top\"\n          [title]=\"title()\"\n          [subTitle]=\"subTitle()\"\n          [customLegend]=\"cl\"\n          [style.background-color]=\"backgroundColor()\"\n          [titleColor]=\"titleColor()\"\n          [subTitleColor]=\"subTitleColor()\"\n          [textColor]=\"textColor()\"\n          (legendIconClickEvent)=\"handleLegendClick($event)\"\n          (legendClickEvent)=\"handleLegendClick($event)\"\n          (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n          (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n        />\n      }\n    }\n    <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n  </div>\n</div>\n@if (externalZoomSlider()) {\n  <div\n    #externalZoomSlider\n    class=\"external-zoom-container\"\n    [class.has-time-range-bar]=\"showTimeRangeBar()\"\n    [style.--time-bar-height.px]=\"timeBarHeight()\"\n  ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n  <div\n    class=\"time-range-bar\"\n    [style.bottom.px]=\"timeBarBottom()\"\n    [style.padding-left.px]=\"timeBarLeft()\"\n    [style.padding-right.px]=\"timeBarRight()\"\n  >\n    <ng-content select=\"[slot=timeRangeBar]\" />\n  </div>\n}\n\n@if (inProgress()) {\n  <div class=\"progress-container\">\n    <si-chart-loading-spinner />\n  </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart-gauge.component';\nexport * from './si-chart-gauge.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/spike-rabbit-charts-ng-loading-spinner.mjs

@@ -0,0 +1,27 @@
+import * as i0 from '@angular/core';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+/**
+ * Copyright (c) Siemens 2016 - 2026
+ * SPDX-License-Identifier: MIT
+ */
+class SiChartLoadingSpinnerComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiChartLoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: SiChartLoadingSpinnerComponent, isStandalone: true, selector: "si-chart-loading-spinner", ngImport: i0, template: "<div class=\"loading\">\n  <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n    <g>\n      <path d=\"M256,156a16,16,0,0,1-16-16V80a16,16,0,0,1,32,0v60A16,16,0,0,1,256,156Z\" />\n      <path\n        d=\"M314.78,175.1a16,16,0,0,1-3.54-22.35l35.27-48.54A16,16,0,1,1,372.39,123l-35.26,48.54A16,16,0,0,1,314.78,175.1Z\"\n      />\n      <path\n        d=\"M351.11,225.1a16,16,0,0,1,10.27-20.16l57.06-18.54a16,16,0,1,1,9.89,30.43l-57.06,18.54A16,16,0,0,1,351.11,225.1Z\"\n      />\n      <path\n        d=\"M351.11,286.9a16,16,0,0,1,20.16-10.27l57.06,18.54a16,16,0,1,1-9.89,30.43l-57.06-18.54A16,16,0,0,1,351.11,286.9Z\"\n      />\n      <path\n        d=\"M314.78,336.9a16,16,0,0,1,22.35,3.54L372.39,389a16,16,0,1,1-25.88,18.81l-35.27-48.54A16,16,0,0,1,314.78,336.9Z\"\n      />\n      <path d=\"M256,356a16,16,0,0,1,16,16v60a16,16,0,0,1-32,0V372A16,16,0,0,1,256,356Z\" />\n      <path\n        d=\"M197.22,336.9a16,16,0,0,1,3.54,22.35l-35.27,48.54A16,16,0,1,1,139.61,389l35.26-48.54A16,16,0,0,1,197.22,336.9Z\"\n      />\n      <path\n        d=\"M160.89,286.9a16,16,0,0,1-10.27,20.16L93.56,325.6a16,16,0,0,1-9.89-30.43l57.06-18.54A16,16,0,0,1,160.89,286.9Z\"\n      />\n      <path\n        d=\"M160.89,225.1a16,16,0,0,1-20.16,10.27L83.67,216.83a16,16,0,1,1,9.89-30.43l57.06,18.54A16,16,0,0,1,160.89,225.1Z\"\n      />\n      <path\n        d=\"M197.22,175.1a16,16,0,0,1-22.35-3.54L139.61,123a16,16,0,1,1,25.88-18.81l35.27,48.54A16,16,0,0,1,197.22,175.1Z\"\n      />\n    </g>\n  </svg>\n</div>\n", styles: ["@keyframes spinner-fade{0%{opacity:1}to{opacity:.05}}.loading{display:block;text-align:center}svg{inline-size:var(--loading-spinner-size, 64px);block-size:var(--loading-spinner-size, 64px)}path{fill:var(--element-ui-2, #656a6f);animation:spinner-fade 1s infinite linear}path:nth-child(1){animation-delay:0s;opacity:1}path:nth-child(2){animation-delay:.1s;opacity:.9}path:nth-child(3){animation-delay:.2s;opacity:.8}path:nth-child(4){animation-delay:.3s;opacity:.7}path:nth-child(5){animation-delay:.4s;opacity:.6}path:nth-child(6){animation-delay:.5s;opacity:.5}path:nth-child(7){animation-delay:.6s;opacity:.4}path:nth-child(8){animation-delay:.7s;opacity:.3}path:nth-child(9){animation-delay:.8s;opacity:.2}path:nth-child(10){animation-delay:.9s;opacity:.1}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SiChartLoadingSpinnerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'si-chart-loading-spinner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"loading\">\n  <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n    <g>\n      <path d=\"M256,156a16,16,0,0,1-16-16V80a16,16,0,0,1,32,0v60A16,16,0,0,1,256,156Z\" />\n      <path\n        d=\"M314.78,175.1a16,16,0,0,1-3.54-22.35l35.27-48.54A16,16,0,1,1,372.39,123l-35.26,48.54A16,16,0,0,1,314.78,175.1Z\"\n      />\n      <path\n        d=\"M351.11,225.1a16,16,0,0,1,10.27-20.16l57.06-18.54a16,16,0,1,1,9.89,30.43l-57.06,18.54A16,16,0,0,1,351.11,225.1Z\"\n      />\n      <path\n        d=\"M351.11,286.9a16,16,0,0,1,20.16-10.27l57.06,18.54a16,16,0,1,1-9.89,30.43l-57.06-18.54A16,16,0,0,1,351.11,286.9Z\"\n      />\n      <path\n        d=\"M314.78,336.9a16,16,0,0,1,22.35,3.54L372.39,389a16,16,0,1,1-25.88,18.81l-35.27-48.54A16,16,0,0,1,314.78,336.9Z\"\n      />\n      <path d=\"M256,356a16,16,0,0,1,16,16v60a16,16,0,0,1-32,0V372A16,16,0,0,1,256,356Z\" />\n      <path\n        d=\"M197.22,336.9a16,16,0,0,1,3.54,22.35l-35.27,48.54A16,16,0,1,1,139.61,389l35.26-48.54A16,16,0,0,1,197.22,336.9Z\"\n      />\n      <path\n        d=\"M160.89,286.9a16,16,0,0,1-10.27,20.16L93.56,325.6a16,16,0,0,1-9.89-30.43l57.06-18.54A16,16,0,0,1,160.89,286.9Z\"\n      />\n      <path\n        d=\"M160.89,225.1a16,16,0,0,1-20.16,10.27L83.67,216.83a16,16,0,1,1,9.89-30.43l57.06,18.54A16,16,0,0,1,160.89,225.1Z\"\n      />\n      <path\n        d=\"M197.22,175.1a16,16,0,0,1-22.35-3.54L139.61,123a16,16,0,1,1,25.88-18.81l35.27,48.54A16,16,0,0,1,197.22,175.1Z\"\n      />\n    </g>\n  </svg>\n</div>\n", styles: ["@keyframes spinner-fade{0%{opacity:1}to{opacity:.05}}.loading{display:block;text-align:center}svg{inline-size:var(--loading-spinner-size, 64px);block-size:var(--loading-spinner-size, 64px)}path{fill:var(--element-ui-2, #656a6f);animation:spinner-fade 1s infinite linear}path:nth-child(1){animation-delay:0s;opacity:1}path:nth-child(2){animation-delay:.1s;opacity:.9}path:nth-child(3){animation-delay:.2s;opacity:.8}path:nth-child(4){animation-delay:.3s;opacity:.7}path:nth-child(5){animation-delay:.4s;opacity:.6}path:nth-child(6){animation-delay:.5s;opacity:.5}path:nth-child(7){animation-delay:.6s;opacity:.4}path:nth-child(8){animation-delay:.7s;opacity:.3}path:nth-child(9){animation-delay:.8s;opacity:.2}path:nth-child(10){animation-delay:.9s;opacity:.1}\n"] }]
+        }] });
+
+/**
+ * Copyright (c) Siemens 2016 - 2026
+ * SPDX-License-Identifier: MIT
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SiChartLoadingSpinnerComponent };
+//# sourceMappingURL=spike-rabbit-charts-ng-loading-spinner.mjs.map

package/fesm2022/spike-rabbit-charts-ng-loading-spinner.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"spike-rabbit-charts-ng-loading-spinner.mjs","sources":["../../../../projects/charts-ng/loading-spinner/si-chart-loading-spinner.component.ts","../../../../projects/charts-ng/loading-spinner/si-chart-loading-spinner.component.html","../../../../projects/charts-ng/loading-spinner/index.ts","../../../../projects/charts-ng/loading-spinner/spike-rabbit-charts-ng-loading-spinner.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n  selector: 'si-chart-loading-spinner',\n  templateUrl: './si-chart-loading-spinner.component.html',\n  styleUrl: './si-chart-loading-spinner.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SiChartLoadingSpinnerComponent {}\n","<div class=\"loading\">\n  <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n    <g>\n      <path d=\"M256,156a16,16,0,0,1-16-16V80a16,16,0,0,1,32,0v60A16,16,0,0,1,256,156Z\" />\n      <path\n        d=\"M314.78,175.1a16,16,0,0,1-3.54-22.35l35.27-48.54A16,16,0,1,1,372.39,123l-35.26,48.54A16,16,0,0,1,314.78,175.1Z\"\n      />\n      <path\n        d=\"M351.11,225.1a16,16,0,0,1,10.27-20.16l57.06-18.54a16,16,0,1,1,9.89,30.43l-57.06,18.54A16,16,0,0,1,351.11,225.1Z\"\n      />\n      <path\n        d=\"M351.11,286.9a16,16,0,0,1,20.16-10.27l57.06,18.54a16,16,0,1,1-9.89,30.43l-57.06-18.54A16,16,0,0,1,351.11,286.9Z\"\n      />\n      <path\n        d=\"M314.78,336.9a16,16,0,0,1,22.35,3.54L372.39,389a16,16,0,1,1-25.88,18.81l-35.27-48.54A16,16,0,0,1,314.78,336.9Z\"\n      />\n      <path d=\"M256,356a16,16,0,0,1,16,16v60a16,16,0,0,1-32,0V372A16,16,0,0,1,256,356Z\" />\n      <path\n        d=\"M197.22,336.9a16,16,0,0,1,3.54,22.35l-35.27,48.54A16,16,0,1,1,139.61,389l35.26-48.54A16,16,0,0,1,197.22,336.9Z\"\n      />\n      <path\n        d=\"M160.89,286.9a16,16,0,0,1-10.27,20.16L93.56,325.6a16,16,0,0,1-9.89-30.43l57.06-18.54A16,16,0,0,1,160.89,286.9Z\"\n      />\n      <path\n        d=\"M160.89,225.1a16,16,0,0,1-20.16,10.27L83.67,216.83a16,16,0,1,1,9.89-30.43l57.06,18.54A16,16,0,0,1,160.89,225.1Z\"\n      />\n      <path\n        d=\"M197.22,175.1a16,16,0,0,1-22.35-3.54L139.61,123a16,16,0,1,1,25.88-18.81l35.27,48.54A16,16,0,0,1,197.22,175.1Z\"\n      />\n    </g>\n  </svg>\n</div>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart-loading-spinner.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAAA;;;AAGG;MASU,8BAA8B,CAAA;uGAA9B,8BAA8B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAA9B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,8BAA8B,oFCZ3C,2+CAgCA,EAAA,MAAA,EAAA,CAAA,2vBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FDpBa,8BAA8B,EAAA,UAAA,EAAA,CAAA;kBAN1C,SAAS;+BACE,0BAA0B,EAAA,eAAA,EAGnB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,2+CAAA,EAAA,MAAA,EAAA,CAAA,2vBAAA,CAAA,EAAA;;;AEVjD;;;AAGG;;ACHH;;AAEG;;;;"}