@gravity-ui/chartkit 4.8.0 → 4.9.1

package/build/types/widget-data/bar-y.js

@@ -0,0 +1 @@
+export {};

package/build/types/widget-data/base.d.ts

@@ -13,6 +13,10 @@ export type BaseSeries = {
          */
         enabled?: boolean;
         style?: Partial<BaseTextStyle>;
+        /**
+         * @default 5
+         * */
+        padding?: number;
     };
 };
 export type BaseSeriesData<T = any> = {

package/build/types/widget-data/index.d.ts

@@ -11,6 +11,8 @@ export * from './legend';
 export * from './pie';
 export * from './scatter';
 export * from './bar-x';
+export * from './bar-y';
+export * from './line';
 export * from './series';
 export * from './title';
 export * from './tooltip';

package/build/types/widget-data/index.js

@@ -5,6 +5,8 @@ export * from './legend';
 export * from './pie';
 export * from './scatter';
 export * from './bar-x';
+export * from './bar-y';
+export * from './line';
 export * from './series';
 export * from './title';
 export * from './tooltip';

package/build/types/widget-data/line.d.ts

@@ -0,0 +1,37 @@
+import { BaseSeries, BaseSeriesData } from './base';
+import { ChartKitWidgetLegend, RectLegendSymbolOptions } from './legend';
+export type LineSeriesData<T = any> = BaseSeriesData<T> & {
+    /**
+     * The `x` value of the point. Depending on the context , it may represents:
+     * - numeric value (for `linear` x axis)
+     * - timestamp value (for `datetime` x axis)
+     * - x axis category value (for `category` x axis). If the type is a string, then it is a category value itself. If the type is a number, then it is the index of an element in the array of categories described in `xAxis.categories`
+     */
+    x?: string | number;
+    /**
+     * The `y` value of the point. Depending on the context , it may represents:
+     * - numeric value (for `linear` y axis)
+     * - timestamp value (for `datetime` y axis)
+     * - y axis category value (for `category` y axis). If the type is a string, then it is a category value itself. If the type is a number, then it is the index of an element in the array of categories described in `yAxis[0].categories`
+     */
+    y?: string | number;
+    /** Data label value of the point. If not specified, the y value is used. */
+    label?: string | number;
+};
+export type LineSeries<T = any> = BaseSeries & {
+    type: 'line';
+    data: LineSeriesData<T>[];
+    /** The name of the series (used in legend, tooltip etc) */
+    name: string;
+    /** The main color of the series (hex, rgba) */
+    color?: string;
+    /** Pixel width of the graph line.
+     *
+     * @default 1
+     * */
+    lineWidth?: number;
+    /** Individual series legend options. Has higher priority than legend options in widget data */
+    legend?: ChartKitWidgetLegend & {
+        symbol?: RectLegendSymbolOptions;
+    };
+};

package/build/types/widget-data/line.js

@@ -0,0 +1 @@
+export {};

package/build/types/widget-data/series.d.ts

@@ -1,9 +1,11 @@
+import React from 'react';
 import type { PieSeries, PieSeriesData } from './pie';
 import type { ScatterSeries, ScatterSeriesData } from './scatter';
 import type { BarXSeries, BarXSeriesData } from './bar-x';
-import React from 'react';
-export type ChartKitWidgetSeries<T = any> = ScatterSeries<T> | PieSeries<T> | BarXSeries<T>;
-export type ChartKitWidgetSeriesData<T = any> = ScatterSeriesData<T> | PieSeriesData<T> | BarXSeriesData<T>;
+import type { LineSeries, LineSeriesData } from './line';
+import type { BarYSeries, BarYSeriesData } from './bar-y';
+export type ChartKitWidgetSeries<T = any> = ScatterSeries<T> | PieSeries<T> | BarXSeries<T> | BarYSeries<T> | LineSeries<T>;
+export type ChartKitWidgetSeriesData<T = any> = ScatterSeriesData<T> | PieSeriesData<T> | BarXSeriesData<T> | BarYSeriesData<T> | LineSeriesData<T>;
 export type DataLabelRendererData<T = any> = {
     data: ChartKitWidgetSeriesData<T>;
 };
@@ -82,6 +84,42 @@ export type ChartKitWidgetSeriesOptions = {
             inactive?: BasicInactiveState;
         };
     };
