@hpcc-js/html 3.3.0 → 3.3.1

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 CHANGED
@@ -1,247 +1,258 @@
1
- import { HTMLWidget, format, select } from "@hpcc-js/common";
1
+ var __defProp = Object.defineProperty;
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);
5
+ import { HTMLWidget, select, format } from "@hpcc-js/common";
2
6
  import { scopedLogger } from "@hpcc-js/util";
3
7
  import { React } from "@hpcc-js/react";
4
-
5
- //#region src/__package__.ts
6
8
  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
- }
9
+ const PKG_VERSION = "3.3.1";
10
+ const BUILD_VERSION = "3.15.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");
19
+ constructor() {
20
+ super();
21
+ this.visible(false);
22
+ }
23
+ tooltipHTML(_) {
24
+ this._tooltipHTMLCallback = _;
25
+ return this;
26
+ }
27
+ tooltipContent(_) {
28
+ if (!arguments.length) return this._contentNode;
29
+ this._contentNode = _;
30
+ return this;
31
+ }
32
+ triggerElement(_) {
33
+ this._triggerElement = _;
34
+ return this;
35
+ }
36
+ enter(domNode, element) {
37
+ super.enter(domNode, element);
38
+ const body = select("body");
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");
41
+ }
42
+ update(domNode, element) {
43
+ super.update(domNode, element);
44
+ if (this._contentNode !== this._prevContentNode) {
45
+ const node = this._tooltipElement.node();
46
+ [...node.querySelectorAll("*")].map((n) => n.__data__).filter((n) => n).forEach((w) => {
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
+ });
64
+ }
65
+ if (this.fitContent()) {
66
+ this._tooltipElement.style("width", "auto").style("height", "auto").style("padding", "0px").style("box-sizing", "content-box");
67
+ const rect = this._tooltipElement.node().getBoundingClientRect();
68
+ this.tooltipWidth_default(rect.width);
69
+ this.tooltipHeight_default(rect.height);
70
+ }
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();
75
+ }
76
+ onShowContent(node) {
77
+ }
78
+ updateTooltipPosition() {
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;
85
+ }
86
+ calcTooltipDirection(bbox) {
87
+ const directions = Object.keys(bbox);
88
+ const defaultDirection = this.direction();
89
+ directions.sort((a, b) => a === defaultDirection ? -1 : 1);
90
+ const windowRect = {
91
+ top: 0,
92
+ left: 0,
93
+ width: window.innerWidth,
94
+ height: window.innerHeight
95
+ };
96
+ for (let i = 0; i < directions.length; i++) {
97
+ const tooltipRect = {
98
+ top: bbox[directions[i]].y,
99
+ left: bbox[directions[i]].x,
100
+ width: this.tooltipWidth(),
101
+ height: this.tooltipHeight()
102
+ };
103
+ if (this.rectFits(tooltipRect, windowRect)) {
104
+ return directions[i];
105
+ }
106
+ }
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({
110
+ top: bbox[defaultDirection].y,
111
+ left: bbox[defaultDirection].x,
112
+ width: this.tooltipWidth(),
113
+ height: this.tooltipHeight()
114
+ });
115
+ return defaultDirection;
116
+ }
117
+ rectFits(innerRect, outerRect) {
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;
119
+ }
120
+ setArrowPosition(point, 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) {
126
+ case "n":
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`);
131
+ break;
132
+ case "s":
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`);
137
+ break;
138
+ case "e":
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`);
143
+ break;
144
+ case "w":
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");
149
+ break;
150
+ }
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;
157
+ }
158
+ getReferenceNode() {
159
+ if (!this._triggerElement) {
160
+ return this.element().node().parentNode.parentNode;
161
+ }
162
+ return this._triggerElement.node();
163
+ }
164
+ _cursorLoc;
165
+ calcReferenceBBox() {
166
+ const node = this.getReferenceNode();
167
+ let { top, left, width, height } = node.getBoundingClientRect();
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 = {
182
+ n: {
183
+ x: left + width / 2 - halfW - p,
184
+ y: top - wholeH - arrowH - p2
185
+ },
186
+ e: {
187
+ x: left + width + arrowH,
188
+ y: top + height / 2 - halfH - p
189
+ },
190
+ s: {
191
+ x: left + width / 2 - halfW - p,
192
+ y: top + height + arrowH
193
+ },
194
+ w: {
195
+ x: left - wholeW - arrowH - p2,
196
+ y: top + height / 2 - halfH - p
197
+ },
198
+ nw: {
199
+ x: left - wholeW - p2,
200
+ y: top - wholeH - p2
201
+ },
202
+ ne: {
203
+ x: left + width,
204
+ y: top - wholeH - p2
205
+ },
206
+ se: {
207
+ x: left + width,
208
+ y: top + height
209
+ },
210
+ sw: {
211
+ x: left - wholeW - p2,
212
+ y: top + height
213
+ }
214
+ };
215
+ return bbox;
216
+ }
217
+ _closing = false;
218
+ mouseout() {
219
+ this._closing = true;
220
+ this._tooltipElement.on("mouseover", () => {
221
+ this._closing = false;
222
+ });
223
+ this._tooltipElement.on("mouseout", () => {
224
+ this.mouseout();
225
+ });
226
+ setTimeout(() => {
227
+ if (this._closing) {
228
+ this.visible(false);
229
+ }
230
+ }, this.closeDelay());
231
+ }
232
+ 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;
240
+ }
241
+ exit(domNode, element) {
242
+ if (this._arrowElement) {
243
+ this._arrowElement.remove();
244
+ this._tooltipElement.remove();
245
+ }
246
+ super.exit(domNode, element);
247
+ }
230
248
  };
249
+ __name(_HTMLTooltip, "HTMLTooltip");
250
+ let HTMLTooltip = _HTMLTooltip;
231
251
  HTMLTooltip.prototype._class += " html_HTMLTooltip";
232
252
  HTMLTooltip.prototype.publish("fitContent", false, "boolean", "If true, tooltip will grow to fit its html content");
233
253
  HTMLTooltip.prototype.publish("followCursor", false, "boolean", "If true, tooltip will display relative to cursor location");
234
254
  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
- ]);
255
+ HTMLTooltip.prototype.publish("direction", "n", "set", "Direction in which to display the tooltip", ["n", "s", "e", "w", "ne", "nw", "se", "sw"]);
245
256
  HTMLTooltip.prototype.publish("padding", 8, "number", "Padding (pixels)");
246
257
  HTMLTooltip.prototype.publish("arrowWidth", 16, "number", "Width (or height depending on direction) of the tooltip arrow (pixels)");
247
258
  HTMLTooltip.prototype.publish("arrowHeight", 8, "number", "Height (or width depending on direction) of the tooltip arrow (pixels)");
@@ -250,223 +261,229 @@ HTMLTooltip.prototype.publish("tooltipColor", "#000000EE", "html-color", "Backgr
250
261
  HTMLTooltip.prototype.publish("tooltipWidth", 200, "number", "Width of the tooltip (not including arrow) (pixels)");
251
262
  HTMLTooltip.prototype.publish("tooltipHeight", 200, "number", "Height of the tooltip (not including arrow) (pixels)");
252
263
  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
- }
264
+ const _SimpleTable = class _SimpleTable extends HTMLWidget {
265
+ _table;
266
+ _tbody;
267
+ _thead;
268
+ _theadRow;
269
+ constructor() {
270
+ super();
271
+ }
272
+ transformData() {
273
+ return this.data();
274
+ }
275
+ enter(domNode, element) {
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");
281
+ }
282
+ update(domNode, element) {
283
+ super.update(domNode, element);
284
+ this._table.style("width", this.autoWidth() ? "auto" : "100%");
285
+ const theadTrSelection = this._theadRow.selectAll("th").data(this.columns());
286
+ theadTrSelection.enter().append("th").attr("class", (n, i) => `th-${i}`).merge(theadTrSelection).text((_d) => _d.toString());
287
+ theadTrSelection.exit().remove();
288
+ const trSelection = this._tbody.selectAll("tr").data(this.transformData());
289
+ trSelection.enter().append("tr").merge(trSelection).each(function(d) {
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();
296
+ }
288
297
  };
298
+ __name(_SimpleTable, "SimpleTable");
299
+ let SimpleTable = _SimpleTable;
289
300
  SimpleTable.prototype._class += " html_SimpleTable";
290
301
  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
- }
302
+ const _StyledTable = class _StyledTable extends SimpleTable {
303
+ constructor() {
304
+ super();
305
+ }
306
+ applyStyleObject(selection, styleObject) {
307
+ Object.keys(styleObject).forEach((styleName) => {
308
+ selection.style(styleName, styleObject[styleName]);
309
+ });
310
+ }
311
+ update(domNode, element) {
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) => {
315
+ this.applyStyleObject(element.select(`.th-${i}`), styleObj);
316
+ });
317
+ this.tbodyColumnStyles().forEach((styleObj, i) => {
318
+ this.applyStyleObject(element.selectAll(`.col-${i}`), styleObj);
319
+ });
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");
323
+ if (evenRowStylesExist) {
324
+ const tbodyEvenRows = tbodyRows.select(function(d, i) {
325
+ return i % 2 ? this : null;
326
+ });
327
+ this.applyStyleObject(tbodyEvenRows, this.evenRowStyles());
328
+ }
329
+ if (lastRowStylesExist) {
330
+ const tbodyLastRow = tbodyRows.select(function(d, i, arr) {
331
+ return i === arr.length - 1 ? this : null;
332
+ });
333
+ this.applyStyleObject(tbodyLastRow, this.lastRowStyles());
334
+ }
335
+ }
328
336
  };
337
+ __name(_StyledTable, "StyledTable");
338
+ let StyledTable = _StyledTable;
329
339
  StyledTable.prototype._class += " html_StyledTable";
330
340
  StyledTable.prototype.publish("fontFamily", "Verdana", "string", "Base font-family used within the table");
331
341
  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="
342
+ StyledTable.prototype.publish("theadColumnStyles", [], "array", 'Array of objects containing styles for the thead columns (ex: [{"color":"red"},{"color":"blue"}])');
343
+ StyledTable.prototype.publish("tbodyColumnStyles", [], "array", 'Array of objects containing styles for the tbody columns (ex: [{"color":"red"},{"color":"blue"}])');
344
+ StyledTable.prototype.publish("lastRowStyles", {}, "object", 'Object containing styles for the last row (ex: {"color":"red"})');
345
+ StyledTable.prototype.publish("evenRowStyles", {}, "object", 'Object containing styles for even rows (ex: {"background-color":"#AAA"})');
346
+ const _BreakdownTable = class _BreakdownTable extends StyledTable {
347
+ // protected _table;
348
+ // protected _tbody;
349
+ _tooltip;
350
+ constructor() {
351
+ super();
352
+ }
353
+ transformData() {
354
+ const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount();
355
+ return this.breakdownData(rowCount);
356
+ }
357
+ breakdownData(limit) {
358
+ const len = this.data().length;
359
+ const sum = this.data().reduce((acc, row) => acc + row[1], 0);
360
+ const data = [];
361
+ let percSum = 0;
362
+ this.data().sort((a, b) => a[1] > b[1] ? -1 : 1);
363
+ const hiddenRowCount = len - limit;
364
+ const showOther = hiddenRowCount > 0;
365
+ this.data().filter((_, i) => showOther ? i < limit - 1 : true).forEach((row) => {
366
+ const perc = Math.round(row[1] / sum * 100);
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) + "%";
373
+ data.push([otherLabel, otherPercentage]);
374
+ }
375
+ return data;
376
+ }
377
+ calculateRowCount() {
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;
383
+ }
384
+ enter(domNode, element) {
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);
397
+ const otherData = this.breakdownData(this.data().length).slice(rowCount - 1);
398
+ return `<div style="
388
399
  width: 100%;
