@progress/kendo-charts 2.6.3-dev.202411221249 → 2.7.0-dev.202501020821

package/dist/es/chart/bar-chart/bar.js

@@ -211,7 +211,7 @@ var Bar = (function (ChartElement) {
     };
 
     Bar.prototype.createFocusHighlight = function createFocusHighlight (style) {
-        var borderWidth = this.options.accessibility.highlight.border.width;
+        var borderWidth = this.options.focusHighlight.border.width;
         var highlight = draw.Path.fromRect(this.box.pad(borderWidth / 2).toRect(), style);
 
         return alignPathToPixel(highlight);

package/dist/es/chart/bubble-chart/bubble.js

@@ -62,7 +62,7 @@ var Bubble = (function (LinePoint) {
     };
 
     Bubble.prototype.createFocusHighlight = function createFocusHighlight (style) {
-        var highlightOptions = this.options.accessibility.highlight;
+        var highlightOptions = this.options.focusHighlight;
         var markers = this.options.markers;
         var center = this.box.center();
         var radius = (markers.size + markers.border.width) / 2 + highlightOptions.border.width / 2;

package/dist/es/chart/chart.js

@@ -2331,13 +2331,12 @@ setDefaultOptions(Chart, {
     legend: {
         visible: true,
         labels: {},
-        accessibility: {
-            highlight: {
-                border: {
-                    opacity: 1,
-                    color: BLACK,
-                    width: 2
-                }
+        accessibility: {},
+        focusHighlight: {
+            border: {
+                opacity: 1,
+                color: BLACK,
+                width: 2
             }
         }
     },
@@ -2352,14 +2351,13 @@ setDefaultOptions(Chart, {
         negativeValues: {
             visible: false
         },
-        accessibility: {
-            highlight: {
-                border: {
-                    opacity: 1,
-                    width: 2
-                },
-                zIndex: 200
-            }
+        accessibility: {},
+        focusHighlight: {
+            border: {
+                opacity: 1,
+                width: 2
+            },
+            zIndex: 200
         }
     },
     series: [],

package/dist/es/chart/funnel-chart/funnel-segment.js

@@ -113,7 +113,7 @@ var FunnelSegment = (function (ChartElement) {
     };
 
     FunnelSegment.prototype.createFocusHighlight = function createFocusHighlight (style) {
-        var borderWidth = this.options.accessibility.highlight.border.width;
+        var borderWidth = this.options.focusHighlight.border.width;
         var result = draw.Path.fromPoints(this.points, deepExtend({}, style, {
             stroke: {
                 width: borderWidth * 2

package/dist/es/chart/heatmap-chart/heatmap-point.js

@@ -208,7 +208,7 @@ var HeatmapPoint = (function (ChartElement) {
 
     HeatmapPoint.prototype.createFocusHighlight = function createFocusHighlight () {
         var markerOptions = this.options.markers;
-        var highlightOptions = this.options.accessibility.highlight;
+        var highlightOptions = this.options.focusHighlight;
 
         var highlight = new ShapeElement({
             type: valueOrDefault(markerOptions.type, 'rect'),

package/dist/es/chart/legend/legend.js

@@ -119,7 +119,8 @@ var Legend = (function (ChartElement) {
                     area: Object.assign({}, {opacity: opacity},
                         options.area),
                     opacity: opacity,
-                    accessibility: options.accessibility
+                    accessibility: options.accessibility,
+                    focusHighlight: options.focusHighlight
                 },
                 options.item,
                 legendItem,

package/dist/es/chart/line-chart/line-point.js

@@ -265,7 +265,7 @@ var LinePoint = (function (ChartElement) {
 
     LinePoint.prototype.createFocusHighlight = function createFocusHighlight () {
         var markerOptions = this.options.markers;
-        var highlightOptions = this.options.accessibility.highlight;
+        var highlightOptions = this.options.focusHighlight;
         var size = markerOptions.size + (markerOptions.border.width || 0);
 
         var highlight = new ShapeElement({

package/dist/es/chart/pie-chart/pie-segment.js

@@ -261,7 +261,7 @@ var PieSegment = (function (ChartElement) {
     };
 
     PieSegment.prototype.createFocusHighlight = function createFocusHighlight (style) {
-        var borderWidth = this.options.accessibility.highlight.border.width;
+        var borderWidth = this.options.focusHighlight.border.width;
         var result = this.createSegment(this.sector, deepExtend({}, style, {
             stroke: {
                 width: borderWidth * 2

package/dist/es/chart/tooltip/base-tooltip.js

@@ -49,6 +49,9 @@ var BaseTooltip = (function (Class) {
     };
 
     BaseTooltip.prototype.show = function show (options, tooltipOptions, point) {
+        if (!this.chartService) {
+            return;
+        }
         options.format = tooltipOptions.format;
 
         var style = this.getStyle(tooltipOptions, point);

package/dist/es/core/chart-element.js

@@ -281,7 +281,7 @@ var ChartElement = (function (Class) {
     };
 
     ChartElement.prototype.toggleFocusHighlight = function toggleFocusHighlight (show) {
-        var options = ((this.options || {}).accessibility || {}).highlight || {};
+        var options = (this.options || {}).focusHighlight || {};
         var focusHighlight = this._focusHighlight;
 
         if (!show && !focusHighlight) {

package/dist/es/sankey/link.js

@@ -201,7 +201,7 @@ export var Link = (function (SankeyElement) {
 
         var offset = calculateControlPointsOffsetX(link, this.options.rtl);
 
-        this._highlight = new drawing.Path({ stroke: this.options.focusHighlight, visible: false })
+        this._highlight = new drawing.Path({ stroke: this.options.focusHighlight.border, visible: false })
             .moveTo(x0, y0 + halfWidth)
             .lineTo(x0, y0 - halfWidth)
             .curveTo([xC + offset, y0 - halfWidth], [xC + offset, y1 - halfWidth], [x1, y1 - halfWidth])

package/dist/es/sankey/node.js

@@ -52,7 +52,7 @@ export var Node = (function (SankeyElement) {
         }
 
         this._highlight = drawing.Path.fromRect(this.getRect(), {
-            stroke: this.options.focusHighlight,
+            stroke: this.options.focusHighlight.border,
             visible: false
         });
 

package/dist/es/sankey/sankey.js

@@ -633,7 +633,8 @@ export var Sankey = (function (Observable) {
         var disableKeyboardNavigation = sankeyOptions.disableKeyboardNavigation;
         var rtl = sankeyOptions.rtl;
         var autoLayout = !disableAutoLayout;
-        var padding = disableKeyboardNavigation ? 0 : highlightOptions.width / 2;
+        var focusHighlightWidth = ((nodes.focusHighlight || {}).border || {}).width || 0;
+        var padding = disableKeyboardNavigation ? 0 : focusHighlightWidth / 2;
 
         var sankeyBox = new Box(0, 0, calcOptions.width, calcOptions.height);
         sankeyBox.unpad(padding);
@@ -984,7 +985,9 @@ setDefaultOptions(Sankey, {
         opacity: 1,
         align: 'stretch', // 'left', 'right', 'stretch'
         offset: { left: 0, top: 0 },
-        focusHighlight: Object.assign({}, highlightOptions),
+        focusHighlight: {
+            border: Object.assign({}, highlightOptions)
+        },
         labels: {
             ariaTemplate: function (ref) {
                 var node = ref.node;
@@ -1000,7 +1003,9 @@ setDefaultOptions(Sankey, {
             opacity: 0.8,
             inactiveOpacity: 0.2
         },
-        focusHighlight: Object.assign({}, highlightOptions),
+        focusHighlight: {
+            border: Object.assign({}, highlightOptions)
+        },
         labels: {
             ariaTemplate: function (ref) {
                 var link = ref.link;

package/dist/es2015/chart/bar-chart/bar.js

@@ -201,7 +201,7 @@ class Bar extends ChartElement {
     }
 
     createFocusHighlight(style) {
-        const borderWidth = this.options.accessibility.highlight.border.width;
+        const borderWidth = this.options.focusHighlight.border.width;
         const highlight = draw.Path.fromRect(this.box.pad(borderWidth / 2).toRect(), style);
 
         return alignPathToPixel(highlight);

package/dist/es2015/chart/bubble-chart/bubble.js

@@ -58,7 +58,7 @@ class Bubble extends LinePoint {
     }
 
     createFocusHighlight(style) {
-        const highlightOptions = this.options.accessibility.highlight;
+        const highlightOptions = this.options.focusHighlight;
         const markers = this.options.markers;
         const center = this.box.center();
         const radius = (markers.size + markers.border.width) / 2 + highlightOptions.border.width / 2;

package/dist/es2015/chart/chart.js

@@ -2270,13 +2270,12 @@ setDefaultOptions(Chart, {
     legend: {
         visible: true,
         labels: {},
-        accessibility: {
-            highlight: {
-                border: {
-                    opacity: 1,
-                    color: BLACK,
-                    width: 2
-                }
+        accessibility: {},
+        focusHighlight: {
+            border: {
+                opacity: 1,
+                color: BLACK,
+                width: 2
             }
         }
     },
@@ -2291,14 +2290,13 @@ setDefaultOptions(Chart, {
         negativeValues: {
             visible: false
         },
-        accessibility: {
-            highlight: {
-                border: {
-                    opacity: 1,
-                    width: 2
-                },
-                zIndex: 200
-            }
+        accessibility: {},
+        focusHighlight: {
+            border: {
+                opacity: 1,
+                width: 2
+            },
+            zIndex: 200
         }
     },
     series: [],

package/dist/es2015/chart/funnel-chart/funnel-segment.js

@@ -107,7 +107,7 @@ class FunnelSegment extends ChartElement {
     }
 
     createFocusHighlight(style) {
-        const borderWidth = this.options.accessibility.highlight.border.width;
+        const borderWidth = this.options.focusHighlight.border.width;
         const result = draw.Path.fromPoints(this.points, deepExtend({}, style, {
             stroke: {
                 width: borderWidth * 2

package/dist/es2015/chart/heatmap-chart/heatmap-point.js

@@ -204,7 +204,7 @@ class HeatmapPoint extends ChartElement {
 
     createFocusHighlight() {
         const markerOptions = this.options.markers;
-        const highlightOptions = this.options.accessibility.highlight;
+        const highlightOptions = this.options.focusHighlight;
 
         const highlight = new ShapeElement({
             type: valueOrDefault(markerOptions.type, 'rect'),

package/dist/es2015/chart/legend/legend.js

@@ -108,7 +108,8 @@ class Legend extends ChartElement {
                     area: Object.assign({}, {opacity: opacity},
                         options.area),
                     opacity: opacity,
-                    accessibility: options.accessibility
+                    accessibility: options.accessibility,
+                    focusHighlight: options.focusHighlight
                 },
                 options.item,
                 legendItem,

package/dist/es2015/chart/line-chart/line-point.js

@@ -254,7 +254,7 @@ class LinePoint extends ChartElement {
 
     createFocusHighlight() {
         const markerOptions = this.options.markers;
-        const highlightOptions = this.options.accessibility.highlight;
+        const highlightOptions = this.options.focusHighlight;
         const size = markerOptions.size + (markerOptions.border.width || 0);
 
         const highlight = new ShapeElement({

package/dist/es2015/chart/pie-chart/pie-segment.js

@@ -247,7 +247,7 @@ class PieSegment extends ChartElement {
     }
 
     createFocusHighlight(style) {
-        const borderWidth = this.options.accessibility.highlight.border.width;
+        const borderWidth = this.options.focusHighlight.border.width;
         const result = this.createSegment(this.sector, deepExtend({}, style, {
             stroke: {
                 width: borderWidth * 2

package/dist/es2015/chart/tooltip/base-tooltip.js

@@ -44,6 +44,9 @@ class BaseTooltip extends Class {
     }
 
     show(options, tooltipOptions, point) {
+        if (!this.chartService) {
+            return;
+        }
         options.format = tooltipOptions.format;
 
         const style = this.getStyle(tooltipOptions, point);

package/dist/es2015/core/chart-element.js

@@ -272,7 +272,7 @@ class ChartElement extends Class {
     }
 
     toggleFocusHighlight(show) {
-        const options = ((this.options || {}).accessibility || {}).highlight || {};
+        const options = (this.options || {}).focusHighlight || {};
         let focusHighlight = this._focusHighlight;
 
         if (!show && !focusHighlight) {

package/dist/es2015/sankey/link.js

@@ -186,7 +186,7 @@ export class Link extends SankeyElement {
 
         const offset = calculateControlPointsOffsetX(link, this.options.rtl);
 
-        this._highlight = new drawing.Path({ stroke: this.options.focusHighlight, visible: false })
+        this._highlight = new drawing.Path({ stroke: this.options.focusHighlight.border, visible: false })
             .moveTo(x0, y0 + halfWidth)
             .lineTo(x0, y0 - halfWidth)
             .curveTo([xC + offset, y0 - halfWidth], [xC + offset, y1 - halfWidth], [x1, y1 - halfWidth])

package/dist/es2015/sankey/node.js

@@ -44,7 +44,7 @@ export class Node extends SankeyElement {
         }
 
         this._highlight = drawing.Path.fromRect(this.getRect(), {
-            stroke: this.options.focusHighlight,
+            stroke: this.options.focusHighlight.border,
             visible: false
         });
 

package/dist/es2015/sankey/sankey.js

@@ -594,7 +594,8 @@ export class Sankey extends Observable {
     calculateSankey(calcOptions, sankeyOptions) {
         const { title, legend, data, nodes, labels, nodeColors, disableAutoLayout, disableKeyboardNavigation, rtl } = sankeyOptions;
         const autoLayout = !disableAutoLayout;
-        const padding = disableKeyboardNavigation ? 0 : highlightOptions.width / 2;
+        const focusHighlightWidth = ((nodes.focusHighlight || {}).border || {}).width || 0;
+        const padding = disableKeyboardNavigation ? 0 : focusHighlightWidth / 2;
 
         const sankeyBox = new Box(0, 0, calcOptions.width, calcOptions.height);
         sankeyBox.unpad(padding);
@@ -925,7 +926,9 @@ setDefaultOptions(Sankey, {
         opacity: 1,
         align: 'stretch', // 'left', 'right', 'stretch'
         offset: { left: 0, top: 0 },
-        focusHighlight: Object.assign({}, highlightOptions),
+        focusHighlight: {
+            border: Object.assign({}, highlightOptions)
+        },
         labels: {
             ariaTemplate: ({ node }) => node.label.text
         }
@@ -937,7 +940,9 @@ setDefaultOptions(Sankey, {
             opacity: 0.8,
             inactiveOpacity: 0.2
         },
-        focusHighlight: Object.assign({}, highlightOptions),
+        focusHighlight: {
+            border: Object.assign({}, highlightOptions)
+        },
         labels: {
             ariaTemplate: ({ link }) => `${link.source.label.text} to ${link.target.label.text}`
         }

package/dist/npm/field-types/focus-highlight.interface.d.ts

@@ -0,0 +1,23 @@
+import { Border } from './border.interface';
+
+/**
+ * Represents the focus highlight border options.
+ */
+export interface FocusHighlightBorder extends Border {
+    /**
+     * The opacity of the focus highlight border.
+     *
+     * @default 1
+     */
+    opacity?: number;
+}
+
+/**
+ * Represents the focus highlight options.
+ */
+export interface FocusHighlight {
+    /**
+     * The border options of the focus highlight.
+     */
+    border?: FocusHighlightBorder;
+}

package/dist/npm/field-types.d.ts

@@ -3,4 +3,5 @@ export { DashType } from './field-types/dash-type';
 export { Margin } from './field-types/margin.interface';
 export { Padding } from './field-types/padding.interface';
 export { RenderMode } from './field-types/render-mode';
+export { FocusHighlight, FocusHighlightBorder } from './field-types/focus-highlight.interface';
 export * from './field-types/series-pattern.interface';