@embeddable.com/remarkable-ui 0.1.49 → 0.1.50
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/dist/BarChartDefaultHorizontalPro.js +3 -3
- package/dist/BarChartDefaultPro.js +3 -3
- package/dist/BarChartGroupedHorizontalPro.js +3 -3
- package/dist/BarChartGroupedPro.js +3 -3
- package/dist/BarChartStackedHorizontalPro.js +3 -3
- package/dist/BarChartStackedPro.js +3 -3
- package/dist/{ChartCard-CMgDz_bs.js → ChartCard-k190CXR0.js} +29 -29
- package/dist/{ChartCard-CMgDz_bs.js.map → ChartCard-k190CXR0.js.map} +1 -1
- package/dist/{ComparisonPeriod.type.emb-C1o3iM9L.js → ComparisonPeriod.type.emb-Dgl2VM4_.js} +2 -2
- package/dist/{ComparisonPeriod.type.emb-C1o3iM9L.js.map → ComparisonPeriod.type.emb-Dgl2VM4_.js.map} +1 -1
- package/dist/ComparisonPeriodSelectFieldPro.js +4 -4
- package/dist/DateRangeSelectFieldPro.js +2 -2
- package/dist/DonutChartPro.js +2 -2
- package/dist/DonutLabelChartPro.js +2 -2
- package/dist/{EditorCard-CJoUz4uM.js → EditorCard-BNBH4Y9F.js} +17 -17
- package/dist/{EditorCard-CJoUz4uM.js.map → EditorCard-BNBH4Y9F.js.map} +1 -1
- package/dist/HeatMap-ylrlKLQI.js +223 -0
- package/dist/HeatMap-ylrlKLQI.js.map +1 -0
- package/dist/HeatMapPro.js +138 -0
- package/dist/HeatMapPro.js.map +1 -0
- package/dist/{KpiChart-C6zepuhF.js → KpiChart-DJ5el66E.js} +16 -16
- package/dist/{KpiChart-C6zepuhF.js.map → KpiChart-DJ5el66E.js.map} +1 -1
- package/dist/KpiChartNumberComparisonPro.js +6 -6
- package/dist/KpiChartNumberPro.js +4 -4
- package/dist/LineChartComparisonDefaultPro.js +5 -5
- package/dist/LineChartDefaultPro.js +3 -3
- package/dist/LineChartGroupedPro.js +3 -3
- package/dist/MultiSelectFieldPro.js +2 -2
- package/dist/PieChartPro.js +2 -2
- package/dist/PivotTable-awuBNY8c.js +273 -0
- package/dist/PivotTable-awuBNY8c.js.map +1 -0
- package/dist/PivotTablePro.js +39 -39
- package/dist/PivotTablePro.js.map +1 -1
- package/dist/{SingleSelectField-CJNiLfee.js → SingleSelectField-CY0TwkyW.js} +3 -3
- package/dist/{SingleSelectField-CJNiLfee.js.map → SingleSelectField-CY0TwkyW.js.map} +1 -1
- package/dist/SingleSelectFieldPro.js +2 -2
- package/dist/TableChartPaginated.js +3 -3
- package/dist/{bars.utils-vXPRJDGQ.js → bars.utils-cZSSvRai.js} +4 -4
- package/dist/{bars.utils-vXPRJDGQ.js.map → bars.utils-cZSSvRai.js.map} +1 -1
- package/dist/{charts.utils-HfNL9dVl.js → charts.utils-LgE4AEAw.js} +4 -4
- package/dist/charts.utils-LgE4AEAw.js.map +1 -0
- package/dist/{component.constants-CFaxyNCw.js → component.constants-D0ea4CW4.js} +1363 -1357
- package/dist/{component.constants-CFaxyNCw.js.map → component.constants-D0ea4CW4.js.map} +1 -1
- package/dist/embeddable-components.json +13 -12
- package/dist/embeddable-theme-2b917.js +1 -1
- package/dist/{formatter.utils-Cu4uKJSZ.js → formatter.utils-DBUd3PfE.js} +2 -2
- package/dist/{formatter.utils-Cu4uKJSZ.js.map → formatter.utils-DBUd3PfE.js.map} +1 -1
- package/dist/{index-C4BiW71l.js → index-BGf7vP5k.js} +5 -5
- package/dist/{index-C4BiW71l.js.map → index-BGf7vP5k.js.map} +1 -1
- package/dist/{index-DW-LmiPi.js → index-BpujEeVe.js} +11 -11
- package/dist/{index-DW-LmiPi.js.map → index-BpujEeVe.js.map} +1 -1
- package/dist/{index-DvMr1tvf.js → index-C_G6mJoE.js} +4 -4
- package/dist/{index-DvMr1tvf.js.map → index-C_G6mJoE.js.map} +1 -1
- package/dist/{index-CxxeUDMD.js → index-DGb59RGF.js} +13 -13
- package/dist/{index-CxxeUDMD.js.map → index-DGb59RGF.js.map} +1 -1
- package/dist/{index-DvEWwlqq.js → index-D_TXLv5w.js} +30 -30
- package/dist/{index-DvEWwlqq.js.map → index-D_TXLv5w.js.map} +1 -1
- package/dist/{index-BAfVF5iP.js → index-DuWcnytb.js} +10 -10
- package/dist/{index-BAfVF5iP.js.map → index-DuWcnytb.js.map} +1 -1
- package/dist/index.js +94 -91
- package/dist/index.js.map +1 -1
- package/dist/{pies.utils-JpKM3rVw.js → pies.utils-DpY3U9c2.js} +4 -4
- package/dist/{pies.utils-JpKM3rVw.js.map → pies.utils-DpY3U9c2.js.map} +1 -1
- package/dist/remarkable-pro/components/charts/tables/HeatMapPro/index.d.ts +29 -0
- package/dist/remarkable-pro/components/charts/tables/HeatMapPro/index.d.ts.map +1 -0
- package/dist/remarkable-pro/components/component.constants.d.ts +7 -0
- package/dist/remarkable-pro/components/component.constants.d.ts.map +1 -1
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.d.ts +3 -0
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.d.ts.map +1 -0
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.stories.d.ts +9 -0
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.stories.d.ts.map +1 -0
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.types.d.ts +30 -0
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.types.d.ts.map +1 -0
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.utils.d.ts +43 -0
- package/dist/remarkable-ui/charts/tables/HeatMap/HeatMap.utils.d.ts.map +1 -0
- package/dist/remarkable-ui/charts/tables/PivotTable/PivotTable.d.ts.map +1 -1
- package/dist/remarkable-ui/charts/tables/PivotTable/PivotTable.types.d.ts +1 -0
- package/dist/remarkable-ui/charts/tables/PivotTable/PivotTable.types.d.ts.map +1 -1
- package/dist/remarkable-ui/charts/tables/tables.utils.d.ts +6 -0
- package/dist/remarkable-ui/charts/tables/tables.utils.d.ts.map +1 -0
- package/dist/remarkable-ui/index.d.ts +2 -0
- package/dist/remarkable-ui/index.d.ts.map +1 -1
- package/dist/remarkable-ui.css +1 -1
- package/dist/tables.utils-D7KXdM2S.js +9 -0
- package/dist/tables.utils-D7KXdM2S.js.map +1 -0
- package/dist/{timeRange.utils-Z2lmKTCB.js → timeRange.utils-B9kyLPq_.js} +2 -2
- package/dist/{timeRange.utils-Z2lmKTCB.js.map → timeRange.utils-B9kyLPq_.js.map} +1 -1
- package/package.json +1 -1
- package/dist/PivotTable-SNPquHl0.js +0 -253
- package/dist/PivotTable-SNPquHl0.js.map +0 -1
- package/dist/charts.utils-HfNL9dVl.js.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent as i } from "@embeddable.com/react";
|
|
2
|
-
import { d as r, z as s, t as d, c as u,
|
|
3
|
-
import { M as p, a as f } from "./index-
|
|
2
|
+
import { d as r, z as s, t as d, c as u, af as m, V as t, o as c } from "./component.constants-D0ea4CW4.js";
|
|
3
|
+
import { M as p, a as f } from "./index-D_TXLv5w.js";
|
|
4
4
|
const g = {
|
|
5
5
|
name: "MultiSelectFieldPro",
|
|
6
6
|
label: "Multi Select Field",
|
package/dist/PieChartPro.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { d as a, w as s, z as t, t as o, c as n, s as i, a3 as r, e as m, f as l, V as d, o as c } from "./component.constants-
|
|
1
|
+
import { d as a, w as s, z as t, t as o, c as n, s as i, a3 as r, e as m, f as l, V as d, o as c } from "./component.constants-D0ea4CW4.js";
|
|
2
2
|
import { defineComponent as p } from "@embeddable.com/react";
|
|
3
|
-
import { P as u } from "./index-
|
|
3
|
+
import { P as u } from "./index-BpujEeVe.js";
|
|
4
4
|
const C = {
|
|
5
5
|
name: "PieChartPro",
|
|
6
6
|
label: "Pie Chart",
|
|
@@ -0,0 +1,273 @@
|
|
|
1
|
+
import { j as c, ah as i, ai as d } from "./component.constants-D0ea4CW4.js";
|
|
2
|
+
import { useMemo as N, useState as Y, useEffect as Z } from "react";
|
|
3
|
+
import { g as I } from "./tables.utils-D7KXdM2S.js";
|
|
4
|
+
const L = "_pivotTableContainer_1tysn_2", D = "_tableContainer_1tysn_7", m = "_fullWidth_1tysn_23", tt = "_table_1tysn_7", lt = "_cell_1tysn_87", et = "_header_1tysn_112", ct = "_bold_1tysn_117", n = {
|
|
5
|
+
pivotTableContainer: L,
|
|
6
|
+
tableContainer: D,
|
|
7
|
+
fullWidth: m,
|
|
8
|
+
table: tt,
|
|
9
|
+
cell: lt,
|
|
10
|
+
header: et,
|
|
11
|
+
bold: ct
|
|
12
|
+
}, z = (j) => typeof j == "number" && !Number.isNaN(j), E = (j, _) => `${j.toFixed(_)}%`, it = ({
|
|
13
|
+
columnWidth: j,
|
|
14
|
+
firstColumnWidth: _,
|
|
15
|
+
data: b,
|
|
16
|
+
measures: o,
|
|
17
|
+
rowDimension: y,
|
|
18
|
+
columnDimension: p,
|
|
19
|
+
progressive: P = !0,
|
|
20
|
+
batchSize: v = 100,
|
|
21
|
+
batchDelayMs: A = 0,
|
|
22
|
+
rowTotalsFor: R = [],
|
|
23
|
+
columnTotalsFor: F = [],
|
|
24
|
+
totalLabel: C = "Total",
|
|
25
|
+
className: G
|
|
26
|
+
}) => {
|
|
27
|
+
const x = N(() => {
|
|
28
|
+
const t = /* @__PURE__ */ new Set();
|
|
29
|
+
for (const l of b) {
|
|
30
|
+
const e = l[y.key];
|
|
31
|
+
e && t.add(e);
|
|
32
|
+
}
|
|
33
|
+
return Array.from(t);
|
|
34
|
+
}, [b, y.key]), w = N(() => {
|
|
35
|
+
const t = /* @__PURE__ */ new Set();
|
|
36
|
+
for (const l of b) {
|
|
37
|
+
const e = l[p.key];
|
|
38
|
+
e && t.add(e);
|
|
39
|
+
}
|
|
40
|
+
return Array.from(t);
|
|
41
|
+
}, [b, p.key]), H = N(() => {
|
|
42
|
+
const t = /* @__PURE__ */ new Map();
|
|
43
|
+
for (const l of b) {
|
|
44
|
+
const e = String(l[y.key]), s = String(l[p.key]);
|
|
45
|
+
t.has(e) || t.set(e, /* @__PURE__ */ new Map()), t.get(e).set(s, l);
|
|
46
|
+
}
|
|
47
|
+
return t;
|
|
48
|
+
}, [b, y.key, p.key]), $ = N(() => new Set(R), [R]), W = N(() => new Set(F), [F]), V = $.size > 0, J = W.size > 0, B = N(() => {
|
|
49
|
+
const t = /* @__PURE__ */ new Map();
|
|
50
|
+
return o.forEach((l, e) => t.set(String(l.key), e)), t;
|
|
51
|
+
}, [o]), { colTotals: K, rowTotals: O, grandTotals: q } = N(() => {
|
|
52
|
+
const t = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map(), e = o.map(() => 0);
|
|
53
|
+
for (const s of b) {
|
|
54
|
+
const r = String(s[y.key]), a = String(s[p.key]), h = t.get(a) ?? o.map(() => 0), g = l.get(r) ?? o.map(() => 0);
|
|
55
|
+
o.forEach((f, k) => {
|
|
56
|
+
const T = s == null ? void 0 : s[f.key], S = Number(T);
|
|
57
|
+
Number.isNaN(S) || (h[k] += S, g[k] += S, e[k] += S);
|
|
58
|
+
}), t.set(a, h), l.set(r, g);
|
|
59
|
+
}
|
|
60
|
+
for (const s of w)
|
|
61
|
+
t.has(String(s)) || t.set(
|
|
62
|
+
String(s),
|
|
63
|
+
o.map(() => 0)
|
|
64
|
+
);
|
|
65
|
+
for (const s of x)
|
|
66
|
+
l.has(String(s)) || l.set(
|
|
67
|
+
String(s),
|
|
68
|
+
o.map(() => 0)
|
|
69
|
+
);
|
|
70
|
+
return { colTotals: t, rowTotals: l, grandTotals: e };
|
|
71
|
+
}, [b, o, y.key, p.key, w, x]), [Q, M] = Y(
|
|
72
|
+
() => P ? Math.min(v, x.length) : x.length
|
|
73
|
+
);
|
|
74
|
+
Z(() => {
|
|
75
|
+
if (!P) {
|
|
76
|
+
M(x.length);
|
|
77
|
+
return;
|
|
78
|
+
}
|
|
79
|
+
let t = !1, l = null;
|
|
80
|
+
M(0);
|
|
81
|
+
const e = () => {
|
|
82
|
+
M((s) => {
|
|
83
|
+
const r = Math.min(s + v, x.length);
|
|
84
|
+
return r < x.length && !t && (l = window.setTimeout(e, A)), r;
|
|
85
|
+
});
|
|
86
|
+
};
|
|
87
|
+
return l = window.setTimeout(e, A), () => {
|
|
88
|
+
t = !0, l !== null && window.clearTimeout(l);
|
|
89
|
+
};
|
|
90
|
+
}, [P, v, A, x.length, b]);
|
|
91
|
+
const U = P ? x.slice(0, Q) : x;
|
|
92
|
+
return /* @__PURE__ */ c.jsx("div", { className: i(n.pivotTableContainer, G), children: /* @__PURE__ */ c.jsx(
|
|
93
|
+
"div",
|
|
94
|
+
{
|
|
95
|
+
className: i(
|
|
96
|
+
n.tableContainer,
|
|
97
|
+
(!j || !_) && n.fullWidth
|
|
98
|
+
),
|
|
99
|
+
children: /* @__PURE__ */ c.jsxs(
|
|
100
|
+
"table",
|
|
101
|
+
{
|
|
102
|
+
className: n.table,
|
|
103
|
+
"aria-label": `${y.label} by ${p.label}`,
|
|
104
|
+
children: [
|
|
105
|
+
/* @__PURE__ */ c.jsxs("thead", { children: [
|
|
106
|
+
/* @__PURE__ */ c.jsxs("tr", { children: [
|
|
107
|
+
/* @__PURE__ */ c.jsx(
|
|
108
|
+
"th",
|
|
109
|
+
{
|
|
110
|
+
scope: "col",
|
|
111
|
+
rowSpan: 1,
|
|
112
|
+
className: i(n.cell, n.header),
|
|
113
|
+
title: p.label,
|
|
114
|
+
children: /* @__PURE__ */ c.jsx(d, { children: p.label })
|
|
115
|
+
}
|
|
116
|
+
),
|
|
117
|
+
w.map((t) => {
|
|
118
|
+
const l = p.formatValue ? p.formatValue(t) : t;
|
|
119
|
+
return /* @__PURE__ */ c.jsx(
|
|
120
|
+
"th",
|
|
121
|
+
{
|
|
122
|
+
scope: "colgroup",
|
|
123
|
+
colSpan: o.length,
|
|
124
|
+
className: i(n.cell, n.header),
|
|
125
|
+
title: l,
|
|
126
|
+
children: /* @__PURE__ */ c.jsx(d, { children: l })
|
|
127
|
+
},
|
|
128
|
+
`col-${t}`
|
|
129
|
+
);
|
|
130
|
+
}),
|
|
131
|
+
V && /* @__PURE__ */ c.jsx(
|
|
132
|
+
"th",
|
|
133
|
+
{
|
|
134
|
+
scope: "colgroup",
|
|
135
|
+
colSpan: Array.from($).length,
|
|
136
|
+
className: i(n.cell, n.bold),
|
|
137
|
+
title: C,
|
|
138
|
+
children: /* @__PURE__ */ c.jsx(d, { children: C })
|
|
139
|
+
},
|
|
140
|
+
"col-total-group"
|
|
141
|
+
)
|
|
142
|
+
] }),
|
|
143
|
+
/* @__PURE__ */ c.jsxs("tr", { children: [
|
|
144
|
+
/* @__PURE__ */ c.jsx(
|
|
145
|
+
"th",
|
|
146
|
+
{
|
|
147
|
+
scope: "col",
|
|
148
|
+
rowSpan: 1,
|
|
149
|
+
className: i(n.cell, n.header),
|
|
150
|
+
title: y.label,
|
|
151
|
+
style: I(_),
|
|
152
|
+
children: /* @__PURE__ */ c.jsx(d, { children: y.label })
|
|
153
|
+
}
|
|
154
|
+
),
|
|
155
|
+
w.flatMap(
|
|
156
|
+
(t) => o.map((l, e) => /* @__PURE__ */ c.jsx(
|
|
157
|
+
"th",
|
|
158
|
+
{
|
|
159
|
+
scope: "col",
|
|
160
|
+
className: i(n.cell, n.header),
|
|
161
|
+
title: l.label,
|
|
162
|
+
style: I(j),
|
|
163
|
+
children: /* @__PURE__ */ c.jsx(d, { children: l.label })
|
|
164
|
+
},
|
|
165
|
+
`sub-${String(t)}-${l.key}-${e}`
|
|
166
|
+
))
|
|
167
|
+
),
|
|
168
|
+
V && o.filter((t) => $.has(t.key)).map((t, l) => /* @__PURE__ */ c.jsx(
|
|
169
|
+
"th",
|
|
170
|
+
{
|
|
171
|
+
scope: "col",
|
|
172
|
+
className: i(n.cell, n.bold),
|
|
173
|
+
title: t.label,
|
|
174
|
+
style: I(j),
|
|
175
|
+
children: /* @__PURE__ */ c.jsx(d, { children: t.label })
|
|
176
|
+
},
|
|
177
|
+
`sub-total-${t.key}-${l}`
|
|
178
|
+
))
|
|
179
|
+
] })
|
|
180
|
+
] }),
|
|
181
|
+
/* @__PURE__ */ c.jsx("tbody", { children: U.map((t) => {
|
|
182
|
+
const l = y.formatValue ? y.formatValue(t) : t;
|
|
183
|
+
return /* @__PURE__ */ c.jsxs("tr", { children: [
|
|
184
|
+
/* @__PURE__ */ c.jsx(
|
|
185
|
+
"th",
|
|
186
|
+
{
|
|
187
|
+
scope: "row",
|
|
188
|
+
className: i(n.cell, n.header),
|
|
189
|
+
title: l,
|
|
190
|
+
children: /* @__PURE__ */ c.jsx(d, { children: l })
|
|
191
|
+
}
|
|
192
|
+
),
|
|
193
|
+
w.flatMap(
|
|
194
|
+
(e) => o.map((s, r) => {
|
|
195
|
+
var T;
|
|
196
|
+
const a = ((T = H.get(t)) == null ? void 0 : T.get(e)) ?? {}, h = a == null ? void 0 : a[s.key], g = `cell-${t}-${e}-${s.key}-${r}`, k = (() => {
|
|
197
|
+
if (s.showAsPercentage) {
|
|
198
|
+
const S = B.get(String(s.key)) ?? -1, X = K.get(String(e)) ?? o.map(() => 0), u = S >= 0 ? X[S] ?? 0 : 0;
|
|
199
|
+
if (s.showAsPercentage && z(Number(h)) && z(u) && u > 0)
|
|
200
|
+
return `${(h / u * 100).toFixed(s.percentageDecimalPlaces ?? 0)}%`;
|
|
201
|
+
}
|
|
202
|
+
return s.accessor ? s.accessor(a) : h;
|
|
203
|
+
})();
|
|
204
|
+
return /* @__PURE__ */ c.jsx("td", { className: i(n.cell), title: k, children: /* @__PURE__ */ c.jsx(d, { children: k }) }, g);
|
|
205
|
+
})
|
|
206
|
+
),
|
|
207
|
+
V && o.filter((e) => $.has(e.key)).map((e, s) => {
|
|
208
|
+
const r = O.get(t) ?? o.map(() => 0), a = B.get(e.key) ?? -1, h = `row-total-${String(t)}-${e.key}-${s}`, g = a >= 0 ? r[a] ?? 0 : 0;
|
|
209
|
+
let f = g;
|
|
210
|
+
return e.showAsPercentage ? f = E(
|
|
211
|
+
g / (q[a] || 1) * 100,
|
|
212
|
+
e.percentageDecimalPlaces ?? 0
|
|
213
|
+
) : e.accessor && (f = e.accessor({ [e.key]: g })), /* @__PURE__ */ c.jsx(
|
|
214
|
+
"td",
|
|
215
|
+
{
|
|
216
|
+
className: i(n.cell, n.bold),
|
|
217
|
+
title: f,
|
|
218
|
+
children: /* @__PURE__ */ c.jsx(d, { children: f })
|
|
219
|
+
},
|
|
220
|
+
h
|
|
221
|
+
);
|
|
222
|
+
})
|
|
223
|
+
] }, `row-${t}`);
|
|
224
|
+
}) }),
|
|
225
|
+
/* @__PURE__ */ c.jsx("tfoot", { children: J && /* @__PURE__ */ c.jsxs("tr", { children: [
|
|
226
|
+
/* @__PURE__ */ c.jsx("th", { scope: "row", className: i(n.cell, n.bold), title: C, children: /* @__PURE__ */ c.jsx(d, { children: C }) }),
|
|
227
|
+
w.flatMap(
|
|
228
|
+
(t) => o.map((l, e) => {
|
|
229
|
+
const s = W.has(String(l.key)), r = K.get(String(t)) ?? o.map(() => 0), a = o.findIndex((T) => String(T.key) === String(l.key)), h = `col-total-${String(t)}-${l.key}-${e}`, g = r[a] ?? 0;
|
|
230
|
+
let f = g;
|
|
231
|
+
l.showAsPercentage ? f = E(
|
|
232
|
+
100,
|
|
233
|
+
l.percentageDecimalPlaces ?? 0
|
|
234
|
+
) : l.accessor && (f = l.accessor({ [l.key]: g }));
|
|
235
|
+
const k = s ? f : "";
|
|
236
|
+
return /* @__PURE__ */ c.jsx(
|
|
237
|
+
"td",
|
|
238
|
+
{
|
|
239
|
+
className: i(n.cell, n.bold),
|
|
240
|
+
title: k,
|
|
241
|
+
children: /* @__PURE__ */ c.jsx(d, { children: k })
|
|
242
|
+
},
|
|
243
|
+
h
|
|
244
|
+
);
|
|
245
|
+
})
|
|
246
|
+
),
|
|
247
|
+
V && o.filter((t) => $.has(t.key)).map((t, l) => {
|
|
248
|
+
const e = o.findIndex((h) => String(h.key) === t.key), s = `grand-total-${t.key}-${l}`, r = q[e] ?? 0;
|
|
249
|
+
let a = r;
|
|
250
|
+
return t.showAsPercentage ? a = E(
|
|
251
|
+
100,
|
|
252
|
+
t.percentageDecimalPlaces ?? 0
|
|
253
|
+
) : t.accessor && (a = t.accessor({ [t.key]: r })), /* @__PURE__ */ c.jsx(
|
|
254
|
+
"td",
|
|
255
|
+
{
|
|
256
|
+
className: i(n.cell, n.bold),
|
|
257
|
+
title: a,
|
|
258
|
+
children: /* @__PURE__ */ c.jsx(d, { children: a })
|
|
259
|
+
},
|
|
260
|
+
s
|
|
261
|
+
);
|
|
262
|
+
})
|
|
263
|
+
] }, "totals-row") })
|
|
264
|
+
]
|
|
265
|
+
}
|
|
266
|
+
)
|
|
267
|
+
}
|
|
268
|
+
) });
|
|
269
|
+
};
|
|
270
|
+
export {
|
|
271
|
+
it as P
|
|
272
|
+
};
|
|
273
|
+
//# sourceMappingURL=PivotTable-awuBNY8c.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PivotTable-awuBNY8c.js","sources":["../src/remarkable-ui/charts/tables/PivotTable/PivotTable.tsx"],"sourcesContent":["import { FC, useEffect, useMemo, useState } from 'react';\nimport styles from './PivotTable.module.css';\nimport clsx from 'clsx';\nimport { PivotTableProps } from './PivotTable.types';\nimport { Typography } from '../../../shared/Typography/Typography';\nimport { getTableCellWidthStyle } from '../tables.utils';\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nconst isNumber = (v: any) => typeof v === 'number' && !Number.isNaN(v);\n\nconst getPercentageDisplay = (percentage: number, percentageDecimalPlaces: number) => {\n return `${percentage.toFixed(percentageDecimalPlaces)}%`;\n};\n\nexport const PivotTable: FC<PivotTableProps<any>> = ({\n columnWidth,\n firstColumnWidth,\n data,\n measures,\n rowDimension,\n columnDimension,\n progressive = true,\n batchSize = 100,\n batchDelayMs = 0,\n rowTotalsFor = [],\n columnTotalsFor = [],\n totalLabel = 'Total',\n className,\n}) => {\n const rowValues = useMemo(() => {\n const s = new Set<string>();\n for (const d of data) {\n const rowValue = d[rowDimension.key];\n if (rowValue) s.add(rowValue);\n }\n return Array.from(s);\n }, [data, rowDimension.key]);\n\n const columnValues = useMemo(() => {\n const s = new Set<string>();\n for (const d of data) {\n const columnValue = d[columnDimension.key];\n if (columnValue) s.add(columnValue as string);\n }\n return Array.from(s);\n }, [data, columnDimension.key]);\n\n const cellMap = useMemo(() => {\n const map = new Map<string, Map<string, Record<string, any>>>();\n for (const d of data) {\n const r = String(d[rowDimension.key]);\n const c = String(d[columnDimension.key]);\n if (!map.has(r)) map.set(r, new Map());\n map.get(r)!.set(c, d as Record<string, any>);\n }\n return map;\n }, [data, rowDimension.key, columnDimension.key]);\n\n const rowTotalsSet = useMemo(() => new Set<string>(rowTotalsFor), [rowTotalsFor]);\n const columnTotalsSet = useMemo(() => new Set<string>(columnTotalsFor), [columnTotalsFor]);\n const hasRowTotals = rowTotalsSet.size > 0;\n const hasColumnTotals = columnTotalsSet.size > 0;\n\n const measureIndexByKey = useMemo(() => {\n const map = new Map<string, number>();\n measures.forEach((m, i) => map.set(String(m.key), i));\n return map;\n }, [measures]);\n\n const { colTotals, rowTotals, grandTotals } = useMemo(() => {\n const cTotals = new Map<string, number[]>();\n const rTotals = new Map<string, number[]>();\n const gTotals = measures.map(() => 0);\n\n for (const d of data) {\n const r = String(d[rowDimension.key]);\n const c = String(d[columnDimension.key]);\n const cArr = cTotals.get(c) ?? measures.map(() => 0);\n const rArr = rTotals.get(r) ?? measures.map(() => 0);\n\n measures.forEach((m, i) => {\n const raw = (d as any)?.[m.key];\n const v = Number(raw);\n if (!Number.isNaN(v)) {\n cArr[i]! += v;\n rArr[i]! += v;\n gTotals[i]! += v;\n }\n });\n\n cTotals.set(c, cArr);\n rTotals.set(r, rArr);\n }\n\n for (const c of columnValues) {\n if (!cTotals.has(String(c)))\n cTotals.set(\n String(c),\n measures.map(() => 0),\n );\n }\n for (const r of rowValues) {\n if (!rTotals.has(String(r)))\n rTotals.set(\n String(r),\n measures.map(() => 0),\n );\n }\n\n return { colTotals: cTotals, rowTotals: rTotals, grandTotals: gTotals };\n }, [data, measures, rowDimension.key, columnDimension.key, columnValues, rowValues]);\n\n const [visibleCount, setVisibleCount] = useState(() =>\n progressive ? Math.min(batchSize, rowValues.length) : rowValues.length,\n );\n\n useEffect(() => {\n if (!progressive) {\n setVisibleCount(rowValues.length);\n return;\n }\n let cancelled = false;\n let t: number | null = null;\n setVisibleCount(0);\n\n const tick = () => {\n setVisibleCount((prev) => {\n const next = Math.min(prev + batchSize, rowValues.length);\n if (next < rowValues.length && !cancelled) {\n t = window.setTimeout(tick, batchDelayMs);\n }\n return next;\n });\n };\n\n t = window.setTimeout(tick, batchDelayMs);\n\n return () => {\n cancelled = true;\n if (t !== null) window.clearTimeout(t);\n };\n }, [progressive, batchSize, batchDelayMs, rowValues.length, data]);\n\n const visibleRows = progressive ? rowValues.slice(0, visibleCount) : rowValues;\n\n return (\n <div className={clsx(styles.pivotTableContainer, className)}>\n <div\n className={clsx(\n styles.tableContainer,\n (!columnWidth || !firstColumnWidth) && styles.fullWidth,\n )}\n >\n <table\n className={styles.table}\n aria-label={`${rowDimension.label} by ${columnDimension.label}`}\n >\n <thead>\n <tr>\n <th\n scope=\"col\"\n rowSpan={1}\n className={clsx(styles.cell, styles.header)}\n title={columnDimension.label}\n >\n <Typography>{columnDimension.label}</Typography>\n </th>\n {columnValues.map((columnValue) => {\n const columnValueDisplay = columnDimension.formatValue\n ? columnDimension.formatValue(columnValue)\n : columnValue;\n return (\n <th\n key={`col-${columnValue}`}\n scope=\"colgroup\"\n colSpan={measures.length}\n className={clsx(styles.cell, styles.header)}\n title={columnValueDisplay}\n >\n <Typography>{columnValueDisplay}</Typography>\n </th>\n );\n })}\n {hasRowTotals && (\n <th\n key=\"col-total-group\"\n scope=\"colgroup\"\n colSpan={Array.from(rowTotalsSet).length}\n className={clsx(styles.cell, styles.bold)}\n title={totalLabel}\n >\n <Typography>{totalLabel}</Typography>\n </th>\n )}\n </tr>\n <tr>\n <th\n scope=\"col\"\n rowSpan={1}\n className={clsx(styles.cell, styles.header)}\n title={rowDimension.label}\n style={getTableCellWidthStyle(firstColumnWidth)}\n >\n <Typography>{rowDimension.label}</Typography>\n </th>\n {columnValues.flatMap((col) =>\n measures.map((measure, idx) => (\n <th\n key={`sub-${String(col)}-${measure.key}-${idx}`}\n scope=\"col\"\n className={clsx(styles.cell, styles.header)}\n title={measure.label}\n style={getTableCellWidthStyle(columnWidth)}\n >\n <Typography>{measure.label}</Typography>\n </th>\n )),\n )}\n {hasRowTotals &&\n measures\n .filter((measure) => rowTotalsSet.has(measure.key))\n .map((measure, idx) => (\n <th\n key={`sub-total-${measure.key}-${idx}`}\n scope=\"col\"\n className={clsx(styles.cell, styles.bold)}\n title={measure.label}\n style={getTableCellWidthStyle(columnWidth)}\n >\n <Typography>{measure.label}</Typography>\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {visibleRows.map((row) => {\n const rowDimensionValue = rowDimension.formatValue\n ? rowDimension.formatValue(row)\n : row;\n return (\n <tr key={`row-${row}`}>\n <th\n scope=\"row\"\n className={clsx(styles.cell, styles.header)}\n title={rowDimensionValue}\n >\n <Typography>{rowDimensionValue}</Typography>\n </th>\n\n {columnValues.flatMap((columnValue) =>\n measures.map((measure, idx) => {\n const object = cellMap.get(row)?.get(columnValue) ?? {};\n const value = object?.[measure.key];\n\n const key = `cell-${row}-${columnValue}-${measure.key}-${idx}`;\n const getDisplayValue = () => {\n if (measure.showAsPercentage) {\n const mi = measureIndexByKey.get(String(measure.key)) ?? -1;\n const totalsForCol =\n colTotals.get(String(columnValue)) ?? measures.map(() => 0);\n const colTotal = mi >= 0 ? (totalsForCol[mi] ?? 0) : 0;\n\n const shouldShowPct =\n measure.showAsPercentage &&\n isNumber(Number(value)) &&\n isNumber(colTotal) &&\n colTotal > 0;\n\n if (shouldShowPct) {\n const percentage = (value / colTotal) * 100;\n return `${percentage.toFixed(measure.percentageDecimalPlaces ?? 0)}%`;\n }\n }\n\n return measure.accessor ? measure.accessor(object) : value;\n };\n\n const columnValueDisplay = getDisplayValue();\n\n return (\n <td key={key} className={clsx(styles.cell)} title={columnValueDisplay}>\n <Typography>{columnValueDisplay}</Typography>\n </td>\n );\n }),\n )}\n\n {hasRowTotals &&\n measures\n .filter((measure) => rowTotalsSet.has(measure.key))\n .map((measure, idx) => {\n const totalsForRow = rowTotals.get(row) ?? measures.map(() => 0);\n const measureIndex = measureIndexByKey.get(measure.key) ?? -1;\n const key = `row-total-${String(row)}-${measure.key}-${idx}`;\n const value: number =\n measureIndex >= 0 ? (totalsForRow[measureIndex] ?? 0) : 0;\n let displayValue: any = value;\n\n if (measure.showAsPercentage) {\n displayValue = getPercentageDisplay(\n (value / (grandTotals[measureIndex] || 1)) * 100,\n measure.percentageDecimalPlaces ?? 0,\n );\n } else if (measure.accessor) {\n displayValue = measure.accessor({ [measure.key]: value });\n }\n\n return (\n <td\n key={key}\n className={clsx(styles.cell, styles.bold)}\n title={displayValue}\n >\n <Typography>{displayValue}</Typography>\n </td>\n );\n })}\n </tr>\n );\n })}\n </tbody>\n <tfoot>\n {hasColumnTotals && (\n <tr key=\"totals-row\">\n <th scope=\"row\" className={clsx(styles.cell, styles.bold)} title={totalLabel}>\n <Typography>{totalLabel}</Typography>\n </th>\n\n {columnValues.flatMap((columnValue) =>\n measures.map((measure, idx) => {\n const show = columnTotalsSet.has(String(measure.key));\n const totalsForCol =\n colTotals.get(String(columnValue)) ?? measures.map(() => 0);\n const mi = measures.findIndex((mm) => String(mm.key) === String(measure.key));\n const key = `col-total-${String(columnValue)}-${measure.key}-${idx}`;\n const value: number = totalsForCol[mi] ?? 0;\n let displayValue: any = value;\n\n if (measure.showAsPercentage) {\n displayValue = getPercentageDisplay(\n 100,\n measure.percentageDecimalPlaces ?? 0,\n );\n } else if (measure.accessor) {\n displayValue = measure.accessor({ [measure.key]: value });\n }\n const columnValueDisplay = show ? displayValue : '';\n\n return (\n <td\n key={key}\n className={clsx(styles.cell, styles.bold)}\n title={columnValueDisplay}\n >\n <Typography>{columnValueDisplay}</Typography>\n </td>\n );\n }),\n )}\n\n {hasRowTotals &&\n measures\n .filter((measure) => rowTotalsSet.has(measure.key))\n .map((measure, idx) => {\n const measureIndex = measures.findIndex((m) => String(m.key) === measure.key);\n const key = `grand-total-${measure.key}-${idx}`;\n const value: number = grandTotals[measureIndex] ?? 0;\n let displayValue: any = value;\n\n if (measure.showAsPercentage) {\n displayValue = getPercentageDisplay(\n 100,\n measure.percentageDecimalPlaces ?? 0,\n );\n } else if (measure.accessor) {\n displayValue = measure.accessor({ [measure.key]: value });\n }\n\n return (\n <td\n key={key}\n className={clsx(styles.cell, styles.bold)}\n title={displayValue}\n >\n <Typography>{displayValue}</Typography>\n </td>\n );\n })}\n </tr>\n )}\n </tfoot>\n </table>\n </div>\n </div>\n );\n};\n"],"names":["isNumber","v","getPercentageDisplay","percentage","percentageDecimalPlaces","PivotTable","columnWidth","firstColumnWidth","data","measures","rowDimension","columnDimension","progressive","batchSize","batchDelayMs","rowTotalsFor","columnTotalsFor","totalLabel","className","rowValues","useMemo","s","d","rowValue","columnValues","columnValue","cellMap","map","r","c","rowTotalsSet","columnTotalsSet","hasRowTotals","hasColumnTotals","measureIndexByKey","m","i","colTotals","rowTotals","grandTotals","cTotals","rTotals","gTotals","cArr","rArr","raw","visibleCount","setVisibleCount","useState","useEffect","cancelled","t","tick","prev","next","visibleRows","clsx","styles","jsx","jsxs","Typography","columnValueDisplay","getTableCellWidthStyle","col","measure","idx","row","rowDimensionValue","object","_a","value","key","mi","totalsForCol","colTotal","totalsForRow","measureIndex","displayValue","show","mm"],"mappings":"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"}
|
package/dist/PivotTablePro.js
CHANGED
|
@@ -1,65 +1,65 @@
|
|
|
1
|
-
import { i as y, r as M, j as m, U as
|
|
2
|
-
import { useTheme as
|
|
3
|
-
import { C as
|
|
4
|
-
import { useRef as
|
|
5
|
-
import { P as
|
|
6
|
-
import { u as
|
|
7
|
-
import { g as
|
|
8
|
-
const
|
|
9
|
-
const
|
|
1
|
+
import { i as y, r as M, j as m, U as S, d as W, a as u, a6 as c, b as d, t as N, c as j, Y as B, a4 as G, Z as h, A as I, o as k } from "./component.constants-D0ea4CW4.js";
|
|
2
|
+
import { useTheme as O, defineComponent as V } from "@embeddable.com/react";
|
|
3
|
+
import { C as E } from "./ChartCard-k190CXR0.js";
|
|
4
|
+
import { useRef as L } from "react";
|
|
5
|
+
import { P as U } from "./PivotTable-awuBNY8c.js";
|
|
6
|
+
import { u as p } from "./charts.fillGaps.hooks-5WclK2CD.js";
|
|
7
|
+
import { g as w } from "./formatter.utils-DBUd3PfE.js";
|
|
8
|
+
const Y = (e, o) => {
|
|
9
|
+
const t = w(o);
|
|
10
10
|
return e.measures.map((s) => {
|
|
11
|
-
var
|
|
11
|
+
var n, a;
|
|
12
12
|
return {
|
|
13
13
|
key: s.name,
|
|
14
|
-
label:
|
|
15
|
-
showAsPercentage: !!((
|
|
14
|
+
label: t.dimensionOrMeasureTitle(s),
|
|
15
|
+
showAsPercentage: !!((n = s.inputs) != null && n.showAsPercentage),
|
|
16
16
|
percentageDecimalPlaces: ((a = s.inputs) == null ? void 0 : a.decimalPlaces) ?? 1,
|
|
17
|
-
accessor: (i) => i[s.name] == null ? e.displayNullAs :
|
|
17
|
+
accessor: (i) => i[s.name] == null ? e.displayNullAs : t.data(s, i[s.name])
|
|
18
18
|
};
|
|
19
19
|
});
|
|
20
|
-
},
|
|
21
|
-
const
|
|
20
|
+
}, b = (e, o) => {
|
|
21
|
+
const t = w(o);
|
|
22
22
|
return {
|
|
23
23
|
key: e.dimension.name,
|
|
24
|
-
label:
|
|
25
|
-
formatValue: (s) =>
|
|
24
|
+
label: t.dimensionOrMeasureTitle(e.dimension),
|
|
25
|
+
formatValue: (s) => t.data(e.dimension, s)
|
|
26
26
|
};
|
|
27
27
|
}, Z = (e) => e.measures.filter((o) => {
|
|
28
|
-
var
|
|
29
|
-
return (
|
|
28
|
+
var t;
|
|
29
|
+
return (t = o.inputs) == null ? void 0 : t.showColumnTotal;
|
|
30
30
|
}).map((o) => o.name), _ = (e) => {
|
|
31
|
-
const o =
|
|
31
|
+
const o = O();
|
|
32
32
|
y(o);
|
|
33
|
-
const { description:
|
|
34
|
-
measures:
|
|
33
|
+
const { description: t, title: s } = M(e), {
|
|
34
|
+
measures: n,
|
|
35
35
|
rowDimension: a,
|
|
36
36
|
columnDimension: i,
|
|
37
37
|
showRowTotals: r,
|
|
38
|
-
displayNullAs:
|
|
38
|
+
displayNullAs: T,
|
|
39
39
|
columnWidth: f,
|
|
40
40
|
firstColumnWidth: g
|
|
41
|
-
} = e, D =
|
|
41
|
+
} = e, D = p({
|
|
42
42
|
results: e.results,
|
|
43
43
|
dimension: i
|
|
44
|
-
}), l =
|
|
44
|
+
}), l = p({
|
|
45
45
|
results: D,
|
|
46
46
|
dimension: a
|
|
47
|
-
}), P =
|
|
47
|
+
}), P = L(null), C = Y({ measures: n, displayNullAs: T }, o), v = b({ dimension: a }, o), R = b({ dimension: i }, o), F = Z({ measures: n }), A = r ? n.map((x) => x.name) : [];
|
|
48
48
|
return /* @__PURE__ */ m.jsx(
|
|
49
|
-
|
|
49
|
+
E,
|
|
50
50
|
{
|
|
51
51
|
ref: P,
|
|
52
52
|
title: s,
|
|
53
|
-
subtitle:
|
|
53
|
+
subtitle: t,
|
|
54
54
|
data: e.results,
|
|
55
|
-
dimensionsAndMeasures: [a, i, ...
|
|
55
|
+
dimensionsAndMeasures: [a, i, ...n],
|
|
56
56
|
errorMessage: l == null ? void 0 : l.error,
|
|
57
57
|
children: /* @__PURE__ */ m.jsx(
|
|
58
|
-
|
|
58
|
+
U,
|
|
59
59
|
{
|
|
60
60
|
firstColumnWidth: g,
|
|
61
61
|
columnWidth: f,
|
|
62
|
-
totalLabel:
|
|
62
|
+
totalLabel: S.t("charts.pivotTable.total"),
|
|
63
63
|
data: l.data ?? [],
|
|
64
64
|
measures: C,
|
|
65
65
|
rowDimension: v,
|
|
@@ -75,7 +75,7 @@ const U = (e, o) => {
|
|
|
75
75
|
label: "Pivot Table",
|
|
76
76
|
category: "Table Charts",
|
|
77
77
|
inputs: [
|
|
78
|
-
|
|
78
|
+
W,
|
|
79
79
|
{
|
|
80
80
|
...u,
|
|
81
81
|
label: "Measures To Display",
|
|
@@ -105,28 +105,28 @@ const U = (e, o) => {
|
|
|
105
105
|
label: "Column Dimension",
|
|
106
106
|
name: "columnDimension"
|
|
107
107
|
},
|
|
108
|
-
|
|
108
|
+
N,
|
|
109
109
|
j,
|
|
110
110
|
{ ...B, name: "showRowTotals", label: "Show Row Totals" },
|
|
111
111
|
{ ...G, name: "displayNullAs", label: "Display Null As" },
|
|
112
112
|
{
|
|
113
|
-
...
|
|
113
|
+
...h,
|
|
114
114
|
name: "firstColumnWidth",
|
|
115
115
|
label: "First Column Width",
|
|
116
|
-
description: "
|
|
116
|
+
description: "Set the width in px (e.g. 200)"
|
|
117
117
|
},
|
|
118
118
|
{
|
|
119
|
-
...
|
|
119
|
+
...h,
|
|
120
120
|
name: "columnWidth",
|
|
121
121
|
label: "Column Width",
|
|
122
|
-
description: "
|
|
122
|
+
description: "Set the width in px (e.g. 200)"
|
|
123
123
|
},
|
|
124
124
|
I
|
|
125
125
|
]
|
|
126
|
-
}, ee =
|
|
126
|
+
}, ee = V(_, q, {
|
|
127
127
|
props: (e) => ({
|
|
128
128
|
...e,
|
|
129
|
-
results:
|
|
129
|
+
results: k({
|
|
130
130
|
from: e.dataset,
|
|
131
131
|
select: [e.rowDimension, e.columnDimension, ...e.measures],
|
|
132
132
|
limit: e.maxResults,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PivotTablePro.js","sources":["../src/remarkable-pro/components/charts/tables/PivotTablePro/PivotPro.utils.ts","../src/remarkable-pro/components/charts/tables/PivotTablePro/index.tsx","../src/remarkable-pro/components/charts/tables/PivotTablePro/PivotTablePro.emb.ts"],"sourcesContent":["import { Dimension, Measure } from '@embeddable.com/core';\nimport { Theme } from '../../../../theme/theme.types';\nimport { PivotTableProps } from '../../../../../remarkable-ui';\nimport { getThemeFormatter } from '../../../../theme/formatter/formatter.utils';\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const getPivotMeasures = (\n props: { measures: Measure[]; displayNullAs?: string },\n theme: Theme,\n): PivotTableProps<any>['measures'] => {\n const themeFormatter = getThemeFormatter(theme);\n\n return props.measures.map((measure) => {\n return {\n key: measure.name,\n label: themeFormatter.dimensionOrMeasureTitle(measure),\n showAsPercentage: Boolean(measure.inputs?.showAsPercentage),\n percentageDecimalPlaces: measure.inputs?.decimalPlaces ?? 1,\n accessor: (row) => {\n const value = row[measure.name];\n\n return value == null\n ? props.displayNullAs\n : themeFormatter.data(measure, row[measure.name]);\n },\n };\n });\n};\n\nexport const getPivotDimension = (\n props: { dimension: Dimension },\n theme: Theme,\n): PivotTableProps<any>['rowDimension' | 'columnDimension'] => {\n const themeFormatter = getThemeFormatter(theme);\n\n return {\n key: props.dimension.name,\n label: themeFormatter.dimensionOrMeasureTitle(props.dimension),\n formatValue: (value: string) => themeFormatter.data(props.dimension, value),\n };\n};\n\nexport const getPivotColumnTotalsFor = (props: {\n measures: Measure[];\n}): PivotTableProps<any>['columnTotalsFor'] | undefined => {\n return props.measures.filter((m) => m.inputs?.showColumnTotal).map((m) => m.name);\n};\n","import { useTheme } from '@embeddable.com/react';\nimport { Theme } from '../../../../theme/theme.types';\nimport { i18n, i18nSetup } from '../../../../theme/i18n/i18n';\nimport { ChartCard } from '../../shared/ChartCard/ChartCard';\nimport { resolveI18nProps } from '../../../component.utils';\nimport { DataResponse, Dimension, Measure } from '@embeddable.com/core';\nimport { PivotTable } from '../../../../../remarkable-ui';\nimport { useRef } from 'react';\nimport { useFillGaps } from '../../charts.fillGaps.hooks';\nimport { getPivotColumnTotalsFor, getPivotDimension, getPivotMeasures } from './PivotPro.utils';\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\ntype PivotTableProProps = {\n title: string;\n description: string;\n results: DataResponse;\n measures: Measure[];\n rowDimension: Dimension;\n columnDimension: Dimension;\n showRowTotals?: boolean;\n displayNullAs?: string;\n columnWidth?: number;\n firstColumnWidth?: number;\n};\n\nconst PivotTablePro = (props: PivotTableProProps) => {\n const theme = useTheme() as Theme;\n i18nSetup(theme);\n\n const { description, title } = resolveI18nProps(props);\n const {\n measures,\n rowDimension,\n columnDimension,\n showRowTotals,\n displayNullAs,\n columnWidth,\n firstColumnWidth,\n } = props;\n\n // Fill gaps for the column dimension\n const resultsColumnDimensionFillGaps = useFillGaps({\n results: props.results,\n dimension: columnDimension,\n });\n\n // Fill gaps for the row dimension\n const results = useFillGaps({\n results: resultsColumnDimensionFillGaps,\n dimension: rowDimension,\n });\n\n const cardContentRef = useRef<HTMLDivElement>(null);\n\n const pivotMeasures = getPivotMeasures({ measures, displayNullAs }, theme);\n const pivotRowDimension = getPivotDimension({ dimension: rowDimension }, theme);\n const pivotColumnDimension = getPivotDimension({ dimension: columnDimension }, theme);\n const pivotColumnTotalsFor = getPivotColumnTotalsFor({ measures });\n const pivotRowTotalsFor = showRowTotals ? measures.map((m) => m.name) : [];\n\n return (\n <ChartCard\n ref={cardContentRef}\n title={title}\n subtitle={description}\n data={props.results}\n dimensionsAndMeasures={[rowDimension, columnDimension, ...measures]}\n errorMessage={results?.error}\n >\n <PivotTable\n firstColumnWidth={firstColumnWidth}\n columnWidth={columnWidth}\n totalLabel={i18n.t('charts.pivotTable.total')}\n data={results.data ?? []}\n measures={pivotMeasures}\n rowDimension={pivotRowDimension}\n columnDimension={pivotColumnDimension}\n columnTotalsFor={pivotColumnTotalsFor}\n rowTotalsFor={pivotRowTotalsFor}\n />\n </ChartCard>\n );\n};\n\nexport default PivotTablePro;\n","import { loadData } from '@embeddable.com/core';\nimport { defineComponent, EmbeddedComponentMeta, Inputs } from '@embeddable.com/react';\nimport PivotTablePro from './index';\nimport {\n dataset,\n description,\n title,\n maxResults,\n measures,\n genericBoolean,\n subInputGenericBoolean,\n genericString,\n dimensionWithDateBounds,\n genericNumber,\n} from '../../../component.constants';\n\nexport const meta = {\n name: 'PivotTablePro',\n label: 'Pivot Table',\n category: 'Table Charts',\n inputs: [\n dataset,\n {\n ...measures,\n label: 'Measures To Display',\n inputs: [\n ...measures.inputs,\n {\n ...subInputGenericBoolean,\n name: 'showColumnTotal',\n label: 'Show Column Total',\n },\n {\n ...subInputGenericBoolean,\n name: 'showAsPercentage',\n label: 'Show As Percentage',\n description: 'If turned on, other measures may be ignored',\n defaultValue: false,\n },\n ],\n },\n {\n ...dimensionWithDateBounds,\n label: 'Row Dimension',\n name: 'rowDimension',\n },\n {\n ...dimensionWithDateBounds,\n label: 'Column Dimension',\n name: 'columnDimension',\n },\n title,\n description,\n { ...genericBoolean, name: 'showRowTotals', label: 'Show Row Totals' },\n { ...genericString, name: 'displayNullAs', label: 'Display Null As' },\n {\n ...genericNumber,\n name: 'firstColumnWidth',\n label: 'First Column Width',\n description: 'You can input a number in pixels e.g. 400',\n },\n {\n ...genericNumber,\n name: 'columnWidth',\n label: 'Column Width',\n description: 'You can input a number in pixels e.g. 400',\n },\n\n maxResults,\n ],\n} as const satisfies EmbeddedComponentMeta;\n\nexport default defineComponent(PivotTablePro, meta, {\n props: (inputs: Inputs<typeof meta>) => {\n return {\n ...inputs,\n\n results: loadData({\n from: inputs.dataset,\n select: [inputs.rowDimension, inputs.columnDimension, ...inputs.measures],\n limit: inputs.maxResults,\n countRows: true,\n }),\n };\n },\n});\n"],"names":["getPivotMeasures","props","theme","themeFormatter","getThemeFormatter","measure","_a","_b","row","getPivotDimension","value","getPivotColumnTotalsFor","m","PivotTablePro","useTheme","i18nSetup","description","title","resolveI18nProps","measures","rowDimension","columnDimension","showRowTotals","displayNullAs","columnWidth","firstColumnWidth","resultsColumnDimensionFillGaps","useFillGaps","results","cardContentRef","useRef","pivotMeasures","pivotRowDimension","pivotColumnDimension","pivotColumnTotalsFor","pivotRowTotalsFor","jsx","ChartCard","PivotTable","i18n","meta","dataset","subInputGenericBoolean","dimensionWithDateBounds","genericBoolean","genericString","genericNumber","maxResults","PivotTablePro_emb","defineComponent","inputs","loadData"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PivotTablePro.js","sources":["../src/remarkable-pro/components/charts/tables/PivotTablePro/PivotPro.utils.ts","../src/remarkable-pro/components/charts/tables/PivotTablePro/index.tsx","../src/remarkable-pro/components/charts/tables/PivotTablePro/PivotTablePro.emb.ts"],"sourcesContent":["import { Dimension, Measure } from '@embeddable.com/core';\nimport { Theme } from '../../../../theme/theme.types';\nimport { PivotTableProps } from '../../../../../remarkable-ui';\nimport { getThemeFormatter } from '../../../../theme/formatter/formatter.utils';\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const getPivotMeasures = (\n props: { measures: Measure[]; displayNullAs?: string },\n theme: Theme,\n): PivotTableProps<any>['measures'] => {\n const themeFormatter = getThemeFormatter(theme);\n\n return props.measures.map((measure) => {\n return {\n key: measure.name,\n label: themeFormatter.dimensionOrMeasureTitle(measure),\n showAsPercentage: Boolean(measure.inputs?.showAsPercentage),\n percentageDecimalPlaces: measure.inputs?.decimalPlaces ?? 1,\n accessor: (row) => {\n const value = row[measure.name];\n\n return value == null\n ? props.displayNullAs\n : themeFormatter.data(measure, row[measure.name]);\n },\n };\n });\n};\n\nexport const getPivotDimension = (\n props: { dimension: Dimension },\n theme: Theme,\n): PivotTableProps<any>['rowDimension' | 'columnDimension'] => {\n const themeFormatter = getThemeFormatter(theme);\n\n return {\n key: props.dimension.name,\n label: themeFormatter.dimensionOrMeasureTitle(props.dimension),\n formatValue: (value: string) => themeFormatter.data(props.dimension, value),\n };\n};\n\nexport const getPivotColumnTotalsFor = (props: {\n measures: Measure[];\n}): PivotTableProps<any>['columnTotalsFor'] | undefined => {\n return props.measures.filter((m) => m.inputs?.showColumnTotal).map((m) => m.name);\n};\n","import { useTheme } from '@embeddable.com/react';\nimport { Theme } from '../../../../theme/theme.types';\nimport { i18n, i18nSetup } from '../../../../theme/i18n/i18n';\nimport { ChartCard } from '../../shared/ChartCard/ChartCard';\nimport { resolveI18nProps } from '../../../component.utils';\nimport { DataResponse, Dimension, Measure } from '@embeddable.com/core';\nimport { PivotTable } from '../../../../../remarkable-ui';\nimport { useRef } from 'react';\nimport { useFillGaps } from '../../charts.fillGaps.hooks';\nimport { getPivotColumnTotalsFor, getPivotDimension, getPivotMeasures } from './PivotPro.utils';\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\ntype PivotTableProProps = {\n title: string;\n description: string;\n results: DataResponse;\n measures: Measure[];\n rowDimension: Dimension;\n columnDimension: Dimension;\n showRowTotals?: boolean;\n displayNullAs?: string;\n columnWidth?: number;\n firstColumnWidth?: number;\n};\n\nconst PivotTablePro = (props: PivotTableProProps) => {\n const theme = useTheme() as Theme;\n i18nSetup(theme);\n\n const { description, title } = resolveI18nProps(props);\n const {\n measures,\n rowDimension,\n columnDimension,\n showRowTotals,\n displayNullAs,\n columnWidth,\n firstColumnWidth,\n } = props;\n\n // Fill gaps for the column dimension\n const resultsColumnDimensionFillGaps = useFillGaps({\n results: props.results,\n dimension: columnDimension,\n });\n\n // Fill gaps for the row dimension\n const results = useFillGaps({\n results: resultsColumnDimensionFillGaps,\n dimension: rowDimension,\n });\n\n const cardContentRef = useRef<HTMLDivElement>(null);\n\n const pivotMeasures = getPivotMeasures({ measures, displayNullAs }, theme);\n const pivotRowDimension = getPivotDimension({ dimension: rowDimension }, theme);\n const pivotColumnDimension = getPivotDimension({ dimension: columnDimension }, theme);\n const pivotColumnTotalsFor = getPivotColumnTotalsFor({ measures });\n const pivotRowTotalsFor = showRowTotals ? measures.map((m) => m.name) : [];\n\n return (\n <ChartCard\n ref={cardContentRef}\n title={title}\n subtitle={description}\n data={props.results}\n dimensionsAndMeasures={[rowDimension, columnDimension, ...measures]}\n errorMessage={results?.error}\n >\n <PivotTable\n firstColumnWidth={firstColumnWidth}\n columnWidth={columnWidth}\n totalLabel={i18n.t('charts.pivotTable.total')}\n data={results.data ?? []}\n measures={pivotMeasures}\n rowDimension={pivotRowDimension}\n columnDimension={pivotColumnDimension}\n columnTotalsFor={pivotColumnTotalsFor}\n rowTotalsFor={pivotRowTotalsFor}\n />\n </ChartCard>\n );\n};\n\nexport default PivotTablePro;\n","import { loadData } from '@embeddable.com/core';\nimport { defineComponent, EmbeddedComponentMeta, Inputs } from '@embeddable.com/react';\nimport PivotTablePro from './index';\nimport {\n dataset,\n description,\n title,\n maxResults,\n measures,\n genericBoolean,\n subInputGenericBoolean,\n genericString,\n dimensionWithDateBounds,\n genericNumber,\n} from '../../../component.constants';\n\nexport const meta = {\n name: 'PivotTablePro',\n label: 'Pivot Table',\n category: 'Table Charts',\n inputs: [\n dataset,\n {\n ...measures,\n label: 'Measures To Display',\n inputs: [\n ...measures.inputs,\n {\n ...subInputGenericBoolean,\n name: 'showColumnTotal',\n label: 'Show Column Total',\n },\n {\n ...subInputGenericBoolean,\n name: 'showAsPercentage',\n label: 'Show As Percentage',\n description: 'If turned on, other measures may be ignored',\n defaultValue: false,\n },\n ],\n },\n {\n ...dimensionWithDateBounds,\n label: 'Row Dimension',\n name: 'rowDimension',\n },\n {\n ...dimensionWithDateBounds,\n label: 'Column Dimension',\n name: 'columnDimension',\n },\n title,\n description,\n { ...genericBoolean, name: 'showRowTotals', label: 'Show Row Totals' },\n { ...genericString, name: 'displayNullAs', label: 'Display Null As' },\n {\n ...genericNumber,\n name: 'firstColumnWidth',\n label: 'First Column Width',\n description: 'Set the width in px (e.g. 200)',\n },\n {\n ...genericNumber,\n name: 'columnWidth',\n label: 'Column Width',\n description: 'Set the width in px (e.g. 200)',\n },\n\n maxResults,\n ],\n} as const satisfies EmbeddedComponentMeta;\n\nexport default defineComponent(PivotTablePro, meta, {\n props: (inputs: Inputs<typeof meta>) => {\n return {\n ...inputs,\n\n results: loadData({\n from: inputs.dataset,\n select: [inputs.rowDimension, inputs.columnDimension, ...inputs.measures],\n limit: inputs.maxResults,\n countRows: true,\n }),\n };\n },\n});\n"],"names":["getPivotMeasures","props","theme","themeFormatter","getThemeFormatter","measure","_a","_b","row","getPivotDimension","value","getPivotColumnTotalsFor","m","PivotTablePro","useTheme","i18nSetup","description","title","resolveI18nProps","measures","rowDimension","columnDimension","showRowTotals","displayNullAs","columnWidth","firstColumnWidth","resultsColumnDimensionFillGaps","useFillGaps","results","cardContentRef","useRef","pivotMeasures","pivotRowDimension","pivotColumnDimension","pivotColumnTotalsFor","pivotRowTotalsFor","jsx","ChartCard","PivotTable","i18n","meta","dataset","subInputGenericBoolean","dimensionWithDateBounds","genericBoolean","genericString","genericNumber","maxResults","PivotTablePro_emb","defineComponent","inputs","loadData"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { j as s,
|
|
1
|
+
import { j as s, aq as D, at as N, au as q, ar as x, as as w, ap as K } from "./component.constants-D0ea4CW4.js";
|
|
2
2
|
import { useState as b, useRef as P, useEffect as T, useMemo as O } from "react";
|
|
3
|
-
import { u as z, d as A, g as G, I as H, S as J, a as M } from "./EditorCard-
|
|
3
|
+
import { u as z, d as A, g as G, I as H, S as J, a as M } from "./EditorCard-BNBH4Y9F.js";
|
|
4
4
|
const Q = "_selectField_73cni_1", U = {
|
|
5
5
|
selectField: Q
|
|
6
6
|
}, Y = ({
|
|
@@ -104,4 +104,4 @@ const Q = "_selectField_73cni_1", U = {
|
|
|
104
104
|
export {
|
|
105
105
|
Y as S
|
|
106
106
|
};
|
|
107
|
-
//# sourceMappingURL=SingleSelectField-
|
|
107
|
+
//# sourceMappingURL=SingleSelectField-CY0TwkyW.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SingleSelectField-
|
|
1
|
+
{"version":3,"file":"SingleSelectField-CY0TwkyW.js","sources":["../src/remarkable-ui/editors/select/SingleSelectField/SingleSelectField.tsx"],"sourcesContent":["import { FC, useEffect, useMemo, useRef, useState } from 'react';\nimport { TextField } from '../../TextField/TextField';\nimport { SelectButton } from '../shared/SelectButton/SelectButton';\nimport { Dropdown } from '../../../shared/Dropdown/Dropdown';\nimport { SelectList } from '../shared/SelectList/SelectList';\nimport { SelectListOptions } from '../shared/SelectList/SelectListOptions/SelectListOptions';\nimport {\n SelectListOption,\n SelectListOptionProps,\n SelectListOptionPropsWithCategory,\n} from '../shared/SelectList/SelectListOptions/SelectListOption/SelectListOption';\nimport { SelectListCategory } from '../shared/SelectList/SelectListOptions/SelectListCategory/SelectListCategory';\nimport { groupOptionsByCategory } from '../shared/SelectList/selectList.utils';\nimport { debounce } from '../../../utils/debounce.utils';\nimport { IconSearch, TablerIcon } from '@tabler/icons-react';\nimport { useSelectSearchFocus } from '../shared/useSelectSearchFocus.hook';\nimport styles from './SingleSelectField.module.css';\nimport { FieldErrorMessage } from '../../../shared/FieldErrorMessage/FieldErrorMessage';\n\nexport type SingleSelectFieldProps = {\n options: (SelectListOptionProps | SelectListOptionPropsWithCategory)[];\n startIcon?: TablerIcon;\n value?: string;\n disabled?: boolean;\n placeholder?: string;\n isSearchable?: boolean;\n isClearable?: boolean;\n isLoading?: boolean;\n noOptionsMessage?: string;\n onChange: (value: string) => void;\n onSearch?: (search: string) => void;\n error?: boolean;\n errorMessage?: string;\n};\n\nexport const SingleSelectField: FC<SingleSelectFieldProps> = ({\n value = '',\n startIcon,\n options,\n disabled,\n placeholder,\n isSearchable,\n isClearable,\n isLoading,\n noOptionsMessage = 'No options available',\n onChange,\n onSearch,\n error = false,\n errorMessage,\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n const [searchValue, setSearchValue] = useState<string>('');\n const [selectedLabel, setSelectedLabel] = useState<string>(value);\n\n const searchFieldRef = useRef<HTMLInputElement>(null);\n useSelectSearchFocus(isOpen, searchFieldRef);\n\n useEffect(() => {\n if (!value) {\n setSelectedLabel('');\n return;\n }\n\n const option = options.find((opt) => opt.value === value);\n if (option) {\n setSelectedLabel(option.label);\n }\n }, [value, options]);\n\n const debouncedSearch = useMemo(() => (onSearch ? debounce(onSearch) : undefined), [onSearch]);\n\n const displayOptions =\n isSearchable && !onSearch\n ? options.filter((option) => option.label.toLowerCase().includes(searchValue.toLowerCase()))\n : options;\n\n const groupedOptions = useMemo(() => groupOptionsByCategory(displayOptions), [displayOptions]);\n\n const handleChange = (newValue?: string) => {\n setSearchValue('');\n onChange(newValue ?? '');\n onSearch?.('');\n\n if (newValue === '') {\n setSelectedLabel('');\n } else {\n const option = options.find((opt) => opt.value === newValue);\n if (option) setSelectedLabel(option.label);\n }\n };\n\n const handleSearch = (newSearch: string) => {\n setSearchValue(newSearch);\n debouncedSearch?.(newSearch);\n };\n\n const hasError = error || !!errorMessage;\n\n return (\n <div className={styles.selectField}>\n <Dropdown\n open={isOpen}\n onOpenChange={setIsOpen}\n disabled={disabled}\n triggerComponent={\n <SelectButton\n startIcon={startIcon}\n aria-label=\"Select option\"\n placeholder={placeholder}\n disabled={disabled}\n valueLabel={selectedLabel}\n onClear={() => handleChange('')}\n isClearable={isClearable}\n isLoading={isLoading}\n error={hasError}\n />\n }\n >\n <SelectList>\n {isSearchable && (\n <TextField\n ref={searchFieldRef}\n startIcon={IconSearch}\n aria-label=\"Search options\"\n placeholder=\"Search…\"\n role=\"searchbox\"\n value={searchValue}\n onKeyDown={(e) => e.stopPropagation()}\n onChange={handleSearch}\n />\n )}\n <SelectListOptions disabled={isLoading}>\n {groupedOptions\n ? Object.entries(groupedOptions).map(([category, categoryOptions]) => (\n <div key={category}>\n <SelectListCategory label={category} />\n {categoryOptions.map((option) => (\n <SelectListOption\n key={option?.value ?? option.label}\n onClick={() => handleChange(option?.value)}\n isSelected={option.value === value}\n {...option}\n />\n ))}\n </div>\n ))\n : displayOptions.map((option) => (\n <SelectListOption\n key={option?.value ?? option.label}\n onClick={() => handleChange(option?.value)}\n isSelected={option.value === value}\n {...option}\n />\n ))}\n {options.length === 0 && (\n <SelectListOption disabled value=\"empty\" label={noOptionsMessage} />\n )}\n </SelectListOptions>\n </SelectList>\n </Dropdown>\n {errorMessage && <FieldErrorMessage message={errorMessage} />}\n </div>\n );\n};\n"],"names":["SingleSelectField","value","startIcon","options","disabled","placeholder","isSearchable","isClearable","isLoading","noOptionsMessage","onChange","onSearch","error","errorMessage","isOpen","setIsOpen","useState","searchValue","setSearchValue","selectedLabel","setSelectedLabel","searchFieldRef","useRef","useSelectSearchFocus","useEffect","option","opt","debouncedSearch","useMemo","debounce","displayOptions","groupedOptions","groupOptionsByCategory","handleChange","newValue","handleSearch","newSearch","hasError","jsxs","styles","jsx","Dropdown","SelectButton","SelectList","TextField","IconSearch","SelectListOptions","category","categoryOptions","SelectListCategory","SelectListOption","FieldErrorMessage"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent as i } from "@embeddable.com/react";
|
|
2
|
-
import { d as s, z as r, t as d, c as m,
|
|
3
|
-
import { M as p, S as g } from "./index-
|
|
2
|
+
import { d as s, z as r, t as d, c as m, af as c, V as n, o as u } from "./component.constants-D0ea4CW4.js";
|
|
3
|
+
import { M as p, S as g } from "./index-BGf7vP5k.js";
|
|
4
4
|
const f = {
|
|
5
5
|
name: "SingleSelectFieldPro",
|
|
6
6
|
label: "Single Select Field",
|