@gravity-ui/chartkit 3.0.0-beta.7 → 3.0.0-beta.9

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

@@ -16,7 +16,7 @@ import { formatNumber } from '../../../../shared';
 import { getCommentsOnLine, drawComments, hideComments, drawOnlyRendererComments, } from '../comments/drawing';
 import formatTooltip, { TOOLTIP_ROW_CLASS_NAME, SERIES_NAME_DATA_ATTRIBUTE, TOOLTIP_HEADER_CLASS_NAME, TOOLTIP_LIST_CLASS_NAME, TOOLTIP_FOOTER_CLASS_NAME, TOOLTIP_CONTAINER_CLASS_NAME, TOOLTIP_ROW_NAME_CLASS_NANE, } from '../tooltip';
 import defaultOptions from './options';
-import { calculatePrecision, isTooltipShared, isSafari, mergeArrayWithObject, concatStrings, buildNavigatorFallback, addShowInNavigatorToSeries, setNavigatorDefaultPeriod, numberFormat, getFormatOptionsFromLine, checkTooltipPinningAvailability, } from './utils';
+import { calculatePrecision, isTooltipShared, isSafari, mergeArrayWithObject, concatStrings, buildNavigatorFallback, addShowInNavigatorToSeries, setNavigatorDefaultPeriod, numberFormat, getFormatOptionsFromLine, checkTooltipPinningAvailability, getSortedData, } from './utils';
 import { handleLegendItemClick } from './handleLegendItemClick';
 import { getChartKitFormattedValue } from './utils/getChartKitFormattedValue';
 const b = block('chartkit-tooltip');
@@ -381,7 +381,7 @@ function validateCellManipulationConfig(tooltipOptions, property, item) {
     }
 }
 function getTooltip(tooltip, options, comments, holidays) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     const serieType = (this.series && this.series.type) || tooltip.chart.options.chart.type;
     const chart = tooltip.chart;
     const xAxis = chart.xAxis[0];
@@ -412,7 +412,6 @@ function getTooltip(tooltip, options, comments, holidays) {
             count: 1,
             shared: true,
             unsafe: Boolean(options.unsafe),
-            sort: (_b = options === null || options === void 0 ? void 0 : options.tooltip) === null || _b === void 0 ? void 0 : _b.sort,
         };
         if (typeof options.manageTooltipConfig === 'function') {
             json = callManageTooltipConfig(options, json, chart);
@@ -440,7 +439,7 @@ function getTooltip(tooltip, options, comments, holidays) {
     let points = [];
     let shared;
     if (this.points) {
-        points = this.points;
+        points = getSortedData(this.points, (_b = options === null || options === void 0 ? void 0 : options.tooltip) === null || _b === void 0 ? void 0 : _b.sort);
         shared = true;
     }
     else {
@@ -459,7 +458,6 @@ function getTooltip(tooltip, options, comments, holidays) {
         withPercent: false,
         tooltipHeader: null,
         unsafe: Boolean(options.unsafe),
-        sort: (_c = options === null || options === void 0 ? void 0 : options.tooltip) === null || _c === void 0 ? void 0 : _c.sort,
     };
     if (isDatetimeXAxis) {
         const items = this.points || Highcharts.splat(this);
@@ -476,9 +474,9 @@ function getTooltip(tooltip, options, comments, holidays) {
         }
         json.tooltipHeader = chart.time.dateFormat(xDateFormat, this.x);
     }
-    else if ((_f = (_e = (_d = extendedPoint.point) === null || _d === void 0 ? void 0 : _d.options) === null || _e === void 0 ? void 0 : _e.xFormatted) !== null && _f !== void 0 ? _f : (extendedPoint.x || extendedPoint.x === 0)) {
-        const customTooltipHeaderFormatter = (_g = options === null || options === void 0 ? void 0 : options.highcharts) === null || _g === void 0 ? void 0 : _g.tooltipHeaderFormatter;
-        const tooltipHeaderStringValue = String((_k = (_j = (_h = extendedPoint.point) === null || _h === void 0 ? void 0 : _h.options) === null || _j === void 0 ? void 0 : _j.xFormatted) !== null && _k !== void 0 ? _k : extendedPoint.x);
+    else if ((_e = (_d = (_c = extendedPoint.point) === null || _c === void 0 ? void 0 : _c.options) === null || _d === void 0 ? void 0 : _d.xFormatted) !== null && _e !== void 0 ? _e : (extendedPoint.x || extendedPoint.x === 0)) {
+        const customTooltipHeaderFormatter = (_f = options === null || options === void 0 ? void 0 : options.highcharts) === null || _f === void 0 ? void 0 : _f.tooltipHeaderFormatter;
+        const tooltipHeaderStringValue = String((_j = (_h = (_g = extendedPoint.point) === null || _g === void 0 ? void 0 : _g.options) === null || _h === void 0 ? void 0 : _h.xFormatted) !== null && _j !== void 0 ? _j : extendedPoint.x);
         json.tooltipHeader = customTooltipHeaderFormatter
             ? customTooltipHeaderFormatter(tooltipHeaderStringValue)
             : tooltipHeaderStringValue;

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

@@ -1,3 +1,4 @@
+import type { HighchartsSortData } from '../../../../types/widget';
 export { addShowInNavigatorToSeries } from './addShowInNavigatorToSeries';
 export { buildNavigatorFallback } from './buildNavigatorFallback';
 export { calculatePrecision } from './calculatePrecision';
@@ -11,3 +12,35 @@ export { isSafari } from './isSafari';
 export { mergeArrayWithObject } from './mergeArrayWithObject';
 export { numberFormat } from './numberFormat';
 export { setNavigatorDefaultPeriod } from './setNavigatorDefaultPeriod';
+export declare const getSortedData: <T extends Record<string, any>>(data: T[], sort?: HighchartsSortData) => (number | T | (() => IterableIterator<T>) | (() => {
+    copyWithin: boolean;
+    entries: boolean;
+    fill: boolean;
+    find: boolean;
+    findIndex: boolean;
+    keys: boolean;
+    values: boolean;
+}) | (() => string) | (() => string) | (() => T | undefined) | ((...items: T[]) => number) | {
+    (...items: ConcatArray<T>[]): T[];
+    (...items: (T | ConcatArray<T>)[]): T[];
+} | ((separator?: string | undefined) => string) | (() => T[]) | (() => T | undefined) | ((start?: number | undefined, end?: number | undefined) => T[]) | ((compareFn?: ((a: T, b: T) => number) | undefined) => T[]) | {
+    (start: number, deleteCount?: number | undefined): T[];
+    (start: number, deleteCount: number, ...items: T[]): T[];
+} | ((...items: T[]) => number) | ((searchElement: T, fromIndex?: number | undefined) => number) | ((searchElement: T, fromIndex?: number | undefined) => number) | {
+    <S extends T>(predicate: (value: T, index: number, array: T[]) => value is S, thisArg?: any): this is S[];
+    (predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;
+} | ((predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any) => boolean) | ((callbackfn: (value: T, index: number, array: T[]) => void, thisArg?: any) => void) | (<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any) => U[]) | {
+    <S_1 extends T>(predicate: (value: T, index: number, array: T[]) => value is S_1, thisArg?: any): S_1[];
+    (predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): T[];
+} | {
+    (callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T): T;
+    (callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T;
+    <U_1>(callbackfn: (previousValue: U_1, currentValue: T, currentIndex: number, array: T[]) => U_1, initialValue: U_1): U_1;
+} | {
+    (callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T): T;
+    (callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T;
+    <U_2>(callbackfn: (previousValue: U_2, currentValue: T, currentIndex: number, array: T[]) => U_2, initialValue: U_2): U_2;
+} | {
+    <S_2 extends T>(predicate: (this: void, value: T, index: number, obj: T[]) => value is S_2, thisArg?: any): S_2 | undefined;
+    (predicate: (value: T, index: number, obj: T[]) => unknown, thisArg?: any): T | undefined;
+} | ((predicate: (value: T, index: number, obj: T[]) => unknown, thisArg?: any) => number) | ((value: T, start?: number | undefined, end?: number | undefined) => T[]) | ((target: number, start: number, end?: number | undefined) => T[]) | (() => IterableIterator<[number, T]>) | (() => IterableIterator<number>) | (() => IterableIterator<T>) | ((searchElement: T, fromIndex?: number | undefined) => boolean) | (<U_3, This = undefined>(callback: (this: This, value: T, index: number, array: T[]) => U_3 | readonly U_3[], thisArg?: This | undefined) => U_3[]) | (<A, D extends number = 1>(this: A, depth?: D | undefined) => FlatArray<A, D>[]) | ((index: number) => T | undefined))[];

package/build/plugins/highcharts/renderer/helpers/config/utils/index.js

@@ -1,3 +1,4 @@
+import orderBy from 'lodash/orderBy';
 export { addShowInNavigatorToSeries } from './addShowInNavigatorToSeries';
 export { buildNavigatorFallback } from './buildNavigatorFallback';
 export { calculatePrecision } from './calculatePrecision';
@@ -11,3 +12,10 @@ export { isSafari } from './isSafari';
 export { mergeArrayWithObject } from './mergeArrayWithObject';
 export { numberFormat } from './numberFormat';
 export { setNavigatorDefaultPeriod } from './setNavigatorDefaultPeriod';
+export const getSortedData = (data, sort = {}) => {
+    const { enabled = true, order = 'desc', iteratee = 'y' } = sort;
+    if (!enabled) {
+        return [...data];
+    }
+    return orderBy(data, iteratee, order);
+};

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

@@ -1,3 +1 @@
-import type { TooltipData, TooltipLine } from './types';
 export declare const escapeHTML: (html?: string) => string;
-export declare const getSortedLines: (lines: TooltipLine[], sort?: TooltipData['sort']) => TooltipLine[];

package/build/plugins/highcharts/renderer/helpers/tooltip/helpers.js

@@ -1,13 +1,5 @@
-import orderBy from 'lodash/orderBy';
 export const escapeHTML = (html = '') => {
     const elem = document.createElement('span');
     elem.innerText = html;
     return elem.innerHTML;
 };
-export const getSortedLines = (lines, sort = {}) => {
-    const { enabled = true, order = 'desc', iteratee = 'originalValue' } = sort;
-    if (!enabled) {
-        return [...lines];
-    }
-    return orderBy(lines, iteratee, order);
-};

package/build/plugins/highcharts/renderer/helpers/tooltip/index.js

@@ -2,7 +2,7 @@
 import _escape from 'lodash/escape';
 import { i18n } from '../../../../../i18n';
 import { renderShapeIcon } from './render-shape-icon';
-import { escapeHTML, getSortedLines } from './helpers';
+import { escapeHTML } from './helpers';
 import './tooltip.css';
 export const SERIES_NAME_DATA_ATTRIBUTE = 'data-series-name';
 export const SERIES_IDX_DATA_ATTRIBUTE = 'data-series-idx';
@@ -129,9 +129,8 @@ export const formatTooltip = (data, tooltip, isMobile) => {
     var _a, _b, _c;
     const { splitTooltip, activeRowAlwaysFirstInTooltip } = data;
     const lines = data.lines.slice(0, (tooltip.lastVisibleRowIndex || data.lines.length) + 1);
-    const sortedLines = getSortedLines(lines, data.sort);
-    const selectedLineIndex = sortedLines.findIndex(({ selectedSeries }) => selectedSeries);
-    const selectedLine = sortedLines[selectedLineIndex];
+    const selectedLineIndex = lines.findIndex(({ selectedSeries }) => selectedSeries);
+    const selectedLine = lines[selectedLineIndex];
     const withShapes = lines.every((line) => line.seriesShape);
     const unsafe = data.unsafe;
     const tooltipHeaderRaw = (_a = data.tooltipHeader) === null || _a === void 0 ? void 0 : _a.trim();
@@ -213,7 +212,7 @@ export const formatTooltip = (data, tooltip, isMobile) => {
             .join('')}</tr>
                             </thead>`}
                     <tbody class="${TOOLTIP_LIST_CLASS_NAME}">
-                        ${sortedLines
+                        ${lines
         .map((line, index) => renderRow(line, getRowRenderConfig(index)))
         .join('')}
                     </tbody>

package/build/plugins/highcharts/renderer/helpers/tooltip/types.d.ts

@@ -38,15 +38,6 @@ export type TooltipData = {
     /** Sum of the values of the hidden ("not fit" in the tooltip) rows */
     hiddenRowsSum?: number | string;
     unsafe?: boolean;
-    /** Used to manage tooltip lines sorting */
-    sort?: {
-        /** Enable tooltip lines sorting. `false` by default */
-        enabled?: boolean;
-        /** The sort orders. `'desc'` by default */
-        order?: 'asc' | 'desc';
-        /** The iteratees to sort by key(s) from `TooltipLine`. `'originalValue'` by default */
-        iteratee?: keyof TooltipLine | keyof TooltipLine[] | ((line: TooltipLine) => TooltipLine[keyof TooltipLine] | TooltipLine[keyof TooltipLine][]);
-    };
 };
 export type TooltipLine = {
     /** Color displayed in a separate cell */

package/build/plugins/highcharts/types/widget.d.ts

@@ -27,6 +27,14 @@ export type HighchartsManageTooltipConfigOptions = {
     xComments?: TooltipData['xComments'];
 };
 export type HighchartsManageTooltipConfig = (options: HighchartsManageTooltipConfigOptions, chart: Highcharts.Chart) => HighchartsManageTooltipConfigOptions;
+export type HighchartsSortData = {
+    /** Enable tooltip lines sorting. `false` by default */
+    enabled?: boolean;
+    /** The sort orders. `'desc'` by default */
+    order?: 'asc' | 'desc';
+    /** The iteratees to sort by key(s) from `TooltipLine`. `'originalValue'` by default */
+    iteratee?: keyof TooltipLine | keyof TooltipLine[] | ((line: TooltipLine) => TooltipLine[keyof TooltipLine] | TooltipLine[keyof TooltipLine][]);
+};
 export type HighchartsWidgetData = {
     data: (CkHighchartsSeriesOptionsType[] | {
         graphs: CkHighchartsSeriesOptionsType[];
@@ -95,7 +103,7 @@ export type HighchartsWidgetData = {
                 metaKey?: boolean;
             };
             /** Used to manage tooltip lines sorting */
-            sort?: TooltipData['sort'];
+            sort?: HighchartsSortData;
         };
         /**
          * Used to modify tooltip data

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/chartkit",
-  "version": "3.0.0-beta.7",
+  "version": "3.0.0-beta.9",
   "description": "React component used to render charts based on any sources you need",
   "license": "MIT",
   "repository": "git@github.com:gravity-ui/ChartKit.git",
@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "@gravity-ui/date-utils": "^1.4.1",
-    "@gravity-ui/yagr": "^3.3.5",
+    "@gravity-ui/yagr": "^3.3.6",
     "bem-cn-lite": "^4.1.0",
     "highcharts": "^8.2.2",
     "highcharts-react-official": "^3.0.0",