@gravity-ui/chartkit 4.20.1 → 5.0.0

package/build/plugins/d3/renderer/hooks/useShapes/index.js

@@ -1,15 +1,15 @@
 import React from 'react';
 import { group } from 'd3';
 import { getOnlyVisibleSeries } from '../../utils';
+import { AreaSeriesShapes } from './area';
+import { prepareAreaData } from './area/prepare-data';
 import { BarXSeriesShapes, prepareBarXData } from './bar-x';
-import { ScatterSeriesShape, prepareScatterData } from './scatter';
+import { BarYSeriesShapes, prepareBarYData } from './bar-y';
+import { LineSeriesShapes } from './line';
+import { prepareLineData } from './line/prepare-data';
 import { PieSeriesShapes } from './pie';
 import { preparePieData } from './pie/prepare-data';
-import { prepareLineData } from './line/prepare-data';
-import { LineSeriesShapes } from './line';
-import { BarYSeriesShapes, prepareBarYData } from './bar-y';
-import { AreaSeriesShapes } from './area';
-import { prepareAreaData } from './area/prepare-data';
+import { ScatterSeriesShape, prepareScatterData } from './scatter';
 import { TreemapSeriesShape } from './treemap';
 import { prepareTreemapData } from './treemap/prepare-data';
 import './styles.css';

package/build/plugins/d3/renderer/hooks/useShapes/line/index.js

@@ -3,8 +3,8 @@ import { color, line as lineGenerator, select } from 'd3';
 import get from 'lodash/get';
 import { block } from '../../../../../../utils/cn';
 import { filterOverlappingLabels } from '../../../utils';
-import { getLineDashArray, setActiveState } from '../utils';
 import { getMarkerHaloVisibility, getMarkerVisibility, renderMarker, selectMarkerHalo, selectMarkerSymbol, setMarker, } from '../marker';
