@expressms/smartapp-ui 2.6.9 → 2.7.0

package/build/main//321/201omponents/Charts/ChartBar/ChartBar.d.ts

@@ -1,3 +1,3 @@
 import { IChartProps } from '../types';
 import '../../../styles/styles.scss';
-export declare const ChartBar: ({ title, xAxis, data }: IChartProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ChartBar: ({ chartHeight, title, xAxis, tooltipXAxis, data, legendUnits }: IChartProps) => import("react/jsx-runtime").JSX.Element;

package/build/main//321/201omponents/Charts/ChartBar/ChartBar.js

@@ -9,19 +9,23 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from 'react';
 import ReactEcharts from 'echarts-for-react';
-import { OPTION_GRID, OPTION_TITLE, OPTION_TOOLTIP, OPTION_Y_AXIS, OPTIONS } from '../constants';
-import { generateBarItem, generateLegend, generateXAxis } from '../helpers';
+import classNames from 'classnames';
+import ChartLegend from '../ChartLegend/ChartLegend';
+import { useEvents } from '../useEvents';
+import { generateBarItem, generateLegendItems, generateXAxis, renderChartTooltip } from '../helpers';
+import { DEFAULT_CHART_HEIGHT, LEGEND, OPTION_GRID, OPTION_TOOLTIP, OPTION_Y_AXIS, OPTIONS, TEXT_STYLE } from '../constants';
 import '../../../styles/styles.scss';
 var series = OPTIONS.series, shadow = OPTIONS.shadow, bar = OPTIONS.bar;
 var option = function (_a) {
-    var data = _a.data, title = _a.title, xAxis = _a.xAxis;
+    var data = _a.data, xAxis = _a.xAxis, tooltipXAxis = _a.tooltipXAxis;
     return ({
-        title: __assign({ text: title }, OPTION_TITLE),
-        legend: generateLegend({ data: data, chartType: bar }),
-        tooltip: __assign(__assign({}, OPTION_TOOLTIP), { axisPointer: { type: shadow } }),
-        grid: OPTION_GRID,
+        legend: LEGEND,
+        tooltip: __assign(__assign({}, OPTION_TOOLTIP), { axisPointer: { type: shadow }, formatter: function (params) { return renderChartTooltip({ chartType: bar, params: params, tooltipXAxis: tooltipXAxis }); } }),
+        textStyle: TEXT_STYLE,
+        grid: __assign(__assign({}, OPTION_GRID), { right: 0 }),
         xAxis: generateXAxis(xAxis),
         yAxis: OPTION_Y_AXIS,
         series: generateBarItem(data),
@@ -33,7 +37,9 @@ var option = function (_a) {
     });
 };
 export var ChartBar = function (_a) {
-    var title = _a.title, xAxis = _a.xAxis, data = _a.data;
-    return _jsx(ReactEcharts, { option: option({ data: data, title: title, xAxis: xAxis }), style: { height: 420 } });
+    var _b = _a.chartHeight, chartHeight = _b === void 0 ? DEFAULT_CHART_HEIGHT.bar : _b, title = _a.title, xAxis = _a.xAxis, tooltipXAxis = _a.tooltipXAxis, data = _a.data, legendUnits = _a.legendUnits;
+    var chartRef = useRef(null);
+    var _c = useEvents({ chartType: bar, chartRef: chartRef }), highlight = _c.highlight, downplay = _c.downplay;
+    return (_jsxs(_Fragment, { children: [_jsx("p", __assign({ className: classNames('smartapp-chart__title', 'mb-24') }, { children: title })), _jsx(ReactEcharts, { ref: chartRef, option: option({ data: data, xAxis: xAxis, tooltipXAxis: tooltipXAxis }), style: { height: chartHeight }, onEvents: { highlight: highlight, downplay: downplay } }), _jsx(ChartLegend, { chartRef: chartRef, chartType: bar, legendItems: generateLegendItems(bar, chartRef), legendUnits: legendUnits })] }));
 };
 //# sourceMappingURL=ChartBar.js.map

package/build/main//321/201omponents/Charts/ChartBar/ChartBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartBar.js","sourceRoot":"","sources":["../../../../../src/сomponents/Charts/ChartBar/ChartBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,YAA+B,MAAM,mBAAmB,CAAA;AAC/D,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAChG,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE3E,OAAO,6BAA6B,CAAA;AAE5B,IAAA,MAAM,GAAkB,OAAO,OAAzB,EAAE,MAAM,GAAU,OAAO,OAAjB,EAAE,GAAG,GAAK,OAAO,IAAZ,CAAY;AAEvC,IAAM,MAAM,GAAG,UAAC,EAAmC;QAAjC,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA;IAAmC,OAAA,CAAC;QACtE,KAAK,aAAI,IAAI,EAAE,KAAK,IAAK,YAAY,CAAE;QACvC,MAAM,EAAE,cAAc,CAAC,EAAE,IAAI,MAAA,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC;QAChD,OAAO,wBACF,cAAc,KACjB,WAAW,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,GAC9B;QACD,IAAI,EAAE,WAAW;QACjB,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC;QAC3B,KAAK,EAAE,aAAa;QACpB,MAAM,EAAE,eAAe,CAAC,IAAI,CAAC;QAC7B,QAAQ,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;QAC3B,WAAW,EAAE,EAAE;QACf,WAAW,EAAE,EAAE;QACf,SAAS,EAAE,EAAE,YAAY,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;QACzC,MAAM,EAAE,KAAK;KACd,CAAC;AAhBqE,CAgBrE,CAAA;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG,UAAC,EAAmC;QAAjC,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,IAAI,UAAA;IAAoB,OAAA,KAAC,YAAY,IAAC,MAAM,EAAE,MAAM,CAAC,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,KAAK,OAAA,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,GAAI;AAAhF,CAAgF,CAAA"}
+{"version":3,"file":"ChartBar.js","sourceRoot":"","sources":["../../../../../src/сomponents/Charts/ChartBar/ChartBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAc,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,YAA+B,MAAM,mBAAmB,CAAA;AAC/D,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,WAAW,MAAM,4BAA4B,CAAA;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAA;AACpG,OAAO,EAAE,oBAAoB,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,aAAa,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAE5H,OAAO,6BAA6B,CAAA;AAE5B,IAAA,MAAM,GAAkB,OAAO,OAAzB,EAAE,MAAM,GAAU,OAAO,OAAjB,EAAE,GAAG,GAAK,OAAO,IAAZ,CAAY;AAEvC,IAAM,MAAM,GAAG,UAAC,EAA0C;QAAxC,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,YAAY,kBAAA;IAAmC,OAAA,CAAC;QAC7E,MAAM,EAAE,MAAM;QACd,OAAO,wBACF,cAAc,KACjB,WAAW,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAC7B,SAAS,EAAE,UAAC,MAAgC,IAAK,OAAA,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,QAAA,EAAE,YAAY,cAAA,EAAE,CAAC,EAA5D,CAA4D,GAC9G;QACD,SAAS,EAAE,UAAU;QACrB,IAAI,wBAAO,WAAW,KAAE,KAAK,EAAE,CAAC,GAAE;QAClC,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC;QAC3B,KAAK,EAAE,aAAa;QACpB,MAAM,EAAE,eAAe,CAAC,IAAI,CAAC;QAC7B,QAAQ,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;QAC3B,WAAW,EAAE,EAAE;QACf,WAAW,EAAE,EAAE;QACf,SAAS,EAAE,EAAE,YAAY,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;QACzC,MAAM,EAAE,KAAK;KACd,CAAC;AAjB4E,CAiB5E,CAAA;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG,UAAC,EAAsG;QAApG,mBAAsC,EAAtC,WAAW,mBAAG,oBAAoB,CAAC,GAAG,KAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,YAAY,kBAAA,EAAE,IAAI,UAAA,EAAE,WAAW,iBAAA;IAC9G,IAAM,QAAQ,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAA;IAC5C,IAAA,KAA0B,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,QAAQ,UAAA,EAAE,CAAC,EAA/D,SAAS,eAAA,EAAE,QAAQ,cAA4C,CAAA;IAEvE,OAAO,CACL,8BACE,qBAAG,SAAS,EAAE,UAAU,CAAC,uBAAuB,EAAE,OAAO,CAAC,gBAAG,KAAK,IAAK,EACvE,KAAC,YAAY,IACX,GAAG,EAAE,QAAQ,EACb,MAAM,EAAE,MAAM,CAAC,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,YAAY,cAAA,EAAE,CAAC,EAC7C,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,EAC9B,QAAQ,EAAE,EAAE,SAAS,WAAA,EAAE,QAAQ,UAAA,EAAE,GACjC,EACF,KAAC,WAAW,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,mBAAmB,CAAC,GAAG,EAAE,QAAQ,CAAC,EAAE,WAAW,EAAE,WAAW,GAAI,IAC7H,CACJ,CAAA;AACH,CAAC,CAAA"}

package/build/main//321/201omponents/Charts/ChartLegend/ChartLegend.d.ts

@@ -0,0 +1,4 @@
+import { IChartLegendProps } from '../types';
+import '../../../styles/styles.scss';
+declare const ChartLegend: ({ chartRef, chartType, legendItems, legendUnits }: IChartLegendProps) => import("react/jsx-runtime").JSX.Element;
+export default ChartLegend;

package/build/main//321/201omponents/Charts/ChartLegend/ChartLegend.js

@@ -0,0 +1,71 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import classNames from 'classnames';
+import { calculateValue, isBarChart, isLineChart, isPieChart } from '../helpers';
+import { DISPATCH_ACTION_TYPES, NUMBER_FORMATTER } from '../constants';
+import '../../../styles/styles.scss';
+var ChartLegend = function (_a) {
+    var chartRef = _a.chartRef, chartType = _a.chartType, legendItems = _a.legendItems, legendUnits = _a.legendUnits;
+    var _b = useState([]), activeLegendItems = _b[0], setActiveLegendItems = _b[1];
+    var getChartInstance = function () { var _a; return (_a = chartRef.current) === null || _a === void 0 ? void 0 : _a.getEchartsInstance(); };
+    var generateLegendValue = function (value, data) {
+        if (data === void 0) { data = []; }
+        if (isBarChart(chartType))
+            return calculateValue(data);
+        if (isLineChart(chartType))
+            return NUMBER_FORMATTER.format(calculateValue(data));
+        return value;
+    };
+    var generateDispatchActionData = function (name, seriesIndex) { return (isPieChart(chartType) ? { name: name } : { seriesIndex: seriesIndex }); };
+    var handleLegendMouseEnter = function (name, seriesIndex) {
+        var chartInstance = getChartInstance();
+        chartInstance === null || chartInstance === void 0 ? void 0 : chartInstance.dispatchAction(__assign({ type: DISPATCH_ACTION_TYPES.highlight }, generateDispatchActionData(name, seriesIndex)));
+    };
+    var handleLegendMouseLeave = function (name, seriesIndex) {
+        var chartInstance = getChartInstance();
+        chartInstance === null || chartInstance === void 0 ? void 0 : chartInstance.dispatchAction(__assign({ type: DISPATCH_ACTION_TYPES.downplay }, generateDispatchActionData(name, seriesIndex)));
+    };
+    var handleLegendClick = function (name) {
+        var chartInstance = getChartInstance();
+        setActiveLegendItems(function (prevActiveLegendItems) {
+            return prevActiveLegendItems.includes(name)
+                ? prevActiveLegendItems.filter(function (legendItemName) { return legendItemName !== name; })
+                : __spreadArray(__spreadArray([], prevActiveLegendItems, true), [name], false);
+        });
+        chartInstance === null || chartInstance === void 0 ? void 0 : chartInstance.dispatchAction({ type: DISPATCH_ACTION_TYPES.legendToggleSelect, name: name });
+        isPieChart(chartType) && (chartInstance === null || chartInstance === void 0 ? void 0 : chartInstance.dispatchAction({ type: DISPATCH_ACTION_TYPES.highlight, name: name }));
+    };
+    useEffect(function () {
+        legendItems && setActiveLegendItems(legendItems.map(function (_a) {
+            var name = _a.name;
+            return name;
+        }));
+    }, [legendItems]);
+    return (_jsx("div", __assign({ className: classNames('smartapp-chart__legend', "smartapp-chart__legend--".concat(chartType)) }, { children: legendItems.map(function (_a, index) {
+            var name = _a.name, value = _a.value, data = _a.data, color = _a.itemStyle.color;
+            var inactiveLegendItem = !activeLegendItems.includes(name);
+            return (_jsxs("div", __assign({ className: "smartapp-chart__legend--item", onClick: function () { return handleLegendClick(name); }, onMouseEnter: function () { return handleLegendMouseEnter(name, index); }, onMouseLeave: function () { return handleLegendMouseLeave(name, index); } }, { children: [_jsx("div", __assign({ className: classNames('smartapp-chart__legend--item__name', { 'smartapp-chart__legend--item__name--inactive': inactiveLegendItem }) }, { children: name })), _jsxs("div", __assign({ className: classNames('smartapp-chart__legend--item__value', { 'smartapp-chart__legend--item__value--inactive': inactiveLegendItem }), style: { color: color } }, { children: [generateLegendValue(value, data), legendUnits] }))] }), name));
+        }) })));
+};
+export default ChartLegend;
+//# sourceMappingURL=ChartLegend.js.map

package/build/main//321/201omponents/Charts/ChartLegend/ChartLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartLegend.js","sourceRoot":"","sources":["../../../../../src/сomponents/Charts/ChartLegend/ChartLegend.tsx"],"names":[],"mappings":"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"}

package/build/main//321/201omponents/Charts/ChartLine/ChartLine.d.ts

@@ -1,3 +1,3 @@
 import { IChartProps } from '../types';
 import '../../../styles/styles.scss';
-export declare const ChartLine: ({ title, xAxis, data }: IChartProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ChartLine: ({ chartHeight, title, xAxis, tooltipXAxis, data, legendUnits }: IChartProps) => import("react/jsx-runtime").JSX.Element;

package/build/main//321/201omponents/Charts/ChartLine/ChartLine.js

@@ -9,22 +9,32 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from 'react';
 import ReactEcharts from 'echarts-for-react';
-import { OPTION_GRID, OPTION_TITLE, OPTION_TOOLTIP, OPTION_Y_AXIS, OPTIONS } from '../constants';
-import { generateLegend, generateLineItem, generateXAxis } from '../helpers';
+import classNames from 'classnames';
+import ChartLegend from '../ChartLegend/ChartLegend';
+import { useEvents } from '../useEvents';
+import { generateLegendItems, generateLineItem, generateXAxis, renderChartTooltip } from '../helpers';
+import { DEFAULT_CHART_HEIGHT, LEGEND, NUMBER_FORMATTER, OPTION_GRID, OPTION_TOOLTIP, OPTION_Y_AXIS, OPTIONS, TEXT_STYLE } from '../constants';
 import '../../../styles/styles.scss';
-export var ChartLine = function (_a) {
-    var title = _a.title, xAxis = _a.xAxis, data = _a.data;
-    var option = {
-        title: __assign({ text: title }, OPTION_TITLE),
-        legend: generateLegend({ data: data, chartType: OPTIONS.line }),
-        tooltip: OPTION_TOOLTIP,
-        grid: OPTION_GRID,
+var line = OPTIONS.line;
+var option = function (_a) {
+    var data = _a.data, xAxis = _a.xAxis, tooltipXAxis = _a.tooltipXAxis;
+    return ({
+        textStyle: TEXT_STYLE,
+        legend: LEGEND,
+        tooltip: __assign(__assign({}, OPTION_TOOLTIP), { formatter: function (params) { return renderChartTooltip({ chartType: line, params: params, tooltipXAxis: tooltipXAxis }); } }),
+        grid: __assign(__assign({}, OPTION_GRID), { right: '10px' }),
         xAxis: __assign({ boundaryGap: false }, generateXAxis(xAxis)),
-        yAxis: OPTION_Y_AXIS,
+        yAxis: __assign(__assign({}, OPTION_Y_AXIS), { axisLabel: __assign(__assign({}, OPTION_Y_AXIS.axisLabel), { formatter: function (value) { return NUMBER_FORMATTER.format(value); } }) }),
         series: generateLineItem(data),
-    };
-    return _jsx(ReactEcharts, { option: option, style: { height: 420 } });
+    });
+};
+export var ChartLine = function (_a) {
+    var _b = _a.chartHeight, chartHeight = _b === void 0 ? DEFAULT_CHART_HEIGHT.line : _b, title = _a.title, xAxis = _a.xAxis, tooltipXAxis = _a.tooltipXAxis, data = _a.data, legendUnits = _a.legendUnits;
+    var chartRef = useRef(null);
+    var _c = useEvents({ chartRef: chartRef, chartType: line }), highlight = _c.highlight, downplay = _c.downplay;
+    return (_jsxs(_Fragment, { children: [_jsx("p", __assign({ className: classNames('smartapp-chart__title', 'mb-24') }, { children: title })), _jsx(ReactEcharts, { ref: chartRef, option: option({ data: data, xAxis: xAxis, tooltipXAxis: tooltipXAxis }), style: { height: chartHeight }, onEvents: { highlight: highlight, downplay: downplay } }), _jsx(ChartLegend, { chartRef: chartRef, chartType: line, legendItems: generateLegendItems(line, chartRef), legendUnits: legendUnits })] }));
 };
 //# sourceMappingURL=ChartLine.js.map

package/build/main//321/201omponents/Charts/ChartLine/ChartLine.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartLine.js","sourceRoot":"","sources":["../../../../../src/сomponents/Charts/ChartLine/ChartLine.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,YAA+B,MAAM,mBAAmB,CAAA;AAC/D,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAChG,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE5E,OAAO,6BAA6B,CAAA;AAEpC,MAAM,CAAC,IAAM,SAAS,GAAG,UAAC,EAAmC;QAAjC,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,IAAI,UAAA;IAC5C,IAAM,MAAM,GAAkB;QAC5B,KAAK,aAAI,IAAI,EAAE,KAAK,IAAK,YAAY,CAAE;QACvC,MAAM,EAAE,cAAc,CAAC,EAAE,IAAI,MAAA,EAAE,SAAS,EAAE,OAAO,CAAC,IAAI,EAAE,CAAC;QACzD,OAAO,EAAE,cAAc;QACvB,IAAI,EAAE,WAAW;QACjB,KAAK,aAAI,WAAW,EAAE,KAAK,IAAK,aAAa,CAAC,KAAK,CAAC,CAAE;QACtD,KAAK,EAAE,aAAa;QACpB,MAAM,EAAE,gBAAgB,CAAC,IAAI,CAAC;KAC/B,CAAA;IAED,OAAO,KAAC,YAAY,IAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,GAAI,CAAA;AACjE,CAAC,CAAA"}
+{"version":3,"file":"ChartLine.js","sourceRoot":"","sources":["../../../../../src/сomponents/Charts/ChartLine/ChartLine.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAc,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,YAAY,MAAM,mBAAmB,CAAA;AAC5C,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,WAAW,MAAM,4BAA4B,CAAA;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAA;AACrG,OAAO,EAAE,oBAAoB,EAAE,MAAM,EAAE,gBAAgB,EAAE,WAAW,EAAE,cAAc,EAAE,aAAa,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAE9I,OAAO,6BAA6B,CAAA;AAE5B,IAAA,IAAI,GAAK,OAAO,KAAZ,CAAY;AAExB,IAAM,MAAM,GAAG,UAAC,EAA0C;QAAxC,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,YAAY,kBAAA;IAAoB,OAAA,CAAC;QAC9D,SAAS,EAAE,UAAU;QACrB,MAAM,EAAE,MAAM;QACd,OAAO,wBACF,cAAc,KACjB,SAAS,EAAE,UAAC,MAAgC,IAAK,OAAA,kBAAkB,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,QAAA,EAAE,YAAY,cAAA,EAAE,CAAC,EAA7D,CAA6D,GAC/G;QACD,IAAI,wBAAO,WAAW,KAAE,KAAK,EAAE,MAAM,GAAE;QACvC,KAAK,aAAI,WAAW,EAAE,KAAK,IAAK,aAAa,CAAC,KAAK,CAAC,CAAE;QACtD,KAAK,wBACA,aAAa,KAChB,SAAS,wBACJ,aAAa,CAAC,SAAS,KAC1B,SAAS,EAAE,UAAC,KAAa,IAAK,OAAA,gBAAgB,CAAC,MAAM,CAAC,KAAK,CAAC,EAA9B,CAA8B,MAE/D;QACD,MAAM,EAAE,gBAAgB,CAAC,IAAI,CAAC;KAC/B,CAAC;AAjB6D,CAiB7D,CAAA;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,UAAC,EAAuG;QAArG,mBAAuC,EAAvC,WAAW,mBAAG,oBAAoB,CAAC,IAAI,KAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,YAAY,kBAAA,EAAE,IAAI,UAAA,EAAE,WAAW,iBAAA;IAChH,IAAM,QAAQ,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAA;IAC5C,IAAA,KAA0B,SAAS,CAAC,EAAE,QAAQ,UAAA,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAhE,SAAS,eAAA,EAAE,QAAQ,cAA6C,CAAA;IAExE,OAAO,CACL,8BACE,qBAAG,SAAS,EAAE,UAAU,CAAC,uBAAuB,EAAE,OAAO,CAAC,gBAAG,KAAK,IAAK,EACvE,KAAC,YAAY,IACX,GAAG,EAAE,QAAQ,EACb,MAAM,EAAE,MAAM,CAAC,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,YAAY,cAAA,EAAE,CAAC,EAC7C,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,EAC9B,QAAQ,EAAE,EAAE,SAAS,WAAA,EAAE,QAAQ,UAAA,EAAE,GACjC,EACF,KAAC,WAAW,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,mBAAmB,CAAC,IAAI,EAAE,QAAQ,CAAC,EAAE,WAAW,EAAE,WAAW,GAAI,IAC/H,CACJ,CAAA;AACH,CAAC,CAAA"}

package/build/main//321/201omponents/Charts/ChartPie/ChartPie.d.ts

@@ -1,3 +1,3 @@
 import { IChartPieProps } from '../types';
 import '../../../styles/styles.scss';
-export declare const ChartPie: ({ data, title, subtitle }: IChartPieProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ChartPie: ({ chartSize, data, title, subtitle, legendUnits }: IChartPieProps) => import("react/jsx-runtime").JSX.Element;

package/build/main//321/201omponents/Charts/ChartPie/ChartPie.js

@@ -12,53 +12,51 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef } from 'react';
 import ReactEcharts from 'echarts-for-react';
-import { OPTIONS } from '../constants';
+import ChartLegend from '../ChartLegend/ChartLegend';
+import { usePieEvents } from '../usePieEvents';
+import { calculatePieChartPadding, calculatePieValue, generateLegendItems, renderPieChartTooltip } from '../helpers';
+import { CENTER_HORIZONTAL_POSITION, CENTER_VERTICAL_POSITION, DEFAULT_CHART_HEIGHT, INSIDE_RADIUS, LEGEND, OPTIONS, OUTSIDE_RADIUS, PIE_TOOLTIP_CLASS_NAME, TEXT_STYLE, } from '../constants';
 import { COLORS } from '../../../constants';
 import { TEXT_COLOR } from '../colors';
-import { calculatePieValue, generateLegend } from '../helpers';
 import '../../../styles/styles.scss';
 var center = OPTIONS.center, pie = OPTIONS.pie;
-var white = COLORS.white, black = COLORS.black;
-var option = function (data, title) { return ({
-    legend: generateLegend({ data: data, chartType: pie }),
-    tooltip: {},
-    series: [
-        {
-            type: pie,
-            data: data,
-            radius: ['60%', '100%'],
-            itemStyle: { borderRadius: 8, borderColor: white, borderWidth: 6 },
-            label: { show: false },
-            labelLine: { show: false },
-            width: 320,
-            height: 320,
+var white = COLORS.white, black = COLORS.black, blue = COLORS.blue;
+var option = function (_a) {
+    var chartSize = _a.chartSize, data = _a.data, subtitle = _a.subtitle;
+    return ({
+        legend: LEGEND,
+        tooltip: { className: PIE_TOOLTIP_CLASS_NAME, borderColor: blue, formatter: renderPieChartTooltip },
+        series: [
+            {
+                type: pie,
+                data: data.map(function (item) { return (__assign(__assign({}, item), { itemStyle: { color: item.color } })); }),
+                radius: [INSIDE_RADIUS, OUTSIDE_RADIUS],
+                center: [CENTER_HORIZONTAL_POSITION, CENTER_VERTICAL_POSITION],
+                itemStyle: { borderRadius: 8, borderColor: white, borderWidth: 6 },
+                label: { show: false },
+                labelLine: { show: false },
+                width: chartSize,
+                height: chartSize,
+                left: center,
+                emphasis: { scaleSize: 12.5 },
+            },
+        ],
+        title: {
+            text: subtitle,
             left: center,
+            top: '42.5%',
+            textStyle: { color: TEXT_COLOR, fontSize: 14, fontWeight: 400 },
+            subtext: calculatePieValue(data),
+            subtextStyle: { color: black, fontSize: 32, fontWeight: 700 },
+            itemGap: 10,
         },
-    ],
-    title: {
-        text: title,
-        left: center,
-        top: '28%',
-        textStyle: { color: TEXT_COLOR, fontSize: 14, fontWeight: 400 },
-        subtext: calculatePieValue(data),
-        subtextStyle: { color: black, fontSize: 32, fontWeight: 700 },
-        itemGap: 10,
-    },
-}); };
+        textStyle: TEXT_STYLE,
+    });
+};
 export var ChartPie = function (_a) {
-    var data = _a.data, title = _a.title, subtitle = _a.subtitle;
+    var _b = _a.chartSize, chartSize = _b === void 0 ? DEFAULT_CHART_HEIGHT.pie : _b, data = _a.data, title = _a.title, subtitle = _a.subtitle, legendUnits = _a.legendUnits;
     var chartRef = useRef(null);
-    var handleLegendSelectChanged = function (_a) {
-        var _b;
-        var selected = _a.selected;
-        var filteredData = data.filter(function (_a) {
-            var name = _a.name;
-            return selected[name];
-        });
-        var subtext = calculatePieValue(filteredData);
-        (_b = chartRef.current) === null || _b === void 0 ? void 0 : _b.getEchartsInstance().setOption({ title: { subtext: subtext } });
-    };
-    var onEvents = { legendselectchanged: handleLegendSelectChanged };
-    return (_jsxs(_Fragment, { children: [_jsx("p", __assign({ className: "smartapp-chart__title" }, { children: title })), _jsx(ReactEcharts, { ref: chartRef, option: option(data, subtitle), style: { height: 490 }, onEvents: onEvents })] }));
+    var _c = usePieEvents({ chartRef: chartRef, data: data }), legendselectchanged = _c.legendselectchanged, mouseover = _c.mouseover, mouseout = _c.mouseout;
+    return (_jsxs(_Fragment, { children: [_jsx("p", __assign({ className: "smartapp-chart__title" }, { children: title })), _jsx(ReactEcharts, { ref: chartRef, option: option({ chartSize: chartSize - calculatePieChartPadding(chartSize), data: data, subtitle: subtitle }), style: { height: chartSize }, onEvents: { mouseover: mouseover, mouseout: mouseout, highlight: mouseover, downplay: mouseout, legendselectchanged: legendselectchanged } }), _jsx(ChartLegend, { chartRef: chartRef, chartType: pie, legendItems: generateLegendItems(pie, chartRef), legendUnits: legendUnits })] }));
 };
 //# sourceMappingURL=ChartPie.js.map

package/build/main//321/201omponents/Charts/ChartPie/ChartPie.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartPie.js","sourceRoot":"","sources":["../../../../../src/сomponents/Charts/ChartPie/ChartPie.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAc,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,YAA+B,MAAM,mBAAmB,CAAA;AAC/D,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AACtC,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,YAAY,CAAA;AAE9D,OAAO,6BAA6B,CAAA;AAE5B,IAAA,MAAM,GAAU,OAAO,OAAjB,EAAE,GAAG,GAAK,OAAO,IAAZ,CAAY;AACvB,IAAA,KAAK,GAAY,MAAM,MAAlB,EAAE,KAAK,GAAK,MAAM,MAAX,CAAW;AAE/B,IAAM,MAAM,GAAG,UAAC,IAAqB,EAAE,KAAa,IAAoB,OAAA,CAAC;IACvE,MAAM,EAAE,cAAc,CAAC,EAAE,IAAI,MAAA,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC;IAChD,OAAO,EAAE,EAAE;IACX,MAAM,EAAE;QACN;YACE,IAAI,EAAE,GAAG;YACT,IAAI,MAAA;YACJ,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC;YACvB,SAAS,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,EAAE;YAClE,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACtB,SAAS,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YAC1B,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;YACX,IAAI,EAAE,MAAM;SACb;KACF;IACD,KAAK,EAAE;QACL,IAAI,EAAE,KAAK;QACX,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,KAAK;QACV,SAAS,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE;QAC/D,OAAO,EAAE,iBAAiB,CAAC,IAAI,CAAC;QAChC,YAAY,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE;QAC7D,OAAO,EAAE,EAAE;KACZ;CACF,CAAC,EAzBsE,CAyBtE,CAAA;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG,UAAC,EAAyC;QAAvC,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,QAAQ,cAAA;IAC9C,IAAM,QAAQ,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAA;IAElD,IAAM,yBAAyB,GAAG,UAAC,EAA6B;;YAA3B,QAAQ,cAAA;QAC3C,IAAM,YAAY,GAAG,IAAI,CAAC,MAAM,CAAC,UAAC,EAAQ;gBAAN,IAAI,UAAA;YAAO,OAAA,QAAQ,CAAC,IAAI,CAAC;QAAd,CAAc,CAAC,CAAA;QAC9D,IAAM,OAAO,GAAG,iBAAiB,CAAC,YAAY,CAAC,CAAA;QAE/C,MAAA,QAAQ,CAAC,OAAO,0CAAE,kBAAkB,GAAG,SAAS,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,SAAA,EAAE,EAAE,CAAC,CAAA;IAC1E,CAAC,CAAA;IAED,IAAM,QAAQ,GAAG,EAAE,mBAAmB,EAAE,yBAAyB,EAAE,CAAA;IAEnE,OAAO,CACL,8BACE,qBAAG,SAAS,EAAC,uBAAuB,gBAAE,KAAK,IAAK,EAChD,KAAC,YAAY,IAAC,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,IAAI,EAAE,QAAQ,CAAC,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,QAAQ,EAAE,QAAQ,GAAI,IAC1G,CACJ,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"ChartPie.js","sourceRoot":"","sources":["../../../../../src/сomponents/Charts/ChartPie/ChartPie.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAc,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,YAA+B,MAAM,mBAAmB,CAAA;AAC/D,OAAO,WAAW,MAAM,4BAA4B,CAAA;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,wBAAwB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AACpH,OAAO,EACL,0BAA0B,EAC1B,wBAAwB,EACxB,oBAAoB,EACpB,aAAa,EACb,MAAM,EACN,OAAO,EACP,cAAc,EACd,sBAAsB,EACtB,UAAU,GACX,MAAM,cAAc,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AAEtC,OAAO,6BAA6B,CAAA;AAE5B,IAAA,MAAM,GAAU,OAAO,OAAjB,EAAE,GAAG,GAAK,OAAO,IAAZ,CAAY;AACvB,IAAA,KAAK,GAAkB,MAAM,MAAxB,EAAE,KAAK,GAAW,MAAM,MAAjB,EAAE,IAAI,GAAK,MAAM,KAAX,CAAW;AAErC,IAAM,MAAM,GAAG,UAAC,EAA6C;QAA3C,SAAS,eAAA,EAAE,IAAI,UAAA,EAAE,QAAQ,cAAA;IAAsC,OAAA,CAAC;QAChF,MAAM,EAAE,MAAM;QACd,OAAO,EAAE,EAAE,SAAS,EAAE,sBAAsB,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,qBAAqB,EAAE;QACnG,MAAM,EAAE;YACN;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,UAAC,IAAI,IAAK,OAAA,uBAAM,IAAI,KAAE,SAAS,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAG,EAA/C,CAA+C,CAAC;gBACzE,MAAM,EAAE,CAAC,aAAa,EAAE,cAAc,CAAC;gBACvC,MAAM,EAAE,CAAC,0BAA0B,EAAE,wBAAwB,CAAC;gBAC9D,SAAS,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,EAAE;gBAClE,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;gBACtB,SAAS,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;gBAC1B,KAAK,EAAE,SAAS;gBAChB,MAAM,EAAE,SAAS;gBACjB,IAAI,EAAE,MAAM;gBACZ,QAAQ,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE;aAC9B;SACF;QACD,KAAK,EAAE;YACL,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,MAAM;YACZ,GAAG,EAAE,OAAO;YACZ,SAAS,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE;YAC/D,OAAO,EAAE,iBAAiB,CAAC,IAAI,CAAC;YAChC,YAAY,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE;YAC7D,OAAO,EAAE,EAAE;SACZ;QACD,SAAS,EAAE,UAAU;KACtB,CAAC;AA5B+E,CA4B/E,CAAA;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG,UAAC,EAA4F;QAA1F,iBAAoC,EAApC,SAAS,mBAAG,oBAAoB,CAAC,GAAG,KAAA,EAAE,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,QAAQ,cAAA,EAAE,WAAW,iBAAA;IACjG,IAAM,QAAQ,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAA;IAC5C,IAAA,KAA+C,YAAY,CAAC,EAAE,QAAQ,UAAA,EAAE,IAAI,MAAA,EAAE,CAAC,EAA7E,mBAAmB,yBAAA,EAAE,SAAS,eAAA,EAAE,QAAQ,cAAqC,CAAA;IAErF,OAAO,CACL,8BACE,qBAAG,SAAS,EAAC,uBAAuB,gBAAE,KAAK,IAAK,EAChD,KAAC,YAAY,IACX,GAAG,EAAE,QAAQ,EACb,MAAM,EAAE,MAAM,CAAC,EAAE,SAAS,EAAE,SAAS,GAAG,wBAAwB,CAAC,SAAS,CAAC,EAAE,IAAI,MAAA,EAAE,QAAQ,UAAA,EAAE,CAAC,EAC9F,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAC5B,QAAQ,EAAE,EAAE,SAAS,WAAA,EAAE,QAAQ,UAAA,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,mBAAmB,qBAAA,EAAE,GAChG,EACF,KAAC,WAAW,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAE,mBAAmB,CAAC,GAAG,EAAE,QAAQ,CAAC,EAAE,WAAW,EAAE,WAAW,GAAI,IAC7H,CACJ,CAAA;AACH,CAAC,CAAA"}

package/build/main//321/201omponents/Charts/colors.d.ts

@@ -1,2 +1,3 @@
 export declare const TEXT_COLOR = "#11111180";
 export declare const LINE_COLOR = "#D3D3D3";
+export declare const BORDER_COLOR = "#E5E5E5";

package/build/main//321/201omponents/Charts/colors.js

@@ -1,3 +1,4 @@
 export var TEXT_COLOR = '#11111180';
 export var LINE_COLOR = '#D3D3D3';
+export var BORDER_COLOR = '#E5E5E5';
 //# sourceMappingURL=colors.js.map

package/build/main//321/201omponents/Charts/colors.js.map

@@ -1 +1 @@
-{"version":3,"file":"colors.js","sourceRoot":"","sources":["../../../../src/сomponents/Charts/colors.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,UAAU,GAAG,WAAW,CAAA;AACrC,MAAM,CAAC,IAAM,UAAU,GAAG,SAAS,CAAA"}
+{"version":3,"file":"colors.js","sourceRoot":"","sources":["../../../../src/сomponents/Charts/colors.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,UAAU,GAAG,WAAW,CAAA;AACrC,MAAM,CAAC,IAAM,UAAU,GAAG,SAAS,CAAA;AACnC,MAAM,CAAC,IAAM,YAAY,GAAG,SAAS,CAAA"}

package/build/main//321/201omponents/Charts/constants.d.ts

@@ -1,11 +1,9 @@
 import { TooltipComponentOption } from 'echarts';
 import { YAXisOption } from 'echarts/types/dist/shared';
-import { COLORS } from '../../constants';
 export declare enum OPTIONS {
     center = "center",
     axis = "axis",
     shadow = "shadow",
-    circle = "circle",
     category = "category",
     transparent = "transparent",
     value = "value",
@@ -14,17 +12,34 @@ export declare enum OPTIONS {
     bar = "bar",
     line = "line"
 }
-export declare const OPTION_TITLE: {
-    left: OPTIONS;
-    textStyle: {
-        color: COLORS;
-    };
+export declare const INSIDE_RADIUS = "60%";
+export declare const OUTSIDE_RADIUS = "100%";
+export declare const CENTER_HORIZONTAL_POSITION = "50%";
+export declare const CENTER_VERTICAL_POSITION = "53%";
+export declare const NUMBER_FORMATTER: Intl.NumberFormat;
+export declare const LEGEND: {
+    show: boolean;
 };
+export declare const TEXT_STYLE: {
+    fontFamily: string;
+};
+export declare const TOOLTIP_CLASS_NAME = "smartapp-chart-tooltip";
+export declare const PIE_TOOLTIP_CLASS_NAME = "smartapp-pie-chart-tooltip";
 export declare const OPTION_TOOLTIP: TooltipComponentOption;
 export declare const OPTION_GRID: {
-    left: string;
-    right: string;
-    bottom: string;
+    left: number;
+    bottom: number;
+    top: string;
     containLabel: boolean;
 };
 export declare const OPTION_Y_AXIS: YAXisOption;
+export declare const DISPATCH_ACTION_TYPES: {
+    highlight: string;
+    downplay: string;
+    legendToggleSelect: string;
+};
+export declare const DEFAULT_CHART_HEIGHT: {
+    bar: number;
+    line: number;
+    pie: number;
+};

package/build/main//321/201omponents/Charts/constants.js

@@ -1,10 +1,10 @@
-import { COLORS } from '../../constants';
+import { COLORS, DEFAULT_FONT_FAMILY } from '../../constants';
+import { BORDER_COLOR } from './colors';
 export var OPTIONS;
 (function (OPTIONS) {
     OPTIONS["center"] = "center";
     OPTIONS["axis"] = "axis";
     OPTIONS["shadow"] = "shadow";
-    OPTIONS["circle"] = "circle";
     OPTIONS["category"] = "category";
     OPTIONS["transparent"] = "transparent";
     OPTIONS["value"] = "value";
@@ -13,13 +13,31 @@ export var OPTIONS;
     OPTIONS["bar"] = "bar";
     OPTIONS["line"] = "line";
 })(OPTIONS || (OPTIONS = {}));
-var black = COLORS.black;
-var center = OPTIONS.center, axis = OPTIONS.axis, value = OPTIONS.value;
-export var OPTION_TITLE = {
-    left: center,
-    textStyle: { color: black },
+var axis = OPTIONS.axis, value = OPTIONS.value;
+var DE_NUMBER_FORMAT = 'de-DE';
+export var INSIDE_RADIUS = '60%';
+export var OUTSIDE_RADIUS = '100%';
+export var CENTER_HORIZONTAL_POSITION = '50%';
+export var CENTER_VERTICAL_POSITION = '53%';
+export var NUMBER_FORMATTER = new Intl.NumberFormat(DE_NUMBER_FORMAT);
+export var LEGEND = { show: false };
+export var TEXT_STYLE = { fontFamily: DEFAULT_FONT_FAMILY };
+export var TOOLTIP_CLASS_NAME = 'smartapp-chart-tooltip';
+export var PIE_TOOLTIP_CLASS_NAME = 'smartapp-pie-chart-tooltip';
+export var OPTION_TOOLTIP = { trigger: axis, className: TOOLTIP_CLASS_NAME, borderColor: BORDER_COLOR };
+export var OPTION_GRID = { left: 0, bottom: 0, top: '5px', containLabel: true };
+export var OPTION_Y_AXIS = {
+    type: value,
+    axisLabel: { fontSize: '9px', fontWeight: 600, color: COLORS.darkerGray },
+};
+export var DISPATCH_ACTION_TYPES = {
+    highlight: 'highlight',
+    downplay: 'downplay',
+    legendToggleSelect: 'legendToggleSelect',
+};
+export var DEFAULT_CHART_HEIGHT = {
+    bar: 186,
+    line: 186,
+    pie: 340,
 };
-export var OPTION_TOOLTIP = { trigger: axis };
-export var OPTION_GRID = { left: '3%', right: '4%', bottom: '30%', containLabel: true };
-export var OPTION_Y_AXIS = { type: value };
 //# sourceMappingURL=constants.js.map

package/build/main//321/201omponents/Charts/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../src/сomponents/Charts/constants.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AAExC,MAAM,CAAN,IAAY,OAYX;AAZD,WAAY,OAAO;IACjB,4BAAiB,CAAA;IACjB,wBAAa,CAAA;IACb,4BAAiB,CAAA;IACjB,4BAAiB,CAAA;IACjB,gCAAqB,CAAA;IACrB,sCAA2B,CAAA;IAC3B,0BAAe,CAAA;IACf,4BAAiB,CAAA;IACjB,sBAAW,CAAA;IACX,sBAAW,CAAA;IACX,wBAAa,CAAA;AACf,CAAC,EAZW,OAAO,KAAP,OAAO,QAYlB;AAEO,IAAA,KAAK,GAAK,MAAM,MAAX,CAAW;AAChB,IAAA,MAAM,GAAkB,OAAO,OAAzB,EAAE,IAAI,GAAY,OAAO,KAAnB,EAAE,KAAK,GAAK,OAAO,MAAZ,CAAY;AAEvC,MAAM,CAAC,IAAM,YAAY,GAAG;IAC1B,IAAI,EAAE,MAAM;IACZ,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;CAC5B,CAAA;AAED,MAAM,CAAC,IAAM,cAAc,GAA2B,EAAE,OAAO,EAAE,IAAI,EAAE,CAAA;AACvE,MAAM,CAAC,IAAM,WAAW,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,CAAA;AACzF,MAAM,CAAC,IAAM,aAAa,GAAgB,EAAE,IAAI,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../src/сomponents/Charts/constants.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAA;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,CAAN,IAAY,OAWX;AAXD,WAAY,OAAO;IACjB,4BAAiB,CAAA;IACjB,wBAAa,CAAA;IACb,4BAAiB,CAAA;IACjB,gCAAqB,CAAA;IACrB,sCAA2B,CAAA;IAC3B,0BAAe,CAAA;IACf,4BAAiB,CAAA;IACjB,sBAAW,CAAA;IACX,sBAAW,CAAA;IACX,wBAAa,CAAA;AACf,CAAC,EAXW,OAAO,KAAP,OAAO,QAWlB;AAEO,IAAA,IAAI,GAAY,OAAO,KAAnB,EAAE,KAAK,GAAK,OAAO,MAAZ,CAAY;AAC/B,IAAM,gBAAgB,GAAG,OAAO,CAAA;AAEhC,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAAA;AAClC,MAAM,CAAC,IAAM,cAAc,GAAG,MAAM,CAAA;AACpC,MAAM,CAAC,IAAM,0BAA0B,GAAG,KAAK,CAAA;AAC/C,MAAM,CAAC,IAAM,wBAAwB,GAAG,KAAK,CAAA;AAC7C,MAAM,CAAC,IAAM,gBAAgB,GAAG,IAAI,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAA;AACvE,MAAM,CAAC,IAAM,MAAM,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,CAAA;AACrC,MAAM,CAAC,IAAM,UAAU,GAAG,EAAE,UAAU,EAAE,mBAAmB,EAAE,CAAA;AAC7D,MAAM,CAAC,IAAM,kBAAkB,GAAG,wBAAwB,CAAA;AAC1D,MAAM,CAAC,IAAM,sBAAsB,GAAG,4BAA4B,CAAA;AAClE,MAAM,CAAC,IAAM,cAAc,GAA2B,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,kBAAkB,EAAE,WAAW,EAAE,YAAY,EAAE,CAAA;AACjI,MAAM,CAAC,IAAM,WAAW,GAAG,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,CAAA;AAEjF,MAAM,CAAC,IAAM,aAAa,GAAgB;IACxC,IAAI,EAAE,KAAK;IACX,SAAS,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,CAAC,UAAU,EAAE;CAC1E,CAAA;AAED,MAAM,CAAC,IAAM,qBAAqB,GAAG;IACnC,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE,UAAU;IACpB,kBAAkB,EAAE,oBAAoB;CACzC,CAAA;AAED,MAAM,CAAC,IAAM,oBAAoB,GAAG;IAClC,GAAG,EAAE,GAAG;IACR,IAAI,EAAE,GAAG;IACT,GAAG,EAAE,GAAG;CACT,CAAA"}

package/build/main//321/201omponents/Charts/helpers.d.ts

@@ -1,49 +1,17 @@
+import { RefObject } from 'react';
+import ReactEcharts from 'echarts-for-react';
 import { SeriesOption } from 'echarts';
 import { XAXisOption } from 'echarts/types/dist/shared';
-import { OPTIONS } from './constants';
-import { TChartData, TChartPieData, TGenerateLegendProps } from './types';
+import { TChartData, TChartPieData, TRenderChartTooltip, TTooltipFormatterParam } from './types';
+export declare const isBarChart: (chartType: string) => boolean;
+export declare const isLineChart: (chartType: string) => boolean;
+export declare const isPieChart: (chartType: string) => boolean;
+export declare const calculatePieChartPadding: (chartSize: number) => number;
 export declare const calculateValue: (data: number[]) => number;
 export declare const calculatePieValue: (data: TChartPieData[]) => string;
-export declare const generateLegendItemValue: (itemName: string, data: TChartData[]) => string;
-export declare const generatePieLegendItemValue: (itemName: string, data: TChartPieData[]) => string;
 export declare const generateLineItem: (data: TChartData[]) => SeriesOption[];
 export declare const generateBarItem: (data: TChartData[]) => SeriesOption[];
-export declare const generateLegend: ({ data, chartType }: TGenerateLegendProps) => {
-    itemGap: number;
-    bottom: number;
-    icon: OPTIONS.circle;
-    textStyle: {
-        rich: {
-            Name: {
-                fontSize: number;
-                align: OPTIONS.center;
-            };
-            value: {
-                fontSize: number;
-                align: OPTIONS.center;
-            };
-        };
-    };
-    data?: string[] | undefined;
-    formatter?: ((name: string) => string) | undefined;
-} | {
-    bottom: number;
-    itemGap: number;
-    formatter: (name: string) => string;
-    textStyle: {
-        rich: {
-            Name: {
-                width: number;
-                fontSize: number;
-                align: OPTIONS.center;
-            };
-            value: {
-                fontSize: number;
-                align: OPTIONS.center;
-            };
-        };
-    };
-    icon: OPTIONS.circle;
-    data?: string[] | undefined;
-} | undefined;
 export declare const generateXAxis: (data: string[]) => XAXisOption;
+export declare const renderChartTooltip: ({ chartType, params, tooltipXAxis }: TRenderChartTooltip) => string;
+export declare const renderPieChartTooltip: ({ name, value }: TTooltipFormatterParam) => string;
+export declare const generateLegendItems: (chartType: string, chartRef: RefObject<ReactEcharts | null>) => any;