q2-tecton-elements 1.47.4 → 1.47.6

package/dist/esm/q2-chart-donut.entry.js

@@ -4173,7 +4173,30 @@ const Q2ChartDonut = class {
         overrideFocus(this.hostElement);
     }
     disconnectedCallback() {
+        var _a;
+        // CRITICAL: Dispose eCharts instance to prevent memory leaks
+        // eCharts holds references to canvas, event listeners (mouseover, mouseout, click, selectchanged, finished),
+        // and animation frames. All chart event listeners are automatically cleaned up by dispose()
+        if (this.chart) {
+            this.chart.dispose();
+            this.chart = null;
+        }
+        // Disconnect ResizeObserver
+        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
         this.resizeObserver = null;
+        // Clear cached style references that hold DOM references (Safari memory management)
+        this.chartContainerStyles = null;
+        this.hostElementStyles = null;
+        // Clear DOM references
+        this.chartContainer = null;
+        this.centerButtonElement = null;
+        this.btnElement = null;
+        // Clear data references
+        this.colors = null;
+        this.legendData = null;
+        // Clear state to prevent lingering references
+        this.hoveredId = null;
+        this.selectedId = null;
     }
     /// Getters ///
     get centerData() {
@@ -4482,7 +4505,7 @@ const Q2ChartDonut = class {
             } })), !!name && h("div", { class: "name" }, name), !!value && h("div", { class: "value" }, displayValue))));
     }
     render() {
-        return (h("click-elsewhere", { key: 'fe9b4ba472076ecd92381990e3a92930edf14888', onChange: this.onClickElsewhere }, h("figure", { key: '8755fa2976da39a7a8c4ce2fe13ca04191942e9c' }, h("div", { key: '84e1198bce7f609546efe37cb506fe77e087feb1', class: "container" }, h("div", { key: '9dbcff19f30ca7e5ac4d818e801f63b2c3674117', ref: el => (this.chartContainer = el), "aria-describedby": !this.isClickable ? 'center-card-description' : undefined, class: "chart-container", role: "img", "test-id": "chartContainer", onClick: this.onContainerClick, tabIndex: !this.isClickable ? 0 : undefined, onKeyDown: !this.isClickable ? this.onButtonKeyDown : undefined }), this.renderCenterBlock()), this.showLegend && (h("figcaption", { key: 'ae47c89d19314470c25394cddeeb284e4431f490' }, h("q2-legend", { key: '85cca395c371302d7dbca7b93f777fee6908b6fc', class: "legend", data: this.legendData, format: this.format, hoveredItemId: this.legendHoveredId, onClick: this.onLegendClick, onMouseleave: this.onLegendMouseleave, onMouseenter: this.onLegendMouseenter, selectedItemId: this.selectedId }))))));
+        return (h("click-elsewhere", { key: '5e17be81ffc795f8ac0da10396fab7078280b1aa', onChange: this.onClickElsewhere }, h("figure", { key: '90ca579a42f73352b38a04f6ed8e57a6c2335cae' }, h("div", { key: '2d2eaa7228b22eb2d617e800b6a58c65602efdda', class: "container" }, h("div", { key: 'fa9dd8382b7ba85cc3520e7e9a52cae3024dce09', ref: el => (this.chartContainer = el), "aria-describedby": !this.isClickable ? 'center-card-description' : undefined, class: "chart-container", role: "img", "test-id": "chartContainer", onClick: this.onContainerClick, tabIndex: !this.isClickable ? 0 : undefined, onKeyDown: !this.isClickable ? this.onButtonKeyDown : undefined }), this.renderCenterBlock()), this.showLegend && (h("figcaption", { key: '70b77fbbbd666a52a7e50a42f742e193ae62e315' }, h("q2-legend", { key: '3c3e03596b3b2729ee15697d6666c968140694e7', class: "legend", data: this.legendData, format: this.format, hoveredItemId: this.legendHoveredId, onClick: this.onLegendClick, onMouseleave: this.onLegendMouseleave, onMouseenter: this.onLegendMouseenter, selectedItemId: this.selectedId }))))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {