@cloud-ru/uikit-product-charts 0.13.14 → 0.13.15
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/CHANGELOG.md +16 -1
- package/dist/cjs/components/BagelChart/BagelChart.d.ts +1 -1
- package/dist/cjs/components/BagelChart/BagelChart.js +4 -4
- package/dist/cjs/components/BagelChart/utils.js +4 -4
- package/dist/cjs/components/HeatMapChart/HeatMapChart.d.ts +1 -1
- package/dist/cjs/components/HeatMapChart/HeatMapChart.js +6 -6
- package/dist/cjs/components/HeatMapChart/helpers/getStyles.js +4 -4
- package/dist/cjs/components/InteractiveChart/InteractiveChart.d.ts +1 -1
- package/dist/cjs/components/InteractiveChart/InteractiveChart.js +1 -1
- package/dist/cjs/components/InteractiveChart/hooks/useComputedColors.js +1 -1
- package/dist/cjs/components/PieChart/PieChart.d.ts +1 -1
- package/dist/cjs/components/PieChart/PieChart.js +1 -1
- package/dist/cjs/constants/colors.js +24 -24
- package/dist/esm/components/BagelChart/BagelChart.d.ts +1 -1
- package/dist/esm/components/BagelChart/BagelChart.js +3 -3
- package/dist/esm/components/BagelChart/utils.js +1 -1
- package/dist/esm/components/HeatMapChart/HeatMapChart.d.ts +1 -1
- package/dist/esm/components/HeatMapChart/HeatMapChart.js +2 -2
- package/dist/esm/components/HeatMapChart/helpers/getStyles.js +1 -1
- package/dist/esm/components/InteractiveChart/InteractiveChart.d.ts +1 -1
- package/dist/esm/components/InteractiveChart/InteractiveChart.js +1 -1
- package/dist/esm/components/InteractiveChart/hooks/useComputedColors.js +1 -1
- package/dist/esm/components/PieChart/PieChart.d.ts +1 -1
- package/dist/esm/components/PieChart/PieChart.js +1 -1
- package/dist/esm/constants/colors.js +1 -1
- package/package.json +8 -6
- package/src/components/BagelChart/BagelChart.tsx +1 -1
- package/src/components/BagelChart/utils.ts +1 -1
- package/src/components/HeatMapChart/HeatMapChart.tsx +1 -1
- package/src/components/HeatMapChart/helpers/getStyles.ts +1 -1
- package/src/constants/colors.ts +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,19 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 0.13.15 (2025-11-13)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **PD-3377:** removed contributors ([121640f](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/121640f7b88b20a728a6ad2c39de8841532bb308))
|
|
12
|
+
* **PD-3377:** replaced tokens import to snack-uikit scoped package ([dd13d3b](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/dd13d3b7134a4b0d4696830dcd78c0e790700d09))
|
|
13
|
+
* **PD-3377:** updated charts deps ([dc59df5](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/dc59df5e99fb0c31a277244ca5de51a3c97e5c34))
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
|
|
6
19
|
## 0.13.14 (2025-11-13)
|
|
7
20
|
|
|
8
21
|
### Only dependencies have been changed
|
|
@@ -624,7 +637,9 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
624
637
|
|
|
625
638
|
## [0.8.20](https://gitverse.ru/cloud-ru-tech/uikit-product/compare/@cloud-ru/uikit-product-charts@0.8.19...@cloud-ru/uikit-product-charts@0.8.20) (2022-06-01)
|
|
626
639
|
|
|
627
|
-
|
|
640
|
+
### Only dependencies have been changed
|
|
641
|
+
* [@cloud-ru/uikit-product-localization@0.13.14](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/localization/CHANGELOG.md)
|
|
642
|
+
* [@cloud-ru/uikit-product-utils@7.0.3](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/utils/CHANGELOG.md)
|
|
628
643
|
|
|
629
644
|
## [0.8.19](https://gitverse.ru/cloud-ru-tech/uikit-product/compare/@cloud-ru/uikit-product-charts@0.8.18...@cloud-ru/uikit-product-charts@0.8.19) (2022-05-18)
|
|
630
645
|
|
|
@@ -18,14 +18,14 @@ exports.BagelChart = BagelChart;
|
|
|
18
18
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
19
19
|
const classnames_1 = __importDefault(require("classnames"));
|
|
20
20
|
const react_minimal_pie_chart_1 = require("react-minimal-pie-chart");
|
|
21
|
-
const
|
|
22
|
-
const
|
|
23
|
-
const
|
|
21
|
+
const uikit_product_localization_1 = require("@cloud-ru/uikit-product-localization");
|
|
22
|
+
const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
|
|
23
|
+
const figma_tokens_1 = require("@snack-uikit/figma-tokens");
|
|
24
24
|
const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
|
|
25
25
|
const utils_1 = require("./utils");
|
|
26
26
|
function BagelChart(_a) {
|
|
27
27
|
var { value, total, title, className } = _a, rest = __rest(_a, ["value", "total", "title", "className"]);
|
|
28
28
|
(0, uikit_product_utils_1.error)('Value is too long', value > 9999999);
|
|
29
29
|
(0, uikit_product_utils_1.error)('Total is too long', total > 999999999);
|
|
30
|
-
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.wrapper, className) }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: [title && (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.titleWrapper, children: title }), (0, jsx_runtime_1.jsx)(react_minimal_pie_chart_1.PieChart, { data: [{ value, color: (0, utils_1.getSegmentColor)({ value, total }) }], totalValue: total, background:
|
|
30
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.wrapper, className) }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: [title && (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.titleWrapper, children: title }), (0, jsx_runtime_1.jsx)(react_minimal_pie_chart_1.PieChart, { data: [{ value, color: (0, utils_1.getSegmentColor)({ value, total }) }], totalValue: total, background: figma_tokens_1.themeVars.sys.neutral.decorDefault, startAngle: 270, lineWidth: 15, label: () => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("text", { className: styles_module_scss_1.default.value, x: 50, y: 45, children: (0, jsx_runtime_1.jsx)(uikit_product_localization_1.NumberFormatter, { value: value }) }), (0, jsx_runtime_1.jsx)("text", { className: styles_module_scss_1.default.limit, x: 50, y: 65, children: (0, jsx_runtime_1.jsx)(uikit_product_localization_1.NumberFormatter, { value: total }) })] })), labelPosition: 0 })] })));
|
|
31
31
|
}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.getSegmentColor = getSegmentColor;
|
|
4
|
-
const
|
|
4
|
+
const figma_tokens_1 = require("@snack-uikit/figma-tokens");
|
|
5
5
|
function getSegmentColor({ value, total }) {
|
|
6
6
|
const occupancyPercent = (value / total) * 100;
|
|
7
|
-
let segmentColor =
|
|
7
|
+
let segmentColor = figma_tokens_1.themeVars.sys.green.accentDefault;
|
|
8
8
|
if (occupancyPercent > 50 && occupancyPercent <= 75) {
|
|
9
|
-
segmentColor =
|
|
9
|
+
segmentColor = figma_tokens_1.themeVars.sys.yellow.accentDefault;
|
|
10
10
|
}
|
|
11
11
|
else if (occupancyPercent > 75) {
|
|
12
|
-
segmentColor =
|
|
12
|
+
segmentColor = figma_tokens_1.themeVars.sys.red.accentDefault;
|
|
13
13
|
}
|
|
14
14
|
return segmentColor;
|
|
15
15
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithSupportProps } from '@
|
|
1
|
+
import { WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
2
2
|
import { XAxisPosition } from './constants';
|
|
3
3
|
import { HeatMapChartProps } from './types';
|
|
4
4
|
export declare function HeatMapChart({ data, options, className, ...rest }: WithSupportProps<HeatMapChartProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -20,9 +20,9 @@ const classnames_1 = __importDefault(require("classnames"));
|
|
|
20
20
|
const d3_scale_1 = require("d3-scale");
|
|
21
21
|
const react_1 = require("react");
|
|
22
22
|
const react_grid_heatmap_1 = require("react-grid-heatmap");
|
|
23
|
-
const
|
|
24
|
-
const uikit_product_utils_1 = require("@sbercloud/uikit-product-utils");
|
|
23
|
+
const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
|
|
25
24
|
const divider_1 = require("@snack-uikit/divider");
|
|
25
|
+
const figma_tokens_1 = require("@snack-uikit/figma-tokens");
|
|
26
26
|
const utils_1 = require("@snack-uikit/utils");
|
|
27
27
|
const constants_1 = require("./constants");
|
|
28
28
|
const helpers_1 = require("./helpers");
|
|
@@ -71,10 +71,10 @@ function HeatMapChart(_a) {
|
|
|
71
71
|
}, [colorRange]);
|
|
72
72
|
const formatValue = (0, react_1.useCallback)((value) => (formatter && typeof formatter === 'function' ? formatter(value) : value), [formatter]);
|
|
73
73
|
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.wrapper, className) }, (0, uikit_product_utils_1.extractSupportProps)(rest), { ref: colorContainerRef, style: {
|
|
74
|
-
'--range-start':
|
|
75
|
-
'--range-end':
|
|
76
|
-
'--light-text':
|
|
77
|
-
'--dark-text':
|
|
74
|
+
'--range-start': figma_tokens_1.themeVars.sys.primary.decorDisabled,
|
|
75
|
+
'--range-end': figma_tokens_1.themeVars.sys.primary.accentDefault,
|
|
76
|
+
'--light-text': figma_tokens_1.themeVars.ref.brand['90'],
|
|
77
|
+
'--dark-text': figma_tokens_1.themeVars.ref.brand['30'],
|
|
78
78
|
}, children: [title && (0, jsx_runtime_1.jsx)("h3", { className: styles_module_scss_1.default.title, children: title }), (xAxis === null || xAxis === void 0 ? void 0 : xAxis.label) && xAxisPosition === constants_1.XAxisPosition.Top && (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.xAxisLabel, children: xAxis.label }), (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.gridWrapper, "data-grid": Boolean(yAxis === null || yAxis === void 0 ? void 0 : yAxis.label) || undefined, children: [(yAxis === null || yAxis === void 0 ? void 0 : yAxis.label) && ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.yAxisLabel, "data-x-axis-position": xAxisPosition, children: yAxis.label })), (0, jsx_runtime_1.jsx)(react_grid_heatmap_1.HeatMapGrid, { data: data, xLabels: xAxis === null || xAxis === void 0 ? void 0 : xAxis.ticks, yLabels: yAxis === null || yAxis === void 0 ? void 0 : yAxis.ticks, xLabelsPos: xAxisPosition, yLabelsPos: 'left', cellRender:
|
|
79
79
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
80
80
|
cellRender ||
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.getStyles = void 0;
|
|
4
|
-
const
|
|
4
|
+
const figma_tokens_1 = require("@snack-uikit/figma-tokens");
|
|
5
5
|
const constants_1 = require("./constants");
|
|
6
6
|
const getStyles = (colorScale, data) => ({
|
|
7
7
|
cellStyle: (x, y) => ({
|
|
@@ -11,14 +11,14 @@ const getStyles = (colorScale, data) => ({
|
|
|
11
11
|
justifyContent: 'center',
|
|
12
12
|
borderRadius: '4px',
|
|
13
13
|
padding: '4px',
|
|
14
|
-
borderColor:
|
|
14
|
+
borderColor: figma_tokens_1.themeVars.sys.neutral.background1Level,
|
|
15
15
|
}),
|
|
16
16
|
xLabelsStyle: () => ({
|
|
17
17
|
fontSize: '12px',
|
|
18
18
|
lineHeight: '10px',
|
|
19
19
|
fontWeight: 400,
|
|
20
20
|
marginTop: '12px',
|
|
21
|
-
color:
|
|
21
|
+
color: figma_tokens_1.themeVars.sys.neutral.textSupport,
|
|
22
22
|
padding: 0,
|
|
23
23
|
height: `${constants_1.TICKS_SIZE - 12}px`,
|
|
24
24
|
}),
|
|
@@ -27,7 +27,7 @@ const getStyles = (colorScale, data) => ({
|
|
|
27
27
|
fontSize: '12px',
|
|
28
28
|
marginRight: '8px',
|
|
29
29
|
padding: '0',
|
|
30
|
-
color:
|
|
30
|
+
color: figma_tokens_1.themeVars.sys.neutral.textSupport,
|
|
31
31
|
}),
|
|
32
32
|
});
|
|
33
33
|
exports.getStyles = getStyles;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import 'uplot/dist/uPlot.min.css';
|
|
2
2
|
import './styles.module.scss';
|
|
3
3
|
import uPlot from 'uplot';
|
|
4
|
-
import { WithSupportProps } from '@
|
|
4
|
+
import { WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
5
5
|
import { PlotType } from './types';
|
|
6
6
|
export type InteractiveChartProps = {
|
|
7
7
|
data: uPlot.AlignedData;
|
|
@@ -22,7 +22,7 @@ const classnames_1 = __importDefault(require("classnames"));
|
|
|
22
22
|
const lodash_merge_1 = __importDefault(require("lodash.merge"));
|
|
23
23
|
const react_1 = require("react");
|
|
24
24
|
const uplot_react_1 = __importDefault(require("uplot-react"));
|
|
25
|
-
const uikit_product_utils_1 = require("@
|
|
25
|
+
const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
|
|
26
26
|
const colors_1 = require("../../constants/colors");
|
|
27
27
|
const configurations_1 = require("./configurations");
|
|
28
28
|
const constants_1 = require("./constants");
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useComputedColors = useComputedColors;
|
|
4
4
|
const react_1 = require("react");
|
|
5
|
-
const uikit_product_utils_1 = require("@
|
|
5
|
+
const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
|
|
6
6
|
const utils_1 = require("@snack-uikit/utils");
|
|
7
7
|
const colors_1 = require("../../../constants/colors");
|
|
8
8
|
const EMPTY_COLORS = {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { WithSupportProps } from '@
|
|
1
|
+
import { WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
2
2
|
import { PieChartProps } from './types';
|
|
3
3
|
export declare function PieChart({ options: { width, height, title, legendTitle, typographySize }, data, aggregatedLegend, onPieSegmentClick, onLegendItemClick, className, ...rest }: WithSupportProps<PieChartProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -19,7 +19,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
19
19
|
const ft_formatters_1 = require("@cloud-ru/ft-formatters");
|
|
20
20
|
const classnames_1 = __importDefault(require("classnames"));
|
|
21
21
|
const react_1 = require("react");
|
|
22
|
-
const uikit_product_utils_1 = require("@
|
|
22
|
+
const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
|
|
23
23
|
const scroll_1 = require("@snack-uikit/scroll");
|
|
24
24
|
const typography_1 = require("@snack-uikit/typography");
|
|
25
25
|
const colors_1 = require("../../constants/colors");
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.CHART_OTHER_COLORS = exports.OTHER_COLORS = exports.CHART_SERIES_COLORS = exports.SERIES_COLORS = exports.COLOR_CONTAINER_CLASSNAME = void 0;
|
|
4
|
-
const
|
|
4
|
+
const figma_tokens_1 = require("@snack-uikit/figma-tokens");
|
|
5
5
|
exports.COLOR_CONTAINER_CLASSNAME = 'interactive-chart-wrapper';
|
|
6
6
|
exports.SERIES_COLORS = {
|
|
7
7
|
Green1: 'green1',
|
|
@@ -22,22 +22,22 @@ exports.SERIES_COLORS = {
|
|
|
22
22
|
Crimson4: 'crimson4',
|
|
23
23
|
};
|
|
24
24
|
exports.CHART_SERIES_COLORS = {
|
|
25
|
-
[exports.SERIES_COLORS.Green1]:
|
|
26
|
-
[exports.SERIES_COLORS.Green2]:
|
|
27
|
-
[exports.SERIES_COLORS.Green3]:
|
|
28
|
-
[exports.SERIES_COLORS.Green4]:
|
|
29
|
-
[exports.SERIES_COLORS.Blue1]:
|
|
30
|
-
[exports.SERIES_COLORS.Blue2]:
|
|
31
|
-
[exports.SERIES_COLORS.Blue3]:
|
|
32
|
-
[exports.SERIES_COLORS.Blue4]:
|
|
33
|
-
[exports.SERIES_COLORS.Violet1]:
|
|
34
|
-
[exports.SERIES_COLORS.Violet2]:
|
|
35
|
-
[exports.SERIES_COLORS.Violet3]:
|
|
36
|
-
[exports.SERIES_COLORS.Violet4]:
|
|
37
|
-
[exports.SERIES_COLORS.Crimson1]:
|
|
38
|
-
[exports.SERIES_COLORS.Crimson2]:
|
|
39
|
-
[exports.SERIES_COLORS.Crimson3]:
|
|
40
|
-
[exports.SERIES_COLORS.Crimson4]:
|
|
25
|
+
[exports.SERIES_COLORS.Green1]: figma_tokens_1.themeVars.sys.green.accentDefault,
|
|
26
|
+
[exports.SERIES_COLORS.Green2]: figma_tokens_1.themeVars.sys.green.textLight,
|
|
27
|
+
[exports.SERIES_COLORS.Green3]: figma_tokens_1.themeVars.sys.green.textDisabled,
|
|
28
|
+
[exports.SERIES_COLORS.Green4]: figma_tokens_1.themeVars.sys.green.decorActivated,
|
|
29
|
+
[exports.SERIES_COLORS.Blue1]: figma_tokens_1.themeVars.sys.blue.accentDefault,
|
|
30
|
+
[exports.SERIES_COLORS.Blue2]: figma_tokens_1.themeVars.sys.blue.textLight,
|
|
31
|
+
[exports.SERIES_COLORS.Blue3]: figma_tokens_1.themeVars.sys.blue.textDisabled,
|
|
32
|
+
[exports.SERIES_COLORS.Blue4]: figma_tokens_1.themeVars.sys.blue.decorActivated,
|
|
33
|
+
[exports.SERIES_COLORS.Violet1]: figma_tokens_1.themeVars.sys.violet.accentDefault,
|
|
34
|
+
[exports.SERIES_COLORS.Violet2]: figma_tokens_1.themeVars.sys.violet.textLight,
|
|
35
|
+
[exports.SERIES_COLORS.Violet3]: figma_tokens_1.themeVars.sys.violet.textDisabled,
|
|
36
|
+
[exports.SERIES_COLORS.Violet4]: figma_tokens_1.themeVars.sys.violet.decorActivated,
|
|
37
|
+
[exports.SERIES_COLORS.Crimson1]: figma_tokens_1.themeVars.sys.pink.accentDefault,
|
|
38
|
+
[exports.SERIES_COLORS.Crimson2]: figma_tokens_1.themeVars.sys.pink.textLight,
|
|
39
|
+
[exports.SERIES_COLORS.Crimson3]: figma_tokens_1.themeVars.sys.pink.textDisabled,
|
|
40
|
+
[exports.SERIES_COLORS.Crimson4]: figma_tokens_1.themeVars.sys.pink.decorActivated,
|
|
41
41
|
};
|
|
42
42
|
exports.OTHER_COLORS = {
|
|
43
43
|
ShadowColor: 'shadowColor',
|
|
@@ -49,11 +49,11 @@ exports.OTHER_COLORS = {
|
|
|
49
49
|
LabelColor: 'labelColor',
|
|
50
50
|
};
|
|
51
51
|
exports.CHART_OTHER_COLORS = {
|
|
52
|
-
[exports.OTHER_COLORS.ShadowColor]:
|
|
53
|
-
[exports.OTHER_COLORS.LineColor]:
|
|
54
|
-
[exports.OTHER_COLORS.TooltipBackgroundColor]:
|
|
55
|
-
[exports.OTHER_COLORS.TooltipColor]:
|
|
56
|
-
[exports.OTHER_COLORS.ColumnHighlightColor]:
|
|
57
|
-
[exports.OTHER_COLORS.AxisColor]:
|
|
58
|
-
[exports.OTHER_COLORS.LabelColor]:
|
|
52
|
+
[exports.OTHER_COLORS.ShadowColor]: figma_tokens_1.themeVars.sys.neutral.accentDefault,
|
|
53
|
+
[exports.OTHER_COLORS.LineColor]: figma_tokens_1.themeVars.sys.neutral.onAccent,
|
|
54
|
+
[exports.OTHER_COLORS.TooltipBackgroundColor]: figma_tokens_1.themeVars.sys.invertNeutral.background,
|
|
55
|
+
[exports.OTHER_COLORS.TooltipColor]: figma_tokens_1.themeVars.sys.invertNeutral.textMain,
|
|
56
|
+
[exports.OTHER_COLORS.ColumnHighlightColor]: figma_tokens_1.themeVars.sys.neutral.decorDefault,
|
|
57
|
+
[exports.OTHER_COLORS.AxisColor]: figma_tokens_1.themeVars.sys.neutral.decorDefault,
|
|
58
|
+
[exports.OTHER_COLORS.LabelColor]: figma_tokens_1.themeVars.sys.neutral.textSupport,
|
|
59
59
|
};
|
|
@@ -12,9 +12,9 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
12
12
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
13
|
import cn from 'classnames';
|
|
14
14
|
import { PieChart } from 'react-minimal-pie-chart';
|
|
15
|
-
import {
|
|
16
|
-
import {
|
|
17
|
-
import {
|
|
15
|
+
import { NumberFormatter } from '@cloud-ru/uikit-product-localization';
|
|
16
|
+
import { error, extractSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
17
|
+
import { themeVars } from '@snack-uikit/figma-tokens';
|
|
18
18
|
import styles from './styles.module.css';
|
|
19
19
|
import { getSegmentColor } from './utils';
|
|
20
20
|
export function BagelChart(_a) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { themeVars } from '@
|
|
1
|
+
import { themeVars } from '@snack-uikit/figma-tokens';
|
|
2
2
|
export function getSegmentColor({ value, total }) {
|
|
3
3
|
const occupancyPercent = (value / total) * 100;
|
|
4
4
|
let segmentColor = themeVars.sys.green.accentDefault;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { WithSupportProps } from '@
|
|
1
|
+
import { WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
2
2
|
import { XAxisPosition } from './constants';
|
|
3
3
|
import { HeatMapChartProps } from './types';
|
|
4
4
|
export declare function HeatMapChart({ data, options, className, ...rest }: WithSupportProps<HeatMapChartProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -14,9 +14,9 @@ import cn from 'classnames';
|
|
|
14
14
|
import { scaleLinear } from 'd3-scale';
|
|
15
15
|
import { useCallback, useMemo, useRef, useState } from 'react';
|
|
16
16
|
import { HeatMapGrid } from 'react-grid-heatmap';
|
|
17
|
-
import {
|
|
18
|
-
import { extractSupportProps, useTheme } from '@sbercloud/uikit-product-utils';
|
|
17
|
+
import { extractSupportProps, useTheme } from '@cloud-ru/uikit-product-utils';
|
|
19
18
|
import { Divider } from '@snack-uikit/divider';
|
|
19
|
+
import { themeVars } from '@snack-uikit/figma-tokens';
|
|
20
20
|
import { useLayoutEffect } from '@snack-uikit/utils';
|
|
21
21
|
import { XAxisPosition } from './constants';
|
|
22
22
|
import { getComputedColor, getContrastColor, getStyles, getTickValues } from './helpers';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import 'uplot/dist/uPlot.min.css';
|
|
2
2
|
import './styles.module.scss';
|
|
3
3
|
import uPlot from 'uplot';
|
|
4
|
-
import { WithSupportProps } from '@
|
|
4
|
+
import { WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
5
5
|
import { PlotType } from './types';
|
|
6
6
|
export type InteractiveChartProps = {
|
|
7
7
|
data: uPlot.AlignedData;
|
|
@@ -16,7 +16,7 @@ import cn from 'classnames';
|
|
|
16
16
|
import merge from 'lodash.merge';
|
|
17
17
|
import { useMemo } from 'react';
|
|
18
18
|
import UPlotReact from 'uplot-react';
|
|
19
|
-
import { extractSupportProps } from '@
|
|
19
|
+
import { extractSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
20
20
|
import { CHART_OTHER_COLORS, CHART_SERIES_COLORS, COLOR_CONTAINER_CLASSNAME, } from '../../constants/colors';
|
|
21
21
|
import { getBoxPlotOptions, getDefaultPlotOptions } from './configurations';
|
|
22
22
|
import { PLOT_TYPES } from './constants';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { useState } from 'react';
|
|
2
|
-
import { useTheme } from '@
|
|
2
|
+
import { useTheme } from '@cloud-ru/uikit-product-utils';
|
|
3
3
|
import { useLayoutEffect } from '@snack-uikit/utils';
|
|
4
4
|
import { COLOR_CONTAINER_CLASSNAME, OTHER_COLORS, SERIES_COLORS } from '../../../constants/colors';
|
|
5
5
|
const EMPTY_COLORS = {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { WithSupportProps } from '@
|
|
1
|
+
import { WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
2
2
|
import { PieChartProps } from './types';
|
|
3
3
|
export declare function PieChart({ options: { width, height, title, legendTitle, typographySize }, data, aggregatedLegend, onPieSegmentClick, onLegendItemClick, className, ...rest }: WithSupportProps<PieChartProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -13,7 +13,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
13
13
|
import { truncateString } from '@cloud-ru/ft-formatters';
|
|
14
14
|
import cn from 'classnames';
|
|
15
15
|
import { useCallback, useMemo, useState } from 'react';
|
|
16
|
-
import { extractSupportProps } from '@
|
|
16
|
+
import { extractSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
17
17
|
import { Scroll } from '@snack-uikit/scroll';
|
|
18
18
|
import { Typography } from '@snack-uikit/typography';
|
|
19
19
|
import { CHART_SERIES_COLORS, SERIES_COLORS } from '../../constants/colors';
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cloud-ru/uikit-product-charts",
|
|
3
3
|
"title": "React Charts",
|
|
4
|
-
"version": "0.13.
|
|
4
|
+
"version": "0.13.15",
|
|
5
5
|
"sideEffects": [
|
|
6
6
|
"*.css",
|
|
7
7
|
"*.scss",
|
|
@@ -31,7 +31,6 @@
|
|
|
31
31
|
"name": "Akhremenko Grigorii",
|
|
32
32
|
"url": "https://github.com/AGrigorii"
|
|
33
33
|
},
|
|
34
|
-
"contributors": [],
|
|
35
34
|
"license": "Apache-2.0",
|
|
36
35
|
"publishConfig": {
|
|
37
36
|
"access": "public"
|
|
@@ -39,10 +38,10 @@
|
|
|
39
38
|
"scripts": {},
|
|
40
39
|
"dependencies": {
|
|
41
40
|
"@cloud-ru/ft-formatters": "1.0.1",
|
|
42
|
-
"@cloud-ru/uikit-product-localization": "0.13.
|
|
43
|
-
"@cloud-ru/uikit-product-utils": "7.0.
|
|
41
|
+
"@cloud-ru/uikit-product-localization": "0.13.14",
|
|
42
|
+
"@cloud-ru/uikit-product-utils": "7.0.3",
|
|
44
43
|
"@snack-uikit/divider": "3.2.3",
|
|
45
|
-
"@snack-uikit/link": "0.15.
|
|
44
|
+
"@snack-uikit/link": "0.15.13",
|
|
46
45
|
"@snack-uikit/scroll": "0.9.3",
|
|
47
46
|
"@snack-uikit/typography": "0.8.4",
|
|
48
47
|
"@snack-uikit/utils": "3.7.0",
|
|
@@ -64,5 +63,8 @@
|
|
|
64
63
|
"@types/lodash.merge": "4.6.6",
|
|
65
64
|
"@types/lodash.range": "3.2.6"
|
|
66
65
|
},
|
|
67
|
-
"
|
|
66
|
+
"peerDependencies": {
|
|
67
|
+
"@snack-uikit/figma-tokens": "*"
|
|
68
|
+
},
|
|
69
|
+
"gitHead": "ce69097516055b330a0b05da5e29ac5b66e56284"
|
|
68
70
|
}
|
|
@@ -2,9 +2,9 @@ import cn from 'classnames';
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { PieChart } from 'react-minimal-pie-chart';
|
|
4
4
|
|
|
5
|
-
import { themeVars } from '@sbercloud/figma-tokens-cloud-platform';
|
|
6
5
|
import { NumberFormatter } from '@cloud-ru/uikit-product-localization';
|
|
7
6
|
import { error, extractSupportProps, WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
7
|
+
import { themeVars } from '@snack-uikit/figma-tokens';
|
|
8
8
|
|
|
9
9
|
import styles from './styles.module.scss';
|
|
10
10
|
import { getSegmentColor } from './utils';
|
|
@@ -3,9 +3,9 @@ import { scaleLinear } from 'd3-scale';
|
|
|
3
3
|
import { useCallback, useMemo, useRef, useState } from 'react';
|
|
4
4
|
import { HeatMapGrid } from 'react-grid-heatmap';
|
|
5
5
|
|
|
6
|
-
import { themeVars } from '@sbercloud/figma-tokens-cloud-platform';
|
|
7
6
|
import { extractSupportProps, useTheme, WithSupportProps } from '@cloud-ru/uikit-product-utils';
|
|
8
7
|
import { Divider } from '@snack-uikit/divider';
|
|
8
|
+
import { themeVars } from '@snack-uikit/figma-tokens';
|
|
9
9
|
import { useLayoutEffect } from '@snack-uikit/utils';
|
|
10
10
|
|
|
11
11
|
import { XAxisPosition } from './constants';
|
package/src/constants/colors.ts
CHANGED