@hpcc-js/html 3.3.0 → 3.3.2
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/index.js +5 -1061
- package/dist/index.js.map +1 -1
- package/dist/index.umd.cjs +3 -2
- package/dist/index.umd.cjs.map +1 -1
- package/package.json +6 -6
package/dist/index.js
CHANGED
|
@@ -1,1061 +1,5 @@
|
|
|
1
|
-
import { HTMLWidget, format, select } from "@hpcc-js/common";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
const PKG_NAME = "@hpcc-js/html";
|
|
7
|
-
const PKG_VERSION = "3.3.0";
|
|
8
|
-
const BUILD_VERSION = "3.15.0";
|
|
9
|
-
|
|
10
|
-
//#endregion
|
|
11
|
-
//#region src/HTMLTooltip.ts
|
|
12
|
-
var HTMLTooltip = class extends HTMLWidget {
|
|
13
|
-
_triggerElement;
|
|
14
|
-
_contentNode;
|
|
15
|
-
_prevContentNode;
|
|
16
|
-
_tooltipElement;
|
|
17
|
-
_arrowElement;
|
|
18
|
-
_tooltipHTMLCallback = (data) => "<b>_tooltipHTMLCallback is undefined</b>";
|
|
19
|
-
_logger = scopedLogger("html/HTMLTooltip");
|
|
20
|
-
constructor() {
|
|
21
|
-
super();
|
|
22
|
-
this.visible(false);
|
|
23
|
-
}
|
|
24
|
-
tooltipHTML(_) {
|
|
25
|
-
this._tooltipHTMLCallback = _;
|
|
26
|
-
return this;
|
|
27
|
-
}
|
|
28
|
-
tooltipContent(_) {
|
|
29
|
-
if (!arguments.length) return this._contentNode;
|
|
30
|
-
this._contentNode = _;
|
|
31
|
-
return this;
|
|
32
|
-
}
|
|
33
|
-
triggerElement(_) {
|
|
34
|
-
this._triggerElement = _;
|
|
35
|
-
return this;
|
|
36
|
-
}
|
|
37
|
-
enter(domNode, element) {
|
|
38
|
-
super.enter(domNode, element);
|
|
39
|
-
const body = select("body");
|
|
40
|
-
this._tooltipElement = body.append("div").attr("class", "tooltip-div").style("z-index", "2147483638").style("position", "fixed");
|
|
41
|
-
this._arrowElement = body.append("div").attr("class", "arrow-div").style("z-index", "2147483638").style("position", "fixed");
|
|
42
|
-
}
|
|
43
|
-
update(domNode, element) {
|
|
44
|
-
super.update(domNode, element);
|
|
45
|
-
if (this._contentNode !== this._prevContentNode) {
|
|
46
|
-
const node = this._tooltipElement.node();
|
|
47
|
-
[...node.querySelectorAll("*")].map((n$1) => n$1.__data__).filter((n$1) => n$1).forEach((w$1) => {
|
|
48
|
-
if (typeof w$1.target === "function") w$1.target(null);
|
|
49
|
-
if (typeof w$1.exit === "function") w$1.exit();
|
|
50
|
-
});
|
|
51
|
-
node.innerHTML = "";
|
|
52
|
-
node.appendChild(this._contentNode);
|
|
53
|
-
this._prevContentNode = this._contentNode;
|
|
54
|
-
}
|
|
55
|
-
if (this._contentNode) this.onShowContent(this._contentNode);
|
|
56
|
-
else this._tooltipElement.html(() => {
|
|
57
|
-
return this._tooltipHTMLCallback(this.data());
|
|
58
|
-
});
|
|
59
|
-
if (this.fitContent()) {
|
|
60
|
-
this._tooltipElement.style("width", "auto").style("height", "auto").style("padding", "0px").style("box-sizing", "content-box");
|
|
61
|
-
const rect = this._tooltipElement.node().getBoundingClientRect();
|
|
62
|
-
this.tooltipWidth_default(rect.width);
|
|
63
|
-
this.tooltipHeight_default(rect.height);
|
|
64
|
-
}
|
|
65
|
-
this._closing = false;
|
|
66
|
-
this._tooltipElement.style("background-color", this.tooltipColor()).style("color", this.fontColor()).style("width", this.tooltipWidth() + "px").style("height", this.tooltipHeight() + "px").style("opacity", 1).style("padding", this.padding() + "px").style("pointer-events", this.enablePointerEvents() ? "all" : "none").style("box-sizing", "content-box");
|
|
67
|
-
this._arrowElement.style("opacity", 1).style("pointer-events", "none");
|
|
68
|
-
this.updateTooltipPosition();
|
|
69
|
-
}
|
|
70
|
-
onShowContent(node) {}
|
|
71
|
-
updateTooltipPosition() {
|
|
72
|
-
const bbox = this.calcReferenceBBox();
|
|
73
|
-
const direction = this.calcTooltipDirection(bbox);
|
|
74
|
-
const box = bbox[direction];
|
|
75
|
-
this._tooltipElement.style("top", box.y + "px").style("left", box.x + "px");
|
|
76
|
-
this.setArrowPosition(box, direction);
|
|
77
|
-
return box;
|
|
78
|
-
}
|
|
79
|
-
calcTooltipDirection(bbox) {
|
|
80
|
-
const directions = Object.keys(bbox);
|
|
81
|
-
const defaultDirection = this.direction();
|
|
82
|
-
directions.sort((a$1, b) => a$1 === defaultDirection ? -1 : 1);
|
|
83
|
-
const windowRect = {
|
|
84
|
-
top: 0,
|
|
85
|
-
left: 0,
|
|
86
|
-
width: window.innerWidth,
|
|
87
|
-
height: window.innerHeight
|
|
88
|
-
};
|
|
89
|
-
for (let i$2 = 0; i$2 < directions.length; i$2++) {
|
|
90
|
-
const tooltipRect = {
|
|
91
|
-
top: bbox[directions[i$2]].y,
|
|
92
|
-
left: bbox[directions[i$2]].x,
|
|
93
|
-
width: this.tooltipWidth(),
|
|
94
|
-
height: this.tooltipHeight()
|
|
95
|
-
};
|
|
96
|
-
if (this.rectFits(tooltipRect, windowRect)) return directions[i$2];
|
|
97
|
-
}
|
|
98
|
-
this._logger.warning(`Tooltip doesn't fit in the window for any of the directions. Defaulting to '${defaultDirection}'`);
|
|
99
|
-
this._logger.debug(windowRect);
|
|
100
|
-
this._logger.debug({
|
|
101
|
-
top: bbox[defaultDirection].y,
|
|
102
|
-
left: bbox[defaultDirection].x,
|
|
103
|
-
width: this.tooltipWidth(),
|
|
104
|
-
height: this.tooltipHeight()
|
|
105
|
-
});
|
|
106
|
-
return defaultDirection;
|
|
107
|
-
}
|
|
108
|
-
rectFits(innerRect, outerRect) {
|
|
109
|
-
return innerRect.top >= outerRect.top && innerRect.left >= outerRect.left && innerRect.width + innerRect.left <= outerRect.width + outerRect.left && innerRect.height + innerRect.top <= outerRect.height + outerRect.top;
|
|
110
|
-
}
|
|
111
|
-
setArrowPosition(point, direction) {
|
|
112
|
-
let top;
|
|
113
|
-
let left;
|
|
114
|
-
let visibleBorderStyle = "border-top-color";
|
|
115
|
-
this._arrowElement.style("border", `${this.arrowHeight()}px solid ${this.tooltipColor()}`).style("border-top-color", "transparent").style("border-right-color", "transparent").style("border-bottom-color", "transparent").style("border-left-color", "transparent");
|
|
116
|
-
switch (direction) {
|
|
117
|
-
case "n":
|
|
118
|
-
top = point.y + this.tooltipHeight() + this.padding() * 2;
|
|
119
|
-
left = point.x + this.tooltipWidth() / 2 - this.arrowWidth() / 2 + this.padding();
|
|
120
|
-
visibleBorderStyle = "border-top-color";
|
|
121
|
-
this._arrowElement.style("border-top-width", `${this.arrowHeight()}px`).style("border-bottom-width", "0px").style("border-left-width", `${this.arrowWidth() / 2}px`).style("border-right-width", `${this.arrowWidth() / 2}px`);
|
|
122
|
-
break;
|
|
123
|
-
case "s":
|
|
124
|
-
top = point.y - this.arrowHeight();
|
|
125
|
-
left = point.x + this.padding() + this.tooltipWidth() / 2 - this.arrowWidth() / 2;
|
|
126
|
-
visibleBorderStyle = "border-bottom-color";
|
|
127
|
-
this._arrowElement.style("border-top-width", "0px").style("border-bottom-width", `${this.arrowHeight()}px`).style("border-left-width", `${this.arrowWidth() / 2}px`).style("border-right-width", `${this.arrowWidth() / 2}px`);
|
|
128
|
-
break;
|
|
129
|
-
case "e":
|
|
130
|
-
top = point.y + this.tooltipHeight() / 2 + this.padding() - this.arrowWidth() / 2;
|
|
131
|
-
left = point.x - this.arrowHeight();
|
|
132
|
-
visibleBorderStyle = "border-right-color";
|
|
133
|
-
this._arrowElement.style("border-top-width", `${this.arrowWidth() / 2}px`).style("border-bottom-width", `${this.arrowWidth() / 2}px`).style("border-left-width", "0px").style("border-right-width", `${this.arrowHeight()}px`);
|
|
134
|
-
break;
|
|
135
|
-
case "w":
|
|
136
|
-
top = point.y + this.tooltipHeight() / 2 - this.arrowWidth() / 2 + this.padding();
|
|
137
|
-
left = point.x + this.tooltipWidth() + this.padding() * 2;
|
|
138
|
-
visibleBorderStyle = "border-left-color";
|
|
139
|
-
this._arrowElement.style("border-top-width", `${this.arrowWidth() / 2}px`).style("border-bottom-width", `${this.arrowWidth() / 2}px`).style("border-left-width", `${this.arrowHeight()}px`).style("border-right-width", "0px");
|
|
140
|
-
break;
|
|
141
|
-
}
|
|
142
|
-
if (typeof top !== "undefined" && typeof left !== "undefined") this._arrowElement.style("top", top + "px").style("left", left + "px").style(visibleBorderStyle, this.tooltipColor()).style("opacity", 1);
|
|
143
|
-
else this._arrowElement.style("opacity", 0);
|
|
144
|
-
return point;
|
|
145
|
-
}
|
|
146
|
-
getReferenceNode() {
|
|
147
|
-
if (!this._triggerElement) return this.element().node().parentNode.parentNode;
|
|
148
|
-
return this._triggerElement.node();
|
|
149
|
-
}
|
|
150
|
-
_cursorLoc;
|
|
151
|
-
calcReferenceBBox() {
|
|
152
|
-
let { top, left, width, height } = this.getReferenceNode().getBoundingClientRect();
|
|
153
|
-
const wholeW = this.tooltipWidth();
|
|
154
|
-
const wholeH = this.tooltipHeight();
|
|
155
|
-
const halfW = wholeW / 2;
|
|
156
|
-
const halfH = wholeH / 2;
|
|
157
|
-
const arrowH = this.arrowHeight();
|
|
158
|
-
const p$1 = this.padding();
|
|
159
|
-
const p2 = p$1 * 2;
|
|
160
|
-
if (this.followCursor() && this._cursorLoc) {
|
|
161
|
-
left = this._cursorLoc[0];
|
|
162
|
-
top = this._cursorLoc[1];
|
|
163
|
-
width = 1;
|
|
164
|
-
height = 1;
|
|
165
|
-
}
|
|
166
|
-
return {
|
|
167
|
-
n: {
|
|
168
|
-
x: left + width / 2 - halfW - p$1,
|
|
169
|
-
y: top - wholeH - arrowH - p2
|
|
170
|
-
},
|
|
171
|
-
e: {
|
|
172
|
-
x: left + width + arrowH,
|
|
173
|
-
y: top + height / 2 - halfH - p$1
|
|
174
|
-
},
|
|
175
|
-
s: {
|
|
176
|
-
x: left + width / 2 - halfW - p$1,
|
|
177
|
-
y: top + height + arrowH
|
|
178
|
-
},
|
|
179
|
-
w: {
|
|
180
|
-
x: left - wholeW - arrowH - p2,
|
|
181
|
-
y: top + height / 2 - halfH - p$1
|
|
182
|
-
},
|
|
183
|
-
nw: {
|
|
184
|
-
x: left - wholeW - p2,
|
|
185
|
-
y: top - wholeH - p2
|
|
186
|
-
},
|
|
187
|
-
ne: {
|
|
188
|
-
x: left + width,
|
|
189
|
-
y: top - wholeH - p2
|
|
190
|
-
},
|
|
191
|
-
se: {
|
|
192
|
-
x: left + width,
|
|
193
|
-
y: top + height
|
|
194
|
-
},
|
|
195
|
-
sw: {
|
|
196
|
-
x: left - wholeW - p2,
|
|
197
|
-
y: top + height
|
|
198
|
-
}
|
|
199
|
-
};
|
|
200
|
-
}
|
|
201
|
-
_closing = false;
|
|
202
|
-
mouseout() {
|
|
203
|
-
this._closing = true;
|
|
204
|
-
this._tooltipElement.on("mouseover", () => {
|
|
205
|
-
this._closing = false;
|
|
206
|
-
});
|
|
207
|
-
this._tooltipElement.on("mouseout", () => {
|
|
208
|
-
this.mouseout();
|
|
209
|
-
});
|
|
210
|
-
setTimeout(() => {
|
|
211
|
-
if (this._closing) this.visible(false);
|
|
212
|
-
}, this.closeDelay());
|
|
213
|
-
}
|
|
214
|
-
visible(_) {
|
|
215
|
-
if (!arguments.length) return super.visible();
|
|
216
|
-
if (this._arrowElement) {
|
|
217
|
-
this._arrowElement.style("visibility", _ ? "visible" : "hidden");
|
|
218
|
-
this._tooltipElement.style("visibility", _ ? "visible" : "hidden");
|
|
219
|
-
}
|
|
220
|
-
super.visible(_);
|
|
221
|
-
return this;
|
|
222
|
-
}
|
|
223
|
-
exit(domNode, element) {
|
|
224
|
-
if (this._arrowElement) {
|
|
225
|
-
this._arrowElement.remove();
|
|
226
|
-
this._tooltipElement.remove();
|
|
227
|
-
}
|
|
228
|
-
super.exit(domNode, element);
|
|
229
|
-
}
|
|
230
|
-
};
|
|
231
|
-
HTMLTooltip.prototype._class += " html_HTMLTooltip";
|
|
232
|
-
HTMLTooltip.prototype.publish("fitContent", false, "boolean", "If true, tooltip will grow to fit its html content");
|
|
233
|
-
HTMLTooltip.prototype.publish("followCursor", false, "boolean", "If true, tooltip will display relative to cursor location");
|
|
234
|
-
HTMLTooltip.prototype.publish("closeDelay", 400, "number", "Number of milliseconds to wait before closing tooltip (cancelled on tooltip mouseover event)");
|
|
235
|
-
HTMLTooltip.prototype.publish("direction", "n", "set", "Direction in which to display the tooltip", [
|
|
236
|
-
"n",
|
|
237
|
-
"s",
|
|
238
|
-
"e",
|
|
239
|
-
"w",
|
|
240
|
-
"ne",
|
|
241
|
-
"nw",
|
|
242
|
-
"se",
|
|
243
|
-
"sw"
|
|
244
|
-
]);
|
|
245
|
-
HTMLTooltip.prototype.publish("padding", 8, "number", "Padding (pixels)");
|
|
246
|
-
HTMLTooltip.prototype.publish("arrowWidth", 16, "number", "Width (or height depending on direction) of the tooltip arrow (pixels)");
|
|
247
|
-
HTMLTooltip.prototype.publish("arrowHeight", 8, "number", "Height (or width depending on direction) of the tooltip arrow (pixels)");
|
|
248
|
-
HTMLTooltip.prototype.publish("fontColor", "#FFF", "html-color", "The default font color for text in the tooltip");
|
|
249
|
-
HTMLTooltip.prototype.publish("tooltipColor", "#000000EE", "html-color", "Background color of the tooltip");
|
|
250
|
-
HTMLTooltip.prototype.publish("tooltipWidth", 200, "number", "Width of the tooltip (not including arrow) (pixels)");
|
|
251
|
-
HTMLTooltip.prototype.publish("tooltipHeight", 200, "number", "Height of the tooltip (not including arrow) (pixels)");
|
|
252
|
-
HTMLTooltip.prototype.publish("enablePointerEvents", false, "boolean", "If true, the 'pointer-events: all' style will be used");
|
|
253
|
-
|
|
254
|
-
//#endregion
|
|
255
|
-
//#region src/SimpleTable.ts
|
|
256
|
-
var SimpleTable = class extends HTMLWidget {
|
|
257
|
-
_table;
|
|
258
|
-
_tbody;
|
|
259
|
-
_thead;
|
|
260
|
-
_theadRow;
|
|
261
|
-
constructor() {
|
|
262
|
-
super();
|
|
263
|
-
}
|
|
264
|
-
transformData() {
|
|
265
|
-
return this.data();
|
|
266
|
-
}
|
|
267
|
-
enter(domNode, element) {
|
|
268
|
-
super.enter(domNode, element);
|
|
269
|
-
this._table = element.append("table");
|
|
270
|
-
this._thead = this._table.append("thead");
|
|
271
|
-
this._theadRow = this._thead.append("tr");
|
|
272
|
-
this._tbody = this._table.append("tbody");
|
|
273
|
-
}
|
|
274
|
-
update(domNode, element) {
|
|
275
|
-
super.update(domNode, element);
|
|
276
|
-
this._table.style("width", this.autoWidth() ? "auto" : "100%");
|
|
277
|
-
const theadTrSelection = this._theadRow.selectAll("th").data(this.columns());
|
|
278
|
-
theadTrSelection.enter().append("th").attr("class", (n$1, i$2) => `th-${i$2}`).merge(theadTrSelection).text((_d) => _d.toString());
|
|
279
|
-
theadTrSelection.exit().remove();
|
|
280
|
-
const trSelection = this._tbody.selectAll("tr").data(this.transformData());
|
|
281
|
-
trSelection.enter().append("tr").merge(trSelection).each(function(d$1) {
|
|
282
|
-
const tdSelection = select(this).selectAll("td").data(d$1);
|
|
283
|
-
tdSelection.enter().append("td").attr("class", (n$1, i$2) => `col-${i$2}`).merge(tdSelection).text((_d) => _d.toString());
|
|
284
|
-
tdSelection.exit().remove();
|
|
285
|
-
});
|
|
286
|
-
trSelection.exit().remove();
|
|
287
|
-
}
|
|
288
|
-
};
|
|
289
|
-
SimpleTable.prototype._class += " html_SimpleTable";
|
|
290
|
-
SimpleTable.prototype.publish("autoWidth", false, "boolean", "If true, table width will be set to 'auto'. If false, the width is set to '100%'");
|
|
291
|
-
|
|
292
|
-
//#endregion
|
|
293
|
-
//#region src/StyledTable.ts
|
|
294
|
-
var StyledTable = class extends SimpleTable {
|
|
295
|
-
constructor() {
|
|
296
|
-
super();
|
|
297
|
-
}
|
|
298
|
-
applyStyleObject(selection, styleObject) {
|
|
299
|
-
Object.keys(styleObject).forEach((styleName) => {
|
|
300
|
-
selection.style(styleName, styleObject[styleName]);
|
|
301
|
-
});
|
|
302
|
-
}
|
|
303
|
-
update(domNode, element) {
|
|
304
|
-
super.update(domNode, element);
|
|
305
|
-
element.selectAll("tr,th,td").attr("style", "").style("font-family", this.fontFamily()).style("color", this.fontColor());
|
|
306
|
-
this.theadColumnStyles().forEach((styleObj, i$2) => {
|
|
307
|
-
this.applyStyleObject(element.select(`.th-${i$2}`), styleObj);
|
|
308
|
-
});
|
|
309
|
-
this.tbodyColumnStyles().forEach((styleObj, i$2) => {
|
|
310
|
-
this.applyStyleObject(element.selectAll(`.col-${i$2}`), styleObj);
|
|
311
|
-
});
|
|
312
|
-
const evenRowStylesExist = Object.keys(this.evenRowStyles()).length > 0;
|
|
313
|
-
const lastRowStylesExist = Object.keys(this.lastRowStyles()).length > 0;
|
|
314
|
-
const tbodyRows = element.selectAll("tbody > tr");
|
|
315
|
-
if (evenRowStylesExist) {
|
|
316
|
-
const tbodyEvenRows = tbodyRows.select(function(d$1, i$2) {
|
|
317
|
-
return i$2 % 2 ? this : null;
|
|
318
|
-
});
|
|
319
|
-
this.applyStyleObject(tbodyEvenRows, this.evenRowStyles());
|
|
320
|
-
}
|
|
321
|
-
if (lastRowStylesExist) {
|
|
322
|
-
const tbodyLastRow = tbodyRows.select(function(d$1, i$2, arr) {
|
|
323
|
-
return i$2 === arr.length - 1 ? this : null;
|
|
324
|
-
});
|
|
325
|
-
this.applyStyleObject(tbodyLastRow, this.lastRowStyles());
|
|
326
|
-
}
|
|
327
|
-
}
|
|
328
|
-
};
|
|
329
|
-
StyledTable.prototype._class += " html_StyledTable";
|
|
330
|
-
StyledTable.prototype.publish("fontFamily", "Verdana", "string", "Base font-family used within the table");
|
|
331
|
-
StyledTable.prototype.publish("fontColor", "#333", "string", "Base font color used within the table");
|
|
332
|
-
StyledTable.prototype.publish("theadColumnStyles", [], "array", "Array of objects containing styles for the thead columns (ex: [{\"color\":\"red\"},{\"color\":\"blue\"}])");
|
|
333
|
-
StyledTable.prototype.publish("tbodyColumnStyles", [], "array", "Array of objects containing styles for the tbody columns (ex: [{\"color\":\"red\"},{\"color\":\"blue\"}])");
|
|
334
|
-
StyledTable.prototype.publish("lastRowStyles", {}, "object", "Object containing styles for the last row (ex: {\"color\":\"red\"})");
|
|
335
|
-
StyledTable.prototype.publish("evenRowStyles", {}, "object", "Object containing styles for even rows (ex: {\"background-color\":\"#AAA\"})");
|
|
336
|
-
|
|
337
|
-
//#endregion
|
|
338
|
-
//#region src/BreakdownTable.ts
|
|
339
|
-
var BreakdownTable = class extends StyledTable {
|
|
340
|
-
_tooltip;
|
|
341
|
-
constructor() {
|
|
342
|
-
super();
|
|
343
|
-
}
|
|
344
|
-
transformData() {
|
|
345
|
-
const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount();
|
|
346
|
-
return this.breakdownData(rowCount);
|
|
347
|
-
}
|
|
348
|
-
breakdownData(limit) {
|
|
349
|
-
const len = this.data().length;
|
|
350
|
-
const sum = this.data().reduce((acc, row) => acc + row[1], 0);
|
|
351
|
-
const data = [];
|
|
352
|
-
let percSum = 0;
|
|
353
|
-
this.data().sort((a$1, b) => a$1[1] > b[1] ? -1 : 1);
|
|
354
|
-
const showOther = len - limit > 0;
|
|
355
|
-
this.data().filter((_, i$2) => showOther ? i$2 < limit - 1 : true).forEach((row) => {
|
|
356
|
-
const perc = Math.round(row[1] / sum * 100);
|
|
357
|
-
percSum += perc;
|
|
358
|
-
data.push([row[0], perc + "%"]);
|
|
359
|
-
});
|
|
360
|
-
if (showOther) {
|
|
361
|
-
const otherLabel = `${this.otherLabel()} (${len - limit + 1})`;
|
|
362
|
-
const otherPercentage = "~" + (100 - percSum) + "%";
|
|
363
|
-
data.push([otherLabel, otherPercentage]);
|
|
364
|
-
}
|
|
365
|
-
return data;
|
|
366
|
-
}
|
|
367
|
-
calculateRowCount() {
|
|
368
|
-
const theadRowHeight = this.columns().length > 0 ? this.thFontSize() + 5 : 0;
|
|
369
|
-
const tbodyRowHeight = this.fontSize() + 5;
|
|
370
|
-
const tbodyAvailableHeight = this.height() - theadRowHeight;
|
|
371
|
-
return Math.floor(tbodyAvailableHeight / tbodyRowHeight);
|
|
372
|
-
}
|
|
373
|
-
enter(domNode, element) {
|
|
374
|
-
super.enter(domNode, element);
|
|
375
|
-
this._tooltip = new HTMLTooltip().target(domNode);
|
|
376
|
-
this._tooltip.tooltipHTML((data) => {
|
|
377
|
-
const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount();
|
|
378
|
-
const rowHeight = Math.max(...data.map((row) => this.textSize(row[0], this.fontFamily(), this.fontSize()).height)) ?? this.fontSize();
|
|
379
|
-
const widestLabel = Math.max(...data.map((row) => this.textSize(row[0], this.fontFamily(), this.fontSize()).width));
|
|
380
|
-
const widestPerc = 30;
|
|
381
|
-
const colCount = 2;
|
|
382
|
-
const w$1 = colCount * (widestLabel + widestPerc) + this._tooltip.padding() * 2;
|
|
383
|
-
const h$1 = rowHeight * Math.ceil((data.length - rowCount) / colCount) + this._tooltip.padding() * 2;
|
|
384
|
-
this._tooltip.tooltipWidth(w$1);
|
|
385
|
-
this._tooltip.tooltipHeight(h$1);
|
|
386
|
-
const otherData = this.breakdownData(this.data().length).slice(rowCount - 1);
|
|
387
|
-
return `<div style="
|
|
388
|
-
width: 100%;
|
|
389
|
-
height: 100%;
|
|
390
|
-
font-size: ${this.fontSize()}px;
|
|
391
|
-
">${otherData.map((row) => `<div style="
|
|
392
|
-
float:left;
|
|
393
|
-
width:${Math.floor(99 / colCount)}%;
|
|
394
|
-
">${row[0]}: ${row[1]}</div>`).join("")}</div>`;
|
|
395
|
-
});
|
|
396
|
-
}
|
|
397
|
-
update(domNode, element) {
|
|
398
|
-
this.theadColumnStyles_default([{
|
|
399
|
-
"color": this.thFirstColor(),
|
|
400
|
-
"font-size": this.thFontSize() + "px",
|
|
401
|
-
"font-weight": this.thFontWeight(),
|
|
402
|
-
"text-align": this.labelAlignment(),
|
|
403
|
-
"width": "auto",
|
|
404
|
-
"padding": "0px"
|
|
405
|
-
}, {
|
|
406
|
-
"width": "1%",
|
|
407
|
-
"font-size": this.thFontSize() + "px",
|
|
408
|
-
"font-weight": this.thFontWeight(),
|
|
409
|
-
"text-align": this.percentageAlignment(),
|
|
410
|
-
"padding": "0px"
|
|
411
|
-
}]);
|
|
412
|
-
this.tbodyColumnStyles_default([{
|
|
413
|
-
"color": this.topLabelColor(),
|
|
414
|
-
"font-size": this.fontSize() + "px",
|
|
415
|
-
"font-weight": "normal",
|
|
416
|
-
"text-align": this.labelAlignment(),
|
|
417
|
-
"width": "auto",
|
|
418
|
-
"padding": "0px"
|
|
419
|
-
}, {
|
|
420
|
-
"color": this.topPercentageColor(),
|
|
421
|
-
"font-size": this.fontSize() + "px",
|
|
422
|
-
"font-weight": "normal",
|
|
423
|
-
"text-align": this.percentageAlignment(),
|
|
424
|
-
"width": "1%",
|
|
425
|
-
"padding": "0px"
|
|
426
|
-
}]);
|
|
427
|
-
this.lastRowStyles_default([{
|
|
428
|
-
"color": this.otherLabelColor(),
|
|
429
|
-
"font-size": this.fontSize() + "px",
|
|
430
|
-
"font-weight": this.otherLabelBold() ? "bold" : "normal",
|
|
431
|
-
"text-align": this.labelAlignment(),
|
|
432
|
-
"width": "auto",
|
|
433
|
-
"padding": "0px"
|
|
434
|
-
}, {
|
|
435
|
-
"color": this.otherLabelColor(),
|
|
436
|
-
"font-size": this.fontSize() + "px",
|
|
437
|
-
"font-weight": this.otherPercentageBold() ? "bold" : "normal",
|
|
438
|
-
"text-align": this.percentageAlignment(),
|
|
439
|
-
"width": "1%",
|
|
440
|
-
"padding": "0px"
|
|
441
|
-
}]);
|
|
442
|
-
super.update(domNode, element);
|
|
443
|
-
if ((this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount()) < this.data().length) {
|
|
444
|
-
const lastRow = element.select("tbody > tr:last-child");
|
|
445
|
-
const context = this;
|
|
446
|
-
lastRow.on("mouseout.tooltip", (d$1) => {
|
|
447
|
-
context._tooltip._triggerElement = lastRow;
|
|
448
|
-
context._tooltip.visible(false).render();
|
|
449
|
-
}).on("mouseenter.tooltip", (d$1) => {
|
|
450
|
-
context._tooltip._triggerElement = lastRow;
|
|
451
|
-
context._tooltip.direction("n").data(context.data()).visible(true).render();
|
|
452
|
-
});
|
|
453
|
-
}
|
|
454
|
-
}
|
|
455
|
-
};
|
|
456
|
-
BreakdownTable.prototype._class += " html_BreakdownTable";
|
|
457
|
-
BreakdownTable.prototype.publish("useCalculatedRowCount", true, "boolean", "If true, rowCount will be calculated and its default will be overwritten");
|
|
458
|
-
BreakdownTable.prototype.publish("rowCount", 5, "number", "Number of total rows to display (including the 'other' row)", void 0, { disable: (w$1) => w$1.useCalculatedRowCount() });
|
|
459
|
-
BreakdownTable.prototype.publish("fontSize", 14, "number", "Font size (pixels)");
|
|
460
|
-
BreakdownTable.prototype.publish("labelAlignment", "left", "set", "Alignment of the label column text", [
|
|
461
|
-
"left",
|
|
462
|
-
"center",
|
|
463
|
-
"right"
|
|
464
|
-
]);
|
|
465
|
-
BreakdownTable.prototype.publish("percentageAlignment", "center", "set", "Alignment of the percentage column text", [
|
|
466
|
-
"left",
|
|
467
|
-
"center",
|
|
468
|
-
"right"
|
|
469
|
-
]);
|
|
470
|
-
BreakdownTable.prototype.publish("topLabelColor", "#333", "html-color", "Color of displayed 'top' labels");
|
|
471
|
-
BreakdownTable.prototype.publish("topPercentageColor", "#1A99D5", "html-color", "Color of displayed 'top' percentages");
|
|
472
|
-
BreakdownTable.prototype.publish("topPercentageBold", true, "html-color", "If true, the 'top' percentages will be bold");
|
|
473
|
-
BreakdownTable.prototype.publish("otherLabel", "Other", "string", "Label text for the 'other' row");
|
|
474
|
-
BreakdownTable.prototype.publish("otherLabelColor", "#AAA", "html-color", "Color of the 'other' label");
|
|
475
|
-
BreakdownTable.prototype.publish("otherLabelBold", false, "html-color", "If true, the 'other' label will be bold");
|
|
476
|
-
BreakdownTable.prototype.publish("otherPercentageColor", "#AAA", "html-color", "Color of the 'other' percentage");
|
|
477
|
-
BreakdownTable.prototype.publish("otherPercentageBold", false, "html-color", "If true, the 'other' percentage will be bold");
|
|
478
|
-
BreakdownTable.prototype.publish("thFontWeight", "bold", "string", "Font weight for th elements");
|
|
479
|
-
BreakdownTable.prototype.publish("thFontSize", 26, "number", "Font size for th elements");
|
|
480
|
-
BreakdownTable.prototype.publish("thFirstColor", "#333", "html-color", "Text color of the first th element");
|
|
481
|
-
BreakdownTable.prototype.publish("thLastColor", "#333", "html-color", "Text color of the last th element");
|
|
482
|
-
|
|
483
|
-
//#endregion
|
|
484
|
-
//#region src/JSXWidget.ts
|
|
485
|
-
var JSXWidget = class extends HTMLWidget {
|
|
486
|
-
static Component = React.Component;
|
|
487
|
-
static createElement = React.createElement;
|
|
488
|
-
rootNode;
|
|
489
|
-
jsxRender(jsx, domNode) {
|
|
490
|
-
this.rootNode = React.render(jsx, domNode, this.rootNode);
|
|
491
|
-
}
|
|
492
|
-
};
|
|
493
|
-
JSXWidget.prototype._class += " html_JSXWidget";
|
|
494
|
-
|
|
495
|
-
//#endregion
|
|
496
|
-
//#region src/reactD3.ts
|
|
497
|
-
var VNode = class {
|
|
498
|
-
_attrs;
|
|
499
|
-
_children;
|
|
500
|
-
constructor(attrs, children) {
|
|
501
|
-
this._attrs = attrs;
|
|
502
|
-
this._children = children;
|
|
503
|
-
}
|
|
504
|
-
type() {
|
|
505
|
-
return "div";
|
|
506
|
-
}
|
|
507
|
-
attrs() {
|
|
508
|
-
return this._attrs;
|
|
509
|
-
}
|
|
510
|
-
attr(key) {
|
|
511
|
-
return this._attrs[key];
|
|
512
|
-
}
|
|
513
|
-
children() {
|
|
514
|
-
return this._children;
|
|
515
|
-
}
|
|
516
|
-
update(targetElement) {
|
|
517
|
-
for (const key in this._attrs) targetElement.attr(key, this._attrs[key]);
|
|
518
|
-
}
|
|
519
|
-
render(targetElement) {
|
|
520
|
-
const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data([this]);
|
|
521
|
-
thisElement.exit().remove();
|
|
522
|
-
return thisElement.enter().append(this.type()).attr("reactd3", 0).merge(thisElement).each(function(d$1) {
|
|
523
|
-
const element = select(this);
|
|
524
|
-
d$1.update(element);
|
|
525
|
-
d$1.renderChildren(element);
|
|
526
|
-
});
|
|
527
|
-
}
|
|
528
|
-
renderChildren(targetElement) {
|
|
529
|
-
const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data(this._children);
|
|
530
|
-
thisElement.exit().remove();
|
|
531
|
-
return thisElement.enter().append((d$1) => document.createElement(d$1.type())).attr("reactd3", (_d, i$2) => i$2).merge(thisElement).each(function(d$1) {
|
|
532
|
-
const element = select(this);
|
|
533
|
-
d$1.update(element);
|
|
534
|
-
d$1.renderChildren(element);
|
|
535
|
-
});
|
|
536
|
-
}
|
|
537
|
-
};
|
|
538
|
-
var ConstVNode = class extends VNode {
|
|
539
|
-
_type;
|
|
540
|
-
constructor(type, attrs, children) {
|
|
541
|
-
super(attrs, children);
|
|
542
|
-
this._type = type;
|
|
543
|
-
}
|
|
544
|
-
type() {
|
|
545
|
-
return this._type;
|
|
546
|
-
}
|
|
547
|
-
};
|
|
548
|
-
var TextVNode = class extends VNode {
|
|
549
|
-
_text;
|
|
550
|
-
constructor(text) {
|
|
551
|
-
super({}, []);
|
|
552
|
-
this._text = text;
|
|
553
|
-
}
|
|
554
|
-
type() {
|
|
555
|
-
return "span";
|
|
556
|
-
}
|
|
557
|
-
update(targetElement) {
|
|
558
|
-
super.update(targetElement);
|
|
559
|
-
targetElement.text(this._text);
|
|
560
|
-
}
|
|
561
|
-
};
|
|
562
|
-
function isReactFn(_) {
|
|
563
|
-
return typeof _ === "function";
|
|
564
|
-
}
|
|
565
|
-
function isIVNode(_) {
|
|
566
|
-
return _.prototype && _.prototype instanceof VNode;
|
|
567
|
-
}
|
|
568
|
-
var ReactD3 = class {
|
|
569
|
-
static createElement(type, attrs, ...children) {
|
|
570
|
-
if (isIVNode(type)) return new type(attrs);
|
|
571
|
-
else if (isReactFn(type)) return type(attrs);
|
|
572
|
-
return new ConstVNode(type, attrs, children.map((child) => {
|
|
573
|
-
if (typeof child === "string") return new TextVNode(child);
|
|
574
|
-
return child;
|
|
575
|
-
}));
|
|
576
|
-
}
|
|
577
|
-
static render(vdom, targetElement) {
|
|
578
|
-
vdom.render(targetElement);
|
|
579
|
-
}
|
|
580
|
-
};
|
|
581
|
-
|
|
582
|
-
//#endregion
|
|
583
|
-
//#region ../../node_modules/preact/dist/preact.module.js
|
|
584
|
-
var n, l, u$1, t, i$1, r, o$1, e, f$1, c, s, a, h, p = {}, v = [], y = /acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i, w = Array.isArray;
|
|
585
|
-
function d(n$1, l$1) {
|
|
586
|
-
for (var u$2 in l$1) n$1[u$2] = l$1[u$2];
|
|
587
|
-
return n$1;
|
|
588
|
-
}
|
|
589
|
-
function g(n$1) {
|
|
590
|
-
n$1 && n$1.parentNode && n$1.parentNode.removeChild(n$1);
|
|
591
|
-
}
|
|
592
|
-
function m(n$1, t$1, i$2, r$1, o$2) {
|
|
593
|
-
var e$1 = {
|
|
594
|
-
type: n$1,
|
|
595
|
-
props: t$1,
|
|
596
|
-
key: i$2,
|
|
597
|
-
ref: r$1,
|
|
598
|
-
__k: null,
|
|
599
|
-
__: null,
|
|
600
|
-
__b: 0,
|
|
601
|
-
__e: null,
|
|
602
|
-
__c: null,
|
|
603
|
-
constructor: void 0,
|
|
604
|
-
__v: null == o$2 ? ++u$1 : o$2,
|
|
605
|
-
__i: -1,
|
|
606
|
-
__u: 0
|
|
607
|
-
};
|
|
608
|
-
return null == o$2 && null != l.vnode && l.vnode(e$1), e$1;
|
|
609
|
-
}
|
|
610
|
-
function k(n$1) {
|
|
611
|
-
return n$1.children;
|
|
612
|
-
}
|
|
613
|
-
function x(n$1, l$1) {
|
|
614
|
-
this.props = n$1, this.context = l$1;
|
|
615
|
-
}
|
|
616
|
-
function S(n$1, l$1) {
|
|
617
|
-
if (null == l$1) return n$1.__ ? S(n$1.__, n$1.__i + 1) : null;
|
|
618
|
-
for (var u$2; l$1 < n$1.__k.length; l$1++) if (null != (u$2 = n$1.__k[l$1]) && null != u$2.__e) return u$2.__e;
|
|
619
|
-
return "function" == typeof n$1.type ? S(n$1) : null;
|
|
620
|
-
}
|
|
621
|
-
function C(n$1) {
|
|
622
|
-
var l$1, u$2;
|
|
623
|
-
if (null != (n$1 = n$1.__) && null != n$1.__c) {
|
|
624
|
-
for (n$1.__e = n$1.__c.base = null, l$1 = 0; l$1 < n$1.__k.length; l$1++) if (null != (u$2 = n$1.__k[l$1]) && null != u$2.__e) {
|
|
625
|
-
n$1.__e = n$1.__c.base = u$2.__e;
|
|
626
|
-
break;
|
|
627
|
-
}
|
|
628
|
-
return C(n$1);
|
|
629
|
-
}
|
|
630
|
-
}
|
|
631
|
-
function M(n$1) {
|
|
632
|
-
(!n$1.__d && (n$1.__d = !0) && i$1.push(n$1) && !$.__r++ || r != l.debounceRendering) && ((r = l.debounceRendering) || o$1)($);
|
|
633
|
-
}
|
|
634
|
-
function $() {
|
|
635
|
-
for (var n$1, u$2, t$1, r$1, o$2, f$2, c$1, s$1 = 1; i$1.length;) i$1.length > s$1 && i$1.sort(e), n$1 = i$1.shift(), s$1 = i$1.length, n$1.__d && (t$1 = void 0, r$1 = void 0, o$2 = (r$1 = (u$2 = n$1).__v).__e, f$2 = [], c$1 = [], u$2.__P && ((t$1 = d({}, r$1)).__v = r$1.__v + 1, l.vnode && l.vnode(t$1), O(u$2.__P, t$1, r$1, u$2.__n, u$2.__P.namespaceURI, 32 & r$1.__u ? [o$2] : null, f$2, null == o$2 ? S(r$1) : o$2, !!(32 & r$1.__u), c$1), t$1.__v = r$1.__v, t$1.__.__k[t$1.__i] = t$1, N(f$2, t$1, c$1), r$1.__e = r$1.__ = null, t$1.__e != o$2 && C(t$1)));
|
|
636
|
-
$.__r = 0;
|
|
637
|
-
}
|
|
638
|
-
function I(n$1, l$1, u$2, t$1, i$2, r$1, o$2, e$1, f$2, c$1, s$1) {
|
|
639
|
-
var a$1, h$1, y$1, w$1, d$1, g$1, _, m$1 = t$1 && t$1.__k || v, b = l$1.length;
|
|
640
|
-
for (f$2 = P(u$2, l$1, m$1, f$2, b), a$1 = 0; a$1 < b; a$1++) null != (y$1 = u$2.__k[a$1]) && (h$1 = -1 == y$1.__i ? p : m$1[y$1.__i] || p, y$1.__i = a$1, g$1 = O(n$1, y$1, h$1, i$2, r$1, o$2, e$1, f$2, c$1, s$1), w$1 = y$1.__e, y$1.ref && h$1.ref != y$1.ref && (h$1.ref && B(h$1.ref, null, y$1), s$1.push(y$1.ref, y$1.__c || w$1, y$1)), null == d$1 && null != w$1 && (d$1 = w$1), (_ = !!(4 & y$1.__u)) || h$1.__k === y$1.__k ? f$2 = A(y$1, f$2, n$1, _) : "function" == typeof y$1.type && void 0 !== g$1 ? f$2 = g$1 : w$1 && (f$2 = w$1.nextSibling), y$1.__u &= -7);
|
|
641
|
-
return u$2.__e = d$1, f$2;
|
|
642
|
-
}
|
|
643
|
-
function P(n$1, l$1, u$2, t$1, i$2) {
|
|
644
|
-
var r$1, o$2, e$1, f$2, c$1, s$1 = u$2.length, a$1 = s$1, h$1 = 0;
|
|
645
|
-
for (n$1.__k = new Array(i$2), r$1 = 0; r$1 < i$2; r$1++) null != (o$2 = l$1[r$1]) && "boolean" != typeof o$2 && "function" != typeof o$2 ? (f$2 = r$1 + h$1, (o$2 = n$1.__k[r$1] = "string" == typeof o$2 || "number" == typeof o$2 || "bigint" == typeof o$2 || o$2.constructor == String ? m(null, o$2, null, null, null) : w(o$2) ? m(k, { children: o$2 }, null, null, null) : null == o$2.constructor && o$2.__b > 0 ? m(o$2.type, o$2.props, o$2.key, o$2.ref ? o$2.ref : null, o$2.__v) : o$2).__ = n$1, o$2.__b = n$1.__b + 1, e$1 = null, -1 != (c$1 = o$2.__i = L(o$2, u$2, f$2, a$1)) && (a$1--, (e$1 = u$2[c$1]) && (e$1.__u |= 2)), null == e$1 || null == e$1.__v ? (-1 == c$1 && (i$2 > s$1 ? h$1-- : i$2 < s$1 && h$1++), "function" != typeof o$2.type && (o$2.__u |= 4)) : c$1 != f$2 && (c$1 == f$2 - 1 ? h$1-- : c$1 == f$2 + 1 ? h$1++ : (c$1 > f$2 ? h$1-- : h$1++, o$2.__u |= 4))) : n$1.__k[r$1] = null;
|
|
646
|
-
if (a$1) for (r$1 = 0; r$1 < s$1; r$1++) null != (e$1 = u$2[r$1]) && 0 == (2 & e$1.__u) && (e$1.__e == t$1 && (t$1 = S(e$1)), D(e$1, e$1));
|
|
647
|
-
return t$1;
|
|
648
|
-
}
|
|
649
|
-
function A(n$1, l$1, u$2, t$1) {
|
|
650
|
-
var i$2, r$1;
|
|
651
|
-
if ("function" == typeof n$1.type) {
|
|
652
|
-
for (i$2 = n$1.__k, r$1 = 0; i$2 && r$1 < i$2.length; r$1++) i$2[r$1] && (i$2[r$1].__ = n$1, l$1 = A(i$2[r$1], l$1, u$2, t$1));
|
|
653
|
-
return l$1;
|
|
654
|
-
}
|
|
655
|
-
n$1.__e != l$1 && (t$1 && (l$1 && n$1.type && !l$1.parentNode && (l$1 = S(n$1)), u$2.insertBefore(n$1.__e, l$1 || null)), l$1 = n$1.__e);
|
|
656
|
-
do
|
|
657
|
-
l$1 = l$1 && l$1.nextSibling;
|
|
658
|
-
while (null != l$1 && 8 == l$1.nodeType);
|
|
659
|
-
return l$1;
|
|
660
|
-
}
|
|
661
|
-
function L(n$1, l$1, u$2, t$1) {
|
|
662
|
-
var i$2, r$1, o$2, e$1 = n$1.key, f$2 = n$1.type, c$1 = l$1[u$2], s$1 = null != c$1 && 0 == (2 & c$1.__u);
|
|
663
|
-
if (null === c$1 && null == n$1.key || s$1 && e$1 == c$1.key && f$2 == c$1.type) return u$2;
|
|
664
|
-
if (t$1 > (s$1 ? 1 : 0)) {
|
|
665
|
-
for (i$2 = u$2 - 1, r$1 = u$2 + 1; i$2 >= 0 || r$1 < l$1.length;) if (null != (c$1 = l$1[o$2 = i$2 >= 0 ? i$2-- : r$1++]) && 0 == (2 & c$1.__u) && e$1 == c$1.key && f$2 == c$1.type) return o$2;
|
|
666
|
-
}
|
|
667
|
-
return -1;
|
|
668
|
-
}
|
|
669
|
-
function T(n$1, l$1, u$2) {
|
|
670
|
-
"-" == l$1[0] ? n$1.setProperty(l$1, null == u$2 ? "" : u$2) : n$1[l$1] = null == u$2 ? "" : "number" != typeof u$2 || y.test(l$1) ? u$2 : u$2 + "px";
|
|
671
|
-
}
|
|
672
|
-
function j(n$1, l$1, u$2, t$1, i$2) {
|
|
673
|
-
var r$1, o$2;
|
|
674
|
-
n: if ("style" == l$1) if ("string" == typeof u$2) n$1.style.cssText = u$2;
|
|
675
|
-
else {
|
|
676
|
-
if ("string" == typeof t$1 && (n$1.style.cssText = t$1 = ""), t$1) for (l$1 in t$1) u$2 && l$1 in u$2 || T(n$1.style, l$1, "");
|
|
677
|
-
if (u$2) for (l$1 in u$2) t$1 && u$2[l$1] == t$1[l$1] || T(n$1.style, l$1, u$2[l$1]);
|
|
678
|
-
}
|
|
679
|
-
else if ("o" == l$1[0] && "n" == l$1[1]) r$1 = l$1 != (l$1 = l$1.replace(f$1, "$1")), o$2 = l$1.toLowerCase(), l$1 = o$2 in n$1 || "onFocusOut" == l$1 || "onFocusIn" == l$1 ? o$2.slice(2) : l$1.slice(2), n$1.l || (n$1.l = {}), n$1.l[l$1 + r$1] = u$2, u$2 ? t$1 ? u$2.u = t$1.u : (u$2.u = c, n$1.addEventListener(l$1, r$1 ? a : s, r$1)) : n$1.removeEventListener(l$1, r$1 ? a : s, r$1);
|
|
680
|
-
else {
|
|
681
|
-
if ("http://www.w3.org/2000/svg" == i$2) l$1 = l$1.replace(/xlink(H|:h)/, "h").replace(/sName$/, "s");
|
|
682
|
-
else if ("width" != l$1 && "height" != l$1 && "href" != l$1 && "list" != l$1 && "form" != l$1 && "tabIndex" != l$1 && "download" != l$1 && "rowSpan" != l$1 && "colSpan" != l$1 && "role" != l$1 && "popover" != l$1 && l$1 in n$1) try {
|
|
683
|
-
n$1[l$1] = null == u$2 ? "" : u$2;
|
|
684
|
-
break n;
|
|
685
|
-
} catch (n$2) {}
|
|
686
|
-
"function" == typeof u$2 || (null == u$2 || !1 === u$2 && "-" != l$1[4] ? n$1.removeAttribute(l$1) : n$1.setAttribute(l$1, "popover" == l$1 && 1 == u$2 ? "" : u$2));
|
|
687
|
-
}
|
|
688
|
-
}
|
|
689
|
-
function F(n$1) {
|
|
690
|
-
return function(u$2) {
|
|
691
|
-
if (this.l) {
|
|
692
|
-
var t$1 = this.l[u$2.type + n$1];
|
|
693
|
-
if (null == u$2.t) u$2.t = c++;
|
|
694
|
-
else if (u$2.t < t$1.u) return;
|
|
695
|
-
return t$1(l.event ? l.event(u$2) : u$2);
|
|
696
|
-
}
|
|
697
|
-
};
|
|
698
|
-
}
|
|
699
|
-
function O(n$1, u$2, t$1, i$2, r$1, o$2, e$1, f$2, c$1, s$1) {
|
|
700
|
-
var a$1, h$1, p$1, v$1, y$1, _, m$1, b, S$1, C$1, M$1, $$1, P$1, A$1, H, L$1, T$1, j$1 = u$2.type;
|
|
701
|
-
if (null != u$2.constructor) return null;
|
|
702
|
-
128 & t$1.__u && (c$1 = !!(32 & t$1.__u), o$2 = [f$2 = u$2.__e = t$1.__e]), (a$1 = l.__b) && a$1(u$2);
|
|
703
|
-
n: if ("function" == typeof j$1) try {
|
|
704
|
-
if (b = u$2.props, S$1 = "prototype" in j$1 && j$1.prototype.render, C$1 = (a$1 = j$1.contextType) && i$2[a$1.__c], M$1 = a$1 ? C$1 ? C$1.props.value : a$1.__ : i$2, t$1.__c ? m$1 = (h$1 = u$2.__c = t$1.__c).__ = h$1.__E : (S$1 ? u$2.__c = h$1 = new j$1(b, M$1) : (u$2.__c = h$1 = new x(b, M$1), h$1.constructor = j$1, h$1.render = E), C$1 && C$1.sub(h$1), h$1.props = b, h$1.state || (h$1.state = {}), h$1.context = M$1, h$1.__n = i$2, p$1 = h$1.__d = !0, h$1.__h = [], h$1._sb = []), S$1 && null == h$1.__s && (h$1.__s = h$1.state), S$1 && null != j$1.getDerivedStateFromProps && (h$1.__s == h$1.state && (h$1.__s = d({}, h$1.__s)), d(h$1.__s, j$1.getDerivedStateFromProps(b, h$1.__s))), v$1 = h$1.props, y$1 = h$1.state, h$1.__v = u$2, p$1) S$1 && null == j$1.getDerivedStateFromProps && null != h$1.componentWillMount && h$1.componentWillMount(), S$1 && null != h$1.componentDidMount && h$1.__h.push(h$1.componentDidMount);
|
|
705
|
-
else {
|
|
706
|
-
if (S$1 && null == j$1.getDerivedStateFromProps && b !== v$1 && null != h$1.componentWillReceiveProps && h$1.componentWillReceiveProps(b, M$1), !h$1.__e && null != h$1.shouldComponentUpdate && !1 === h$1.shouldComponentUpdate(b, h$1.__s, M$1) || u$2.__v == t$1.__v) {
|
|
707
|
-
for (u$2.__v != t$1.__v && (h$1.props = b, h$1.state = h$1.__s, h$1.__d = !1), u$2.__e = t$1.__e, u$2.__k = t$1.__k, u$2.__k.some(function(n$2) {
|
|
708
|
-
n$2 && (n$2.__ = u$2);
|
|
709
|
-
}), $$1 = 0; $$1 < h$1._sb.length; $$1++) h$1.__h.push(h$1._sb[$$1]);
|
|
710
|
-
h$1._sb = [], h$1.__h.length && e$1.push(h$1);
|
|
711
|
-
break n;
|
|
712
|
-
}
|
|
713
|
-
null != h$1.componentWillUpdate && h$1.componentWillUpdate(b, h$1.__s, M$1), S$1 && null != h$1.componentDidUpdate && h$1.__h.push(function() {
|
|
714
|
-
h$1.componentDidUpdate(v$1, y$1, _);
|
|
715
|
-
});
|
|
716
|
-
}
|
|
717
|
-
if (h$1.context = M$1, h$1.props = b, h$1.__P = n$1, h$1.__e = !1, P$1 = l.__r, A$1 = 0, S$1) {
|
|
718
|
-
for (h$1.state = h$1.__s, h$1.__d = !1, P$1 && P$1(u$2), a$1 = h$1.render(h$1.props, h$1.state, h$1.context), H = 0; H < h$1._sb.length; H++) h$1.__h.push(h$1._sb[H]);
|
|
719
|
-
h$1._sb = [];
|
|
720
|
-
} else do
|
|
721
|
-
h$1.__d = !1, P$1 && P$1(u$2), a$1 = h$1.render(h$1.props, h$1.state, h$1.context), h$1.state = h$1.__s;
|
|
722
|
-
while (h$1.__d && ++A$1 < 25);
|
|
723
|
-
h$1.state = h$1.__s, null != h$1.getChildContext && (i$2 = d(d({}, i$2), h$1.getChildContext())), S$1 && !p$1 && null != h$1.getSnapshotBeforeUpdate && (_ = h$1.getSnapshotBeforeUpdate(v$1, y$1)), L$1 = a$1, null != a$1 && a$1.type === k && null == a$1.key && (L$1 = V(a$1.props.children)), f$2 = I(n$1, w(L$1) ? L$1 : [L$1], u$2, t$1, i$2, r$1, o$2, e$1, f$2, c$1, s$1), h$1.base = u$2.__e, u$2.__u &= -161, h$1.__h.length && e$1.push(h$1), m$1 && (h$1.__E = h$1.__ = null);
|
|
724
|
-
} catch (n$2) {
|
|
725
|
-
if (u$2.__v = null, c$1 || null != o$2) if (n$2.then) {
|
|
726
|
-
for (u$2.__u |= c$1 ? 160 : 128; f$2 && 8 == f$2.nodeType && f$2.nextSibling;) f$2 = f$2.nextSibling;
|
|
727
|
-
o$2[o$2.indexOf(f$2)] = null, u$2.__e = f$2;
|
|
728
|
-
} else {
|
|
729
|
-
for (T$1 = o$2.length; T$1--;) g(o$2[T$1]);
|
|
730
|
-
z(u$2);
|
|
731
|
-
}
|
|
732
|
-
else u$2.__e = t$1.__e, u$2.__k = t$1.__k, n$2.then || z(u$2);
|
|
733
|
-
l.__e(n$2, u$2, t$1);
|
|
734
|
-
}
|
|
735
|
-
else null == o$2 && u$2.__v == t$1.__v ? (u$2.__k = t$1.__k, u$2.__e = t$1.__e) : f$2 = u$2.__e = q(t$1.__e, u$2, t$1, i$2, r$1, o$2, e$1, c$1, s$1);
|
|
736
|
-
return (a$1 = l.diffed) && a$1(u$2), 128 & u$2.__u ? void 0 : f$2;
|
|
737
|
-
}
|
|
738
|
-
function z(n$1) {
|
|
739
|
-
n$1 && n$1.__c && (n$1.__c.__e = !0), n$1 && n$1.__k && n$1.__k.forEach(z);
|
|
740
|
-
}
|
|
741
|
-
function N(n$1, u$2, t$1) {
|
|
742
|
-
for (var i$2 = 0; i$2 < t$1.length; i$2++) B(t$1[i$2], t$1[++i$2], t$1[++i$2]);
|
|
743
|
-
l.__c && l.__c(u$2, n$1), n$1.some(function(u$3) {
|
|
744
|
-
try {
|
|
745
|
-
n$1 = u$3.__h, u$3.__h = [], n$1.some(function(n$2) {
|
|
746
|
-
n$2.call(u$3);
|
|
747
|
-
});
|
|
748
|
-
} catch (n$2) {
|
|
749
|
-
l.__e(n$2, u$3.__v);
|
|
750
|
-
}
|
|
751
|
-
});
|
|
752
|
-
}
|
|
753
|
-
function V(n$1) {
|
|
754
|
-
return "object" != typeof n$1 || null == n$1 || n$1.__b && n$1.__b > 0 ? n$1 : w(n$1) ? n$1.map(V) : d({}, n$1);
|
|
755
|
-
}
|
|
756
|
-
function q(u$2, t$1, i$2, r$1, o$2, e$1, f$2, c$1, s$1) {
|
|
757
|
-
var a$1, h$1, v$1, y$1, d$1, _, m$1, b = i$2.props, k$1 = t$1.props, x$1 = t$1.type;
|
|
758
|
-
if ("svg" == x$1 ? o$2 = "http://www.w3.org/2000/svg" : "math" == x$1 ? o$2 = "http://www.w3.org/1998/Math/MathML" : o$2 || (o$2 = "http://www.w3.org/1999/xhtml"), null != e$1) {
|
|
759
|
-
for (a$1 = 0; a$1 < e$1.length; a$1++) if ((d$1 = e$1[a$1]) && "setAttribute" in d$1 == !!x$1 && (x$1 ? d$1.localName == x$1 : 3 == d$1.nodeType)) {
|
|
760
|
-
u$2 = d$1, e$1[a$1] = null;
|
|
761
|
-
break;
|
|
762
|
-
}
|
|
763
|
-
}
|
|
764
|
-
if (null == u$2) {
|
|
765
|
-
if (null == x$1) return document.createTextNode(k$1);
|
|
766
|
-
u$2 = document.createElementNS(o$2, x$1, k$1.is && k$1), c$1 && (l.__m && l.__m(t$1, e$1), c$1 = !1), e$1 = null;
|
|
767
|
-
}
|
|
768
|
-
if (null == x$1) b === k$1 || c$1 && u$2.data == k$1 || (u$2.data = k$1);
|
|
769
|
-
else {
|
|
770
|
-
if (e$1 = e$1 && n.call(u$2.childNodes), b = i$2.props || p, !c$1 && null != e$1) for (b = {}, a$1 = 0; a$1 < u$2.attributes.length; a$1++) b[(d$1 = u$2.attributes[a$1]).name] = d$1.value;
|
|
771
|
-
for (a$1 in b) if (d$1 = b[a$1], "children" == a$1);
|
|
772
|
-
else if ("dangerouslySetInnerHTML" == a$1) v$1 = d$1;
|
|
773
|
-
else if (!(a$1 in k$1)) {
|
|
774
|
-
if ("value" == a$1 && "defaultValue" in k$1 || "checked" == a$1 && "defaultChecked" in k$1) continue;
|
|
775
|
-
j(u$2, a$1, null, d$1, o$2);
|
|
776
|
-
}
|
|
777
|
-
for (a$1 in k$1) d$1 = k$1[a$1], "children" == a$1 ? y$1 = d$1 : "dangerouslySetInnerHTML" == a$1 ? h$1 = d$1 : "value" == a$1 ? _ = d$1 : "checked" == a$1 ? m$1 = d$1 : c$1 && "function" != typeof d$1 || b[a$1] === d$1 || j(u$2, a$1, d$1, b[a$1], o$2);
|
|
778
|
-
if (h$1) c$1 || v$1 && (h$1.__html == v$1.__html || h$1.__html == u$2.innerHTML) || (u$2.innerHTML = h$1.__html), t$1.__k = [];
|
|
779
|
-
else if (v$1 && (u$2.innerHTML = ""), I("template" == t$1.type ? u$2.content : u$2, w(y$1) ? y$1 : [y$1], t$1, i$2, r$1, "foreignObject" == x$1 ? "http://www.w3.org/1999/xhtml" : o$2, e$1, f$2, e$1 ? e$1[0] : i$2.__k && S(i$2, 0), c$1, s$1), null != e$1) for (a$1 = e$1.length; a$1--;) g(e$1[a$1]);
|
|
780
|
-
c$1 || (a$1 = "value", "progress" == x$1 && null == _ ? u$2.removeAttribute("value") : null != _ && (_ !== u$2[a$1] || "progress" == x$1 && !_ || "option" == x$1 && _ != b[a$1]) && j(u$2, a$1, _, b[a$1], o$2), a$1 = "checked", null != m$1 && m$1 != u$2[a$1] && j(u$2, a$1, m$1, b[a$1], o$2));
|
|
781
|
-
}
|
|
782
|
-
return u$2;
|
|
783
|
-
}
|
|
784
|
-
function B(n$1, u$2, t$1) {
|
|
785
|
-
try {
|
|
786
|
-
if ("function" == typeof n$1) {
|
|
787
|
-
var i$2 = "function" == typeof n$1.__u;
|
|
788
|
-
i$2 && n$1.__u(), i$2 && null == u$2 || (n$1.__u = n$1(u$2));
|
|
789
|
-
} else n$1.current = u$2;
|
|
790
|
-
} catch (n$2) {
|
|
791
|
-
l.__e(n$2, t$1);
|
|
792
|
-
}
|
|
793
|
-
}
|
|
794
|
-
function D(n$1, u$2, t$1) {
|
|
795
|
-
var i$2, r$1;
|
|
796
|
-
if (l.unmount && l.unmount(n$1), (i$2 = n$1.ref) && (i$2.current && i$2.current != n$1.__e || B(i$2, null, u$2)), null != (i$2 = n$1.__c)) {
|
|
797
|
-
if (i$2.componentWillUnmount) try {
|
|
798
|
-
i$2.componentWillUnmount();
|
|
799
|
-
} catch (n$2) {
|
|
800
|
-
l.__e(n$2, u$2);
|
|
801
|
-
}
|
|
802
|
-
i$2.base = i$2.__P = null;
|
|
803
|
-
}
|
|
804
|
-
if (i$2 = n$1.__k) for (r$1 = 0; r$1 < i$2.length; r$1++) i$2[r$1] && D(i$2[r$1], u$2, t$1 || "function" != typeof n$1.type);
|
|
805
|
-
t$1 || g(n$1.__e), n$1.__c = n$1.__ = n$1.__e = void 0;
|
|
806
|
-
}
|
|
807
|
-
function E(n$1, l$1, u$2) {
|
|
808
|
-
return this.constructor(n$1, u$2);
|
|
809
|
-
}
|
|
810
|
-
n = v.slice, l = { __e: function(n$1, l$1, u$2, t$1) {
|
|
811
|
-
for (var i$2, r$1, o$2; l$1 = l$1.__;) if ((i$2 = l$1.__c) && !i$2.__) try {
|
|
812
|
-
if ((r$1 = i$2.constructor) && null != r$1.getDerivedStateFromError && (i$2.setState(r$1.getDerivedStateFromError(n$1)), o$2 = i$2.__d), null != i$2.componentDidCatch && (i$2.componentDidCatch(n$1, t$1 || {}), o$2 = i$2.__d), o$2) return i$2.__E = i$2;
|
|
813
|
-
} catch (l$2) {
|
|
814
|
-
n$1 = l$2;
|
|
815
|
-
}
|
|
816
|
-
throw n$1;
|
|
817
|
-
} }, u$1 = 0, t = function(n$1) {
|
|
818
|
-
return null != n$1 && null == n$1.constructor;
|
|
819
|
-
}, x.prototype.setState = function(n$1, l$1) {
|
|
820
|
-
var u$2 = null != this.__s && this.__s != this.state ? this.__s : this.__s = d({}, this.state);
|
|
821
|
-
"function" == typeof n$1 && (n$1 = n$1(d({}, u$2), this.props)), n$1 && d(u$2, n$1), null != n$1 && this.__v && (l$1 && this._sb.push(l$1), M(this));
|
|
822
|
-
}, x.prototype.forceUpdate = function(n$1) {
|
|
823
|
-
this.__v && (this.__e = !0, n$1 && this.__h.push(n$1), M(this));
|
|
824
|
-
}, x.prototype.render = k, i$1 = [], o$1 = "function" == typeof Promise ? Promise.prototype.then.bind(Promise.resolve()) : setTimeout, e = function(n$1, l$1) {
|
|
825
|
-
return n$1.__v.__b - l$1.__v.__b;
|
|
826
|
-
}, $.__r = 0, f$1 = /(PointerCapture)$|Capture$/i, c = 0, s = F(!1), a = F(!0), h = 0;
|
|
827
|
-
|
|
828
|
-
//#endregion
|
|
829
|
-
//#region ../../node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js
|
|
830
|
-
var o = /acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i, f = 0, i = Array.isArray;
|
|
831
|
-
function u(e$1, t$1, n$1, o$2, i$2, u$2) {
|
|
832
|
-
t$1 || (t$1 = {});
|
|
833
|
-
var a$1, c$1, p$1 = t$1;
|
|
834
|
-
if ("ref" in p$1) for (c$1 in p$1 = {}, t$1) "ref" == c$1 ? a$1 = t$1[c$1] : p$1[c$1] = t$1[c$1];
|
|
835
|
-
var l$1 = {
|
|
836
|
-
type: e$1,
|
|
837
|
-
props: p$1,
|
|
838
|
-
key: n$1,
|
|
839
|
-
ref: a$1,
|
|
840
|
-
__k: null,
|
|
841
|
-
__: null,
|
|
842
|
-
__b: 0,
|
|
843
|
-
__e: null,
|
|
844
|
-
__c: null,
|
|
845
|
-
constructor: void 0,
|
|
846
|
-
__v: --f,
|
|
847
|
-
__i: -1,
|
|
848
|
-
__u: 0,
|
|
849
|
-
__source: i$2,
|
|
850
|
-
__self: u$2
|
|
851
|
-
};
|
|
852
|
-
if ("function" == typeof e$1 && (a$1 = e$1.defaultProps)) for (c$1 in a$1) void 0 === p$1[c$1] && (p$1[c$1] = a$1[c$1]);
|
|
853
|
-
return l.vnode && l.vnode(l$1), l$1;
|
|
854
|
-
}
|
|
855
|
-
|
|
856
|
-
//#endregion
|
|
857
|
-
//#region src/VizComponent.tsx
|
|
858
|
-
var VizComponent = class extends JSXWidget.Component {
|
|
859
|
-
widget;
|
|
860
|
-
refreshProps() {
|
|
861
|
-
for (const key in this.props) if (this.widget[key] && typeof this.widget[key] === "function") this.widget[key](this.props[key]);
|
|
862
|
-
}
|
|
863
|
-
componentDidMount() {
|
|
864
|
-
this.widget = new this.props.type().target(this.base);
|
|
865
|
-
this.refreshProps();
|
|
866
|
-
this.widget.render();
|
|
867
|
-
}
|
|
868
|
-
componentWillUnmount() {
|
|
869
|
-
this.widget.target(null).render();
|
|
870
|
-
}
|
|
871
|
-
render() {
|
|
872
|
-
return /* @__PURE__ */ u("div", { style: this.props.style });
|
|
873
|
-
}
|
|
874
|
-
componentDidUpdate() {
|
|
875
|
-
this.refreshProps();
|
|
876
|
-
this.widget.render();
|
|
877
|
-
}
|
|
878
|
-
};
|
|
879
|
-
|
|
880
|
-
//#endregion
|
|
881
|
-
//#region src/VizInstance.tsx
|
|
882
|
-
var VizInstance = class extends JSXWidget.Component {
|
|
883
|
-
widget;
|
|
884
|
-
refreshProps() {
|
|
885
|
-
for (const key in this.props) if (this.widget[key] && typeof this.widget[key] === "function") this.widget[key](this.props[key]);
|
|
886
|
-
}
|
|
887
|
-
componentDidMount() {
|
|
888
|
-
this.widget = this.props.instance.target(this.base);
|
|
889
|
-
this.refreshProps();
|
|
890
|
-
this.widget.render();
|
|
891
|
-
}
|
|
892
|
-
componentWillUnmount() {
|
|
893
|
-
this.widget.target(null).render();
|
|
894
|
-
}
|
|
895
|
-
render() {
|
|
896
|
-
return /* @__PURE__ */ u("div", { style: this.props.style });
|
|
897
|
-
}
|
|
898
|
-
componentDidUpdate() {
|
|
899
|
-
this.refreshProps();
|
|
900
|
-
this.widget.render();
|
|
901
|
-
}
|
|
902
|
-
};
|
|
903
|
-
|
|
904
|
-
//#endregion
|
|
905
|
-
//#region src/StatsTable.ts
|
|
906
|
-
var StatsTable = class extends StyledTable {
|
|
907
|
-
transformData() {
|
|
908
|
-
const totalRow = [[
|
|
909
|
-
"Total",
|
|
910
|
-
0,
|
|
911
|
-
0
|
|
912
|
-
]];
|
|
913
|
-
const data = this.data();
|
|
914
|
-
data.forEach((row) => {
|
|
915
|
-
totalRow[0][1] += row[1];
|
|
916
|
-
totalRow[0][2] += row[2];
|
|
917
|
-
});
|
|
918
|
-
return data.concat(totalRow).map((row) => {
|
|
919
|
-
return [
|
|
920
|
-
row[0],
|
|
921
|
-
this.secondColumnFormat_exists() ? format(this.secondColumnFormat())(row[1]) : row[1],
|
|
922
|
-
this.thirdColumnFormat_exists() ? format(this.thirdColumnFormat())(row[2]) : row[2]
|
|
923
|
-
];
|
|
924
|
-
});
|
|
925
|
-
}
|
|
926
|
-
update(domNode, element) {
|
|
927
|
-
this.tbodyColumnStyles_default([
|
|
928
|
-
{
|
|
929
|
-
"font-weight": "bold",
|
|
930
|
-
"width": this.firstColumnWidth(),
|
|
931
|
-
"text-align": "left"
|
|
932
|
-
},
|
|
933
|
-
{
|
|
934
|
-
"width": this.secondColumnWidth(),
|
|
935
|
-
"text-align": "right"
|
|
936
|
-
},
|
|
937
|
-
{
|
|
938
|
-
"width": this.thirdColumnWidth(),
|
|
939
|
-
"text-align": "right"
|
|
940
|
-
}
|
|
941
|
-
]);
|
|
942
|
-
this.evenRowStyles_default([
|
|
943
|
-
{
|
|
944
|
-
"font-weight": "bold",
|
|
945
|
-
"width": this.firstColumnWidth(),
|
|
946
|
-
"text-align": "left",
|
|
947
|
-
"font-color": this.evenRowFontColor(),
|
|
948
|
-
"background-color": this.evenRowBackgroundColor()
|
|
949
|
-
},
|
|
950
|
-
{
|
|
951
|
-
"width": this.secondColumnWidth(),
|
|
952
|
-
"text-align": "right",
|
|
953
|
-
"font-color": this.evenRowFontColor(),
|
|
954
|
-
"background-color": this.evenRowBackgroundColor()
|
|
955
|
-
},
|
|
956
|
-
{
|
|
957
|
-
"width": this.thirdColumnWidth(),
|
|
958
|
-
"text-align": "right",
|
|
959
|
-
"font-color": this.evenRowFontColor(),
|
|
960
|
-
"background-color": this.evenRowBackgroundColor()
|
|
961
|
-
}
|
|
962
|
-
]);
|
|
963
|
-
this.lastRowStyles_default({ "font-weight": "bold" });
|
|
964
|
-
super.update(domNode, element);
|
|
965
|
-
}
|
|
966
|
-
};
|
|
967
|
-
StatsTable.prototype._class += " html_StatsTable";
|
|
968
|
-
StatsTable.prototype.publish("labelColor", "#333", "html-color", "Color of the text in the first column");
|
|
969
|
-
StatsTable.prototype.publish("primaryValueColor", "#333", "html-color", "Color of the text in the second column");
|
|
970
|
-
StatsTable.prototype.publish("secondaryValueColor", "#333", "html-color", "Color of the text in the third column");
|
|
971
|
-
StatsTable.prototype.publish("evenRowBackgroundColor", "#333", "html-color", "Background color of the even rows");
|
|
972
|
-
StatsTable.prototype.publish("evenRowFontColor", "#333", "html-color", "Font color of the even rows");
|
|
973
|
-
StatsTable.prototype.publish("firstColumnWidth", "auto", "string", "CSS style applied as the 'width' for the first column (ex: 40px)");
|
|
974
|
-
StatsTable.prototype.publish("secondColumnWidth", "1%", "string", "CSS style applied as the 'width' for the second column (ex: 40px)");
|
|
975
|
-
StatsTable.prototype.publish("thirdColumnWidth", "1%", "string", "CSS style applied as the 'width' for the third column (ex: 40px)");
|
|
976
|
-
StatsTable.prototype.publish("secondColumnFormat", "$,.0f", "string", "d3-format specifier applied to the second column's values", void 0, { optional: true });
|
|
977
|
-
StatsTable.prototype.publish("thirdColumnFormat", null, "string", "d3-format specifier applied to the third column's values", void 0, { optional: true });
|
|
978
|
-
|
|
979
|
-
//#endregion
|
|
980
|
-
//#region src/TitleBar.ts
|
|
981
|
-
var Item = class extends HTMLWidget {
|
|
982
|
-
_owner;
|
|
983
|
-
constructor(owner) {
|
|
984
|
-
super();
|
|
985
|
-
this._owner = owner;
|
|
986
|
-
this._tag = "a";
|
|
987
|
-
}
|
|
988
|
-
};
|
|
989
|
-
Item.prototype._class += " html_Item";
|
|
990
|
-
var Button = class extends Item {
|
|
991
|
-
_icon;
|
|
992
|
-
constructor(owner, icon) {
|
|
993
|
-
super(owner);
|
|
994
|
-
this._icon = icon;
|
|
995
|
-
}
|
|
996
|
-
icon() {
|
|
997
|
-
return this._icon;
|
|
998
|
-
}
|
|
999
|
-
enter(domNode, element) {
|
|
1000
|
-
super.enter(domNode, element);
|
|
1001
|
-
element.attr("href", "#").on("click", (d$1, idx, groups) => this._owner.titleBarClick(this, d$1, idx, groups)).append("i").attr("class", `fa ${this._icon} fa-lg fa-fw`);
|
|
1002
|
-
}
|
|
1003
|
-
};
|
|
1004
|
-
Button.prototype._class += " html_Button";
|
|
1005
|
-
var ToggleButton = class extends Button {
|
|
1006
|
-
enter(domNode, element) {
|
|
1007
|
-
element.on("click.sel", (d$1, idx, groups) => {
|
|
1008
|
-
this.selected(!this.selected());
|
|
1009
|
-
this.render();
|
|
1010
|
-
});
|
|
1011
|
-
super.enter(domNode, element);
|
|
1012
|
-
}
|
|
1013
|
-
update(domNode, element) {
|
|
1014
|
-
super.update(domNode, element);
|
|
1015
|
-
this._element.classed("selected", this.selected());
|
|
1016
|
-
}
|
|
1017
|
-
};
|
|
1018
|
-
ToggleButton.prototype._class += " html_ToggleButton";
|
|
1019
|
-
ToggleButton.prototype.publish("selected", false, "boolean");
|
|
1020
|
-
var Spacer = class extends Item {
|
|
1021
|
-
enter(domNode, element) {
|
|
1022
|
-
super.enter(domNode, element);
|
|
1023
|
-
element.attr("class", "spacer").attr("href", "#").append("i");
|
|
1024
|
-
}
|
|
1025
|
-
};
|
|
1026
|
-
Spacer.prototype._class += " html_Spacer";
|
|
1027
|
-
var TitleBar = class extends JSXWidget {
|
|
1028
|
-
_divMain;
|
|
1029
|
-
_divIconBar;
|
|
1030
|
-
_divTitle;
|
|
1031
|
-
constructor() {
|
|
1032
|
-
super();
|
|
1033
|
-
}
|
|
1034
|
-
enter(domNode, element) {
|
|
1035
|
-
super.enter(domNode, element);
|
|
1036
|
-
this._divMain = element.append("div").attr("class", "main");
|
|
1037
|
-
this._divIconBar = this._divMain.append("div").attr("class", "icon-bar");
|
|
1038
|
-
this._divTitle = this._divMain.append("div").attr("class", "title");
|
|
1039
|
-
}
|
|
1040
|
-
update(domNode, element) {
|
|
1041
|
-
super.update(domNode, element);
|
|
1042
|
-
this._divTitle.text(this.title());
|
|
1043
|
-
const icons = this._divIconBar.selectAll(".icon-bar-item").data(this.buttons());
|
|
1044
|
-
icons.enter().append("div").attr("class", "icon-bar-item").each(function(d$1) {
|
|
1045
|
-
d$1.target(this);
|
|
1046
|
-
}).merge(icons).each(function(d$1) {
|
|
1047
|
-
d$1.render();
|
|
1048
|
-
});
|
|
1049
|
-
icons.exit().each(function(d$1) {
|
|
1050
|
-
d$1.target(null);
|
|
1051
|
-
}).remove();
|
|
1052
|
-
icons.order();
|
|
1053
|
-
}
|
|
1054
|
-
};
|
|
1055
|
-
TitleBar.prototype._class += " html_TitleBar";
|
|
1056
|
-
TitleBar.prototype.publish("title", "", "string");
|
|
1057
|
-
TitleBar.prototype.publish("buttons", [], "widgetArray");
|
|
1058
|
-
|
|
1059
|
-
//#endregion
|
|
1060
|
-
export { BUILD_VERSION, BreakdownTable, Button, HTMLTooltip, Item, JSXWidget, PKG_NAME, PKG_VERSION, ReactD3, SimpleTable, Spacer, StatsTable, StyledTable, TitleBar, ToggleButton, VNode, VizComponent, VizInstance };
|
|
1061
|
-
//# sourceMappingURL=index.js.map!function(){try{if("undefined"!=typeof document){var t=document.createElement("style");t.appendChild(document.createTextNode("#wrap{width:100%}#left,#right{padding:5px}#left{text-align:left;text-overflow:ellipsis;white-space:nowrap;background-color:red;display:block;overflow:hidden}#right{float:right;text-align:right;white-space:nowrap;background-color:orange}.html_TitleBar>.main{width:100%;display:block}.html_TitleBar .title{text-align:left;text-overflow:ellipsis;white-space:nowrap;padding:4px;font-size:20px;font-weight:700;display:block;overflow:hidden}.html_TitleBar .icon-bar{float:right;text-align:right;white-space:nowrap;padding:4px;line-height:28px}.html_TitleBar .icon-bar-item,.html_TitleBar .icon-bar-item>div{display:inline}.html_TitleBar .icon-bar a{text-align:center;color:#a9a9a9;padding-top:4px;padding-bottom:4px;transition:all .3s}.html_TitleBar .icon-bar a:hover{background-color:#f5f5f5}.html_TitleBar .icon-bar a.selected{background-color:#efe5e5}.html_TitleBar .icon-bar a.spacer{text-align:center;color:none;padding-top:2px;padding-bottom:0;padding-left:8px}.html_TitleBar .icon-bar a.spacer:hover{background-color:#0000}.html_TitleBar .icon-bar .active{background-color:#4caf50}\n/*$vite$:1*/")),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}}();
|
|
1
|
+
var t=Object.defineProperty,e=(e,o)=>t(e,"name",{value:o,configurable:!0}),o=(e,o,i)=>((e,o,i)=>o in e?t(e,o,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[o]=i)(e,"symbol"!=typeof o?o+"":o,i);import{HTMLWidget as i,select as r,format as s}from"@hpcc-js/common";import{scopedLogger as l}from"@hpcc-js/util";import{React as n}from"@hpcc-js/react";const h="@hpcc-js/html",a="3.3.2",p="3.16.0",d=class _HTMLTooltip extends i{_triggerElement;_contentNode;_prevContentNode;_tooltipElement;_arrowElement;_tooltipHTMLCallback=/* @__PURE__ */e(t=>"<b>_tooltipHTMLCallback is undefined</b>","_tooltipHTMLCallback");_logger=l("html/HTMLTooltip");constructor(){super(),this.visible(!1)}tooltipHTML(t){return this._tooltipHTMLCallback=t,this}tooltipContent(t){return arguments.length?(this._contentNode=t,this):this._contentNode}triggerElement(t){return this._triggerElement=t,this}enter(t,e){super.enter(t,e);const o=r("body");this._tooltipElement=o.append("div").attr("class","tooltip-div").style("z-index","2147483638").style("position","fixed"),this._arrowElement=o.append("div").attr("class","arrow-div").style("z-index","2147483638").style("position","fixed")}update(t,e){if(super.update(t,e),this._contentNode!==this._prevContentNode){const t=this._tooltipElement.node();[...t.querySelectorAll("*")].map(t=>t.__data__).filter(t=>t).forEach(t=>{"function"==typeof t.target&&t.target(null),"function"==typeof t.exit&&t.exit()}),t.innerHTML="",t.appendChild(this._contentNode),this._prevContentNode=this._contentNode}if(this._contentNode?this.onShowContent(this._contentNode):this._tooltipElement.html(()=>this._tooltipHTMLCallback(this.data())),this.fitContent()){this._tooltipElement.style("width","auto").style("height","auto").style("padding","0px").style("box-sizing","content-box");const t=this._tooltipElement.node().getBoundingClientRect();this.tooltipWidth_default(t.width),this.tooltipHeight_default(t.height)}this._closing=!1,this._tooltipElement.style("background-color",this.tooltipColor()).style("color",this.fontColor()).style("width",this.tooltipWidth()+"px").style("height",this.tooltipHeight()+"px").style("opacity",1).style("padding",this.padding()+"px").style("pointer-events",this.enablePointerEvents()?"all":"none").style("box-sizing","content-box"),this._arrowElement.style("opacity",1).style("pointer-events","none"),this.updateTooltipPosition()}onShowContent(t){}updateTooltipPosition(){const t=this.calcReferenceBBox(),e=this.calcTooltipDirection(t),o=t[e];return this._tooltipElement.style("top",o.y+"px").style("left",o.x+"px"),this.setArrowPosition(o,e),o}calcTooltipDirection(t){const e=Object.keys(t),o=this.direction();e.sort((t,e)=>t===o?-1:1);const i={top:0,left:0,width:window.innerWidth,height:window.innerHeight};for(let r=0;r<e.length;r++){const o={top:t[e[r]].y,left:t[e[r]].x,width:this.tooltipWidth(),height:this.tooltipHeight()};if(this.rectFits(o,i))return e[r]}return this._logger.warning(`Tooltip doesn't fit in the window for any of the directions. Defaulting to '${o}'`),this._logger.debug(i),this._logger.debug({top:t[o].y,left:t[o].x,width:this.tooltipWidth(),height:this.tooltipHeight()}),o}rectFits(t,e){return t.top>=e.top&&t.left>=e.left&&t.width+t.left<=e.width+e.left&&t.height+t.top<=e.height+e.top}setArrowPosition(t,e){let o,i,r="border-top-color";switch(this._arrowElement.style("border",`${this.arrowHeight()}px solid ${this.tooltipColor()}`).style("border-top-color","transparent").style("border-right-color","transparent").style("border-bottom-color","transparent").style("border-left-color","transparent"),e){case"n":o=t.y+this.tooltipHeight()+2*this.padding(),i=t.x+this.tooltipWidth()/2-this.arrowWidth()/2+this.padding(),r="border-top-color",this._arrowElement.style("border-top-width",`${this.arrowHeight()}px`).style("border-bottom-width","0px").style("border-left-width",this.arrowWidth()/2+"px").style("border-right-width",this.arrowWidth()/2+"px");break;case"s":o=t.y-this.arrowHeight(),i=t.x+this.padding()+this.tooltipWidth()/2-this.arrowWidth()/2,r="border-bottom-color",this._arrowElement.style("border-top-width","0px").style("border-bottom-width",`${this.arrowHeight()}px`).style("border-left-width",this.arrowWidth()/2+"px").style("border-right-width",this.arrowWidth()/2+"px");break;case"e":o=t.y+this.tooltipHeight()/2+this.padding()-this.arrowWidth()/2,i=t.x-this.arrowHeight(),r="border-right-color",this._arrowElement.style("border-top-width",this.arrowWidth()/2+"px").style("border-bottom-width",this.arrowWidth()/2+"px").style("border-left-width","0px").style("border-right-width",`${this.arrowHeight()}px`);break;case"w":o=t.y+this.tooltipHeight()/2-this.arrowWidth()/2+this.padding(),i=t.x+this.tooltipWidth()+2*this.padding(),r="border-left-color",this._arrowElement.style("border-top-width",this.arrowWidth()/2+"px").style("border-bottom-width",this.arrowWidth()/2+"px").style("border-left-width",`${this.arrowHeight()}px`).style("border-right-width","0px")}return void 0!==o&&void 0!==i?this._arrowElement.style("top",o+"px").style("left",i+"px").style(r,this.tooltipColor()).style("opacity",1):this._arrowElement.style("opacity",0),t}getReferenceNode(){return this._triggerElement?this._triggerElement.node():this.element().node().parentNode.parentNode}_cursorLoc;calcReferenceBBox(){const t=this.getReferenceNode();let{top:e,left:o,width:i,height:r}=t.getBoundingClientRect();const s=this.tooltipWidth(),l=this.tooltipHeight(),n=s/2,h=l/2,a=this.arrowHeight(),p=this.padding(),d=2*p;this.followCursor()&&this._cursorLoc&&(o=this._cursorLoc[0],e=this._cursorLoc[1],i=1,r=1);return{n:{x:o+i/2-n-p,y:e-l-a-d},e:{x:o+i+a,y:e+r/2-h-p},s:{x:o+i/2-n-p,y:e+r+a},w:{x:o-s-a-d,y:e+r/2-h-p},nw:{x:o-s-d,y:e-l-d},ne:{x:o+i,y:e-l-d},se:{x:o+i,y:e+r},sw:{x:o-s-d,y:e+r}}}_closing=!1;mouseout(){this._closing=!0,this._tooltipElement.on("mouseover",()=>{this._closing=!1}),this._tooltipElement.on("mouseout",()=>{this.mouseout()}),setTimeout(()=>{this._closing&&this.visible(!1)},this.closeDelay())}visible(t){return arguments.length?(this._arrowElement&&(this._arrowElement.style("visibility",t?"visible":"hidden"),this._tooltipElement.style("visibility",t?"visible":"hidden")),super.visible(t),this):super.visible()}exit(t,e){this._arrowElement&&(this._arrowElement.remove(),this._tooltipElement.remove()),super.exit(t,e)}};e(d,"HTMLTooltip");let c=d;c.prototype._class+=" html_HTMLTooltip",c.prototype.publish("fitContent",!1,"boolean","If true, tooltip will grow to fit its html content"),c.prototype.publish("followCursor",!1,"boolean","If true, tooltip will display relative to cursor location"),c.prototype.publish("closeDelay",400,"number","Number of milliseconds to wait before closing tooltip (cancelled on tooltip mouseover event)"),c.prototype.publish("direction","n","set","Direction in which to display the tooltip",["n","s","e","w","ne","nw","se","sw"]),c.prototype.publish("padding",8,"number","Padding (pixels)"),c.prototype.publish("arrowWidth",16,"number","Width (or height depending on direction) of the tooltip arrow (pixels)"),c.prototype.publish("arrowHeight",8,"number","Height (or width depending on direction) of the tooltip arrow (pixels)"),c.prototype.publish("fontColor","#FFF","html-color","The default font color for text in the tooltip"),c.prototype.publish("tooltipColor","#000000EE","html-color","Background color of the tooltip"),c.prototype.publish("tooltipWidth",200,"number","Width of the tooltip (not including arrow) (pixels)"),c.prototype.publish("tooltipHeight",200,"number","Height of the tooltip (not including arrow) (pixels)"),c.prototype.publish("enablePointerEvents",!1,"boolean","If true, the 'pointer-events: all' style will be used");const u=class _SimpleTable extends i{_table;_tbody;_thead;_theadRow;constructor(){super()}transformData(){return this.data()}enter(t,e){super.enter(t,e),this._table=e.append("table"),this._thead=this._table.append("thead"),this._theadRow=this._thead.append("tr"),this._tbody=this._table.append("tbody")}update(t,e){super.update(t,e),this._table.style("width",this.autoWidth()?"auto":"100%");const o=this._theadRow.selectAll("th").data(this.columns());o.enter().append("th").attr("class",(t,e)=>`th-${e}`).merge(o).text(t=>t.toString()),o.exit().remove();const i=this._tbody.selectAll("tr").data(this.transformData());i.enter().append("tr").merge(i).each(function(t){const e=r(this).selectAll("td").data(t);e.enter().append("td").attr("class",(t,e)=>`col-${e}`).merge(e).text(t=>t.toString()),e.exit().remove()}),i.exit().remove()}};e(u,"SimpleTable");let g=u;g.prototype._class+=" html_SimpleTable",g.prototype.publish("autoWidth",!1,"boolean","If true, table width will be set to 'auto'. If false, the width is set to '100%'");const y=class _StyledTable extends g{constructor(){super()}applyStyleObject(t,e){Object.keys(e).forEach(o=>{t.style(o,e[o])})}update(t,e){super.update(t,e),e.selectAll("tr,th,td").attr("style","").style("font-family",this.fontFamily()).style("color",this.fontColor()),this.theadColumnStyles().forEach((t,o)=>{this.applyStyleObject(e.select(`.th-${o}`),t)}),this.tbodyColumnStyles().forEach((t,o)=>{this.applyStyleObject(e.selectAll(`.col-${o}`),t)});const o=Object.keys(this.evenRowStyles()).length>0,i=Object.keys(this.lastRowStyles()).length>0,r=e.selectAll("tbody > tr");if(o){const t=r.select(function(t,e){return e%2?this:null});this.applyStyleObject(t,this.evenRowStyles())}if(i){const t=r.select(function(t,e,o){return e===o.length-1?this:null});this.applyStyleObject(t,this.lastRowStyles())}}};e(y,"StyledTable");let b=y;b.prototype._class+=" html_StyledTable",b.prototype.publish("fontFamily","Verdana","string","Base font-family used within the table"),b.prototype.publish("fontColor","#333","string","Base font color used within the table"),b.prototype.publish("theadColumnStyles",[],"array",'Array of objects containing styles for the thead columns (ex: [{"color":"red"},{"color":"blue"}])'),b.prototype.publish("tbodyColumnStyles",[],"array",'Array of objects containing styles for the tbody columns (ex: [{"color":"red"},{"color":"blue"}])'),b.prototype.publish("lastRowStyles",{},"object",'Object containing styles for the last row (ex: {"color":"red"})'),b.prototype.publish("evenRowStyles",{},"object",'Object containing styles for even rows (ex: {"background-color":"#AAA"})');const m=class _BreakdownTable extends b{_tooltip;constructor(){super()}transformData(){const t=this.useCalculatedRowCount()?this.calculateRowCount():this.rowCount();return this.breakdownData(t)}breakdownData(t){const e=this.data().length,o=this.data().reduce((t,e)=>t+e[1],0),i=[];let r=0;this.data().sort((t,e)=>t[1]>e[1]?-1:1);const s=e-t>0;if(this.data().filter((e,o)=>!s||o<t-1).forEach(t=>{const e=Math.round(t[1]/o*100);r+=e,i.push([t[0],e+"%"])}),s){const o=`${this.otherLabel()} (${e-t+1})`,s="~"+(100-r)+"%";i.push([o,s])}return i}calculateRowCount(){const t=this.columns().length>0?this.thFontSize()+5:0,e=this.fontSize()+5,o=this.height()-t;return Math.floor(o/e)}enter(t,e){super.enter(t,e),this._tooltip=(new c).target(t),this._tooltip.tooltipHTML(t=>{const e=this.useCalculatedRowCount()?this.calculateRowCount():this.rowCount(),o=Math.max(...t.map(t=>this.textSize(t[0],this.fontFamily(),this.fontSize()).height))??this.fontSize(),i=Math.max(...t.map(t=>this.textSize(t[0],this.fontFamily(),this.fontSize()).width)),r=2*(i+30)+2*this._tooltip.padding(),s=o*Math.ceil((t.length-e)/2)+2*this._tooltip.padding();this._tooltip.tooltipWidth(r),this._tooltip.tooltipHeight(s);const l=this.breakdownData(this.data().length).slice(e-1);return`<div style="\n width: 100%;\n height: 100%;\n font-size: ${this.fontSize()}px;\n ">${l.map(t=>`<div style="\n float:left;\n width:${Math.floor(49.5)}%;\n ">${t[0]}: ${t[1]}</div>`).join("")}</div>`})}update(t,e){this.theadColumnStyles_default([{color:this.thFirstColor(),"font-size":this.thFontSize()+"px","font-weight":this.thFontWeight(),"text-align":this.labelAlignment(),width:"auto",padding:"0px"},{width:"1%","font-size":this.thFontSize()+"px","font-weight":this.thFontWeight(),"text-align":this.percentageAlignment(),padding:"0px"}]),this.tbodyColumnStyles_default([{color:this.topLabelColor(),"font-size":this.fontSize()+"px","font-weight":"normal","text-align":this.labelAlignment(),width:"auto",padding:"0px"},{color:this.topPercentageColor(),"font-size":this.fontSize()+"px","font-weight":"normal","text-align":this.percentageAlignment(),width:"1%",padding:"0px"}]),this.lastRowStyles_default([{color:this.otherLabelColor(),"font-size":this.fontSize()+"px","font-weight":this.otherLabelBold()?"bold":"normal","text-align":this.labelAlignment(),width:"auto",padding:"0px"},{color:this.otherLabelColor(),"font-size":this.fontSize()+"px","font-weight":this.otherPercentageBold()?"bold":"normal","text-align":this.percentageAlignment(),width:"1%",padding:"0px"}]),super.update(t,e);if((this.useCalculatedRowCount()?this.calculateRowCount():this.rowCount())<this.data().length){const t=e.select("tbody > tr:last-child"),o=this;t.on("mouseout.tooltip",e=>{o._tooltip._triggerElement=t,o._tooltip.visible(!1).render()}).on("mouseenter.tooltip",e=>{o._tooltip._triggerElement=t,o._tooltip.direction("n").data(o.data()).visible(!0).render()})}}};e(m,"BreakdownTable");let f=m;f.prototype._class+=" html_BreakdownTable",f.prototype.publish("useCalculatedRowCount",!0,"boolean","If true, rowCount will be calculated and its default will be overwritten"),f.prototype.publish("rowCount",5,"number","Number of total rows to display (including the 'other' row)",void 0,{disable:/* @__PURE__ */e(t=>t.useCalculatedRowCount(),"disable")}),f.prototype.publish("fontSize",14,"number","Font size (pixels)"),f.prototype.publish("labelAlignment","left","set","Alignment of the label column text",["left","center","right"]),f.prototype.publish("percentageAlignment","center","set","Alignment of the percentage column text",["left","center","right"]),f.prototype.publish("topLabelColor","#333","html-color","Color of displayed 'top' labels"),f.prototype.publish("topPercentageColor","#1A99D5","html-color","Color of displayed 'top' percentages"),f.prototype.publish("topPercentageBold",!0,"html-color","If true, the 'top' percentages will be bold"),f.prototype.publish("otherLabel","Other","string","Label text for the 'other' row"),f.prototype.publish("otherLabelColor","#AAA","html-color","Color of the 'other' label"),f.prototype.publish("otherLabelBold",!1,"html-color","If true, the 'other' label will be bold"),f.prototype.publish("otherPercentageColor","#AAA","html-color","Color of the 'other' percentage"),f.prototype.publish("otherPercentageBold",!1,"html-color","If true, the 'other' percentage will be bold"),f.prototype.publish("thFontWeight","bold","string","Font weight for th elements"),f.prototype.publish("thFontSize",26,"number","Font size for th elements"),f.prototype.publish("thFirstColor","#333","html-color","Text color of the first th element"),f.prototype.publish("thLastColor","#333","html-color","Text color of the last th element");const _=class _JSXWidget extends i{rootNode;jsxRender(t,e){this.rootNode=n.render(t,e,this.rootNode)}};e(_,"JSXWidget"),o(_,"Component",n.Component),o(_,"createElement",n.createElement);let w=_;w.prototype._class+=" html_JSXWidget";const x=class _VNode{_attrs;_children;constructor(t,e){this._attrs=t,this._children=e}type(){return"div"}attrs(){return this._attrs}attr(t){return this._attrs[t]}children(){return this._children}update(t){for(const e in this._attrs)t.attr(e,this._attrs[e])}render(t){const e=t.selectAll(`${t.node().tagName} > *`).data([this]);return e.exit().remove(),e.enter().append(this.type()).attr("reactd3",0).merge(e).each(function(t){const e=r(this);t.update(e),t.renderChildren(e)})}renderChildren(t){const e=t.selectAll(`${t.node().tagName} > *`).data(this._children);return e.exit().remove(),e.enter().append(t=>document.createElement(t.type())).attr("reactd3",(t,e)=>e).merge(e).each(function(t){const e=r(this);t.update(e),t.renderChildren(e)})}};e(x,"VNode");let C=x;const v=class _ConstVNode extends C{_type;constructor(t,e,o){super(e,o),this._type=t}type(){return this._type}};e(v,"ConstVNode");let S=v;const E=class _TextVNode extends C{_text;constructor(t){super({},[]),this._text=t}type(){return"span"}update(t){super.update(t),t.text(this._text)}};e(E,"TextVNode");let T=E;function W(t){return"function"==typeof t}function R(t){return t.prototype&&t.prototype instanceof C}e(W,"isReactFn"),e(R,"isIVNode");const A=class _ReactD3{static createElement(t,e,...o){return R(t)?new t(e):W(t)?t(e):new S(t,e,o.map(t=>"string"==typeof t?new T(t):t))}static render(t,e){t.render(e)}};e(A,"ReactD3");let B=A;var F;F={__e:/* @__PURE__ */e(function(t,e,o,i){for(var r,s,l;e=e.__;)if((r=e.__c)&&!r.__)try{if((s=r.constructor)&&null!=s.getDerivedStateFromError&&(r.setState(s.getDerivedStateFromError(t)),l=r.__d),null!=r.componentDidCatch&&(r.componentDidCatch(t,i||{}),l=r.__d),l)return r.__E=r}catch(n){t=n}throw t},"__e")},"function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout;var k=0;function H(t,e,o,i,r,s){e||(e={});var l,n,h=e;if("ref"in h)for(n in h={},e)"ref"==n?l=e[n]:h[n]=e[n];var a={type:t,props:h,key:o,ref:l,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:--k,__i:-1,__u:0,__source:r,__self:s};return F.vnode&&F.vnode(a),a}e(H,"u");const z=class _VizComponent extends w.Component{widget;refreshProps(){for(const t in this.props)this.widget[t]&&"function"==typeof this.widget[t]&&this.widget[t](this.props[t])}componentDidMount(){this.widget=(new this.props.type).target(this.base),this.refreshProps(),this.widget.render()}componentWillUnmount(){this.widget.target(null).render()}render(){/* @__PURE__ */
|
|
2
|
+
return H("div",{style:this.props.style})}componentDidUpdate(){this.refreshProps(),this.widget.render()}};e(z,"VizComponent");let N=z;const L=class _VizInstance extends w.Component{widget;refreshProps(){for(const t in this.props)this.widget[t]&&"function"==typeof this.widget[t]&&this.widget[t](this.props[t])}componentDidMount(){this.widget=this.props.instance.target(this.base),this.refreshProps(),this.widget.render()}componentWillUnmount(){this.widget.target(null).render()}render(){/* @__PURE__ */
|
|
3
|
+
return H("div",{style:this.props.style})}componentDidUpdate(){this.refreshProps(),this.widget.render()}};e(L,"VizInstance");let D=L;const M=class _StatsTable extends b{transformData(){const t=[["Total",0,0]],e=this.data();return e.forEach(e=>{t[0][1]+=e[1],t[0][2]+=e[2]}),e.concat(t).map(t=>[t[0],this.secondColumnFormat_exists()?s(this.secondColumnFormat())(t[1]):t[1],this.thirdColumnFormat_exists()?s(this.thirdColumnFormat())(t[2]):t[2]])}update(t,e){this.tbodyColumnStyles_default([{"font-weight":"bold",width:this.firstColumnWidth(),"text-align":"left"},{width:this.secondColumnWidth(),"text-align":"right"},{width:this.thirdColumnWidth(),"text-align":"right"}]),this.evenRowStyles_default([{"font-weight":"bold",width:this.firstColumnWidth(),"text-align":"left","font-color":this.evenRowFontColor(),"background-color":this.evenRowBackgroundColor()},{width:this.secondColumnWidth(),"text-align":"right","font-color":this.evenRowFontColor(),"background-color":this.evenRowBackgroundColor()},{width:this.thirdColumnWidth(),"text-align":"right","font-color":this.evenRowFontColor(),"background-color":this.evenRowBackgroundColor()}]),this.lastRowStyles_default({"font-weight":"bold"}),super.update(t,e)}};e(M,"StatsTable");let P=M;P.prototype._class+=" html_StatsTable",P.prototype.publish("labelColor","#333","html-color","Color of the text in the first column"),P.prototype.publish("primaryValueColor","#333","html-color","Color of the text in the second column"),P.prototype.publish("secondaryValueColor","#333","html-color","Color of the text in the third column"),P.prototype.publish("evenRowBackgroundColor","#333","html-color","Background color of the even rows"),P.prototype.publish("evenRowFontColor","#333","html-color","Font color of the even rows"),P.prototype.publish("firstColumnWidth","auto","string","CSS style applied as the 'width' for the first column (ex: 40px)"),P.prototype.publish("secondColumnWidth","1%","string","CSS style applied as the 'width' for the second column (ex: 40px)"),P.prototype.publish("thirdColumnWidth","1%","string","CSS style applied as the 'width' for the third column (ex: 40px)"),P.prototype.publish("secondColumnFormat","$,.0f","string","d3-format specifier applied to the second column's values",void 0,{optional:!0}),P.prototype.publish("thirdColumnFormat",null,"string","d3-format specifier applied to the third column's values",void 0,{optional:!0});const j=class _Item extends i{_owner;constructor(t){super(),this._owner=t,this._tag="a"}};e(j,"Item");let $=j;$.prototype._class+=" html_Item";const I=class _Button extends ${_icon;constructor(t,e){super(t),this._icon=e}icon(){return this._icon}enter(t,e){super.enter(t,e),e.attr("href","#").on("click",(t,e,o)=>this._owner.titleBarClick(this,t,e,o)).append("i").attr("class",`fa ${this._icon} fa-lg fa-fw`)}};e(I,"Button");let V=I;V.prototype._class+=" html_Button";const O=class _ToggleButton extends V{enter(t,e){e.on("click.sel",(t,e,o)=>{this.selected(!this.selected()),this.render()}),super.enter(t,e)}update(t,e){super.update(t,e),this._element.classed("selected",this.selected())}};e(O,"ToggleButton");let U=O;U.prototype._class+=" html_ToggleButton",U.prototype.publish("selected",!1,"boolean");const J=class _Spacer extends ${enter(t,e){super.enter(t,e),e.attr("class","spacer").attr("href","#").append("i")}};e(J,"Spacer");let X=J;X.prototype._class+=" html_Spacer";const q=class _TitleBar extends w{_divMain;_divIconBar;_divTitle;constructor(){super()}enter(t,e){super.enter(t,e),this._divMain=e.append("div").attr("class","main"),this._divIconBar=this._divMain.append("div").attr("class","icon-bar"),this._divTitle=this._divMain.append("div").attr("class","title")}update(t,e){super.update(t,e),this._divTitle.text(this.title());const o=this._divIconBar.selectAll(".icon-bar-item").data(this.buttons());o.enter().append("div").attr("class","icon-bar-item").each(function(t){t.target(this)}).merge(o).each(function(t){t.render()}),o.exit().each(function(t){t.target(null)}).remove(),o.order()}};e(q,"TitleBar");let G=q;G.prototype._class+=" html_TitleBar",G.prototype.publish("title","","string"),G.prototype.publish("buttons",[],"widgetArray");export{p as BUILD_VERSION,f as BreakdownTable,V as Button,c as HTMLTooltip,$ as Item,w as JSXWidget,h as PKG_NAME,a as PKG_VERSION,B as ReactD3,g as SimpleTable,X as Spacer,P as StatsTable,b as StyledTable,G as TitleBar,U as ToggleButton,C as VNode,N as VizComponent,D as VizInstance};
|
|
4
|
+
//# sourceMappingURL=index.js.map
|
|
5
|
+
!function(){"use strict";try{if("undefined"!=typeof document){var t=document.createElement("style");t.appendChild(document.createTextNode("#wrap{width:100%}#left,#right{padding:5px}#left{background-color:red;text-align:left;display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}#right{background-color:orange;float:right;text-align:right;white-space:nowrap}.html_TitleBar>.main{width:100%;display:block}.html_TitleBar .title{padding:4px;text-align:left;display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:20px;font-weight:700}.html_TitleBar .icon-bar{padding:4px;float:right;text-align:right;white-space:nowrap;line-height:28px}.html_TitleBar .icon-bar-item{display:inline}.html_TitleBar .icon-bar-item>div{display:inline}.html_TitleBar .icon-bar a{text-align:center;padding-top:4px;padding-bottom:4px;transition:all .3s ease;color:#a9a9a9}.html_TitleBar .icon-bar a:hover{background-color:#f5f5f5}.html_TitleBar .icon-bar a.selected{background-color:#efe5e5}.html_TitleBar .icon-bar a.spacer{text-align:center;padding-top:2px;padding-left:8px;padding-bottom:0;color:none}.html_TitleBar .icon-bar a.spacer:hover{background-color:transparent}.html_TitleBar .icon-bar .active{background-color:#4caf50}")),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}}();
|