@progress/kendo-angular-charts 18.1.0-develop.3 → 18.1.0-develop.30

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.
@@ -4,7 +4,7 @@
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import { ConfigurationService } from '../common/configuration.service';
6
6
  import { SettingsComponent } from '../common/settings.component';
7
- import { Border, LegendLabels, Margin, Padding, LegendMarkers, LegendInactiveItems, LegendItem, Legend, LegendTitle } from '../common/property-types';
7
+ import { Border, LegendLabels, Margin, Padding, LegendMarkers, LegendInactiveItems, LegendItem, Legend, LegendTitle, FocusHighlight } from '../common/property-types';
8
8
  import * as i0 from "@angular/core";
9
9
  /**
10
10
  * The configuration options of the Chart legend
@@ -77,7 +77,8 @@ export declare class LegendComponent extends SettingsComponent implements Legend
77
77
  inactiveItems: LegendInactiveItems;
78
78
  item: LegendItem;
79
79
  title: LegendTitle;
80
+ focusHighlight?: FocusHighlight;
80
81
  constructor(configurationService: ConfigurationService);
81
82
  static ɵfac: i0.ɵɵFactoryDeclaration<LegendComponent, never>;
82
- static ɵcmp: i0.ɵɵComponentDeclaration<LegendComponent, "kendo-chart-legend", never, { "align": { "alias": "align"; "required": false; }; "background": { "alias": "background"; "required": false; }; "border": { "alias": "border"; "required": false; }; "height": { "alias": "height"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "offsetX": { "alias": "offsetX"; "required": false; }; "offsetY": { "alias": "offsetY"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "position": { "alias": "position"; "required": false; }; "reverse": { "alias": "reverse"; "required": false; }; "visible": { "alias": "visible"; "required": false; }; "width": { "alias": "width"; "required": false; }; "markers": { "alias": "markers"; "required": false; }; "spacing": { "alias": "spacing"; "required": false; }; "inactiveItems": { "alias": "inactiveItems"; "required": false; }; "item": { "alias": "item"; "required": false; }; "title": { "alias": "title"; "required": false; }; }, {}, never, never, true, never>;
83
+ static ɵcmp: i0.ɵɵComponentDeclaration<LegendComponent, "kendo-chart-legend", never, { "align": { "alias": "align"; "required": false; }; "background": { "alias": "background"; "required": false; }; "border": { "alias": "border"; "required": false; }; "height": { "alias": "height"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "offsetX": { "alias": "offsetX"; "required": false; }; "offsetY": { "alias": "offsetY"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "position": { "alias": "position"; "required": false; }; "reverse": { "alias": "reverse"; "required": false; }; "visible": { "alias": "visible"; "required": false; }; "width": { "alias": "width"; "required": false; }; "markers": { "alias": "markers"; "required": false; }; "spacing": { "alias": "spacing"; "required": false; }; "inactiveItems": { "alias": "inactiveItems"; "required": false; }; "item": { "alias": "item"; "required": false; }; "title": { "alias": "title"; "required": false; }; "focusHighlight": { "alias": "focusHighlight"; "required": false; }; }, {}, never, never, true, never>;
83
84
  }
@@ -5,7 +5,7 @@
5
5
  import { ConfigurationService } from '../common/configuration.service';
6
6
  import { drawing } from '@progress/kendo-drawing';
7
7
  import { SettingsComponent } from '../common/settings.component';
8
- import { Border, Overlay, SeriesHighlight, SeriesStack, SeriesType, SeriesVisualArgs } from '../common/property-types';
8
+ import { Border, FocusHighlight, Overlay, SeriesHighlight, SeriesStack, SeriesType, SeriesVisualArgs } from '../common/property-types';
9
9
  import { SeriesDefaultsLabels, SeriesDefaultsNotes, SeriesDefaultsTooltip, SeriesDefaults } from '../common/property-types';
10
10
  import * as i0 from "@angular/core";
11
11
  /**
@@ -41,7 +41,8 @@ export declare class SeriesDefaultsComponent extends SettingsComponent implement
41
41
  labels: SeriesDefaultsLabels;
42
42
  notes: SeriesDefaultsNotes;
43
43
  tooltip: SeriesDefaultsTooltip;
44
+ focusHighlight?: FocusHighlight;
44
45
  constructor(configurationService: ConfigurationService);
45
46
  static ɵfac: i0.ɵɵFactoryDeclaration<SeriesDefaultsComponent, never>;
46
- static ɵcmp: i0.ɵɵComponentDeclaration<SeriesDefaultsComponent, "kendo-chart-series-defaults", never, { "border": { "alias": "border"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "highlight": { "alias": "highlight"; "required": false; }; "overlay": { "alias": "overlay"; "required": false; }; "spacing": { "alias": "spacing"; "required": false; }; "stack": { "alias": "stack"; "required": false; }; "type": { "alias": "type"; "required": false; }; "visual": { "alias": "visual"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "notes": { "alias": "notes"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; }, {}, never, never, true, never>;
47
+ static ɵcmp: i0.ɵɵComponentDeclaration<SeriesDefaultsComponent, "kendo-chart-series-defaults", never, { "border": { "alias": "border"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "highlight": { "alias": "highlight"; "required": false; }; "overlay": { "alias": "overlay"; "required": false; }; "spacing": { "alias": "spacing"; "required": false; }; "stack": { "alias": "stack"; "required": false; }; "type": { "alias": "type"; "required": false; }; "visual": { "alias": "visual"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "notes": { "alias": "notes"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "focusHighlight": { "alias": "focusHighlight"; "required": false; }; }, {}, never, never, true, never>;
47
48
  }
@@ -141,4 +141,4 @@ export { YAxisNotesLabel } from '../option-types/y-axis-item/notes.label.interfa
141
141
  export { YAxisTitle } from '../option-types/y-axis-item/title.interface';
142
142
  export { YAxis } from '../option-types/y-axis-item.interface';
143
143
  export { Zoomable } from '../option-types/zoomable.interface';
144
- export { type SeriesPattern, type VerticalStripesPattern, type CrosshatchPattern, type DiagonalStripesPattern, type GridPattern, type DotsPattern } from '@progress/kendo-charts';
144
+ export { type SeriesPattern, type VerticalStripesPattern, type CrosshatchPattern, type DiagonalStripesPattern, type GridPattern, type DotsPattern, type FocusHighlight, type FocusHighlightBorder } from '@progress/kendo-charts';
@@ -2,7 +2,6 @@
2
2
  * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { NgZone } from '@angular/core';
6
5
  import { ConfigurationService } from './configuration.service';
7
6
  import * as i0 from "@angular/core";
8
7
  /**
@@ -10,22 +9,12 @@ import * as i0 from "@angular/core";
10
9
  */
11
10
  export declare class ThemeService extends ConfigurationService {
12
11
  private loaded;
13
- private element;
14
- constructor(ngZone: NgZone);
12
+ protected element: HTMLElement;
15
13
  loadTheme(): void;
16
14
  reset(): void;
17
- private readTheme;
18
- private readDefaultTheme;
15
+ protected readTheme(): void;
19
16
  private createElement;
20
17
  private destroyElement;
21
- private setStyle;
22
- private setColors;
23
- private setInactiveOpacity;
24
- private setFonts;
25
- private setSeriesColors;
26
- private mapColor;
27
- private queryColor;
28
- private queryStyle;
29
18
  static ɵfac: i0.ɵɵFactoryDeclaration<ThemeService, never>;
30
19
  static ɵprov: i0.ɵɵInjectableDeclaration<ThemeService>;
31
20
  }