+import { getLineDashArray, setActiveState } from '../utils';
 const b = block('d3-line');
 export const LineSeriesShapes = (args) => {
     const { dispatcher, preparedData, seriesOptions } = args;

package/build/plugins/d3/renderer/hooks/useShapes/line/prepare-data.d.ts

@@ -1,6 +1,6 @@
-import { PreparedLineSeries } from '../../useSeries/types';
-import { PreparedAxis } from '../../useChartOptions/types';
 import { ChartScale } from '../../useAxisScales';
+import { PreparedAxis } from '../../useChartOptions/types';
+import { PreparedLineSeries } from '../../useSeries/types';
 import { PreparedLineData } from './types';
 export declare const prepareLineData: (args: {
     series: PreparedLineSeries[];

package/build/plugins/d3/renderer/hooks/useShapes/line/prepare-data.js

@@ -1,5 +1,5 @@
-import { getXValue, getYValue } from '../utils';
 import { getLabelsSize, getLeftPosition } from '../../../utils';
+import { getXValue, getYValue } from '../utils';
 function getLabelData(point, series, xMax) {
     const text = String(point.data.label || point.data.y);
     const style = series.dataLabels.style;

package/build/plugins/d3/renderer/hooks/useShapes/line/types.d.ts

@@ -1,7 +1,7 @@
-import { PreparedLineSeries } from '../../useSeries/types';
+import { DashStyle, LineCap } from '../../../../../../constants';
 import { LineSeriesData } from '../../../../../../types';
 import { LabelData } from '../../../types';
-import { DashStyle, LineCap } from '../../../../../../constants';
+import { PreparedLineSeries } from '../../useSeries/types';
 export type PointData = {
     x: number;
     y: number;

package/build/plugins/d3/renderer/hooks/useShapes/marker.d.ts

@@ -1,6 +1,6 @@
 import { BaseType, Selection } from 'd3';
-import { MarkerData as LineMarkerData } from './line/types';
 import { MarkerData as AreaMarkerData } from './area/types';
+import { MarkerData as LineMarkerData } from './line/types';
 import { MarkerData as ScatterMarkerData } from './scatter/types';
 type MarkerData = LineMarkerData | AreaMarkerData | ScatterMarkerData;
 export declare function renderMarker<T extends MarkerData>(selection: Selection<BaseType | SVGGElement, T, SVGGElement, unknown>): Selection<BaseType | SVGGElement, T, SVGGElement, unknown>;

package/build/plugins/d3/renderer/hooks/useShapes/marker.js

@@ -1,8 +1,8 @@
 import { symbol } from 'd3';
-import { block } from '../../../../../utils/cn';
+import get from 'lodash/get';
 import { SymbolType } from '../../../../../constants';
+import { block } from '../../../../../utils/cn';
 import { getSymbol } from '../../utils';
-import get from 'lodash/get';
 const b = block('d3-marker');
 const haloClassName = b('halo');
 const symbolClassName = b('symbol');

package/build/plugins/d3/renderer/hooks/useShapes/pie/index.js

@@ -1,10 +1,9 @@
 import React from 'react';
+import { arc, color, line as lineGenerator, pointer, select } from 'd3';
 import get from 'lodash/get';
-import { arc, color, pointer, select } from 'd3';
 import { block } from '../../../../../../utils/cn';
-import { setActiveState } from '../utils';
-import { line as lineGenerator } from 'd3-shape';
 import { setEllipsisForOverflowTexts } from '../../../utils';
+import { setActiveState } from '../utils';
 import { getCurveFactory } from './utils';
 const b = block('d3-pie');
 export function getHaloVisibility(d) {

package/build/plugins/d3/renderer/hooks/useShapes/pie/types.d.ts

@@ -1,7 +1,7 @@
 import type { PieArcDatum } from 'd3';
-import { PreparedPieSeries } from '../../useSeries/types';
-import { LabelData } from '../../../types';
 import { ConnectorCurve } from '../../../../../../types';
+import { LabelData } from '../../../types';
+import { PreparedPieSeries } from '../../useSeries/types';
 export type SegmentData = {
     value: number;
     color: string;

package/build/plugins/d3/renderer/hooks/useShapes/pie/utils.js

@@ -1,4 +1,4 @@
-import { pie, curveBasis, curveLinear } from 'd3';
+import { curveBasis, curveLinear, pie } from 'd3';
 export const pieGenerator = pie()
     .value((d) => d.value)
     .sort(null);

package/build/plugins/d3/renderer/hooks/useShapes/scatter/index.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import get from 'lodash/get';
 import { pointer, select } from 'd3';
+import get from 'lodash/get';
 import { block } from '../../../../../../utils/cn';
-import { setActiveState, shapeKey } from '../utils';
 import { getMarkerHaloVisibility, renderMarker, selectMarkerHalo, selectMarkerSymbol, setMarker, } from '../marker';
+import { setActiveState, shapeKey } from '../utils';
 export { prepareScatterData } from './prepare-data';
 const b = block('d3-scatter');
 export function ScatterSeriesShape(props) {

package/build/plugins/d3/renderer/hooks/useShapes/treemap/index.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { color, pointer, select } from 'd3';
 import get from 'lodash/get';
-import { setEllipsisForOverflowTexts } from '../../../utils';
 import { block } from '../../../../../../utils/cn';
+import { setEllipsisForOverflowTexts } from '../../../utils';
 const b = block('d3-treemap');
 export const TreemapSeriesShape = (props) => {
     const { dispatcher, preparedData, seriesOptions, svgContainer } = props;

package/build/plugins/d3/renderer/hooks/useShapes/utils.d.ts

@@ -1,8 +1,8 @@
 import type { BaseType } from 'd3';
+import { DashStyle } from '../../../../../constants';
 import type { BasicInactiveState } from '../../../../../types';
 import type { ChartScale } from '../useAxisScales';
 import type { PreparedAxis } from '../useChartOptions/types';
-import { DashStyle } from '../../../../../constants';
 export declare function getXValue(args: {
     point: {
         x?: number | string;

package/build/plugins/d3/renderer/hooks/useTooltip/index.d.ts

@@ -7,7 +7,7 @@ type Args = {
     tooltip: PreparedTooltip;
 };
 export declare const useTooltip: ({ dispatcher, tooltip }: Args) => {
-    hovered: TooltipDataChunk<any>[] | undefined;
+    hovered: TooltipDataChunk[] | undefined;
     pointerPosition: PointerPosition | undefined;
 };
 export {};

package/build/plugins/d3/renderer/utils/axis-generators/bottom.js

@@ -1,7 +1,7 @@
 import { select } from 'd3';
 import { getXAxisItems, getXAxisOffset, getXTickPosition } from '../axis';
-import { getLabelsSize, setEllipsisForOverflowText } from '../text';
 import { calculateCos, calculateSin } from '../math';
+import { getLabelsSize, setEllipsisForOverflowText } from '../text';
 function addDomain(selection, options) {
     const { size, color } = options;
     selection

package/build/plugins/d3/renderer/utils/axis.d.ts

@@ -1,5 +1,5 @@
-import { PreparedAxis } from '../hooks';
 import { AxisDomain, AxisScale, ScaleBand } from 'd3';
+import { PreparedAxis } from '../hooks';
 export declare function getTicksCount({ axis, range }: {
     axis: PreparedAxis;
     range: number;

package/build/plugins/d3/renderer/utils/index.js

@@ -1,12 +1,12 @@
+import { dateTime } from '@gravity-ui/date-utils';
 import { group, select } from 'd3';
 import get from 'lodash/get';
 import isNil from 'lodash/isNil';
-import { dateTime } from '@gravity-ui/date-utils';
 import { formatNumber } from '../../../shared';
-import { DEFAULT_AXIS_LABEL_FONT_SIZE } from '../constants';
 import { getNumberUnitRate } from '../../../shared/format-number/format-number';
-import { getDefaultDateFormat } from './time';
+import { DEFAULT_AXIS_LABEL_FONT_SIZE } from '../constants';
 import { getSeriesStackId } from '../hooks/useSeries/utils';
+import { getDefaultDateFormat } from './time';
 export * from './math';
 export * from './text';
 export * from './time';

package/build/plugins/d3/renderer/utils/symbol.js

@@ -1,4 +1,4 @@
-import { symbolDiamond2, symbolCircle, symbolSquare, symbolTriangle2 } from 'd3';
+import { symbolCircle, symbolDiamond2, symbolSquare, symbolTriangle2 } from 'd3';
 import { SymbolType } from '../../../../constants';
 export const getSymbolType = (index) => {
     const scatterStyles = Object.values(SymbolType);

package/build/plugins/d3/renderer/validation/index.js

@@ -1,8 +1,8 @@
 import get from 'lodash/get';
 import isEmpty from 'lodash/isEmpty';
 import { SeriesType } from '../../../../constants';
-import { ChartKitError, CHARTKIT_ERROR_CODE } from '../../../../libs';
 import { i18n } from '../../../../i18n';
+import { CHARTKIT_ERROR_CODE, ChartKitError } from '../../../../libs';
 import { DEFAULT_AXIS_TYPE } from '../constants';
 const AVAILABLE_SERIES_TYPES = Object.values(SeriesType);
 const validateXYSeries = (args) => {

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import Highcharts, { ChartCallbackFunction, Options, Chart } from 'highcharts';
+import Highcharts, { Chart, ChartCallbackFunction, Options } from 'highcharts';
 import type { ChartKitProps } from '../../../../types';
 import type { HighchartsWidgetData, StringParams } from '../../types';
 import './HighchartsComponent.css';

package/build/plugins/highcharts/renderer/components/HighchartsComponent.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import Highcharts from 'highcharts';
-import HighchartsReact from './HighchartsReact';
 import get from 'lodash/get';
 import { settings } from '../../../../libs';
 import { settingsEventEmitter } from '../../../../libs/settings/settings';
-import { markChartPerformance, getChartPerformanceDuration, getRandomCKId } from '../../../../utils';
+import { getChartPerformanceDuration, getRandomCKId, markChartPerformance } from '../../../../utils';
 import { getGraph } from '../helpers/graph';
 import { initHighchartsLangOptions } from '../helpers/highcharts/highcharts';
+import HighchartsReact from './HighchartsReact';
 import { withSplitPane } from './withSplitPane/withSplitPane';
 import './HighchartsComponent.css';
 const HighcharsReactWithSplitPane = withSplitPane(HighchartsReact);

package/build/plugins/highcharts/renderer/components/HighchartsReact.js

@@ -26,7 +26,13 @@ export const HighchartsReact = React.memo(React.forwardRef(function HighchartsRe
         if (!chartRef.current) {
             createChart();
         }
-    }, [props.options, props.allowChartUpdate, props.containerProps, props.highcharts, props.constructorType]);
+    }, [
+        props.options,
+        props.allowChartUpdate,
+        props.containerProps,
+        props.highcharts,
+        props.constructorType,
+    ]);
     useIsomorphicLayoutEffect(() => {
         return () => {
             if (chartRef.current) {

package/build/plugins/highcharts/renderer/components/StyledSplitPane/StyledSplitPane.css

@@ -1,5 +1,5 @@
 .styled-split-pane__pane-resizer {
-  background: var(--yc-color-base-generic);
+  background: var(--g-color-base-generic);
   z-index: 1;
   box-sizing: border-box;
   position: relative;

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

@@ -1,23 +1,23 @@
 /* eslint new-cap: 0, complexity: 0 */
+import { dateTime } from '@gravity-ui/date-utils';
 import Highcharts from 'highcharts';
-import merge from 'lodash/merge';
-import mergeWith from 'lodash/mergeWith';
-import get from 'lodash/get';
 import clamp from 'lodash/clamp';
+import debounce from 'lodash/debounce';
+import get from 'lodash/get';
 import isEmpty from 'lodash/isEmpty';
 import isNumber from 'lodash/isNumber';
-import throttle from 'lodash/throttle';
+import merge from 'lodash/merge';
+import mergeWith from 'lodash/mergeWith';
 import pick from 'lodash/pick';
-import debounce from 'lodash/debounce';
-import { dateTime } from '@gravity-ui/date-utils';
+import throttle from 'lodash/throttle';
 import { i18n } from '../../../../../i18n';
-import { formatNumber } from '../../../../shared';
 import { block } from '../../../../../utils/cn';
-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, getSortedData, } from './utils';
+import { formatNumber } from '../../../../shared';
+import { drawComments, drawOnlyRendererComments, getCommentsOnLine, hideComments, } from '../comments/drawing';
+import formatTooltip, { SERIES_NAME_DATA_ATTRIBUTE, TOOLTIP_CONTAINER_CLASS_NAME, TOOLTIP_FOOTER_CLASS_NAME, TOOLTIP_HEADER_CLASS_NAME, TOOLTIP_LIST_CLASS_NAME, TOOLTIP_ROW_CLASS_NAME, TOOLTIP_ROW_NAME_CLASS_NANE, } from '../tooltip';
 import { handleLegendItemClick } from './handleLegendItemClick';
+import defaultOptions from './options';
+import { addShowInNavigatorToSeries, buildNavigatorFallback, calculatePrecision, checkTooltipPinningAvailability, concatStrings, getFormatOptionsFromLine, getSortedData, isSafari, isTooltipShared, mergeArrayWithObject, numberFormat, setNavigatorDefaultPeriod, } from './utils';
 import { getChartKitFormattedValue } from './utils/getChartKitFormattedValue';
 const b = block('tooltip');
 const TOOLTIP_OFFSET_FROM_CURSOR = 15;
@@ -159,12 +159,12 @@ export function buildLegend(options) {
             }
         },
         navigation: {
-            activeColor: 'var(--yc-color-base-special)',
-            inactiveColor: 'var(--yc-color-base-generic-accent-disabled)',
-            style: { color: 'var(--yc-color-text-primary)' },
+            activeColor: 'var(--g-color-text-brand)',
+            inactiveColor: 'var(--g-color-base-generic-accent-disabled)',
+            style: { color: 'var(--g-color-text-primary)' },
         },
         title: {
-            style: { color: 'var(--yc-color-text-secondary)' },
+            style: { color: 'var(--g-color-text-secondary)' },
         },
     };
     if (options.outsideLegend) {

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

@@ -1,6 +1,6 @@
+import Highcharts from 'highcharts';
 import { drawComments, hideComments } from '../comments/drawing';
 import { isNavigatorSeries } from './utils';
-import Highcharts from 'highcharts';
 const getSeriesIdentifier = (item) => {
     if (item instanceof Highcharts.Point) {
         return item.name;