@siemens/charts-ng 49.10.0 → 49.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { viewChild, input, output, Component } from '@angular/core';
2
+ import { viewChild, input, output, ChangeDetectionStrategy, Component } from '@angular/core';
3
3
 
4
4
  /**
5
5
  * Copyright (c) Siemens 2016 - 2026
@@ -36,11 +36,11 @@ class SiCustomLegendComponent {
36
36
  this.legendClickEvent.emit(legend);
37
37
  }
38
38
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiCustomLegendComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
39
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiCustomLegendComponent, isStandalone: true, selector: "si-custom-legend", inputs: { customLegend: { classPropertyName: "customLegend", publicName: "customLegend", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, titleColor: { classPropertyName: "titleColor", publicName: "titleColor", isSignal: true, isRequired: false, transformFunction: null }, subTitleColor: { classPropertyName: "subTitleColor", publicName: "subTitleColor", isSignal: true, isRequired: false, transformFunction: null }, textColor: { classPropertyName: "textColor", publicName: "textColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { legendIconClickEvent: "legendIconClickEvent", legendClickEvent: "legendClickEvent", legendHoverStartEvent: "legendHoverStartEvent", legendHoverEndEvent: "legendHoverEndEvent" }, viewQueries: [{ propertyName: "customLegendContainer", first: true, predicate: ["customLegendContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (customLegend() && customLegend()?.customLegends) {\n <div #customLegendContainer class=\"legend-container si-body\">\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 0 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"left-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'left' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"both-scenario-left-unit-container\"\n [class.left-scenario-unit-container]=\"customLegend()?.legendAxis === 'left'\"\n >\n <span class=\"text-secondary\">{{ leg.unit }}</span>\n </div>\n <div\n class=\"legend-item-container both-scenario-legend-container custom-legend-left\"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div class=\"legend-item\" [class.hidden-legend]=\"!legendItem.selected\">\n <div\n class=\"me-4 d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 1 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"right-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'right' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'right'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"legend-item-container custom-legend-right legend-item-container-right-floating-inner\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div\n class=\"legend-item legend-item-right\"\n [class.hidden-legend]=\"!legendItem.selected\"\n >\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n <div\n class=\"right-legend-circle d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n <div\n class=\"both-scenario-right-unit-container\"\n [class.right-scenario-unit-container]=\"customLegend()?.legendAxis === 'right'\"\n >\n <span class=\"right-unit-text text-secondary\">{{ leg.unit }}</span>\n </div>\n </div>\n }\n }\n </div>\n}\n", styles: [":host{--flex-dir1: row;--flex-dir2: row-reverse;margin:12px;display:flex;flex-direction:column}:host-context(:dir(rtl)){--flex-dir1: row-reverse;--flex-dir2: row}:host-context([dir=rtl]){--flex-dir1: row-reverse;--flex-dir2: row}.legend-container{display:flex;flex-direction:var(--flex-dir1);max-height:40px;flex:1 1 auto}.legend-item-container{width:50%;vertical-align:top;display:flex;flex-wrap:wrap;flex:1 1 100%;flex-direction:var(--flex-dir1);height:fit-content;max-height:40px;max-width:50%;min-width:50%;overflow-y:auto;scrollbar-width:thin}.legend-item-container::-webkit-scrollbar{width:4px;height:6px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container::-webkit-scrollbar-thumb{border-radius:12px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.legend-item-container::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);border-radius:12px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container .custom-legend-left{flex-direction:var(--flex-dir1);flex:1 1 50%}.legend-item-container .custom-legend-right{flex-direction:var(--flex-dir2);flex:1 1 50%}.legend-item-container-right-floating-inner{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-right:12px;float:left}.legend-single-axis{max-width:100%;min-width:100%}.legend-empty{width:0%}.tooltip{display:none;max-width:375px;word-break:break-word;margin-top:16px;inset-block-start:0;margin-inline-start:-6px}.tooltip-arrow{left:12px}.legend-item{cursor:pointer;margin-right:12px;display:flex;flex-direction:var(--flex-dir1);align-items:center;height:20px;position:initial;width:calc(100% - 12px);max-width:fit-content}.legend-item:hover .tooltip{display:block}.legend-item-right{margin-right:0;margin-left:12px}.right-legend-circle{margin-right:0;margin-left:8px}.legend-text{box-sizing:inherit;display:inline;cursor:pointer}.hidden-legend .right-legend-circle,.hidden-legend div:first-child,.hidden-legend .legend-text{opacity:.4}.both-scenario-left-unit-container,.both-scenario-right-unit-container{min-width:32px;max-width:32px;overflow:hidden}.both-scenario-right-unit-container{max-height:100%}.both-scenario-left-unit-container{min-height:100%}.both-scenario-legend-container{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-left:12px}.right-unit-text{min-width:100%;min-height:100%;padding-left:2px}.left-legends{padding-right:36px}.right-legends{padding-left:28px}.both-legend-container{padding-right:0;padding-left:0}\n"] });
39
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiCustomLegendComponent, isStandalone: true, selector: "si-custom-legend", inputs: { customLegend: { classPropertyName: "customLegend", publicName: "customLegend", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, titleColor: { classPropertyName: "titleColor", publicName: "titleColor", isSignal: true, isRequired: false, transformFunction: null }, subTitleColor: { classPropertyName: "subTitleColor", publicName: "subTitleColor", isSignal: true, isRequired: false, transformFunction: null }, textColor: { classPropertyName: "textColor", publicName: "textColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { legendIconClickEvent: "legendIconClickEvent", legendClickEvent: "legendClickEvent", legendHoverStartEvent: "legendHoverStartEvent", legendHoverEndEvent: "legendHoverEndEvent" }, viewQueries: [{ propertyName: "customLegendContainer", first: true, predicate: ["customLegendContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (customLegend() && customLegend()?.customLegends) {\n <div #customLegendContainer class=\"legend-container si-body\">\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 0 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"left-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'left' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"both-scenario-left-unit-container\"\n [class.left-scenario-unit-container]=\"customLegend()?.legendAxis === 'left'\"\n >\n <span class=\"text-secondary\">{{ leg.unit }}</span>\n </div>\n <div\n class=\"legend-item-container both-scenario-legend-container custom-legend-left\"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div class=\"legend-item\" [class.hidden-legend]=\"!legendItem.selected\">\n <div\n class=\"me-4 d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 1 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"right-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'right' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'right'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"legend-item-container custom-legend-right legend-item-container-right-floating-inner\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div\n class=\"legend-item legend-item-right\"\n [class.hidden-legend]=\"!legendItem.selected\"\n >\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n <div\n class=\"right-legend-circle d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n <div\n class=\"both-scenario-right-unit-container\"\n [class.right-scenario-unit-container]=\"customLegend()?.legendAxis === 'right'\"\n >\n <span class=\"right-unit-text text-secondary\">{{ leg.unit }}</span>\n </div>\n </div>\n }\n }\n </div>\n}\n", styles: [":host{--flex-dir1: row;--flex-dir2: row-reverse;margin:12px;display:flex;flex-direction:column}:host-context(:dir(rtl)){--flex-dir1: row-reverse;--flex-dir2: row}:host-context([dir=rtl]){--flex-dir1: row-reverse;--flex-dir2: row}.legend-container{display:flex;flex-direction:var(--flex-dir1);max-height:40px;flex:1 1 auto}.legend-item-container{width:50%;vertical-align:top;display:flex;flex-wrap:wrap;flex:1 1 100%;flex-direction:var(--flex-dir1);height:fit-content;max-height:40px;max-width:50%;min-width:50%;overflow-y:auto;scrollbar-width:thin}.legend-item-container::-webkit-scrollbar{width:4px;height:6px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container::-webkit-scrollbar-thumb{border-radius:12px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.legend-item-container::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);border-radius:12px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container .custom-legend-left{flex-direction:var(--flex-dir1);flex:1 1 50%}.legend-item-container .custom-legend-right{flex-direction:var(--flex-dir2);flex:1 1 50%}.legend-item-container-right-floating-inner{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-right:12px;float:left}.legend-single-axis{max-width:100%;min-width:100%}.legend-empty{width:0%}.tooltip{display:none;max-width:375px;word-break:break-word;margin-top:16px;inset-block-start:0;margin-inline-start:-6px}.tooltip-arrow{left:12px}.legend-item{cursor:pointer;margin-right:12px;display:flex;flex-direction:var(--flex-dir1);align-items:center;height:20px;position:initial;width:calc(100% - 12px);max-width:fit-content}.legend-item:hover .tooltip{display:block}.legend-item-right{margin-right:0;margin-left:12px}.right-legend-circle{margin-right:0;margin-left:8px}.legend-text{box-sizing:inherit;display:inline;cursor:pointer}.hidden-legend .right-legend-circle,.hidden-legend div:first-child,.hidden-legend .legend-text{opacity:.4}.both-scenario-left-unit-container,.both-scenario-right-unit-container{min-width:32px;max-width:32px;overflow:hidden}.both-scenario-right-unit-container{max-height:100%}.both-scenario-left-unit-container{min-height:100%}.both-scenario-legend-container{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-left:12px}.right-unit-text{min-width:100%;min-height:100%;padding-left:2px}.left-legends{padding-right:36px}.right-legends{padding-left:28px}.both-legend-container{padding-right:0;padding-left:0}\n"], changeDetection: i0.ChangeDetectionStrategy.Default });
40
40
  }
41
41
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiCustomLegendComponent, decorators: [{
42
42
  type: Component,
43
- args: [{ selector: 'si-custom-legend', template: "@if (customLegend() && customLegend()?.customLegends) {\n <div #customLegendContainer class=\"legend-container si-body\">\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 0 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"left-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'left' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"both-scenario-left-unit-container\"\n [class.left-scenario-unit-container]=\"customLegend()?.legendAxis === 'left'\"\n >\n <span class=\"text-secondary\">{{ leg.unit }}</span>\n </div>\n <div\n class=\"legend-item-container both-scenario-legend-container custom-legend-left\"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div class=\"legend-item\" [class.hidden-legend]=\"!legendItem.selected\">\n <div\n class=\"me-4 d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 1 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"right-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'right' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'right'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"legend-item-container custom-legend-right legend-item-container-right-floating-inner\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div\n class=\"legend-item legend-item-right\"\n [class.hidden-legend]=\"!legendItem.selected\"\n >\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n <div\n class=\"right-legend-circle d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n <div\n class=\"both-scenario-right-unit-container\"\n [class.right-scenario-unit-container]=\"customLegend()?.legendAxis === 'right'\"\n >\n <span class=\"right-unit-text text-secondary\">{{ leg.unit }}</span>\n </div>\n </div>\n }\n }\n </div>\n}\n", styles: [":host{--flex-dir1: row;--flex-dir2: row-reverse;margin:12px;display:flex;flex-direction:column}:host-context(:dir(rtl)){--flex-dir1: row-reverse;--flex-dir2: row}:host-context([dir=rtl]){--flex-dir1: row-reverse;--flex-dir2: row}.legend-container{display:flex;flex-direction:var(--flex-dir1);max-height:40px;flex:1 1 auto}.legend-item-container{width:50%;vertical-align:top;display:flex;flex-wrap:wrap;flex:1 1 100%;flex-direction:var(--flex-dir1);height:fit-content;max-height:40px;max-width:50%;min-width:50%;overflow-y:auto;scrollbar-width:thin}.legend-item-container::-webkit-scrollbar{width:4px;height:6px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container::-webkit-scrollbar-thumb{border-radius:12px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.legend-item-container::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);border-radius:12px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container .custom-legend-left{flex-direction:var(--flex-dir1);flex:1 1 50%}.legend-item-container .custom-legend-right{flex-direction:var(--flex-dir2);flex:1 1 50%}.legend-item-container-right-floating-inner{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-right:12px;float:left}.legend-single-axis{max-width:100%;min-width:100%}.legend-empty{width:0%}.tooltip{display:none;max-width:375px;word-break:break-word;margin-top:16px;inset-block-start:0;margin-inline-start:-6px}.tooltip-arrow{left:12px}.legend-item{cursor:pointer;margin-right:12px;display:flex;flex-direction:var(--flex-dir1);align-items:center;height:20px;position:initial;width:calc(100% - 12px);max-width:fit-content}.legend-item:hover .tooltip{display:block}.legend-item-right{margin-right:0;margin-left:12px}.right-legend-circle{margin-right:0;margin-left:8px}.legend-text{box-sizing:inherit;display:inline;cursor:pointer}.hidden-legend .right-legend-circle,.hidden-legend div:first-child,.hidden-legend .legend-text{opacity:.4}.both-scenario-left-unit-container,.both-scenario-right-unit-container{min-width:32px;max-width:32px;overflow:hidden}.both-scenario-right-unit-container{max-height:100%}.both-scenario-left-unit-container{min-height:100%}.both-scenario-legend-container{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-left:12px}.right-unit-text{min-width:100%;min-height:100%;padding-left:2px}.left-legends{padding-right:36px}.right-legends{padding-left:28px}.both-legend-container{padding-right:0;padding-left:0}\n"] }]
43
+ args: [{ selector: 'si-custom-legend', changeDetection: ChangeDetectionStrategy.Default, template: "@if (customLegend() && customLegend()?.customLegends) {\n <div #customLegendContainer class=\"legend-container si-body\">\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 0 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"left-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'left' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"both-scenario-left-unit-container\"\n [class.left-scenario-unit-container]=\"customLegend()?.legendAxis === 'left'\"\n >\n <span class=\"text-secondary\">{{ leg.unit }}</span>\n </div>\n <div\n class=\"legend-item-container both-scenario-legend-container custom-legend-left\"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div class=\"legend-item\" [class.hidden-legend]=\"!legendItem.selected\">\n <div\n class=\"me-4 d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 1 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"right-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'right' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'right'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"legend-item-container custom-legend-right legend-item-container-right-floating-inner\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div\n class=\"legend-item legend-item-right\"\n [class.hidden-legend]=\"!legendItem.selected\"\n >\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n <div\n class=\"right-legend-circle d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n <div\n class=\"both-scenario-right-unit-container\"\n [class.right-scenario-unit-container]=\"customLegend()?.legendAxis === 'right'\"\n >\n <span class=\"right-unit-text text-secondary\">{{ leg.unit }}</span>\n </div>\n </div>\n }\n }\n </div>\n}\n", styles: [":host{--flex-dir1: row;--flex-dir2: row-reverse;margin:12px;display:flex;flex-direction:column}:host-context(:dir(rtl)){--flex-dir1: row-reverse;--flex-dir2: row}:host-context([dir=rtl]){--flex-dir1: row-reverse;--flex-dir2: row}.legend-container{display:flex;flex-direction:var(--flex-dir1);max-height:40px;flex:1 1 auto}.legend-item-container{width:50%;vertical-align:top;display:flex;flex-wrap:wrap;flex:1 1 100%;flex-direction:var(--flex-dir1);height:fit-content;max-height:40px;max-width:50%;min-width:50%;overflow-y:auto;scrollbar-width:thin}.legend-item-container::-webkit-scrollbar{width:4px;height:6px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container::-webkit-scrollbar-thumb{border-radius:12px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.legend-item-container::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);border-radius:12px;background-color:var(--element-base-0, #f0f2f5)}.legend-item-container .custom-legend-left{flex-direction:var(--flex-dir1);flex:1 1 50%}.legend-item-container .custom-legend-right{flex-direction:var(--flex-dir2);flex:1 1 50%}.legend-item-container-right-floating-inner{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-right:12px;float:left}.legend-single-axis{max-width:100%;min-width:100%}.legend-empty{width:0%}.tooltip{display:none;max-width:375px;word-break:break-word;margin-top:16px;inset-block-start:0;margin-inline-start:-6px}.tooltip-arrow{left:12px}.legend-item{cursor:pointer;margin-right:12px;display:flex;flex-direction:var(--flex-dir1);align-items:center;height:20px;position:initial;width:calc(100% - 12px);max-width:fit-content}.legend-item:hover .tooltip{display:block}.legend-item-right{margin-right:0;margin-left:12px}.right-legend-circle{margin-right:0;margin-left:8px}.legend-text{box-sizing:inherit;display:inline;cursor:pointer}.hidden-legend .right-legend-circle,.hidden-legend div:first-child,.hidden-legend .legend-text{opacity:.4}.both-scenario-left-unit-container,.both-scenario-right-unit-container{min-width:32px;max-width:32px;overflow:hidden}.both-scenario-right-unit-container{max-height:100%}.both-scenario-left-unit-container{min-height:100%}.both-scenario-legend-container{max-width:calc(100% - 32px);min-width:calc(100% - 32px);padding-left:12px}.right-unit-text{min-width:100%;min-height:100%;padding-left:2px}.left-legends{padding-right:36px}.right-legends{padding-left:28px}.both-legend-container{padding-right:0;padding-left:0}\n"] }]
44
44
  }], propDecorators: { customLegendContainer: [{ type: i0.ViewChild, args: ['customLegendContainer', { isSignal: true }] }], customLegend: [{ type: i0.Input, args: [{ isSignal: true, alias: "customLegend", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subTitle", required: false }] }], titleColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleColor", required: false }] }], subTitleColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "subTitleColor", required: false }] }], textColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "textColor", required: false }] }], legendIconClickEvent: [{ type: i0.Output, args: ["legendIconClickEvent"] }], legendClickEvent: [{ type: i0.Output, args: ["legendClickEvent"] }], legendHoverStartEvent: [{ type: i0.Output, args: ["legendHoverStartEvent"] }], legendHoverEndEvent: [{ type: i0.Output, args: ["legendHoverEndEvent"] }] } });
45
45
 
46
46
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-charts-ng-custom-legend.mjs","sources":["../../../../projects/charts-ng/custom-legend/si-custom-legend.component.ts","../../../../projects/charts-ng/custom-legend/si-custom-legend.component.html","../../../../projects/charts-ng/custom-legend/index.ts","../../../../projects/charts-ng/custom-legend/siemens-charts-ng-custom-legend.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component, ElementRef, input, output, viewChild } from '@angular/core';\n\nimport { CustomLegend, CustomLegendItem } from './si-custom-legend.interface';\n\n@Component({\n selector: 'si-custom-legend',\n templateUrl: './si-custom-legend.component.html',\n styleUrl: './si-custom-legend.component.scss'\n})\nexport class SiCustomLegendComponent {\n /** @internal */\n readonly customLegendContainer = viewChild.required<ElementRef>('customLegendContainer');\n\n readonly customLegend = input<CustomLegend>();\n /** The legend title. */\n readonly title = input<string>();\n /** The legend subtitle. */\n readonly subTitle = input<string>();\n /** The color of the legend title. */\n readonly titleColor = input<string>();\n /** The color of the legend subtitle. */\n readonly subTitleColor = input<string>();\n /** The color of the legend text. */\n readonly textColor = input<string>();\n /** The event emitted when a legend icon is clicked. */\n readonly legendIconClickEvent = output<CustomLegendItem>();\n /** The event emitted when a legend is clicked. */\n readonly legendClickEvent = output<CustomLegendItem>();\n /** The event emitted when the mouse enters a legend. */\n readonly legendHoverStartEvent = output<CustomLegendItem>();\n /** The event emitted when the mouse leaves a legend. */\n readonly legendHoverEndEvent = output<CustomLegendItem>();\n\n protected legendIconClick(legend: CustomLegendItem): void {\n legend.selected = !legend.selected;\n this.legendIconClickEvent.emit(legend);\n }\n\n protected legendClick(legend: CustomLegendItem): void {\n legend.selected = !legend.selected;\n this.legendClickEvent.emit(legend);\n }\n}\n","@if (customLegend() && customLegend()?.customLegends) {\n <div #customLegendContainer class=\"legend-container si-body\">\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 0 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"left-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'left' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"both-scenario-left-unit-container\"\n [class.left-scenario-unit-container]=\"customLegend()?.legendAxis === 'left'\"\n >\n <span class=\"text-secondary\">{{ leg.unit }}</span>\n </div>\n <div\n class=\"legend-item-container both-scenario-legend-container custom-legend-left\"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div class=\"legend-item\" [class.hidden-legend]=\"!legendItem.selected\">\n <div\n class=\"me-4 d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 1 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"right-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'right' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'right'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"legend-item-container custom-legend-right legend-item-container-right-floating-inner\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div\n class=\"legend-item legend-item-right\"\n [class.hidden-legend]=\"!legendItem.selected\"\n >\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n <div\n class=\"right-legend-circle d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n <div\n class=\"both-scenario-right-unit-container\"\n [class.right-scenario-unit-container]=\"customLegend()?.legendAxis === 'right'\"\n >\n <span class=\"right-unit-text text-secondary\">{{ leg.unit }}</span>\n </div>\n </div>\n }\n }\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-custom-legend.component';\nexport * from './si-custom-legend.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"siemens-charts-ng-custom-legend.mjs","sources":["../../../../projects/charts-ng/custom-legend/si-custom-legend.component.ts","../../../../projects/charts-ng/custom-legend/si-custom-legend.component.html","../../../../projects/charts-ng/custom-legend/index.ts","../../../../projects/charts-ng/custom-legend/siemens-charts-ng-custom-legend.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n viewChild\n} from '@angular/core';\n\nimport { CustomLegend, CustomLegendItem } from './si-custom-legend.interface';\n\n@Component({\n selector: 'si-custom-legend',\n templateUrl: './si-custom-legend.component.html',\n styleUrl: './si-custom-legend.component.scss',\n changeDetection: ChangeDetectionStrategy.Default\n})\nexport class SiCustomLegendComponent {\n /** @internal */\n readonly customLegendContainer = viewChild.required<ElementRef>('customLegendContainer');\n\n readonly customLegend = input<CustomLegend>();\n /** The legend title. */\n readonly title = input<string>();\n /** The legend subtitle. */\n readonly subTitle = input<string>();\n /** The color of the legend title. */\n readonly titleColor = input<string>();\n /** The color of the legend subtitle. */\n readonly subTitleColor = input<string>();\n /** The color of the legend text. */\n readonly textColor = input<string>();\n /** The event emitted when a legend icon is clicked. */\n readonly legendIconClickEvent = output<CustomLegendItem>();\n /** The event emitted when a legend is clicked. */\n readonly legendClickEvent = output<CustomLegendItem>();\n /** The event emitted when the mouse enters a legend. */\n readonly legendHoverStartEvent = output<CustomLegendItem>();\n /** The event emitted when the mouse leaves a legend. */\n readonly legendHoverEndEvent = output<CustomLegendItem>();\n\n protected legendIconClick(legend: CustomLegendItem): void {\n legend.selected = !legend.selected;\n this.legendIconClickEvent.emit(legend);\n }\n\n protected legendClick(legend: CustomLegendItem): void {\n legend.selected = !legend.selected;\n this.legendClickEvent.emit(legend);\n }\n}\n","@if (customLegend() && customLegend()?.customLegends) {\n <div #customLegendContainer class=\"legend-container si-body\">\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 0 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"left-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'left' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"both-scenario-left-unit-container\"\n [class.left-scenario-unit-container]=\"customLegend()?.legendAxis === 'left'\"\n >\n <span class=\"text-secondary\">{{ leg.unit }}</span>\n </div>\n <div\n class=\"legend-item-container both-scenario-legend-container custom-legend-left\"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'left'\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div class=\"legend-item\" [class.hidden-legend]=\"!legendItem.selected\">\n <div\n class=\"me-4 d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n (mouseenter)=\"legendHoverStartEvent.emit(legendItem)\"\n (mouseleave)=\"legendHoverEndEvent.emit(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n\n @for (leg of customLegend()?.customLegends; track legendIndex; let legendIndex = $index) {\n @if (legendIndex === 1 && leg && leg.list && leg.list.length > 0) {\n <div\n class=\"right-legends legend-item-container\"\n [class.legend-empty]=\"\n customLegend()?.legendAxis !== 'right' && customLegend()?.legendAxis !== 'both'\n \"\n [class.legend-single-axis]=\"customLegend()?.legendAxis === 'right'\"\n [class.both-legend-container]=\"customLegend()?.legendAxis === 'both'\"\n >\n <div\n class=\"legend-item-container custom-legend-right legend-item-container-right-floating-inner\"\n >\n @for (legendItem of leg.list; track legendItem.name) {\n <div\n class=\"legend-item legend-item-right\"\n [class.hidden-legend]=\"!legendItem.selected\"\n >\n <span\n class=\"legend-text text-truncate\"\n [style.color]=\"textColor()\"\n (click)=\"legendClick(legendItem)\"\n >\n {{ legendItem.displayName }}\n </span>\n <div\n class=\"right-legend-circle d-flex align-items-center justify-content-center\"\n (click)=\"legendIconClick(legendItem)\"\n >\n <svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path [attr.d]=\"legendItem.symbol\" [attr.fill]=\"legendItem.color\" />\n </svg>\n </div>\n @if (legendItem.tooltip) {\n <div class=\"tooltip show bs-tooltip-bottom\" role=\"tooltip\">\n <div class=\"tooltip-arrow\"></div>\n <div class=\"tooltip-inner\">{{ legendItem.tooltip }}</div>\n </div>\n }\n </div>\n }\n </div>\n <div\n class=\"both-scenario-right-unit-container\"\n [class.right-scenario-unit-container]=\"customLegend()?.legendAxis === 'right'\"\n >\n <span class=\"right-unit-text text-secondary\">{{ leg.unit }}</span>\n </div>\n </div>\n }\n }\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-custom-legend.component';\nexport * from './si-custom-legend.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, booleanAttribute, inject, LOCALE_ID, computed, SimpleChange, Component } from '@angular/core';
2
+ import { input, booleanAttribute, inject, LOCALE_ID, computed, SimpleChange, ChangeDetectionStrategy, Component } from '@angular/core';
3
3
  import { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';
4
4
  import { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';
5
5
  import { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';
@@ -335,11 +335,11 @@ class SiChartGaugeComponent extends SiChartBaseComponent {
335
335
  this.refreshSeries();
336
336
  }
337
337
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartGaugeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
338
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", 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" }] });
338
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", 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.Default });
339
339
  }