@@ -79,13 +79,14 @@ export class LegendComponent extends SettingsComponent {
79
79
  inactiveItems;
80
80
  item;
81
81
  title;
82
+ focusHighlight;
82
83
  constructor(configurationService) {
83
84
  super('legend', configurationService);
84
85
  this.configurationService = configurationService;
85
86
  this.markAsVisible();
86
87
  }
87
88
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LegendComponent, deps: [{ token: i1.ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
88
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LegendComponent, isStandalone: true, selector: "kendo-chart-legend", inputs: { align: "align", background: "background", border: "border", height: "height", labels: "labels", margin: "margin", offsetX: "offsetX", offsetY: "offsetY", orientation: "orientation", padding: "padding", position: "position", reverse: "reverse", visible: "visible", width: "width", markers: "markers", spacing: "spacing", inactiveItems: "inactiveItems", item: "item", title: "title" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
89
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LegendComponent, isStandalone: true, selector: "kendo-chart-legend", inputs: { align: "align", background: "background", border: "border", height: "height", labels: "labels", margin: "margin", offsetX: "offsetX", offsetY: "offsetY", orientation: "orientation", padding: "padding", position: "position", reverse: "reverse", visible: "visible", width: "width", markers: "markers", spacing: "spacing", inactiveItems: "inactiveItems", item: "item", title: "title", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
89
90
  }
90
91
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LegendComponent, decorators: [{
91
92
  type: Component,
@@ -133,4 +134,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
133
134
  type: Input
134
135
  }], title: [{
135
136
  type: Input
137
+ }], focusHighlight: [{
138
+ type: Input
136
139
  }] } });
@@ -41,12 +41,13 @@ export class SeriesDefaultsComponent extends SettingsComponent {
41
41
  labels;
42
42
  notes;
43
43
  tooltip;
44
+ focusHighlight;
44
45
  constructor(configurationService) {
45
46
  super('seriesDefaults', configurationService);
46
47
  this.configurationService = configurationService;
47
48
  }
48
49
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SeriesDefaultsComponent, deps: [{ token: i1.ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
49
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SeriesDefaultsComponent, isStandalone: true, selector: "kendo-chart-series-defaults", inputs: { border: "border", gap: "gap", highlight: "highlight", overlay: "overlay", spacing: "spacing", stack: "stack", type: "type", visual: "visual", labels: "labels", notes: "notes", tooltip: "tooltip" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
50
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SeriesDefaultsComponent, isStandalone: true, selector: "kendo-chart-series-defaults", inputs: { border: "border", gap: "gap", highlight: "highlight", overlay: "overlay", spacing: "spacing", stack: "stack", type: "type", visual: "visual", labels: "labels", notes: "notes", tooltip: "tooltip", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
50
51
  }
51
52
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SeriesDefaultsComponent, decorators: [{
52
53
  type: Component,
@@ -78,4 +79,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
78
79
  type: Input
79
80
  }], tooltip: [{
80
81
  type: Input
82
+ }], focusHighlight: [{
83
+ type: Input
81
84
  }] } });
@@ -2,94 +2,25 @@
2
2
  * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Injectable, NgZone } from '@angular/core';
5
+ import { Injectable } from '@angular/core';
6
6
  import { ConfigurationService } from './configuration.service';
7
- import { chartBaseTheme } from '@progress/kendo-charts';
7
+ import { chartBaseTheme, chartTheme, deepExtend } from '@progress/kendo-charts';
8
8
  import { chartDefaultTheme } from './chart-default-theme';
9
9
  import { isDocumentAvailable } from '@progress/kendo-angular-common';
10
10
  import * as i0 from "@angular/core";
11
- const font = (style) => `${style.fontWeight} ${style.fontSize} ${style.fontFamily}`;
12
- const computedBackgroundColor = (element) => window.getComputedStyle(element).backgroundColor;
13
- const letterPos = (letter) => letter.toLowerCase().charCodeAt(0) - 'a'.charCodeAt(0);
14
- const seriesPos = (name) => {
15
- const alpha = name.match(/series-([a-z])$/);
16
- if (alpha !== null) {
17
- return letterPos(alpha[1]);
18
- }
19
- const num = name.split('--series-')[1];
20
- return parseInt(num, 10) - 1;
21
- };
22
- const SERIES_COLORS = 30;
23
- const seriesTemplate = () => {
24
- let template = `
25
- <div class="k-var--series-a"></div>
26
- <div class="k-var--series-b"></div>
27
- <div class="k-var--series-c"></div>
28
- <div class="k-var--series-d"></div>
29
- <div class="k-var--series-e"></div>
30
- <div class="k-var--series-f"></div>
31
- `;
32
- for (let i = 0; i < SERIES_COLORS; i++) {
33
- template += `
34
- <div class="k-var--series-${i + 1}"></div>`;
35
- }
36
- return template;
37
- };
38
- const template = () => `
39
- <div class="k-var--primary"></div>
40
- <div class="k-var--primary-contrast"></div>
41
- <div class="k-var--base"></div>
42
- <div class="k-var--background"></div>
43
-
44
- <div class="k-var--kendo-color-subtle"></div>
45
-
46
- <div class="k-var--normal-background"></div>
47
- <div class="k-var--normal-text-color"></div>
48
- <div class="k-var--hover-background"></div>
49
- <div class="k-var--hover-text-color"></div>
50
- <div class="k-var--selected-background"></div>
51
- <div class="k-var--selected-text-color"></div>
52
- <div class="k-var--chart-error-bars-background"></div>
53
- <div class="k-var--chart-notes-background"></div>
54
- <div class="k-var--chart-notes-border"></div>
55
- <div class="k-var--chart-notes-lines"></div>
56
- <div class="k-var--chart-crosshair-background"></div>
57
-
58
- <div class="k-var--chart-inactive"></div>
59
- <div class="k-var--chart-major-lines"></div>
60
- <div class="k-var--chart-minor-lines"></div>
61
- <div class="k-var--chart-area-opacity"></div>
62
- <div class="k-var--chart-area-inactive-opacity"></div>
63
- <div class="k-var--chart-line-inactive-opacity"></div>
64
-
65
- <div class="k-widget k-chart">
66
- <div class="k-var--chart-font"></div>
67
- <div class="k-var--chart-title-font"></div>
68
- <div class="k-var--chart-pane-title-font"></div>
69
- <div class="k-var--chart-label-font"></div>
70
- </div>
71
-
72
- <div class="k-var--series-unset"></div>
73
- <div class="k-var--series">
74
- ${seriesTemplate()}
75
- </div>
76
- `;
77
11
  /**
78
12
  * @hidden
79
13
  */
80
14
  export class ThemeService extends ConfigurationService {
81
15
  loaded = false;
82
16
  element;
83
- constructor(ngZone) {
84
- super(ngZone);
85
- }
86
17
  loadTheme() {
87
18
  if (this.loaded || !isDocumentAvailable()) {
88
19
  return;
89
20
  }
90
- if (!this.readTheme()) {
91
- this.readDefaultTheme();
92
- }
21
+ this.createElement();
22
+ this.readTheme();
23
+ this.destroyElement();
93
24
  this.loaded = true;
94
25
  this.next();
95
26
  }
@@ -99,29 +30,21 @@ export class ThemeService extends ConfigurationService {
99
30
  this.loadTheme();
100
31
  }
101
32
  readTheme() {
102
- this.createElement();
103
- const available = this.queryColor('primary') !==
104
- this.queryColor('primary-contrast');
33
+ let theme = {};
105
34
  try {
106
- if (available) {
107
- this.push(chartBaseTheme());
108
- this.setColors();
109
- this.setFonts();
110
- this.setSeriesColors();
111
- }
35
+ theme = chartTheme(this.element);
112
36
  }
113
- finally {
114
- this.destroyElement();
37
+ catch {
38
+ theme = {};
115
39
  }
116
- return available;
117
- }
118
- readDefaultTheme() {
119
- this.push(chartDefaultTheme());
40
+ const available = Boolean(theme.chartArea && theme.chartArea.background);
41
+ const result = available ? deepExtend(chartBaseTheme(), theme) : chartDefaultTheme();
42
+ this.push(result);
120
43
  }
121
44
  createElement() {
122
45
  const container = this.element = document.createElement('div');
46
+ container.className = 'k-chart';
123
47
  container.style.display = 'none';
124
- container.innerHTML = template();
125
48
  document.body.appendChild(container);
126
49
  }
127
50
  destroyElement() {
@@ -130,113 +53,7 @@ export class ThemeService extends ConfigurationService {
130
53
  this.element = undefined;
131
54
  }
132
55
  }
133
- setStyle(key, value) {
134
- this.set(key, value);
135
- }
136
- setColors() {
137
- this.mapColor('axisDefaults.crosshair.color', 'chart-crosshair-background');
138
- this.mapColor('axisDefaults.labels.color', 'normal-text-color');
139
- this.mapColor('axisDefaults.line.color', 'chart-major-lines');
140
- this.mapColor('axisDefaults.majorGridLines.color', 'chart-major-lines');
141
- this.mapColor('axisDefaults.minorGridLines.color', 'chart-minor-lines');
142
- this.mapColor('axisDefaults.notes.icon.background', 'chart-notes-background');
143
- this.mapColor('axisDefaults.notes.icon.border.color', 'chart-notes-border');
144
- this.mapColor('axisDefaults.notes.line.color', 'chart-notes-lines');
145
- this.mapColor('axisDefaults.title.color', 'normal-text-color');
146
- this.mapColor('chartArea.background', 'background');
147
- this.mapColor('legend.inactiveItems.labels.color', 'chart-inactive');
148
- this.mapColor('legend.inactiveItems.markers.color', 'chart-inactive');
149
- this.mapColor('legend.labels.color', 'normal-text-color');
150
- this.mapColor('legend.title.color', 'normal-text-color');
151
- this.mapColor('seriesDefaults.boxPlot.downColor', 'chart-major-lines');
152
- this.mapColor('seriesDefaults.boxPlot.mean.color', 'base');
153
- this.mapColor('seriesDefaults.boxPlot.median.color', 'base');
154
- this.mapColor('seriesDefaults.boxPlot.whiskers.color', 'primary');
155
- this.mapColor('seriesDefaults.bullet.target.color', 'normal-text-color');
156
- this.mapColor('seriesDefaults.candlestick.downColor', 'normal-text-color');
157
- this.mapColor('seriesDefaults.candlestick.line.color', 'normal-text-color');
158
- this.mapColor('seriesDefaults.errorBars.color', 'chart-error-bars-background');
159
- this.mapColor('seriesDefaults.horizontalWaterfall.line.color', 'chart-major-lines');
160
- this.mapColor('seriesDefaults.icon.border.color', 'chart-major-lines');
161
- this.mapColor('seriesDefaults.labels.background', 'background');
162
- this.mapColor('seriesDefaults.labels.color', 'normal-text-color');
163
- this.mapColor('seriesDefaults.notes.icon.background', 'chart-notes-background');
164
- this.mapColor('seriesDefaults.notes.icon.border.color', 'chart-notes-border');
165
- this.mapColor('seriesDefaults.notes.line.color', 'chart-notes-lines');
166
- this.mapColor('seriesDefaults.verticalBoxPlot.downColor', 'chart-major-lines');
167
- this.mapColor('seriesDefaults.verticalBoxPlot.mean.color', 'base');
168
- this.mapColor('seriesDefaults.verticalBoxPlot.median.color', 'base');
169
- this.mapColor('seriesDefaults.verticalBoxPlot.whiskers.color', 'primary');
170
- this.mapColor('seriesDefaults.verticalBullet.target.color', 'normal-text-color');
171
- this.mapColor('seriesDefaults.waterfall.line.color', 'chart-major-lines');
172
- this.mapColor('title.color', 'normal-text-color');
173
- this.mapColor('subtitle.color', 'normal-text-color');
174
- // Sankey diagram
175
- this.mapColor('labels.color', 'normal-text-color');
176
- this.mapColor('labels.stroke.color', 'background');
177
- // 'k-var--kendo-color-subtle' class does not contain the --kendo-color-subtle variable style
178
- const element = this.element?.querySelector('.k-var--kendo-color-subtle');
179
- element && (element.style.color = 'var(--kendo-color-subtle)');
180
- this.mapColor('links.color', 'kendo-color-subtle', 'color');
181
- const opacity = parseFloat(this.queryStyle('chart-area-opacity').opacity);
182
- if (!isNaN(opacity)) {
183
- this.setStyle('seriesDefaults.area.opacity', opacity);
184
- this.setStyle('seriesDefaults.radarArea.opacity', opacity);
185
- this.setStyle('seriesDefaults.verticalArea.opacity', opacity);
186
- this.setStyle('seriesDefaults.labels.opacity', opacity);
187
- }
188
- this.setInactiveOpacity(['area', 'verticalArea'], 'chart-area-inactive-opacity');
189
- this.setInactiveOpacity(['line', 'verticalLine'], 'chart-line-inactive-opacity');
190
- }
191
- setInactiveOpacity(seriesTypes, selector) {
192
- const inactiveOpacity = parseFloat(this.queryStyle(selector).opacity);
193
- if (!isNaN(inactiveOpacity) && inactiveOpacity < 1) {
194
- seriesTypes.forEach(type => this.setStyle(`seriesDefaults.${type}.highlight.inactiveOpacity`, inactiveOpacity));
195
- }
196
- }
197
- setFonts() {
198
- const defaultFont = font(this.queryStyle('chart-font'));
199
- const titleFont = font(this.queryStyle('chart-title-font'));
200
- const paneTitleFont = font(this.queryStyle('chart-pane-title-font'));
201
- const labelFont = font(this.queryStyle('chart-label-font'));
202
- this.setStyle('axisDefaults.labels.font', labelFont);
203
- this.setStyle('axisDefaults.notes.label.font', defaultFont);
204
- this.setStyle('axisDefaults.title.font', defaultFont);
205
- this.setStyle('legend.labels.font', defaultFont);
206
- this.setStyle('seriesDefaults.labels.font', labelFont);
207
- this.setStyle('seriesDefaults.notes.label.font', defaultFont);
208
- this.setStyle('title.font', titleFont);
209
- this.setStyle('subtitle.font', paneTitleFont);
210
- this.setStyle('paneDefaults.title.font', paneTitleFont);
211
- // Sankey diagram
212
- this.setStyle('labels.font', defaultFont);
213
- }
214
- setSeriesColors() {
215
- const element = this.element;
216
- const series = [].slice.call(element.querySelectorAll('.k-var--series div'));
217
- const unsetColor = computedBackgroundColor(element.querySelector('.k-var--series-unset'));
218
- const seriesColors = series.reduce((arr, el) => {
219
- const pos = seriesPos(el.className);
220
- const color = computedBackgroundColor(el);
221
- if (color !== unsetColor) {
222
- arr[pos] = color;
223
- }
224
- return arr;
225
- }, [] // Will populate the series colors in this array
226
- );
227
- this.setStyle('seriesColors', seriesColors);
228
- }
229
- mapColor(key, varName, styleKey = 'backgroundColor') {
230
- this.setStyle(key, this.queryStyle(varName)[styleKey]);
231
- }
232
- queryColor(varName) {
233
- return this.queryStyle(varName).backgroundColor;
234
- }
235
- queryStyle(varName) {
236
- const element = this.element.querySelector(`.k-var--${varName}`);
237
- return window.getComputedStyle(element);
238
- }
239
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
56
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
240
57
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, providedIn: 'root' });
241
58
  }
