@semcore/d3-chart 17.0.0-prerelease.34 → 17.0.0-prerelease.37
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 +1 -1
- package/lib/cjs/a11y/PlotA11yView.js +5 -5
- package/lib/cjs/a11y/PlotA11yView.js.map +1 -1
- package/lib/es6/a11y/PlotA11yView.js +4 -3
- package/lib/es6/a11y/PlotA11yView.js.map +1 -1
- package/lib/esm/AnimatedClipPath.mjs +1 -1
- package/lib/esm/Area.mjs +1 -2
- package/lib/esm/Axis.mjs +4 -7
- package/lib/esm/Bar.mjs +1 -2
- package/lib/esm/Bubble.mjs +3 -5
- package/lib/esm/CompactHorizontalBar.mjs +4 -4
- package/lib/esm/Donut.mjs +5 -4
- package/lib/esm/Dots.mjs +1 -2
- package/lib/esm/HorizontalBar.mjs +1 -2
- package/lib/esm/Hover.mjs +2 -3
- package/lib/esm/Line.mjs +2 -3
- package/lib/esm/Pattern.mjs +6 -7
- package/lib/esm/Plot.mjs +3 -5
- package/lib/esm/Radar.mjs +7 -10
- package/lib/esm/RadialTree.mjs +17 -63
- package/lib/esm/Reference.mjs +0 -1
- package/lib/esm/ResponsiveContainer.mjs +3 -5
- package/lib/esm/ScatterPlot.mjs +2 -2
- package/lib/esm/StackBar.mjs +2 -2
- package/lib/esm/StackedArea.mjs +2 -2
- package/lib/esm/Tooltip.mjs +5 -8
- package/lib/esm/Venn.mjs +3 -3
- package/lib/esm/a11y/DataAccessibilityTable.mjs +2 -4
- package/lib/esm/a11y/PlotA11yModule.mjs +2 -2
- package/lib/esm/a11y/PlotA11yView.mjs +11 -19
- package/lib/esm/a11y/focus.mjs +2 -2
- package/lib/esm/a11y/hints.mjs +3 -3
- package/lib/esm/a11y/insights.mjs +15 -20
- package/lib/esm/a11y/intl.mjs +1 -1
- package/lib/esm/a11y/locale.mjs +1 -2
- package/lib/esm/a11y/serialize.mjs +17 -17
- package/lib/esm/component/Chart/AbstractChart.mjs +15 -17
- package/lib/esm/component/Chart/AreaChart.mjs +5 -4
- package/lib/esm/component/Chart/BarChart.mjs +4 -3
- package/lib/esm/component/Chart/BubbleChart.mjs +8 -8
- package/lib/esm/component/Chart/CigaretteChart.mjs +6 -6
- package/lib/esm/component/Chart/CompactHorizontalBarChart.mjs +2 -1
- package/lib/esm/component/Chart/DonutChart.mjs +3 -2
- package/lib/esm/component/Chart/HistogramChart.mjs +5 -4
- package/lib/esm/component/Chart/LineChart.mjs +5 -4
- package/lib/esm/component/Chart/RadarChart.mjs +4 -5
- package/lib/esm/component/Chart/ScatterPlotChart.mjs +3 -2
- package/lib/esm/component/Chart/VennChart.mjs +3 -3
- package/lib/esm/component/ChartLegend/BaseLegend.mjs +9 -14
- package/lib/esm/component/ChartLegend/LegendFlex/LegendFlex.mjs +1 -2
- package/lib/esm/component/ChartLegend/LegendItem/LegendItem.mjs +1 -2
- package/lib/esm/component/ChartLegend/LegendTable/LegendTable.mjs +2 -4
- package/lib/esm/component/ChartLegend/index.mjs +2 -0
- package/lib/esm/component/Cigarette/Cigarette.mjs +1 -2
- package/lib/esm/component/StackGroupBar/StackGroupBar.mjs +2 -3
- package/lib/esm/createElement.mjs +1 -1
- package/lib/esm/index.mjs +1 -0
- package/lib/esm/utils.mjs +2 -2
- package/lib/types/a11y/PlotA11yView.d.ts +1 -1
- package/package.json +14 -14
|
@@ -134,12 +134,12 @@ const serialize = ({
|
|
|
134
134
|
if (insights.length === 0) return null;
|
|
135
135
|
const intl = getIntl(locale, translations, availableLocales);
|
|
136
136
|
const dataRangeSummary = intl.formatList(dataRange.map((range) => {
|
|
137
|
-
const from =
|
|
137
|
+
const from = valuesFormatter?.(range.from, range.label) ?? defaultValueFormatter(intl, range.from, {
|
|
138
138
|
siblingsTimeMark: range.to,
|
|
139
139
|
datesWithTime,
|
|
140
140
|
maxListSymbols
|
|
141
141
|
});
|
|
142
|
-
const to =
|
|
142
|
+
const to = valuesFormatter?.(range.to, range.label) ?? defaultValueFormatter(intl, range.to, {
|
|
143
143
|
siblingsTimeMark: range.from,
|
|
144
144
|
datesWithTime,
|
|
145
145
|
maxListSymbols
|
|
@@ -149,7 +149,7 @@ const serialize = ({
|
|
|
149
149
|
}, {
|
|
150
150
|
from,
|
|
151
151
|
to,
|
|
152
|
-
label:
|
|
152
|
+
label: titlesFormatter?.(range.label) ?? range.label
|
|
153
153
|
});
|
|
154
154
|
}));
|
|
155
155
|
if (dataType === "time-series") {
|
|
@@ -173,12 +173,12 @@ const serialize = ({
|
|
|
173
173
|
const mainSummary = intl.formatMessage({
|
|
174
174
|
id: "time-series-general-trend"
|
|
175
175
|
}, {
|
|
176
|
-
dataKey:
|
|
176
|
+
dataKey: titlesFormatter?.(summaryDataKey) ?? summaryDataKey,
|
|
177
177
|
trend: intl.formatMessage({
|
|
178
178
|
id: `trend-${primaryTrend.change.strength}`
|
|
179
179
|
}),
|
|
180
|
-
from:
|
|
181
|
-
to:
|
|
180
|
+
from: valuesFormatter?.(primaryTrend.change.from, dataKey) ?? intl.formatNumber(primaryTrend.change.from),
|
|
181
|
+
to: valuesFormatter?.(primaryTrend.change.to, dataKey) ?? intl.formatNumber(primaryTrend.change.to)
|
|
182
182
|
});
|
|
183
183
|
const secondarySummaries = secondaryTrends.map((trend) => intl.formatMessage({
|
|
184
184
|
id: "time-series-local-trend"
|
|
@@ -186,12 +186,12 @@ const serialize = ({
|
|
|
186
186
|
trend: intl.formatMessage({
|
|
187
187
|
id: `trend-${trend.change.strength}`
|
|
188
188
|
}),
|
|
189
|
-
from:
|
|
189
|
+
from: valuesFormatter?.(trend.from, trend.dataKey) ?? defaultValueFormatter(intl, trend.from, {
|
|
190
190
|
siblingsTimeMark: trend.to,
|
|
191
191
|
datesWithTime,
|
|
192
192
|
maxListSymbols
|
|
193
193
|
}),
|
|
194
|
-
to:
|
|
194
|
+
to: valuesFormatter?.(trend.to, trend.dataKey) ?? defaultValueFormatter(intl, trend.to, {
|
|
195
195
|
siblingsTimeMark: trend.from,
|
|
196
196
|
datesWithTime,
|
|
197
197
|
maxListSymbols
|
|
@@ -212,7 +212,7 @@ const serialize = ({
|
|
|
212
212
|
}, {
|
|
213
213
|
entities,
|
|
214
214
|
entitiesList: intl.formatList(entitiesList),
|
|
215
|
-
label:
|
|
215
|
+
label: titlesFormatter?.(dataTitle) ?? dataTitle
|
|
216
216
|
});
|
|
217
217
|
if (dataRangeSummary.length > 0) {
|
|
218
218
|
return `${summary}
|
|
@@ -237,7 +237,7 @@ ${dataRangeSummary}`;
|
|
|
237
237
|
minSize
|
|
238
238
|
});
|
|
239
239
|
const entitiesList = biggestClusters.map((clusterInsight) => {
|
|
240
|
-
const labels = formatLimitedSizeList(clusterInsight.labels.map((label) =>
|
|
240
|
+
const labels = formatLimitedSizeList(clusterInsight.labels.map((label) => titlesFormatter?.(label) ?? label), intl, maxListSymbols);
|
|
241
241
|
const anonymous = clusterInsight.labels.length === 0 || labels === String(clusterInsight.size);
|
|
242
242
|
return intl.formatMessage({
|
|
243
243
|
id: anonymous ? "entity-type-clusters-label-anonymous" : "entity-type-clusters-label"
|
|
@@ -247,10 +247,10 @@ ${dataRangeSummary}`;
|
|
|
247
247
|
}),
|
|
248
248
|
labels,
|
|
249
249
|
size: clusterInsight.size,
|
|
250
|
-
x:
|
|
251
|
-
xLabel:
|
|
252
|
-
y:
|
|
253
|
-
yLabel:
|
|
250
|
+
x: valuesFormatter?.(clusterInsight.center.x, clusterInsight.labels) ?? intl.formatNumber(clusterInsight.center.x),
|
|
251
|
+
xLabel: titlesFormatter?.(clusterInsight.center.xLabel) ?? clusterInsight.center.xLabel,
|
|
252
|
+
y: valuesFormatter?.(clusterInsight.center.y, clusterInsight.labels) ?? intl.formatNumber(clusterInsight.center.y),
|
|
253
|
+
yLabel: titlesFormatter?.(clusterInsight.center.yLabel) ?? clusterInsight.center.yLabel
|
|
254
254
|
});
|
|
255
255
|
});
|
|
256
256
|
if (insights.length > clustersLimit) {
|
|
@@ -265,7 +265,7 @@ ${dataRangeSummary}`;
|
|
|
265
265
|
}, {
|
|
266
266
|
entities,
|
|
267
267
|
entitiesList: intl.formatList(entitiesList),
|
|
268
|
-
label:
|
|
268
|
+
label: titlesFormatter?.(dataTitle) ?? dataTitle
|
|
269
269
|
});
|
|
270
270
|
if (dataRangeSummary.length > 0) {
|
|
271
271
|
return `${summary}
|
|
@@ -290,7 +290,7 @@ ${dataRangeSummary}`;
|
|
|
290
290
|
}, {
|
|
291
291
|
entities,
|
|
292
292
|
entitiesList,
|
|
293
|
-
label:
|
|
293
|
+
label: titlesFormatter?.(dataTitle) ?? dataTitle
|
|
294
294
|
});
|
|
295
295
|
} else if (dataType === "grouped-values" || dataType === "indexed-groups") {
|
|
296
296
|
const groupInsights = insights;
|
|
@@ -338,7 +338,7 @@ ${dataRangeSummary}`;
|
|
|
338
338
|
}, {
|
|
339
339
|
entities,
|
|
340
340
|
entitiesList: intl.formatList(entitiesList),
|
|
341
|
-
label:
|
|
341
|
+
label: titlesFormatter?.(dataTitle) ?? dataTitle
|
|
342
342
|
});
|
|
343
343
|
return summary;
|
|
344
344
|
}
|
|
@@ -1,17 +1,18 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { sstyled, Component, assignProps } from "@semcore/core";
|
|
3
|
+
import { Box, Flex } from "@semcore/base-components";
|
|
4
4
|
import { extractAriaProps } from "@semcore/core/lib/utils/ariaProps";
|
|
5
5
|
import { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
|
|
6
6
|
import { Text } from "@semcore/typography";
|
|
7
7
|
import React, { Fragment } from "react";
|
|
8
|
-
import
|
|
9
|
-
import {
|
|
8
|
+
import "../../index.mjs";
|
|
9
|
+
import { makeDataHintsContainer } from "../../a11y/hints.mjs";
|
|
10
|
+
import { interpolateValue } from "../../utils.mjs";
|
|
11
|
+
import "../ChartLegend/index.mjs";
|
|
10
12
|
import { LegendTable } from "../ChartLegend/LegendTable/LegendTable.mjs";
|
|
13
|
+
import { LegendFlex } from "../ChartLegend/LegendFlex/LegendFlex.mjs";
|
|
11
14
|
import { YAxis, XAxis } from "../../Axis.mjs";
|
|
12
|
-
import
|
|
13
|
-
import { makeDataHintsContainer } from "../../a11y/hints.mjs";
|
|
14
|
-
/*!__reshadow-styles__:"../../style/abstract-chart.shadow.css"*/
|
|
15
|
+
import Plot from "../../Plot.mjs";
|
|
15
16
|
const style = (
|
|
16
17
|
/*__reshadow_css_start__*/
|
|
17
18
|
(sstyled.insert(
|
|
@@ -58,17 +59,16 @@ class AbstractChart extends Component {
|
|
|
58
59
|
legendProps
|
|
59
60
|
} = this.props;
|
|
60
61
|
return this.dataKeys.map((key, index) => {
|
|
61
|
-
|
|
62
|
-
const legendData = (_a = legendProps == null ? void 0 : legendProps.legendMap) == null ? void 0 : _a[key];
|
|
62
|
+
const legendData = legendProps?.legendMap?.[key];
|
|
63
63
|
const dataDefinition = {
|
|
64
64
|
id: key,
|
|
65
|
-
label:
|
|
66
|
-
icon:
|
|
67
|
-
checked:
|
|
65
|
+
label: legendData?.label ?? key,
|
|
66
|
+
icon: legendData?.icon ?? void 0,
|
|
67
|
+
checked: legendData?.defaultChecked ?? true,
|
|
68
68
|
color: this.resolveColor(key, index),
|
|
69
69
|
columns: []
|
|
70
70
|
};
|
|
71
|
-
if (
|
|
71
|
+
if (legendData?.additionalInfo || legendData?.count) {
|
|
72
72
|
dataDefinition.additionalInfo = legendData.additionalInfo ? {
|
|
73
73
|
label: legendData.additionalInfo
|
|
74
74
|
} : legendData.count ? {
|
|
@@ -271,8 +271,7 @@ class AbstractChart extends Component {
|
|
|
271
271
|
this.setHighlightedLine(-1);
|
|
272
272
|
}
|
|
273
273
|
resolveColor(id, index) {
|
|
274
|
-
|
|
275
|
-
return ((_a = this.props.colorMap) == null ? void 0 : _a[id]) ?? `chart-palette-order-${index + 1}`;
|
|
274
|
+
return this.props.colorMap?.[id] ?? `chart-palette-order-${index + 1}`;
|
|
276
275
|
}
|
|
277
276
|
tooltipValueFormatter(value) {
|
|
278
277
|
const {
|
|
@@ -390,7 +389,6 @@ class AbstractChart extends Component {
|
|
|
390
389
|
}) : /* @__PURE__ */ React.createElement(XAxis.Grid, null))));
|
|
391
390
|
}
|
|
392
391
|
getTooltipChildren(options) {
|
|
393
|
-
var _a;
|
|
394
392
|
var _ref = this.asProps, _ref3;
|
|
395
393
|
const STooltipChildrenWrapper = Box;
|
|
396
394
|
const {
|
|
@@ -404,7 +402,7 @@ class AbstractChart extends Component {
|
|
|
404
402
|
const {
|
|
405
403
|
dataDefinitions
|
|
406
404
|
} = this.state;
|
|
407
|
-
const title =
|
|
405
|
+
const title = dataItem[groupKey]?.toString();
|
|
408
406
|
return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(Flex, _ref3.cn("Flex", {
|
|
409
407
|
"direction": "column"
|
|
410
408
|
}), title && /* @__PURE__ */ React.createElement(Tooltip.Title, null, title), /* @__PURE__ */ React.createElement(STooltipChildrenWrapper, _ref3.cn("STooltipChildrenWrapper", {
|
|
@@ -3,12 +3,13 @@ import { createComponent } from "@semcore/core";
|
|
|
3
3
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
4
4
|
import { scaleTime, scaleLinear } from "d3-scale";
|
|
5
5
|
import React from "react";
|
|
6
|
-
import
|
|
7
|
-
import StackedArea from "../../StackedArea.mjs";
|
|
8
|
-
import { HoverLine } from "../../Hover.mjs";
|
|
9
|
-
import { minMax } from "../../utils.mjs";
|
|
6
|
+
import "../../index.mjs";
|
|
10
7
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
11
8
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
9
|
+
import { minMax } from "../../utils.mjs";
|
|
10
|
+
import StackedArea from "../../StackedArea.mjs";
|
|
11
|
+
import Area from "../../Area.mjs";
|
|
12
|
+
import { HoverLine } from "../../Hover.mjs";
|
|
12
13
|
class AreaChartComponent extends AbstractChart {
|
|
13
14
|
get xScale() {
|
|
14
15
|
const {
|
|
@@ -5,13 +5,14 @@ import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
|
5
5
|
import { scaleTime, scaleBand, scaleLinear } from "d3-scale";
|
|
6
6
|
import React from "react";
|
|
7
7
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
8
|
-
import
|
|
8
|
+
import "../../index.mjs";
|
|
9
|
+
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
9
10
|
import Line from "../../Line.mjs";
|
|
10
11
|
import GroupBar from "../../GroupBar.mjs";
|
|
11
12
|
import StackBar from "../../StackBar.mjs";
|
|
12
13
|
import { HoverRect } from "../../Hover.mjs";
|
|
14
|
+
import { YAxis, XAxis } from "../../Axis.mjs";
|
|
13
15
|
import { minMax } from "../../utils.mjs";
|
|
14
|
-
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
15
16
|
class BarChartComponent extends AbstractChart {
|
|
16
17
|
constructor(...args) {
|
|
17
18
|
super(...args);
|
|
@@ -61,7 +62,7 @@ class BarChartComponent extends AbstractChart {
|
|
|
61
62
|
const {
|
|
62
63
|
withTrend
|
|
63
64
|
} = this.state;
|
|
64
|
-
const trendItem = trend
|
|
65
|
+
const trendItem = trend?.[key];
|
|
65
66
|
if (withTrend && trendItem) {
|
|
66
67
|
return /* @__PURE__ */ React.createElement(Line, {
|
|
67
68
|
data: trendItem,
|
|
@@ -4,10 +4,11 @@ import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
|
4
4
|
import { Text } from "@semcore/typography";
|
|
5
5
|
import { scaleLinear } from "d3-scale";
|
|
6
6
|
import React from "react";
|
|
7
|
-
import
|
|
8
|
-
import { calculateBubbleDomain } from "../../utils.mjs";
|
|
7
|
+
import "../../index.mjs";
|
|
9
8
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
10
9
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
10
|
+
import { calculateBubbleDomain } from "../../utils.mjs";
|
|
11
|
+
import Bubble from "../../Bubble.mjs";
|
|
11
12
|
class BubbleChartComponent extends AbstractChart {
|
|
12
13
|
get dataKeys() {
|
|
13
14
|
const {
|
|
@@ -21,21 +22,20 @@ class BubbleChartComponent extends AbstractChart {
|
|
|
21
22
|
data
|
|
22
23
|
} = this.props;
|
|
23
24
|
return data.map((item, index) => {
|
|
24
|
-
var _a;
|
|
25
25
|
const key = index.toString();
|
|
26
|
-
const legendData =
|
|
26
|
+
const legendData = legendProps?.legendMap?.[key];
|
|
27
27
|
if (item.color === void 0) {
|
|
28
28
|
item.color = this.resolveColor(key, index);
|
|
29
29
|
}
|
|
30
30
|
const dataDefinition = {
|
|
31
31
|
id: key,
|
|
32
|
-
label:
|
|
33
|
-
icon:
|
|
34
|
-
checked:
|
|
32
|
+
label: legendData?.label ?? item.label ?? key,
|
|
33
|
+
icon: legendData?.icon ?? void 0,
|
|
34
|
+
checked: legendData?.defaultChecked ?? true,
|
|
35
35
|
color: item.color,
|
|
36
36
|
columns: []
|
|
37
37
|
};
|
|
38
|
-
if (
|
|
38
|
+
if (legendData?.additionalInfo || legendData?.count) {
|
|
39
39
|
dataDefinition.additionalInfo = legendData.additionalInfo ? {
|
|
40
40
|
label: legendData.additionalInfo
|
|
41
41
|
} : legendData.count ? {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
import {
|
|
2
|
+
import { sstyled, assignProps, createComponent } from "@semcore/core";
|
|
3
3
|
import { Box, Flex } from "@semcore/base-components";
|
|
4
4
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
5
5
|
import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
|
|
@@ -9,13 +9,14 @@ import Divider from "@semcore/divider";
|
|
|
9
9
|
import { Text } from "@semcore/typography";
|
|
10
10
|
import { scaleLinear, scaleThreshold } from "d3-scale";
|
|
11
11
|
import React from "react";
|
|
12
|
-
import
|
|
13
|
-
import { HoverRect } from "../../Hover.mjs";
|
|
14
|
-
import { eventToPoint, interpolateValue } from "../../utils.mjs";
|
|
12
|
+
import "../../index.mjs";
|
|
15
13
|
import { AbstractChart, NOT_A_VALUE } from "./AbstractChart.mjs";
|
|
16
14
|
import AnimatedClipPath from "../../AnimatedClipPath.mjs";
|
|
17
15
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
16
|
+
import { eventToPoint, interpolateValue } from "../../utils.mjs";
|
|
18
17
|
import Cigarette from "../Cigarette/Cigarette.mjs";
|
|
18
|
+
import { HoverRect } from "../../Hover.mjs";
|
|
19
|
+
import Plot from "../../Plot.mjs";
|
|
19
20
|
const DEFAULT_MINIMAL_BAR_WIDTH = 2;
|
|
20
21
|
const DEFAULT_GAP = 2;
|
|
21
22
|
class CigaretteChartComponent extends AbstractChart {
|
|
@@ -64,8 +65,7 @@ class CigaretteChartComponent extends AbstractChart {
|
|
|
64
65
|
});
|
|
65
66
|
}
|
|
66
67
|
resolveColor(id, index) {
|
|
67
|
-
|
|
68
|
-
return ((_a = this.props.colorMap) == null ? void 0 : _a[id]) ?? `blue-${5 - index}00`;
|
|
68
|
+
return this.props.colorMap?.[id] ?? `blue-${5 - index}00`;
|
|
69
69
|
}
|
|
70
70
|
getDefaultDataDefinitions() {
|
|
71
71
|
const dataDefinitions = super.getDefaultDataDefinitions();
|
|
@@ -3,9 +3,10 @@ import { createComponent } from "@semcore/core";
|
|
|
3
3
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
4
4
|
import { scaleBand, scaleLinear } from "d3-scale";
|
|
5
5
|
import React from "react";
|
|
6
|
-
import
|
|
6
|
+
import "../../index.mjs";
|
|
7
7
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
8
8
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
9
|
+
import CompactHorizontalBar from "../../CompactHorizontalBar.mjs";
|
|
9
10
|
class CompactHorizontalBarChartComponent extends AbstractChart {
|
|
10
11
|
get xScale() {
|
|
11
12
|
return this.asProps.xScale ?? this.valueScale;
|
|
@@ -5,9 +5,10 @@ import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
|
5
5
|
import { Text } from "@semcore/typography";
|
|
6
6
|
import { scaleLinear } from "d3-scale";
|
|
7
7
|
import React from "react";
|
|
8
|
-
import
|
|
8
|
+
import "../../index.mjs";
|
|
9
9
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
10
10
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
11
|
+
import Donut from "../../Donut.mjs";
|
|
11
12
|
class DonutChartComponent extends AbstractChart {
|
|
12
13
|
get xScale() {
|
|
13
14
|
const {
|
|
@@ -70,7 +71,7 @@ class DonutChartComponent extends AbstractChart {
|
|
|
70
71
|
}) => {
|
|
71
72
|
const title = dataDefinitions.find((item) => item.id === dataKey);
|
|
72
73
|
return {
|
|
73
|
-
children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Donut.Tooltip.Title, null,
|
|
74
|
+
children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Donut.Tooltip.Title, null, title?.label || dataKey), /* @__PURE__ */ React.createElement(Flex, {
|
|
74
75
|
justifyContent: "space-between"
|
|
75
76
|
}, /* @__PURE__ */ React.createElement(Text, {
|
|
76
77
|
bold: true
|
|
@@ -4,12 +4,13 @@ import { createComponent } from "@semcore/core";
|
|
|
4
4
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
5
5
|
import { scaleTime, scaleBand, scaleLinear } from "d3-scale";
|
|
6
6
|
import React from "react";
|
|
7
|
-
import
|
|
8
|
-
import StackBar from "../../StackBar.mjs";
|
|
9
|
-
import { HoverRect } from "../../Hover.mjs";
|
|
10
|
-
import { minMax } from "../../utils.mjs";
|
|
7
|
+
import "../../index.mjs";
|
|
11
8
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
12
9
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
10
|
+
import { minMax } from "../../utils.mjs";
|
|
11
|
+
import StackBar from "../../StackBar.mjs";
|
|
12
|
+
import Bar from "../../Bar.mjs";
|
|
13
|
+
import { HoverRect } from "../../Hover.mjs";
|
|
13
14
|
class HistogramChartComponent extends AbstractChart {
|
|
14
15
|
get xScale() {
|
|
15
16
|
const {
|
|
@@ -3,11 +3,12 @@ import { createComponent } from "@semcore/core";
|
|
|
3
3
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
4
4
|
import { scaleTime, scaleLinear } from "d3-scale";
|
|
5
5
|
import React from "react";
|
|
6
|
-
import
|
|
7
|
-
import { HoverLine } from "../../Hover.mjs";
|
|
8
|
-
import { minMax } from "../../utils.mjs";
|
|
6
|
+
import "../../index.mjs";
|
|
9
7
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
10
8
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
9
|
+
import { minMax } from "../../utils.mjs";
|
|
10
|
+
import Line from "../../Line.mjs";
|
|
11
|
+
import { HoverLine } from "../../Hover.mjs";
|
|
11
12
|
class LineChartComponent extends AbstractChart {
|
|
12
13
|
get xScale() {
|
|
13
14
|
const {
|
|
@@ -66,7 +67,7 @@ class LineChartComponent extends AbstractChart {
|
|
|
66
67
|
onClick: onClickLine
|
|
67
68
|
}, showDots && /* @__PURE__ */ React.createElement(Line.Dots, {
|
|
68
69
|
display: true
|
|
69
|
-
}),
|
|
70
|
+
}), area?.[item.id] && /* @__PURE__ */ React.createElement(Line.Area, {
|
|
70
71
|
area: area[item.id],
|
|
71
72
|
y0: "y0",
|
|
72
73
|
y1: "y1",
|
|
@@ -4,8 +4,9 @@ import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
|
4
4
|
import { scaleLinear } from "d3-scale";
|
|
5
5
|
import React from "react";
|
|
6
6
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
7
|
-
import
|
|
7
|
+
import "../../index.mjs";
|
|
8
8
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
9
|
+
import Radar from "../../Radar.mjs";
|
|
9
10
|
class RadarChartComponent extends AbstractChart {
|
|
10
11
|
renderChart() {
|
|
11
12
|
const {
|
|
@@ -48,11 +49,9 @@ class RadarChartComponent extends AbstractChart {
|
|
|
48
49
|
}, ({
|
|
49
50
|
index
|
|
50
51
|
}) => {
|
|
51
|
-
var _a;
|
|
52
52
|
return {
|
|
53
|
-
children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Radar.Tooltip.Title, null,
|
|
54
|
-
|
|
55
|
-
const value = (_a2 = data[item.id]) == null ? void 0 : _a2[index];
|
|
53
|
+
children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Radar.Tooltip.Title, null, data[groupKey]?.[index]), dataDefinitions.map((item) => {
|
|
54
|
+
const value = data[item.id]?.[index];
|
|
56
55
|
return item.checked && /* @__PURE__ */ React.createElement(Radar.Tooltip.Dot, {
|
|
57
56
|
color: item.color,
|
|
58
57
|
key: item.id
|
|
@@ -4,10 +4,11 @@ import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
|
4
4
|
import { Text } from "@semcore/typography";
|
|
5
5
|
import { scaleTime, scaleLinear } from "d3-scale";
|
|
6
6
|
import React from "react";
|
|
7
|
-
import
|
|
8
|
-
import { getScatterPlotRadius, minMax } from "../../utils.mjs";
|
|
7
|
+
import "../../index.mjs";
|
|
9
8
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
10
9
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
10
|
+
import { getScatterPlotRadius, minMax } from "../../utils.mjs";
|
|
11
|
+
import ScatterPlot from "../../ScatterPlot.mjs";
|
|
11
12
|
class ScatterPlotChartComponent extends AbstractChart {
|
|
12
13
|
get dataKeys() {
|
|
13
14
|
const {
|
|
@@ -4,9 +4,10 @@ import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
|
4
4
|
import { Text } from "@semcore/typography";
|
|
5
5
|
import { scaleLinear } from "d3-scale";
|
|
6
6
|
import React from "react";
|
|
7
|
-
import
|
|
7
|
+
import "../../index.mjs";
|
|
8
8
|
import { AbstractChart } from "./AbstractChart.mjs";
|
|
9
9
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
10
|
+
import Venn from "../../Venn.mjs";
|
|
10
11
|
class VennChartComponent extends AbstractChart {
|
|
11
12
|
get xScale() {
|
|
12
13
|
const {
|
|
@@ -81,8 +82,7 @@ class VennChartComponent extends AbstractChart {
|
|
|
81
82
|
return null;
|
|
82
83
|
}
|
|
83
84
|
const name = intersectionKeys.map((id) => {
|
|
84
|
-
|
|
85
|
-
return ((_a = dataDefinitions.find((legendItem) => legendItem.id === id)) == null ? void 0 : _a.label) || "";
|
|
85
|
+
return dataDefinitions.find((legendItem) => legendItem.id === id)?.label || "";
|
|
86
86
|
}).join(" & ");
|
|
87
87
|
return /* @__PURE__ */ React.createElement(Venn.Intersection, {
|
|
88
88
|
key: intersectionKey,
|
|
@@ -5,36 +5,31 @@ class BaseLegend extends Component {
|
|
|
5
5
|
constructor(...args) {
|
|
6
6
|
super(...args);
|
|
7
7
|
_defineProperty(this, "onChangeLegendItem", (shape) => (id, checked) => {
|
|
8
|
-
var _a, _b, _c, _d, _e, _f;
|
|
9
8
|
if (shape !== "Checkbox") return;
|
|
10
|
-
|
|
9
|
+
this.props.onChangeVisibleItem?.(id, checked);
|
|
11
10
|
if (checked) {
|
|
12
|
-
|
|
11
|
+
this.props.onMouseEnterItem?.(id);
|
|
13
12
|
} else {
|
|
14
|
-
|
|
13
|
+
this.props.onMouseLeaveItem?.(id);
|
|
15
14
|
}
|
|
16
15
|
});
|
|
17
16
|
_defineProperty(this, "onFocusLegendItem", (checked) => (id) => {
|
|
18
|
-
var _a, _b, _c, _d;
|
|
19
17
|
if (!checked) {
|
|
20
|
-
return
|
|
18
|
+
return this.props.onMouseLeaveItem?.(id);
|
|
21
19
|
}
|
|
22
|
-
|
|
20
|
+
this.props.onMouseEnterItem?.(id);
|
|
23
21
|
});
|
|
24
22
|
_defineProperty(this, "onBlurLegendItem", (id) => {
|
|
25
|
-
|
|
26
|
-
(_b = (_a = this.props).onMouseLeaveItem) == null ? void 0 : _b.call(_a, id);
|
|
23
|
+
this.props.onMouseLeaveItem?.(id);
|
|
27
24
|
});
|
|
28
25
|
_defineProperty(this, "bindOnMouseEnterItem", (id) => {
|
|
29
26
|
return (e) => {
|
|
30
|
-
|
|
31
|
-
(_b = (_a = this.props).onMouseEnterItem) == null ? void 0 : _b.call(_a, id, e);
|
|
27
|
+
this.props.onMouseEnterItem?.(id, e);
|
|
32
28
|
};
|
|
33
29
|
});
|
|
34
30
|
_defineProperty(this, "bindOnMouseLeaveItem", (id) => {
|
|
35
31
|
return (e) => {
|
|
36
|
-
|
|
37
|
-
(_b = (_a = this.props).onMouseLeaveItem) == null ? void 0 : _b.call(_a, id, e);
|
|
32
|
+
this.props.onMouseLeaveItem?.(id, e);
|
|
38
33
|
};
|
|
39
34
|
});
|
|
40
35
|
}
|
|
@@ -53,7 +48,7 @@ class BaseLegend extends Component {
|
|
|
53
48
|
} = this.asProps;
|
|
54
49
|
const dataHintsHandler = dataHints ? makeDataHintsHandlers(dataHints) : void 0;
|
|
55
50
|
items.forEach((legendItem) => {
|
|
56
|
-
dataHintsHandler
|
|
51
|
+
dataHintsHandler?.labelKey("value", legendItem.id, legendItem.label);
|
|
57
52
|
});
|
|
58
53
|
}
|
|
59
54
|
getItem(index) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
import {
|
|
2
|
+
import { sstyled, assignProps, createComponent } from "@semcore/core";
|
|
3
3
|
import { Flex } from "@semcore/base-components";
|
|
4
4
|
import Checkbox from "@semcore/checkbox";
|
|
5
5
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
@@ -8,7 +8,6 @@ import React from "react";
|
|
|
8
8
|
import { localizedMessages } from "../../../translations/__intergalactic-dynamic-locales.mjs";
|
|
9
9
|
import { BaseLegend } from "../BaseLegend.mjs";
|
|
10
10
|
import { LegendItemComponent } from "../LegendItem/LegendItem.mjs";
|
|
11
|
-
/*!__reshadow-styles__:"./legend-flex.shadow.css"*/
|
|
12
11
|
const style = (
|
|
13
12
|
/*__reshadow_css_start__*/
|
|
14
13
|
(sstyled.insert(
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
import {
|
|
2
|
+
import { sstyled, Component, assignProps, createComponent } from "@semcore/core";
|
|
3
3
|
import { Flex, Box } from "@semcore/base-components";
|
|
4
4
|
import Checkbox from "@semcore/checkbox";
|
|
5
5
|
import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
|
|
@@ -9,7 +9,6 @@ import React from "react";
|
|
|
9
9
|
import { StaticShapes } from "./LegendItem.type.mjs";
|
|
10
10
|
import { PatternSymbol } from "../../../Pattern.mjs";
|
|
11
11
|
import { getChartDefaultColorName } from "../../../utils.mjs";
|
|
12
|
-
/*!__reshadow-styles__:"./legend-item.shadow.css"*/
|
|
13
12
|
const style = (
|
|
14
13
|
/*__reshadow_css_start__*/
|
|
15
14
|
(sstyled.insert(
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
import {
|
|
2
|
+
import { sstyled, assignProps, createComponent } from "@semcore/core";
|
|
3
3
|
import { Box } from "@semcore/base-components";
|
|
4
4
|
import React from "react";
|
|
5
5
|
import { BaseLegend } from "../BaseLegend.mjs";
|
|
6
6
|
import { LegendItemComponent } from "../LegendItem/LegendItem.mjs";
|
|
7
|
-
/*!__reshadow-styles__:"./legend-table.shadow.css"*/
|
|
8
7
|
const style = (
|
|
9
8
|
/*__reshadow_css_start__*/
|
|
10
9
|
(sstyled.insert(
|
|
@@ -23,7 +22,6 @@ const style = (
|
|
|
23
22
|
);
|
|
24
23
|
class LegendTableRoot extends BaseLegend {
|
|
25
24
|
render() {
|
|
26
|
-
var _a;
|
|
27
25
|
var _ref = this.asProps, _ref3;
|
|
28
26
|
const SLegendTable = Box;
|
|
29
27
|
const {
|
|
@@ -32,7 +30,7 @@ class LegendTableRoot extends BaseLegend {
|
|
|
32
30
|
size = "m",
|
|
33
31
|
items
|
|
34
32
|
} = this.asProps;
|
|
35
|
-
const columnsCount =
|
|
33
|
+
const columnsCount = items[0]?.columns.length;
|
|
36
34
|
return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(SLegendTable, _ref3.cn("SLegendTable", {
|
|
37
35
|
...assignProps({
|
|
38
36
|
"columns-count": columnsCount + 1,
|
|
@@ -30,12 +30,11 @@ class CigaretteBarRoot extends Component {
|
|
|
30
30
|
}
|
|
31
31
|
});
|
|
32
32
|
_defineProperty(this, "setCursor", (value) => {
|
|
33
|
-
var _a;
|
|
34
33
|
const {
|
|
35
34
|
onClick
|
|
36
35
|
} = this.asProps;
|
|
37
36
|
if (onClick) {
|
|
38
|
-
|
|
37
|
+
this.refElement.current?.style.setProperty("cursor", value);
|
|
39
38
|
}
|
|
40
39
|
});
|
|
41
40
|
}
|
|
@@ -6,7 +6,7 @@ import React from "react";
|
|
|
6
6
|
import Bar, { MIN_HEIGHT } from "../../Bar.mjs";
|
|
7
7
|
import createElement from "../../createElement.mjs";
|
|
8
8
|
import { scaleToBand, getChartDefaultColorName } from "../../utils.mjs";
|
|
9
|
-
const XY0 = Symbol("XY0");
|
|
9
|
+
const XY0 = /* @__PURE__ */ Symbol("XY0");
|
|
10
10
|
class StackGroupBarRoot extends Component {
|
|
11
11
|
constructor(props) {
|
|
12
12
|
super(props);
|
|
@@ -40,11 +40,10 @@ class StackGroupBarRoot extends Component {
|
|
|
40
40
|
this.forceUpdate();
|
|
41
41
|
}
|
|
42
42
|
getSeries(group) {
|
|
43
|
-
var _a, _b;
|
|
44
43
|
const {
|
|
45
44
|
data
|
|
46
45
|
} = this.asProps;
|
|
47
|
-
return
|
|
46
|
+
return this.stacks[group]?.(data);
|
|
48
47
|
}
|
|
49
48
|
getBarProps({
|
|
50
49
|
y,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import {
|
|
2
|
+
import { CONTEXT_COMPONENT, createBaseComponent, createComponent } from "@semcore/core";
|
|
3
3
|
import assignProps from "@semcore/core/lib/utils/assignProps";
|
|
4
4
|
import getOriginChildren from "@semcore/core/lib/utils/getOriginChildren";
|
|
5
5
|
import propsForElement from "@semcore/core/lib/utils/propsForElement";
|
package/lib/esm/index.mjs
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { default as default2 } from "./Plot.mjs";
|
|
2
|
+
import "./component/ChartLegend/index.mjs";
|
|
2
3
|
import { default as default3 } from "./component/Chart/index.mjs";
|
|
3
4
|
import { default as default4 } from "./component/StackGroupBar/StackGroupBar.mjs";
|
|
4
5
|
import { SvgElement } from "./component/SvgElement.mjs";
|