@gravity-ui/chartkit 3.2.0-beta.2 → 3.3.0

package/build/plugins/highcharts/__stories__/combined/ComboChartWithSameLegendValues.stories.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { ChartKit } from '../../../../components/ChartKit';
+import { data } from '../../mocks/combo-chart-with-same-legend-titles';
+import { ChartStory } from '../components/ChartStory';
+export default {
+    title: 'Plugins/Highcharts/Combined Charts',
+    component: ChartKit,
+};
+const Template = () => {
+    return React.createElement(ChartStory, { height: "500px", data: data });
+};
+export const ComboChart = Template.bind({});

package/build/plugins/highcharts/__stories__/complex/TwoAxis.stories.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const TwoAxis: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;

package/build/plugins/highcharts/__stories__/complex/TwoAxis.stories.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { ChartKit } from '../../../../components/ChartKit';
+import { ChartStory } from '../components/ChartStory';
+import { data } from '../../mocks/complex';
+export default {
+    title: 'Plugins/Highcharts/TwoAxis',
+    component: ChartKit,
+};
+const Template = () => {
+    return React.createElement(ChartStory, { data: data, height: "500px" });
+};
+export const TwoAxis = Template.bind({});

package/build/plugins/highcharts/__stories__/components/ChartStory.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { RenderError } from '../../../../types';
+import { HighchartsWidgetData } from '../../types';
+export type ChartStoryProps = {
+    data: HighchartsWidgetData;
+    withoutPlugin?: boolean;
+    visible?: boolean;
+    height?: string;
+    width?: string;
+    renderError?: RenderError;
+};
+export declare const ChartStory: React.FC<ChartStoryProps>;

package/build/plugins/highcharts/__stories__/components/ChartStory.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import { Button } from '@gravity-ui/uikit';
+import { settings } from '../../../../libs';
+import { HighchartsPlugin } from '../../index';
+import holidays from '../../mocks/holidays';
+import { ChartKit } from '../../../../components/ChartKit';
+const DEFAULT_STORY_HEIGHT = '300px';
+const DEFAULT_STORY_WIDTH = '100%';
+export const ChartStory = (props) => {
+    const { height, width, data } = props;
+    const initRef = React.useRef(false);
+    const [visible, setVisible] = React.useState(Boolean(props.visible));
+    const chartKitRef = React.useRef();
+    if (!initRef.current) {
+        if (!props.withoutPlugin) {
+            settings.set({ plugins: [HighchartsPlugin], extra: { holidays } });
+        }
+        initRef.current = true;
+    }
+    if (!visible) {
+        return React.createElement(Button, { onClick: () => setVisible(true) }, "Show chart");
+    }
+    return (React.createElement("div", { style: {
+            height: height || DEFAULT_STORY_HEIGHT,
+            width: width || DEFAULT_STORY_WIDTH,
+        } },
+        React.createElement(ChartKit, { ref: chartKitRef, type: "highcharts", data: data, renderError: props.renderError })));
+};

package/build/plugins/highcharts/__stories__/constants/story-settings.d.ts

@@ -0,0 +1,42 @@
+export declare const defaultChartKitPropsControlsState: {
+    ref: {
+        table: {
+            disable: boolean;
+        };
+    };
+    hoistConfigError: {
+        table: {
+            disable: boolean;
+        };
+    };
+    onError: {
+        table: {
+            disable: boolean;
+        };
+    };
+    data: {
+        table: {
+            disable: boolean;
+        };
+    };
+    type: {
+        table: {
+            disable: boolean;
+        };
+    };
+    id: {
+        table: {
+            disable: boolean;
+        };
+    };
+    isMobile: {
+        table: {
+            disable: boolean;
+        };
+    };
+    onLoad: {
+        table: {
+            disable: boolean;
+        };
+    };
+};

package/build/plugins/highcharts/__stories__/constants/story-settings.js