242
59
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, decorators: [{
@@ -244,4 +61,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
244
61
  args: [{
245
62
  providedIn: 'root'
246
63
  }]
247
- }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
64
+ }] });
@@ -10,7 +10,7 @@ export const packageMetadata = {
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCode: 'KENDOUIANGULAR',
12
12
  productCodes: ['KENDOUIANGULAR'],
13
- publishDate: 1738245977,
14
- version: '18.1.0-develop.3',
13
+ publishDate: 1738962226,
14
+ version: '18.1.0-develop.30',
15
15
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
16
16
  };
@@ -17,12 +17,13 @@ export class SankeyLinksComponent extends SettingsComponent {
17
17
  color;
18
18
  opacity;
19
19
  highlight;
20
+ focusHighlight;
20
21
  constructor(configurationService) {
21
22
  super('links', configurationService);
22
23
  this.configurationService = configurationService;
23
24
  }
24
25
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyLinksComponent, deps: [{ token: i1.ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
25
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyLinksComponent, isStandalone: true, selector: "kendo-sankey-links", inputs: { colorType: "colorType", color: "color", opacity: "opacity", highlight: "highlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
26
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyLinksComponent, isStandalone: true, selector: "kendo-sankey-links", inputs: { colorType: "colorType", color: "color", opacity: "opacity", highlight: "highlight", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
26
27
  }
27
28
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyLinksComponent, decorators: [{
28
29
  type: Component,
@@ -40,4 +41,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
40
41
  type: Input
41
42
  }], highlight: [{
42
43
  type: Input
44
+ }], focusHighlight: [{
45
+ type: Input
43
46
  }] } });
@@ -29,12 +29,13 @@ export class SankeyNodesComponent extends SettingsComponent {
29
29
  padding;
30
30
  width;
31
31
  align;
32
+ focusHighlight;
32
33
  constructor(configurationService) {
33
34
  super('nodes', configurationService);
34
35
  this.configurationService = configurationService;
35
36
  }
36
37
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyNodesComponent, deps: [{ token: i1.ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
37
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyNodesComponent, isStandalone: true, selector: "kendo-sankey-nodes", inputs: { colorType: "colorType", color: "color", opacity: "opacity", offset: "offset", padding: "padding", width: "width", align: "align" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
38
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyNodesComponent, isStandalone: true, selector: "kendo-sankey-nodes", inputs: { colorType: "colorType", color: "color", opacity: "opacity", offset: "offset", padding: "padding", width: "width", align: "align", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
38
39
  }
39
40
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyNodesComponent, decorators: [{
40
41
  type: Component,
@@ -58,4 +59,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
58
59
  type: Input
59
60
  }], align: [{
60
61
  type: Input
62
+ }], focusHighlight: [{
63
+ type: Input
61
64
  }] } });
@@ -0,0 +1,25 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import { Injectable } from '@angular/core';
6
+ import { sankeyTheme } from '@progress/kendo-charts';
7
+ import { ThemeService } from '../common/theme.service';
8
+ import * as i0 from "@angular/core";
9
+ /**
10
+ * @hidden
11
+ */
12
+ export class SankeyThemeService extends ThemeService {
13
+ readTheme() {
14
+ const theme = sankeyTheme(this.element);
15
+ this.push(theme);
16
+ }
17
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyThemeService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
18
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyThemeService, providedIn: 'root' });
19
+ }
20
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyThemeService, decorators: [{
21
+ type: Injectable,
22
+ args: [{
23
+ providedIn: 'root'
24
+ }]
25
+ }] });
@@ -11,7 +11,7 @@ import { combineLatest } from 'rxjs';
11
11
  import { auditTime, tap } from 'rxjs/operators';
