@undp/data-viz 1.4.11 → 1.4.13

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.
Files changed (42) hide show
  1. package/dist/DualAxisLineChart.cjs +1 -1
  2. package/dist/DualAxisLineChart.cjs.map +1 -1
  3. package/dist/DualAxisLineChart.d.ts +3 -1
  4. package/dist/DualAxisLineChart.js +232 -229
  5. package/dist/DualAxisLineChart.js.map +1 -1
  6. package/dist/{GraphEl-s3ctz7oA.js → GraphEl-B3xVlimz.js} +5 -1
  7. package/dist/GraphEl-B3xVlimz.js.map +1 -0
  8. package/dist/GraphEl-DO-juRN8.cjs +2 -0
  9. package/dist/GraphEl-DO-juRN8.cjs.map +1 -0
  10. package/dist/GriddedGraphs.cjs +1 -1
  11. package/dist/GriddedGraphs.d.ts +1 -0
  12. package/dist/GriddedGraphs.js +1 -1
  13. package/dist/GriddedGraphsFromConfig.d.ts +1 -0
  14. package/dist/MultiGraphDashboard.d.ts +1 -0
  15. package/dist/MultiGraphDashboardFromConfig.d.ts +1 -0
  16. package/dist/ParetoChart.cjs +1 -1
  17. package/dist/ParetoChart.cjs.map +1 -1
  18. package/dist/ParetoChart.d.ts +4 -0
  19. package/dist/ParetoChart.js +310 -306
  20. package/dist/ParetoChart.js.map +1 -1
  21. package/dist/PerformanceIntensiveMultiGraphDashboard.d.ts +1 -0
  22. package/dist/PerformanceIntensiveMultiGraphDashboardFromConfig.d.ts +1 -0
  23. package/dist/PerformanceIntensiveScrollStory.d.ts +1 -0
  24. package/dist/ScrollStory.d.ts +1 -0
  25. package/dist/SingleGraphDashboard.cjs +1 -1
  26. package/dist/SingleGraphDashboard.d.ts +1 -0
  27. package/dist/SingleGraphDashboard.js +1 -1
  28. package/dist/SingleGraphDashboardFromConfig.d.ts +1 -0
  29. package/dist/SingleGraphDashboardGeoHubMaps.d.ts +1 -0
  30. package/dist/SingleGraphDashboardGeoHubMapsFromConfig.d.ts +1 -0
  31. package/dist/SingleGraphDashboardThreeDGraphs.d.ts +1 -0
  32. package/dist/SingleGraphDashboardThreeDGraphsFromConfig.d.ts +1 -0
  33. package/dist/ThreeDGlobe.cjs +1 -1
  34. package/dist/ThreeDGlobe.cjs.map +1 -1
  35. package/dist/ThreeDGlobe.js +73 -71
  36. package/dist/ThreeDGlobe.js.map +1 -1
  37. package/dist/Types.d.ts +1 -0
  38. package/dist/index.d.ts +8 -1
  39. package/package.json +1 -1
  40. package/dist/GraphEl-OzC-icbr.cjs +0 -2
  41. package/dist/GraphEl-OzC-icbr.cjs.map +0 -1
  42. package/dist/GraphEl-s3ctz7oA.js.map +0 -1
@@ -1,227 +1,228 @@
1
- import { j as t, m as R } from "./index-CHPV5EwG-BPSP-7Jg.js";
2
- import { useRef as di, useState as B, useEffect as wi } from "react";
3
- import { i as fi } from "./index-27yTRcko.js";
4
- import { X as ji } from "./Modal-DVVwpKhP.js";
5
- import { n as ni } from "./numberFormattingFunction-14YCbkN2.js";
6
- import { T as Ai } from "./Tooltip-DyM5snqx.js";
7
- import { s as Mi } from "./string2HTML-CWHGfz_d.js";
8
- import { c as hi } from "./checkIfNullOrUndefined-DmfiKkNw.js";
9
- import { A as ui } from "./Axis-Ddg-seDi.js";
10
- import { A as gi } from "./AxisTitle-BmHLMRJZ.js";
11
- import { X as Ni } from "./XAxesLabels-CaV2q-6H.js";
12
- import { b as ki } from "./band-BEjh2CHI.js";
13
- import { a as yi } from "./linear-DUdu7l2G.js";
14
- import { l as $i, c as Ci } from "./line-CPfhohvF.js";
15
- import { c as Ii, s as Li, a as Ti, m as Si } from "./step-BrDul-H4.js";
16
- import { u as Vi } from "./use-in-view-yS6jzJAp.js";
1
+ import { j as t, m as _ } from "./index-CHPV5EwG-BPSP-7Jg.js";
2
+ import { useRef as fi, useState as W, useEffect as ji } from "react";
3
+ import { i as gi } from "./index-27yTRcko.js";
4
+ import { X as Ai } from "./Modal-DVVwpKhP.js";
5
+ import { n as oi } from "./numberFormattingFunction-14YCbkN2.js";
6
+ import { T as Mi } from "./Tooltip-DyM5snqx.js";
7
+ import { s as Ni } from "./string2HTML-CWHGfz_d.js";
8
+ import { c as di } from "./checkIfNullOrUndefined-DmfiKkNw.js";
9
+ import { A as pi } from "./Axis-Ddg-seDi.js";
10
+ import { A as yi } from "./AxisTitle-BmHLMRJZ.js";
11
+ import { X as ki } from "./XAxesLabels-CaV2q-6H.js";
12
+ import { b as Ci } from "./band-BEjh2CHI.js";
13
+ import { a as bi } from "./linear-DUdu7l2G.js";
14
+ import { l as $i, c as Li } from "./line-CPfhohvF.js";
15
+ import { c as Ii, s as Si, a as Ti, m as Vi } from "./step-BrDul-H4.js";
16
+ import { u as Oi } from "./use-in-view-yS6jzJAp.js";
17
17
  import { m as D } from "./proxy-CkpFesk1.js";
