@progress/kendo-angular-charts 21.1.1-develop.2 → 21.2.0-develop.10

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.
@@ -15,7 +15,7 @@ import { Subject, BehaviorSubject, combineLatest, Subscription } from 'rxjs';
15
15
  import { auditTime, tap } from 'rxjs/operators';
16
16
  import * as i1 from '@progress/kendo-angular-popup';
17
17
  import { PopupService, POPUP_CONTAINER } from '@progress/kendo-angular-popup';
18
- import { NgStyle, NgFor, NgClass, NgIf, NgTemplateOutlet } from '@angular/common';
18
+ import { NgStyle, NgClass, NgTemplateOutlet } from '@angular/common';
19
19
  import { BreadCrumbComponent } from '@progress/kendo-angular-navigation';
20
20
  import { homeIcon, arrowRightIcon, arrowLeftIcon } from '@progress/kendo-svg-icons';
21
21
  import { IconWrapperComponent, IconsService } from '@progress/kendo-angular-icons';
@@ -1416,21 +1416,25 @@ class CrosshairTooltipsContainerComponent {
1416
1416
  return result;
1417
1417
  }
1418
1418
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CrosshairTooltipsContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1419
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CrosshairTooltipsContainerComponent, isStandalone: true, selector: "kendo-chart-crosshair-tooltips-container", inputs: { popupSettings: "popupSettings" }, viewQueries: [{ propertyName: "crossahairTooltipComponents", predicate: CrosshairTooltipComponent, descendants: true }], ngImport: i0, template: `
1420
- <kendo-chart-crosshair-tooltip *ngFor="let key of tooltipKeys" [key]="key" [popupSettings]="popupSettings">
1421
- </kendo-chart-crosshair-tooltip>
1422
- `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: CrosshairTooltipComponent, selector: "kendo-chart-crosshair-tooltip", inputs: ["key"] }] });
1419
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CrosshairTooltipsContainerComponent, isStandalone: true, selector: "kendo-chart-crosshair-tooltips-container", inputs: { popupSettings: "popupSettings" }, viewQueries: [{ propertyName: "crossahairTooltipComponents", predicate: CrosshairTooltipComponent, descendants: true }], ngImport: i0, template: `
1420
+ @for (key of tooltipKeys; track key) {
1421
+ <kendo-chart-crosshair-tooltip [key]="key" [popupSettings]="popupSettings">
1422
+ </kendo-chart-crosshair-tooltip>
1423
+ }
1424
+ `, isInline: true, dependencies: [{ kind: "component", type: CrosshairTooltipComponent, selector: "kendo-chart-crosshair-tooltip", inputs: ["key"] }] });
1423
1425
  }
1424
1426
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CrosshairTooltipsContainerComponent, decorators: [{
1425
1427
  type: Component,
1426
1428
  args: [{
1427
1429
  selector: 'kendo-chart-crosshair-tooltips-container',
1428
1430
  template: `
1429
- <kendo-chart-crosshair-tooltip *ngFor="let key of tooltipKeys" [key]="key" [popupSettings]="popupSettings">
1430
- </kendo-chart-crosshair-tooltip>
1431
- `,
1431
+ @for (key of tooltipKeys; track key) {
1432
+ <kendo-chart-crosshair-tooltip [key]="key" [popupSettings]="popupSettings">
1433
+ </kendo-chart-crosshair-tooltip>
1434
+ }
1435
+ `,
1432
1436
  standalone: true,
1433
- imports: [NgFor, CrosshairTooltipComponent]
1437
+ imports: [CrosshairTooltipComponent]
1434
1438
  }]
1435
1439
  }], propDecorators: { popupSettings: [{
1436
1440
  type: Input
@@ -1516,9 +1520,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1516
1520
  * <kendo-chart-tooltip [shared]="true">
1517
1521
  * <ng-template kendoChartSharedTooltipTemplate let-category="category" let-points="points">
1518
1522
  * <div> {{ category }} </div>
1519
- * <div *ngFor="let point of points">
1523
+ * @for (point of points; track point) {
1524
+ * <div>
1520
1525
  * {{ point.series.name }} : {{ point.value }}
1521
- * </div>
1526
+ * </div>
1527
+ * }
1522
1528
  * </ng-template>
1523
1529
  * </kendo-chart-tooltip>
1524
1530
  * <kendo-chart-category-axis>
@@ -1806,42 +1812,56 @@ class TooltipPopupComponent extends BaseTooltip {
1806
1812
  super.hide();
1807
1813
  }
1808
1814
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TooltipPopupComponent, deps: [{ token: i1.PopupService }, { token: TooltipTemplateService }, { token: i1$1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
1809
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: TooltipPopupComponent, isStandalone: true, selector: "kendo-chart-tooltip-popup", inputs: { animate: "animate", classNames: "classNames", wrapperClass: "wrapperClass" }, outputs: { leave: "leave" }, providers: [PopupService, {
1815
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: TooltipPopupComponent, isStandalone: true, selector: "kendo-chart-tooltip-popup", inputs: { animate: "animate", classNames: "classNames", wrapperClass: "wrapperClass" }, outputs: { leave: "leave" }, providers: [PopupService, {
1810
1816
  provide: POPUP_CONTAINER,
1811
1817
  useFactory: bodyFactory
1812
1818
  }], viewQueries: [{ propertyName: "defaultSeriesTooltipTemplate", first: true, predicate: SeriesTooltipTemplateDirective, descendants: true }, { propertyName: "defaultSharedTooltipTemplate", first: true, predicate: SharedTooltipTemplateDirective, descendants: true }, { propertyName: "templateRef", first: true, predicate: ["content"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
1813
1819
  <ng-template #content>
1814
- <div [ngClass]="popupClasses" [ngStyle]="style">
1815
- <ng-template [ngTemplateOutlet]="seriesTooltipTemplateRef" *ngIf="!shared"
1816
- [ngTemplateOutletContext]="seriesTooltipContext">
1820
+ <div [ngClass]="popupClasses" [ngStyle]="style">
1821
+ @if (!shared) {
1822
+ <ng-template [ngTemplateOutlet]="seriesTooltipTemplateRef"
1823
+ [ngTemplateOutletContext]="seriesTooltipContext">
1817
1824
  </ng-template>
1818
- <ng-template [ngTemplateOutlet]="seriesSharedTooltipTemplateRef" *ngIf="shared"
1819
- [ngTemplateOutletContext]="seriesSharedTooltipContext">
1825
+ }
1826
+ @if (shared) {
1827
+ <ng-template [ngTemplateOutlet]="seriesSharedTooltipTemplateRef"
1828
+ [ngTemplateOutletContext]="seriesSharedTooltipContext">
1820
1829
  </ng-template>
1821
- </div>
1830
+ }
1831
+ </div>
1822
1832
  </ng-template>
1823
-
1833
+
1824
1834
  <ng-template kendoChartSeriesTooltipTemplate let-formattedValue="formattedValue">
1825
- <span [innerHTML]="formattedValue"></span>
1835
+ <span [innerHTML]="formattedValue"></span>
1826
1836
  </ng-template>
1827
1837
  <ng-template kendoChartSharedTooltipTemplate let-points="points" let-categoryText="categoryText" let-colspan="colspan" let-colorMarker="colorMarker" let-nameColumn="nameColumn" >
1828
- <table>
1829
- <tr><th [attr.colspan]='colspan'> {{ categoryText }} </th></tr>
1830
- <tr *ngFor="let point of points">
1831
- <td *ngIf="colorMarker"><span class='k-chart-shared-tooltip-marker' [style.background-color]='point.series.color'></span></td>
1832
- <td *ngIf="nameColumn">
1833
- <ng-container *ngIf="point.series.name !== undefined">{{ point.series.name }}</ng-container>
1834
- <ng-container *ngIf="point.series.name === undefined">&nbsp;</ng-container>
1835
- </td>
1836
- <td>
1837
- <ng-template [ngTemplateOutlet]="point.template"
1838
- [ngTemplateOutletContext]="point">
1839
- </ng-template>
1840
- </td>
1841
- </tr>
1842
- </table>
1838
+ <table>
1839
+ <tr><th [attr.colspan]='colspan'> {{ categoryText }} </th></tr>
1840
+ @for (point of points; track point) {
1841
+ <tr>
1842
+ @if (colorMarker) {
1843
+ <td><span class='k-chart-shared-tooltip-marker' [style.background-color]='point.series.color'></span></td>
1844
+ }
1845
+ @if (nameColumn) {
1846
+ <td>
1847
+ @if (point.series.name !== undefined) {
1848
+ {{ point.series.name }}
1849
+ }
1850
+ @if (point.series.name === undefined) {
1851
+ &nbsp;
1852
+ }
1853
+ </td>
1854
+ }
1855
+ <td>
1856
+ <ng-template [ngTemplateOutlet]="point.template"
1857
+ [ngTemplateOutletContext]="point">
1858
+ </ng-template>
1859
+ </td>
1860
+ </tr>
1861
+ }
1862
+ </table>
1843
1863
  </ng-template>
1844
- `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SeriesTooltipTemplateDirective, selector: "[kendoChartSeriesTooltipTemplate]" }, { kind: "directive", type: SharedTooltipTemplateDirective, selector: "[kendoChartSharedTooltipTemplate]" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
1864
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SeriesTooltipTemplateDirective, selector: "[kendoChartSeriesTooltipTemplate]" }, { kind: "directive", type: SharedTooltipTemplateDirective, selector: "[kendoChartSharedTooltipTemplate]" }] });
1845
1865
  }