12
12
  import { ConfigurationService, THROTTLE_MS } from './common/configuration.service';
13
13
  import { copyChanges } from './common/copy-changes';
14
- import { ThemeService } from './common/theme.service';
14
+ import { SankeyThemeService } from './sankey/theme.service';
15
15
  import { toSimpleChanges } from './common/to-simple-changes';
16
16
  import { packageMetadata } from './package-metadata';
17
17
  import { InstanceEventService } from './sankey/events';
@@ -24,7 +24,7 @@ import { LocalizedMessagesDirective } from './sankey/localization/localized-mess
24
24
  import { IntlService } from '@progress/kendo-angular-intl';
25
25
  import * as i0 from "@angular/core";
26
26
  import * as i1 from "./common/configuration.service";
27
- import * as i2 from "./common/theme.service";
27
+ import * as i2 from "./sankey/theme.service";
28
28
  import * as i3 from "@progress/kendo-angular-l10n";
29
29
  import * as i4 from "./sankey/events";
30
30
  import * as i5 from "@progress/kendo-angular-intl";
@@ -324,19 +324,13 @@ export class SankeyComponent {
324
324
  this.optionsChange = combineLatest([this.configurationService.onChange$, this.themeService.onChange$])
325
325
  .pipe(tap((result) => {
326
326
  this.options = result[0];
327
- this.theme = this.loadTheme(result[1]);
327
+ this.theme = result[1];
328
328
  }), auditTime(THROTTLE_MS))
329
329
  .subscribe(() => {
330
330
  this.refresh();
331
331
  });
332
332
  });
333
333
  }
334
- loadTheme(chartTheme) {
335
- return {
336
- ...chartTheme,
337
- nodeColors: chartTheme.seriesColors,
338
- };
339
- }
340
334
  run(callback, inZone = true, detectChanges) {
341
335
  if (inZone) {
342
336
  if (detectChanges) {
@@ -375,7 +369,7 @@ export class SankeyComponent {
375
369
  get isRTL() {
376
370
  return Boolean(this.localizationService.rtl);
377
371
  }
378
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyComponent, deps: [{ token: i0.ElementRef }, { token: i1.ConfigurationService }, { token: i2.ThemeService }, { token: i3.LocalizationService }, { token: i4.InstanceEventService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i5.IntlService }], target: i0.ɵɵFactoryTarget.Component });
372
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyComponent, deps: [{ token: i0.ElementRef }, { token: i1.ConfigurationService }, { token: i2.SankeyThemeService }, { token: i3.LocalizationService }, { token: i4.InstanceEventService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i5.IntlService }], target: i0.ɵɵFactoryTarget.Component });
379
373
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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: [
380
374
  ConfigurationService,
381
375
  LocalizationService,
@@ -433,7 +427,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
433
427
  standalone: true,
434
428
  imports: [LocalizedMessagesDirective, SankeyTooltipPopupComponent, NgIf, WatermarkOverlayComponent]
435
429
  }]
