@hpcc-js/html 3.2.9 → 3.2.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.js +420 -214
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.umd.cjs +2 -9
  4. package/dist/index.umd.cjs.map +1 -1
  5. package/package.json +6 -6
package/dist/index.js CHANGED
@@ -1,60 +1,91 @@
1
1
  var __defProp = Object.defineProperty;
2
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value);
2
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
4
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
5
  import { HTMLWidget, select, format } from "@hpcc-js/common";
5
6
  import { scopedLogger } from "@hpcc-js/util";
6
7
  import { React } from "@hpcc-js/react";
7
- const PKG_NAME = "@hpcc-js/html", PKG_VERSION = "3.1.1", BUILD_VERSION = "3.2.1";
8
- class HTMLTooltip extends HTMLWidget {
8
+ const PKG_NAME = "@hpcc-js/html";
9
+ const PKG_VERSION = "3.1.1";
10
+ const BUILD_VERSION = "3.2.1";
11
+ const _HTMLTooltip = class _HTMLTooltip extends HTMLWidget {
12
+ _triggerElement;
13
+ _contentNode;
14
+ _prevContentNode;
15
+ _tooltipElement;
16
+ _arrowElement;
17
+ _tooltipHTMLCallback = /* @__PURE__ */ __name((data) => "<b>_tooltipHTMLCallback is undefined</b>", "_tooltipHTMLCallback");
18
+ _logger = scopedLogger("html/HTMLTooltip");
9
19
  constructor() {
10
20
  super();
11
- __publicField(this, "_triggerElement");
12
- __publicField(this, "_contentNode");
13
- __publicField(this, "_prevContentNode");
14
- __publicField(this, "_tooltipElement");
15
- __publicField(this, "_arrowElement");
16
- __publicField(this, "_tooltipHTMLCallback", (data) => "<b>_tooltipHTMLCallback is undefined</b>");
17
- __publicField(this, "_logger", scopedLogger("html/HTMLTooltip"));
18
- __publicField(this, "_cursorLoc");
19
- __publicField(this, "_closing", !1);
20
- this.visible(!1);
21
+ this.visible(false);
21
22
  }
22
23
  tooltipHTML(_) {
23
- return this._tooltipHTMLCallback = _, this;
24
+ this._tooltipHTMLCallback = _;
25
+ return this;
24
26
  }
25
27
  tooltipContent(_) {
26
- return arguments.length ? (this._contentNode = _, this) : this._contentNode;
28
+ if (!arguments.length) return this._contentNode;
29
+ this._contentNode = _;
30
+ return this;
27
31
  }
28
32
  triggerElement(_) {
29
- return this._triggerElement = _, this;
33
+ this._triggerElement = _;
34
+ return this;
30
35
  }
31
36
  enter(domNode, element) {
32
37
  super.enter(domNode, element);
33
38
  const body = select("body");
34
- this._tooltipElement = body.append("div").attr("class", "tooltip-div").style("z-index", "2147483638").style("position", "fixed"), this._arrowElement = body.append("div").attr("class", "arrow-div").style("z-index", "2147483638").style("position", "fixed");
39
+ this._tooltipElement = body.append("div").attr("class", "tooltip-div").style("z-index", "2147483638").style("position", "fixed");
40
+ this._arrowElement = body.append("div").attr("class", "arrow-div").style("z-index", "2147483638").style("position", "fixed");
35
41
  }
36
42
  update(domNode, element) {
37
- if (super.update(domNode, element), this._contentNode !== this._prevContentNode) {
43
+ super.update(domNode, element);
44
+ if (this._contentNode !== this._prevContentNode) {
38
45
  const node = this._tooltipElement.node();
39
46
  [...node.querySelectorAll("*")].map((n) => n.__data__).filter((n) => n).forEach((w) => {
40
- typeof w.target == "function" && w.target(null), typeof w.exit == "function" && w.exit();
41
- }), node.innerHTML = "", node.appendChild(this._contentNode), this._prevContentNode = this._contentNode;
47
+ if (typeof w.target === "function") {
48
+ w.target(null);
49
+ }
50
+ if (typeof w.exit === "function") {
51
+ w.exit();
52
+ }
53
+ });
54
+ node.innerHTML = "";
55
+ node.appendChild(this._contentNode);
56
+ this._prevContentNode = this._contentNode;
57
+ }
58
+ if (this._contentNode) {
59
+ this.onShowContent(this._contentNode);
60
+ } else {
61
+ this._tooltipElement.html(() => {
62
+ return this._tooltipHTMLCallback(this.data());
63
+ });
42
64
  }
43
- if (this._contentNode ? this.onShowContent(this._contentNode) : this._tooltipElement.html(() => this._tooltipHTMLCallback(this.data())), this.fitContent()) {
65
+ if (this.fitContent()) {
44
66
  this._tooltipElement.style("width", "auto").style("height", "auto").style("padding", "0px").style("box-sizing", "content-box");
45
67
  const rect = this._tooltipElement.node().getBoundingClientRect();
46
- this.tooltipWidth_default(rect.width), this.tooltipHeight_default(rect.height);
68
+ this.tooltipWidth_default(rect.width);
69
+ this.tooltipHeight_default(rect.height);
47
70
  }
48
- 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();
71
+ this._closing = false;
72
+ 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");
73
+ this._arrowElement.style("opacity", 1).style("pointer-events", "none");
74
+ this.updateTooltipPosition();
49
75
  }
50
76
  onShowContent(node) {
51
77
  }
52
78
  updateTooltipPosition() {
53
- const bbox = this.calcReferenceBBox(), direction = this.calcTooltipDirection(bbox), box = bbox[direction];
54
- return this._tooltipElement.style("top", box.y + "px").style("left", box.x + "px"), this.setArrowPosition(box, direction), box;
79
+ const bbox = this.calcReferenceBBox();
80
+ const direction = this.calcTooltipDirection(bbox);
81
+ const box = bbox[direction];
82
+ this._tooltipElement.style("top", box.y + "px").style("left", box.x + "px");
83
+ this.setArrowPosition(box, direction);
84
+ return box;
55
85
  }
56
86
  calcTooltipDirection(bbox) {
57
- const directions = Object.keys(bbox), defaultDirection = this.direction();
87
+ const directions = Object.keys(bbox);
88
+ const defaultDirection = this.direction();
58
89
  directions.sort((a, b) => a === defaultDirection ? -1 : 1);
59
90
  const windowRect = {
60
91
  top: 0,
@@ -69,45 +100,85 @@ class HTMLTooltip extends HTMLWidget {
69
100
  width: this.tooltipWidth(),
70
101
  height: this.tooltipHeight()
71
102
  };
72
- if (this.rectFits(tooltipRect, windowRect))
103
+ if (this.rectFits(tooltipRect, windowRect)) {
73
104
  return directions[i];
105
+ }
74
106
  }
75
- return this._logger.warning(`Tooltip doesn't fit in the window for any of the directions. Defaulting to '${defaultDirection}'`), this._logger.debug(windowRect), this._logger.debug({
107
+ this._logger.warning(`Tooltip doesn't fit in the window for any of the directions. Defaulting to '${defaultDirection}'`);
108
+ this._logger.debug(windowRect);
109
+ this._logger.debug({
76
110
  top: bbox[defaultDirection].y,
77
111
  left: bbox[defaultDirection].x,
78
112
  width: this.tooltipWidth(),
79
113
  height: this.tooltipHeight()
80
- }), defaultDirection;
114
+ });
115
+ return defaultDirection;
81
116
  }
82
117
  rectFits(innerRect, outerRect) {
83
118
  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;
84
119
  }
85
120
  setArrowPosition(point, direction) {
86
- let top, left, visibleBorderStyle = "border-top-color";
87
- 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"), direction) {
121
+ let top;
122
+ let left;
123
+ let visibleBorderStyle = "border-top-color";
124
+ 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");
125
+ switch (direction) {
88
126
  case "n":
89
- top = point.y + this.tooltipHeight() + this.padding() * 2, left = point.x + this.tooltipWidth() / 2 - this.arrowWidth() / 2 + this.padding(), visibleBorderStyle = "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`);
127
+ top = point.y + this.tooltipHeight() + this.padding() * 2;
128
+ left = point.x + this.tooltipWidth() / 2 - this.arrowWidth() / 2 + this.padding();
129
+ visibleBorderStyle = "border-top-color";
130
+ 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`);
90
131
  break;
91
132
  case "s":
92
- top = point.y - this.arrowHeight(), left = point.x + this.padding() + this.tooltipWidth() / 2 - this.arrowWidth() / 2, visibleBorderStyle = "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`);
133
+ top = point.y - this.arrowHeight();
134
+ left = point.x + this.padding() + this.tooltipWidth() / 2 - this.arrowWidth() / 2;
135
+ visibleBorderStyle = "border-bottom-color";
136
+ 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`);
93
137
  break;
94
138
  case "e":
95
- top = point.y + this.tooltipHeight() / 2 + this.padding() - this.arrowWidth() / 2, left = point.x - this.arrowHeight(), visibleBorderStyle = "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`);
139
+ top = point.y + this.tooltipHeight() / 2 + this.padding() - this.arrowWidth() / 2;
140
+ left = point.x - this.arrowHeight();
141
+ visibleBorderStyle = "border-right-color";
142
+ 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`);
96
143
  break;
97
144
  case "w":
98
- top = point.y + this.tooltipHeight() / 2 - this.arrowWidth() / 2 + this.padding(), left = point.x + this.tooltipWidth() + this.padding() * 2, visibleBorderStyle = "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");
145
+ top = point.y + this.tooltipHeight() / 2 - this.arrowWidth() / 2 + this.padding();
146
+ left = point.x + this.tooltipWidth() + this.padding() * 2;
147
+ visibleBorderStyle = "border-left-color";
148
+ 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");
99
149
  break;
100
150
  }
101
- return typeof top < "u" && typeof left < "u" ? this._arrowElement.style("top", top + "px").style("left", left + "px").style(visibleBorderStyle, this.tooltipColor()).style("opacity", 1) : this._arrowElement.style("opacity", 0), point;
151
+ if (typeof top !== "undefined" && typeof left !== "undefined") {
152
+ this._arrowElement.style("top", top + "px").style("left", left + "px").style(visibleBorderStyle, this.tooltipColor()).style("opacity", 1);
153
+ } else {
154
+ this._arrowElement.style("opacity", 0);
155
+ }
156
+ return point;
102
157
  }
103
158
  getReferenceNode() {
104
- return this._triggerElement ? this._triggerElement.node() : this.element().node().parentNode.parentNode;
159
+ if (!this._triggerElement) {
160
+ return this.element().node().parentNode.parentNode;
161
+ }
162
+ return this._triggerElement.node();
105
163
  }
164
+ _cursorLoc;
106
165
  calcReferenceBBox() {
107
166
  const node = this.getReferenceNode();
108
167
  let { top, left, width, height } = node.getBoundingClientRect();
109
- const wholeW = this.tooltipWidth(), wholeH = this.tooltipHeight(), halfW = wholeW / 2, halfH = wholeH / 2, arrowH = this.arrowHeight(), p = this.padding(), p2 = p * 2;
110
- return this.followCursor() && this._cursorLoc && (left = this._cursorLoc[0], top = this._cursorLoc[1], width = 1, height = 1), {
168
+ const wholeW = this.tooltipWidth();
169
+ const wholeH = this.tooltipHeight();
170
+ const halfW = wholeW / 2;
171
+ const halfH = wholeH / 2;
172
+ const arrowH = this.arrowHeight();
173
+ const p = this.padding();
174
+ const p2 = p * 2;
175
+ if (this.followCursor() && this._cursorLoc) {
176
+ left = this._cursorLoc[0];
177
+ top = this._cursorLoc[1];
178
+ width = 1;
179
+ height = 1;
180
+ }
181
+ const bbox = {
111
182
  n: {
112
183
  x: left + width / 2 - halfW - p,
113
184
  y: top - wholeH - arrowH - p2
@@ -141,26 +212,45 @@ class HTMLTooltip extends HTMLWidget {
141
212
  y: top + height
142
213
  }
143
214
  };
215
+ return bbox;
144
216
  }
217
+ _closing = false;
145
218
  mouseout() {
146
- this._closing = !0, this._tooltipElement.on("mouseover", () => {
147
- this._closing = !1;
148
- }), this._tooltipElement.on("mouseout", () => {
219
+ this._closing = true;
220
+ this._tooltipElement.on("mouseover", () => {
221
+ this._closing = false;
222
+ });
223
+ this._tooltipElement.on("mouseout", () => {
149
224
  this.mouseout();
150
- }), setTimeout(() => {
151
- this._closing && this.visible(!1);
225
+ });
226
+ setTimeout(() => {
227
+ if (this._closing) {
228
+ this.visible(false);
229
+ }
152
230
  }, this.closeDelay());
153
231
  }
154
232
  visible(_) {
155
- return arguments.length ? (this._arrowElement && (this._arrowElement.style("visibility", _ ? "visible" : "hidden"), this._tooltipElement.style("visibility", _ ? "visible" : "hidden")), super.visible(_), this) : super.visible();
233
+ if (!arguments.length) return super.visible();
234
+ if (this._arrowElement) {
235
+ this._arrowElement.style("visibility", _ ? "visible" : "hidden");
236
+ this._tooltipElement.style("visibility", _ ? "visible" : "hidden");
237
+ }
238
+ super.visible(_);
239
+ return this;
156
240
  }
157
241
  exit(domNode, element) {
158
- this._arrowElement && (this._arrowElement.remove(), this._tooltipElement.remove()), super.exit(domNode, element);
242
+ if (this._arrowElement) {
243
+ this._arrowElement.remove();
244
+ this._tooltipElement.remove();
245
+ }
246
+ super.exit(domNode, element);
159
247
  }
160
- }
248
+ };
249
+ __name(_HTMLTooltip, "HTMLTooltip");
250
+ let HTMLTooltip = _HTMLTooltip;
161
251
  HTMLTooltip.prototype._class += " html_HTMLTooltip";
162
- HTMLTooltip.prototype.publish("fitContent", !1, "boolean", "If true, tooltip will grow to fit its html content");
163
- HTMLTooltip.prototype.publish("followCursor", !1, "boolean", "If true, tooltip will display relative to cursor location");
252
+ HTMLTooltip.prototype.publish("fitContent", false, "boolean", "If true, tooltip will grow to fit its html content");
253
+ HTMLTooltip.prototype.publish("followCursor", false, "boolean", "If true, tooltip will display relative to cursor location");
164
254
  HTMLTooltip.prototype.publish("closeDelay", 400, "number", "Number of milliseconds to wait before closing tooltip (cancelled on tooltip mouseover event)");
165
255
  HTMLTooltip.prototype.publish("direction", "n", "set", "Direction in which to display the tooltip", ["n", "s", "e", "w", "ne", "nw", "se", "sw"]);
166
256
  HTMLTooltip.prototype.publish("padding", 8, "number", "Padding (pixels)");
@@ -170,35 +260,46 @@ HTMLTooltip.prototype.publish("fontColor", "#FFF", "html-color", "The default fo
170
260
  HTMLTooltip.prototype.publish("tooltipColor", "#000000EE", "html-color", "Background color of the tooltip");
171
261
  HTMLTooltip.prototype.publish("tooltipWidth", 200, "number", "Width of the tooltip (not including arrow) (pixels)");
172
262
  HTMLTooltip.prototype.publish("tooltipHeight", 200, "number", "Height of the tooltip (not including arrow) (pixels)");
173
- HTMLTooltip.prototype.publish("enablePointerEvents", !1, "boolean", "If true, the 'pointer-events: all' style will be used");
174
- class SimpleTable extends HTMLWidget {
263
+ HTMLTooltip.prototype.publish("enablePointerEvents", false, "boolean", "If true, the 'pointer-events: all' style will be used");
264
+ const _SimpleTable = class _SimpleTable extends HTMLWidget {
265
+ _table;
266
+ _tbody;
267
+ _thead;
268
+ _theadRow;
175
269
  constructor() {
176
270
  super();
177
- __publicField(this, "_table");
178
- __publicField(this, "_tbody");
179
- __publicField(this, "_thead");
180
- __publicField(this, "_theadRow");
181
271
  }
182
272
  transformData() {
183
273
  return this.data();
184
274
  }
185
275
  enter(domNode, element) {
186
- super.enter(domNode, element), this._table = element.append("table"), this._thead = this._table.append("thead"), this._theadRow = this._thead.append("tr"), this._tbody = this._table.append("tbody");
276
+ super.enter(domNode, element);
277
+ this._table = element.append("table");
278
+ this._thead = this._table.append("thead");
279
+ this._theadRow = this._thead.append("tr");
280
+ this._tbody = this._table.append("tbody");
187
281
  }
188
282
  update(domNode, element) {
189
- super.update(domNode, element), this._table.style("width", this.autoWidth() ? "auto" : "100%");
283
+ super.update(domNode, element);
284
+ this._table.style("width", this.autoWidth() ? "auto" : "100%");
190
285
  const theadTrSelection = this._theadRow.selectAll("th").data(this.columns());
191
- theadTrSelection.enter().append("th").attr("class", (n, i) => `th-${i}`).merge(theadTrSelection).text((_d) => _d.toString()), theadTrSelection.exit().remove();
286
+ theadTrSelection.enter().append("th").attr("class", (n, i) => `th-${i}`).merge(theadTrSelection).text((_d) => _d.toString());
287
+ theadTrSelection.exit().remove();
192
288
  const trSelection = this._tbody.selectAll("tr").data(this.transformData());
193
289
  trSelection.enter().append("tr").merge(trSelection).each(function(d) {
194
- const tdSelection = select(this).selectAll("td").data(d);
195
- tdSelection.enter().append("td").attr("class", (n, i) => `col-${i}`).merge(tdSelection).text((_d) => _d.toString()), tdSelection.exit().remove();
196
- }), trSelection.exit().remove();
290
+ const tr = select(this);
291
+ const tdSelection = tr.selectAll("td").data(d);
292
+ tdSelection.enter().append("td").attr("class", (n, i) => `col-${i}`).merge(tdSelection).text((_d) => _d.toString());
293
+ tdSelection.exit().remove();
294
+ });
295
+ trSelection.exit().remove();
197
296
  }
198
- }
297
+ };
298
+ __name(_SimpleTable, "SimpleTable");
299
+ let SimpleTable = _SimpleTable;
199
300
  SimpleTable.prototype._class += " html_SimpleTable";
200
- SimpleTable.prototype.publish("autoWidth", !1, "boolean", "If true, table width will be set to 'auto'. If false, the width is set to '100%'");
201
- class StyledTable extends SimpleTable {
301
+ SimpleTable.prototype.publish("autoWidth", false, "boolean", "If true, table width will be set to 'auto'. If false, the width is set to '100%'");
302
+ const _StyledTable = class _StyledTable extends SimpleTable {
202
303
  constructor() {
203
304
  super();
204
305
  }
@@ -208,12 +309,17 @@ class StyledTable extends SimpleTable {
208
309
  });
209
310
  }
210
311
  update(domNode, element) {
211
- super.update(domNode, element), element.selectAll("tr,th,td").attr("style", "").style("font-family", this.fontFamily()).style("color", this.fontColor()), this.theadColumnStyles().forEach((styleObj, i) => {
312
+ super.update(domNode, element);
313
+ element.selectAll("tr,th,td").attr("style", "").style("font-family", this.fontFamily()).style("color", this.fontColor());
314
+ this.theadColumnStyles().forEach((styleObj, i) => {
212
315
  this.applyStyleObject(element.select(`.th-${i}`), styleObj);
213
- }), this.tbodyColumnStyles().forEach((styleObj, i) => {
316
+ });
317
+ this.tbodyColumnStyles().forEach((styleObj, i) => {
214
318
  this.applyStyleObject(element.selectAll(`.col-${i}`), styleObj);
215
319
  });
216
- const evenRowStylesExist = Object.keys(this.evenRowStyles()).length > 0, lastRowStylesExist = Object.keys(this.lastRowStyles()).length > 0, tbodyRows = element.selectAll("tbody > tr");
320
+ const evenRowStylesExist = Object.keys(this.evenRowStyles()).length > 0;
321
+ const lastRowStylesExist = Object.keys(this.lastRowStyles()).length > 0;
322
+ const tbodyRows = element.selectAll("tbody > tr");
217
323
  if (evenRowStylesExist) {
218
324
  const tbodyEvenRows = tbodyRows.select(function(d, i) {
219
325
  return i % 2 ? this : null;
@@ -227,7 +333,9 @@ class StyledTable extends SimpleTable {
227
333
  this.applyStyleObject(tbodyLastRow, this.lastRowStyles());
228
334
  }
229
335
  }
230
- }
336
+ };
337
+ __name(_StyledTable, "StyledTable");
338
+ let StyledTable = _StyledTable;
231
339
  StyledTable.prototype._class += " html_StyledTable";
232
340
  StyledTable.prototype.publish("fontFamily", "Verdana", "string", "Base font-family used within the table");
233
341
  StyledTable.prototype.publish("fontColor", "#333", "string", "Base font color used within the table");
@@ -235,39 +343,57 @@ StyledTable.prototype.publish("theadColumnStyles", [], "array", 'Array of object
235
343
  StyledTable.prototype.publish("tbodyColumnStyles", [], "array", 'Array of objects containing styles for the tbody columns (ex: [{"color":"red"},{"color":"blue"}])');
236
344
  StyledTable.prototype.publish("lastRowStyles", {}, "object", 'Object containing styles for the last row (ex: {"color":"red"})');
237
345
  StyledTable.prototype.publish("evenRowStyles", {}, "object", 'Object containing styles for even rows (ex: {"background-color":"#AAA"})');
238
- class BreakdownTable extends StyledTable {
346
+ const _BreakdownTable = class _BreakdownTable extends StyledTable {
347
+ // protected _table;
348
+ // protected _tbody;
349
+ _tooltip;
239
350
  constructor() {
240
351
  super();
241
- // protected _table;
242
- // protected _tbody;
243
- __publicField(this, "_tooltip");
244
352
  }
245
353
  transformData() {
246
354
  const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount();
247
355
  return this.breakdownData(rowCount);
248
356
  }
249
357
  breakdownData(limit) {
250
- const len = this.data().length, sum = this.data().reduce((acc, row) => acc + row[1], 0), data = [];
358
+ const len = this.data().length;
359
+ const sum = this.data().reduce((acc, row) => acc + row[1], 0);
360
+ const data = [];
251
361
  let percSum = 0;
252
362
  this.data().sort((a, b) => a[1] > b[1] ? -1 : 1);
253
- const showOther = len - limit > 0;
254
- if (this.data().filter((_, i) => showOther ? i < limit - 1 : !0).forEach((row) => {
363
+ const hiddenRowCount = len - limit;
364
+ const showOther = hiddenRowCount > 0;
365
+ this.data().filter((_, i) => showOther ? i < limit - 1 : true).forEach((row) => {
255
366
  const perc = Math.round(row[1] / sum * 100);
256
- percSum += perc, data.push([row[0], perc + "%"]);
257
- }), showOther) {
258
- const otherLabel = `${this.otherLabel()} (${len - limit + 1})`, otherPercentage = "~" + (100 - percSum) + "%";
367
+ percSum += perc;
368
+ data.push([row[0], perc + "%"]);
369
+ });
370
+ if (showOther) {
371
+ const otherLabel = `${this.otherLabel()} (${len - limit + 1})`;
372
+ const otherPercentage = "~" + (100 - percSum) + "%";
259
373
  data.push([otherLabel, otherPercentage]);
260
374
  }
261
375
  return data;
262
376
  }
263
377
  calculateRowCount() {
264
- const theadRowHeight = this.columns().length > 0 ? this.thFontSize() + 5 : 0, tbodyRowHeight = this.fontSize() + 5, tbodyAvailableHeight = this.height() - theadRowHeight;
265
- return Math.floor(tbodyAvailableHeight / tbodyRowHeight);
378
+ const theadRowHeight = this.columns().length > 0 ? this.thFontSize() + 5 : 0;
379
+ const tbodyRowHeight = this.fontSize() + 5;
380
+ const tbodyAvailableHeight = this.height() - theadRowHeight;
381
+ const rowCount = Math.floor(tbodyAvailableHeight / tbodyRowHeight);
382
+ return rowCount;
266
383
  }
267
384
  enter(domNode, element) {
268
- super.enter(domNode, element), this._tooltip = new HTMLTooltip().target(domNode), this._tooltip.tooltipHTML((data) => {
269
- const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount(), rowHeight = Math.max(...data.map((row) => this.textSize(row[0], this.fontFamily(), this.fontSize()).height)) ?? this.fontSize(), widestLabel = Math.max(...data.map((row) => this.textSize(row[0], this.fontFamily(), this.fontSize()).width)), widestPerc = 30, colCount = 2, w = colCount * (widestLabel + widestPerc) + this._tooltip.padding() * 2, h = rowHeight * Math.ceil((data.length - rowCount) / colCount) + this._tooltip.padding() * 2;
270
- this._tooltip.tooltipWidth(w), this._tooltip.tooltipHeight(h);
385
+ super.enter(domNode, element);
386
+ this._tooltip = new HTMLTooltip().target(domNode);
387
+ this._tooltip.tooltipHTML((data) => {
388
+ const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount();
389
+ const rowHeight = Math.max(...data.map((row) => this.textSize(row[0], this.fontFamily(), this.fontSize()).height)) ?? this.fontSize();
390
+ const widestLabel = Math.max(...data.map((row) => this.textSize(row[0], this.fontFamily(), this.fontSize()).width));
391
+ const widestPerc = 30;
392
+ const colCount = 2;
393
+ const w = colCount * (widestLabel + widestPerc) + this._tooltip.padding() * 2;
394
+ const h = rowHeight * Math.ceil((data.length - rowCount) / colCount) + this._tooltip.padding() * 2;
395
+ this._tooltip.tooltipWidth(w);
396
+ this._tooltip.tooltipHeight(h);
271
397
  const otherData = this.breakdownData(this.data().length).slice(rowCount - 1);
272
398
  return `<div style="
273
399
  width: 100%;
@@ -282,100 +408,111 @@ class BreakdownTable extends StyledTable {
282
408
  });
283
409
  }