+    'bar-y'?: {
+        /** The maximum allowed pixel width for a column.
+         * This prevents the columns from becoming too wide when there is a small number of points in the chart.
+         *
+         * @default 50
+         */
+        barMaxWidth?: number;
+        /** Padding between each column or bar, in x axis units.
+         *
+         * @default 0.1
+         * */
+        barPadding?: number;
+        /** Padding between each value groups, in x axis units
+         *
+         * @default 0.2
+         */
+        groupPadding?: number;
+        dataSorting?: {
+            /** Determines what data value should be used to sort by.
+             * Possible values are undefined to disable, "name" to sort by series name or "x"
+             *
+             * @default undefined
+             * */
+            key?: 'name' | 'x' | undefined;
+            /** Sorting direction.
+             *
+             * @default 'asc'
+             * */
+            direction?: 'asc' | 'desc';
+        };
+        /** Options for the series states that provide additional styling information to the series. */
+        states?: {
+            hover?: BasicHoverState;
+            inactive?: BasicInactiveState;
+        };
+    };
     pie?: {
         /** Options for the series states that provide additional styling information to the series. */
         states?: {
@@ -96,5 +134,17 @@ export type ChartKitWidgetSeriesOptions = {
             inactive?: BasicInactiveState;
         };
     };
+    line?: {
+        /** Pixel width of the graph line.
+         *
+         * @default 1
+         * */
+        lineWidth?: number;
+        /** Options for the series states that provide additional styling information to the series. */
+        states?: {
+            hover?: BasicHoverState;
+            inactive?: BasicInactiveState;
+        };
+    };
 };
 export {};

package/build/types/widget-data/tooltip.d.ts

@@ -2,10 +2,16 @@
 import type { BarXSeries, BarXSeriesData } from './bar-x';
 import type { PieSeries, PieSeriesData } from './pie';
 import type { ScatterSeries, ScatterSeriesData } from './scatter';
+import type { LineSeries, LineSeriesData } from './line';
+import type { BarYSeries, BarYSeriesData } from './bar-y';
 export type TooltipDataChunkBarX<T = any> = {
     data: BarXSeriesData<T>;
     series: BarXSeries<T>;
 };
+export type TooltipDataChunkBarY<T = any> = {
+    data: BarYSeriesData<T>;
+    series: BarYSeries<T>;
+};
 export type TooltipDataChunkPie<T = any> = {
     data: PieSeriesData<T>;
     series: Omit<PieSeries<T>, 'data'>;
@@ -14,7 +20,15 @@ export type TooltipDataChunkScatter<T = any> = {
     data: ScatterSeriesData<T>;
     series: ScatterSeries<T>;
 };
-export type TooltipDataChunk<T = any> = TooltipDataChunkBarX<T> | TooltipDataChunkPie<T> | TooltipDataChunkScatter<T>;
+export type TooltipDataChunkLine<T = any> = {
+    data: LineSeriesData<T>;
+    series: {
+        type: LineSeries['type'];
+        id: string;
+        name: string;
+    };
+};
+export type TooltipDataChunk<T = any> = TooltipDataChunkBarX<T> | TooltipDataChunkBarY<T> | TooltipDataChunkPie<T> | TooltipDataChunkScatter<T> | TooltipDataChunkLine<T>;
 export type ChartKitWidgetTooltip<T = any> = {
     enabled?: boolean;
     /** Specifies the renderer for the tooltip. If returned null default tooltip renderer will be used. */

package/build/utils/index.d.ts

@@ -1,3 +1,3 @@
 export { getRandomCKId, randomString } from './common';
 export { typedMemo } from './react';
-export { getChartPerformanceDuration, markChartPerformance } from './performance';
+export * from './performance';

package/build/utils/index.js

@@ -1,3 +1,3 @@
 export { getRandomCKId, randomString } from './common';
 export { typedMemo } from './react';
-export { getChartPerformanceDuration, markChartPerformance } from './performance';
+export * from './performance';

package/build/utils/performance.d.ts

@@ -1,2 +1,5 @@
 export declare const markChartPerformance: (name: string) => void;
 export declare const getChartPerformanceDuration: (name: string) => number | undefined;
+export declare function measurePerformance(): {
+    end(): number;
+};

package/build/utils/performance.js

@@ -10,3 +10,11 @@ export const getChartPerformanceDuration = (name) => {
     }
     return undefined;
 };
+export function measurePerformance() {
+    const timestamp = performance.now();
+    return {
+        end() {
+            return performance.now() - timestamp;
+        },
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/chartkit",
-  "version": "4.8.0",
+  "version": "4.9.1",
   "description": "React component used to render charts based on any sources you need",
   "license": "MIT",
   "repository": "git@github.com:gravity-ui/ChartKit.git",
@@ -48,7 +48,8 @@
   "dependencies": {
     "@bem-react/classname": "^1.6.0",
     "@gravity-ui/date-utils": "^1.4.1",
-    "@gravity-ui/yagr": "^3.11.0",
+    "@gravity-ui/yagr": "^3.11.1",
+    "afterframe": "^1.0.2",
     "d3": "^7.8.5",
     "lodash": "^4.17.21",
     "react-split-pane": "^0.1.92"