@progress/kendo-charts 2.5.4-dev.202410140828 → 2.6.0-dev.202410171326

package/dist/es/chart/chart.js

@@ -339,6 +339,7 @@ var Chart = (function (Class) {
         this._createPannable();
         this._createZoomSelection();
         this._createMousewheelZoom();
+        this._setComputedStyles();
 
         this.trigger(RENDER);
         triggerPaneRender(this._plotArea.panes);
@@ -350,7 +351,16 @@ var Chart = (function (Class) {
         this._redrawFocusHighlight();
     };
 
+    Chart.prototype._setComputedStyles = function _setComputedStyles () {
+        var titleHeight = this.titleHeight();
+        this.element.style.setProperty('--kendo-chart-computed-title-height', (titleHeight + "px"));
+    };
+
     Chart.prototype._redrawFocusHighlight = function _redrawFocusHighlight () {
+        if (this._destroyed) {
+            return;
+        }
+
         var ref = this;
         var ref_focusState = ref._focusState;
         var legendInFocus = ref_focusState.legendInFocus;
@@ -541,9 +551,30 @@ var Chart = (function (Class) {
         model.append(plotArea);
         model.reflow();
 
+        this._setTitleBox(title, subtitle);
+
         return model;
     };
 
+    Chart.prototype._setTitleBox = function _setTitleBox (title, subtitle) {
+        if (!title && !subtitle) {
+            return;
+        }
+
+        this._titleBox = (title || subtitle).box.clone();
+
+        var titlePosition = title ? title.options.position : '';
+        var subtitlePosition = subtitle ? subtitle.options.position : '';
+        var samePosition = titlePosition === subtitlePosition;
+        var subtitleAtTop = subtitlePosition !== 'bottom';
+
+        if (samePosition && subtitle) {
+            this._titleBox.wrap(subtitle.box);
+        } else if (title && subtitle && subtitleAtTop) {
+            this._titleBox = subtitle.box.clone();
+        }
+    };
+
     Chart.prototype._modelOptions = function _modelOptions () {
         var options = this.options;
         var size = this.getSize();
@@ -665,6 +696,14 @@ var Chart = (function (Class) {
         return isDefaultPrevented;
     };
 
+    Chart.prototype.titleHeight = function titleHeight () {
+        if (!this._titleBox) {
+            return 0;
+        }
+
+        return this._titleBox.height();
+    };
+
     Chart.prototype._attachEvents = function _attachEvents () {
         var obj, obj$1;
 

package/dist/es2015/chart/chart.js

@@ -330,6 +330,7 @@ class Chart extends Class {
         this._createPannable();
         this._createZoomSelection();
         this._createMousewheelZoom();
+        this._setComputedStyles();
 
         this.trigger(RENDER);
         triggerPaneRender(this._plotArea.panes);
@@ -341,7 +342,16 @@ class Chart extends Class {
         this._redrawFocusHighlight();
     }
 
+    _setComputedStyles() {
+        const titleHeight = this.titleHeight();
+        this.element.style.setProperty('--kendo-chart-computed-title-height', `${titleHeight}px`);
+    }
+
     _redrawFocusHighlight() {
+        if (this._destroyed) {
+            return;
+        }
+
         const { _focusState: { legendInFocus, preserveHighlight } } = this;
 
         if (legendInFocus && preserveHighlight) {
@@ -528,9 +538,30 @@ class Chart extends Class {
         model.append(plotArea);
         model.reflow();
 
+        this._setTitleBox(title, subtitle);
+
         return model;
     }
 
+    _setTitleBox(title, subtitle) {
+        if (!title && !subtitle) {
+            return;
+        }
+
+        this._titleBox = (title || subtitle).box.clone();
+
+        const titlePosition = title ? title.options.position : '';
+        const subtitlePosition = subtitle ? subtitle.options.position : '';
+        const samePosition = titlePosition === subtitlePosition;
+        const subtitleAtTop = subtitlePosition !== 'bottom';
+
+        if (samePosition && subtitle) {
+            this._titleBox.wrap(subtitle.box);
+        } else if (title && subtitle && subtitleAtTop) {
+            this._titleBox = subtitle.box.clone();
+        }
+    }
+
     _modelOptions() {
         const options = this.options;
         const size = this.getSize();
@@ -647,6 +678,14 @@ class Chart extends Class {
         return isDefaultPrevented;
     }
 
+    titleHeight() {
+        if (!this._titleBox) {
+            return 0;
+        }
+
+        return this._titleBox.height();
+    }
+
     _attachEvents() {
         const element = this.element;