284
410
  update(domNode, element) {
285
- if (this.theadColumnStyles_default([
411
+ this.theadColumnStyles_default([
286
412
  {
287
- color: this.thFirstColor(),
413
+ "color": this.thFirstColor(),
288
414
  "font-size": this.thFontSize() + "px",
289
415
  "font-weight": this.thFontWeight(),
290
416
  "text-align": this.labelAlignment(),
291
- width: "auto",
292
- padding: "0px"
417
+ "width": "auto",
418
+ "padding": "0px"
293
419
  },
294
420
  {
295
- width: "1%",
421
+ "width": "1%",
296
422
  "font-size": this.thFontSize() + "px",
297
423
  "font-weight": this.thFontWeight(),
298
424
  "text-align": this.percentageAlignment(),
299
- padding: "0px"
425
+ "padding": "0px"
300
426
  }
301
- ]), this.tbodyColumnStyles_default([
427
+ ]);
428
+ this.tbodyColumnStyles_default([
302
429
  {
303
- color: this.topLabelColor(),
430
+ "color": this.topLabelColor(),
304
431
  "font-size": this.fontSize() + "px",
305
432
  "font-weight": "normal",
306
433
  "text-align": this.labelAlignment(),
307
- width: "auto",
308
- padding: "0px"
434
+ "width": "auto",
435
+ "padding": "0px"
309
436
  },
310
437
  {
311
- color: this.topPercentageColor(),
438
+ "color": this.topPercentageColor(),
312
439
  "font-size": this.fontSize() + "px",
313
440
  "font-weight": "normal",
314
441
  "text-align": this.percentageAlignment(),
315
- width: "1%",
316
- padding: "0px"
442
+ "width": "1%",
443
+ "padding": "0px"
317
444
  }
318
- ]), this.lastRowStyles_default([
445
+ ]);
446
+ this.lastRowStyles_default([
319
447
  {
320
- color: this.otherLabelColor(),
448
+ "color": this.otherLabelColor(),
321
449
  "font-size": this.fontSize() + "px",
322
450
  "font-weight": this.otherLabelBold() ? "bold" : "normal",
323
451
  "text-align": this.labelAlignment(),
324
- width: "auto",
325
- padding: "0px"
452
+ "width": "auto",
453
+ "padding": "0px"
326
454
  },
327
455
  {
328
- color: this.otherLabelColor(),
456
+ "color": this.otherLabelColor(),
329
457
  "font-size": this.fontSize() + "px",
330
458
  "font-weight": this.otherPercentageBold() ? "bold" : "normal",
331
459
  "text-align": this.percentageAlignment(),
332
- width: "1%",
333
- padding: "0px"
460
+ "width": "1%",
461
+ "padding": "0px"
334
462
  }
335
- ]), super.update(domNode, element), (this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount()) < this.data().length) {
336
- const lastRow = element.select("tbody > tr:last-child"), context = this;
463
+ ]);
464
+ super.update(domNode, element);
465
+ const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount();
466
+ if (rowCount < this.data().length) {
467
+ const lastRow = element.select("tbody > tr:last-child");
468
+ const context = this;
337
469
  lastRow.on("mouseout.tooltip", (d) => {
338
- context._tooltip._triggerElement = lastRow, context._tooltip.visible(!1).render();
470
+ context._tooltip._triggerElement = lastRow;
471
+ context._tooltip.visible(false).render();
339
472
  }).on("mouseenter.tooltip", (d) => {
340
- context._tooltip._triggerElement = lastRow, context._tooltip.direction("n").data(context.data()).visible(!0).render();
473
+ context._tooltip._triggerElement = lastRow;
474
+ context._tooltip.direction("n").data(context.data()).visible(true).render();
341
475
  });
342
476
  }
343
477
  }
344
- }
478
+ };
479
+ __name(_BreakdownTable, "BreakdownTable");
480
+ let BreakdownTable = _BreakdownTable;
345
481
  BreakdownTable.prototype._class += " html_BreakdownTable";
