@milaboratories/miplots4 1.0.139 → 1.0.140
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StackedAreaElement.d.ts","sourceRoot":"","sources":["../../../../src/discrete/components/layers/StackedAreaElement.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,yBAAyB,CAAC;AAC1D,OAAO,KAAK,EAAU,YAAY,EAAsB,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAE3F,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAG1C,UAAU,gBAAgB;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,WAAW,CAAC;IACpB,SAAS,EAAE,eAAe,CAAC;IAC3B,WAAW,EAAE,WAAW,CAAC;IACzB,aAAa,EAAE;QACX,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,GAAG,EAAE,MAAM,CAAC;QACZ,MAAM,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,YAAY,EAAE,OAAO,CAAC;IACtB,iBAAiB,EAAE,YAAY,CAAC;IAChC,YAAY,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IACpC,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC/B;
|
|
1
|
+
{"version":3,"file":"StackedAreaElement.d.ts","sourceRoot":"","sources":["../../../../src/discrete/components/layers/StackedAreaElement.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,yBAAyB,CAAC;AAC1D,OAAO,KAAK,EAAU,YAAY,EAAsB,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAE3F,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAG1C,UAAU,gBAAgB;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,WAAW,CAAC;IACpB,SAAS,EAAE,eAAe,CAAC;IAC3B,WAAW,EAAE,WAAW,CAAC;IACzB,aAAa,EAAE;QACX,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,GAAG,EAAE,MAAM,CAAC;QACZ,MAAM,EAAE,MAAM,CAAC;KAClB,CAAC;IACF,YAAY,EAAE,OAAO,CAAC;IACtB,iBAAiB,EAAE,YAAY,CAAC;IAChC,YAAY,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IACpC,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAsFD,wBAAgB,kBAAkB,CAAC,EAC/B,QAAQ,EACR,MAAM,EACN,WAAW,EACX,SAAS,EACT,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,sBAAsB,EACtB,iBAAiB,EACjB,YAAY,GACf,EAAE,gBAAgB,2CA6DlB"}
|
|
@@ -1,39 +1,39 @@
|
|
|
1
1
|
import { j as g } from "../../../node_modules/react/jsx-runtime.js";
|
|
2
2
|
import { r as E } from "../../../_virtual/index.js";
|
|
3
|
-
import { StackedBarElement as
|
|
3
|
+
import { StackedBarElement as M } from "./StackedBarElement.js";
|
|
4
4
|
import S from "../../../node_modules/d3-shape/src/area.js";
|
|
5
|
-
import { bumpX as
|
|
6
|
-
function
|
|
5
|
+
import { bumpX as G, bumpY as B } from "../../../node_modules/d3-shape/src/curve/bump.js";
|
|
6
|
+
function C(t) {
|
|
7
7
|
return t && typeof t == "object" && "type" in t && t.type === "secondaryGrouping";
|
|
8
8
|
}
|
|
9
|
-
function P(t, n, e, r,
|
|
9
|
+
function P(t, n, e, r, h) {
|
|
10
10
|
if (e && typeof e == "object" && "type" in e) {
|
|
11
11
|
if (e.type === "primaryGrouping")
|
|
12
12
|
return t.xPrimaryAes(r)[n];
|
|
13
13
|
if (e.type === "secondaryGrouping")
|
|
14
|
-
return t.xSecondaryAes(
|
|
14
|
+
return t.xSecondaryAes(h)[n];
|
|
15
15
|
}
|
|
16
16
|
return e;
|
|
17
17
|
}
|
|
18
|
-
function W(t, n, e, r,
|
|
19
|
-
const y = (e - n) / 2, l = j.
|
|
20
|
-
const
|
|
21
|
-
let
|
|
22
|
-
return
|
|
18
|
+
function W(t, n, e, r, h, d, j) {
|
|
19
|
+
const y = (e - n) / 2, l = j.reduce((s, i) => {
|
|
20
|
+
const p = {};
|
|
21
|
+
let o = 0;
|
|
22
|
+
return h.forEach((c) => {
|
|
23
23
|
var u;
|
|
24
|
-
const
|
|
25
|
-
|
|
26
|
-
y1:
|
|
27
|
-
y2:
|
|
28
|
-
},
|
|
29
|
-
}), s;
|
|
30
|
-
});
|
|
31
|
-
return
|
|
32
|
-
const
|
|
33
|
-
const
|
|
34
|
-
return d ? [
|
|
35
|
-
}), p = (d ? S().curve(
|
|
36
|
-
return { secondaryKey:
|
|
24
|
+
const m = ((u = i.valuesMap[c]) == null ? void 0 : u.height) ?? 0;
|
|
25
|
+
p[c] = {
|
|
26
|
+
y1: o,
|
|
27
|
+
y2: o + m
|
|
28
|
+
}, o += m;
|
|
29
|
+
}), s[i.primaryGrouping] = p, s;
|
|
30
|
+
}, {});
|
|
31
|
+
return h.map((s) => {
|
|
32
|
+
const i = r.flatMap((o) => {
|
|
33
|
+
const c = l[o], m = t.xPrimary(o) ?? 0, u = t.y(c[s].y1), A = t.y(c[s].y2), x = [m + y, u, A], a = [m + e - y, u, A];
|
|
34
|
+
return d ? [x, a] : [a, x];
|
|
35
|
+
}), p = (d ? S().curve(G).x((o) => o[0]).y0((o) => o[1]).y1((o) => o[2])(i) : S().curve(B).y((o) => o[0]).x0((o) => o[1]).x1((o) => o[2])(i)) ?? "";
|
|
36
|
+
return { secondaryKey: s, pathD: p };
|
|
37
37
|
});
|
|
38
38
|
}
|
|
39
39
|
function k(t, n) {
|
|
@@ -44,58 +44,58 @@ function X({
|
|
|
44
44
|
scales: n,
|
|
45
45
|
orientation: e,
|
|
46
46
|
layerData: r,
|
|
47
|
-
sideDistances:
|
|
47
|
+
sideDistances: h,
|
|
48
48
|
showTooltips: d,
|
|
49
49
|
secondaryGrouping: j,
|
|
50
50
|
activeElementContainer: y,
|
|
51
51
|
tooltipsContainer: l,
|
|
52
|
-
tooltipsData:
|
|
52
|
+
tooltipsData: s
|
|
53
53
|
}) {
|
|
54
|
-
const [
|
|
54
|
+
const [i, p] = E.useState(null), o = e === "vertical", c = n.xPrimary.bandwidth(), m = k(r, c), u = n.xPrimary.domain(), A = n.xSecondary.domain().reverse(), x = C(r.aes.fillColor) || typeof r.aes.fillColor == "string", a = x ? W(
|
|
55
55
|
n,
|
|
56
|
-
|
|
56
|
+
m,
|
|
57
57
|
c,
|
|
58
|
-
|
|
59
|
-
|
|
58
|
+
u,
|
|
59
|
+
A,
|
|
60
60
|
o,
|
|
61
61
|
r.geoms[t]
|
|
62
62
|
) : [];
|
|
63
63
|
return /* @__PURE__ */ g.jsxs("g", { children: [
|
|
64
|
-
/* @__PURE__ */ g.jsx("g", { children: x &&
|
|
64
|
+
/* @__PURE__ */ g.jsx("g", { children: x && a.map(({ secondaryKey: f, pathD: b }) => /* @__PURE__ */ g.jsx(
|
|
65
65
|
"path",
|
|
66
66
|
{
|
|
67
67
|
d: b,
|
|
68
|
-
fill: P(n, "fillColor", r.aes.fillColor,
|
|
69
|
-
opacity: r.aes.areaOpacity * (
|
|
70
|
-
onMouseEnter: () => p(
|
|
68
|
+
fill: P(n, "fillColor", r.aes.fillColor, u[0], f),
|
|
69
|
+
opacity: r.aes.areaOpacity * (i !== null && f !== i ? 0.5 : 1),
|
|
70
|
+
onMouseEnter: () => p(f),
|
|
71
71
|
onMouseLeave: () => p(null)
|
|
72
72
|
},
|
|
73
|
-
|
|
73
|
+
f
|
|
74
74
|
)) }),
|
|
75
|
-
/* @__PURE__ */ g.jsx("g", { children: r.meta.showBars && r.geoms[t].map((
|
|
76
|
-
|
|
75
|
+
/* @__PURE__ */ g.jsx("g", { children: r.meta.showBars && r.geoms[t].map((f) => /* @__PURE__ */ g.jsx(
|
|
76
|
+
M,
|
|
77
77
|
{
|
|
78
78
|
facetKey: t,
|
|
79
|
-
geom:
|
|
79
|
+
geom: f,
|
|
80
80
|
elementsAmount: r.geoms[t].length,
|
|
81
81
|
scales: n,
|
|
82
82
|
orientation: e,
|
|
83
83
|
aes: {
|
|
84
84
|
...r.aes,
|
|
85
|
-
width:
|
|
85
|
+
width: m,
|
|
86
86
|
opacity: r.aes.barsOpacity
|
|
87
87
|
},
|
|
88
88
|
normalize: r.meta.normalize,
|
|
89
|
-
sideDistances:
|
|
89
|
+
sideDistances: h,
|
|
90
90
|
showTooltips: d,
|
|
91
91
|
secondaryGrouping: j,
|
|
92
|
-
tooltipsData:
|
|
92
|
+
tooltipsData: s,
|
|
93
93
|
activeElementContainer: y,
|
|
94
94
|
tooltipsContainer: l,
|
|
95
|
-
activeKey:
|
|
95
|
+
activeKey: i,
|
|
96
96
|
onSectionHover: p
|
|
97
97
|
},
|
|
98
|
-
|
|
98
|
+
f.key
|
|
99
99
|
)) })
|
|
100
100
|
] });
|
|
101
101
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StackedAreaElement.js","sources":["../../../../src/discrete/components/layers/StackedAreaElement.tsx"],"sourcesContent":["import {area, curveBumpX, curveBumpY} from 'd3-shape';\nimport React, { useState } from 'react';\nimport type {TooltipsData} from '../../../common/Tooltip';\nimport type {AesItem, GroupingData, InheritAesDiscrete, Orientation} from '../../../types';\nimport type {StackedBar} from '../../layers';\nimport type {StackedAreaData} from '../../layers/types';\nimport type {ChartScales} from '../types';\nimport {StackedBarElement} from './StackedBarElement';\n\ninterface StackedAreaProps {\n facetKey: string;\n scales: ChartScales;\n layerData: StackedAreaData;\n orientation: Orientation;\n sideDistances: {\n left: number;\n right: number;\n top: number;\n bottom: number;\n };\n showTooltips: boolean;\n secondaryGrouping: GroupingData;\n tooltipsData: TooltipsData<unknown>;\n activeElementContainer?: Element;\n tooltipsContainer?: Element;\n}\n\nfunction isSecondaryGroupedAes (value: string | InheritAesDiscrete) {\n return value && typeof value === 'object' && 'type' in value && value.type === 'secondaryGrouping';\n}\n\nfunction getAesValue<ValueType>(\n scales: ChartScales,\n field: keyof AesItem,\n value: ValueType | InheritAesDiscrete,\n primaryGrouping: string,\n secondaryGrouping: string\n): ValueType {\n if (value && typeof value === 'object' && 'type' in value) {\n if (value.type === 'primaryGrouping') {\n return scales.xPrimaryAes(primaryGrouping)[field] as ValueType;\n }\n if (value.type === 'secondaryGrouping') {\n return scales.xSecondaryAes(secondaryGrouping)[field] as ValueType;\n }\n }\n return value as ValueType;\n}\n\nfunction getAreas(\n scales: ChartScales,\n barWidth: number,\n bandWidth: number,\n primaryKeys: string[],\n secondaryKeys: string[],\n isVertical: boolean,\n bars: StackedBar[],\n) {\n const offsetX = (bandWidth - barWidth) / 2;\n const ys = bars.map((bar) => {\n const yValues:Record<string, {y1: number, y2: number}> = {};\n let currentHeight = 0;\n secondaryKeys.forEach(secondaryKey => {\n const height = bar.valuesMap[secondaryKey]?.height ?? 0;\n yValues[secondaryKey] = {\n y1: currentHeight,\n y2: currentHeight + height,\n };\n currentHeight += height;\n });\n return yValues;\n });\n\n return secondaryKeys.map((secondaryKey) => {\n const points:[number, number, number][] = ys.flatMap((yMap, idx) => {\n const primaryKey = primaryKeys[idx];\n const x = scales.xPrimary(primaryKey) ?? 0;\n const y1 = scales.y(yMap[secondaryKey].y1);\n const y2 = scales.y(yMap[secondaryKey].y2);\n const p1:[number, number, number] = [x + offsetX, y1, y2];\n const p2:[number, number, number] = [x + bandWidth - offsetX, y1, y2];\n return isVertical ? [p1, p2] : [p2, p1];\n });\n\n const pathD = (isVertical ? (\n area<[number, number, number]>()\n .curve(curveBumpX)\n .x(d => d[0])\n .y0(d => d[1])\n .y1(d => d[2])(points)\n ) :\n area<[number, number, number]>()\n .curve(curveBumpY)\n .y(d => d[0])\n .x0(d => d[1])\n .x1(d => d[2])(points)) ?? '';\n return {secondaryKey, pathD};\n });\n}\n\nfunction calculateBarWidth (\n layerData: StackedAreaData,\n bandwidth: number\n) {\n if (!layerData.meta.showBars) {\n return 0;\n }\n return layerData.aes.barWidth === 'auto' ? bandwidth * 0.2 : Math.min(bandwidth, layerData.aes.barWidth);\n}\n\nexport function StackedAreaElement({\n facetKey,\n scales,\n orientation,\n layerData,\n sideDistances,\n showTooltips,\n secondaryGrouping,\n activeElementContainer,\n tooltipsContainer,\n tooltipsData,\n}: StackedAreaProps) {\n const [selectedAreaKey, setSelectedAreaKey] = useState<string | null>(null);\n const isVertical = orientation === 'vertical';\n const boxOuterWidth = scales.xPrimary.bandwidth();\n const boxWidth = calculateBarWidth(layerData, boxOuterWidth);\n const primaryKeys = scales.xPrimary.domain();\n const secondaryKeys = scales.xSecondary.domain().reverse();\n\n const needsAreas = isSecondaryGroupedAes(layerData.aes.fillColor) || typeof layerData.aes.fillColor === 'string';\n const areas = needsAreas ? getAreas(\n scales,\n boxWidth,\n boxOuterWidth,\n primaryKeys,\n secondaryKeys,\n isVertical,\n layerData.geoms[facetKey]\n ) : [];\n\n return (\n <g>\n <g>\n {needsAreas && areas.map(({secondaryKey, pathD}) => (\n <path\n key={secondaryKey}\n d={pathD}\n fill={getAesValue(scales, 'fillColor', layerData.aes.fillColor, primaryKeys[0], secondaryKey)}\n opacity={layerData.aes.areaOpacity * (selectedAreaKey !== null && secondaryKey !== selectedAreaKey ? 0.5 : 1)}\n onMouseEnter={() => setSelectedAreaKey(secondaryKey)}\n onMouseLeave={() => setSelectedAreaKey(null)}\n />\n ))}\n </g>\n <g>\n {layerData.meta.showBars && (layerData as StackedAreaData).geoms[facetKey].map(geom => (\n <StackedBarElement\n key={geom.key}\n facetKey={facetKey}\n geom={geom}\n elementsAmount={layerData.geoms[facetKey].length}\n scales={scales}\n orientation={orientation}\n aes={{\n ...layerData.aes,\n width: boxWidth,\n opacity: layerData.aes.barsOpacity\n }}\n normalize={layerData.meta.normalize}\n sideDistances={sideDistances}\n showTooltips={showTooltips}\n secondaryGrouping={secondaryGrouping}\n tooltipsData={tooltipsData}\n activeElementContainer={activeElementContainer}\n tooltipsContainer={tooltipsContainer}\n activeKey={selectedAreaKey}\n onSectionHover={setSelectedAreaKey}\n />\n ))}\n </g>\n </g>\n );\n}\n"],"names":["isSecondaryGroupedAes","value","getAesValue","scales","field","primaryGrouping","secondaryGrouping","getAreas","barWidth","bandWidth","primaryKeys","secondaryKeys","isVertical","bars","offsetX","ys","bar","yValues","currentHeight","secondaryKey","height","_a","points","yMap","idx","primaryKey","x","y1","y2","p1","p2","pathD","area","curveBumpX","d","curveBumpY","calculateBarWidth","layerData","bandwidth","StackedAreaElement","facetKey","orientation","sideDistances","showTooltips","activeElementContainer","tooltipsContainer","tooltipsData","selectedAreaKey","setSelectedAreaKey","useState","boxOuterWidth","boxWidth","needsAreas","areas","jsx","geom","StackedBarElement"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"StackedAreaElement.js","sources":["../../../../src/discrete/components/layers/StackedAreaElement.tsx"],"sourcesContent":["import {area, curveBumpX, curveBumpY} from 'd3-shape';\nimport React, { useState } from 'react';\nimport type {TooltipsData} from '../../../common/Tooltip';\nimport type {AesItem, GroupingData, InheritAesDiscrete, Orientation} from '../../../types';\nimport type {StackedBar} from '../../layers';\nimport type {StackedAreaData} from '../../layers/types';\nimport type {ChartScales} from '../types';\nimport {StackedBarElement} from './StackedBarElement';\n\ninterface StackedAreaProps {\n facetKey: string;\n scales: ChartScales;\n layerData: StackedAreaData;\n orientation: Orientation;\n sideDistances: {\n left: number;\n right: number;\n top: number;\n bottom: number;\n };\n showTooltips: boolean;\n secondaryGrouping: GroupingData;\n tooltipsData: TooltipsData<unknown>;\n activeElementContainer?: Element;\n tooltipsContainer?: Element;\n}\n\nfunction isSecondaryGroupedAes (value: string | InheritAesDiscrete) {\n return value && typeof value === 'object' && 'type' in value && value.type === 'secondaryGrouping';\n}\n\nfunction getAesValue<ValueType>(\n scales: ChartScales,\n field: keyof AesItem,\n value: ValueType | InheritAesDiscrete,\n primaryGrouping: string,\n secondaryGrouping: string\n): ValueType {\n if (value && typeof value === 'object' && 'type' in value) {\n if (value.type === 'primaryGrouping') {\n return scales.xPrimaryAes(primaryGrouping)[field] as ValueType;\n }\n if (value.type === 'secondaryGrouping') {\n return scales.xSecondaryAes(secondaryGrouping)[field] as ValueType;\n }\n }\n return value as ValueType;\n}\n\nfunction getAreas(\n scales: ChartScales,\n barWidth: number,\n bandWidth: number,\n primaryKeys: string[],\n secondaryKeys: string[],\n isVertical: boolean,\n bars: StackedBar[],\n) {\n const offsetX = (bandWidth - barWidth) / 2;\n const ys = bars.reduce((res, bar) => {\n const yValues: Record<string, {y1: number, y2: number}> = {};\n let currentHeight = 0;\n secondaryKeys.forEach(secondaryKey => {\n const height = bar.valuesMap[secondaryKey]?.height ?? 0;\n yValues[secondaryKey] = {\n y1: currentHeight,\n y2: currentHeight + height,\n };\n currentHeight += height;\n });\n res[bar.primaryGrouping] = yValues;\n return res;\n }, {} as Record<string, Record<string, {y1: number, y2: number}>>);\n\n return secondaryKeys.map((secondaryKey) => {\n const points:[number, number, number][] = primaryKeys.flatMap((primaryKey) => {\n const yMap = ys[primaryKey];\n const x = scales.xPrimary(primaryKey) ?? 0;\n const y1 = scales.y(yMap[secondaryKey].y1);\n const y2 = scales.y(yMap[secondaryKey].y2);\n const p1:[number, number, number] = [x + offsetX, y1, y2];\n const p2:[number, number, number] = [x + bandWidth - offsetX, y1, y2];\n return isVertical ? [p1, p2] : [p2, p1];\n });\n\n const pathD = (isVertical ? (\n area<[number, number, number]>()\n .curve(curveBumpX)\n .x(d => d[0])\n .y0(d => d[1])\n .y1(d => d[2])(points)\n ) :\n area<[number, number, number]>()\n .curve(curveBumpY)\n .y(d => d[0])\n .x0(d => d[1])\n .x1(d => d[2])(points)) ?? '';\n return {secondaryKey, pathD};\n });\n}\n\nfunction calculateBarWidth (\n layerData: StackedAreaData,\n bandwidth: number\n) {\n if (!layerData.meta.showBars) {\n return 0;\n }\n return layerData.aes.barWidth === 'auto' ? bandwidth * 0.2 : Math.min(bandwidth, layerData.aes.barWidth);\n}\n\nexport function StackedAreaElement({\n facetKey,\n scales,\n orientation,\n layerData,\n sideDistances,\n showTooltips,\n secondaryGrouping,\n activeElementContainer,\n tooltipsContainer,\n tooltipsData,\n}: StackedAreaProps) {\n const [selectedAreaKey, setSelectedAreaKey] = useState<string | null>(null);\n const isVertical = orientation === 'vertical';\n const boxOuterWidth = scales.xPrimary.bandwidth();\n const boxWidth = calculateBarWidth(layerData, boxOuterWidth);\n const primaryKeys = scales.xPrimary.domain();\n const secondaryKeys = scales.xSecondary.domain().reverse();\n\n const needsAreas = isSecondaryGroupedAes(layerData.aes.fillColor) || typeof layerData.aes.fillColor === 'string';\n const areas = needsAreas ? getAreas(\n scales,\n boxWidth,\n boxOuterWidth,\n primaryKeys,\n secondaryKeys,\n isVertical,\n layerData.geoms[facetKey]\n ) : [];\n\n return (\n <g>\n <g>\n {needsAreas && areas.map(({secondaryKey, pathD}) => (\n <path\n key={secondaryKey}\n d={pathD}\n fill={getAesValue(scales, 'fillColor', layerData.aes.fillColor, primaryKeys[0], secondaryKey)}\n opacity={layerData.aes.areaOpacity * (selectedAreaKey !== null && secondaryKey !== selectedAreaKey ? 0.5 : 1)}\n onMouseEnter={() => setSelectedAreaKey(secondaryKey)}\n onMouseLeave={() => setSelectedAreaKey(null)}\n />\n ))}\n </g>\n <g>\n {layerData.meta.showBars && (layerData as StackedAreaData).geoms[facetKey].map(geom => (\n <StackedBarElement\n key={geom.key}\n facetKey={facetKey}\n geom={geom}\n elementsAmount={layerData.geoms[facetKey].length}\n scales={scales}\n orientation={orientation}\n aes={{\n ...layerData.aes,\n width: boxWidth,\n opacity: layerData.aes.barsOpacity\n }}\n normalize={layerData.meta.normalize}\n sideDistances={sideDistances}\n showTooltips={showTooltips}\n secondaryGrouping={secondaryGrouping}\n tooltipsData={tooltipsData}\n activeElementContainer={activeElementContainer}\n tooltipsContainer={tooltipsContainer}\n activeKey={selectedAreaKey}\n onSectionHover={setSelectedAreaKey}\n />\n ))}\n </g>\n </g>\n );\n}\n"],"names":["isSecondaryGroupedAes","value","getAesValue","scales","field","primaryGrouping","secondaryGrouping","getAreas","barWidth","bandWidth","primaryKeys","secondaryKeys","isVertical","bars","offsetX","ys","res","bar","yValues","currentHeight","secondaryKey","height","_a","points","primaryKey","yMap","x","y1","y2","p1","p2","pathD","area","curveBumpX","d","curveBumpY","calculateBarWidth","layerData","bandwidth","StackedAreaElement","facetKey","orientation","sideDistances","showTooltips","activeElementContainer","tooltipsContainer","tooltipsData","selectedAreaKey","setSelectedAreaKey","useState","boxOuterWidth","boxWidth","needsAreas","areas","jsx","geom","StackedBarElement"],"mappings":"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"}
|