389
400
  height: 100%;
390
401
  font-size: ${this.fontSize()}px;
391
- ">${otherData.map((row) => `<div style="
402
+ ">${otherData.map(
403
+ (row) => `<div style="
392
404
  float:left;
393
405
  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
- }
406
+ ">${row[0]}: ${row[1]}</div>`
407
+ ).join("")}</div>`;
408
+ });
409
+ }
410
+ update(domNode, element) {
411
+ this.theadColumnStyles_default([
412
+ {
413
+ "color": this.thFirstColor(),
414
+ "font-size": this.thFontSize() + "px",
415
+ "font-weight": this.thFontWeight(),
416
+ "text-align": this.labelAlignment(),
417
+ "width": "auto",
418
+ "padding": "0px"
419
+ },
420
+ {
421
+ "width": "1%",
422
+ "font-size": this.thFontSize() + "px",
423
+ "font-weight": this.thFontWeight(),
424
+ "text-align": this.percentageAlignment(),
425
+ "padding": "0px"
426
+ }
427
+ ]);
428
+ this.tbodyColumnStyles_default([
429
+ {
430
+ "color": this.topLabelColor(),
431
+ "font-size": this.fontSize() + "px",
432
+ "font-weight": "normal",
433
+ "text-align": this.labelAlignment(),
434
+ "width": "auto",
435
+ "padding": "0px"
436
+ },
437
+ {
438
+ "color": this.topPercentageColor(),
439
+ "font-size": this.fontSize() + "px",
440
+ "font-weight": "normal",
441
+ "text-align": this.percentageAlignment(),
442
+ "width": "1%",
443
+ "padding": "0px"
444
+ }
445
+ ]);
446
+ this.lastRowStyles_default([
447
+ {
448
+ "color": this.otherLabelColor(),
449
+ "font-size": this.fontSize() + "px",
450
+ "font-weight": this.otherLabelBold() ? "bold" : "normal",
451
+ "text-align": this.labelAlignment(),
452
+ "width": "auto",
453
+ "padding": "0px"
454
+ },
455
+ {
456
+ "color": this.otherLabelColor(),
457
+ "font-size": this.fontSize() + "px",
458
+ "font-weight": this.otherPercentageBold() ? "bold" : "normal",
459
+ "text-align": this.percentageAlignment(),
460
+ "width": "1%",
461
+ "padding": "0px"
462
+ }
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;
469
+ lastRow.on("mouseout.tooltip", (d) => {
470
+ context._tooltip._triggerElement = lastRow;
471
+ context._tooltip.visible(false).render();
472
+ }).on("mouseenter.tooltip", (d) => {
473
+ context._tooltip._triggerElement = lastRow;
474
+ context._tooltip.direction("n").data(context.data()).visible(true).render();
475
+ });
476
+ }
477
+ }
455
478
  };
479
+ __name(_BreakdownTable, "BreakdownTable");
480
+ let BreakdownTable = _BreakdownTable;
456
481
  BreakdownTable.prototype._class += " html_BreakdownTable";
457
482
  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() });
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") });
459
484
  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
- ]);
485
+ BreakdownTable.prototype.publish("labelAlignment", "left", "set", "Alignment of the label column text", ["left", "center", "right"]);
486
+ BreakdownTable.prototype.publish("percentageAlignment", "center", "set", "Alignment of the percentage column text", ["left", "center", "right"]);
470
487
  BreakdownTable.prototype.publish("topLabelColor", "#333", "html-color", "Color of displayed 'top' labels");
471
488
  BreakdownTable.prototype.publish("topPercentageColor", "#1A99D5", "html-color", "Color of displayed 'top' percentages");
472
489
  BreakdownTable.prototype.publish("topPercentageBold", true, "html-color", "If true, the 'top' percentages will be bold");
@@ -479,491 +496,252 @@ BreakdownTable.prototype.publish("thFontWeight", "bold", "string", "Font weight
479
496
  BreakdownTable.prototype.publish("thFontSize", 26, "number", "Font size for th elements");
480
497
  BreakdownTable.prototype.publish("thFirstColor", "#333", "html-color", "Text color of the first th element");
481
498
  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
- }
499
+ const _JSXWidget = class _JSXWidget extends HTMLWidget {
500
+ rootNode;
501
+ jsxRender(jsx, domNode) {
502
+ this.rootNode = React.render(jsx, domNode, this.rootNode);
503
+ }
492
504
  };
505
+ __name(_JSXWidget, "JSXWidget");
506
+ __publicField(_JSXWidget, "Component", React.Component);
507
+ __publicField(_JSXWidget, "createElement", React.createElement);
508
+ let JSXWidget = _JSXWidget;
493
509
  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
- }
510
+ const _VNode = class _VNode {
511
+ _attrs;
512
+ _children;
513
+ constructor(attrs, children) {
514
+ this._attrs = attrs;
515
+ this._children = children;
516
+ }
517
+ type() {
518
+ return "div";
519
+ }
520
+ attrs() {
521
+ return this._attrs;
522
+ }
523
+ attr(key) {
524
+ return this._attrs[key];
525
+ }
526
+ children() {
527
+ return this._children;
528
+ }
529
+ update(targetElement) {
530
+ for (const key in this._attrs) {
531
+ targetElement.attr(key, this._attrs[key]);
532
+ }
533
+ }
534
+ render(targetElement) {
535
+ const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data([this]);
536
+ thisElement.exit().remove();
537
+ return thisElement.enter().append(this.type()).attr("reactd3", 0).merge(thisElement).each(function(d) {
538
+ const element = select(this);
539
+ d.update(element);
540
+ d.renderChildren(element);
541
+ });
542
+ }
543
+ renderChildren(targetElement) {
544
+ const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data(this._children);
545
+ thisElement.exit().remove();
546
+ return thisElement.enter().append((d) => document.createElement(d.type())).attr("reactd3", (_d, i) => i).merge(thisElement).each(function(d) {
547
+ const element = select(this);
548
+ d.update(element);
549
+ d.renderChildren(element);
550
+ });
551
+ }
537
552
  };
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
- }
553
+ __name(_VNode, "VNode");
554
+ let VNode = _VNode;
555
+ const _ConstVNode = class _ConstVNode extends VNode {
556
+ _type;
557
+ constructor(type, attrs, children) {
558
+ super(attrs, children);
559
+ this._type = type;
560
+ }
561
+ type() {
562
+ return this._type;
563
+ }
547
564
  };
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
- }
565
+ __name(_ConstVNode, "ConstVNode");
566
+ let ConstVNode = _ConstVNode;
567
+ const _TextVNode = class _TextVNode extends VNode {
568
+ _text;
569
+ constructor(text) {
570
+ super({}, []);
571
+ this._text = text;
572
+ }
573
+ type() {
574
+ return "span";
575
+ }
576
+ update(targetElement) {
577
+ super.update(targetElement);
578
+ targetElement.text(this._text);
579
+ }
561
580
  };
581
+ __name(_TextVNode, "TextVNode");
582
+ let TextVNode = _TextVNode;
562
583
  function isReactFn(_) {
563
- return typeof _ === "function";
584
+ return typeof _ === "function";
564
585
  }
586
+ __name(isReactFn, "isReactFn");
565
587
  function isIVNode(_) {
566
- return _.prototype && _.prototype instanceof VNode;
588
+ return _.prototype && _.prototype instanceof VNode;
567
589
  }
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
- }
590
+ __name(isIVNode, "isIVNode");
591
+ const _ReactD3 = class _ReactD3 {
592
+ // static createElementXXX(type: string | ReactFn | IVNode, attrs: { [key: string]: string }, ...children: Array<string | VNode>): VNode {
593
+ static createElement(type, attrs, ...children) {
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
+ }));
605
+ }
606
+ static render(vdom, targetElement) {
607
+ vdom.render(targetElement);
608
+ }
580
609
  };
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;
610
+ __name(_ReactD3, "ReactD3");
611
+ let ReactD3 = _ReactD3;
612
+ var l;
613
+ l = { __e: /* @__PURE__ */ __name(function(n, l2, u2, t) {
614
+ for (var i, r, o; l2 = l2.__; ) if ((i = l2.__c) && !i.__) try {
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;
616
+ } catch (l3) {
617
+ n = l3;
618
+ }
619
+ throw n;
620
+ }, "__e") }, "function" == typeof Promise ? Promise.prototype.then.bind(Promise.resolve()) : setTimeout;
621
+ var f = 0;
622
+ function u(e, t, n, o, i, u2) {
623
+ t || (t = {});
624
+ var a, c, p = t;
625
+ if ("ref" in p) for (c in p = {}, t) "ref" == c ? a = t[c] : p[c] = t[c];
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 };
627
+ return l.vnode && l.vnode(l$1), l$1;
588
628
  }
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
- }
629
+ __name(u, "u");
630
+ const _VizComponent = class _VizComponent extends JSXWidget.Component {
631
+ widget;
632
+ refreshProps() {
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
+ }
638
+ }
639
+ componentDidMount() {
640
+ this.widget = new this.props.type().target(this.base);
641
+ this.refreshProps();
642
+ this.widget.render();
643
+ }
644
+ componentWillUnmount() {
645
+ this.widget.target(null).render();
646
+ }
647
+ render() {
648
+ return /* @__PURE__ */ u("div", { style: this.props.style });
649
+ }
650
+ componentDidUpdate() {
651
+ this.refreshProps();
652
+ this.widget.render();
653
+ }
878
654
  };
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
- }
655
+ __name(_VizComponent, "VizComponent");
656
+ let VizComponent = _VizComponent;
657
+ const _VizInstance = class _VizInstance extends JSXWidget.Component {
658
+ widget;
659
+ refreshProps() {
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
+ }
665
+ }
666
+ componentDidMount() {
667
+ this.widget = this.props.instance.target(this.base);
668
+ this.refreshProps();
669
+ this.widget.render();
670
+ }
671
+ componentWillUnmount() {
672
+ this.widget.target(null).render();
673
+ }
674
+ render() {
675
+ return /* @__PURE__ */ u("div", { style: this.props.style });
676
+ }
677
+ componentDidUpdate() {
678
+ this.refreshProps();
679
+ this.widget.render();
680
+ }
902
681
  };
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
- }
682
+ __name(_VizInstance, "VizInstance");
683
+ let VizInstance = _VizInstance;
684
+ const _StatsTable = class _StatsTable extends StyledTable {
685
+ transformData() {
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
+ });
699
+ }
700
+ update(domNode, element) {
701
+ this.tbodyColumnStyles_default([
702
+ {
703
+ "font-weight": "bold",
704
+ "width": this.firstColumnWidth(),
705
+ "text-align": "left"
706
+ },
707
+ {
708
+ "width": this.secondColumnWidth(),
709
+ "text-align": "right"
710
+ },
711
+ {
712
+ "width": this.thirdColumnWidth(),
713
+ "text-align": "right"
714
+ }
715
+ ]);
716
+ this.evenRowStyles_default([
717
+ {
718
+ "font-weight": "bold",
719
+ "width": this.firstColumnWidth(),
720
+ "text-align": "left",
721
+ "font-color": this.evenRowFontColor(),
722
+ "background-color": this.evenRowBackgroundColor()
723
+ },
724
+ {
725
+ "width": this.secondColumnWidth(),
726
+ "text-align": "right",
727
+ "font-color": this.evenRowFontColor(),
728
+ "background-color": this.evenRowBackgroundColor()
729
+ },
730
+ {
731
+ "width": this.thirdColumnWidth(),
732
+ "text-align": "right",
733
+ "font-color": this.evenRowFontColor(),
734
+ "background-color": this.evenRowBackgroundColor()
735
+ }
736
+ ]);
737
+ this.lastRowStyles_default({
738
+ "font-weight": "bold"
739
+ });
740
+ super.update(domNode, element);
741
+ }
966
742
  };
743
+ __name(_StatsTable, "StatsTable");
744
+ let StatsTable = _StatsTable;
967
745
  StatsTable.prototype._class += " html_StatsTable";
968
746
  StatsTable.prototype.publish("labelColor", "#333", "html-color", "Color of the text in the first column");
969
747
  StatsTable.prototype.publish("primaryValueColor", "#333", "html-color", "Color of the text in the second column");
@@ -975,87 +753,112 @@ StatsTable.prototype.publish("secondColumnWidth", "1%", "string", "CSS style app
975
753
  StatsTable.prototype.publish("thirdColumnWidth", "1%", "string", "CSS style applied as the 'width' for the third column (ex: 40px)");
976
754
  StatsTable.prototype.publish("secondColumnFormat", "$,.0f", "string", "d3-format specifier applied to the second column's values", void 0, { optional: true });
977
755
  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
- }
756
+ const _Item = class _Item extends HTMLWidget {
757
+ _owner;
758
+ constructor(owner) {
759
+ super();
760
+ this._owner = owner;
761
+ this._tag = "a";
762
+ }
988
763
  };
764
+ __name(_Item, "Item");
765
+ let Item = _Item;
989
766
  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
- }
767
+ const _Button = class _Button extends Item {
768
+ _icon;
769
+ constructor(owner, icon) {
770
+ super(owner);
771
+ this._icon = icon;
772
+ }
773
+ icon() {
774
+ return this._icon;
775
+ }
776
+ enter(domNode, element) {
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`);
779
+ }
1003
780
  };