346
- BreakdownTable.prototype.publish("useCalculatedRowCount", !0, "boolean", "If true, rowCount will be calculated and its default will be overwritten");
347
- BreakdownTable.prototype.publish("rowCount", 5, "number", "Number of total rows to display (including the 'other' row)", void 0, { disable: (w) => w.useCalculatedRowCount() });
482
+ BreakdownTable.prototype.publish("useCalculatedRowCount", true, "boolean", "If true, rowCount will be calculated and its default will be overwritten");
483
+ BreakdownTable.prototype.publish("rowCount", 5, "number", "Number of total rows to display (including the 'other' row)", void 0, { disable: /* @__PURE__ */ __name((w) => w.useCalculatedRowCount(), "disable") });
348
484
  BreakdownTable.prototype.publish("fontSize", 14, "number", "Font size (pixels)");
349
485
  BreakdownTable.prototype.publish("labelAlignment", "left", "set", "Alignment of the label column text", ["left", "center", "right"]);
350
486
  BreakdownTable.prototype.publish("percentageAlignment", "center", "set", "Alignment of the percentage column text", ["left", "center", "right"]);
351
487
  BreakdownTable.prototype.publish("topLabelColor", "#333", "html-color", "Color of displayed 'top' labels");
352
488
  BreakdownTable.prototype.publish("topPercentageColor", "#1A99D5", "html-color", "Color of displayed 'top' percentages");