1846
1866
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TooltipPopupComponent, decorators: [{
1847
1867
  type: Component,
@@ -1853,39 +1873,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
1853
1873
  selector: 'kendo-chart-tooltip-popup',
1854
1874
  template: `
1855
1875
  <ng-template #content>
1856
- <div [ngClass]="popupClasses" [ngStyle]="style">
1857
- <ng-template [ngTemplateOutlet]="seriesTooltipTemplateRef" *ngIf="!shared"
1858
- [ngTemplateOutletContext]="seriesTooltipContext">
1876
+ <div [ngClass]="popupClasses" [ngStyle]="style">
1877
+ @if (!shared) {
1878
+ <ng-template [ngTemplateOutlet]="seriesTooltipTemplateRef"
1879
+ [ngTemplateOutletContext]="seriesTooltipContext">
1859
1880
  </ng-template>
1860
- <ng-template [ngTemplateOutlet]="seriesSharedTooltipTemplateRef" *ngIf="shared"
1861
- [ngTemplateOutletContext]="seriesSharedTooltipContext">
1881
+ }
1882
+ @if (shared) {
1883
+ <ng-template [ngTemplateOutlet]="seriesSharedTooltipTemplateRef"
1884
+ [ngTemplateOutletContext]="seriesSharedTooltipContext">
1862
1885
  </ng-template>
1863
- </div>
1886
+ }
1887
+ </div>
1864
1888
  </ng-template>
1865
-
1889
+
1866
1890
  <ng-template kendoChartSeriesTooltipTemplate let-formattedValue="formattedValue">
1867
- <span [innerHTML]="formattedValue"></span>
1891
+ <span [innerHTML]="formattedValue"></span>
1868
1892
  </ng-template>
1869
1893
  <ng-template kendoChartSharedTooltipTemplate let-points="points" let-categoryText="categoryText" let-colspan="colspan" let-colorMarker="colorMarker" let-nameColumn="nameColumn" >
1870
- <table>
1871
- <tr><th [attr.colspan]='colspan'> {{ categoryText }} </th></tr>
1872
- <tr *ngFor="let point of points">
1873
- <td *ngIf="colorMarker"><span class='k-chart-shared-tooltip-marker' [style.background-color]='point.series.color'></span></td>
1874
- <td *ngIf="nameColumn">
1875
- <ng-container *ngIf="point.series.name !== undefined">{{ point.series.name }}</ng-container>
1876
- <ng-container *ngIf="point.series.name === undefined">&nbsp;</ng-container>
1877
- </td>
1878
- <td>
1879
- <ng-template [ngTemplateOutlet]="point.template"
1880
- [ngTemplateOutletContext]="point">
1881
- </ng-template>
1882
- </td>
1883
- </tr>
1884
- </table>
1894
+ <table>
1895
+ <tr><th [attr.colspan]='colspan'> {{ categoryText }} </th></tr>
1896
+ @for (point of points; track point) {
1897
+ <tr>
1898
+ @if (colorMarker) {
1899
+ <td><span class='k-chart-shared-tooltip-marker' [style.background-color]='point.series.color'></span></td>
1900
+ }
1901
+ @if (nameColumn) {
1902
+ <td>
1903
+ @if (point.series.name !== undefined) {
1904
+ {{ point.series.name }}
1905
+ }
1906
+ @if (point.series.name === undefined) {
1907
+ &nbsp;
1908
+ }
1909
+ </td>
1910
+ }
1911
+ <td>
1912
+ <ng-template [ngTemplateOutlet]="point.template"
1913
+ [ngTemplateOutletContext]="point">
1914
+ </ng-template>
1915
+ </td>
1916
+ </tr>
1917
+ }
1918
+ </table>
1885
1919
  </ng-template>
1886
1920
  `,
1887
1921
  standalone: true,
1888
- imports: [NgClass, NgStyle, NgIf, NgTemplateOutlet, SeriesTooltipTemplateDirective, SharedTooltipTemplateDirective, NgFor]
1922
+ imports: [NgClass, NgStyle, NgTemplateOutlet, SeriesTooltipTemplateDirective, SharedTooltipTemplateDirective]
1889
1923
  }]