781
+ __name(_Button, "Button");
782
+ let Button = _Button;
1004
783
  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
- }
784
+ const _ToggleButton = class _ToggleButton extends Button {
785
+ enter(domNode, element) {
786
+ element.on("click.sel", (d, idx, groups) => {
787
+ this.selected(!this.selected());
788
+ this.render();
789
+ });
790
+ super.enter(domNode, element);
791
+ }
792
+ update(domNode, element) {
793
+ super.update(domNode, element);
794
+ this._element.classed("selected", this.selected());
795
+ }
1017
796
  };
797
+ __name(_ToggleButton, "ToggleButton");
798
+ let ToggleButton = _ToggleButton;
1018
799
  ToggleButton.prototype._class += " html_ToggleButton";
1019
800
  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
- }
801
+ const _Spacer = class _Spacer extends Item {
802
+ enter(domNode, element) {
803
+ super.enter(domNode, element);
804
+ element.attr("class", "spacer").attr("href", "#").append("i");
805
+ }
1025
806
  };
807
+ __name(_Spacer, "Spacer");
808
+ let Spacer = _Spacer;
1026
809
  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
- }
810
+ const _TitleBar = class _TitleBar extends JSXWidget {
811
+ _divMain;
812
+ _divIconBar;
813
+ _divTitle;
814
+ constructor() {
815
+ super();
816
+ }
817
+ enter(domNode, element) {
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");
822
+ }
823
+ update(domNode, element) {
824
+ super.update(domNode, element);
825
+ this._divTitle.text(this.title());
826
+ const icons = this._divIconBar.selectAll(".icon-bar-item").data(this.buttons());
827
+ icons.enter().append("div").attr("class", "icon-bar-item").each(function(d) {
828
+ d.target(this);
829
+ }).merge(icons).each(function(d) {
830
+ d.render();
831
+ });
832
+ icons.exit().each(function(d) {
833
+ d.target(null);
834
+ }).remove();
835
+ icons.order();
836
+ }
1054
837
  };
838
+ __name(_TitleBar, "TitleBar");
839
+ let TitleBar = _TitleBar;
1055
840
  TitleBar.prototype._class += " html_TitleBar";
1056
841
  TitleBar.prototype.publish("title", "", "string");
1057
842
  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)}}();
843
+ export {
844
+ BUILD_VERSION,
845
+ BreakdownTable,
846
+ Button,
847
+ HTMLTooltip,
848
+ Item,
849
+ JSXWidget,
850
+ PKG_NAME,
851
+ PKG_VERSION,
852
+ ReactD3,
853
+ SimpleTable,
854
+ Spacer,
855
+ StatsTable,
856
+ StyledTable,
857
+ TitleBar,
858
+ ToggleButton,
859
+ VNode,
860
+ VizComponent,
861
+ VizInstance
862
+ };
863
+ //# sourceMappingURL=index.js.map
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)}}();