353
- BreakdownTable.prototype.publish("topPercentageBold", !0, "html-color", "If true, the 'top' percentages will be bold");
489
+ BreakdownTable.prototype.publish("topPercentageBold", true, "html-color", "If true, the 'top' percentages will be bold");
354
490
  BreakdownTable.prototype.publish("otherLabel", "Other", "string", "Label text for the 'other' row");
355
491
  BreakdownTable.prototype.publish("otherLabelColor", "#AAA", "html-color", "Color of the 'other' label");
356
- BreakdownTable.prototype.publish("otherLabelBold", !1, "html-color", "If true, the 'other' label will be bold");
492
+ BreakdownTable.prototype.publish("otherLabelBold", false, "html-color", "If true, the 'other' label will be bold");
357
493
  BreakdownTable.prototype.publish("otherPercentageColor", "#AAA", "html-color", "Color of the 'other' percentage");
358
- BreakdownTable.prototype.publish("otherPercentageBold", !1, "html-color", "If true, the 'other' percentage will be bold");
494
+ BreakdownTable.prototype.publish("otherPercentageBold", false, "html-color", "If true, the 'other' percentage will be bold");
359
495
  BreakdownTable.prototype.publish("thFontWeight", "bold", "string", "Font weight for th elements");
360
496
  BreakdownTable.prototype.publish("thFontSize", 26, "number", "Font size for th elements");