@@ -0,0 +1,42 @@
+export const defaultChartKitPropsControlsState = {
+    ref: {
+        table: {
+            disable: true,
+        },
+    },
+    hoistConfigError: {
+        table: {
+            disable: true,
+        },
+    },
+    onError: {
+        table: {
+            disable: true,
+        },
+    },
+    data: {
+        table: {
+            disable: true,
+        },
+    },
+    type: {
+        table: {
+            disable: true,
+        },
+    },
+    id: {
+        table: {
+            disable: true,
+        },
+    },
+    isMobile: {
+        table: {
+            disable: true,
+        },
+    },
+    onLoad: {
+        table: {
+            disable: true,
+        },
+    },
+};

package/build/plugins/highcharts/__stories__/custom-error-render/custom-error-render.stories.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const CustomErrorRender: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;

package/build/plugins/highcharts/__stories__/custom-error-render/custom-error-render.stories.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { ChartKit } from '../../../../components/ChartKit';
+import { ChartStory } from '../components/ChartStory';
+import { Button } from '@gravity-ui/uikit';
+import { CHARTKIT_ERROR_CODE, settings } from '../../../../libs';
+import { HighchartsPlugin } from '../../index';
+import holidays from '../../mocks/holidays';
+import { noData, filledData } from '../../mocks/custom-error-render';
+export default {
+    title: 'Plugins/Highcharts/CustomErrorRender',
+    component: ChartKit,
+};
+const Template = () => {
+    const [data, setData] = React.useState(noData);
+    const renderErrorView = React.useCallback(({ error, message, resetError }) => {
+        function renderFixButton() {
+            if (!('code' in error)) {
+                return null;
+            }
+            switch (error.code) {
+                case CHARTKIT_ERROR_CODE.UNKNOWN_PLUGIN:
+                    return (React.createElement(Button, { onClick: () => {
+                            settings.set({ plugins: [HighchartsPlugin], extra: { holidays } });
+                            resetError();
+                        } }, "Add highcharts plugin"));
+                case CHARTKIT_ERROR_CODE.NO_DATA:
+                    return (React.createElement(Button, { onClick: () => {
+                            setData(filledData);
+                        } }, "Add data"));
+                default:
+                    return null;
+            }
+        }
+        return (React.createElement("div", null,
+            React.createElement("h2", null, message),
+            renderFixButton()));
+    }, []);
+    return (React.createElement("div", null,
+        React.createElement(ChartStory, { withoutPlugin: true, data: data, visible: true, renderError: renderErrorView })));
+};
+export const CustomErrorRender = Template.bind({});

package/build/plugins/highcharts/__stories__/no-data/no-data.stories.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const NoData: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;

package/build/plugins/highcharts/__stories__/no-data/no-data.stories.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { ChartKit } from '../../../../components/ChartKit';
+import { noData, filledData } from '../../mocks/no-data';
+import { ChartStory } from '../components/ChartStory';
+import { Button } from '@gravity-ui/uikit';
+export default {
+    title: 'Plugins/Highcharts/NoData',
+    component: ChartKit,
+};
+const Template = () => {
+    const [data, setData] = React.useState(noData);
+    const handleUpdateData = React.useCallback(() => {
+        setData(filledData);
+    }, []);
+    return (React.createElement("div", null,
+        React.createElement("div", { style: { marginBottom: 12 } },
+            React.createElement(Button, { onClick: handleUpdateData }, "Add data")),
+        React.createElement(ChartStory, { data: data, visible: true })));
+};
+export const NoData = Template.bind({});

package/build/plugins/highcharts/__stories__/pie/WithTotals.stories.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const WithTotals: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;

package/build/plugins/highcharts/__stories__/pie/WithTotals.stories.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { ChartKit } from '../../../../components/ChartKit';
+import { data } from '../../mocks/pie-with-totals';
+import { ChartStory } from '../components/ChartStory';
+export default {
+    title: 'Plugins/Highcharts/Pie',
+    component: ChartKit,
+};
+const Template = () => {
+    return React.createElement(ChartStory, { data: data });
+};
+export const WithTotals = Template.bind({});

package/build/plugins/highcharts/__tests__/prepare-data.test.d.ts

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

package/build/plugins/highcharts/__tests__/prepare-data.test.js