436
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.ConfigurationService }, { type: i2.ThemeService }, { type: i3.LocalizationService }, { type: i4.InstanceEventService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i5.IntlService }]; }, propDecorators: { data: [{
430
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.ConfigurationService }, { type: i2.SankeyThemeService }, { type: i3.LocalizationService }, { type: i4.InstanceEventService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i5.IntlService }]; }, propDecorators: { data: [{
437
431
  type: Input
438
432
  }], links: [{
439
433
  type: Input
@@ -8,7 +8,7 @@ import { isDocumentAvailable, shouldShowValidationUI, ResizeSensorComponent, Wat
8
8
  import * as i3 from '@progress/kendo-angular-intl';
9
9
  import * as i1$1 from '@progress/kendo-angular-l10n';
10
10
  import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
11
- import { DateCategoryAxis, DateValueAxis, InstanceObserver, chartBaseTheme, Chart, StockChart, Sparkline, Sankey, createSankeyData } from '@progress/kendo-charts';
11
+ import { DateCategoryAxis, DateValueAxis, InstanceObserver, chartBaseTheme, chartTheme, deepExtend, Chart, StockChart, Sparkline, sankeyTheme, Sankey, createSankeyData } from '@progress/kendo-charts';
12
12
  import { exportImage, exportSVG } from '@progress/kendo-drawing';
13
13
  import { validatePackage } from '@progress/kendo-licensing';
14
14
  import { Subject, BehaviorSubject, combineLatest, Subscription } from 'rxjs';
@@ -1937,88 +1937,19 @@ const chartDefaultTheme = () => Object.assign({}, chartBaseTheme(), {
1937
1937
  ]
1938
1938
  });
1939
1939
 
1940
- const font = (style) => `${style.fontWeight} ${style.fontSize} ${style.fontFamily}`;
1941
- const computedBackgroundColor = (element) => window.getComputedStyle(element).backgroundColor;
1942
- const letterPos = (letter) => letter.toLowerCase().charCodeAt(0) - 'a'.charCodeAt(0);
1943
- const seriesPos = (name) => {
1944
- const alpha = name.match(/series-([a-z])$/);
1945
- if (alpha !== null) {
1946
- return letterPos(alpha[1]);
1947
- }
1948
- const num = name.split('--series-')[1];
1949
- return parseInt(num, 10) - 1;
1950
- };
1951
- const SERIES_COLORS = 30;
1952
- const seriesTemplate = () => {
1953
- let template = `
1954
- <div class="k-var--series-a"></div>
1955
- <div class="k-var--series-b"></div>
1956
- <div class="k-var--series-c"></div>
1957
- <div class="k-var--series-d"></div>
1958
- <div class="k-var--series-e"></div>
1959
- <div class="k-var--series-f"></div>
1960
- `;
1961
- for (let i = 0; i < SERIES_COLORS; i++) {
1962
- template += `
1963
- <div class="k-var--series-${i + 1}"></div>`;
1964
- }
1965
- return template;
1966
- };
1967
- const template = () => `
1968
- <div class="k-var--primary"></div>
1969
- <div class="k-var--primary-contrast"></div>
1970
- <div class="k-var--base"></div>
1971
- <div class="k-var--background"></div>
1972
-
1973
- <div class="k-var--kendo-color-subtle"></div>
1974
-
1975
- <div class="k-var--normal-background"></div>
1976
- <div class="k-var--normal-text-color"></div>
1977
- <div class="k-var--hover-background"></div>
1978
- <div class="k-var--hover-text-color"></div>
1979
- <div class="k-var--selected-background"></div>
1980
- <div class="k-var--selected-text-color"></div>
1981
- <div class="k-var--chart-error-bars-background"></div>
1982
- <div class="k-var--chart-notes-background"></div>
1983
- <div class="k-var--chart-notes-border"></div>
1984
- <div class="k-var--chart-notes-lines"></div>
1985
- <div class="k-var--chart-crosshair-background"></div>
1986
-
1987
- <div class="k-var--chart-inactive"></div>
1988
- <div class="k-var--chart-major-lines"></div>
1989
- <div class="k-var--chart-minor-lines"></div>
1990
- <div class="k-var--chart-area-opacity"></div>
1991
- <div class="k-var--chart-area-inactive-opacity"></div>
1992
- <div class="k-var--chart-line-inactive-opacity"></div>
1993
-
1994
- <div class="k-widget k-chart">
1995
- <div class="k-var--chart-font"></div>
1996
- <div class="k-var--chart-title-font"></div>
1997
- <div class="k-var--chart-pane-title-font"></div>
1998
- <div class="k-var--chart-label-font"></div>
1999
- </div>
2000
-
2001
- <div class="k-var--series-unset"></div>
2002
- <div class="k-var--series">
2003
- ${seriesTemplate()}
2004
- </div>
2005
- `;
2006
1940
  /**
2007
1941
  * @hidden
2008
1942
  */
2009
1943
  class ThemeService extends ConfigurationService {
2010
1944
  loaded = false;
2011
1945
  element;
2012
- constructor(ngZone) {
2013
- super(ngZone);
2014
- }
2015
1946
  loadTheme() {
2016
1947
  if (this.loaded || !isDocumentAvailable()) {
2017
1948
  return;
2018
1949
  }
2019
- if (!this.readTheme()) {
2020
- this.readDefaultTheme();
2021
- }
1950
+ this.createElement();
1951
+ this.readTheme();
1952
+ this.destroyElement();
2022
1953
  this.loaded = true;
2023
1954
  this.next();
2024
1955
  }
@@ -2028,29 +1959,21 @@ class ThemeService extends ConfigurationService {
2028
1959
  this.loadTheme();
2029
1960
  }
2030
1961
  readTheme() {
2031
- this.createElement();
2032
- const available = this.queryColor('primary') !==
2033
- this.queryColor('primary-contrast');
1962
+ let theme = {};
2034
1963
  try {
2035
- if (available) {
2036
- this.push(chartBaseTheme());
2037
- this.setColors();
2038
- this.setFonts();
2039
- this.setSeriesColors();
2040
- }
1964
+ theme = chartTheme(this.element);
2041
1965
  }
2042
- finally {
2043
- this.destroyElement();
1966
+ catch {
1967
+ theme = {};
2044
1968
  }
2045
- return available;
2046
- }
2047
- readDefaultTheme() {
2048
- this.push(chartDefaultTheme());
1969
+ const available = Boolean(theme.chartArea && theme.chartArea.background);
1970
+ const result = available ? deepExtend(chartBaseTheme(), theme) : chartDefaultTheme();
1971
+ this.push(result);
2049
1972
  }
2050
1973
  createElement() {
2051
1974
  const container = this.element = document.createElement('div');
1975
+ container.className = 'k-chart';
2052
1976
  container.style.display = 'none';
2053
- container.innerHTML = template();
2054
1977
  document.body.appendChild(container);
2055
1978
  }
2056
1979
  destroyElement() {
@@ -2059,113 +1982,7 @@ class ThemeService extends ConfigurationService {
2059
1982
  this.element = undefined;
2060
1983
  }
2061
1984
  }
2062
- setStyle(key, value) {
2063
- this.set(key, value);
2064
- }
2065
- setColors() {
2066
- this.mapColor('axisDefaults.crosshair.color', 'chart-crosshair-background');
2067
- this.mapColor('axisDefaults.labels.color', 'normal-text-color');
2068
- this.mapColor('axisDefaults.line.color', 'chart-major-lines');
2069
- this.mapColor('axisDefaults.majorGridLines.color', 'chart-major-lines');
2070
- this.mapColor('axisDefaults.minorGridLines.color', 'chart-minor-lines');
2071
- this.mapColor('axisDefaults.notes.icon.background', 'chart-notes-background');
2072
- this.mapColor('axisDefaults.notes.icon.border.color', 'chart-notes-border');
2073
- this.mapColor('axisDefaults.notes.line.color', 'chart-notes-lines');
2074
- this.mapColor('axisDefaults.title.color', 'normal-text-color');
2075
- this.mapColor('chartArea.background', 'background');
2076
- this.mapColor('legend.inactiveItems.labels.color', 'chart-inactive');
2077
- this.mapColor('legend.inactiveItems.markers.color', 'chart-inactive');
2078
- this.mapColor('legend.labels.color', 'normal-text-color');
2079
- this.mapColor('legend.title.color', 'normal-text-color');
2080
- this.mapColor('seriesDefaults.boxPlot.downColor', 'chart-major-lines');
2081
- this.mapColor('seriesDefaults.boxPlot.mean.color', 'base');
2082
- this.mapColor('seriesDefaults.boxPlot.median.color', 'base');
2083
- this.mapColor('seriesDefaults.boxPlot.whiskers.color', 'primary');
2084
- this.mapColor('seriesDefaults.bullet.target.color', 'normal-text-color');
2085
- this.mapColor('seriesDefaults.candlestick.downColor', 'normal-text-color');
2086
- this.mapColor('seriesDefaults.candlestick.line.color', 'normal-text-color');
2087
- this.mapColor('seriesDefaults.errorBars.color', 'chart-error-bars-background');
2088
- this.mapColor('seriesDefaults.horizontalWaterfall.line.color', 'chart-major-lines');
2089
- this.mapColor('seriesDefaults.icon.border.color', 'chart-major-lines');
2090
- this.mapColor('seriesDefaults.labels.background', 'background');
2091
- this.mapColor('seriesDefaults.labels.color', 'normal-text-color');
2092
- this.mapColor('seriesDefaults.notes.icon.background', 'chart-notes-background');
2093
- this.mapColor('seriesDefaults.notes.icon.border.color', 'chart-notes-border');
2094
- this.mapColor('seriesDefaults.notes.line.color', 'chart-notes-lines');
2095
- this.mapColor('seriesDefaults.verticalBoxPlot.downColor', 'chart-major-lines');
2096
- this.mapColor('seriesDefaults.verticalBoxPlot.mean.color', 'base');
2097
- this.mapColor('seriesDefaults.verticalBoxPlot.median.color', 'base');
2098
- this.mapColor('seriesDefaults.verticalBoxPlot.whiskers.color', 'primary');
2099
- this.mapColor('seriesDefaults.verticalBullet.target.color', 'normal-text-color');
2100
- this.mapColor('seriesDefaults.waterfall.line.color', 'chart-major-lines');
2101
- this.mapColor('title.color', 'normal-text-color');
2102
- this.mapColor('subtitle.color', 'normal-text-color');
2103
- // Sankey diagram
2104
- this.mapColor('labels.color', 'normal-text-color');
2105
- this.mapColor('labels.stroke.color', 'background');
2106
- // 'k-var--kendo-color-subtle' class does not contain the --kendo-color-subtle variable style
2107
- const element = this.element?.querySelector('.k-var--kendo-color-subtle');
2108
- element && (element.style.color = 'var(--kendo-color-subtle)');
2109
- this.mapColor('links.color', 'kendo-color-subtle', 'color');
2110
- const opacity = parseFloat(this.queryStyle('chart-area-opacity').opacity);
2111
- if (!isNaN(opacity)) {
2112
- this.setStyle('seriesDefaults.area.opacity', opacity);
2113
- this.setStyle('seriesDefaults.radarArea.opacity', opacity);
2114
- this.setStyle('seriesDefaults.verticalArea.opacity', opacity);
2115
- this.setStyle('seriesDefaults.labels.opacity', opacity);
2116
- }
2117
- this.setInactiveOpacity(['area', 'verticalArea'], 'chart-area-inactive-opacity');
2118
- this.setInactiveOpacity(['line', 'verticalLine'], 'chart-line-inactive-opacity');
2119
- }
2120
- setInactiveOpacity(seriesTypes, selector) {
2121
- const inactiveOpacity = parseFloat(this.queryStyle(selector).opacity);
2122
- if (!isNaN(inactiveOpacity) && inactiveOpacity < 1) {
2123
- seriesTypes.forEach(type => this.setStyle(`seriesDefaults.${type}.highlight.inactiveOpacity`, inactiveOpacity));
2124
- }
2125
- }
2126
- setFonts() {
2127
- const defaultFont = font(this.queryStyle('chart-font'));
2128
- const titleFont = font(this.queryStyle('chart-title-font'));
2129
- const paneTitleFont = font(this.queryStyle('chart-pane-title-font'));
2130
- const labelFont = font(this.queryStyle('chart-label-font'));
2131
- this.setStyle('axisDefaults.labels.font', labelFont);
2132
- this.setStyle('axisDefaults.notes.label.font', defaultFont);
2133
- this.setStyle('axisDefaults.title.font', defaultFont);
2134
- this.setStyle('legend.labels.font', defaultFont);
2135
- this.setStyle('seriesDefaults.labels.font', labelFont);
2136
- this.setStyle('seriesDefaults.notes.label.font', defaultFont);
2137
- this.setStyle('title.font', titleFont);
2138
- this.setStyle('subtitle.font', paneTitleFont);
2139
- this.setStyle('paneDefaults.title.font', paneTitleFont);
2140
- // Sankey diagram
2141
- this.setStyle('labels.font', defaultFont);
2142
- }
2143
- setSeriesColors() {
2144
- const element = this.element;
2145
- const series = [].slice.call(element.querySelectorAll('.k-var--series div'));
2146
- const unsetColor = computedBackgroundColor(element.querySelector('.k-var--series-unset'));
2147
- const seriesColors = series.reduce((arr, el) => {
2148
- const pos = seriesPos(el.className);
2149
- const color = computedBackgroundColor(el);
2150
- if (color !== unsetColor) {
2151
- arr[pos] = color;
2152
- }
2153
- return arr;
2154
- }, [] // Will populate the series colors in this array
2155
- );
2156
- this.setStyle('seriesColors', seriesColors);
2157
- }
2158
- mapColor(key, varName, styleKey = 'backgroundColor') {
2159
- this.setStyle(key, this.queryStyle(varName)[styleKey]);
2160
- }
2161
- queryColor(varName) {
2162
- return this.queryStyle(varName).backgroundColor;
2163
- }
2164
- queryStyle(varName) {
2165
- const element = this.element.querySelector(`.k-var--${varName}`);
2166
- return window.getComputedStyle(element);
2167
- }
2168
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
1985
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
2169
1986
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, providedIn: 'root' });
2170
1987
  }
2171
1988
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ThemeService, decorators: [{
@@ -2173,7 +1990,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2173
1990
  args: [{
2174
1991
  providedIn: 'root'
2175
1992
  }]
2176
- }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
1993
+ }] });
2177
1994
 