340
340
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartGaugeComponent, decorators: [{
341
341
  type: Component,
342
- args: [{ selector: 'si-chart-gauge', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], 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"] }]
342
+ args: [{ selector: 'si-chart-gauge', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Default, 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"] }]
343
343
  }], 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 }] }] } });
344
344
 
345
345
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-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/siemens-charts-ng-gauge.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport {\n booleanAttribute,\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 '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/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})\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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"}
1
+ {"version":3,"file":"siemens-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/siemens-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 '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/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.Default\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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"}
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, Component } from '@angular/core';
2
+ import { input, ChangeDetectionStrategy, Component } from '@angular/core';
3
3
  import { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';
4
4
  import { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';
5
5
  import { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';
@@ -148,11 +148,11 @@ class SiChartProgressBarComponent extends SiChartBaseComponent {
148
148
  this.updateEChart();
149
149
  }
150
150
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartProgressBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
151
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartProgressBarComponent, isStandalone: true, selector: "si-chart-progress-bar", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: 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" }] });
151
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartProgressBarComponent, isStandalone: true, selector: "si-chart-progress-bar", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: 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.Default });
152
152
  }
153
153
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartProgressBarComponent, decorators: [{
154
154
  type: Component,
155
- args: [{ selector: 'si-chart-progress-bar', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], 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"] }]
155
+ args: [{ selector: 'si-chart-progress-bar', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Default, 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"] }]
156
156
  }], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }] } });