@@ -0,0 +1,13 @@
+import { prepareData } from '../renderer/helpers/prepare-data';
+import { data } from '../mocks/line';
+describe('plugins/highcharts/helpers', () => {
+    describe('prepareData', () => {
+        it('should not throw an error', () => {
+            expect(() => prepareData(data.data, data.config)).not.toThrowError();
+        });
+        it('should throw an error', () => {
+            const configWithLinesLimit = Object.assign(Object.assign({}, data.config), { linesLimit: 1 });
+            expect(() => prepareData(data.data, configWithLinesLimit)).toThrowError();
+        });
+    });
+});

package/build/plugins/indicator/__stories__/Indicator.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta } from '@storybook/react';
+export declare const Showcase: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+declare const meta: Meta;
+export default meta;

package/build/plugins/indicator/__stories__/Indicator.stories.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import { withKnobs, boolean, color as colorKnob, radios, text } from '@storybook/addon-knobs';
+import { cloneDeep } from 'lodash';
+import { Button } from '@gravity-ui/uikit';
+import { settings } from '../../../libs';
+import { ChartKit } from '../../../components/ChartKit';
+import { IndicatorPlugin } from '../';
+const data = {
+    data: [
+        {
+            content: {
+                current: {
+                    value: 1539577973,
+                },
+            },
+        },
+    ],
+};
+const Template = () => {
+    const [shown, setShown] = React.useState(false);
+    const chartkitRef = React.useRef();
+    const color = colorKnob('color', '#4da2f1');
+    const size = radios('size', { s: 's', m: 'm', l: 'l', xl: 'xl' }, 'm');
+    const title = text('title', 'Value title');
+    const nowrap = boolean('nowrap', false);
+    const resultData = cloneDeep(data);
+    if (resultData.data) {
+        resultData.data[0].size = size;
+        resultData.data[0].color = color;
+        resultData.data[0].title = title;
+        resultData.data[0].nowrap = nowrap;
+    }
+    if (!shown) {
+        settings.set({ plugins: [IndicatorPlugin] });
+        return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
+    }
+    return (React.createElement("div", { style: { height: 300, width: '100%' } },
+        React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "indicator", data: resultData })));
+};
+export const Showcase = Template.bind({});
+const meta = {
+    title: 'Plugins/Indicator',
+    decorators: [withKnobs],
+};
+export default meta;

package/build/plugins/yagr/__stories__/Yagr.stories.d.ts

@@ -0,0 +1,6 @@
+import '@gravity-ui/yagr/dist/index.css';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Line: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Updates: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const CustomTooltip: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;

package/build/plugins/yagr/__stories__/Yagr.stories.js