1890
1924
  }], ctorParameters: () => [{ type: i1.PopupService }, { type: TooltipTemplateService }, { type: i1$1.LocalizationService }, { type: i0.NgZone }], propDecorators: { defaultSeriesTooltipTemplate: [{
1891
1925
  type: ViewChild,
@@ -2881,8 +2915,8 @@ const packageMetadata = {
2881
2915
  productName: 'Kendo UI for Angular',
2882
2916
  productCode: 'KENDOUIANGULAR',
2883
2917
  productCodes: ['KENDOUIANGULAR'],
2884
- publishDate: 1763729265,
2885
- version: '21.1.1-develop.2',
2918
+ publishDate: 1764593093,
2919
+ version: '21.2.0-develop.10',
2886
2920
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
2887
2921
  };
2888
2922
 
@@ -3910,7 +3944,7 @@ class ChartComponent {
3910
3944
  return Boolean(this.localizationService.rtl);
3911
3945
  }
3912
3946
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChartComponent, deps: [{ token: ConfigurationService }, { token: ThemeService }, { token: i0.ElementRef }, { token: i3.IntlService }, { token: i1$1.LocalizationService }, { token: i0.NgZone }, { token: InstanceEventService$1 }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
3913
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ChartComponent, isStandalone: true, selector: "kendo-chart", inputs: { pannable: "pannable", renderAs: "renderAs", seriesColors: "seriesColors", subtitle: "subtitle", title: "title", noData: "noData", observeStyles: "observeStyles", transitions: "transitions", zoomable: "zoomable", axisDefaults: "axisDefaults", categoryAxis: "categoryAxis", chartArea: "chartArea", legend: "legend", panes: "panes", paneDefaults: "paneDefaults", plotArea: "plotArea", series: "series", seriesDefaults: "seriesDefaults", tooltip: "tooltip", valueAxis: "valueAxis", xAxis: "xAxis", yAxis: "yAxis", resizeRateLimit: "resizeRateLimit", popupSettings: "popupSettings", drilldownLevel: "drilldownLevel" }, outputs: { axisLabelClick: "axisLabelClick", drag: "drag", dragEnd: "dragEnd", dragStart: "dragStart", legendItemHover: "legendItemHover", legendItemLeave: "legendItemLeave", noteClick: "noteClick", noteHover: "noteHover", noteLeave: "noteLeave", paneRender: "paneRender", plotAreaClick: "plotAreaClick", plotAreaHover: "plotAreaHover", plotAreaLeave: "plotAreaLeave", render: "render", select: "select", selectEnd: "selectEnd", selectStart: "selectStart", seriesClick: "seriesClick", drilldown: "drilldown", seriesHover: "seriesHover", seriesOver: "seriesOver", seriesLeave: "seriesLeave", zoom: "zoom", zoomEnd: "zoomEnd", zoomStart: "zoomStart", legendItemClick: "legendItemClick", drilldownLevelChange: "drilldownLevelChange" }, providers: [
3947
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ChartComponent, isStandalone: true, selector: "kendo-chart", inputs: { pannable: "pannable", renderAs: "renderAs", seriesColors: "seriesColors", subtitle: "subtitle", title: "title", noData: "noData", observeStyles: "observeStyles", transitions: "transitions", zoomable: "zoomable", axisDefaults: "axisDefaults", categoryAxis: "categoryAxis", chartArea: "chartArea", legend: "legend", panes: "panes", paneDefaults: "paneDefaults", plotArea: "plotArea", series: "series", seriesDefaults: "seriesDefaults", tooltip: "tooltip", valueAxis: "valueAxis", xAxis: "xAxis", yAxis: "yAxis", resizeRateLimit: "resizeRateLimit", popupSettings: "popupSettings", drilldownLevel: "drilldownLevel" }, outputs: { axisLabelClick: "axisLabelClick", drag: "drag", dragEnd: "dragEnd", dragStart: "dragStart", legendItemHover: "legendItemHover", legendItemLeave: "legendItemLeave", noteClick: "noteClick", noteHover: "noteHover", noteLeave: "noteLeave", paneRender: "paneRender", plotAreaClick: "plotAreaClick", plotAreaHover: "plotAreaHover", plotAreaLeave: "plotAreaLeave", render: "render", select: "select", selectEnd: "selectEnd", selectStart: "selectStart", seriesClick: "seriesClick", drilldown: "drilldown", seriesHover: "seriesHover", seriesOver: "seriesOver", seriesLeave: "seriesLeave", zoom: "zoom", zoomEnd: "zoomEnd", zoomStart: "zoomStart", legendItemClick: "legendItemClick", drilldownLevelChange: "drilldownLevelChange" }, providers: [
3914
3948
  ConfigurationService,
3915
3949
  TooltipTemplateService,
3916
3950
  InstanceEventService$1,
@@ -3921,31 +3955,38 @@ class ChartComponent {
3921
3955
  }
3922
3956
  ], queries: [{ propertyName: "donutCenterTemplate", first: true, predicate: DonutCenterTemplateDirective, descendants: true }, { propertyName: "noDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }, { propertyName: "seriesCollectionComponent", predicate: SeriesComponent }, { propertyName: "seriesComponents", predicate: SeriesItemComponent, descendants: true }], viewQueries: [{ propertyName: "tooltipInstance", first: true, predicate: TooltipPopupComponent, descendants: true, static: true }, { propertyName: "crossahirTooltips", first: true, predicate: CrosshairTooltipsContainerComponent, descendants: true, static: true }, { propertyName: "surfaceElement", first: true, predicate: ["surface"], descendants: true, static: true }], exportAs: ["kendoChart"], usesOnChanges: true, ngImport: i0, template: `
3923
3957
  <ng-container
3924
- kendoChartLocalizedMessages
3925
- i18n-noData="kendo.chart.noData|The message to display when no series are defined, or all series are empty"
3926
- noData="No data available"
3958
+ kendoChartLocalizedMessages
3959
+ i18n-noData="kendo.chart.noData|The message to display when no series are defined, or all series are empty"
3960
+ noData="No data available"
3927
3961
  ></ng-container>
3928
3962
  <div #surface class="k-chart-surface">
3929
- <div *ngIf="noData" class='k-chart-overlay' [style.display]="'none'">
3930
- <div class='k-no-data'>
3931
- <ng-template *ngIf="noDataTemplate; else noDataMessage" [ngTemplateOutlet]="noDataTemplate.templateRef"></ng-template>
3932
- <ng-template #noDataMessage>
3933
- {{ messageFor('noData') }}
3934
- </ng-template>
3935
- </div>
3963
+ @if (noData) {
3964
+ <div class='k-chart-overlay' [style.display]="'none'">
3965
+ <div class='k-no-data'>
3966
+ @if (noDataTemplate) {
3967
+ <ng-template [ngTemplateOutlet]="noDataTemplate.templateRef"></ng-template>
3968
+ } @else {
3969
+ {{ messageFor('noData') }}
3970
+ }
3971
+ </div>
3936
3972
  </div>
3973
+ }
3937
3974
  </div>
3938
3975
  <kendo-chart-crosshair-tooltips-container [popupSettings]="popupSettings">
3939
3976
  </kendo-chart-crosshair-tooltips-container>
3940
3977
  <kendo-chart-tooltip-popup (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
3941
3978
  </kendo-chart-tooltip-popup>
3942
3979
  <kendo-resize-sensor (resize)="onResize()" [rateLimit]="resizeRateLimit"></kendo-resize-sensor>
3943
- <div class="k-chart-donut-center" [ngStyle]="donutCenterStyle" *ngIf="donutCenterStyle && donutCenterTemplate">
3944
- <ng-template [ngTemplateOutlet]="donutCenterTemplate.templateRef"></ng-template>
3945
- </div>
3946
-
3947
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
3948
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedChartMessagesDirective, selector: "[kendoChartLocalizedMessages]" }, { kind: "component", type: CrosshairTooltipsContainerComponent, selector: "kendo-chart-crosshair-tooltips-container", inputs: ["popupSettings"] }, { kind: "component", type: TooltipPopupComponent, selector: "kendo-chart-tooltip-popup", inputs: ["animate", "classNames", "wrapperClass"], outputs: ["leave"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3980
+ @if (donutCenterStyle && donutCenterTemplate) {
3981
+ <div class="k-chart-donut-center" [ngStyle]="donutCenterStyle">
3982
+ <ng-template [ngTemplateOutlet]="donutCenterTemplate.templateRef"></ng-template>
3983
+ </div>
3984
+ }
3985
+
3986
+ @if (showLicenseWatermark) {
3987
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
3988
+ }
3989
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedChartMessagesDirective, selector: "[kendoChartLocalizedMessages]" }, { kind: "component", type: CrosshairTooltipsContainerComponent, selector: "kendo-chart-crosshair-tooltips-container", inputs: ["popupSettings"] }, { kind: "component", type: TooltipPopupComponent, selector: "kendo-chart-tooltip-popup", inputs: ["animate", "classNames", "wrapperClass"], outputs: ["leave"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3949
3990
  }
3950
3991
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChartComponent, decorators: [{
3951
3992
  type: Component,
@@ -3965,33 +4006,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
3965
4006
  selector: 'kendo-chart',
3966
4007
  template: `
3967
4008
  <ng-container
3968
- kendoChartLocalizedMessages
3969
- i18n-noData="kendo.chart.noData|The message to display when no series are defined, or all series are empty"
3970
- noData="No data available"
4009
+ kendoChartLocalizedMessages
4010
+ i18n-noData="kendo.chart.noData|The message to display when no series are defined, or all series are empty"
4011
+ noData="No data available"
3971
4012
  ></ng-container>
3972
4013
  <div #surface class="k-chart-surface">
3973
- <div *ngIf="noData" class='k-chart-overlay' [style.display]="'none'">
3974
- <div class='k-no-data'>
3975
- <ng-template *ngIf="noDataTemplate; else noDataMessage" [ngTemplateOutlet]="noDataTemplate.templateRef"></ng-template>
3976
- <ng-template #noDataMessage>
3977
- {{ messageFor('noData') }}
3978
- </ng-template>
3979
- </div>
4014
+ @if (noData) {
4015
+ <div class='k-chart-overlay' [style.display]="'none'">
4016
+ <div class='k-no-data'>
4017
+ @if (noDataTemplate) {
4018
+ <ng-template [ngTemplateOutlet]="noDataTemplate.templateRef"></ng-template>
4019
+ } @else {
4020
+ {{ messageFor('noData') }}
4021
+ }
4022
+ </div>
3980
4023
  </div>
4024
+ }
3981
4025
  </div>
3982
4026
  <kendo-chart-crosshair-tooltips-container [popupSettings]="popupSettings">
3983
4027
  </kendo-chart-crosshair-tooltips-container>
3984
4028
  <kendo-chart-tooltip-popup (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
3985
4029
  </kendo-chart-tooltip-popup>
3986
4030
  <kendo-resize-sensor (resize)="onResize()" [rateLimit]="resizeRateLimit"></kendo-resize-sensor>
3987
- <div class="k-chart-donut-center" [ngStyle]="donutCenterStyle" *ngIf="donutCenterStyle && donutCenterTemplate">
3988
- <ng-template [ngTemplateOutlet]="donutCenterTemplate.templateRef"></ng-template>
3989
- </div>
3990
-
3991
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
3992
- `,
4031
+ @if (donutCenterStyle && donutCenterTemplate) {
4032
+ <div class="k-chart-donut-center" [ngStyle]="donutCenterStyle">
4033
+ <ng-template [ngTemplateOutlet]="donutCenterTemplate.templateRef"></ng-template>
4034
+ </div>
4035
+ }
4036
+
4037
+ @if (showLicenseWatermark) {
4038
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
4039
+ }
4040
+ `,
3993
4041
  standalone: true,
3994
- imports: [LocalizedChartMessagesDirective, CrosshairTooltipsContainerComponent, TooltipPopupComponent, ResizeSensorComponent, NgIf, NgStyle, NgTemplateOutlet, WatermarkOverlayComponent]
4042
+ imports: [LocalizedChartMessagesDirective, CrosshairTooltipsContainerComponent, TooltipPopupComponent, ResizeSensorComponent, NgStyle, NgTemplateOutlet, WatermarkOverlayComponent]
3995
4043
  }]
3996
4044
  }], ctorParameters: () => [{ type: ConfigurationService }, { type: ThemeService }, { type: i0.ElementRef }, { type: i3.IntlService }, { type: i1$1.LocalizationService }, { type: i0.NgZone }, { type: InstanceEventService$1 }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { pannable: [{
3997
4045
  type: Input
@@ -6133,7 +6181,7 @@ class StockChartComponent extends ChartComponent {
6133
6181
  return isDevMode();
6134
6182
  }
6135
6183
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StockChartComponent, deps: [{ token: ConfigurationService }, { token: ThemeService }, { token: i0.ElementRef }, { token: i3.IntlService }, { token: i1$1.LocalizationService }, { token: i0.NgZone }, { token: StockInstanceEventService }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
6136
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StockChartComponent, isStandalone: true, selector: "kendo-stockchart", inputs: { navigator: "navigator", pannable: "pannable", zoomable: "zoomable", drilldownLevel: "drilldownLevel" }, outputs: { drilldown: "drilldown", drilldownLevelChange: "drilldownLevelChange", navigatorFilter: "navigatorFilter" }, providers: [
6184
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: StockChartComponent, isStandalone: true, selector: "kendo-stockchart", inputs: { navigator: "navigator", pannable: "pannable", zoomable: "zoomable", drilldownLevel: "drilldownLevel" }, outputs: { drilldown: "drilldown", drilldownLevelChange: "drilldownLevelChange", navigatorFilter: "navigatorFilter" }, providers: [
6137
6185
  ConfigurationService,
6138
6186
  TooltipTemplateService,
6139
6187
  { provide: RootConfigurationService, useExisting: ConfigurationService },
@@ -6150,9 +6198,11 @@ class StockChartComponent extends ChartComponent {
6150
6198
  <kendo-chart-tooltip-popup (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
6151
6199
  </kendo-chart-tooltip-popup>
6152
6200
  <kendo-resize-sensor (resize)="onResize()"></kendo-resize-sensor>
6153
-
6154
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
6155
- `, isInline: true, dependencies: [{ kind: "component", type: CrosshairTooltipsContainerComponent, selector: "kendo-chart-crosshair-tooltips-container", inputs: ["popupSettings"] }, { kind: "component", type: TooltipPopupComponent, selector: "kendo-chart-tooltip-popup", inputs: ["animate", "classNames", "wrapperClass"], outputs: ["leave"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
6201
+
6202
+ @if (showLicenseWatermark) {
6203
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
6204
+ }
6205
+ `, isInline: true, dependencies: [{ kind: "component", type: CrosshairTooltipsContainerComponent, selector: "kendo-chart-crosshair-tooltips-container", inputs: ["popupSettings"] }, { kind: "component", type: TooltipPopupComponent, selector: "kendo-chart-tooltip-popup", inputs: ["animate", "classNames", "wrapperClass"], outputs: ["leave"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
6156
6206
  }
6157
6207
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StockChartComponent, decorators: [{
6158
6208
  type: Component,
@@ -6178,11 +6228,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
6178
6228
  <kendo-chart-tooltip-popup (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
6179
6229
  </kendo-chart-tooltip-popup>
6180
6230
  <kendo-resize-sensor (resize)="onResize()"></kendo-resize-sensor>
6181
-
6182
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
6183
- `,
6231
+
6232
+ @if (showLicenseWatermark) {
6233
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
6234
+ }
6235
+ `,
6184
6236
  standalone: true,
6185
- imports: [CrosshairTooltipsContainerComponent, TooltipPopupComponent, ResizeSensorComponent, NgIf, WatermarkOverlayComponent]
6237
+ imports: [CrosshairTooltipsContainerComponent, TooltipPopupComponent, ResizeSensorComponent, WatermarkOverlayComponent]
6186
6238
  }]
6187
6239
  }], ctorParameters: () => [{ type: ConfigurationService }, { type: ThemeService }, { type: i0.ElementRef }, { type: i3.IntlService }, { type: i1$1.LocalizationService }, { type: i0.NgZone }, { type: StockInstanceEventService }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { navigator: [{
6188
6240
  type: Input
@@ -9148,7 +9200,7 @@ class SparklineComponent extends ChartComponent {
9148
9200
  this.instance.setOptions(Sparkline.normalizeOptions(this.options));
9149
9201
  }
9150
9202
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SparklineComponent, deps: [{ token: ConfigurationService }, { token: ThemeService }, { token: i0.ElementRef }, { token: i3.IntlService }, { token: i1$1.LocalizationService }, { token: i0.NgZone }, { token: InstanceEventService$1 }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
9151
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SparklineComponent, isStandalone: true, selector: "kendo-sparkline", inputs: { type: "type", data: "data", noData: "noData", drilldownLevel: "drilldownLevel" }, outputs: { drilldown: "drilldown", drilldownLevelChange: "drilldownLevelChange" }, providers: [
9203
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SparklineComponent, isStandalone: true, selector: "kendo-sparkline", inputs: { type: "type", data: "data", noData: "noData", drilldownLevel: "drilldownLevel" }, outputs: { drilldown: "drilldown", drilldownLevelChange: "drilldownLevelChange" }, providers: [
9152
9204
  ConfigurationService,
9153
9205
  TooltipTemplateService,
9154
9206
  InstanceEventService$1,
@@ -9162,12 +9214,14 @@ class SparklineComponent extends ChartComponent {
9162
9214
  <kendo-chart-crosshair-tooltips-container [popupSettings]="popupSettings">
9163
9215
  </kendo-chart-crosshair-tooltips-container>
9164
9216
  <kendo-chart-tooltip-popup [animate]="false" [wrapperClass]="tooltipWrapperClass"
9165
- [classNames]="tooltipContentClasses" (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
9217
+ [classNames]="tooltipContentClasses" (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
9166
9218
  </kendo-chart-tooltip-popup>
9167
9219
  <kendo-resize-sensor (resize)="onResize()"></kendo-resize-sensor>
9168
-
9169
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
9170
- `, isInline: true, dependencies: [{ kind: "component", type: CrosshairTooltipsContainerComponent, selector: "kendo-chart-crosshair-tooltips-container", inputs: ["popupSettings"] }, { kind: "component", type: TooltipPopupComponent, selector: "kendo-chart-tooltip-popup", inputs: ["animate", "classNames", "wrapperClass"], outputs: ["leave"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9220
+
9221
+ @if (showLicenseWatermark) {
9222
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
9223
+ }
9224
+ `, isInline: true, dependencies: [{ kind: "component", type: CrosshairTooltipsContainerComponent, selector: "kendo-chart-crosshair-tooltips-container", inputs: ["popupSettings"] }, { kind: "component", type: TooltipPopupComponent, selector: "kendo-chart-tooltip-popup", inputs: ["animate", "classNames", "wrapperClass"], outputs: ["leave"] }, { kind: "component", type: ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9171
9225
  }
9172
9226
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SparklineComponent, decorators: [{
9173
9227
  type: Component,
@@ -9190,14 +9244,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
9190
9244
  <kendo-chart-crosshair-tooltips-container [popupSettings]="popupSettings">
9191
9245
  </kendo-chart-crosshair-tooltips-container>
9192
9246
  <kendo-chart-tooltip-popup [animate]="false" [wrapperClass]="tooltipWrapperClass"
9193
- [classNames]="tooltipContentClasses" (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
9247
+ [classNames]="tooltipContentClasses" (leave)="tooltipMouseleave($event)" [popupSettings]="popupSettings">
9194
9248
  </kendo-chart-tooltip-popup>
9195
9249
  <kendo-resize-sensor (resize)="onResize()"></kendo-resize-sensor>
9196
-
9197
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
9198
- `,
9250
+
9251
+ @if (showLicenseWatermark) {
9252
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
9253
+ }
9254
+ `,
9199
9255
  standalone: true,
9200
- imports: [CrosshairTooltipsContainerComponent, TooltipPopupComponent, ResizeSensorComponent, NgIf, WatermarkOverlayComponent]
9256
+ imports: [CrosshairTooltipsContainerComponent, TooltipPopupComponent, ResizeSensorComponent, WatermarkOverlayComponent]
9201
9257
  }]
9202
9258
  }], ctorParameters: () => [{ type: ConfigurationService }, { type: ThemeService }, { type: i0.ElementRef }, { type: i3.IntlService }, { type: i1$1.LocalizationService }, { type: i0.NgZone }, { type: InstanceEventService$1 }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { type: [{
9203
9259
  type: Input
@@ -12758,7 +12814,7 @@ class SankeyTooltipPopupComponent extends BaseTooltip {
12758
12814
  return Boolean(this.localizationService.rtl);
12759
12815
  }
12760
12816
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SankeyTooltipPopupComponent, deps: [{ token: i0.ElementRef }, { token: i1.PopupService }, { token: SankeyTooltipTemplateService }, { token: i1$1.LocalizationService }, { token: i3.IntlService }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
12761
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SankeyTooltipPopupComponent, isStandalone: true, selector: "kendo-sankey-tooltip-popup", inputs: { animate: "animate", wrapperClass: "wrapperClass", tooltipUnitFormat: "tooltipUnitFormat", offset: "offset" }, providers: [
12817
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SankeyTooltipPopupComponent, isStandalone: true, selector: "kendo-sankey-tooltip-popup", inputs: { animate: "animate", wrapperClass: "wrapperClass", tooltipUnitFormat: "tooltipUnitFormat", offset: "offset" }, providers: [
12762
12818
  PopupService,
12763
12819
  {
12764
12820
  provide: POPUP_CONTAINER,
@@ -12766,43 +12822,45 @@ class SankeyTooltipPopupComponent extends BaseTooltip {
12766
12822
  },
12767
12823
  ], viewQueries: [{ propertyName: "defaultNodeTooltipTemplate", first: true, predicate: SankeyNodeTooltipTemplateDirective, descendants: true }, { propertyName: "defaultLinkTooltipTemplate", first: true, predicate: SankeyLinkTooltipTemplateDirective, descendants: true }, { propertyName: "templateRef", first: true, predicate: ["content"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
12768
12824
  <ng-template #content>
12769
- <div class="k-tooltip k-sankey-tooltip k-chart-tooltip k-chart-shared-tooltip" [ngStyle]="style">
12770
- <div class="k-tooltip-content">
12771
- <ng-template
12772
- [ngTemplateOutlet]="nodeTooltipTemplateRef"
12773
- *ngIf="isNode"
12774
- [ngTemplateOutletContext]="nodeTooltipContext"
12775
- >
12776
- </ng-template>
12777
- <ng-template
12778
- [ngTemplateOutlet]="linkTooltipTemplateRef"
12779
- *ngIf="isLink"
12780
- [ngTemplateOutletContext]="linkTooltipContext"
12781
- >
12782
- </ng-template>
12783
- </div>
12825
+ <div class="k-tooltip k-sankey-tooltip k-chart-tooltip k-chart-shared-tooltip" [ngStyle]="style">
12826
+ <div class="k-tooltip-content">
12827
+ @if (isNode) {
12828
+ <ng-template
12829
+ [ngTemplateOutlet]="nodeTooltipTemplateRef"
12830
+ [ngTemplateOutletContext]="nodeTooltipContext"
12831
+ >
12832
+ </ng-template>
12833
+ }
12834
+ @if (isLink) {
12835
+ <ng-template
12836
+ [ngTemplateOutlet]="linkTooltipTemplateRef"
12837
+ [ngTemplateOutletContext]="linkTooltipContext"
12838
+ >
12839
+ </ng-template>
12840
+ }
12784
12841
  </div>
12842
+ </div>
12785
12843
  </ng-template>
12786
-
12844
+
12787
12845
  <ng-template kendoSankeyNodeTooltipTemplate let-color="color" let-label="label" let-value="value">
12788
- <div [ngStyle]="tooltipStyle">
12789
- <div squareSymbol [color]="color"></div>
12790
- <span [ngStyle]="textStyle">{{ label.text }}</span>
12791
- <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12792
- </div>
12846
+ <div [ngStyle]="tooltipStyle">
12847
+ <div squareSymbol [color]="color"></div>
12848
+ <span [ngStyle]="textStyle">{{ label.text }}</span>
12849
+ <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12850
+ </div>
12793
12851
  </ng-template>
12794
-
12852
+
12795
12853
  <ng-template kendoSankeyLinkTooltipTemplate let-source="source" let-target="target" let-value="value">
12796
- <div [ngStyle]="tooltipStyle">
12797
- <div squareSymbol [color]="source.color"></div>
12798
- <span [ngStyle]="textStyle">{{ source.label?.text }}</span>
12799
- <kendo-icon-wrapper [name]="arrowIcon.name" [svgIcon]="arrowIcon"></kendo-icon-wrapper>
12800
- <div squareSymbol [color]="target.color"></div>
12801
- <span [ngStyle]="textStyle">{{ target.label?.text }}</span>
12802
- <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12803
- </div>
12854
+ <div [ngStyle]="tooltipStyle">
12855
+ <div squareSymbol [color]="source.color"></div>
12856
+ <span [ngStyle]="textStyle">{{ source.label?.text }}</span>
12857
+ <kendo-icon-wrapper [name]="arrowIcon.name" [svgIcon]="arrowIcon"></kendo-icon-wrapper>
12858
+ <div squareSymbol [color]="target.color"></div>
12859
+ <span [ngStyle]="textStyle">{{ target.label?.text }}</span>
12860
+ <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12861
+ </div>
12804
12862
  </ng-template>
12805
- `, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SankeyNodeTooltipTemplateDirective, selector: "[kendoSankeyNodeTooltipTemplate]" }, { kind: "directive", type: SquareSymbol, selector: "[squareSymbol]", inputs: ["color", "size"] }, { kind: "directive", type: SankeyLinkTooltipTemplateDirective, selector: "[kendoSankeyLinkTooltipTemplate]" }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
12863
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SankeyNodeTooltipTemplateDirective, selector: "[kendoSankeyNodeTooltipTemplate]" }, { kind: "directive", type: SquareSymbol, selector: "[squareSymbol]", inputs: ["color", "size"] }, { kind: "directive", type: SankeyLinkTooltipTemplateDirective, selector: "[kendoSankeyLinkTooltipTemplate]" }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
12806
12864
  }
12807
12865
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SankeyTooltipPopupComponent, decorators: [{
12808
12866
  type: Component,
@@ -12817,45 +12875,47 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
12817
12875
  selector: 'kendo-sankey-tooltip-popup',
12818
12876
  template: `
12819
12877
  <ng-template #content>
12820
- <div class="k-tooltip k-sankey-tooltip k-chart-tooltip k-chart-shared-tooltip" [ngStyle]="style">
12821
- <div class="k-tooltip-content">
12822
- <ng-template
12823
- [ngTemplateOutlet]="nodeTooltipTemplateRef"
12824
- *ngIf="isNode"
12825
- [ngTemplateOutletContext]="nodeTooltipContext"
12826
- >
12827
- </ng-template>
12828
- <ng-template
12829
- [ngTemplateOutlet]="linkTooltipTemplateRef"
12830
- *ngIf="isLink"
12831
- [ngTemplateOutletContext]="linkTooltipContext"
12832
- >
12833
- </ng-template>
12834
- </div>
12878
+ <div class="k-tooltip k-sankey-tooltip k-chart-tooltip k-chart-shared-tooltip" [ngStyle]="style">
12879
+ <div class="k-tooltip-content">
12880
+ @if (isNode) {
12881
+ <ng-template
12882
+ [ngTemplateOutlet]="nodeTooltipTemplateRef"
12883
+ [ngTemplateOutletContext]="nodeTooltipContext"
12884
+ >
12885
+ </ng-template>
12886
+ }
12887
+ @if (isLink) {
12888
+ <ng-template
12889
+ [ngTemplateOutlet]="linkTooltipTemplateRef"
12890
+ [ngTemplateOutletContext]="linkTooltipContext"
12891
+ >
12892
+ </ng-template>
12893
+ }
12835
12894
  </div>
12895
+ </div>
12836
12896
  </ng-template>
12837
-
12897
+
12838
12898
  <ng-template kendoSankeyNodeTooltipTemplate let-color="color" let-label="label" let-value="value">
12839
- <div [ngStyle]="tooltipStyle">
12840
- <div squareSymbol [color]="color"></div>
12841
- <span [ngStyle]="textStyle">{{ label.text }}</span>
12842
- <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12843
- </div>
12899
+ <div [ngStyle]="tooltipStyle">
12900
+ <div squareSymbol [color]="color"></div>
12901
+ <span [ngStyle]="textStyle">{{ label.text }}</span>
12902
+ <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12903
+ </div>
12844
12904
  </ng-template>
12845
-
12905
+
12846
12906
  <ng-template kendoSankeyLinkTooltipTemplate let-source="source" let-target="target" let-value="value">
12847
- <div [ngStyle]="tooltipStyle">
12848
- <div squareSymbol [color]="source.color"></div>
12849
- <span [ngStyle]="textStyle">{{ source.label?.text }}</span>
12850
- <kendo-icon-wrapper [name]="arrowIcon.name" [svgIcon]="arrowIcon"></kendo-icon-wrapper>
12851
- <div squareSymbol [color]="target.color"></div>
12852
- <span [ngStyle]="textStyle">{{ target.label?.text }}</span>
12853
- <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12854
- </div>
12907
+ <div [ngStyle]="tooltipStyle">
12908
+ <div squareSymbol [color]="source.color"></div>
12909
+ <span [ngStyle]="textStyle">{{ source.label?.text }}</span>
12910
+ <kendo-icon-wrapper [name]="arrowIcon.name" [svgIcon]="arrowIcon"></kendo-icon-wrapper>
12911
+ <div squareSymbol [color]="target.color"></div>
12912
+ <span [ngStyle]="textStyle">{{ target.label?.text }}</span>
12913
+ <span [ngStyle]="textStyle">{{ formatUnits(value) }}</span>
12914
+ </div>
12855
12915
  </ng-template>
12856
- `,
12916
+ `,
12857
12917
  standalone: true,
12858
- imports: [NgStyle, NgIf, NgTemplateOutlet, SankeyNodeTooltipTemplateDirective, SquareSymbol, SankeyLinkTooltipTemplateDirective, IconWrapperComponent]
12918
+ imports: [NgStyle, NgTemplateOutlet, SankeyNodeTooltipTemplateDirective, SquareSymbol, SankeyLinkTooltipTemplateDirective, IconWrapperComponent]
12859
12919
  }]
12860
12920
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.PopupService }, { type: SankeyTooltipTemplateService }, { type: i1$1.LocalizationService }, { type: i3.IntlService }, { type: i0.NgZone }, { type: i0.Renderer2 }], propDecorators: { defaultNodeTooltipTemplate: [{
12861
12921
  type: ViewChild,
@@ -13313,7 +13373,7 @@ class SankeyComponent {
13313
13373
  return Boolean(this.localizationService.rtl);
13314
13374
  }
13315
13375
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SankeyComponent, deps: [{ token: i0.ElementRef }, { token: ConfigurationService }, { token: SankeyThemeService }, { token: i1$1.LocalizationService }, { token: InstanceEventService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i3.IntlService }], target: i0.ɵɵFactoryTarget.Component });
13316
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SankeyComponent, isStandalone: true, selector: "kendo-sankey", inputs: { data: "data", links: "links", nodes: "nodes", labels: "labels", title: "title", legend: "legend", tooltip: "tooltip", disableAutoLayout: "disableAutoLayout", navigable: "navigable", popupSettings: "popupSettings" }, outputs: { nodeEnter: "nodeEnter", nodeLeave: "nodeLeave", nodeClick: "nodeClick", linkEnter: "linkEnter", linkLeave: "linkLeave", linkClick: "linkClick" }, providers: [
13376
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SankeyComponent, isStandalone: true, selector: "kendo-sankey", inputs: { data: "data", links: "links", nodes: "nodes", labels: "labels", title: "title", legend: "legend", tooltip: "tooltip", disableAutoLayout: "disableAutoLayout", navigable: "navigable", popupSettings: "popupSettings" }, outputs: { nodeEnter: "nodeEnter", nodeLeave: "nodeLeave", nodeClick: "nodeClick", linkEnter: "linkEnter", linkLeave: "linkLeave", linkClick: "linkClick" }, providers: [
13317
13377
  ConfigurationService,
13318
13378
  LocalizationService,
13319
13379
  InstanceEventService,
@@ -13324,18 +13384,20 @@ class SankeyComponent {
13324
13384
  },
13325
13385
  ], viewQueries: [{ propertyName: "tooltipInstance", first: true, predicate: SankeyTooltipPopupComponent, descendants: true, static: true }, { propertyName: "instanceElement", first: true, predicate: ["instance"], descendants: true, static: true }], exportAs: ["kendoSankey"], usesOnChanges: true, ngImport: i0, template: `
13326
13386
  <ng-container
13327
- kendoSankeyLocalizedMessages
13328
- i18n-tooltipUnitFormat="kendo.sankey.tooltipUnitFormat|The format string to use when displaying node and link values in the tooltip"
13329
- tooltipUnitFormat="({0} units)"
13387
+ kendoSankeyLocalizedMessages
13388
+ i18n-tooltipUnitFormat="kendo.sankey.tooltipUnitFormat|The format string to use when displaying node and link values in the tooltip"
13389
+ tooltipUnitFormat="({0} units)"
13330
13390
  ></ng-container>
13331
13391
  <div #instance class="k-chart-surface"></div>
13332
13392
  <kendo-sankey-tooltip-popup
13333
- [popupSettings]="popupSettings"
13334
- [tooltipUnitFormat]="messageFor('tooltipUnitFormat')"
13335
- >
13393
+ [popupSettings]="popupSettings"
13394
+ [tooltipUnitFormat]="messageFor('tooltipUnitFormat')"
13395
+ >
13336
13396
  </kendo-sankey-tooltip-popup>
13337
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
13338
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoSankeyLocalizedMessages]" }, { kind: "component", type: SankeyTooltipPopupComponent, selector: "kendo-sankey-tooltip-popup", inputs: ["animate", "wrapperClass", "tooltipUnitFormat", "offset"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
13397
+ @if (showLicenseWatermark) {
13398
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
13399
+ }
13400
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoSankeyLocalizedMessages]" }, { kind: "component", type: SankeyTooltipPopupComponent, selector: "kendo-sankey-tooltip-popup", inputs: ["animate", "wrapperClass", "tooltipUnitFormat", "offset"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]", inputs: ["licenseMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
13339
13401
  }
13340
13402
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SankeyComponent, decorators: [{
13341
13403
  type: Component,
@@ -13355,20 +13417,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
13355
13417
  selector: 'kendo-sankey',
13356
13418
  template: `
13357
13419
  <ng-container
13358
- kendoSankeyLocalizedMessages
13359
- i18n-tooltipUnitFormat="kendo.sankey.tooltipUnitFormat|The format string to use when displaying node and link values in the tooltip"
13360
- tooltipUnitFormat="({0} units)"
13420
+ kendoSankeyLocalizedMessages
13421
+ i18n-tooltipUnitFormat="kendo.sankey.tooltipUnitFormat|The format string to use when displaying node and link values in the tooltip"
13422
+ tooltipUnitFormat="({0} units)"
13361
13423
  ></ng-container>
13362
13424
  <div #instance class="k-chart-surface"></div>
13363
13425
  <kendo-sankey-tooltip-popup
13364
- [popupSettings]="popupSettings"
13365
- [tooltipUnitFormat]="messageFor('tooltipUnitFormat')"
13366
- >
13426
+ [popupSettings]="popupSettings"
13427
+ [tooltipUnitFormat]="messageFor('tooltipUnitFormat')"
13428
+ >
13367
13429
  </kendo-sankey-tooltip-popup>
13368
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark" [licenseMessage]="licenseMessage"></div>
13369
- `,
13430
+ @if (showLicenseWatermark) {
13431
+ <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
13432
+ }
13433
+ `,
13370
13434
  standalone: true,
13371
- imports: [LocalizedMessagesDirective, SankeyTooltipPopupComponent, NgIf, WatermarkOverlayComponent]
13435
+ imports: [LocalizedMessagesDirective, SankeyTooltipPopupComponent, WatermarkOverlayComponent]
13372
13436
  }]
13373
13437
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: ConfigurationService }, { type: SankeyThemeService }, { type: i1$1.LocalizationService }, { type: InstanceEventService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i3.IntlService }], propDecorators: { data: [{
13374
13438
  type: Input