@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 +1 @@
1
- {"version":3,"file":"siemens-charts-ng-progress.mjs","sources":["../../../../projects/charts-ng/progress/si-chart-progress.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/progress/index.ts","../../../../projects/charts-ng/progress/siemens-charts-ng-progress.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component, input } from '@angular/core';\nimport { SiChartBaseComponent, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { PieSeriesOption } from 'echarts';\nimport { PieChart } from 'echarts/charts';\nimport { LegendComponent } from 'echarts/components';\n\nimport { ProgressChartSeries, ProgressValueUpdate } from './si-chart-progress.interface';\n\necharts.use([PieChart, LegendComponent]);\n\n@Component({\n selector: 'si-chart-progress',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss'\n})\nexport class SiChartProgressComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<ProgressChartSeries[]>();\n\n /**\n * How big the data can get in degrees.\n *\n * @defaultValue 220\n */\n readonly dataAngle = input(220);\n\n // item width in % radius\n private itemWidth!: number;\n\n // item gap in % radius\n private itemGap!: number;\n\n // base radius of an item\n private baseRadius = 98;\n\n private sizeFactor!: number;\n\n // placement chart in % on canvas\n private center!: number;\n\n // color of disabled part of item\n private grey!: string;\n\n // where the data starts. not very intuitive:\n // 0° is at 3 o'clock, goes counterclockwise, but series drawing goes clockwise\n private startAngle!: number;\n\n protected override afterChartInit(): void {\n this.chart.on('legendselectchanged', (params: any) => {\n this.updateRadius(params.selected);\n this.updateEChart();\n });\n }\n\n protected override themeChanged(): void {\n this.applyOptions();\n }\n\n protected override handleSelectionChanged(event: any): void {\n super.handleSelectionChanged(event);\n this.updateRadius(event.selected);\n this.updateEChart();\n }\n\n protected override applyOptions(): void {\n this.actualOptions = {\n series: [],\n legend: [\n {\n data: []\n }\n ]\n };\n\n const dataAngle = this.dataAngle();\n this.startAngle = dataAngle === 360 ? 90 : 270 - (360 - dataAngle) / 2;\n this.itemWidth = this.getThemeCustomValue(['progress', 'itemWidth'], 6);\n this.itemGap = this.getThemeCustomValue(['progress', 'itemGap'], 6);\n this.grey = this.getThemeCustomValue(['progress', 'grey'], '#E6E6E6');\n\n // a factor to change the size of base radius and center related to\n // dataAngle proportionately\n this.sizeFactor = 1 - Math.sin((((this.dataAngle() - 180) / 2) * Math.PI) / 180);\n this.center = 50 + 25 * this.sizeFactor;\n\n const seriesValue = this.series();\n if (seriesValue) {\n seriesValue.forEach(series => {\n this.addSeries(series.name, series.percent);\n if (this.showLegend()) {\n this.addLegendItem(series.name);\n }\n });\n }\n\n this.applyTitles();\n }\n\n private labelFormatter(p: any): string {\n return p.seriesName + '\\n' + Math.round((100 / this.dataAngle()) * p.value) + ' %';\n }\n\n private addSeries(name: string, percent: number): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n const index = optionSeries.length;\n\n const offset =\n !this.showCustomLegend() && this.subTitle()\n ? this.getThemeCustomValue(['subTitle', 'legend', 'top'], 0)\n : 0;\n const top = !this.sizeFactor ? 32 + offset : Math.floor(offset / 2);\n const bottom = !this.sizeFactor ? undefined : -offset;\n\n const item: PieSeriesOption = {\n top,\n bottom,\n center: ['50%', this.center + '%'],\n name,\n type: 'pie',\n colorBy: 'series',\n radius: this.calculateRadius(index),\n avoidLabelOverlap: false,\n tooltip: { show: false },\n startAngle: this.startAngle,\n label: {\n show: false,\n formatter: p => this.labelFormatter(p),\n position: 'center'\n },\n labelLine: {\n show: false\n },\n emphasis: {\n label: {\n show: true,\n lineHeight: 30,\n fontSize: '30',\n fontWeight: 'bold'\n }\n },\n itemStyle: {\n borderWidth: 0\n },\n data: [\n {\n value: 0,\n name: 'v' + index,\n label: {\n lineHeight: 30,\n fontSize: 30,\n color: 'inherit'\n }\n },\n {\n value: 0,\n name: 'a' + index,\n itemStyle: { color: this.grey },\n emphasis: {\n scale: false,\n itemStyle: { color: this.grey }\n },\n cursor: 'default',\n label: { show: false }\n },\n {\n value: 0,\n name: 'b' + index,\n itemStyle: { color: 'rgba(0,0,0,0)' },\n cursor: 'default',\n label: { show: false }\n }\n ]\n };\n\n this.updateData(item, percent);\n optionSeries.push(item);\n }\n\n private updateData(series: any, percent: number): void {\n const angle = (this.dataAngle() * percent) / 100;\n series.data[0].value = angle;\n series.data[1].value = this.dataAngle() - angle;\n series.data[2].value = 360 - this.dataAngle();\n series.realValue = percent;\n }\n\n private calculateRadius(index: number): string[] {\n const outerRadius = this.baseRadius - index * (this.itemWidth + this.itemGap);\n const innerRadius = outerRadius - this.itemWidth;\n return [innerRadius + '%', outerRadius + '%'];\n }\n\n private updateRadius(selected: any): void {\n let visibleIndex = 0;\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n optionSeries.forEach(series => {\n if (selected[series.name!] === false) {\n return;\n }\n series.radius = this.calculateRadius(visibleIndex);\n visibleIndex++;\n });\n }\n\n protected override applyDataZoom(): void {}\n\n /**\n * Update single value of the progress chart.\n */\n changeSingleValue(index: number, percent: number): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n this.updateData(optionSeries[index], percent);\n this.updateEChart();\n }\n\n /**\n * Update multiple values of the progress chart.\n */\n changeMultiValues(updateValues: ProgressValueUpdate[]): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n updateValues.forEach(update => {\n const currentSeries = optionSeries[update.seriesIndex];\n if (!currentSeries) {\n return;\n }\n this.updateData(currentSeries, update.percent);\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.component';\nexport * from './si-chart-progress.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AAAA;;;AAGG;AAWH,OAAO,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC;AAQlC,MAAO,wBAAyB,SAAQ,oBAAoB,CAAA;;IAEvD,MAAM,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAyB;AAEhD;;;;AAIG;AACM,IAAA,SAAS,GAAG,KAAK,CAAC,GAAG,qDAAC;;AAGvB,IAAA,SAAS;;AAGT,IAAA,OAAO;;IAGP,UAAU,GAAG,EAAE;AAEf,IAAA,UAAU;;AAGV,IAAA,MAAM;;AAGN,IAAA,IAAI;;;AAIJ,IAAA,UAAU;IAEC,cAAc,GAAA;QAC/B,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC,MAAW,KAAI;AACnD,YAAA,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,CAAC;YAClC,IAAI,CAAC,YAAY,EAAE;AACrB,QAAA,CAAC,CAAC;IACJ;IAEmB,YAAY,GAAA;QAC7B,IAAI,CAAC,YAAY,EAAE;IACrB;AAEmB,IAAA,sBAAsB,CAAC,KAAU,EAAA;AAClD,QAAA,KAAK,CAAC,sBAAsB,CAAC,KAAK,CAAC;AACnC,QAAA,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,CAAC;QACjC,IAAI,CAAC,YAAY,EAAE;IACrB;IAEmB,YAAY,GAAA;QAC7B,IAAI,CAAC,aAAa,GAAG;AACnB,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,MAAM,EAAE;AACN,gBAAA;AACE,oBAAA,IAAI,EAAE;AACP;AACF;SACF;AAED,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,EAAE;QAClC,IAAI,CAAC,UAAU,GAAG,SAAS,KAAK,GAAG,GAAG,EAAE,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,SAAS,IAAI,CAAC;AACtE,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,WAAW,CAAC,EAAE,CAAC,CAAC;AACvE,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,SAAS,CAAC,EAAE,CAAC,CAAC;AACnE,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,MAAM,CAAC,EAAE,SAAS,CAAC;;;AAIrE,QAAA,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,EAAE,IAAI,GAAG,CAAC;QAChF,IAAI,CAAC,MAAM,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,UAAU;AAEvC,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,EAAE;QACjC,IAAI,WAAW,EAAE;AACf,YAAA,WAAW,CAAC,OAAO,CAAC,MAAM,IAAG;gBAC3B,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,OAAO,CAAC;AAC3C,gBAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;AACrB,oBAAA,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC;gBACjC;AACF,YAAA,CAAC,CAAC;QACJ;QAEA,IAAI,CAAC,WAAW,EAAE;IACpB;AAEQ,IAAA,cAAc,CAAC,CAAM,EAAA;QAC3B,OAAO,CAAC,CAAC,UAAU,GAAG,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,IAAI;IACpF;IAEQ,SAAS,CAAC,IAAY,EAAE,OAAe,EAAA;AAC7C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;AACnE,QAAA,MAAM,KAAK,GAAG,YAAY,CAAC,MAAM;QAEjC,MAAM,MAAM,GACV,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,IAAI,CAAC,QAAQ;AACvC,cAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC;cACzD,CAAC;QACP,MAAM,GAAG,GAAG,CAAC,IAAI,CAAC,UAAU,GAAG,EAAE,GAAG,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;AACnE,QAAA,MAAM,MAAM,GAAG,CAAC,IAAI,CAAC,UAAU,GAAG,SAAS,GAAG,CAAC,MAAM;AAErD,QAAA,MAAM,IAAI,GAAoB;YAC5B,GAAG;YACH,MAAM;YACN,MAAM,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC;YAClC,IAAI;AACJ,YAAA,IAAI,EAAE,KAAK;AACX,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,MAAM,EAAE,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;AACnC,YAAA,iBAAiB,EAAE,KAAK;AACxB,YAAA,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACxB,UAAU,EAAE,IAAI,CAAC,UAAU;AAC3B,YAAA,KAAK,EAAE;AACL,gBAAA,IAAI,EAAE,KAAK;gBACX,SAAS,EAAE,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;AACtC,gBAAA,QAAQ,EAAE;AACX,aAAA;AACD,YAAA,SAAS,EAAE;AACT,gBAAA,IAAI,EAAE;AACP,aAAA;AACD,YAAA,QAAQ,EAAE;AACR,gBAAA,KAAK,EAAE;AACL,oBAAA,IAAI,EAAE,IAAI;AACV,oBAAA,UAAU,EAAE,EAAE;AACd,oBAAA,QAAQ,EAAE,IAAI;AACd,oBAAA,UAAU,EAAE;AACb;AACF,aAAA;AACD,YAAA,SAAS,EAAE;AACT,gBAAA,WAAW,EAAE;AACd,aAAA;AACD,YAAA,IAAI,EAAE;AACJ,gBAAA;AACE,oBAAA,KAAK,EAAE,CAAC;oBACR,IAAI,EAAE,GAAG,GAAG,KAAK;AACjB,oBAAA,KAAK,EAAE;AACL,wBAAA,UAAU,EAAE,EAAE;AACd,wBAAA,QAAQ,EAAE,EAAE;AACZ,wBAAA,KAAK,EAAE;AACR;AACF,iBAAA;AACD,gBAAA;AACE,oBAAA,KAAK,EAAE,CAAC;oBACR,IAAI,EAAE,GAAG,GAAG,KAAK;AACjB,oBAAA,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE;AAC/B,oBAAA,QAAQ,EAAE;AACR,wBAAA,KAAK,EAAE,KAAK;AACZ,wBAAA,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI;AAC9B,qBAAA;AACD,oBAAA,MAAM,EAAE,SAAS;AACjB,oBAAA,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK;AACrB,iBAAA;AACD,gBAAA;AACE,oBAAA,KAAK,EAAE,CAAC;oBACR,IAAI,EAAE,GAAG,GAAG,KAAK;AACjB,oBAAA,SAAS,EAAE,EAAE,KAAK,EAAE,eAAe,EAAE;AACrC,oBAAA,MAAM,EAAE,SAAS;AACjB,oBAAA,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK;AACrB;AACF;SACF;AAED,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,OAAO,CAAC;AAC9B,QAAA,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB;IAEQ,UAAU,CAAC,MAAW,EAAE,OAAe,EAAA;AAC7C,QAAA,MAAM,KAAK,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,OAAO,IAAI,GAAG;QAChD,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,KAAK;AAC5B,QAAA,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,GAAG,KAAK;AAC/C,QAAA,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,GAAG,GAAG,IAAI,CAAC,SAAS,EAAE;AAC7C,QAAA,MAAM,CAAC,SAAS,GAAG,OAAO;IAC5B;AAEQ,IAAA,eAAe,CAAC,KAAa,EAAA;AACnC,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,GAAG,KAAK,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;AAC7E,QAAA,MAAM,WAAW,GAAG,WAAW,GAAG,IAAI,CAAC,SAAS;QAChD,OAAO,CAAC,WAAW,GAAG,GAAG,EAAE,WAAW,GAAG,GAAG,CAAC;IAC/C;AAEQ,IAAA,YAAY,CAAC,QAAa,EAAA;QAChC,IAAI,YAAY,GAAG,CAAC;AACpB,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;AACnE,QAAA,YAAY,CAAC,OAAO,CAAC,MAAM,IAAG;YAC5B,IAAI,QAAQ,CAAC,MAAM,CAAC,IAAK,CAAC,KAAK,KAAK,EAAE;gBACpC;YACF;YACA,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC;AAClD,YAAA,YAAY,EAAE;AAChB,QAAA,CAAC,CAAC;IACJ;AAEmB,IAAA,aAAa,KAAU;AAE1C;;AAEG;IACH,iBAAiB,CAAC,KAAa,EAAE,OAAe,EAAA;AAC9C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;QACnE,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;QAC7C,IAAI,CAAC,YAAY,EAAE;IACrB;AAEA;;AAEG;AACH,IAAA,iBAAiB,CAAC,YAAmC,EAAA;AACnD,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;AACnE,QAAA,YAAY,CAAC,OAAO,CAAC,MAAM,IAAG;YAC5B,MAAM,aAAa,GAAG,YAAY,CAAC,MAAM,CAAC,WAAW,CAAC;YACtD,IAAI,CAAC,aAAa,EAAE;gBAClB;YACF;YACA,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC;AAChD,QAAA,CAAC,CAAC;QAEF,IAAI,CAAC,YAAY,EAAE;IACrB;uGAtNW,wBAAwB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECtBrC,omEAgEA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED9CY,uBAAuB,+PAAE,8BAA8B,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,CAAA;;2FAItD,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBANpC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,EAAA,OAAA,EACpB,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,EAAA,QAAA,EAAA,omEAAA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA;;;AElBpE;;;AAGG;;ACHH;;AAEG;;;;"}
1
+ {"version":3,"file":"siemens-charts-ng-progress.mjs","sources":["../../../../projects/charts-ng/progress/si-chart-progress.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/progress/index.ts","../../../../projects/charts-ng/progress/siemens-charts-ng-progress.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { SiChartBaseComponent, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { PieSeriesOption } from 'echarts';\nimport { PieChart } from 'echarts/charts';\nimport { LegendComponent } from 'echarts/components';\n\nimport { ProgressChartSeries, ProgressValueUpdate } from './si-chart-progress.interface';\n\necharts.use([PieChart, LegendComponent]);\n\n@Component({\n selector: 'si-chart-progress',\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 SiChartProgressComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<ProgressChartSeries[]>();\n\n /**\n * How big the data can get in degrees.\n *\n * @defaultValue 220\n */\n readonly dataAngle = input(220);\n\n // item width in % radius\n private itemWidth!: number;\n\n // item gap in % radius\n private itemGap!: number;\n\n // base radius of an item\n private baseRadius = 98;\n\n private sizeFactor!: number;\n\n // placement chart in % on canvas\n private center!: number;\n\n // color of disabled part of item\n private grey!: string;\n\n // where the data starts. not very intuitive:\n // 0° is at 3 o'clock, goes counterclockwise, but series drawing goes clockwise\n private startAngle!: number;\n\n protected override afterChartInit(): void {\n this.chart.on('legendselectchanged', (params: any) => {\n this.updateRadius(params.selected);\n this.updateEChart();\n });\n }\n\n protected override themeChanged(): void {\n this.applyOptions();\n }\n\n protected override handleSelectionChanged(event: any): void {\n super.handleSelectionChanged(event);\n this.updateRadius(event.selected);\n this.updateEChart();\n }\n\n protected override applyOptions(): void {\n this.actualOptions = {\n series: [],\n legend: [\n {\n data: []\n }\n ]\n };\n\n const dataAngle = this.dataAngle();\n this.startAngle = dataAngle === 360 ? 90 : 270 - (360 - dataAngle) / 2;\n this.itemWidth = this.getThemeCustomValue(['progress', 'itemWidth'], 6);\n this.itemGap = this.getThemeCustomValue(['progress', 'itemGap'], 6);\n this.grey = this.getThemeCustomValue(['progress', 'grey'], '#E6E6E6');\n\n // a factor to change the size of base radius and center related to\n // dataAngle proportionately\n this.sizeFactor = 1 - Math.sin((((this.dataAngle() - 180) / 2) * Math.PI) / 180);\n this.center = 50 + 25 * this.sizeFactor;\n\n const seriesValue = this.series();\n if (seriesValue) {\n seriesValue.forEach(series => {\n this.addSeries(series.name, series.percent);\n if (this.showLegend()) {\n this.addLegendItem(series.name);\n }\n });\n }\n\n this.applyTitles();\n }\n\n private labelFormatter(p: any): string {\n return p.seriesName + '\\n' + Math.round((100 / this.dataAngle()) * p.value) + ' %';\n }\n\n private addSeries(name: string, percent: number): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n const index = optionSeries.length;\n\n const offset =\n !this.showCustomLegend() && this.subTitle()\n ? this.getThemeCustomValue(['subTitle', 'legend', 'top'], 0)\n : 0;\n const top = !this.sizeFactor ? 32 + offset : Math.floor(offset / 2);\n const bottom = !this.sizeFactor ? undefined : -offset;\n\n const item: PieSeriesOption = {\n top,\n bottom,\n center: ['50%', this.center + '%'],\n name,\n type: 'pie',\n colorBy: 'series',\n radius: this.calculateRadius(index),\n avoidLabelOverlap: false,\n tooltip: { show: false },\n startAngle: this.startAngle,\n label: {\n show: false,\n formatter: p => this.labelFormatter(p),\n position: 'center'\n },\n labelLine: {\n show: false\n },\n emphasis: {\n label: {\n show: true,\n lineHeight: 30,\n fontSize: '30',\n fontWeight: 'bold'\n }\n },\n itemStyle: {\n borderWidth: 0\n },\n data: [\n {\n value: 0,\n name: 'v' + index,\n label: {\n lineHeight: 30,\n fontSize: 30,\n color: 'inherit'\n }\n },\n {\n value: 0,\n name: 'a' + index,\n itemStyle: { color: this.grey },\n emphasis: {\n scale: false,\n itemStyle: { color: this.grey }\n },\n cursor: 'default',\n label: { show: false }\n },\n {\n value: 0,\n name: 'b' + index,\n itemStyle: { color: 'rgba(0,0,0,0)' },\n cursor: 'default',\n label: { show: false }\n }\n ]\n };\n\n this.updateData(item, percent);\n optionSeries.push(item);\n }\n\n private updateData(series: any, percent: number): void {\n const angle = (this.dataAngle() * percent) / 100;\n series.data[0].value = angle;\n series.data[1].value = this.dataAngle() - angle;\n series.data[2].value = 360 - this.dataAngle();\n series.realValue = percent;\n }\n\n private calculateRadius(index: number): string[] {\n const outerRadius = this.baseRadius - index * (this.itemWidth + this.itemGap);\n const innerRadius = outerRadius - this.itemWidth;\n return [innerRadius + '%', outerRadius + '%'];\n }\n\n private updateRadius(selected: any): void {\n let visibleIndex = 0;\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n optionSeries.forEach(series => {\n if (selected[series.name!] === false) {\n return;\n }\n series.radius = this.calculateRadius(visibleIndex);\n visibleIndex++;\n });\n }\n\n protected override applyDataZoom(): void {}\n\n /**\n * Update single value of the progress chart.\n */\n changeSingleValue(index: number, percent: number): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n this.updateData(optionSeries[index], percent);\n this.updateEChart();\n }\n\n /**\n * Update multiple values of the progress chart.\n */\n changeMultiValues(updateValues: ProgressValueUpdate[]): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n updateValues.forEach(update => {\n const currentSeries = optionSeries[update.seriesIndex];\n if (!currentSeries) {\n return;\n }\n this.updateData(currentSeries, update.percent);\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.component';\nexport * from './si-chart-progress.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AAAA;;;AAGG;AAWH,OAAO,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC;AASlC,MAAO,wBAAyB,SAAQ,oBAAoB,CAAA;;IAEvD,MAAM,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAyB;AAEhD;;;;AAIG;AACM,IAAA,SAAS,GAAG,KAAK,CAAC,GAAG,qDAAC;;AAGvB,IAAA,SAAS;;AAGT,IAAA,OAAO;;IAGP,UAAU,GAAG,EAAE;AAEf,IAAA,UAAU;;AAGV,IAAA,MAAM;;AAGN,IAAA,IAAI;;;AAIJ,IAAA,UAAU;IAEC,cAAc,GAAA;QAC/B,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC,MAAW,KAAI;AACnD,YAAA,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,CAAC;YAClC,IAAI,CAAC,YAAY,EAAE;AACrB,QAAA,CAAC,CAAC;IACJ;IAEmB,YAAY,GAAA;QAC7B,IAAI,CAAC,YAAY,EAAE;IACrB;AAEmB,IAAA,sBAAsB,CAAC,KAAU,EAAA;AAClD,QAAA,KAAK,CAAC,sBAAsB,CAAC,KAAK,CAAC;AACnC,QAAA,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,CAAC;QACjC,IAAI,CAAC,YAAY,EAAE;IACrB;IAEmB,YAAY,GAAA;QAC7B,IAAI,CAAC,aAAa,GAAG;AACnB,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,MAAM,EAAE;AACN,gBAAA;AACE,oBAAA,IAAI,EAAE;AACP;AACF;SACF;AAED,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,EAAE;QAClC,IAAI,CAAC,UAAU,GAAG,SAAS,KAAK,GAAG,GAAG,EAAE,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,SAAS,IAAI,CAAC;AACtE,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,WAAW,CAAC,EAAE,CAAC,CAAC;AACvE,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,SAAS,CAAC,EAAE,CAAC,CAAC;AACnE,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,MAAM,CAAC,EAAE,SAAS,CAAC;;;AAIrE,QAAA,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,EAAE,IAAI,GAAG,CAAC;QAChF,IAAI,CAAC,MAAM,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,UAAU;AAEvC,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,EAAE;QACjC,IAAI,WAAW,EAAE;AACf,YAAA,WAAW,CAAC,OAAO,CAAC,MAAM,IAAG;gBAC3B,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,OAAO,CAAC;AAC3C,gBAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;AACrB,oBAAA,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC;gBACjC;AACF,YAAA,CAAC,CAAC;QACJ;QAEA,IAAI,CAAC,WAAW,EAAE;IACpB;AAEQ,IAAA,cAAc,CAAC,CAAM,EAAA;QAC3B,OAAO,CAAC,CAAC,UAAU,GAAG,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,IAAI;IACpF;IAEQ,SAAS,CAAC,IAAY,EAAE,OAAe,EAAA;AAC7C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;AACnE,QAAA,MAAM,KAAK,GAAG,YAAY,CAAC,MAAM;QAEjC,MAAM,MAAM,GACV,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,IAAI,CAAC,QAAQ;AACvC,cAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC,UAAU,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC;cACzD,CAAC;QACP,MAAM,GAAG,GAAG,CAAC,IAAI,CAAC,UAAU,GAAG,EAAE,GAAG,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;AACnE,QAAA,MAAM,MAAM,GAAG,CAAC,IAAI,CAAC,UAAU,GAAG,SAAS,GAAG,CAAC,MAAM;AAErD,QAAA,MAAM,IAAI,GAAoB;YAC5B,GAAG;YACH,MAAM;YACN,MAAM,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC;YAClC,IAAI;AACJ,YAAA,IAAI,EAAE,KAAK;AACX,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,MAAM,EAAE,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;AACnC,YAAA,iBAAiB,EAAE,KAAK;AACxB,YAAA,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACxB,UAAU,EAAE,IAAI,CAAC,UAAU;AAC3B,YAAA,KAAK,EAAE;AACL,gBAAA,IAAI,EAAE,KAAK;gBACX,SAAS,EAAE,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;AACtC,gBAAA,QAAQ,EAAE;AACX,aAAA;AACD,YAAA,SAAS,EAAE;AACT,gBAAA,IAAI,EAAE;AACP,aAAA;AACD,YAAA,QAAQ,EAAE;AACR,gBAAA,KAAK,EAAE;AACL,oBAAA,IAAI,EAAE,IAAI;AACV,oBAAA,UAAU,EAAE,EAAE;AACd,oBAAA,QAAQ,EAAE,IAAI;AACd,oBAAA,UAAU,EAAE;AACb;AACF,aAAA;AACD,YAAA,SAAS,EAAE;AACT,gBAAA,WAAW,EAAE;AACd,aAAA;AACD,YAAA,IAAI,EAAE;AACJ,gBAAA;AACE,oBAAA,KAAK,EAAE,CAAC;oBACR,IAAI,EAAE,GAAG,GAAG,KAAK;AACjB,oBAAA,KAAK,EAAE;AACL,wBAAA,UAAU,EAAE,EAAE;AACd,wBAAA,QAAQ,EAAE,EAAE;AACZ,wBAAA,KAAK,EAAE;AACR;AACF,iBAAA;AACD,gBAAA;AACE,oBAAA,KAAK,EAAE,CAAC;oBACR,IAAI,EAAE,GAAG,GAAG,KAAK;AACjB,oBAAA,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE;AAC/B,oBAAA,QAAQ,EAAE;AACR,wBAAA,KAAK,EAAE,KAAK;AACZ,wBAAA,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI;AAC9B,qBAAA;AACD,oBAAA,MAAM,EAAE,SAAS;AACjB,oBAAA,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK;AACrB,iBAAA;AACD,gBAAA;AACE,oBAAA,KAAK,EAAE,CAAC;oBACR,IAAI,EAAE,GAAG,GAAG,KAAK;AACjB,oBAAA,SAAS,EAAE,EAAE,KAAK,EAAE,eAAe,EAAE;AACrC,oBAAA,MAAM,EAAE,SAAS;AACjB,oBAAA,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK;AACrB;AACF;SACF;AAED,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,OAAO,CAAC;AAC9B,QAAA,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB;IAEQ,UAAU,CAAC,MAAW,EAAE,OAAe,EAAA;AAC7C,QAAA,MAAM,KAAK,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,OAAO,IAAI,GAAG;QAChD,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,KAAK;AAC5B,QAAA,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,GAAG,KAAK;AAC/C,QAAA,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,GAAG,GAAG,IAAI,CAAC,SAAS,EAAE;AAC7C,QAAA,MAAM,CAAC,SAAS,GAAG,OAAO;IAC5B;AAEQ,IAAA,eAAe,CAAC,KAAa,EAAA;AACnC,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,GAAG,KAAK,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;AAC7E,QAAA,MAAM,WAAW,GAAG,WAAW,GAAG,IAAI,CAAC,SAAS;QAChD,OAAO,CAAC,WAAW,GAAG,GAAG,EAAE,WAAW,GAAG,GAAG,CAAC;IAC/C;AAEQ,IAAA,YAAY,CAAC,QAAa,EAAA;QAChC,IAAI,YAAY,GAAG,CAAC;AACpB,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;AACnE,QAAA,YAAY,CAAC,OAAO,CAAC,MAAM,IAAG;YAC5B,IAAI,QAAQ,CAAC,MAAM,CAAC,IAAK,CAAC,KAAK,KAAK,EAAE;gBACpC;YACF;YACA,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC;AAClD,YAAA,YAAY,EAAE;AAChB,QAAA,CAAC,CAAC;IACJ;AAEmB,IAAA,aAAa,KAAU;AAE1C;;AAEG;IACH,iBAAiB,CAAC,KAAa,EAAE,OAAe,EAAA;AAC9C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;QACnE,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;QAC7C,IAAI,CAAC,YAAY,EAAE;IACrB;AAEA;;AAEG;AACH,IAAA,iBAAiB,CAAC,YAAmC,EAAA;AACnD,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,MAA2B;AACnE,QAAA,YAAY,CAAC,OAAO,CAAC,MAAM,IAAG;YAC5B,MAAM,aAAa,GAAG,YAAY,CAAC,MAAM,CAAC,WAAW,CAAC;YACtD,IAAI,CAAC,aAAa,EAAE;gBAClB;YACF;YACA,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC;AAChD,QAAA,CAAC,CAAC;QAEF,IAAI,CAAC,YAAY,EAAE;IACrB;uGAtNW,wBAAwB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECvBrC,omEAgEA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED9CY,uBAAuB,+PAAE,8BAA8B,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,OAAA,EAAA,CAAA;;2FAKtD,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;+BACE,mBAAmB,EAAA,OAAA,EACpB,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,EAAA,eAAA,EAGjD,uBAAuB,CAAC,OAAO,EAAA,QAAA,EAAA,omEAAA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA;;;AErBlD;;;AAGG;;ACHH;;AAEG;;;;"}
@@ -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';
@@ -29,11 +29,11 @@ class SiChartSankeyComponent extends SiChartBaseComponent {
29
29
  this.applyTitles();
30
30
  }
31
31
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartSankeyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
32
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartSankeyComponent, isStandalone: true, selector: "si-chart-sankey", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, toolTip: { classPropertyName: "toolTip", publicName: "toolTip", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", 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" }] });
32
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartSankeyComponent, isStandalone: true, selector: "si-chart-sankey", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, toolTip: { classPropertyName: "toolTip", publicName: "toolTip", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", 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 });
33
33
  }
34
34
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartSankeyComponent, decorators: [{
35
35
  type: Component,
36
- args: [{ selector: 'si-chart-sankey', 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"] }]
36
+ args: [{ selector: 'si-chart-sankey', 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"] }]
37
37
  }], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }], toolTip: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolTip", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }] } });
38
38
 
39
39
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-charts-ng-sankey.mjs","sources":["../../../../projects/charts-ng/sankey/si-chart-sankey.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/sankey/index.ts","../../../../projects/charts-ng/sankey/siemens-charts-ng-sankey.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component, input } from '@angular/core';\nimport { SiChartBaseComponent, SankeySeriesOption, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { SankeyChart } from 'echarts/charts';\n\necharts.use([SankeyChart]);\n\n@Component({\n selector: 'si-chart-sankey',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss'\n})\nexport class SiChartSankeyComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<SankeySeriesOption>();\n /**\n * @deprecated Use `tooltip` instead.\n * @defaultValue false\n */\n readonly toolTip = input(false);\n /** @defaultValue false */\n readonly tooltip = input(false);\n\n protected override applyOptions(): void {\n const series = this.series();\n this.actualOptions = {\n series: series ? [{ type: 'sankey', ...series }] : [],\n tooltip: { show: this.toolTip() || this.tooltip() }\n };\n\n this.applyTitles();\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-sankey.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAAA;;;AAGG;AAOH,OAAO,CAAC,GAAG,CAAC,CAAC,WAAW,CAAC,CAAC;AAQpB,MAAO,sBAAuB,SAAQ,oBAAoB,CAAA;;IAErD,MAAM,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAsB;AAC7C;;;AAGG;AACM,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;;AAEtB,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;IAEZ,YAAY,GAAA;AAC7B,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;QAC5B,IAAI,CAAC,aAAa,GAAG;AACnB,YAAA,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,MAAM,EAAE,CAAC,GAAG,EAAE;AACrD,YAAA,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE;SAClD;QAED,IAAI,CAAC,WAAW,EAAE;IACpB;uGAnBW,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAtB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EClBnC,omEAgEA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDlDY,uBAAuB,+PAAE,8BAA8B,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,CAAA;;2FAItD,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBANlC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iBAAiB,EAAA,OAAA,EAClB,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,EAAA,QAAA,EAAA,omEAAA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA;;;AEdpE;;;AAGG;;ACHH;;AAEG;;;;"}
1
+ {"version":3,"file":"siemens-charts-ng-sankey.mjs","sources":["../../../../projects/charts-ng/sankey/si-chart-sankey.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/sankey/index.ts","../../../../projects/charts-ng/sankey/siemens-charts-ng-sankey.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { SiChartBaseComponent, SankeySeriesOption, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { SankeyChart } from 'echarts/charts';\n\necharts.use([SankeyChart]);\n\n@Component({\n selector: 'si-chart-sankey',\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 SiChartSankeyComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<SankeySeriesOption>();\n /**\n * @deprecated Use `tooltip` instead.\n * @defaultValue false\n */\n readonly toolTip = input(false);\n /** @defaultValue false */\n readonly tooltip = input(false);\n\n protected override applyOptions(): void {\n const series = this.series();\n this.actualOptions = {\n series: series ? [{ type: 'sankey', ...series }] : [],\n tooltip: { show: this.toolTip() || this.tooltip() }\n };\n\n this.applyTitles();\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-sankey.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAAA;;;AAGG;AAOH,OAAO,CAAC,GAAG,CAAC,CAAC,WAAW,CAAC,CAAC;AASpB,MAAO,sBAAuB,SAAQ,oBAAoB,CAAA;;IAErD,MAAM,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAsB;AAC7C;;;AAGG;AACM,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;;AAEtB,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;IAEZ,YAAY,GAAA;AAC7B,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;QAC5B,IAAI,CAAC,aAAa,GAAG;AACnB,YAAA,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,MAAM,EAAE,CAAC,GAAG,EAAE;AACrD,YAAA,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE;SAClD;QAED,IAAI,CAAC,WAAW,EAAE;IACpB;uGAnBW,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAtB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnBnC,omEAgEA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDlDY,uBAAuB,+PAAE,8BAA8B,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,OAAA,EAAA,CAAA;;2FAKtD,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAPlC,SAAS;+BACE,iBAAiB,EAAA,OAAA,EAClB,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,EAAA,eAAA,EAGjD,uBAAuB,CAAC,OAAO,EAAA,QAAA,EAAA,omEAAA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA;;;AEjBlD;;;AAGG;;ACHH;;AAEG;;;;"}
@@ -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';
@@ -29,11 +29,11 @@ class SiChartSunburstComponent extends SiChartBaseComponent {
29
29
  this.applyTitles();
30
30
  }
31
31
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartSunburstComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
32
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartSunburstComponent, isStandalone: true, selector: "si-chart-sunburst", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, toolTip: { classPropertyName: "toolTip", publicName: "toolTip", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", 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" }] });
32
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartSunburstComponent, isStandalone: true, selector: "si-chart-sunburst", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, toolTip: { classPropertyName: "toolTip", publicName: "toolTip", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", 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 });
33
33
  }
34
34
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartSunburstComponent, decorators: [{
35
35
  type: Component,
36
- args: [{ selector: 'si-chart-sunburst', 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"] }]
36
+ args: [{ selector: 'si-chart-sunburst', 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"] }]
37
37
  }], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }], toolTip: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolTip", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }] } });
38
38
 
39
39
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"siemens-charts-ng-sunburst.mjs","sources":["../../../../projects/charts-ng/sunburst/si-chart-sunburst.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/sunburst/index.ts","../../../../projects/charts-ng/sunburst/siemens-charts-ng-sunburst.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component, input } from '@angular/core';\nimport { SiChartBaseComponent, SunburstSeriesOption, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { SunburstChart } from 'echarts/charts';\n\necharts.use([SunburstChart]);\n\n@Component({\n selector: 'si-chart-sunburst',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss'\n})\nexport class SiChartSunburstComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<SunburstSeriesOption>();\n /**\n * @deprecated Use `tooltip` instead.\n * @defaultValue false\n */\n readonly toolTip = input(false);\n /** @defaultValue false */\n readonly tooltip = input(false);\n\n protected override applyOptions(): void {\n const series = this.series();\n this.actualOptions = {\n series: series ? [{ type: 'sunburst', ...series }] : [],\n tooltip: { show: this.toolTip() || this.tooltip() }\n };\n\n this.applyTitles();\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-sunburst.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAAA;;;AAGG;AAOH,OAAO,CAAC,GAAG,CAAC,CAAC,aAAa,CAAC,CAAC;AAQtB,MAAO,wBAAyB,SAAQ,oBAAoB,CAAA;;IAEvD,MAAM,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAwB;AAC/C;;;AAGG;AACM,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;;AAEtB,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;IAEZ,YAAY,GAAA;AAC7B,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;QAC5B,IAAI,CAAC,aAAa,GAAG;AACnB,YAAA,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,MAAM,EAAE,CAAC,GAAG,EAAE;AACvD,YAAA,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE;SAClD;QAED,IAAI,CAAC,WAAW,EAAE;IACpB;uGAnBW,wBAAwB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EClBrC,omEAgEA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDlDY,uBAAuB,+PAAE,8BAA8B,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,CAAA;;2FAItD,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBANpC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,EAAA,OAAA,EACpB,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,EAAA,QAAA,EAAA,omEAAA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA;;;AEdpE;;;AAGG;;ACHH;;AAEG;;;;"}
1
+ {"version":3,"file":"siemens-charts-ng-sunburst.mjs","sources":["../../../../projects/charts-ng/sunburst/si-chart-sunburst.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/sunburst/index.ts","../../../../projects/charts-ng/sunburst/siemens-charts-ng-sunburst.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { SiChartBaseComponent, SunburstSeriesOption, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { SunburstChart } from 'echarts/charts';\n\necharts.use([SunburstChart]);\n\n@Component({\n selector: 'si-chart-sunburst',\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 SiChartSunburstComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<SunburstSeriesOption>();\n /**\n * @deprecated Use `tooltip` instead.\n * @defaultValue false\n */\n readonly toolTip = input(false);\n /** @defaultValue false */\n readonly tooltip = input(false);\n\n protected override applyOptions(): void {\n const series = this.series();\n this.actualOptions = {\n series: series ? [{ type: 'sunburst', ...series }] : [],\n tooltip: { show: this.toolTip() || this.tooltip() }\n };\n\n this.applyTitles();\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-sunburst.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAAA;;;AAGG;AAOH,OAAO,CAAC,GAAG,CAAC,CAAC,aAAa,CAAC,CAAC;AAStB,MAAO,wBAAyB,SAAQ,oBAAoB,CAAA;;IAEvD,MAAM,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAwB;AAC/C;;;AAGG;AACM,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;;AAEtB,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,mDAAC;IAEZ,YAAY,GAAA;AAC7B,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;QAC5B,IAAI,CAAC,aAAa,GAAG;AACnB,YAAA,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,MAAM,EAAE,CAAC,GAAG,EAAE;AACvD,YAAA,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE;SAClD;QAED,IAAI,CAAC,WAAW,EAAE;IACpB;uGAnBW,wBAAwB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnBrC,omEAgEA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDlDY,uBAAuB,+PAAE,8BAA8B,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,OAAA,EAAA,CAAA;;2FAKtD,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAPpC,SAAS;+BACE,mBAAmB,EAAA,OAAA,EACpB,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,EAAA,eAAA,EAGjD,uBAAuB,CAAC,OAAO,EAAA,QAAA,EAAA,omEAAA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA;;;AEjBlD;;;AAGG;;ACHH;;AAEG;;;;"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@siemens/charts-ng",
3
3
  "description": "Element Charts library.",
4
- "version": "49.10.0",
4
+ "version": "49.12.0",
5
5
  "license": "MIT",
6
6
  "repository": {
7
7
  "type": "git",
@@ -18,8 +18,8 @@
18
18
  },
19
19
  "type": "module",
20
20
  "peerDependencies": {
21
- "@angular/common": "21",
22
- "@angular/core": "21",
21
+ "@angular/common": "21 - 22",
22
+ "@angular/core": "21 - 22",
23
23
  "echarts": "^6.0.0"
24
24
  },
25
25
  "exports": {
@@ -69,16 +69,16 @@ interface AxisPointerEvent {
69
69
  dataIndex?: number;
70
70
  }
71
71
  interface DataZoomRange {
72
- startValue?: any;
73
- endValue?: any;
74
- visibleWidth?: any;
75
- start?: any;
76
- end?: any;
72
+ startValue?: number | string | Date;
73
+ endValue?: number | string | Date;
74
+ visibleWidth?: number;
75
+ start?: number;
76
+ end?: number;
77
77
  }
78
78
  interface DataZoomEvent {
79
79
  rangeType: AxisType;
80
- rangeStart: any;
81
- rangeEnd: any;
80
+ rangeStart: number;
81
+ rangeEnd: number;
82
82
  width?: number;
83
83
  autoZoomUpdate?: boolean;
84
84
  requested?: DataZoomRange;