@@ -0,0 +1,90 @@
+import React, { useEffect, useState } from 'react';
+import { Button } from '@gravity-ui/uikit';
+import { settings } from '../../../libs';
+import { YagrPlugin } from '../../../plugins';
+import { ChartKit } from '../../../components/ChartKit';
+import { getNewConfig, line10 } from './mocks/line10';
+import '@gravity-ui/yagr/dist/index.css';
+import placement from '@gravity-ui/yagr/dist/YagrCore/plugins/tooltip/placement';
+import { dateTime } from '@gravity-ui/date-utils';
+export default {
+    title: 'Plugins/Yagr',
+    component: ChartKit,
+};
+const LineTemplate = () => {
+    const [shown, setShown] = React.useState(false);
+    const chartkitRef = React.useRef();
+    if (!shown) {
+        settings.set({ plugins: [YagrPlugin] });
+        return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
+    }
+    return (React.createElement("div", { style: { height: 300, width: '100%' } },
+        React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "yagr", data: line10 })));
+};
+const UpdatesTemplate = () => {
+    const [shown, setShown] = React.useState(false);
+    const chartkitRef = React.useRef();
+    const [state, setState] = React.useState(line10);
+    const onStartUpdates = React.useCallback(() => {
+        setInterval(() => {
+            setState(getNewConfig());
+        }, 1000);
+    }, []);
+    if (!shown) {
+        settings.set({ plugins: [YagrPlugin] });
+        return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
+    }
+    return (React.createElement("div", { style: { height: 300, width: '100%' } },
+        React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "yagr", data: state }),
+        React.createElement(Button, { onClick: onStartUpdates }, "Start Updates"),
+        React.createElement(Button, { onClick: () => setState(getNewConfig()) }, "Once")));
+};
+function Tooltip({ yagr }) {
+    const [x, setX] = useState(null);
+    const [visible, setVisible] = useState(false);
+    const tooltipRef = React.useRef(null);
+    useEffect(() => {
+        var _a, _b, _c;
+        if (!yagr) {
+            return;
+        }
+        const onChange = (_, data) => {
+            var _a, _b;
+            setX((_a = data.data) === null || _a === void 0 ? void 0 : _a.x);
+            setVisible(data.state.visible);
+            if (data.state.visible && tooltipRef.current && ((_b = data.data) === null || _b === void 0 ? void 0 : _b.anchor)) {
+                placement(tooltipRef.current, data.data.anchor, 'right', {
+                    xOffset: 24,
+                    yOffset: 24,
+                });
+            }
+        };
+        (_a = yagr.plugins.tooltip) === null || _a === void 0 ? void 0 : _a.on('render', onChange);
+        (_b = yagr.plugins.tooltip) === null || _b === void 0 ? void 0 : _b.on('show', onChange);
+        (_c = yagr.plugins.tooltip) === null || _c === void 0 ? void 0 : _c.on('hide', onChange);
+    }, [yagr]);
+    if (!visible) {
+        return null;
+    }
+    return (React.createElement("div", { style: {
+            zIndex: 1000,
+            backgroundColor: 'white',
+            padding: 8,
+            pointerEvents: 'none',
+        }, ref: tooltipRef }, dateTime({ input: x !== null && x !== void 0 ? x : 0 }).format('DD MMMM YYYY HH:mm:ss')));
+}
+const CustomTooltipImpl = () => {
+    const [shown, setShown] = React.useState(false);
+    const chartkitRef = React.useRef();
+    const [state, setState] = React.useState(line10);
+    if (!shown) {
+        settings.set({ plugins: [YagrPlugin] });
+        return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
+    }
+    return (React.createElement("div", { style: { height: 300, width: '100%' } },
+        React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "yagr", data: state, tooltip: (props) => React.createElement(Tooltip, Object.assign({}, props)) }),
+        React.createElement(Button, { onClick: () => setState(getNewConfig()) }, "Change data")));
+};
+export const Line = LineTemplate.bind({});
+export const Updates = UpdatesTemplate.bind({});
+export const CustomTooltip = CustomTooltipImpl.bind({});

package/build/plugins/yagr/__stories__/mocks/line10.d.ts

