@gravity-ui/chartkit 2.2.1 → 2.2.2

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [2.2.2](https://github.com/gravity-ui/chartkit/compare/v2.2.1...v2.2.2) (2023-03-28)
+
+
+### Bug Fixes
+
+* **Highcharts plugin:** fix legend item click ([#142](https://github.com/gravity-ui/chartkit/issues/142)) ([a64f1b9](https://github.com/gravity-ui/chartkit/commit/a64f1b962bec45bfd2568110c1c9050fc9d75807))
+
 ## [2.2.1](https://github.com/gravity-ui/chartkit/compare/v2.2.0...v2.2.1) (2023-03-27)
 
 

package/build/plugins/highcharts/renderer/components/HighchartsComponent.d.ts

@@ -360,7 +360,7 @@ export declare class HighchartsComponent extends React.PureComponent<Props, Stat
                 };
                 series: {
                     events: {
-                        legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject) => void;
+                        legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject | Highcharts.PointLegendItemClickEventObject) => void;
                         mouseOver: () => void;
                         mouseOut: () => void;
                         click: (event: any) => void;
@@ -386,7 +386,7 @@ export declare class HighchartsComponent extends React.PureComponent<Props, Stat
                 pie: {
                     point: {
                         events: {
-                            legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject) => void;
+                            legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject | Highcharts.PointLegendItemClickEventObject) => void;
                         };
                     };
                 };

package/build/plugins/highcharts/renderer/helpers/config/config.d.ts

@@ -518,7 +518,7 @@ export function prepareConfig(data: any, options: any, isMobile: any, holidays:
         };
         series: {
             events: {
-                legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject) => void;
+                legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject | Highcharts.PointLegendItemClickEventObject) => void;
                 mouseOver: () => void;
                 mouseOut: () => void;
                 click: (event: any) => void;
@@ -544,7 +544,7 @@ export function prepareConfig(data: any, options: any, isMobile: any, holidays:
         pie: {
             point: {
                 events: {
-                    legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject) => void;
+                    legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject | Highcharts.PointLegendItemClickEventObject) => void;
                 };
             };
         };

package/build/plugins/highcharts/renderer/helpers/config/handleLegendItemClick.d.ts

@@ -1,2 +1,2 @@
 import Highcharts from 'highcharts';
-export declare const handleLegendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject) => void;
+export declare const handleLegendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject | Highcharts.PointLegendItemClickEventObject) => void;

package/build/plugins/highcharts/renderer/helpers/config/handleLegendItemClick.js

@@ -1,12 +1,18 @@
 import { drawComments, hideComments } from '../comments/drawing';
 import { isNavigatorSeries } from './utils';
-const getSeriesIdentifier = (series) => {
-    return series.userOptions.id || series.name;
+import Highcharts from 'highcharts';
+const getSeriesIdentifier = (item) => {
+    if (item instanceof Highcharts.Point) {
+        return item.name;
+    }
+    return item.userOptions.id || item.name;
 };
 const needSetVisible = (seriesName, seriesVisible, chartSeries) => {
     if (!seriesVisible) {
         return false;
     }
+    // TypeScript have problems when filter/map/reduce with union type arrays.
+    // https://github.com/microsoft/TypeScript/issues/44373
     const hasAnotherVisibleSeries = chartSeries
         .filter((series) => series.options.showInLegend !== false && getSeriesIdentifier(series) !== seriesName)
         .some((series) => series.visible);
@@ -18,6 +24,10 @@ const updateSeries = (series, chartSeries, type) => {
         case 'extended': {
             chartSeries.forEach((item) => {
                 if (getSeriesIdentifier(item) === clickedSeriesName) {
+                    // Highcharts.Series has serVisible in types
+                    // Highcharts.Point doesn't have this method in types
+                    // but it has this method in __proto__ and it works
+                    // @ts-ignore
                     item.setVisible(!item.visible, false);
                 }
             });
@@ -27,9 +37,11 @@ const updateSeries = (series, chartSeries, type) => {
             const visible = needSetVisible(getSeriesIdentifier(series), series.visible, chartSeries);
             chartSeries.forEach((item) => {
                 if (getSeriesIdentifier(item) === clickedSeriesName) {
+                    // @ts-ignore
                     item.setVisible(true, false);
                 }
                 else {
+                    // @ts-ignore
                     item.setVisible(visible, false);
                 }
             });
@@ -47,10 +59,8 @@ const updateComments = (chart) => {
 export const handleLegendItemClick = (event) => {
     event.preventDefault();
     const series = event.target;
-    const chart = series.chart ? series.chart : series.series.chart;
-    const chartSeries = series.chart
-        ? chart.series
-        : series.series.data;
+    const chart = series instanceof Highcharts.Point ? series.series.chart : series.chart;
+    const chartSeries = series instanceof Highcharts.Point ? series.series.data : series.chart.series;
     if (isNavigatorSeries(series)) {
         return;
     }

package/build/plugins/highcharts/renderer/helpers/config/utils/isNavigatorSeries.d.ts

@@ -1,2 +1,2 @@
 import type { Highcharts } from '../../../../types';
-export declare const isNavigatorSeries: (series?: Highcharts.Series | undefined) => boolean;
+export declare const isNavigatorSeries: (series?: Highcharts.Point | Highcharts.Series | undefined) => boolean;

package/build/plugins/highcharts/renderer/helpers/graph.d.ts

@@ -354,7 +354,7 @@ declare function getGraph({ options, data, comments, isMobile, holidays }: GetGr
             };
             series: {
                 events: {
-                    legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject) => void;
+                    legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject | Highcharts.PointLegendItemClickEventObject) => void;
                     mouseOver: () => void;
                     mouseOut: () => void;
                     click: (event: any) => void;
@@ -380,7 +380,7 @@ declare function getGraph({ options, data, comments, isMobile, holidays }: GetGr
             pie: {
                 point: {
                     events: {
-                        legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject) => void;
+                        legendItemClick: (event: Highcharts.SeriesLegendItemClickEventObject | Highcharts.PointLegendItemClickEventObject) => void;
                     };
                 };
             };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/chartkit",
-  "version": "2.2.1",
+  "version": "2.2.2",
   "description": "React component used to render charts based on any sources you need",
   "license": "MIT",
   "repository": "git@github.com:gravity-ui/ChartKit.git",