@gravity-ui/chartkit 3.1.3 → 3.2.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/plugins/d3/index.d.ts +7 -0
- package/build/plugins/d3/index.js +10 -0
- package/build/plugins/d3/renderer/D3Widget.d.ts +15 -0
- package/build/plugins/d3/renderer/D3Widget.js +40 -0
- package/build/plugins/d3/renderer/components/AxisX.d.ts +10 -0
- package/build/plugins/d3/renderer/components/AxisX.js +68 -0
- package/build/plugins/d3/renderer/components/AxisY.d.ts +10 -0
- package/build/plugins/d3/renderer/components/AxisY.js +73 -0
- package/build/plugins/d3/renderer/components/Chart.d.ts +10 -0
- package/build/plugins/d3/renderer/components/Chart.js +64 -0
- package/build/plugins/d3/renderer/components/Legend.d.ts +12 -0
- package/build/plugins/d3/renderer/components/Legend.js +66 -0
- package/build/plugins/d3/renderer/components/Title.d.ts +7 -0
- package/build/plugins/d3/renderer/components/Title.js +8 -0
- package/build/plugins/d3/renderer/components/Tooltip/DefaultContent.d.ts +10 -0
- package/build/plugins/d3/renderer/components/Tooltip/DefaultContent.js +21 -0
- package/build/plugins/d3/renderer/components/Tooltip/index.d.ts +12 -0
- package/build/plugins/d3/renderer/components/Tooltip/index.js +53 -0
- package/build/plugins/d3/renderer/components/index.d.ts +1 -0
- package/build/plugins/d3/renderer/components/index.js +1 -0
- package/build/plugins/d3/renderer/components/styles.css +61 -0
- package/build/plugins/d3/renderer/constants.d.ts +1 -0
- package/build/plugins/d3/renderer/constants.js +22 -0
- package/build/plugins/d3/renderer/hooks/index.d.ts +10 -0
- package/build/plugins/d3/renderer/hooks/index.js +10 -0
- package/build/plugins/d3/renderer/hooks/useChartDimensions/index.d.ts +17 -0
- package/build/plugins/d3/renderer/hooks/useChartDimensions/index.js +13 -0
- package/build/plugins/d3/renderer/hooks/useChartEvents/index.d.ts +5 -0
- package/build/plugins/d3/renderer/hooks/useChartEvents/index.js +15 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/chart.d.ts +8 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/chart.js +60 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/constants.d.ts +3 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/constants.js +3 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/index.d.ts +3 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/index.js +32 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/legend.d.ts +6 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/legend.js +7 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/title.d.ts +5 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/title.js +17 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/tooltip.d.ts +5 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/tooltip.js +5 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/types.d.ts +33 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/utils.d.ts +5 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/utils.js +18 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/x-axis.d.ts +5 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/x-axis.js +29 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/y-axis.d.ts +5 -0
- package/build/plugins/d3/renderer/hooks/useChartOptions/y-axis.js +35 -0
- package/build/plugins/d3/renderer/hooks/useLegend/index.d.ts +13 -0
- package/build/plugins/d3/renderer/hooks/useLegend/index.js +28 -0
- package/build/plugins/d3/renderer/hooks/useScales/index.d.ts +17 -0
- package/build/plugins/d3/renderer/hooks/useScales/index.js +106 -0
- package/build/plugins/d3/renderer/hooks/useSeries/index.d.ts +14 -0
- package/build/plugins/d3/renderer/hooks/useSeries/index.js +23 -0
- package/build/plugins/d3/renderer/hooks/useShapes/bar.d.ts +16 -0
- package/build/plugins/d3/renderer/hooks/useShapes/bar.js +75 -0
- package/build/plugins/d3/renderer/hooks/useShapes/index.d.ts +19 -0
- package/build/plugins/d3/renderer/hooks/useShapes/index.js +44 -0
- package/build/plugins/d3/renderer/hooks/useShapes/scatter.d.ts +18 -0
- package/build/plugins/d3/renderer/hooks/useShapes/scatter.js +62 -0
- package/build/plugins/d3/renderer/hooks/useTooltip/index.d.ts +13 -0
- package/build/plugins/d3/renderer/hooks/useTooltip/index.js +19 -0
- package/build/plugins/d3/renderer/hooks/useTooltip/types.d.ts +7 -0
- package/build/plugins/d3/renderer/utils/index.d.ts +18 -0
- package/build/plugins/d3/renderer/utils/index.js +71 -0
- package/build/plugins/d3/types.d.ts +4 -0
- package/build/types/widget-data/axis.d.ts +24 -0
- package/build/types/widget-data/bar.d.ts +31 -0
- package/build/types/widget-data/base.d.ts +15 -0
- package/build/types/widget-data/base.js +1 -0
- package/build/types/widget-data/chart.d.ts +9 -0
- package/build/types/widget-data/chart.js +1 -0
- package/build/types/widget-data/index.d.ts +28 -0
- package/build/types/widget-data/index.js +10 -0
- package/build/types/widget-data/legend.d.ts +3 -0
- package/build/types/widget-data/legend.js +1 -0
- package/build/types/widget-data/pie.d.ts +10 -0
- package/build/types/widget-data/pie.js +1 -0
- package/build/types/widget-data/scatter.d.ts +20 -0
- package/build/types/widget-data/scatter.js +1 -0
- package/build/types/widget-data/series.d.ts +18 -0
- package/build/types/widget-data/series.js +1 -0
- package/build/types/widget-data/title.d.ts +5 -0
- package/build/types/widget-data/title.js +1 -0
- package/build/types/widget-data/tooltip.d.ts +12 -0
- package/build/types/widget-data/tooltip.js +1 -0
- package/build/types/widget.d.ts +5 -0
- package/package.json +10 -3
- package/build/libs/chartkit-error/__tests__/chartkit-error.js +0 -27
- package/build/libs/settings/__tests__/settings.test.js +0 -17
- package/build/plugins/highcharts/__stories__/Line.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/Line.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/Pie.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/Pie.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/area/Range.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/area/Range.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/area/Stacked.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/area/Stacked.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/column/HorizontalStacked.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/column/HorizontalStacked.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/column/Vertical.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/column/Vertical.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/column/VerticalStacked.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/column/VerticalStacked.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/combined/ComboChartWithSameLegendValues.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/combined/ComboChartWithSameLegendValues.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/complex/TwoAxis.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/complex/TwoAxis.stories.js +0 -12
- package/build/plugins/highcharts/__stories__/components/ChartStory.d.ts +0 -12
- package/build/plugins/highcharts/__stories__/components/ChartStory.js +0 -28
- package/build/plugins/highcharts/__stories__/constants/story-settings.d.ts +0 -42
- package/build/plugins/highcharts/__stories__/constants/story-settings.js +0 -42
- package/build/plugins/highcharts/__stories__/custom-error-render/custom-error-render.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/custom-error-render/custom-error-render.stories.js +0 -41
- package/build/plugins/highcharts/__stories__/no-data/no-data.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/no-data/no-data.stories.js +0 -20
- package/build/plugins/highcharts/__stories__/pie/WithTotals.stories.d.ts +0 -3
- package/build/plugins/highcharts/__stories__/pie/WithTotals.stories.js +0 -12
- package/build/plugins/highcharts/__tests__/prepare-data.test.js +0 -13
- package/build/plugins/indicator/__stories__/Indicator.stories.d.ts +0 -4
- package/build/plugins/indicator/__stories__/Indicator.stories.js +0 -45
- package/build/plugins/yagr/__stories__/Yagr.stories.d.ts +0 -6
- package/build/plugins/yagr/__stories__/Yagr.stories.js +0 -90
- package/build/plugins/yagr/__stories__/mocks/line10.d.ts +0 -53
- package/build/plugins/yagr/__stories__/mocks/line10.js +0 -78
- package/build/plugins/yagr/__tests__/utils.test.js +0 -26
- package/build/utils/__tests__/common.test.js +0 -9
- /package/build/{libs/chartkit-error/__tests__/chartkit-error.d.ts → plugins/d3/renderer/hooks/useChartOptions/types.js} +0 -0
- /package/build/{libs/settings/__tests__/settings.test.d.ts → plugins/d3/renderer/hooks/useTooltip/types.js} +0 -0
- /package/build/plugins/{highcharts/__tests__/prepare-data.test.d.ts → d3/types.js} +0 -0
- /package/build/{plugins/yagr/__tests__/utils.test.d.ts → types/widget-data/axis.js} +0 -0
- /package/build/{utils/__tests__/common.test.d.ts → types/widget-data/bar.js} +0 -0
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../components/ChartKit';
|
|
3
|
-
import { data } from '../mocks/pie';
|
|
4
|
-
import { ChartStory } from './components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Pie',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data });
|
|
11
|
-
};
|
|
12
|
-
export const Pie = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const AreaRange: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { data } from '../../mocks/area-range';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Area',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data });
|
|
11
|
-
};
|
|
12
|
-
export const AreaRange = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const AreaStacked: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { data } from '../../mocks/area-stacked';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Area',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data, height: "500px" });
|
|
11
|
-
};
|
|
12
|
-
export const AreaStacked = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const HorizontalStacked: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { data } from '../../mocks/column-hor-stacked';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Column',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data });
|
|
11
|
-
};
|
|
12
|
-
export const HorizontalStacked = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const Vertical: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { data } from '../../mocks/column-ver';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Column',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data });
|
|
11
|
-
};
|
|
12
|
-
export const Vertical = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const VerticalStacked: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { data } from '../../mocks/column-ver-stacked';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Column',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data });
|
|
11
|
-
};
|
|
12
|
-
export const VerticalStacked = Template.bind({});
|
package/build/plugins/highcharts/__stories__/combined/ComboChartWithSameLegendValues.stories.d.ts
DELETED
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const ComboChart: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
package/build/plugins/highcharts/__stories__/combined/ComboChartWithSameLegendValues.stories.js
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { data } from '../../mocks/combo-chart-with-same-legend-titles';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Combined Charts',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { height: "500px", data: data });
|
|
11
|
-
};
|
|
12
|
-
export const ComboChart = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const TwoAxis: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { ChartStory } from '../components/ChartStory';
|
|
4
|
-
import { data } from '../../mocks/complex';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/TwoAxis',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data, height: "500px" });
|
|
11
|
-
};
|
|
12
|
-
export const TwoAxis = Template.bind({});
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { RenderError } from '../../../../types';
|
|
3
|
-
import { HighchartsWidgetData } from '../../types';
|
|
4
|
-
export type ChartStoryProps = {
|
|
5
|
-
data: HighchartsWidgetData;
|
|
6
|
-
withoutPlugin?: boolean;
|
|
7
|
-
visible?: boolean;
|
|
8
|
-
height?: string;
|
|
9
|
-
width?: string;
|
|
10
|
-
renderError?: RenderError;
|
|
11
|
-
};
|
|
12
|
-
export declare const ChartStory: React.FC<ChartStoryProps>;
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Button } from '@gravity-ui/uikit';
|
|
3
|
-
import { settings } from '../../../../libs';
|
|
4
|
-
import { HighchartsPlugin } from '../../index';
|
|
5
|
-
import holidays from '../../mocks/holidays';
|
|
6
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
7
|
-
const DEFAULT_STORY_HEIGHT = '300px';
|
|
8
|
-
const DEFAULT_STORY_WIDTH = '100%';
|
|
9
|
-
export const ChartStory = (props) => {
|
|
10
|
-
const { height, width, data } = props;
|
|
11
|
-
const initRef = React.useRef(false);
|
|
12
|
-
const [visible, setVisible] = React.useState(Boolean(props.visible));
|
|
13
|
-
const chartKitRef = React.useRef();
|
|
14
|
-
if (!initRef.current) {
|
|
15
|
-
if (!props.withoutPlugin) {
|
|
16
|
-
settings.set({ plugins: [HighchartsPlugin], extra: { holidays } });
|
|
17
|
-
}
|
|
18
|
-
initRef.current = true;
|
|
19
|
-
}
|
|
20
|
-
if (!visible) {
|
|
21
|
-
return React.createElement(Button, { onClick: () => setVisible(true) }, "Show chart");
|
|
22
|
-
}
|
|
23
|
-
return (React.createElement("div", { style: {
|
|
24
|
-
height: height || DEFAULT_STORY_HEIGHT,
|
|
25
|
-
width: width || DEFAULT_STORY_WIDTH,
|
|
26
|
-
} },
|
|
27
|
-
React.createElement(ChartKit, { ref: chartKitRef, type: "highcharts", data: data, renderError: props.renderError })));
|
|
28
|
-
};
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
export declare const defaultChartKitPropsControlsState: {
|
|
2
|
-
ref: {
|
|
3
|
-
table: {
|
|
4
|
-
disable: boolean;
|
|
5
|
-
};
|
|
6
|
-
};
|
|
7
|
-
hoistConfigError: {
|
|
8
|
-
table: {
|
|
9
|
-
disable: boolean;
|
|
10
|
-
};
|
|
11
|
-
};
|
|
12
|
-
onError: {
|
|
13
|
-
table: {
|
|
14
|
-
disable: boolean;
|
|
15
|
-
};
|
|
16
|
-
};
|
|
17
|
-
data: {
|
|
18
|
-
table: {
|
|
19
|
-
disable: boolean;
|
|
20
|
-
};
|
|
21
|
-
};
|
|
22
|
-
type: {
|
|
23
|
-
table: {
|
|
24
|
-
disable: boolean;
|
|
25
|
-
};
|
|
26
|
-
};
|
|
27
|
-
id: {
|
|
28
|
-
table: {
|
|
29
|
-
disable: boolean;
|
|
30
|
-
};
|
|
31
|
-
};
|
|
32
|
-
isMobile: {
|
|
33
|
-
table: {
|
|
34
|
-
disable: boolean;
|
|
35
|
-
};
|
|
36
|
-
};
|
|
37
|
-
onLoad: {
|
|
38
|
-
table: {
|
|
39
|
-
disable: boolean;
|
|
40
|
-
};
|
|
41
|
-
};
|
|
42
|
-
};
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
export const defaultChartKitPropsControlsState = {
|
|
2
|
-
ref: {
|
|
3
|
-
table: {
|
|
4
|
-
disable: true,
|
|
5
|
-
},
|
|
6
|
-
},
|
|
7
|
-
hoistConfigError: {
|
|
8
|
-
table: {
|
|
9
|
-
disable: true,
|
|
10
|
-
},
|
|
11
|
-
},
|
|
12
|
-
onError: {
|
|
13
|
-
table: {
|
|
14
|
-
disable: true,
|
|
15
|
-
},
|
|
16
|
-
},
|
|
17
|
-
data: {
|
|
18
|
-
table: {
|
|
19
|
-
disable: true,
|
|
20
|
-
},
|
|
21
|
-
},
|
|
22
|
-
type: {
|
|
23
|
-
table: {
|
|
24
|
-
disable: true,
|
|
25
|
-
},
|
|
26
|
-
},
|
|
27
|
-
id: {
|
|
28
|
-
table: {
|
|
29
|
-
disable: true,
|
|
30
|
-
},
|
|
31
|
-
},
|
|
32
|
-
isMobile: {
|
|
33
|
-
table: {
|
|
34
|
-
disable: true,
|
|
35
|
-
},
|
|
36
|
-
},
|
|
37
|
-
onLoad: {
|
|
38
|
-
table: {
|
|
39
|
-
disable: true,
|
|
40
|
-
},
|
|
41
|
-
},
|
|
42
|
-
};
|
package/build/plugins/highcharts/__stories__/custom-error-render/custom-error-render.stories.d.ts
DELETED
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
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
DELETED
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { ChartStory } from '../components/ChartStory';
|
|
4
|
-
import { Button } from '@gravity-ui/uikit';
|
|
5
|
-
import { CHARTKIT_ERROR_CODE, settings } from '../../../../libs';
|
|
6
|
-
import { HighchartsPlugin } from '../../index';
|
|
7
|
-
import holidays from '../../mocks/holidays';
|
|
8
|
-
import { noData, filledData } from '../../mocks/custom-error-render';
|
|
9
|
-
export default {
|
|
10
|
-
title: 'Plugins/Highcharts/CustomErrorRender',
|
|
11
|
-
component: ChartKit,
|
|
12
|
-
};
|
|
13
|
-
const Template = () => {
|
|
14
|
-
const [data, setData] = React.useState(noData);
|
|
15
|
-
const renderErrorView = React.useCallback(({ error, message, resetError }) => {
|
|
16
|
-
function renderFixButton() {
|
|
17
|
-
if (!('code' in error)) {
|
|
18
|
-
return null;
|
|
19
|
-
}
|
|
20
|
-
switch (error.code) {
|
|
21
|
-
case CHARTKIT_ERROR_CODE.UNKNOWN_PLUGIN:
|
|
22
|
-
return (React.createElement(Button, { onClick: () => {
|
|
23
|
-
settings.set({ plugins: [HighchartsPlugin], extra: { holidays } });
|
|
24
|
-
resetError();
|
|
25
|
-
} }, "Add highcharts plugin"));
|
|
26
|
-
case CHARTKIT_ERROR_CODE.NO_DATA:
|
|
27
|
-
return (React.createElement(Button, { onClick: () => {
|
|
28
|
-
setData(filledData);
|
|
29
|
-
} }, "Add data"));
|
|
30
|
-
default:
|
|
31
|
-
return null;
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
return (React.createElement("div", null,
|
|
35
|
-
React.createElement("h2", null, message),
|
|
36
|
-
renderFixButton()));
|
|
37
|
-
}, []);
|
|
38
|
-
return (React.createElement("div", null,
|
|
39
|
-
React.createElement(ChartStory, { withoutPlugin: true, data: data, visible: true, renderError: renderErrorView })));
|
|
40
|
-
};
|
|
41
|
-
export const CustomErrorRender = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const NoData: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { noData, filledData } from '../../mocks/no-data';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
import { Button } from '@gravity-ui/uikit';
|
|
6
|
-
export default {
|
|
7
|
-
title: 'Plugins/Highcharts/NoData',
|
|
8
|
-
component: ChartKit,
|
|
9
|
-
};
|
|
10
|
-
const Template = () => {
|
|
11
|
-
const [data, setData] = React.useState(noData);
|
|
12
|
-
const handleUpdateData = React.useCallback(() => {
|
|
13
|
-
setData(filledData);
|
|
14
|
-
}, []);
|
|
15
|
-
return (React.createElement("div", null,
|
|
16
|
-
React.createElement("div", { style: { marginBottom: 12 } },
|
|
17
|
-
React.createElement(Button, { onClick: handleUpdateData }, "Add data")),
|
|
18
|
-
React.createElement(ChartStory, { data: data, visible: true })));
|
|
19
|
-
};
|
|
20
|
-
export const NoData = Template.bind({});
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
2
|
-
export default _default;
|
|
3
|
-
export declare const WithTotals: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ChartKit } from '../../../../components/ChartKit';
|
|
3
|
-
import { data } from '../../mocks/pie-with-totals';
|
|
4
|
-
import { ChartStory } from '../components/ChartStory';
|
|
5
|
-
export default {
|
|
6
|
-
title: 'Plugins/Highcharts/Pie',
|
|
7
|
-
component: ChartKit,
|
|
8
|
-
};
|
|
9
|
-
const Template = () => {
|
|
10
|
-
return React.createElement(ChartStory, { data: data });
|
|
11
|
-
};
|
|
12
|
-
export const WithTotals = Template.bind({});
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { prepareData } from '../renderer/helpers/prepare-data';
|
|
2
|
-
import { data } from '../mocks/line';
|
|
3
|
-
describe('plugins/highcharts/helpers', () => {
|
|
4
|
-
describe('prepareData', () => {
|
|
5
|
-
it('should not throw an error', () => {
|
|
6
|
-
expect(() => prepareData(data.data, data.config)).not.toThrowError();
|
|
7
|
-
});
|
|
8
|
-
it('should throw an error', () => {
|
|
9
|
-
const configWithLinesLimit = Object.assign(Object.assign({}, data.config), { linesLimit: 1 });
|
|
10
|
-
expect(() => prepareData(data.data, configWithLinesLimit)).toThrowError();
|
|
11
|
-
});
|
|
12
|
-
});
|
|
13
|
-
});
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { withKnobs, boolean, color as colorKnob, radios, text } from '@storybook/addon-knobs';
|
|
3
|
-
import { cloneDeep } from 'lodash';
|
|
4
|
-
import { Button } from '@gravity-ui/uikit';
|
|
5
|
-
import { settings } from '../../../libs';
|
|
6
|
-
import { ChartKit } from '../../../components/ChartKit';
|
|
7
|
-
import { IndicatorPlugin } from '../';
|
|
8
|
-
const data = {
|
|
9
|
-
data: [
|
|
10
|
-
{
|
|
11
|
-
content: {
|
|
12
|
-
current: {
|
|
13
|
-
value: 1539577973,
|
|
14
|
-
},
|
|
15
|
-
},
|
|
16
|
-
},
|
|
17
|
-
],
|
|
18
|
-
};
|
|
19
|
-
const Template = () => {
|
|
20
|
-
const [shown, setShown] = React.useState(false);
|
|
21
|
-
const chartkitRef = React.useRef();
|
|
22
|
-
const color = colorKnob('color', '#4da2f1');
|
|
23
|
-
const size = radios('size', { s: 's', m: 'm', l: 'l', xl: 'xl' }, 'm');
|
|
24
|
-
const title = text('title', 'Value title');
|
|
25
|
-
const nowrap = boolean('nowrap', false);
|
|
26
|
-
const resultData = cloneDeep(data);
|
|
27
|
-
if (resultData.data) {
|
|
28
|
-
resultData.data[0].size = size;
|
|
29
|
-
resultData.data[0].color = color;
|
|
30
|
-
resultData.data[0].title = title;
|
|
31
|
-
resultData.data[0].nowrap = nowrap;
|
|
32
|
-
}
|
|
33
|
-
if (!shown) {
|
|
34
|
-
settings.set({ plugins: [IndicatorPlugin] });
|
|
35
|
-
return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
|
|
36
|
-
}
|
|
37
|
-
return (React.createElement("div", { style: { height: 300, width: '100%' } },
|
|
38
|
-
React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "indicator", data: resultData })));
|
|
39
|
-
};
|
|
40
|
-
export const Showcase = Template.bind({});
|
|
41
|
-
const meta = {
|
|
42
|
-
title: 'Plugins/Indicator',
|
|
43
|
-
decorators: [withKnobs],
|
|
44
|
-
};
|
|
45
|
-
export default meta;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import '@gravity-ui/yagr/dist/index.css';
|
|
2
|
-
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
|
|
3
|
-
export default _default;
|
|
4
|
-
export declare const Line: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
5
|
-
export declare const Updates: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
6
|
-
export declare const CustomTooltip: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
|
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
import React, { useEffect, useState } from 'react';
|
|
2
|
-
import { Button } from '@gravity-ui/uikit';
|
|
3
|
-
import { settings } from '../../../libs';
|
|
4
|
-
import { YagrPlugin } from '../../../plugins';
|
|
5
|
-
import { ChartKit } from '../../../components/ChartKit';
|
|
6
|
-
import { getNewConfig, line10 } from './mocks/line10';
|
|
7
|
-
import '@gravity-ui/yagr/dist/index.css';
|
|
8
|
-
import placement from '@gravity-ui/yagr/dist/YagrCore/plugins/tooltip/placement';
|
|
9
|
-
import { dateTime } from '@gravity-ui/date-utils';
|
|
10
|
-
export default {
|
|
11
|
-
title: 'Plugins/Yagr',
|
|
12
|
-
component: ChartKit,
|
|
13
|
-
};
|
|
14
|
-
const LineTemplate = () => {
|
|
15
|
-
const [shown, setShown] = React.useState(false);
|
|
16
|
-
const chartkitRef = React.useRef();
|
|
17
|
-
if (!shown) {
|
|
18
|
-
settings.set({ plugins: [YagrPlugin] });
|
|
19
|
-
return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
|
|
20
|
-
}
|
|
21
|
-
return (React.createElement("div", { style: { height: 300, width: '100%' } },
|
|
22
|
-
React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "yagr", data: line10 })));
|
|
23
|
-
};
|
|
24
|
-
const UpdatesTemplate = () => {
|
|
25
|
-
const [shown, setShown] = React.useState(false);
|
|
26
|
-
const chartkitRef = React.useRef();
|
|
27
|
-
const [state, setState] = React.useState(line10);
|
|
28
|
-
const onStartUpdates = React.useCallback(() => {
|
|
29
|
-
setInterval(() => {
|
|
30
|
-
setState(getNewConfig());
|
|
31
|
-
}, 1000);
|
|
32
|
-
}, []);
|
|
33
|
-
if (!shown) {
|
|
34
|
-
settings.set({ plugins: [YagrPlugin] });
|
|
35
|
-
return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
|
|
36
|
-
}
|
|
37
|
-
return (React.createElement("div", { style: { height: 300, width: '100%' } },
|
|
38
|
-
React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "yagr", data: state }),
|
|
39
|
-
React.createElement(Button, { onClick: onStartUpdates }, "Start Updates"),
|
|
40
|
-
React.createElement(Button, { onClick: () => setState(getNewConfig()) }, "Once")));
|
|
41
|
-
};
|
|
42
|
-
function Tooltip({ yagr }) {
|
|
43
|
-
const [x, setX] = useState(null);
|
|
44
|
-
const [visible, setVisible] = useState(false);
|
|
45
|
-
const tooltipRef = React.useRef(null);
|
|
46
|
-
useEffect(() => {
|
|
47
|
-
var _a, _b, _c;
|
|
48
|
-
if (!yagr) {
|
|
49
|
-
return;
|
|
50
|
-
}
|
|
51
|
-
const onChange = (_, data) => {
|
|
52
|
-
var _a, _b;
|
|
53
|
-
setX((_a = data.data) === null || _a === void 0 ? void 0 : _a.x);
|
|
54
|
-
setVisible(data.state.visible);
|
|
55
|
-
if (data.state.visible && tooltipRef.current && ((_b = data.data) === null || _b === void 0 ? void 0 : _b.anchor)) {
|
|
56
|
-
placement(tooltipRef.current, data.data.anchor, 'right', {
|
|
57
|
-
xOffset: 24,
|
|
58
|
-
yOffset: 24,
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
|
-
};
|
|
62
|
-
(_a = yagr.plugins.tooltip) === null || _a === void 0 ? void 0 : _a.on('render', onChange);
|
|
63
|
-
(_b = yagr.plugins.tooltip) === null || _b === void 0 ? void 0 : _b.on('show', onChange);
|
|
64
|
-
(_c = yagr.plugins.tooltip) === null || _c === void 0 ? void 0 : _c.on('hide', onChange);
|
|
65
|
-
}, [yagr]);
|
|
66
|
-
if (!visible) {
|
|
67
|
-
return null;
|
|
68
|
-
}
|
|
69
|
-
return (React.createElement("div", { style: {
|
|
70
|
-
zIndex: 1000,
|
|
71
|
-
backgroundColor: 'white',
|
|
72
|
-
padding: 8,
|
|
73
|
-
pointerEvents: 'none',
|
|
74
|
-
}, ref: tooltipRef }, dateTime({ input: x !== null && x !== void 0 ? x : 0 }).format('DD MMMM YYYY HH:mm:ss')));
|
|
75
|
-
}
|
|
76
|
-
const CustomTooltipImpl = () => {
|
|
77
|
-
const [shown, setShown] = React.useState(false);
|
|
78
|
-
const chartkitRef = React.useRef();
|
|
79
|
-
const [state, setState] = React.useState(line10);
|
|
80
|
-
if (!shown) {
|
|
81
|
-
settings.set({ plugins: [YagrPlugin] });
|
|
82
|
-
return React.createElement(Button, { onClick: () => setShown(true) }, "Show chart");
|
|
83
|
-
}
|
|
84
|
-
return (React.createElement("div", { style: { height: 300, width: '100%' } },
|
|
85
|
-
React.createElement(ChartKit, { ref: chartkitRef, id: "1", type: "yagr", data: state, tooltip: (props) => React.createElement(Tooltip, Object.assign({}, props)) }),
|
|
86
|
-
React.createElement(Button, { onClick: () => setState(getNewConfig()) }, "Change data")));
|
|
87
|
-
};
|
|
88
|
-
export const Line = LineTemplate.bind({});
|
|
89
|
-
export const Updates = UpdatesTemplate.bind({});
|
|
90
|
-
export const CustomTooltip = CustomTooltipImpl.bind({});
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import type { YagrWidgetData } from '../../types';
|
|
2
|
-
export declare const line10: YagrWidgetData;
|
|
3
|
-
export declare const getNewConfig: () => {
|
|
4
|
-
libraryConfig: {
|
|
5
|
-
title: {
|
|
6
|
-
text: string;
|
|
7
|
-
};
|
|
8
|
-
chart?: import("@gravity-ui/yagr/dist/YagrCore/types").YagrChartOptions | undefined;
|
|
9
|
-
legend?: import("@gravity-ui/yagr/dist/YagrCore/plugins/legend/legend").LegendOptions | undefined;
|
|
10
|
-
axes?: Record<string, import("@gravity-ui/yagr/dist/YagrCore/types").AxisOptions> | undefined;
|
|
11
|
-
cursor?: import("@gravity-ui/yagr/dist/YagrCore/plugins/cursor/cursor").CursorOptions | undefined;
|
|
12
|
-
timeline?: number[] | undefined;
|
|
13
|
-
tooltip?: Partial<import("@gravity-ui/yagr/dist/YagrCore/plugins/tooltip/types").TooltipOptions> | undefined;
|
|
14
|
-
grid?: import("uplot").Axis.Grid | undefined;
|
|
15
|
-
markers?: import("@gravity-ui/yagr/dist/YagrCore/types").MarkersOptions | undefined;
|
|
16
|
-
scales?: Record<string, import("@gravity-ui/yagr/dist/YagrCore/types").Scale> | undefined;
|
|
17
|
-
series?: import("@gravity-ui/yagr/dist/YagrCore/types").RawSerieData<Omit<import("@gravity-ui/yagr/dist/YagrCore/types").SeriesOptions, "type"> & {
|
|
18
|
-
type?: import("@gravity-ui/yagr/dist/YagrCore/types").ChartType | undefined;
|
|
19
|
-
}>[] | undefined;
|
|
20
|
-
hooks?: import("@gravity-ui/yagr/dist/YagrCore/types").YagrHooks | undefined;
|
|
21
|
-
processing?: import("@gravity-ui/yagr/dist/YagrCore/types").ProcessingSettings | undefined;
|
|
22
|
-
editUplotOptions?: ((opts: import("uplot").Options) => import("uplot").Options) | undefined;
|
|
23
|
-
plugins?: Record<string, import("@gravity-ui/yagr/dist/YagrCore/types").YagrPlugin<{}, []>> | undefined;
|
|
24
|
-
};
|
|
25
|
-
data: {
|
|
26
|
-
timeline: number[];
|
|
27
|
-
graphs: {
|
|
28
|
-
data: number[];
|
|
29
|
-
name?: string | undefined;
|
|
30
|
-
id?: string | undefined;
|
|
31
|
-
scale?: string | undefined;
|
|
32
|
-
focus?: boolean | undefined;
|
|
33
|
-
title?: string | ((sIdx: number) => string) | undefined;
|
|
34
|
-
show?: boolean | undefined;
|
|
35
|
-
color?: string | undefined;
|
|
36
|
-
spanGaps?: boolean | undefined;
|
|
37
|
-
cursorOptions?: Pick<import("@gravity-ui/yagr/dist/YagrCore/plugins/cursor/cursor").CursorOptions, "snapToValues" | "markersSize"> | undefined;
|
|
38
|
-
formatter?: ((value: string | number | null, serie: import("uplot").Series) => string) | undefined;
|
|
39
|
-
precision?: number | undefined;
|
|
40
|
-
snapToValues?: false | import("@gravity-ui/yagr/dist/YagrCore/types").SnapToValue | undefined;
|
|
41
|
-
stackGroup?: number | undefined;
|
|
42
|
-
transform?: ((val: string | number | null, series: import("@gravity-ui/yagr/dist/YagrCore/types").DataSeries[], idx: number) => number | null) | undefined;
|
|
43
|
-
showInTooltip?: boolean | undefined;
|
|
44
|
-
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;
|
|
45
|
-
type?: import("@gravity-ui/yagr/dist/YagrCore/types").ChartType | undefined;
|
|
46
|
-
}[];
|
|
47
|
-
};
|
|
48
|
-
sources?: Record<number, {
|
|
49
|
-
data: {
|
|
50
|
-
program: string;
|
|
51
|
-
};
|
|
52
|
-
}> | undefined;
|
|
53
|
-
};
|