2178
1995
  /**
2179
1996
  * @hidden
@@ -2909,8 +2726,8 @@ const packageMetadata = {
2909
2726
  productName: 'Kendo UI for Angular',
2910
2727
  productCode: 'KENDOUIANGULAR',
2911
2728
  productCodes: ['KENDOUIANGULAR'],
2912
- publishDate: 1738245977,
2913
- version: '18.1.0-develop.3',
2729
+ publishDate: 1738962226,
2730
+ version: '18.1.0-develop.30',
2914
2731
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
2915
2732
  };
2916
2733
 
@@ -8745,13 +8562,14 @@ class LegendComponent extends SettingsComponent {
8745
8562
  inactiveItems;
8746
8563
  item;
8747
8564
  title;
8565
+ focusHighlight;
8748
8566
  constructor(configurationService) {
8749
8567
  super('legend', configurationService);
8750
8568
  this.configurationService = configurationService;
8751
8569
  this.markAsVisible();
8752
8570
  }
8753
8571
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LegendComponent, deps: [{ token: ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
8754
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LegendComponent, isStandalone: true, selector: "kendo-chart-legend", inputs: { align: "align", background: "background", border: "border", height: "height", labels: "labels", margin: "margin", offsetX: "offsetX", offsetY: "offsetY", orientation: "orientation", padding: "padding", position: "position", reverse: "reverse", visible: "visible", width: "width", markers: "markers", spacing: "spacing", inactiveItems: "inactiveItems", item: "item", title: "title" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
8572
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LegendComponent, isStandalone: true, selector: "kendo-chart-legend", inputs: { align: "align", background: "background", border: "border", height: "height", labels: "labels", margin: "margin", offsetX: "offsetX", offsetY: "offsetY", orientation: "orientation", padding: "padding", position: "position", reverse: "reverse", visible: "visible", width: "width", markers: "markers", spacing: "spacing", inactiveItems: "inactiveItems", item: "item", title: "title", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
8755
8573
  }
8756
8574
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LegendComponent, decorators: [{
8757
8575
  type: Component,
@@ -8799,6 +8617,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
8799
8617
  type: Input
8800
8618
  }], title: [{
8801
8619
  type: Input
8620
+ }], focusHighlight: [{
8621
+ type: Input
8802
8622
  }] } });
8803
8623
 
8804
8624
  /**
@@ -9136,12 +8956,13 @@ class SeriesDefaultsComponent extends SettingsComponent {
9136
8956
  labels;
9137
8957
  notes;
9138
8958
  tooltip;
8959
+ focusHighlight;
9139
8960
  constructor(configurationService) {
9140
8961
  super('seriesDefaults', configurationService);
9141
8962
  this.configurationService = configurationService;
9142
8963
  }
9143
8964
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SeriesDefaultsComponent, deps: [{ token: ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
9144
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SeriesDefaultsComponent, isStandalone: true, selector: "kendo-chart-series-defaults", inputs: { border: "border", gap: "gap", highlight: "highlight", overlay: "overlay", spacing: "spacing", stack: "stack", type: "type", visual: "visual", labels: "labels", notes: "notes", tooltip: "tooltip" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
8965
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SeriesDefaultsComponent, isStandalone: true, selector: "kendo-chart-series-defaults", inputs: { border: "border", gap: "gap", highlight: "highlight", overlay: "overlay", spacing: "spacing", stack: "stack", type: "type", visual: "visual", labels: "labels", notes: "notes", tooltip: "tooltip", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
9145
8966
  }
9146
8967
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SeriesDefaultsComponent, decorators: [{
9147
8968
  type: Component,
@@ -9173,6 +8994,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
9173
8994
  type: Input
9174
8995
  }], tooltip: [{
9175
8996
  type: Input
8997
+ }], focusHighlight: [{
8998
+ type: Input
9176
8999
  }] } });
9177
9000
 
9178
9001
  /**
@@ -10648,6 +10471,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
10648
10471
  args: ['breadcrumb', { static: true }]
10649
10472
  }] } });
10650
10473
 
10474
+ /**
10475
+ * @hidden
10476
+ */
10477
+ class SankeyThemeService extends ThemeService {
10478
+ readTheme() {
10479
+ const theme = sankeyTheme(this.element);
10480
+ this.push(theme);
10481
+ }
10482
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyThemeService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
10483
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyThemeService, providedIn: 'root' });
10484
+ }
10485
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyThemeService, decorators: [{
10486
+ type: Injectable,
10487
+ args: [{
10488
+ providedIn: 'root'
10489
+ }]
10490
+ }] });
10491
+
10651
10492
  /**
10652
10493
  * @hidden
10653
10494
  */