18
- import { A as Oi } from "./index-CNvov0eg.js";
19
- import { GraphFooter as Pi } from "./GraphFooter.js";
20
- import { GraphHeader as Di } from "./GraphHeader.js";
21
- import { ColorLegend as Yi } from "./ColorLegend.js";
22
- import { Colors as oi } from "./Colors.js";
23
- import { E as Hi } from "./EmptyState-DdTp-Mdn.js";
24
- function Xi(li) {
18
+ import { A as Pi } from "./index-CNvov0eg.js";
19
+ import { GraphFooter as Di } from "./GraphFooter.js";
20
+ import { GraphHeader as Yi } from "./GraphHeader.js";
21
+ import { ColorLegend as Hi } from "./ColorLegend.js";
22
+ import { Colors as ci } from "./Colors.js";
23
+ import { E as Xi } from "./EmptyState-DdTp-Mdn.js";
24
+ function Ei(mi) {
25
25
  const {
26
- data: L,
27
- width: A,
26
+ data: S,
27
+ width: N,
28
28
  height: Y,
29
29
  barColor: p,
30
- lineColor: u,
30
+ lineColor: x,
31
31
  axisTitles: s,
32
- sameAxes: y,
33
- rightMargin: z,
34
- leftMargin: _,
35
- topMargin: q,
36
- bottomMargin: ci,
32
+ sameAxes: b,
33
+ rightMargin: q,
34
+ leftMargin: U,
35
+ topMargin: J,
36
+ bottomMargin: xi,
37
37
  tooltip: v,
38
- showValues: U,
38
+ showValues: K,
39
39
  onSeriesMouseOver: H,
40
- barPadding: mi,
41
- truncateBy: J,
42
- showLabels: K,
43
- onSeriesMouseClick: b,
44
- resetSelectionOnDoubleClick: Q,
45
- detailsOnClick: d,
46
- noOfTicks: Z,
47
- lineSuffix: ii,
48
- barSuffix: F,
49
- linePrefix: G,
50
- barPrefix: ti,
40
+ barPadding: hi,
41
+ truncateBy: Q,
42
+ showLabels: Z,
43
+ onSeriesMouseClick: w,
44
+ resetSelectionOnDoubleClick: ii,
45
+ detailsOnClick: h,
46
+ noOfTicks: ti,
47
+ lineSuffix: ei,
48
+ barSuffix: B,
49
+ linePrefix: F,
50
+ barPrefix: ai,
51
51
  curveType: X,
52
- styles: o,
53
- classNames: l,
54
- animate: r,
52
+ styles: n,
53
+ classNames: o,
54
+ animate: l,
55
55
  precision: E,
56
56
  customLayers: T,
57
- naLabel: M
58
- } = li, ei = di(null), N = Vi(ei, {
59
- once: r.once,
60
- amount: r.amount
61
- }), xi = X === "linear" ? Ci : X === "step" ? Ii : X === "stepAfter" ? Li : X === "stepBefore" ? Ti : Si, [ai, k] = B(void 0), [$, S] = B(void 0), [si, C] = B(void 0), [ri, x] = B(void 0), n = {
62
- top: q,
63
- bottom: ci,
64
- left: _ + 50,
65
- right: z + 65
66
- }, h = A - n.left - n.right, f = Y - n.top - n.bottom, a = L.map((i, j) => ({ ...i, id: `${j}` })), c = ki().domain(a.map((i) => `${i.id}`)).range([0, h]).paddingInner(mi), w = Math.min(...a.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.min(...a.map((i) => i.bar).filter((i) => i != null)) > 0 ? 0 : Math.min(...a.map((i) => i.bar).filter((i) => i != null)) : 0, W = Math.min(...a.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.min(...a.map((i) => i.line).filter((i) => i != null)) > 0 ? 0 : Math.min(...a.map((i) => i.line).filter((i) => i != null)) : 0, V = Math.max(...a.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.max(...a.map((i) => i.bar).filter((i) => i != null)) : 0, O = Math.max(...a.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.max(...a.map((i) => i.line).filter((i) => i != null)) : 0, I = w < W ? w : W, P = V > O ? V : O, e = yi().domain([
67
- y ? I : w,
68
- y ? P > 0 ? P : 0 : V > 0 ? V : 0
69
- ]).range([f, 0]).nice(), m = yi().domain([
70
- y ? I : W,
71
- y ? P > 0 ? P : 0 : O > 0 ? O : 0
72
- ]).range([f, 0]).nice(), pi = $i().defined((i) => !hi(i.line)).x((i) => c(`${i.id}`) + c.bandwidth() / 2).y((i) => m(i.line)).curve(xi), vi = e.ticks(Z), bi = m.ticks(Z);
57
+ naLabel: k,
58
+ showAxisLabels: si
59
+ } = mi, ri = fi(null), C = Oi(ri, {
60
+ once: l.once,
61
+ amount: l.amount
62
+ }), ui = X === "linear" ? Li : X === "step" ? Ii : X === "stepAfter" ? Si : X === "stepBefore" ? Ti : Vi, [li, $] = W(void 0), [L, V] = W(void 0), [ni, I] = W(void 0), [j, m] = W(void 0), u = {
63
+ top: J,
64
+ bottom: xi,
65
+ left: U + 50,
66
+ right: q + 65
67
+ }, d = N - u.left - u.right, f = Y - u.top - u.bottom, a = S.map((i, M) => ({ ...i, id: `${M}` })), c = Ci().domain(a.map((i) => `${i.id}`)).range([0, d]).paddingInner(hi), G = Math.min(...a.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.min(...a.map((i) => i.bar).filter((i) => i != null)) > 0 ? 0 : Math.min(...a.map((i) => i.bar).filter((i) => i != null)) : 0, A = Math.min(...a.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.min(...a.map((i) => i.line).filter((i) => i != null)) > 0 ? 0 : Math.min(...a.map((i) => i.line).filter((i) => i != null)) : 0, O = Math.max(...a.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.max(...a.map((i) => i.bar).filter((i) => i != null)) : 0, P = Math.max(...a.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.max(...a.map((i) => i.line).filter((i) => i != null)) : 0, R = G < A ? G : A, y = O > P ? O : P, r = bi().domain([
68
+ b ? R : G,
69
+ b ? y > 0 ? y : 0 : O > 0 ? O : 0
70
+ ]).range([f, 0]).nice(), e = bi().domain([
71
+ b ? R : A,
72
+ b ? y > 0 ? y : 0 : P > 0 ? P : 0
73
+ ]).range([f, 0]).nice(), z = $i().defined((i) => !di(i.line)).x((i) => c(`${i.id}`) + c.bandwidth() / 2).y((i) => e(i.line)).curve(ui), vi = r.ticks(ti), wi = e.ticks(ti);
73
74
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
74
75
  /* @__PURE__ */ t.jsx(
75
76
  D.svg,
76
77
  {
77
- width: `${A}px`,
78
+ width: `${N}px`,
78
79
  height: `${Y}px`,
79
- viewBox: `0 0 ${A} ${Y}`,
80
+ viewBox: `0 0 ${N} ${Y}`,
80
81
  direction: "ltr",
81
- ref: ei,
82
- children: /* @__PURE__ */ t.jsxs("g", { transform: `translate(${n.left},${n.top})`, children: [
82
+ ref: ri,
83
+ children: /* @__PURE__ */ t.jsxs("g", { transform: `translate(${u.left},${u.top})`, children: [
83
84
  /* @__PURE__ */ t.jsxs("g", { children: [
84
- vi.map((i, j) => /* @__PURE__ */ t.jsxs("g", { children: [
85
+ vi.map((i, M) => /* @__PURE__ */ t.jsxs("g", { children: [
85
86
  /* @__PURE__ */ t.jsx(
86
87
  "line",
87
88
  {
88
- y1: e(i),
89
- y2: e(i),
89
+ y1: r(i),
90
+ y2: r(i),
90
91
  x1: -15,
91
92
  x2: -20,
92
93
  style: {
93
94
  stroke: p,
94
95
  strokeWidth: 1,
95
- ...o?.yAxis?.gridLines || {}
96
+ ...n?.yAxis?.gridLines || {}
96
97
  },
97
- className: l?.yAxis?.gridLines
98
+ className: o?.yAxis?.gridLines
98
99
  }
99
100
  ),
100
101
  /* @__PURE__ */ t.jsx(
101
102
  "text",
102
103
  {
103
104
  x: -25,
104
- y: e(i),
105
+ y: r(i),
105
106
  dy: "0.33em",
106
- className: R("text-xs", l?.yAxis?.labels),
107
+ className: _("text-xs", o?.yAxis?.labels),
107
108
  style: {
108
109
  textAnchor: "end",
109
110
  fill: p,
110
- ...o?.yAxis?.labels || {}
111
+ ...n?.yAxis?.labels || {}
111
112
  },
112
- children: ni(i, M, E, ti, F)
113
+ children: oi(i, k, E, ai, B)
113
114
  }
114
115
  )
115
- ] }, j)),
116
+ ] }, M)),
116
117
  /* @__PURE__ */ t.jsx(
117
- ui,
118
+ pi,
118
119
  {
119
120
  y1: 0,
120
121
  y2: f,
121
122
  x1: -15,
122
123
  x2: -15,
123
- classNames: { axis: l?.xAxis?.axis },
124
- styles: { axis: { stroke: p, ...o?.xAxis?.axis || {} } }
124
+ classNames: { axis: o?.xAxis?.axis },
125
+ styles: { axis: { stroke: p, ...n?.xAxis?.axis || {} } }
125
126
  }
126
127
  ),
127
- /* @__PURE__ */ t.jsx(
128
- gi,
128
+ si ? /* @__PURE__ */ t.jsx(
129
+ yi,
129
130
  {
130
- x: 10 - n.left,
131
+ x: 10 - u.left,
131
132
  y: f / 2,
132
- style: { fill: p, ...o?.yAxis?.title || {} },
133
- className: l?.yAxis?.title,
133
+ style: { fill: p, ...n?.yAxis?.title || {} },
134
+ className: o?.yAxis?.title,
134
135
  text: s[0].length > 100 ? `${s[0].substring(0, 100)}...` : s[0],
135
136
  rotate90: !0
136
137
  }
137
- )
138
+ ) : null
138
139
  ] }),
139
140
  /* @__PURE__ */ t.jsxs("g", { children: [
140
- bi.map((i, j) => /* @__PURE__ */ t.jsxs("g", { children: [
141
+ wi.map((i, M) => /* @__PURE__ */ t.jsxs("g", { children: [
141
142
  /* @__PURE__ */ t.jsx(
142
143
  "line",
143
144
  {
144
- y1: m(i),
145
- y2: m(i),
146
- x1: h + 15,
147
- x2: h + 20,
145
+ y1: e(i),
146
+ y2: e(i),
147
+ x1: d + 15,
148
+ x2: d + 20,
148
149
  style: {
149
- stroke: u,
150
+ stroke: x,
150
151
  strokeWidth: 1,
151
- ...o?.yAxis?.gridLines || {}
152
+ ...n?.yAxis?.gridLines || {}
152
153
  },
153
- className: l?.yAxis?.gridLines
154
+ className: o?.yAxis?.gridLines
154
155
  }
155
156
  ),
156
157
  /* @__PURE__ */ t.jsx(
157
158
  "text",
158
159
  {
159
- x: h + 25,
160
- y: m(i),
160
+ x: d + 25,
161
+ y: e(i),
161
162
  dy: "0.33em",
162
163
  dx: -2,
163
164
  style: {
164
165
  textAnchor: "start",
165
- fill: u,
166
- ...o?.yAxis?.labels || {}
166
+ fill: x,
167
+ ...n?.yAxis?.labels || {}
167
168
  },
168
- className: R("text-xs", l?.yAxis?.labels),
169
- children: ni(i, M, E, G, ii)
169
+ className: _("text-xs", o?.yAxis?.labels),
170
+ children: oi(i, k, E, F, ei)
170
171
  }
171
172
  )
172
- ] }, j)),
173
+ ] }, M)),
173
174
  /* @__PURE__ */ t.jsx(
174
- ui,
175
+ pi,
175
176
  {
176
177
  y1: 0,
177
178
  y2: f,
178
- x1: h + 15,
179
- x2: h + 15,
180
- classNames: { axis: l?.xAxis?.axis },
181
- styles: { axis: { stroke: u, ...o?.xAxis?.axis || {} } }
179
+ x1: d + 15,
180
+ x2: d + 15,
181
+ classNames: { axis: o?.xAxis?.axis },
182
+ styles: { axis: { stroke: x, ...n?.xAxis?.axis || {} } }
182
183
  }
183
184
  ),
184
- /* @__PURE__ */ t.jsx(
185
- gi,
185
+ si ? /* @__PURE__ */ t.jsx(
186
+ yi,
186
187
  {
187
- x: h + n.right - 15,
188
+ x: d + u.right - 15,
188
189
  y: f / 2,
189
- style: { fill: u, ...o?.yAxis?.title || {} },
190
- className: l?.yAxis?.title,
190
+ style: { fill: x, ...n?.yAxis?.title || {} },
191
+ className: o?.yAxis?.title,
191
192
  text: s[1].length > 100 ? `${s[1].substring(0, 100)}...` : s[1],
192
193
  rotate90: !0
193
194
  }
194
- )
195
+ ) : null
195
196
  ] }),
196
197
  /* @__PURE__ */ t.jsx(
197
- ui,
198
+ pi,
198
199
  {
199
- y1: y ? e(0) : f,
200
- y2: y ? e(0) : f,
200
+ y1: b ? r(0) : f,
201
+ y2: b ? r(0) : f,
201
202
  x1: -15,
202
- x2: h + 15,
203
- classNames: { axis: l?.xAxis?.axis },
204
- styles: { axis: o?.xAxis?.axis }
203
+ x2: d + 15,
204
+ classNames: { axis: o?.xAxis?.axis },
205
+ styles: { axis: n?.xAxis?.axis }
205
206
  }
206
207
  ),
207
208
  T.filter((i) => i.position === "before").map((i) => i.layer),
208
- /* @__PURE__ */ t.jsxs(Oi, { children: [
209
- a.map((i, j) => /* @__PURE__ */ t.jsxs(
209
+ /* @__PURE__ */ t.jsxs(Pi, { children: [
210
+ a.map((i, M) => /* @__PURE__ */ t.jsxs(
210
211
  D.g,
211
212
  {
212
213
  className: "undp-viz-g-with-hover",
213
214
  opacity: 0.85,
214
215
  onMouseEnter: (g) => {
215
- k(i), x(g.clientY), C(g.clientX), H?.(i);
216
+ $(i), m(g.clientY), I(g.clientX), H?.(i);
216
217
  },
217
218
  onClick: () => {
218
- (b || d) && (fi($, i) && Q ? (S(void 0), b?.(void 0)) : (S(i), b?.(i)));
219
+ (w || h) && (gi(L, i) && ii ? (V(void 0), w?.(void 0)) : (V(i), w?.(i)));
219
220
  },
220
221
  onMouseMove: (g) => {
221
- k(i), x(g.clientY), C(g.clientX);
222
+ $(i), m(g.clientY), I(g.clientX);
222
223
  },
223
224
  onMouseLeave: () => {
224
- k(void 0), C(void 0), x(void 0), H?.(void 0);
225
+ $(void 0), I(void 0), m(void 0), H?.(void 0);
225
226
  },
226
227
  children: [
227
228
  /* @__PURE__ */ t.jsx(
@@ -229,75 +230,75 @@ function Xi(li) {
229
230
  {
230
231
  variants: {
231
232
  initial: {
232
- attrY: e(0),
233
+ attrY: r(0),
233
234
  height: 0,
234
235
  opacity: 1
235
236
  },
236
237
  whileInView: {
237
- attrY: i.bar ? i.bar > 0 ? e(i.bar) : e(0) : 0,
238
- height: i.bar ? Math.abs(e(i.bar) - e(0)) : 0,
238
+ attrY: i.bar ? i.bar > 0 ? r(i.bar) : r(0) : 0,
239
+ height: i.bar ? Math.abs(r(i.bar) - r(0)) : 0,
239
240
  opacity: 1,
240
- transition: { duration: r.duration }
241
+ transition: { duration: l.duration }
241
242
  }
242
243
  },
243
244
  initial: "initial",
244
- animate: N ? "whileInView" : "initial",
245
+ animate: C ? "whileInView" : "initial",
245
246
  exit: {
246
- attrY: e(0),
247
+ attrY: r(0),
247
248
  height: 0,
248
249
  opacity: 0,
249
- transition: { duration: r.duration }
250
+ transition: { duration: l.duration }
250
251
  },
251
- x: c(`${j}`),
252
+ x: c(`${M}`),
252
253
  width: c.bandwidth(),
253
254
  style: { fill: p }
254
255
  }
255
256
  ),
256
- U && !hi(i.bar) ? /* @__PURE__ */ t.jsx(
257
+ K && !di(i.bar) ? /* @__PURE__ */ t.jsx(
257
258
  D.text,
258
259
  {
259
260
  x: c(`${i.id}`) + c.bandwidth() / 2,
260
261
  exit: {
261
- attrY: e(0),
262
+ attrY: r(0),
262
263
  opacity: 0,
263
- transition: { duration: r.duration }
264
+ transition: { duration: l.duration }
264
265
  },
265
266
  variants: {
266
267
  initial: {
267
- attrY: e(0),
268
+ attrY: r(0),
268
269
  opacity: 0
269
270
  },
270
271
  whileInView: {
271
- attrY: e(i.bar || 0),
272
+ attrY: r(i.bar || 0),
272
273
  opacity: 1,
273
- transition: { duration: r.duration }
274
+ transition: { duration: l.duration }
274
275
  }
275
276
  },
276
277
  initial: "initial",
277
- animate: N ? "whileInView" : "initial",
278
+ animate: C ? "whileInView" : "initial",
278
279
  style: {
279
280
  fill: p,
280
281
  textAnchor: "middle",
281
- ...o?.graphObjectValues || {}
282
+ ...n?.graphObjectValues || {}
282
283
  },
283
- className: R("graph-value text-sm", l?.graphObjectValues),
284
+ className: _("graph-value text-sm", o?.graphObjectValues),
284
285
  dy: i.bar ? i.bar >= 0 ? "-5px" : "1em" : "-5px",
285
- children: ni(i.bar, M, E, ti, F)
286
+ children: oi(i.bar, k, E, ai, B)
286
287
  }
287
288
  ) : null,
288
- K ? /* @__PURE__ */ t.jsx(
289
- Ni,
289
+ Z ? /* @__PURE__ */ t.jsx(
290
+ ki,
290
291
  {
291
- value: `${i.label}`.length < J ? `${i.label}` : `${`${i.label}`.substring(0, J)}...`,
292
+ value: `${i.label}`.length < Q ? `${i.label}` : `${`${i.label}`.substring(0, Q)}...`,
292
293
  y: f + 5,
293
294
  x: c(`${i.id}`),
294
295
  width: c.bandwidth(),
295
- height: n.bottom,
296
- style: o?.xAxis?.labels,
297
- className: l?.xAxis?.labels,
296
+ height: u.bottom,
297
+ style: n?.xAxis?.labels,
298
+ className: o?.xAxis?.labels,
298
299
  alignment: "top",
299
- animate: r,
300
- isInView: N
300
+ animate: l,
301
+ isInView: C
301
302
  }
302
303
  ) : null
303
304
  ]
@@ -309,253 +310,255 @@ function Xi(li) {
309
310
  {
310
311
  exit: {
311
312
  opacity: 0,
312
- transition: { duration: r.duration }
313
+ transition: { duration: l.duration }
313
314
  },
314
315
  variants: {
315
316
  initial: {
316
- d: pi(a.map((i) => ({ ...i, line: 0 }))),
317
+ d: z(a.map((i) => ({ ...i, line: 0 }))),
317
318
  opacity: 0
318
319
  },
319
320
  whileInView: {
320
- d: pi(a),
321
+ d: z(a),
321
322
  opacity: 1,
322
- transition: { duration: r.duration }
323
+ transition: { duration: l.duration }
323
324
  }
324
325
  },
325
326
  initial: "initial",
326
- animate: N ? "whileInView" : "initial",
327
+ animate: C ? "whileInView" : "initial",
327
328
  style: {
328
- stroke: u,
329
+ stroke: x,
329
330
  fill: "none",
330
331
  strokeWidth: 2
331
332
  }
332
333
  }
333
334
  ),
334
- a.map((i, j) => /* @__PURE__ */ t.jsx("g", { children: hi(i.line) ? null : /* @__PURE__ */ t.jsxs(
335
+ a.map((i, M) => /* @__PURE__ */ t.jsx("g", { children: di(i.line) ? null : /* @__PURE__ */ t.jsxs(
335
336
  "g",
336
337
  {
337
338
  onMouseEnter: (g) => {
338
- k(i), x(g.clientY), C(g.clientX), H?.(i);
339
+ $(i), m(g.clientY), I(g.clientX), H?.(i);
339
340
  },
340
341
  onClick: () => {
341
- (b || d) && (fi($, i) && Q ? (S(void 0), b?.(void 0)) : (S(i), b?.(i)));
342
+ (w || h) && (gi(L, i) && ii ? (V(void 0), w?.(void 0)) : (V(i), w?.(i)));
342
343
  },
343
344
  onMouseMove: (g) => {
344
- k(i), x(g.clientY), C(g.clientX);
345
+ $(i), m(g.clientY), I(g.clientX);
345
346
  },
346
347
  onMouseLeave: () => {
347
- k(void 0), C(void 0), x(void 0), H?.(void 0);
348
+ $(void 0), I(void 0), m(void 0), H?.(void 0);
348
349
  },
349
350
  children: [
350
351
  /* @__PURE__ */ t.jsx(
351
352
  D.circle,
352
353
  {
353
354
  exit: {
354
- cy: m(0),
355
+ cy: e(0),
355
356
  opacity: 0,
356
- transition: { duration: r.duration }
357
+ transition: { duration: l.duration }
357
358
  },
358
359
  variants: {
359
360
  initial: {
360
- cy: m(0),
361
+ cy: e(0),
361
362
  opacity: 0
362
363
  },
363
364
  whileInView: {
364
- cy: m(i.line),
365
+ cy: e(i.line),
365
366
  opacity: 1,
366
- transition: { duration: r.duration }
367
+ transition: { duration: l.duration }
367
368
  }
368
369
  },
369
370
  initial: "initial",
370
- animate: N ? "whileInView" : "initial",
371
+ animate: C ? "whileInView" : "initial",
371
372
  cx: c(i.id) + c.bandwidth() / 2,
372
- r: h / a.length < 5 ? 0 : h / a.length < 20 ? 2 : 4,
373
- style: { fill: u }
373
+ r: d / a.length < 5 ? 0 : d / a.length < 20 ? 2 : 4,
374
+ style: { fill: x }
374
375
  }
375
376
  ),
376
- U ? /* @__PURE__ */ t.jsx(
377
+ K ? /* @__PURE__ */ t.jsx(
377
378
  D.text,
378
379
  {
379
380
  x: c(`${i.id}`) + c.bandwidth() / 2,
380
381
  exit: {
381
- y: m(0),
382
+ y: e(0),
382
383
  opacity: 0,
383
- transition: { duration: r.duration }
384
+ transition: { duration: l.duration }
384
385
  },
385
386
  style: {
386
- fill: u,
387
+ fill: x,
387
388
  textAnchor: "middle",
388
- ...o?.graphObjectValues || {}
389
+ ...n?.graphObjectValues || {}
389
390
  },
390
391
  variants: {
391
392
  initial: {
392
- y: m(0),
393
+ y: e(0),
393
394
  opacity: 0
394
395
  },
395
396
  whileInView: {
396
- y: m(i.line),
397
+ y: e(i.line),
397
398
  opacity: 1,
398
- transition: { duration: r.duration }
399
+ transition: { duration: l.duration }
399
400
  }
400
401
  },
401
402
  initial: "initial",
402
- animate: N ? "whileInView" : "initial",
403
- className: R("graph-value text-sm", l?.graphObjectValues),
403
+ animate: C ? "whileInView" : "initial",
404
+ className: _("graph-value text-sm", o?.graphObjectValues),
404
405
  dy: "-5px",
405
- children: ni(
406
+ children: oi(
406
407
  i.line,
407
- M,
408
+ k,
408
409
  E,
409
- G,
410
- ii
410
+ F,
411
+ ei
411
412
  )
412
413
  }
413
414
  ) : null
414
415
  ]
415
416
  }
416
- ) }, j))
417
+ ) }, M))
417
418
  ] }),
418
419
  T.filter((i) => i.position === "after").map((i) => i.layer)
419
420
  ] })
420
421
  }
421
422
  ),
422
- ai && v && si && ri ? /* @__PURE__ */ t.jsx(
423
- Ai,
423
+ li && v && ni && j ? /* @__PURE__ */ t.jsx(
424
+ Mi,
424
425
  {
425
- data: ai,
426
+ data: li,
426
427
  body: v,
427
- xPos: si,
428
- yPos: ri,
429
- backgroundStyle: o?.tooltip,
430
- className: l?.tooltip
428
+ xPos: ni,
429
+ yPos: j,
430
+ backgroundStyle: n?.tooltip,
431
+ className: o?.tooltip
431
432
  }
432
433
  ) : null,
433
- d && $ !== void 0 ? /* @__PURE__ */ t.jsx(
434
- ji,
434
+ h && L !== void 0 ? /* @__PURE__ */ t.jsx(
435
+ Ai,
435
436
  {
436
- open: $ !== void 0,
437
+ open: L !== void 0,
437
438
  onClose: () => {
438
- S(void 0);
439
+ V(void 0);
439
440
  },
440
441
  children: /* @__PURE__ */ t.jsx(
441
442
  "div",
442
443
  {
443
444
  className: "graph-modal-content m-0",
444
- dangerouslySetInnerHTML: typeof d == "string" ? { __html: Mi(d, $) } : void 0,
445
- children: typeof d == "function" ? d($) : null
445
+ dangerouslySetInnerHTML: typeof h == "string" ? { __html: Ni(h, L) } : void 0,
446
+ children: typeof h == "function" ? h(L) : null
446
447
  }
447
448
  )
448
449
  }
449
450
  ) : null
450
451
  ] });
451
452
  }
452
- function ct(li) {
453
+ function mt(mi) {
453
454
  const {
454
- data: L,
455
- graphTitle: A,
455
+ data: S,
456
+ graphTitle: N,
456
457
  sources: Y,
457
458
  graphDescription: p,
458
- height: u,
459
+ height: x,
459
460
  width: s,
460
- footNote: y,
461
- padding: z,
462
- lineColor: _ = oi.light.categoricalColors.colors[1],
463
- barColor: q = oi.light.categoricalColors.colors[0],
464
- sameAxes: ci = !1,
461
+ footNote: b,
462
+ padding: q,
463
+ lineColor: U = ci.light.categoricalColors.colors[1],
464
+ barColor: J = ci.light.categoricalColors.colors[0],
465
+ sameAxes: xi = !1,
465
466
  backgroundColor: v = !1,
466
- leftMargin: U = 80,
467
+ leftMargin: K = 80,
467
468
  rightMargin: H = 80,
468
- topMargin: mi = 20,
469
- bottomMargin: J = 25,
470
- lineAxisTitle: K = "Line chart",
471
- barAxisTitle: b = "Bar graph",
472
- tooltip: Q,
473
- relativeHeight: d,
474
- onSeriesMouseOver: Z,
475
- graphID: ii,
476
- graphDownload: F = !1,
477
- dataDownload: G = !1,
478
- barPadding: ti = 0.25,
469
+ topMargin: hi = 20,
470
+ bottomMargin: Q = 25,
471
+ lineAxisTitle: Z = "Line chart",
472
+ barAxisTitle: w = "Bar graph",
473
+ tooltip: ii,
474
+ relativeHeight: h,
475
+ onSeriesMouseOver: ti,
476
+ graphID: ei,
477
+ graphDownload: B = !1,
478
+ dataDownload: F = !1,
479
+ barPadding: ai = 0.25,
479
480
  truncateBy: X = 999,
480
- showLabels: o = !0,
481
- onSeriesMouseClick: l,
482
- language: r = "en",
481
+ showLabels: n = !0,
482
+ onSeriesMouseClick: o,
483
+ language: l = "en",
483
484
  colorLegendTitle: E,
484
485
  minHeight: T = 0,
485
- theme: M = "light",
486
- ariaLabel: ei,
487
- resetSelectionOnDoubleClick: N = !0,
488
- detailsOnClick: xi,
489
- showValues: ai = !0,
490
- noOfTicks: k = 5,
486
+ theme: k = "light",
487
+ ariaLabel: si,
488
+ resetSelectionOnDoubleClick: ri = !0,
489
+ detailsOnClick: C,
490
+ showValues: ui = !0,
491
+ noOfTicks: li = 5,
491
492
  lineSuffix: $ = "",
492
- barSuffix: S = "",
493
- linePrefix: si = "",
494
- barPrefix: C = "",
495
- curveType: ri = "curve",
496
- styles: x,
497
- classNames: n,
498
- animate: h = !1,
499
- precision: f = 2,
500
- customLayers: a = [],
501
- naLabel: c = "NA"
502
- } = li, [w, W] = B(0), [V, O] = B(0), I = di(null), P = di(null);
503
- return wi(() => {
504
- const e = new ResizeObserver((m) => {
505
- W(s || m[0].target.clientWidth || 620), O(u || m[0].target.clientHeight || 480);
493
+ barSuffix: L = "",
494
+ linePrefix: V = "",
495
+ barPrefix: ni = "",
496
+ curveType: I = "curve",
497
+ styles: j,
498
+ classNames: m,
499
+ animate: u = !1,
500
+ precision: d = 2,
501
+ customLayers: f = [],
502
+ naLabel: a = "NA",
503
+ showColorScale: c = !0,
504
+ showAxisLabels: G = !0
505
+ } = mi, [A, O] = W(0), [P, R] = W(0), y = fi(null), r = fi(null);
506
+ return ji(() => {
507
+ const e = new ResizeObserver((z) => {
508
+ O(s || z[0].target.clientWidth || 620), R(x || z[0].target.clientHeight || 480);
506
509
  });
507
- return I.current && (O(I.current.clientHeight || 480), W(I.current.clientWidth || 620), s || e.observe(I.current)), () => e.disconnect();
508
- }, [s, u]), /* @__PURE__ */ t.jsx(
510
+ return y.current && (R(y.current.clientHeight || 480), O(y.current.clientWidth || 620), s || e.observe(y.current)), () => e.disconnect();
511
+ }, [s, x]), /* @__PURE__ */ t.jsx(
509
512
  "div",
510
513
  {
511
- className: `${M || "light"} flex ${s ? "w-fit grow-0" : "w-full grow"}`,
512
- dir: r === "he" || r === "ar" ? "rtl" : void 0,
514
+ className: `${k || "light"} flex ${s ? "w-fit grow-0" : "w-full grow"}`,
515
+ dir: l === "he" || l === "ar" ? "rtl" : void 0,
513
516
  children: /* @__PURE__ */ t.jsx(
514
517
  "div",
515
518
  {
516
- className: R(
517
- `${v ? v === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${r || "en"}`,
518
- n?.graphContainer
519
+ className: _(
520
+ `${v ? v === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${l || "en"}`,
521
+ m?.graphContainer
519
522
  ),
520
523
  style: {
521
- ...x?.graphContainer || {},
524
+ ...j?.graphContainer || {},
522
525
  ...v && v !== !0 ? { backgroundColor: v } : {}
523
526
  },
524
- id: ii,
525
- ref: P,
526
- "aria-label": ei || `${A ? `The graph shows ${A}. ` : ""}This is a pareto chart that shows a variable as bars and another as line chart.${p ? ` ${p}` : ""}`,
527
+ id: ei,
528
+ ref: r,
529
+ "aria-label": si || `${N ? `The graph shows ${N}. ` : ""}This is a pareto chart that shows a variable as bars and another as line chart.${p ? ` ${p}` : ""}`,
527
530
  children: /* @__PURE__ */ t.jsx(
528
531
  "div",
529
532
  {
530
533
  className: "flex grow",
531
- style: { padding: v ? z || "1rem" : z || 0 },
534
+ style: { padding: v ? q || "1rem" : q || 0 },
532
535
  children: /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
533
- A || p || F || G ? /* @__PURE__ */ t.jsx(
534
- Di,
536
+ N || p || B || F ? /* @__PURE__ */ t.jsx(
537
+ Yi,
535
538
  {
536
539
  styles: {
537
- title: x?.title,
538
- description: x?.description
540
+ title: j?.title,
541
+ description: j?.description
539
542
  },
540
543
  classNames: {
541
- title: n?.title,
542
- description: n?.description
544
+ title: m?.title,
545
+ description: m?.description
543
546
  },
544
- graphTitle: A,
547
+ graphTitle: N,
545
548
  graphDescription: p,
546
549
  width: s,
547
- graphDownload: F ? P.current : void 0,
548
- dataDownload: G ? L.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? L.map((e) => e.data).filter((e) => e !== void 0) : L.filter((e) => e !== void 0) : null
550
+ graphDownload: B ? r.current : void 0,
551
+ dataDownload: F ? S.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? S.map((e) => e.data).filter((e) => e !== void 0) : S.filter((e) => e !== void 0) : null
549
552
  }
550
553
  ) : null,
551
- /* @__PURE__ */ t.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: L.length === 0 ? /* @__PURE__ */ t.jsx(Hi, {}) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
552
- /* @__PURE__ */ t.jsx(
553
- Yi,
554
+ /* @__PURE__ */ t.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: S.length === 0 ? /* @__PURE__ */ t.jsx(Xi, {}) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
555
+ c ? null : /* @__PURE__ */ t.jsx(
556
+ Hi,
554
557
  {
555
- colorDomain: [b, K],
558
+ colorDomain: [w, Z],
556
559
  colors: [
557
- q || oi[M].categoricalColors.colors[0],
558
- _ || oi[M].categoricalColors.colors[1]
560
+ J || ci[k].categoricalColors.colors[0],
561
+ U || ci[k].categoricalColors.colors[1]
559
562
  ],
560
563
  colorLegendTitle: E,
561
564
  showNAColor: !1
@@ -565,61 +568,62 @@ function ct(li) {
565
568
  "div",
566
569
  {
567
570
  className: "flex flex-col grow justify-center leading-0",
568
- ref: I,
571
+ ref: y,
569
572
  "aria-label": "Graph area",
570
- children: (s || w) && (u || V) ? /* @__PURE__ */ t.jsx(
571
- Xi,
573
+ children: (s || A) && (x || P) ? /* @__PURE__ */ t.jsx(
574
+ Ei,
572
575
  {
573
- data: L,
574
- sameAxes: ci,
575
- lineColor: _,
576
- barColor: q,
577
- width: s || w,
576
+ data: S,
577
+ sameAxes: xi,
578
+ lineColor: U,
579
+ barColor: J,
580
+ width: s || A,
578
581
  height: Math.max(
579
582
  T,
580
- u || (d ? T ? (s || w) * d > T ? (s || w) * d : T : (s || w) * d : V)
583
+ x || (h ? T ? (s || A) * h > T ? (s || A) * h : T : (s || A) * h : P)
581
584
  ),
582
585
  truncateBy: X,
583
- leftMargin: U,
586
+ leftMargin: K,
584
587
  rightMargin: H,
585
- topMargin: mi,
586
- bottomMargin: J,
587
- axisTitles: [b, K],
588
- tooltip: Q,
589
- onSeriesMouseOver: Z,
590
- barPadding: ti,
591
- showLabels: o,
592
- onSeriesMouseClick: l,
593
- resetSelectionOnDoubleClick: N,
594
- detailsOnClick: xi,
595
- noOfTicks: k,
588
+ topMargin: hi,
589
+ bottomMargin: Q,
590
+ axisTitles: [w, Z],
591
+ tooltip: ii,
592
+ onSeriesMouseOver: ti,
593
+ barPadding: ai,
594
+ showLabels: n,
595
+ onSeriesMouseClick: o,
596
+ resetSelectionOnDoubleClick: ri,
597
+ detailsOnClick: C,
598
+ noOfTicks: li,
596
599
  lineSuffix: $,
597
- barSuffix: S,
598
- linePrefix: si,
599
- barPrefix: C,
600
- curveType: ri,
601
- showValues: ai,
602
- styles: x,
603
- classNames: n,
604
- animate: h === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : h || { duration: 0, once: !0, amount: 0 },
605
- precision: f,
606
- customLayers: a,
607
- naLabel: c
600
+ barSuffix: L,
601
+ linePrefix: V,
602
+ barPrefix: ni,
603
+ curveType: I,
604
+ showValues: ui,
605
+ styles: j,
606
+ classNames: m,
607
+ animate: u === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : u || { duration: 0, once: !0, amount: 0 },
608
+ precision: d,
609
+ customLayers: f,
610
+ naLabel: a,
611
+ showAxisLabels: G
608
612
  }
609
613
  ) : null
610
614
  }
611
615
  )
612
616
  ] }) }),
613
- Y || y ? /* @__PURE__ */ t.jsx(
614
- Pi,
617
+ Y || b ? /* @__PURE__ */ t.jsx(
618
+ Di,
615
619
  {
616
- styles: { footnote: x?.footnote, source: x?.source },
620
+ styles: { footnote: j?.footnote, source: j?.source },
617
621
  classNames: {
618
- footnote: n?.footnote,
619
- source: n?.source
622
+ footnote: m?.footnote,
623
+ source: m?.source
620
624
  },
621
625
  sources: Y,
622
- footNote: y,
626
+ footNote: b,
623
627
  width: s
624
628
  }
625
629
  ) : null
@@ -632,6 +636,6 @@ function ct(li) {
632
636
  );
633
637
  }
634
638
  export {
635
- ct as ParetoChart
639
+ mt as ParetoChart
636
640
  };
637
641
  //# sourceMappingURL=ParetoChart.js.map