157
157
 
158
158
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-charts-ng-progress-bar.mjs","sources":["../../../../projects/charts-ng/progress-bar/si-chart-progress-bar.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/progress-bar/index.ts","../../../../projects/charts-ng/progress-bar/siemens-charts-ng-progress-bar.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component, input } from '@angular/core';\nimport {\n SiChartBaseComponent,\n echarts,\n BarSeriesOption,\n ChartXAxis,\n ChartYAxis\n} from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { BarChart } from 'echarts/charts';\nimport { GridComponent } from 'echarts/components';\nimport { LegacyGridContainLabel } from 'echarts/features';\n\nimport { ProgressBarChartSeries, ProgressBarValueUpdate } from './si-chart-progress-bar.interface';\n\necharts.use([BarChart, GridComponent, LegacyGridContainLabel]);\n\n@Component({\n selector: 'si-chart-progress-bar',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss'\n})\nexport class SiChartProgressBarComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<ProgressBarChartSeries[]>();\n /** Used to display the label in inline or above the progress-bar. */\n readonly labelPosition = input<string>();\n\n private maxValue = 100;\n private xAxisConfig: ChartXAxis = { type: 'value', max: this.maxValue };\n private yAxis: ChartYAxis = {\n type: 'category',\n data: [],\n axisLabel: {\n show: true,\n fontSize: 14\n }\n };\n\n private readonly formatter = new Intl.NumberFormat(undefined, { maximumFractionDigits: 1 });\n private labelPositionOption: BarSeriesOption['label'];\n private labelPositionOptionForValue: BarSeriesOption['label'];\n\n private labelFormatter(p: any): string {\n return this.formatter.format(this.maxValue - p.value) + ' %';\n }\n\n protected override themeChanged(): void {\n this.applyOptions();\n }\n\n protected override applyOptions(): void {\n this.showLegend.set(false);\n const grey = this.getThemeCustomValue(['progress', 'grey'], '#E6E6E6');\n const labelColor = this.getThemeCustomValue(['progressBar', 'labelColor'], '#000');\n const itemWidth = this.getThemeCustomValue(['progressBar', 'itemWidth'], 20);\n\n if (this.labelPosition() === 'top') {\n this.yAxis.axisLabel = false;\n this.labelPositionOption = {\n position: [0, -16],\n formatter: '{b}',\n fontSize: 14,\n color: labelColor,\n show: true\n };\n this.labelPositionOptionForValue = {\n position: ['100%', '-80%'],\n align: 'right',\n show: true,\n formatter: p => this.labelFormatter(p),\n color: labelColor,\n fontWeight: 700\n };\n } else {\n this.yAxis.axisLabel.show = true;\n this.labelPositionOption = {\n show: false\n };\n this.labelPositionOptionForValue = {\n position: 'right',\n show: true,\n formatter: p => this.labelFormatter(p),\n color: labelColor,\n fontWeight: 700\n };\n }\n\n this.actualOptions = {\n series: [],\n xAxis: this.xAxisConfig,\n yAxis: this.yAxis,\n grid: {},\n tooltip: {}\n };\n const categoryAxisOpts = {\n axisLine: { show: false },\n axisTick: { show: false },\n splitLine: { show: false },\n axisLabel: { show: this.yAxis.axisLabel },\n inverse: true\n };\n\n const valueAxisOpts = {\n axisLabel: { show: false },\n axisLine: { show: false },\n axisTick: { show: false },\n splitLine: { show: false }\n };\n\n echarts.util.merge(this.actualOptions.yAxis, categoryAxisOpts, true);\n echarts.util.merge(this.actualOptions.xAxis, valueAxisOpts, true);\n\n this.actualOptions.grid = this.getThemeCustomValue(['progressBar', 'grid'], {});\n\n const series = this.series();\n if (series) {\n const optionSeries = this.actualOptions.series as BarSeriesOption[];\n (this.actualOptions.yAxis as any).data = series.map(item => item.name);\n\n const dataItem: BarSeriesOption = {\n type: 'bar',\n stack: 'chart',\n z: 3,\n barWidth: itemWidth,\n label: this.labelPositionOption,\n data: series.map(item => item.percent)\n };\n\n const fillerItem: BarSeriesOption = {\n type: 'bar',\n stack: 'chart',\n silent: true,\n label: this.labelPositionOptionForValue,\n itemStyle: {\n color: grey\n },\n data: series.map(item => this.maxValue - item.percent)\n };\n\n optionSeries.push(dataItem);\n optionSeries.push(fillerItem);\n }\n\n this.applyTitles();\n }\n\n protected override applyDataZoom(): void {}\n\n /**\n * Updates single value of a single progress bar.\n */\n changeSingleValue(valueIndex: number, value: number): void {\n const optionSeries = this.actualOptions.series as BarSeriesOption[];\n optionSeries[0].data![valueIndex] = value;\n optionSeries[1].data![valueIndex] = this.maxValue - value;\n this.updateEChart();\n }\n\n /**\n * Updates multiple values of a single progress bar.\n */\n changeMultiValues(updateValues: ProgressBarValueUpdate[]): void {\n const optionSeries = this.actualOptions.series as BarSeriesOption[];\n updateValues.forEach(update => {\n const currentDataItem = optionSeries[0].data![update.valueIndex];\n if (!currentDataItem) {\n return;\n }\n optionSeries[0].data![update.valueIndex] = update.value;\n optionSeries[1].data![update.valueIndex] = this.maxValue - update.value;\n });\n\n this.updateEChart();\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-progress-bar.component';\nexport * from './si-chart-progress-bar.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"siemens-charts-ng-progress-bar.mjs","sources":["../../../../projects/charts-ng/progress-bar/si-chart-progress-bar.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/progress-bar/index.ts","../../../../projects/charts-ng/progress-bar/siemens-charts-ng-progress-bar.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport {\n SiChartBaseComponent,\n echarts,\n BarSeriesOption,\n ChartXAxis,\n ChartYAxis\n} from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { BarChart } from 'echarts/charts';\nimport { GridComponent } from 'echarts/components';\nimport { LegacyGridContainLabel } from 'echarts/features';\n\nimport { ProgressBarChartSeries, ProgressBarValueUpdate } from './si-chart-progress-bar.interface';\n\necharts.use([BarChart, GridComponent, LegacyGridContainLabel]);\n\n@Component({\n selector: 'si-chart-progress-bar',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss',\n changeDetection: ChangeDetectionStrategy.Default\n})\nexport class SiChartProgressBarComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<ProgressBarChartSeries[]>();\n /** Used to display the label in inline or above the progress-bar. */\n readonly labelPosition = input<string>();\n\n private maxValue = 100;\n private xAxisConfig: ChartXAxis = { type: 'value', max: this.maxValue };\n private yAxis: ChartYAxis = {\n type: 'category',\n data: [],\n axisLabel: {\n show: true,\n fontSize: 14\n }\n };\n\n private readonly formatter = new Intl.NumberFormat(undefined, { maximumFractionDigits: 1 });\n private labelPositionOption: BarSeriesOption['label'];\n private labelPositionOptionForValue: BarSeriesOption['label'];\n\n private labelFormatter(p: any): string {\n return this.formatter.format(this.maxValue - p.value) + ' %';\n }\n\n protected override themeChanged(): void {\n this.applyOptions();\n }\n\n protected override applyOptions(): void {\n this.showLegend.set(false);\n const grey = this.getThemeCustomValue(['progress', 'grey'], '#E6E6E6');\n const labelColor = this.getThemeCustomValue(['progressBar', 'labelColor'], '#000');\n const itemWidth = this.getThemeCustomValue(['progressBar', 'itemWidth'], 20);\n\n if (this.labelPosition() === 'top') {\n this.yAxis.axisLabel = false;\n this.labelPositionOption = {\n position: [0, -16],\n formatter: '{b}',\n fontSize: 14,\n color: labelColor,\n show: true\n };\n this.labelPositionOptionForValue = {\n position: ['100%', '-80%'],\n align: 'right',\n show: true,\n formatter: p => this.labelFormatter(p),\n color: labelColor,\n fontWeight: 700\n };\n } else {\n this.yAxis.axisLabel.show = true;\n this.labelPositionOption = {\n show: false\n };\n this.labelPositionOptionForValue = {\n position: 'right',\n show: true,\n formatter: p => this.labelFormatter(p),\n color: labelColor,\n fontWeight: 700\n };\n }\n\n this.actualOptions = {\n series: [],\n xAxis: this.xAxisConfig,\n yAxis: this.yAxis,\n grid: {},\n tooltip: {}\n };\n const categoryAxisOpts = {\n axisLine: { show: false },\n axisTick: { show: false },\n splitLine: { show: false },\n axisLabel: { show: this.yAxis.axisLabel },\n inverse: true\n };\n\n const valueAxisOpts = {\n axisLabel: { show: false },\n axisLine: { show: false },\n axisTick: { show: false },\n splitLine: { show: false }\n };\n\n echarts.util.merge(this.actualOptions.yAxis, categoryAxisOpts, true);\n echarts.util.merge(this.actualOptions.xAxis, valueAxisOpts, true);\n\n this.actualOptions.grid = this.getThemeCustomValue(['progressBar', 'grid'], {});\n\n const series = this.series();\n if (series) {\n const optionSeries = this.actualOptions.series as BarSeriesOption[];\n (this.actualOptions.yAxis as any).data = series.map(item => item.name);\n\n const dataItem: BarSeriesOption = {\n type: 'bar',\n stack: 'chart',\n z: 3,\n barWidth: itemWidth,\n label: this.labelPositionOption,\n data: series.map(item => item.percent)\n };\n\n const fillerItem: BarSeriesOption = {\n type: 'bar',\n stack: 'chart',\n silent: true,\n label: this.labelPositionOptionForValue,\n itemStyle: {\n color: grey\n },\n data: series.map(item => this.maxValue - item.percent)\n };\n\n optionSeries.push(dataItem);\n optionSeries.push(fillerItem);\n }\n\n this.applyTitles();\n }\n\n protected override applyDataZoom(): void {}\n\n /**\n * Updates single value of a single progress bar.\n */\n changeSingleValue(valueIndex: number, value: number): void {\n const optionSeries = this.actualOptions.series as BarSeriesOption[];\n optionSeries[0].data![valueIndex] = value;\n optionSeries[1].data![valueIndex] = this.maxValue - value;\n this.updateEChart();\n }\n\n /**\n * Updates multiple values of a single progress bar.\n */\n changeMultiValues(updateValues: ProgressBarValueUpdate[]): void {\n const optionSeries = this.actualOptions.series as BarSeriesOption[];\n updateValues.forEach(update => {\n const currentDataItem = optionSeries[0].data![update.valueIndex];\n if (!currentDataItem) {\n return;\n }\n optionSeries[0].data![update.valueIndex] = update.value;\n optionSeries[1].data![update.valueIndex] = this.maxValue - update.value;\n });\n\n this.updateEChart();\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-progress-bar.component';\nexport * from './si-chart-progress-bar.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { input, Component } from '@angular/core';
2
+ import { input, ChangeDetectionStrategy, Component } from '@angular/core';
3
3
  import { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';
4
4
  import { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';
5
5
  import { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';
@@ -198,11 +198,11 @@ class SiChartProgressComponent extends SiChartBaseComponent {
198
198
  this.updateEChart();
199
199
  }
200
200
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartProgressComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
201
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartProgressComponent, isStandalone: true, selector: "si-chart-progress", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, dataAngle: { classPropertyName: "dataAngle", publicName: "dataAngle", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: 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" }] });
201
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartProgressComponent, isStandalone: true, selector: "si-chart-progress", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, dataAngle: { classPropertyName: "dataAngle", publicName: "dataAngle", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: 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.Default });
202
202
  }
203
203
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartProgressComponent, decorators: [{
204
204
  type: Component,
205
- args: [{ selector: 'si-chart-progress', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], 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"] }]
205
+ args: [{ selector: 'si-chart-progress', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Default, 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"] }]
206
206
  }], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }], dataAngle: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataAngle", required: false }] }] } });
207
207
 
208
208
  /**