@@ -0,0 +1,53 @@
+import type { YagrWidgetData } from '../../types';
+export declare const line10: YagrWidgetData;
+export declare const getNewConfig: () => {
+    libraryConfig: {
+        title: {
+            text: string;
+        };
+        chart?: import("@gravity-ui/yagr/dist/YagrCore/types").YagrChartOptions | undefined;
+        legend?: import("@gravity-ui/yagr/dist/YagrCore/plugins/legend/legend").LegendOptions | undefined;
+        axes?: Record<string, import("@gravity-ui/yagr/dist/YagrCore/types").AxisOptions> | undefined;
+        cursor?: import("@gravity-ui/yagr/dist/YagrCore/plugins/cursor/cursor").CursorOptions | undefined;
+        timeline?: number[] | undefined;
+        tooltip?: Partial<import("@gravity-ui/yagr/dist/YagrCore/plugins/tooltip/types").TooltipOptions> | undefined;
+        grid?: import("uplot").Axis.Grid | undefined;
+        markers?: import("@gravity-ui/yagr/dist/YagrCore/types").MarkersOptions | undefined;
+        scales?: Record<string, import("@gravity-ui/yagr/dist/YagrCore/types").Scale> | undefined;
+        series?: import("@gravity-ui/yagr/dist/YagrCore/types").RawSerieData<Omit<import("@gravity-ui/yagr/dist/YagrCore/types").SeriesOptions, "type"> & {
+            type?: import("@gravity-ui/yagr/dist/YagrCore/types").ChartType | undefined;
+        }>[] | undefined;
+        hooks?: import("@gravity-ui/yagr/dist/YagrCore/types").YagrHooks | undefined;
+        processing?: import("@gravity-ui/yagr/dist/YagrCore/types").ProcessingSettings | undefined;
+        editUplotOptions?: ((opts: import("uplot").Options) => import("uplot").Options) | undefined;
+        plugins?: Record<string, import("@gravity-ui/yagr/dist/YagrCore/types").YagrPlugin<{}, []>> | undefined;
+    };
+    data: {
+        timeline: number[];
+        graphs: {
+            data: number[];
+            name?: string | undefined;
+            id?: string | undefined;
+            scale?: string | undefined;
+            focus?: boolean | undefined;
+            title?: string | ((sIdx: number) => string) | undefined;
+            show?: boolean | undefined;
+            color?: string | undefined;
+            spanGaps?: boolean | undefined;
+            cursorOptions?: Pick<import("@gravity-ui/yagr/dist/YagrCore/plugins/cursor/cursor").CursorOptions, "snapToValues" | "markersSize"> | undefined;
+            formatter?: ((value: string | number | null, serie: import("uplot").Series) => string) | undefined;
+            precision?: number | undefined;
+            snapToValues?: false | import("@gravity-ui/yagr/dist/YagrCore/types").SnapToValue | undefined;
+            stackGroup?: number | undefined;
+            transform?: ((val: string | number | null, series: import("@gravity-ui/yagr/dist/YagrCore/types").DataSeries[], idx: number) => number | null) | undefined;
+            showInTooltip?: boolean | undefined;
+            postProcess?: ((data: (number | null)[], idx: number, y: import("@gravity-ui/yagr/dist/YagrCore").default<import("@gravity-ui/yagr/dist/YagrCore/types").MinimalValidConfig>) => (number | null)[]) | undefined;
+            type?: import("@gravity-ui/yagr/dist/YagrCore/types").ChartType | undefined;
+        }[];
+    };
+    sources?: Record<number, {
+        data: {
+            program: string;
+        };
+    }> | undefined;
+};

package/build/plugins/yagr/__stories__/mocks/line10.js

@@ -0,0 +1,78 @@
+export const line10 = {
+    data: {
+        timeline: [
+            1636838612441, 1636925012441, 1637011412441, 1637097812441, 1637184212441,
+            1637270612441, 1637357012441, 1637443412441, 1637529812441, 1637616212441,
+        ],
+        graphs: [
+            {
+                id: '0',
+                name: 'Serie 1',
+                color: '#6c59c2',
+                data: [45, 52, 89, 72, 39, 49, 82, 59, 36, 5],
+            },
+            {
+                id: '1',
+                name: 'Serie 2',
+                color: '#6e8188',
+                data: [37, 6, 51, 10, 65, 35, 72, 0, 94, 54],
+            },
+            {
+                id: '2',
+                name: 'Serie 3',
+                color: '#e21576',
+                data: [26, 54, 15, 40, 43, 18, 65, 46, 51, 33],
+            },
+        ],
+    },
+    libraryConfig: {
+        chart: {
+            series: {
+                type: 'line',
+            },
+            select: {
+                zoom: false,
+            },
+        },
+        title: {
+            text: 'line: random 10 pts',
+        },
+        axes: {
+            x: {},
+        },
+        scales: {
+            x: {},
+            y: {
+                type: 'linear',
+                range: 'nice',
+            },
+        },
+        cursor: {
+            x: {
+                visible: true,
+                style: 'solid 2px rgba(230, 2, 7, 0.3)',
+            },
+        },
+        tooltip: {
+            show: true,
+            tracking: 'sticky',
+        },
+        legend: {},
+        processing: {},
+    },
+};
+export const getNewConfig = () => {
+    const startPoint = (Math.random() * 10 ** 5) >> 0; // eslint-disable-line no-bitwise
+    return Object.assign(Object.assign({}, line10), { libraryConfig: Object.assign(Object.assign({}, line10.libraryConfig), { title: {
+                text: 'line: random 100 pts',
+            } }), data: {
+            timeline: new Array(100).fill(0).map((_, i) => {
+                return startPoint + i * 1000;
+            }),
+            graphs: line10.data.graphs.map((graph) => {
+                return Object.assign(Object.assign({}, graph), { data: new Array(100).fill(0).map(() => {
+                        return (Math.random() * 100) >> 0; // eslint-disable-line no-bitwise
+                    }) });
+            }),
+        } });
+};