361
497
  BreakdownTable.prototype.publish("thFirstColor", "#333", "html-color", "Text color of the first th element");
362
498
  BreakdownTable.prototype.publish("thLastColor", "#333", "html-color", "Text color of the last th element");
363
- class JSXWidget extends HTMLWidget {
364
- constructor() {
365
- super(...arguments);
366
- __publicField(this, "rootNode");
367
- }
499
+ const _JSXWidget = class _JSXWidget extends HTMLWidget {
500
+ rootNode;
368
501
  jsxRender(jsx, domNode) {
369
502
  this.rootNode = React.render(jsx, domNode, this.rootNode);
370
503
  }
371
- }
372
- __publicField(JSXWidget, "Component", React.Component), __publicField(JSXWidget, "createElement", React.createElement);
504
+ };
505
+ __name(_JSXWidget, "JSXWidget");
506
+ __publicField(_JSXWidget, "Component", React.Component);
507
+ __publicField(_JSXWidget, "createElement", React.createElement);
508
+ let JSXWidget = _JSXWidget;
373
509
  JSXWidget.prototype._class += " html_JSXWidget";
374
- class VNode {
510
+ const _VNode = class _VNode {
511
+ _attrs;
512
+ _children;
375
513
  constructor(attrs, children) {
376
- __publicField(this, "_attrs");
377
- __publicField(this, "_children");
378
- this._attrs = attrs, this._children = children;
514
+ this._attrs = attrs;
515
+ this._children = children;
379
516
  }
380
517
  type() {
381
518
  return "div";
@@ -390,90 +527,119 @@ class VNode {
390
527
  return this._children;
391
528
  }
392
529
  update(targetElement) {
393
- for (const key in this._attrs)
530
+ for (const key in this._attrs) {
394
531
  targetElement.attr(key, this._attrs[key]);
532
+ }
395
533
  }
396
534
  render(targetElement) {
397
535
  const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data([this]);
398
- return thisElement.exit().remove(), thisElement.enter().append(this.type()).attr("reactd3", 0).merge(thisElement).each(function(d) {
536
+ thisElement.exit().remove();
537
+ return thisElement.enter().append(this.type()).attr("reactd3", 0).merge(thisElement).each(function(d) {
399
538
  const element = select(this);
400
- d.update(element), d.renderChildren(element);
539
+ d.update(element);
540
+ d.renderChildren(element);
401
541
  });
402
542
  }
403
543
  renderChildren(targetElement) {
404
544
  const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data(this._children);
405
- return thisElement.exit().remove(), thisElement.enter().append((d) => document.createElement(d.type())).attr("reactd3", (_d, i) => i).merge(thisElement).each(function(d) {
545
+ thisElement.exit().remove();
546
+ return thisElement.enter().append((d) => document.createElement(d.type())).attr("reactd3", (_d, i) => i).merge(thisElement).each(function(d) {
406
547
  const element = select(this);
407
- d.update(element), d.renderChildren(element);
548
+ d.update(element);
549
+ d.renderChildren(element);
408
550
  });
409
551
  }
410
- }
411
- class ConstVNode extends VNode {
552
+ };
553
+ __name(_VNode, "VNode");
554
+ let VNode = _VNode;
555
+ const _ConstVNode = class _ConstVNode extends VNode {
556
+ _type;
412
557
  constructor(type, attrs, children) {
413
558
  super(attrs, children);
414
- __publicField(this, "_type");
415
559
  this._type = type;
416
560
  }
417
561
  type() {
418
562
  return this._type;
419
563
  }
420
- }
421
- class TextVNode extends VNode {
564
+ };
565
+ __name(_ConstVNode, "ConstVNode");
566
+ let ConstVNode = _ConstVNode;
567
+ const _TextVNode = class _TextVNode extends VNode {
568
+ _text;
422
569
  constructor(text) {
423
570
  super({}, []);
424
- __publicField(this, "_text");
425
571
  this._text = text;
426
572
  }
427
573
  type() {
428
574
  return "span";
429
575
  }
430
576
  update(targetElement) {
431
- super.update(targetElement), targetElement.text(this._text);
577
+ super.update(targetElement);
578
+ targetElement.text(this._text);
432
579
  }
433
- }
580
+ };
581
+ __name(_TextVNode, "TextVNode");
582
+ let TextVNode = _TextVNode;
434
583
  function isReactFn(_) {
435
- return typeof _ == "function";
584
+ return typeof _ === "function";
436
585
  }
586
+ __name(isReactFn, "isReactFn");
437
587
  function isIVNode(_) {
438
588
  return _.prototype && _.prototype instanceof VNode;
439
589
  }
440
- class ReactD3 {
590
+ __name(isIVNode, "isIVNode");
591
+ const _ReactD3 = class _ReactD3 {
441
592
  // static createElementXXX(type: string | ReactFn | IVNode, attrs: { [key: string]: string }, ...children: Array<string | VNode>): VNode {
442
593
  static createElement(type, attrs, ...children) {
443
- return isIVNode(type) ? new type(attrs) : isReactFn(type) ? type(attrs) : new ConstVNode(type, attrs, children.map((child) => typeof child == "string" ? new TextVNode(child) : child));
594
+ if (isIVNode(type)) {
595
+ return new type(attrs);
596
+ } else if (isReactFn(type)) {
597
+ return type(attrs);
598
+ }
599
+ return new ConstVNode(type, attrs, children.map((child) => {
600
+ if (typeof child === "string") {
601
+ return new TextVNode(child);
602
+ }
603
+ return child;
604
+ }));
444
605
  }
445
606
  static render(vdom, targetElement) {
446
607
  vdom.render(targetElement);
447
608
  }
448
- }
609
+ };
610
+ __name(_ReactD3, "ReactD3");
611
+ let ReactD3 = _ReactD3;
449
612
  var l;
450
- l = { __e: function(n, l2, u2, t) {
613
+ l = { __e: /* @__PURE__ */ __name(function(n, l2, u2, t) {
451
614
  for (var i, r, o; l2 = l2.__; ) if ((i = l2.__c) && !i.__) try {
452
- if ((r = i.constructor) && r.getDerivedStateFromError != null && (i.setState(r.getDerivedStateFromError(n)), o = i.__d), i.componentDidCatch != null && (i.componentDidCatch(n, t || {}), o = i.__d), o) return i.__E = i;
615
+ if ((r = i.constructor) && null != r.getDerivedStateFromError && (i.setState(r.getDerivedStateFromError(n)), o = i.__d), null != i.componentDidCatch && (i.componentDidCatch(n, t || {}), o = i.__d), o) return i.__E = i;
453
616
  } catch (l3) {
454
617
  n = l3;
455
618
  }
456
619
  throw n;
457
- } }, typeof Promise == "function" && Promise.prototype.then.bind(Promise.resolve());
620
+ }, "__e") }, "function" == typeof Promise ? Promise.prototype.then.bind(Promise.resolve()) : setTimeout;
458
621
  var f = 0;
459
622
  function u(e, t, n, o, i, u2) {
460
623
  t || (t = {});
461
624
  var a, c, p = t;
462
- if ("ref" in p) for (c in p = {}, t) c == "ref" ? a = t[c] : p[c] = t[c];
625
+ if ("ref" in p) for (c in p = {}, t) "ref" == c ? a = t[c] : p[c] = t[c];
463
626
  var l$1 = { type: e, props: p, key: n, ref: a, __k: null, __: null, __b: 0, __e: null, __c: null, constructor: void 0, __v: --f, __i: -1, __u: 0, __source: i, __self: u2 };
464
627
  return l.vnode && l.vnode(l$1), l$1;
465
628
  }
466
- class VizComponent extends JSXWidget.Component {
467
- constructor() {
468
- super(...arguments);
469
- __publicField(this, "widget");
470
- }
629
+ __name(u, "u");
630
+ const _VizComponent = class _VizComponent extends JSXWidget.Component {
631
+ widget;
471
632
  refreshProps() {
472
- for (const key in this.props)
473
- this.widget[key] && typeof this.widget[key] == "function" && this.widget[key](this.props[key]);
633
+ for (const key in this.props) {
634
+ if (this.widget[key] && typeof this.widget[key] === "function") {
635
+ this.widget[key](this.props[key]);
636
+ }
637
+ }
474
638
  }
475
639
  componentDidMount() {
476
- this.widget = new this.props.type().target(this.base), this.refreshProps(), this.widget.render();
640
+ this.widget = new this.props.type().target(this.base);
641
+ this.refreshProps();
642
+ this.widget.render();
477
643
  }
478
644
  componentWillUnmount() {
479
645
  this.widget.target(null).render();
@@ -482,20 +648,25 @@ class VizComponent extends JSXWidget.Component {
482
648
  return /* @__PURE__ */ u("div", { style: this.props.style });
483
649
  }
484
650
  componentDidUpdate() {
485
- this.refreshProps(), this.widget.render();
486
- }
487
- }
488
- class VizInstance extends JSXWidget.Component {
489
- constructor() {
490
- super(...arguments);
491
- __publicField(this, "widget");
651
+ this.refreshProps();
652
+ this.widget.render();
492
653
  }
654
+ };
655
+ __name(_VizComponent, "VizComponent");
656
+ let VizComponent = _VizComponent;
657
+ const _VizInstance = class _VizInstance extends JSXWidget.Component {
658
+ widget;
493
659
  refreshProps() {
494
- for (const key in this.props)
495
- this.widget[key] && typeof this.widget[key] == "function" && this.widget[key](this.props[key]);
660
+ for (const key in this.props) {
661
+ if (this.widget[key] && typeof this.widget[key] === "function") {
662
+ this.widget[key](this.props[key]);
663
+ }
664
+ }
496
665
  }
497
666
  componentDidMount() {
498
- this.widget = this.props.instance.target(this.base), this.refreshProps(), this.widget.render();
667
+ this.widget = this.props.instance.target(this.base);
668
+ this.refreshProps();
669
+ this.widget.render();
499
670
  }
500
671
  componentWillUnmount() {
501
672
  this.widget.target(null).render();
@@ -504,60 +675,73 @@ class VizInstance extends JSXWidget.Component {
504
675
  return /* @__PURE__ */ u("div", { style: this.props.style });
505
676
  }
506
677
  componentDidUpdate() {
507
- this.refreshProps(), this.widget.render();
678
+ this.refreshProps();
679
+ this.widget.render();
508
680
  }
509
- }
510
- class StatsTable extends StyledTable {
681
+ };
682
+ __name(_VizInstance, "VizInstance");
683
+ let VizInstance = _VizInstance;
684
+ const _StatsTable = class _StatsTable extends StyledTable {
511
685
  transformData() {
512
- const totalRow = [["Total", 0, 0]], data = this.data();
513
- return data.forEach((row) => {
514
- totalRow[0][1] += row[1], totalRow[0][2] += row[2];
515
- }), data.concat(totalRow).map((row) => [
516
- row[0],
517
- this.secondColumnFormat_exists() ? format(this.secondColumnFormat())(row[1]) : row[1],
518
- this.thirdColumnFormat_exists() ? format(this.thirdColumnFormat())(row[2]) : row[2]
519
- ]);
686
+ const totalRow = [["Total", 0, 0]];
687
+ const data = this.data();
688
+ data.forEach((row) => {
689
+ totalRow[0][1] += row[1];
690
+ totalRow[0][2] += row[2];
691
+ });
692
+ return data.concat(totalRow).map((row) => {
693
+ return [
694
+ row[0],
695
+ this.secondColumnFormat_exists() ? format(this.secondColumnFormat())(row[1]) : row[1],
696
+ this.thirdColumnFormat_exists() ? format(this.thirdColumnFormat())(row[2]) : row[2]
697
+ ];
698
+ });
520
699
  }
521
700
  update(domNode, element) {
522
701
  this.tbodyColumnStyles_default([
523
702
  {
524
703
  "font-weight": "bold",
525
- width: this.firstColumnWidth(),
704
+ "width": this.firstColumnWidth(),
526
705
  "text-align": "left"
527
706
  },
528
707
  {
529
- width: this.secondColumnWidth(),
708
+ "width": this.secondColumnWidth(),
530
709
  "text-align": "right"
531
710
  },
532
711
  {
533
- width: this.thirdColumnWidth(),
712
+ "width": this.thirdColumnWidth(),
534
713
  "text-align": "right"
535
714
  }
536
- ]), this.evenRowStyles_default([
715
+ ]);
716
+ this.evenRowStyles_default([
537
717
  {
538
718
  "font-weight": "bold",
539
- width: this.firstColumnWidth(),
719
+ "width": this.firstColumnWidth(),
540
720
  "text-align": "left",
541
721
  "font-color": this.evenRowFontColor(),
542
722
  "background-color": this.evenRowBackgroundColor()
543
723
  },
544
724
  {
545
- width: this.secondColumnWidth(),
725
+ "width": this.secondColumnWidth(),
546
726
  "text-align": "right",
547
727
  "font-color": this.evenRowFontColor(),
548
728
  "background-color": this.evenRowBackgroundColor()
549
729
  },
550
730
  {
551
- width: this.thirdColumnWidth(),
731
+ "width": this.thirdColumnWidth(),
552
732
  "text-align": "right",
553
733
  "font-color": this.evenRowFontColor(),
554
734
  "background-color": this.evenRowBackgroundColor()
555
735
  }
556
- ]), this.lastRowStyles_default({
736
+ ]);
737
+ this.lastRowStyles_default({
557
738
  "font-weight": "bold"
558
- }), super.update(domNode, element);
739
+ });
740
+ super.update(domNode, element);
559
741
  }
560
- }
742
+ };
743
+ __name(_StatsTable, "StatsTable");
744
+ let StatsTable = _StatsTable;
561
745
  StatsTable.prototype._class += " html_StatsTable";
562
746
  StatsTable.prototype.publish("labelColor", "#333", "html-color", "Color of the text in the first column");
563
747
  StatsTable.prototype.publish("primaryValueColor", "#333", "html-color", "Color of the text in the second column");
@@ -567,70 +751,92 @@ StatsTable.prototype.publish("evenRowFontColor", "#333", "html-color", "Font col
567
751
  StatsTable.prototype.publish("firstColumnWidth", "auto", "string", "CSS style applied as the 'width' for the first column (ex: 40px)");
568
752
  StatsTable.prototype.publish("secondColumnWidth", "1%", "string", "CSS style applied as the 'width' for the second column (ex: 40px)");
569
753
  StatsTable.prototype.publish("thirdColumnWidth", "1%", "string", "CSS style applied as the 'width' for the third column (ex: 40px)");
570
- StatsTable.prototype.publish("secondColumnFormat", "$,.0f", "string", "d3-format specifier applied to the second column's values", void 0, { optional: !0 });
571
- StatsTable.prototype.publish("thirdColumnFormat", null, "string", "d3-format specifier applied to the third column's values", void 0, { optional: !0 });
572
- class Item extends HTMLWidget {
754
+ StatsTable.prototype.publish("secondColumnFormat", "$,.0f", "string", "d3-format specifier applied to the second column's values", void 0, { optional: true });
755
+ StatsTable.prototype.publish("thirdColumnFormat", null, "string", "d3-format specifier applied to the third column's values", void 0, { optional: true });
756
+ const _Item = class _Item extends HTMLWidget {
757
+ _owner;
573
758
  constructor(owner) {
574
759
  super();
575
- __publicField(this, "_owner");
576
- this._owner = owner, this._tag = "a";
760
+ this._owner = owner;
761
+ this._tag = "a";
577
762
  }
578
- }
763
+ };
764
+ __name(_Item, "Item");
765
+ let Item = _Item;
579
766
  Item.prototype._class += " html_Item";
580
- class Button extends Item {
767
+ const _Button = class _Button extends Item {
768
+ _icon;
581
769
  constructor(owner, icon) {
582
770
  super(owner);
583
- __publicField(this, "_icon");
584
771
  this._icon = icon;
585
772
  }
586
773
  icon() {
587
774
  return this._icon;
588
775
  }
589
776
  enter(domNode, element) {
590
- super.enter(domNode, element), element.attr("href", "#").on("click", (d, idx, groups) => this._owner.titleBarClick(this, d, idx, groups)).append("i").attr("class", `fa ${this._icon} fa-lg fa-fw`);
777
+ super.enter(domNode, element);
778
+ element.attr("href", "#").on("click", (d, idx, groups) => this._owner.titleBarClick(this, d, idx, groups)).append("i").attr("class", `fa ${this._icon} fa-lg fa-fw`);
591
779
  }
592
- }
780
+ };
781
+ __name(_Button, "Button");
782
+ let Button = _Button;
593
783
  Button.prototype._class += " html_Button";
594
- class ToggleButton extends Button {
784
+ const _ToggleButton = class _ToggleButton extends Button {
595
785
  enter(domNode, element) {
596
786
  element.on("click.sel", (d, idx, groups) => {
597
- this.selected(!this.selected()), this.render();
598
- }), super.enter(domNode, element);
787
+ this.selected(!this.selected());
788
+ this.render();
789
+ });
790
+ super.enter(domNode, element);
599
791
  }
600
792
  update(domNode, element) {
601
- super.update(domNode, element), this._element.classed("selected", this.selected());
793
+ super.update(domNode, element);
794
+ this._element.classed("selected", this.selected());
602
795
  }
603
- }
796
+ };
797
+ __name(_ToggleButton, "ToggleButton");
798
+ let ToggleButton = _ToggleButton;
604
799
  ToggleButton.prototype._class += " html_ToggleButton";
605
- ToggleButton.prototype.publish("selected", !1, "boolean");
606
- class Spacer extends Item {
800
+ ToggleButton.prototype.publish("selected", false, "boolean");
801
+ const _Spacer = class _Spacer extends Item {
607
802
  enter(domNode, element) {
608
- super.enter(domNode, element), element.attr("class", "spacer").attr("href", "#").append("i");
803
+ super.enter(domNode, element);
804
+ element.attr("class", "spacer").attr("href", "#").append("i");
609
805
  }
610
- }
806
+ };
807
+ __name(_Spacer, "Spacer");
808
+ let Spacer = _Spacer;
611
809
  Spacer.prototype._class += " html_Spacer";
612
- class TitleBar extends JSXWidget {
810
+ const _TitleBar = class _TitleBar extends JSXWidget {
811
+ _divMain;
812
+ _divIconBar;
813
+ _divTitle;
613
814
  constructor() {
614
815
  super();
615
- __publicField(this, "_divMain");
616
- __publicField(this, "_divIconBar");
617
- __publicField(this, "_divTitle");
618
816
  }
619
817
  enter(domNode, element) {
620
- super.enter(domNode, element), this._divMain = element.append("div").attr("class", "main"), this._divIconBar = this._divMain.append("div").attr("class", "icon-bar"), this._divTitle = this._divMain.append("div").attr("class", "title");
818
+ super.enter(domNode, element);
819
+ this._divMain = element.append("div").attr("class", "main");
820
+ this._divIconBar = this._divMain.append("div").attr("class", "icon-bar");
821
+ this._divTitle = this._divMain.append("div").attr("class", "title");
621
822
  }
622
823
  update(domNode, element) {
623
- super.update(domNode, element), this._divTitle.text(this.title());
824
+ super.update(domNode, element);
825
+ this._divTitle.text(this.title());
624
826
  const icons = this._divIconBar.selectAll(".icon-bar-item").data(this.buttons());
625
827
  icons.enter().append("div").attr("class", "icon-bar-item").each(function(d) {
626
828
  d.target(this);
627
829
  }).merge(icons).each(function(d) {
628
830
  d.render();
629
- }), icons.exit().each(function(d) {
831
+ });
832
+ icons.exit().each(function(d) {
630
833
  d.target(null);
631
- }).remove(), icons.order();
834
+ }).remove();
835
+ icons.order();
632
836
  }
633
- }
837
+ };
838
+ __name(_TitleBar, "TitleBar");
839
+ let TitleBar = _TitleBar;
634
840
  TitleBar.prototype._class += " html_TitleBar";
635
841
  TitleBar.prototype.publish("title", "", "string");
636
842
  TitleBar.prototype.publish("buttons", [], "widgetArray");
@@ -655,4 +861,4 @@ export {
655
861
  VizInstance
656
862
  };
657
863
  //# sourceMappingURL=index.js.map
658
- (function(){"use strict";try{if(typeof document<"u"){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)}})();
864
+ !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)}}();