@@ -11541,19 +11382,13 @@ class SankeyComponent {
11541
11382
  this.optionsChange = combineLatest([this.configurationService.onChange$, this.themeService.onChange$])
11542
11383
  .pipe(tap((result) => {
11543
11384
  this.options = result[0];
11544
- this.theme = this.loadTheme(result[1]);
11385
+ this.theme = result[1];
11545
11386
  }), auditTime(THROTTLE_MS))
11546
11387
  .subscribe(() => {
11547
11388
  this.refresh();
11548
11389
  });
11549
11390
  });
11550
11391
  }
11551
- loadTheme(chartTheme) {
11552
- return {
11553
- ...chartTheme,
11554
- nodeColors: chartTheme.seriesColors,
11555
- };
11556
- }
11557
11392
  run(callback, inZone = true, detectChanges) {
11558
11393
  if (inZone) {
11559
11394
  if (detectChanges) {
@@ -11592,7 +11427,7 @@ class SankeyComponent {
11592
11427
  get isRTL() {
11593
11428
  return Boolean(this.localizationService.rtl);
11594
11429
  }
11595
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyComponent, deps: [{ token: i0.ElementRef }, { token: ConfigurationService }, { token: ThemeService }, { token: i1$1.LocalizationService }, { token: InstanceEventService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i3.IntlService }], target: i0.ɵɵFactoryTarget.Component });
11430
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", 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 });
11596
11431
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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: [
11597
11432
  ConfigurationService,
11598
11433
  LocalizationService,
@@ -11650,7 +11485,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
11650
11485
  standalone: true,
11651
11486
  imports: [LocalizedMessagesDirective, SankeyTooltipPopupComponent, NgIf, WatermarkOverlayComponent]
11652
11487
  }]
11653
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: ConfigurationService }, { type: ThemeService }, { type: i1$1.LocalizationService }, { type: InstanceEventService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i3.IntlService }]; }, propDecorators: { data: [{
11488
+ }], ctorParameters: function () { return [{ 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: [{
11654
11489
  type: Input
11655
11490
  }], links: [{
11656
11491
  type: Input
@@ -11960,12 +11795,13 @@ class SankeyLinksComponent extends SettingsComponent {
11960
11795
  color;
11961
11796
  opacity;
11962
11797
  highlight;
11798
+ focusHighlight;
11963
11799
  constructor(configurationService) {
11964
11800
  super('links', configurationService);
11965
11801
  this.configurationService = configurationService;
11966
11802
  }
11967
11803
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyLinksComponent, deps: [{ token: ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
11968
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyLinksComponent, isStandalone: true, selector: "kendo-sankey-links", inputs: { colorType: "colorType", color: "color", opacity: "opacity", highlight: "highlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
11804
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyLinksComponent, isStandalone: true, selector: "kendo-sankey-links", inputs: { colorType: "colorType", color: "color", opacity: "opacity", highlight: "highlight", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
11969
11805
  }
11970
11806
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyLinksComponent, decorators: [{
11971
11807
  type: Component,
@@ -11983,6 +11819,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
11983
11819
  type: Input
11984
11820
  }], highlight: [{
11985
11821
  type: Input
11822
+ }], focusHighlight: [{
11823
+ type: Input
11986
11824
  }] } });
11987
11825
 
11988
11826
  /**
@@ -12048,12 +11886,13 @@ class SankeyNodesComponent extends SettingsComponent {
12048
11886
  padding;
12049
11887
  width;
12050
11888
  align;
11889
+ focusHighlight;
12051
11890
  constructor(configurationService) {
12052
11891
  super('nodes', configurationService);
12053
11892
  this.configurationService = configurationService;
12054
11893
  }
12055
11894
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyNodesComponent, deps: [{ token: ConfigurationService }], target: i0.ɵɵFactoryTarget.Component });
12056
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyNodesComponent, isStandalone: true, selector: "kendo-sankey-nodes", inputs: { colorType: "colorType", color: "color", opacity: "opacity", offset: "offset", padding: "padding", width: "width", align: "align" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
11895
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SankeyNodesComponent, isStandalone: true, selector: "kendo-sankey-nodes", inputs: { colorType: "colorType", color: "color", opacity: "opacity", offset: "offset", padding: "padding", width: "width", align: "align", focusHighlight: "focusHighlight" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
12057
11896
  }
12058
11897
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SankeyNodesComponent, decorators: [{
12059
11898
  type: Component,
@@ -12077,6 +11916,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
12077
11916
  type: Input
12078
11917
  }], align: [{
12079
11918
  type: Input
11919
+ }], focusHighlight: [{
11920
+ type: Input
12080
11921
  }] } });
12081
11922
 
12082
11923
  /**
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Border, LegendLabels, Margin, Padding, LegendTitle } from '../common/property-types';
5
+ import { Border, LegendLabels, Margin, Padding, LegendTitle, FocusHighlight } from '../common/property-types';
6
6
  import { LegendInactiveItems } from './legend/inactive-items.interface';
7
7
  import { LegendItem } from './legend/item.interface';
8
8
  import { LegendMarkers } from './legend/markers.interface';
@@ -93,4 +93,8 @@ export interface Legend {
93
93
  * By default, the Chart will not render a legend title.
94
94
  */
95
95
  title?: LegendTitle;
96
+ /**
97
+ * The focus highlight configuration options of the Chart legend.
98
+ */
99
+ focusHighlight?: FocusHighlight;
96
100
  }
@@ -3,7 +3,7 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import { drawing } from '@progress/kendo-drawing';
6
- import { Border, Overlay, SeriesHighlight, SeriesStack, SeriesType, SeriesVisualArgs } from '../common/property-types';
6
+ import { Border, FocusHighlight, Overlay, SeriesHighlight, SeriesStack, SeriesType, SeriesVisualArgs } from '../common/property-types';
7
7
  import { Series } from '../option-types/series-item.interface';
8
8
  import { SeriesDefaultsLabels } from './series-defaults/labels.interface';
9
9
  import { SeriesDefaultsNotes } from './series-defaults/notes.interface';
@@ -174,4 +174,8 @@ export interface SeriesDefaults {
174
174
  * The configuration options of the Chart series tooltip.
175
175
  */
176
176
  tooltip?: SeriesDefaultsTooltip;
177
+ /**
178
+ * The focus highlight configuration options.
179
+ */
180
+ focusHighlight?: FocusHighlight;
177
181
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-charts",
3
- "version": "18.1.0-develop.3",
3
+ "version": "18.1.0-develop.30",
4
4
  "description": "Kendo UI Charts for Angular - A comprehensive package for creating beautiful and interactive data visualization. Every chart type, stock charts, and sparklines are included.",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -42,7 +42,7 @@
42
42
  "package": {
43
43
  "productName": "Kendo UI for Angular",
44
44
  "productCode": "KENDOUIANGULAR",
45
- "publishDate": 1738245977,
45
+ "publishDate": 1738962226,
46
46
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
47
47
  }
48
48
  },
@@ -52,19 +52,19 @@
52
52
  "@angular/core": "16 - 19",
53
53
  "@angular/platform-browser": "16 - 19",
54
54
  "@progress/kendo-drawing": "^1.21.0",
55
- "@progress/kendo-licensing": "^1.0.2",
56
- "@progress/kendo-angular-common": "18.1.0-develop.3",
57
- "@progress/kendo-angular-intl": "18.1.0-develop.3",
58
- "@progress/kendo-angular-icons": "18.1.0-develop.3",
59
- "@progress/kendo-angular-l10n": "18.1.0-develop.3",
60
- "@progress/kendo-angular-popup": "18.1.0-develop.3",
61
- "@progress/kendo-angular-navigation": "18.1.0-develop.3",
55
+ "@progress/kendo-licensing": "^1.4.0",
56
+ "@progress/kendo-angular-common": "18.1.0-develop.30",
57
+ "@progress/kendo-angular-intl": "18.1.0-develop.30",
58
+ "@progress/kendo-angular-icons": "18.1.0-develop.30",
59
+ "@progress/kendo-angular-l10n": "18.1.0-develop.30",
60
+ "@progress/kendo-angular-popup": "18.1.0-develop.30",
61
+ "@progress/kendo-angular-navigation": "18.1.0-develop.30",
62
62
  "rxjs": "^6.5.3 || ^7.0.0"
63
63
  },
64
64
  "dependencies": {
65
65
  "tslib": "^2.3.1",
66
- "@progress/kendo-angular-schematics": "18.1.0-develop.3",
67
- "@progress/kendo-charts": "2.7.0",
66
+ "@progress/kendo-angular-schematics": "18.1.0-develop.30",
67
+ "@progress/kendo-charts": "2.7.1",
68
68
  "@progress/kendo-svg-icons": "^4.0.0"
69
69
  },
70
70
  "schematics": "./schematics/collection.json",
@@ -13,7 +13,7 @@ export interface SankeyTitle extends Title {
13
13
  /**
14
14
  * Represents the Sankey legend options.
15
15
  */
16
- export interface SankeyLegend extends Omit<Legend, 'inactiveItems' | 'item'> {
16
+ export interface SankeyLegend extends Omit<Legend, 'inactiveItems' | 'item' | 'focusHighlight'> {
17
17
  /**
18
18
  * The configuration of the legend items.
19
19
  */
@@ -5,6 +5,7 @@
5
5
  import { ConfigurationService } from '../common/configuration.service';
6
6
  import { SettingsComponent } from '../common/settings.component';
7
7
  import { SankeyLinkDefaults, SankeyLinkHighlight } from './api-types';
8
+ import { FocusHighlight } from '@progress/kendo-charts';
8
9
  import * as i0 from "@angular/core";
9
10
  /**
10
11
  * The configuration options of the Sankey links
@@ -16,7 +17,8 @@ export declare class SankeyLinksComponent extends SettingsComponent implements S
16
17
  color?: string;
17
18
  opacity?: number;
18
19
  highlight?: SankeyLinkHighlight;
20
+ focusHighlight?: FocusHighlight;
19
21
  constructor(configurationService: ConfigurationService);
20
22
  static ɵfac: i0.ɵɵFactoryDeclaration<SankeyLinksComponent, never>;
21
- static ɵcmp: i0.ɵɵComponentDeclaration<SankeyLinksComponent, "kendo-sankey-links", never, { "colorType": { "alias": "colorType"; "required": false; }; "color": { "alias": "color"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "highlight": { "alias": "highlight"; "required": false; }; }, {}, never, never, true, never>;
23
+ static ɵcmp: i0.ɵɵComponentDeclaration<SankeyLinksComponent, "kendo-sankey-links", never, { "colorType": { "alias": "colorType"; "required": false; }; "color": { "alias": "color"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "highlight": { "alias": "highlight"; "required": false; }; "focusHighlight": { "alias": "focusHighlight"; "required": false; }; }, {}, never, never, true, never>;
22
24
  }
@@ -5,6 +5,7 @@
5
5
  import { ConfigurationService } from '../common/configuration.service';
6
6
  import { SettingsComponent } from '../common/settings.component';
7
7
  import { SankeyNodeDefaults, SankeyOffset } from './api-types';
8
+ import { FocusHighlight } from '@progress/kendo-charts';
8
9
  import * as i0 from "@angular/core";
9
10
  /**
10
11
  * The configuration options of the Sankey nodes
@@ -28,7 +29,8 @@ export declare class SankeyNodesComponent extends SettingsComponent implements S
28
29
  padding?: number;
29
30
  width?: number;
30
31
  align?: 'stretch' | 'left' | 'right';
32
+ focusHighlight?: FocusHighlight;
31
33
  constructor(configurationService: ConfigurationService);
32
34
  static ɵfac: i0.ɵɵFactoryDeclaration<SankeyNodesComponent, never>;
33
- static ɵcmp: i0.ɵɵComponentDeclaration<SankeyNodesComponent, "kendo-sankey-nodes", never, { "colorType": { "alias": "colorType"; "required": false; }; "color": { "alias": "color"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "offset": { "alias": "offset"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "width": { "alias": "width"; "required": false; }; "align": { "alias": "align"; "required": false; }; }, {}, never, never, true, never>;
35
+ static ɵcmp: i0.ɵɵComponentDeclaration<SankeyNodesComponent, "kendo-sankey-nodes", never, { "colorType": { "alias": "colorType"; "required": false; }; "color": { "alias": "color"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "offset": { "alias": "offset"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "width": { "alias": "width"; "required": false; }; "align": { "alias": "align"; "required": false; }; "focusHighlight": { "alias": "focusHighlight"; "required": false; }; }, {}, never, never, true, never>;
34
36
  }
@@ -0,0 +1,14 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import { ThemeService } from '../common/theme.service';
6
+ import * as i0 from "@angular/core";
7
+ /**
8
+ * @hidden
9
+ */
10
+ export declare class SankeyThemeService extends ThemeService {
11
+ protected readTheme(): void;
12
+ static ɵfac: i0.ɵɵFactoryDeclaration<SankeyThemeService, never>;
13
+ static ɵprov: i0.ɵɵInjectableDeclaration<SankeyThemeService>;
14
+ }
@@ -7,7 +7,7 @@ import { LocalizationService } from '@progress/kendo-angular-l10n';
7
7
  import { Group, ImageExportOptions, SVGExportOptions } from '@progress/kendo-drawing';
8
8
  import { Subscription } from 'rxjs';
9
9
  import { ConfigurationService } from './common/configuration.service';
10
- import { ThemeService } from './common/theme.service';
10
+ import { SankeyThemeService } from './sankey/theme.service';
11
11
  import { InstanceEventService, SankeyLinkEvent, SankeyNodeEvent } from './sankey/events';
12
12
  import { Sankey, SankeyEvent, SankeyTooltipEvent } from '@progress/kendo-charts';
13
13
  import { SankeyExportVisualOptions, SankeyLabelDefaults, SankeyLinkDefaults, SankeyNodeDefaults, SankeyTooltip } from './sankey/api-types';
@@ -50,7 +50,7 @@ import * as i0 from "@angular/core";
50
50
  export declare class SankeyComponent implements AfterViewInit, OnChanges, OnDestroy {
51
51
  protected element: ElementRef;
52
52
  configurationService: ConfigurationService;
53
- themeService: ThemeService;
53
+ themeService: SankeyThemeService;
54
54
  protected localizationService: LocalizationService;
55
55
  protected instanceEventService: InstanceEventService;
56
56
  protected ngZone: NgZone;
@@ -141,7 +141,7 @@ export declare class SankeyComponent implements AfterViewInit, OnChanges, OnDest
141
141
  protected destroyed: boolean;
142
142
  protected subscriptions: Subscription;
143
143
  protected rtl: boolean;
144
- constructor(element: ElementRef, configurationService: ConfigurationService, themeService: ThemeService, localizationService: LocalizationService, instanceEventService: InstanceEventService, ngZone: NgZone, changeDetector: ChangeDetectorRef, renderer: Renderer2, intlService: IntlService);
144
+ constructor(element: ElementRef, configurationService: ConfigurationService, themeService: SankeyThemeService, localizationService: LocalizationService, instanceEventService: InstanceEventService, ngZone: NgZone, changeDetector: ChangeDetectorRef, renderer: Renderer2, intlService: IntlService);
145
145
  ngAfterViewInit(): void;
146
146
  ngOnChanges(changes: {
147
147
  [propertyName: string]: SimpleChange;
@@ -203,7 +203,6 @@ export declare class SankeyComponent implements AfterViewInit, OnChanges, OnDest
203
203
  protected get instanceOptions(): any;
204
204
  protected activeEmitter(name: string): any;
205
205
  protected refreshWait(): void;
206
- protected loadTheme(chartTheme: any): any;
207
206
  protected run(callback: any, inZone?: boolean, detectChanges?: boolean): void;
208
207
  protected detectChanges(): void;
209
208
  protected intlChange(): void;