package/build/plugins/yagr/__tests__/utils.test.d.ts

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

package/build/plugins/yagr/__tests__/utils.test.js

@@ -0,0 +1,26 @@
+import { shapeYagrConfig } from '../renderer/utils';
+const DATA = {
+    timeline: [1],
+    graphs: [{ data: [45] }],
+};
+describe('plugins/yagr/utils', () => {
+    describe('shapeYagrConfig > check chart property', () => {
+        test.each([
+            [{}, { appearance: { locale: 'en', theme: 'dark' } }],
+            [{ appearance: { locale: 'ru' } }, { appearance: { locale: 'ru', theme: 'dark' } }],
+            [{ appearance: { theme: 'light' } }, { appearance: { locale: 'en', theme: 'light' } }],
+            [
+                { series: { type: 'dots' }, select: { zoom: false }, timeMultiplier: 1 },
+                {
+                    appearance: { locale: 'en', theme: 'dark' },
+                    series: { type: 'dots' },
+                    select: { zoom: false },
+                    timeMultiplier: 1,
+                },
+            ],
+        ])('(args: %j)', (chart, expected) => {
+            const config = shapeYagrConfig({ data: DATA, libraryConfig: { chart }, theme: 'dark' });
+            expect(config.chart).toEqual(expected);
+        });
+    });
+});

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

@@ -21,4 +21,22 @@ export type ChartKitWidgetAxis = {
     };
     /** The minimum value of the axis. If undefined the min value is automatically calculate */
     min?: number;
+    grid?: {
+        /** Enable or disable the grid lines.
+         *
+         * Defaults to true.
+         * */
+        enabled?: boolean;
+    };
+    ticks?: {
+        /** Pixel interval of the tick marks. Not applicable to categorized axis.
+         * The specified value is only a hint; the interval between ticks can be greater or less depending on the data. */
+        pixelInterval?: number;
+    };
+    /** Padding of the max value relative to the length of the axis.
+     * A padding of 0.05 will make a 100px axis 5px longer.
+     *
+     * Defaults to 0.05 for Y axis and to 0.01 for X axis
+     * */
+    maxPadding?: number;
 };

package/build/types/widget-data/{bar.d.ts → bar-x.d.ts}

@@ -1,6 +1,6 @@
 import type { BaseSeries, BaseSeriesData } from './base';
 import type { ChartKitWidgetSeriesOptions } from './series';
-export type BarSeriesData<T = any> = BaseSeriesData<T> & {
+export type BarXSeriesData<T = any> = BaseSeriesData<T> & {
     /** The x value of the point */
     x?: number;
     /** The y value of the point */
@@ -8,9 +8,9 @@ export type BarSeriesData<T = any> = BaseSeriesData<T> & {
     /** Corresponding value of axis category */
     category?: string;
 };
-export type BarSeries<T = any> = BaseSeries & {
-    type: 'bar';
-    data: BarSeriesData<T>[];
+export type BarXSeries<T = any> = BaseSeries & {
+    type: 'bar-x';
+    data: BarXSeriesData<T>[];
     /** The name of the series (used in legend) */
     name: string;
     /** The main color of the series (hex, rgba) */

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

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

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

@@ -10,7 +10,7 @@ export * from './chart';
 export * from './legend';
 export * from './pie';
 export * from './scatter';
-export * from './bar';
+export * from './bar-x';
 export * from './series';
 export * from './title';
 export * from './tooltip';

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

@@ -4,7 +4,7 @@ export * from './chart';
 export * from './legend';
 export * from './pie';
 export * from './scatter';
-export * from './bar';
+export * from './bar-x';
 export * from './series';
 export * from './title';
 export * from './tooltip';