@hpcc-js/html 3.1.1 → 3.2.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,93 +1,658 @@
1
- var we=Object.defineProperty;var h=(e,t)=>we(e,"name",{value:t,configurable:!0});var Je="@hpcc-js/html",Xe="3.1.1",Ze="3.2.1";import{HTMLWidget as xe,select as Ce}from"@hpcc-js/common";import{scopedLogger as ke}from"@hpcc-js/util";var k=class extends xe{static{h(this,"HTMLTooltip")}_triggerElement;_contentNode;_prevContentNode;_tooltipElement;_arrowElement;_tooltipHTMLCallback=h(t=>"<b>_tooltipHTMLCallback is undefined</b>","_tooltipHTMLCallback");_logger=ke("html/HTMLTooltip");constructor(){super(),this.visible(!1)}tooltipHTML(t){return this._tooltipHTMLCallback=t,this}tooltipContent(t){return arguments.length?(this._contentNode=t,this):this._contentNode}triggerElement(t){return this._triggerElement=t,this}enter(t,o){super.enter(t,o);let r=Ce("body");this._tooltipElement=r.append("div").attr("class","tooltip-div").style("z-index","2147483638").style("position","fixed"),this._arrowElement=r.append("div").attr("class","arrow-div").style("z-index","2147483638").style("position","fixed")}update(t,o){if(super.update(t,o),this._contentNode!==this._prevContentNode){let r=this._tooltipElement.node();[...r.querySelectorAll("*")].map(n=>n.__data__).filter(n=>n).forEach(n=>{typeof n.target=="function"&&n.target(null),typeof n.exit=="function"&&n.exit()}),r.innerHTML="",r.appendChild(this._contentNode),this._prevContentNode=this._contentNode}if(this._contentNode?this.onShowContent(this._contentNode):this._tooltipElement.html(()=>this._tooltipHTMLCallback(this.data())),this.fitContent()){this._tooltipElement.style("width","auto").style("height","auto").style("padding","0px").style("box-sizing","content-box");let r=this._tooltipElement.node().getBoundingClientRect();this.tooltipWidth_default(r.width),this.tooltipHeight_default(r.height)}this._closing=!1,this._tooltipElement.style("background-color",this.tooltipColor()).style("color",this.fontColor()).style("width",this.tooltipWidth()+"px").style("height",this.tooltipHeight()+"px").style("opacity",1).style("padding",this.padding()+"px").style("pointer-events",this.enablePointerEvents()?"all":"none").style("box-sizing","content-box"),this._arrowElement.style("opacity",1).style("pointer-events","none"),this.updateTooltipPosition()}onShowContent(t){}updateTooltipPosition(){let t=this.calcReferenceBBox(),o=this.calcTooltipDirection(t),r=t[o];return this._tooltipElement.style("top",r.y+"px").style("left",r.x+"px"),this.setArrowPosition(r,o),r}calcTooltipDirection(t){let o=Object.keys(t),r=this.direction();o.sort((i,s)=>i===r?-1:1);let n={top:0,left:0,width:window.innerWidth,height:window.innerHeight};for(let i=0;i<o.length;i++){let s={top:t[o[i]].y,left:t[o[i]].x,width:this.tooltipWidth(),height:this.tooltipHeight()};if(this.rectFits(s,n))return o[i]}return this._logger.warning(`Tooltip doesn't fit in the window for any of the directions. Defaulting to '${r}'`),this._logger.debug(n),this._logger.debug({top:t[r].y,left:t[r].x,width:this.tooltipWidth(),height:this.tooltipHeight()}),r}rectFits(t,o){return t.top>=o.top&&t.left>=o.left&&t.width+t.left<=o.width+o.left&&t.height+t.top<=o.height+o.top}setArrowPosition(t,o){let r,n,i="border-top-color";switch(this._arrowElement.style("border",`${this.arrowHeight()}px solid ${this.tooltipColor()}`).style("border-top-color","transparent").style("border-right-color","transparent").style("border-bottom-color","transparent").style("border-left-color","transparent"),o){case"n":r=t.y+this.tooltipHeight()+this.padding()*2,n=t.x+this.tooltipWidth()/2-this.arrowWidth()/2+this.padding(),i="border-top-color",this._arrowElement.style("border-top-width",`${this.arrowHeight()}px`).style("border-bottom-width","0px").style("border-left-width",`${this.arrowWidth()/2}px`).style("border-right-width",`${this.arrowWidth()/2}px`);break;case"s":r=t.y-this.arrowHeight(),n=t.x+this.padding()+this.tooltipWidth()/2-this.arrowWidth()/2,i="border-bottom-color",this._arrowElement.style("border-top-width","0px").style("border-bottom-width",`${this.arrowHeight()}px`).style("border-left-width",`${this.arrowWidth()/2}px`).style("border-right-width",`${this.arrowWidth()/2}px`);break;case"e":r=t.y+this.tooltipHeight()/2+this.padding()-this.arrowWidth()/2,n=t.x-this.arrowHeight(),i="border-right-color",this._arrowElement.style("border-top-width",`${this.arrowWidth()/2}px`).style("border-bottom-width",`${this.arrowWidth()/2}px`).style("border-left-width","0px").style("border-right-width",`${this.arrowHeight()}px`);break;case"w":r=t.y+this.tooltipHeight()/2-this.arrowWidth()/2+this.padding(),n=t.x+this.tooltipWidth()+this.padding()*2,i="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");break}return typeof r<"u"&&typeof n<"u"?this._arrowElement.style("top",r+"px").style("left",n+"px").style(i,this.tooltipColor()).style("opacity",1):this._arrowElement.style("opacity",0),t}getReferenceNode(){return this._triggerElement?this._triggerElement.node():this.element().node().parentNode.parentNode}_cursorLoc;calcReferenceBBox(){let t=this.getReferenceNode(),{top:o,left:r,width:n,height:i}=t.getBoundingClientRect(),s=this.tooltipWidth(),p=this.tooltipHeight(),_=s/2,a=p/2,d=this.arrowHeight(),l=this.padding(),f=l*2;return this.followCursor()&&this._cursorLoc&&(r=this._cursorLoc[0],o=this._cursorLoc[1],n=1,i=1),{n:{x:r+n/2-_-l,y:o-p-d-f},e:{x:r+n+d,y:o+i/2-a-l},s:{x:r+n/2-_-l,y:o+i+d},w:{x:r-s-d-f,y:o+i/2-a-l},nw:{x:r-s-f,y:o-p-f},ne:{x:r+n,y:o-p-f},se:{x:r+n,y:o+i},sw:{x:r-s-f,y:o+i}}}_closing=!1;mouseout(){this._closing=!0,this._tooltipElement.on("mouseover",()=>{this._closing=!1}),this._tooltipElement.on("mouseout",()=>{this.mouseout()}),setTimeout(()=>{this._closing&&this.visible(!1)},this.closeDelay())}visible(t){return arguments.length?(this._arrowElement&&(this._arrowElement.style("visibility",t?"visible":"hidden"),this._tooltipElement.style("visibility",t?"visible":"hidden")),super.visible(t),this):super.visible()}exit(t,o){this._arrowElement&&(this._arrowElement.remove(),this._tooltipElement.remove()),super.exit(t,o)}};k.prototype._class+=" html_HTMLTooltip";k.prototype.publish("fitContent",!1,"boolean","If true, tooltip will grow to fit its html content");k.prototype.publish("followCursor",!1,"boolean","If true, tooltip will display relative to cursor location");k.prototype.publish("closeDelay",400,"number","Number of milliseconds to wait before closing tooltip (cancelled on tooltip mouseover event)");k.prototype.publish("direction","n","set","Direction in which to display the tooltip",["n","s","e","w","ne","nw","se","sw"]);k.prototype.publish("padding",8,"number","Padding (pixels)");k.prototype.publish("arrowWidth",16,"number","Width (or height depending on direction) of the tooltip arrow (pixels)");k.prototype.publish("arrowHeight",8,"number","Height (or width depending on direction) of the tooltip arrow (pixels)");k.prototype.publish("fontColor","#FFF","html-color","The default font color for text in the tooltip");k.prototype.publish("tooltipColor","#000000EE","html-color","Background color of the tooltip");k.prototype.publish("tooltipWidth",200,"number","Width of the tooltip (not including arrow) (pixels)");k.prototype.publish("tooltipHeight",200,"number","Height of the tooltip (not including arrow) (pixels)");k.prototype.publish("enablePointerEvents",!1,"boolean","If true, the 'pointer-events: all' style will be used");import{HTMLWidget as Se,select as Ee}from"@hpcc-js/common";var B=class extends Se{static{h(this,"SimpleTable")}_table;_tbody;_thead;_theadRow;constructor(){super()}transformData(){return this.data()}enter(t,o){super.enter(t,o),this._table=o.append("table"),this._thead=this._table.append("thead"),this._theadRow=this._thead.append("tr"),this._tbody=this._table.append("tbody")}update(t,o){super.update(t,o),this._table.style("width",this.autoWidth()?"auto":"100%");let r=this._theadRow.selectAll("th").data(this.columns());r.enter().append("th").attr("class",(i,s)=>`th-${s}`).merge(r).text(i=>i.toString()),r.exit().remove();let n=this._tbody.selectAll("tr").data(this.transformData());n.enter().append("tr").merge(n).each(function(i){let p=Ee(this).selectAll("td").data(i);p.enter().append("td").attr("class",(_,a)=>`col-${a}`).merge(p).text(_=>_.toString()),p.exit().remove()}),n.exit().remove()}};B.prototype._class+=" html_SimpleTable";B.prototype.publish("autoWidth",!1,"boolean","If true, table width will be set to 'auto'. If false, the width is set to '100%'");var S=class extends B{static{h(this,"StyledTable")}constructor(){super()}applyStyleObject(t,o){Object.keys(o).forEach(r=>{t.style(r,o[r])})}update(t,o){super.update(t,o),o.selectAll("tr,th,td").attr("style","").style("font-family",this.fontFamily()).style("color",this.fontColor()),this.theadColumnStyles().forEach((s,p)=>{this.applyStyleObject(o.select(`.th-${p}`),s)}),this.tbodyColumnStyles().forEach((s,p)=>{this.applyStyleObject(o.selectAll(`.col-${p}`),s)});let r=Object.keys(this.evenRowStyles()).length>0,n=Object.keys(this.lastRowStyles()).length>0,i=o.selectAll("tbody > tr");if(r){let s=i.select(function(p,_){return _%2?this:null});this.applyStyleObject(s,this.evenRowStyles())}if(n){let s=i.select(function(p,_,a){return _===a.length-1?this:null});this.applyStyleObject(s,this.lastRowStyles())}}};S.prototype._class+=" html_StyledTable";S.prototype.publish("fontFamily","Verdana","string","Base font-family used within the table");S.prototype.publish("fontColor","#333","string","Base font color used within the table");S.prototype.publish("theadColumnStyles",[],"array",'Array of objects containing styles for the thead columns (ex: [{"color":"red"},{"color":"blue"}])');S.prototype.publish("tbodyColumnStyles",[],"array",'Array of objects containing styles for the tbody columns (ex: [{"color":"red"},{"color":"blue"}])');S.prototype.publish("lastRowStyles",{},"object",'Object containing styles for the last row (ex: {"color":"red"})');S.prototype.publish("evenRowStyles",{},"object",'Object containing styles for even rows (ex: {"background-color":"#AAA"})');var w=class extends S{static{h(this,"BreakdownTable")}_tooltip;constructor(){super()}transformData(){let t=this.useCalculatedRowCount()?this.calculateRowCount():this.rowCount();return this.breakdownData(t)}breakdownData(t){let o=this.data().length,r=this.data().reduce((_,a)=>_+a[1],0),n=[],i=0;this.data().sort((_,a)=>_[1]>a[1]?-1:1);let p=o-t>0;if(this.data().filter((_,a)=>p?a<t-1:!0).forEach(_=>{let a=Math.round(_[1]/r*100);i+=a,n.push([_[0],a+"%"])}),p){let _=`${this.otherLabel()} (${o-t+1})`,a="~"+(100-i)+"%";n.push([_,a])}return n}calculateRowCount(){let t=this.columns().length>0?this.thFontSize()+5:0,o=this.fontSize()+5,r=this.height()-t;return Math.floor(r/o)}enter(t,o){super.enter(t,o),this._tooltip=new k().target(t),this._tooltip.tooltipHTML(r=>{let n=this.useCalculatedRowCount()?this.calculateRowCount():this.rowCount(),i=Math.max(...r.map(f=>this.textSize(f[0],this.fontFamily(),this.fontSize()).height))??this.fontSize(),s=Math.max(...r.map(f=>this.textSize(f[0],this.fontFamily(),this.fontSize()).width)),p=30,_=2,a=_*(s+p)+this._tooltip.padding()*2,d=i*Math.ceil((r.length-n)/_)+this._tooltip.padding()*2;this._tooltip.tooltipWidth(a),this._tooltip.tooltipHeight(d);let l=this.breakdownData(this.data().length).slice(n-1);return`<div style="
1
+ (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)}})();
2
+ var __defProp = Object.defineProperty;
3
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value;
4
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value);
5
+ import { HTMLWidget, select, format } from "@hpcc-js/common";
6
+ import { scopedLogger } from "@hpcc-js/util";
7
+ import { React } from "@hpcc-js/react";
8
+ const PKG_NAME = "@hpcc-js/html", PKG_VERSION = "3.1.1", BUILD_VERSION = "3.2.1";
9
+ class HTMLTooltip extends HTMLWidget {
10
+ constructor() {
11
+ super();
12
+ __publicField(this, "_triggerElement");
13
+ __publicField(this, "_contentNode");
14
+ __publicField(this, "_prevContentNode");
15
+ __publicField(this, "_tooltipElement");
16
+ __publicField(this, "_arrowElement");
17
+ __publicField(this, "_tooltipHTMLCallback", (data) => "<b>_tooltipHTMLCallback is undefined</b>");
18
+ __publicField(this, "_logger", scopedLogger("html/HTMLTooltip"));
19
+ __publicField(this, "_cursorLoc");
20
+ __publicField(this, "_closing", !1);
21
+ this.visible(!1);
22
+ }
23
+ tooltipHTML(_) {
24
+ return this._tooltipHTMLCallback = _, this;
25
+ }
26
+ tooltipContent(_) {
27
+ return arguments.length ? (this._contentNode = _, this) : this._contentNode;
28
+ }
29
+ triggerElement(_) {
30
+ return this._triggerElement = _, this;
31
+ }
32
+ enter(domNode, element) {
33
+ super.enter(domNode, element);
34
+ const body = select("body");
35
+ 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");
36
+ }
37
+ update(domNode, element) {
38
+ if (super.update(domNode, element), this._contentNode !== this._prevContentNode) {
39
+ const node = this._tooltipElement.node();
40
+ [...node.querySelectorAll("*")].map((n) => n.__data__).filter((n) => n).forEach((w) => {
41
+ typeof w.target == "function" && w.target(null), typeof w.exit == "function" && w.exit();
42
+ }), node.innerHTML = "", node.appendChild(this._contentNode), this._prevContentNode = this._contentNode;
43
+ }
44
+ if (this._contentNode ? this.onShowContent(this._contentNode) : this._tooltipElement.html(() => this._tooltipHTMLCallback(this.data())), this.fitContent()) {
45
+ this._tooltipElement.style("width", "auto").style("height", "auto").style("padding", "0px").style("box-sizing", "content-box");
46
+ const rect = this._tooltipElement.node().getBoundingClientRect();
47
+ this.tooltipWidth_default(rect.width), this.tooltipHeight_default(rect.height);
48
+ }
49
+ 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();
50
+ }
51
+ onShowContent(node) {
52
+ }
53
+ updateTooltipPosition() {
54
+ const bbox = this.calcReferenceBBox(), direction = this.calcTooltipDirection(bbox), box = bbox[direction];
55
+ return this._tooltipElement.style("top", box.y + "px").style("left", box.x + "px"), this.setArrowPosition(box, direction), box;
56
+ }
57
+ calcTooltipDirection(bbox) {
58
+ const directions = Object.keys(bbox), defaultDirection = this.direction();
59
+ directions.sort((a, b) => a === defaultDirection ? -1 : 1);
60
+ const windowRect = {
61
+ top: 0,
62
+ left: 0,
63
+ width: window.innerWidth,
64
+ height: window.innerHeight
65
+ };
66
+ for (let i = 0; i < directions.length; i++) {
67
+ const tooltipRect = {
68
+ top: bbox[directions[i]].y,
69
+ left: bbox[directions[i]].x,
70
+ width: this.tooltipWidth(),
71
+ height: this.tooltipHeight()
72
+ };
73
+ if (this.rectFits(tooltipRect, windowRect))
74
+ return directions[i];
75
+ }
76
+ 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({
77
+ top: bbox[defaultDirection].y,
78
+ left: bbox[defaultDirection].x,
79
+ width: this.tooltipWidth(),
80
+ height: this.tooltipHeight()
81
+ }), defaultDirection;
82
+ }
83
+ rectFits(innerRect, outerRect) {
84
+ 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;
85
+ }
86
+ setArrowPosition(point, direction) {
87
+ let top, left, visibleBorderStyle = "border-top-color";
88
+ 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) {
89
+ case "n":
90
+ 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`);
91
+ break;
92
+ case "s":
93
+ 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`);
94
+ break;
95
+ case "e":
96
+ 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`);
97
+ break;
98
+ case "w":
99
+ 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");
100
+ break;
101
+ }
102
+ 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;
103
+ }
104
+ getReferenceNode() {
105
+ return this._triggerElement ? this._triggerElement.node() : this.element().node().parentNode.parentNode;
106
+ }
107
+ calcReferenceBBox() {
108
+ const node = this.getReferenceNode();
109
+ let { top, left, width, height } = node.getBoundingClientRect();
110
+ const wholeW = this.tooltipWidth(), wholeH = this.tooltipHeight(), halfW = wholeW / 2, halfH = wholeH / 2, arrowH = this.arrowHeight(), p = this.padding(), p2 = p * 2;
111
+ return this.followCursor() && this._cursorLoc && (left = this._cursorLoc[0], top = this._cursorLoc[1], width = 1, height = 1), {
112
+ n: {
113
+ x: left + width / 2 - halfW - p,
114
+ y: top - wholeH - arrowH - p2
115
+ },
116
+ e: {
117
+ x: left + width + arrowH,
118
+ y: top + height / 2 - halfH - p
119
+ },
120
+ s: {
121
+ x: left + width / 2 - halfW - p,
122
+ y: top + height + arrowH
123
+ },
124
+ w: {
125
+ x: left - wholeW - arrowH - p2,
126
+ y: top + height / 2 - halfH - p
127
+ },
128
+ nw: {
129
+ x: left - wholeW - p2,
130
+ y: top - wholeH - p2
131
+ },
132
+ ne: {
133
+ x: left + width,
134
+ y: top - wholeH - p2
135
+ },
136
+ se: {
137
+ x: left + width,
138
+ y: top + height
139
+ },
140
+ sw: {
141
+ x: left - wholeW - p2,
142
+ y: top + height
143
+ }
144
+ };
145
+ }
146
+ mouseout() {
147
+ this._closing = !0, this._tooltipElement.on("mouseover", () => {
148
+ this._closing = !1;
149
+ }), this._tooltipElement.on("mouseout", () => {
150
+ this.mouseout();
151
+ }), setTimeout(() => {
152
+ this._closing && this.visible(!1);
153
+ }, this.closeDelay());
154
+ }
155
+ visible(_) {
156
+ return arguments.length ? (this._arrowElement && (this._arrowElement.style("visibility", _ ? "visible" : "hidden"), this._tooltipElement.style("visibility", _ ? "visible" : "hidden")), super.visible(_), this) : super.visible();
157
+ }
158
+ exit(domNode, element) {
159
+ this._arrowElement && (this._arrowElement.remove(), this._tooltipElement.remove()), super.exit(domNode, element);
160
+ }
161
+ }
162
+ HTMLTooltip.prototype._class += " html_HTMLTooltip";
163
+ HTMLTooltip.prototype.publish("fitContent", !1, "boolean", "If true, tooltip will grow to fit its html content");
164
+ HTMLTooltip.prototype.publish("followCursor", !1, "boolean", "If true, tooltip will display relative to cursor location");
165
+ HTMLTooltip.prototype.publish("closeDelay", 400, "number", "Number of milliseconds to wait before closing tooltip (cancelled on tooltip mouseover event)");
166
+ HTMLTooltip.prototype.publish("direction", "n", "set", "Direction in which to display the tooltip", ["n", "s", "e", "w", "ne", "nw", "se", "sw"]);
167
+ HTMLTooltip.prototype.publish("padding", 8, "number", "Padding (pixels)");
168
+ HTMLTooltip.prototype.publish("arrowWidth", 16, "number", "Width (or height depending on direction) of the tooltip arrow (pixels)");
169
+ HTMLTooltip.prototype.publish("arrowHeight", 8, "number", "Height (or width depending on direction) of the tooltip arrow (pixels)");
170
+ HTMLTooltip.prototype.publish("fontColor", "#FFF", "html-color", "The default font color for text in the tooltip");
171
+ HTMLTooltip.prototype.publish("tooltipColor", "#000000EE", "html-color", "Background color of the tooltip");
172
+ HTMLTooltip.prototype.publish("tooltipWidth", 200, "number", "Width of the tooltip (not including arrow) (pixels)");
173
+ HTMLTooltip.prototype.publish("tooltipHeight", 200, "number", "Height of the tooltip (not including arrow) (pixels)");
174
+ HTMLTooltip.prototype.publish("enablePointerEvents", !1, "boolean", "If true, the 'pointer-events: all' style will be used");
175
+ class SimpleTable extends HTMLWidget {
176
+ constructor() {
177
+ super();
178
+ __publicField(this, "_table");
179
+ __publicField(this, "_tbody");
180
+ __publicField(this, "_thead");
181
+ __publicField(this, "_theadRow");
182
+ }
183
+ transformData() {
184
+ return this.data();
185
+ }
186
+ enter(domNode, element) {
187
+ 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");
188
+ }
189
+ update(domNode, element) {
190
+ super.update(domNode, element), this._table.style("width", this.autoWidth() ? "auto" : "100%");
191
+ const theadTrSelection = this._theadRow.selectAll("th").data(this.columns());
192
+ theadTrSelection.enter().append("th").attr("class", (n, i) => `th-${i}`).merge(theadTrSelection).text((_d) => _d.toString()), theadTrSelection.exit().remove();
193
+ const trSelection = this._tbody.selectAll("tr").data(this.transformData());
194
+ trSelection.enter().append("tr").merge(trSelection).each(function(d) {
195
+ const tdSelection = select(this).selectAll("td").data(d);
196
+ tdSelection.enter().append("td").attr("class", (n, i) => `col-${i}`).merge(tdSelection).text((_d) => _d.toString()), tdSelection.exit().remove();
197
+ }), trSelection.exit().remove();
198
+ }
199
+ }
200
+ SimpleTable.prototype._class += " html_SimpleTable";
201
+ SimpleTable.prototype.publish("autoWidth", !1, "boolean", "If true, table width will be set to 'auto'. If false, the width is set to '100%'");
202
+ class StyledTable extends SimpleTable {
203
+ constructor() {
204
+ super();
205
+ }
206
+ applyStyleObject(selection, styleObject) {
207
+ Object.keys(styleObject).forEach((styleName) => {
208
+ selection.style(styleName, styleObject[styleName]);
209
+ });
210
+ }
211
+ update(domNode, element) {
212
+ 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) => {
213
+ this.applyStyleObject(element.select(`.th-${i}`), styleObj);
214
+ }), this.tbodyColumnStyles().forEach((styleObj, i) => {
215
+ this.applyStyleObject(element.selectAll(`.col-${i}`), styleObj);
216
+ });
217
+ const evenRowStylesExist = Object.keys(this.evenRowStyles()).length > 0, lastRowStylesExist = Object.keys(this.lastRowStyles()).length > 0, tbodyRows = element.selectAll("tbody > tr");
218
+ if (evenRowStylesExist) {
219
+ const tbodyEvenRows = tbodyRows.select(function(d, i) {
220
+ return i % 2 ? this : null;
221
+ });
222
+ this.applyStyleObject(tbodyEvenRows, this.evenRowStyles());
223
+ }
224
+ if (lastRowStylesExist) {
225
+ const tbodyLastRow = tbodyRows.select(function(d, i, arr) {
226
+ return i === arr.length - 1 ? this : null;
227
+ });
228
+ this.applyStyleObject(tbodyLastRow, this.lastRowStyles());
229
+ }
230
+ }
231
+ }
232
+ StyledTable.prototype._class += " html_StyledTable";
233
+ StyledTable.prototype.publish("fontFamily", "Verdana", "string", "Base font-family used within the table");
234
+ StyledTable.prototype.publish("fontColor", "#333", "string", "Base font color used within the table");
235
+ StyledTable.prototype.publish("theadColumnStyles", [], "array", 'Array of objects containing styles for the thead columns (ex: [{"color":"red"},{"color":"blue"}])');
236
+ StyledTable.prototype.publish("tbodyColumnStyles", [], "array", 'Array of objects containing styles for the tbody columns (ex: [{"color":"red"},{"color":"blue"}])');
237
+ StyledTable.prototype.publish("lastRowStyles", {}, "object", 'Object containing styles for the last row (ex: {"color":"red"})');
238
+ StyledTable.prototype.publish("evenRowStyles", {}, "object", 'Object containing styles for even rows (ex: {"background-color":"#AAA"})');
239
+ class BreakdownTable extends StyledTable {
240
+ constructor() {
241
+ super();
242
+ // protected _table;
243
+ // protected _tbody;
244
+ __publicField(this, "_tooltip");
245
+ }
246
+ transformData() {
247
+ const rowCount = this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount();
248
+ return this.breakdownData(rowCount);
249
+ }
250
+ breakdownData(limit) {
251
+ const len = this.data().length, sum = this.data().reduce((acc, row) => acc + row[1], 0), data = [];
252
+ let percSum = 0;
253
+ this.data().sort((a, b) => a[1] > b[1] ? -1 : 1);
254
+ const showOther = len - limit > 0;
255
+ if (this.data().filter((_, i) => showOther ? i < limit - 1 : !0).forEach((row) => {
256
+ const perc = Math.round(row[1] / sum * 100);
257
+ percSum += perc, data.push([row[0], perc + "%"]);
258
+ }), showOther) {
259
+ const otherLabel = `${this.otherLabel()} (${len - limit + 1})`, otherPercentage = "~" + (100 - percSum) + "%";
260
+ data.push([otherLabel, otherPercentage]);
261
+ }
262
+ return data;
263
+ }
264
+ calculateRowCount() {
265
+ const theadRowHeight = this.columns().length > 0 ? this.thFontSize() + 5 : 0, tbodyRowHeight = this.fontSize() + 5, tbodyAvailableHeight = this.height() - theadRowHeight;
266
+ return Math.floor(tbodyAvailableHeight / tbodyRowHeight);
267
+ }
268
+ enter(domNode, element) {
269
+ super.enter(domNode, element), this._tooltip = new HTMLTooltip().target(domNode), this._tooltip.tooltipHTML((data) => {
270
+ 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;
271
+ this._tooltip.tooltipWidth(w), this._tooltip.tooltipHeight(h);
272
+ const otherData = this.breakdownData(this.data().length).slice(rowCount - 1);
273
+ return `<div style="
2
274
  width: 100%;
3
275
  height: 100%;
4
276
  font-size: ${this.fontSize()}px;
5
- ">${l.map(f=>`<div style="
277
+ ">${otherData.map(
278
+ (row) => `<div style="
6
279
  float:left;
7
- width:${Math.floor(99/_)}%;
8
- ">${f[0]}: ${f[1]}</div>`).join("")}</div>`})}update(t,o){if(this.theadColumnStyles_default([{color:this.thFirstColor(),"font-size":this.thFontSize()+"px","font-weight":this.thFontWeight(),"text-align":this.labelAlignment(),width:"auto",padding:"0px"},{width:"1%","font-size":this.thFontSize()+"px","font-weight":this.thFontWeight(),"text-align":this.percentageAlignment(),padding:"0px"}]),this.tbodyColumnStyles_default([{color:this.topLabelColor(),"font-size":this.fontSize()+"px","font-weight":"normal","text-align":this.labelAlignment(),width:"auto",padding:"0px"},{color:this.topPercentageColor(),"font-size":this.fontSize()+"px","font-weight":"normal","text-align":this.percentageAlignment(),width:"1%",padding:"0px"}]),this.lastRowStyles_default([{color:this.otherLabelColor(),"font-size":this.fontSize()+"px","font-weight":this.otherLabelBold()?"bold":"normal","text-align":this.labelAlignment(),width:"auto",padding:"0px"},{color:this.otherLabelColor(),"font-size":this.fontSize()+"px","font-weight":this.otherPercentageBold()?"bold":"normal","text-align":this.percentageAlignment(),width:"1%",padding:"0px"}]),super.update(t,o),(this.useCalculatedRowCount()?this.calculateRowCount():this.rowCount())<this.data().length){let n=o.select("tbody > tr:last-child"),i=this;n.on("mouseout.tooltip",s=>{i._tooltip._triggerElement=n,i._tooltip.visible(!1).render()}).on("mouseenter.tooltip",s=>{i._tooltip._triggerElement=n,i._tooltip.direction("n").data(i.data()).visible(!0).render()})}}};w.prototype._class+=" html_BreakdownTable";w.prototype.publish("useCalculatedRowCount",!0,"boolean","If true, rowCount will be calculated and its default will be overwritten");w.prototype.publish("rowCount",5,"number","Number of total rows to display (including the 'other' row)",void 0,{disable:h(e=>e.useCalculatedRowCount(),"disable")});w.prototype.publish("fontSize",14,"number","Font size (pixels)");w.prototype.publish("labelAlignment","left","set","Alignment of the label column text",["left","center","right"]);w.prototype.publish("percentageAlignment","center","set","Alignment of the percentage column text",["left","center","right"]);w.prototype.publish("topLabelColor","#333","html-color","Color of displayed 'top' labels");w.prototype.publish("topPercentageColor","#1A99D5","html-color","Color of displayed 'top' percentages");w.prototype.publish("topPercentageBold",!0,"html-color","If true, the 'top' percentages will be bold");w.prototype.publish("otherLabel","Other","string","Label text for the 'other' row");w.prototype.publish("otherLabelColor","#AAA","html-color","Color of the 'other' label");w.prototype.publish("otherLabelBold",!1,"html-color","If true, the 'other' label will be bold");w.prototype.publish("otherPercentageColor","#AAA","html-color","Color of the 'other' percentage");w.prototype.publish("otherPercentageBold",!1,"html-color","If true, the 'other' percentage will be bold");w.prototype.publish("thFontWeight","bold","string","Font weight for th elements");w.prototype.publish("thFontSize",26,"number","Font size for th elements");w.prototype.publish("thFirstColor","#333","html-color","Text color of the first th element");w.prototype.publish("thLastColor","#333","html-color","Text color of the last th element");import{HTMLWidget as Ve}from"@hpcc-js/common";var He=Object.defineProperty,c=h((e,t)=>He(e,"name",{value:t,configurable:!0}),"l");var nt,g,Yt,We,L,Bt,te,dt,xt,ft,gt,Te,j={},ee=[],Re=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,it=Array.isArray;function P(e,t){for(var o in t)e[o]=t[o];return e}h(P,"w");c(P,"d");function Ct(e){e&&e.parentNode&&e.parentNode.removeChild(e)}h(Ct,"ve");c(Ct,"w");function R(e,t,o){var r,n,i,s={};for(i in t)i=="key"?r=t[i]:i=="ref"?n=t[i]:s[i]=t[i];if(arguments.length>2&&(s.children=arguments.length>3?nt.call(arguments,2):o),typeof e=="function"&&e.defaultProps!=null)for(i in e.defaultProps)s[i]===void 0&&(s[i]=e.defaultProps[i]);return U(e,s,r,n,null)}h(R,"R");c(R,"_");function U(e,t,o,r,n){var i={type:e,props:t,key:o,ref:r,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,constructor:void 0,__v:n??++Yt,__i:-1,__u:0};return n==null&&g.vnode!=null&&g.vnode(i),i}h(U,"W");c(U,"g");function N(e){return e.children}h(N,"S");c(N,"b");function H(e,t){this.props=e,this.context=t}h(H,"k");c(H,"k");function D(e,t){if(t==null)return e.__?D(e.__,e.__i+1):null;for(var o;t<e.__k.length;t++)if((o=e.__k[t])!=null&&o.__e!=null)return o.__e;return typeof e.type=="function"?D(e):null}h(D,"U");c(D,"x");function kt(e){var t,o;if((e=e.__)!=null&&e.__c!=null){for(e.__e=e.__c.base=null,t=0;t<e.__k.length;t++)if((o=e.__k[t])!=null&&o.__e!=null){e.__e=e.__c.base=o.__e;break}return kt(e)}}h(kt,"me");c(kt,"C");function mt(e){(!e.__d&&(e.__d=!0)&&L.push(e)&&!q.__r++||Bt!==g.debounceRendering)&&((Bt=g.debounceRendering)||te)(q)}h(mt,"se");c(mt,"S");function q(){var e,t,o,r,n,i,s,p;for(L.sort(dt);e=L.shift();)e.__d&&(t=L.length,r=void 0,i=(n=(o=e).__v).__e,s=[],p=[],o.__P&&((r=P({},n)).__v=n.__v+1,g.vnode&&g.vnode(r),lt(o.__P,r,n,o.__n,o.__P.namespaceURI,32&n.__u?[i]:null,s,i??D(n),!!(32&n.__u),p),r.__v=n.__v,r.__.__k[r.__i]=r,Ht(s,r,p),r.__e!=i&&kt(r)),L.length>t&&L.sort(dt));q.__r=0}h(q,"V");c(q,"M");function St(e,t,o,r,n,i,s,p,_,a,d){var l,f,u,x,W,C=r&&r.__k||ee,m=t.length;for(o.__d=_,oe(o,t,C),_=o.__d,l=0;l<m;l++)(u=o.__k[l])!=null&&(f=u.__i===-1?j:C[u.__i]||j,u.__i=l,lt(e,u,f,n,i,s,p,_,a,d),x=u.__e,u.ref&&f.ref!=u.ref&&(f.ref&&st(f.ref,null,u),d.push(u.ref,u.__c||x,u)),W==null&&x!=null&&(W=x),65536&u.__u||f.__k===u.__k?_=Et(u,_,e):typeof u.type=="function"&&u.__d!==void 0?_=u.__d:x&&(_=x.nextSibling),u.__d=void 0,u.__u&=-196609);o.__d=_,o.__e=W}h(St,"ye");c(St,"P");function oe(e,t,o){var r,n,i,s,p,_=t.length,a=o.length,d=a,l=0;for(e.__k=[],r=0;r<_;r++)(n=t[r])!=null&&typeof n!="boolean"&&typeof n!="function"?(s=r+l,(n=e.__k[r]=typeof n=="string"||typeof n=="number"||typeof n=="bigint"||n.constructor==String?U(null,n,null,null,null):it(n)?U(N,{children:n},null,null,null):n.constructor===void 0&&n.__b>0?U(n.type,n.props,n.key,n.ref?n.ref:null,n.__v):n).__=e,n.__b=e.__b+1,i=null,(p=n.__i=re(n,o,s,d))!==-1&&(d--,(i=o[p])&&(i.__u|=131072)),i==null||i.__v===null?(p==-1&&l--,typeof n.type!="function"&&(n.__u|=65536)):p!==s&&(p==s-1?l--:p==s+1?l++:(p>s?l--:l++,n.__u|=65536))):n=e.__k[r]=null;if(d)for(r=0;r<a;r++)(i=o[r])!=null&&!(131072&i.__u)&&(i.__e==e.__d&&(e.__d=D(i)),Wt(i,i))}h(oe,"Xe");c(oe,"$");function Et(e,t,o){var r,n;if(typeof e.type=="function"){for(r=e.__k,n=0;r&&n<r.length;n++)r[n]&&(r[n].__=e,t=Et(r[n],t,o));return t}e.__e!=t&&(t&&e.type&&!o.contains(t)&&(t=D(e)),o.insertBefore(e.__e,t||null),t=e.__e);do t=t&&t.nextSibling;while(t!=null&&t.nodeType===8);return t}h(Et,"ge");c(Et,"I");function K(e,t){return t=t||[],e==null||typeof e=="boolean"||(it(e)?e.some(function(o){K(o,t)}):t.push(e)),t}h(K,"I");c(K,"H");function re(e,t,o,r){var n=e.key,i=e.type,s=o-1,p=o+1,_=t[o];if(_===null||_&&n==_.key&&i===_.type&&!(131072&_.__u))return o;if(r>(_!=null&&!(131072&_.__u)?1:0))for(;s>=0||p<t.length;){if(s>=0){if((_=t[s])&&!(131072&_.__u)&&n==_.key&&i===_.type)return s;s--}if(p<t.length){if((_=t[p])&&!(131072&_.__u)&&n==_.key&&i===_.type)return p;p++}}return-1}h(re,"et");c(re,"L");function yt(e,t,o){t[0]==="-"?e.setProperty(t,o??""):e[t]=o==null?"":typeof o!="number"||Re.test(t)?o:o+"px"}h(yt,"ce");c(yt,"T");function z(e,t,o,r,n){var i;t:if(t==="style")if(typeof o=="string")e.style.cssText=o;else{if(typeof r=="string"&&(e.style.cssText=r=""),r)for(t in r)o&&t in o||yt(e.style,t,"");if(o)for(t in o)r&&o[t]===r[t]||yt(e.style,t,o[t])}else if(t[0]==="o"&&t[1]==="n")i=t!==(t=t.replace(/(PointerCapture)$|Capture$/i,"$1")),t=t.toLowerCase()in e||t==="onFocusOut"||t==="onFocusIn"?t.toLowerCase().slice(2):t.slice(2),e.l||(e.l={}),e.l[t+i]=o,o?r?o.u=r.u:(o.u=xt,e.addEventListener(t,i?gt:ft,i)):e.removeEventListener(t,i?gt:ft,i);else{if(n=="http://www.w3.org/2000/svg")t=t.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if(t!="width"&&t!="height"&&t!="href"&&t!="list"&&t!="form"&&t!="tabIndex"&&t!="download"&&t!="rowSpan"&&t!="colSpan"&&t!="role"&&t!="popover"&&t in e)try{e[t]=o??"";break t}catch{}typeof o=="function"||(o==null||o===!1&&t[4]!=="-"?e.removeAttribute(t):e.setAttribute(t,t=="popover"&&o==1?"":o))}}h(z,"A");c(z,"A");function bt(e){return function(t){if(this.l){var o=this.l[t.type+e];if(t.t==null)t.t=xt++;else if(t.t<o.u)return;return o(g.event?g.event(t):t)}}}h(bt,"fe");c(bt,"F");function lt(e,t,o,r,n,i,s,p,_,a){var d,l,f,u,x,W,C,m,y,I,F,Q,$,Dt,Y,ct,T=t.type;if(t.constructor!==void 0)return null;128&o.__u&&(_=!!(32&o.__u),i=[p=t.__e=o.__e]),(d=g.__b)&&d(t);t:if(typeof T=="function")try{if(m=t.props,y="prototype"in T&&T.prototype.render,I=(d=T.contextType)&&r[d.__c],F=d?I?I.props.value:d.__:r,o.__c?C=(l=t.__c=o.__c).__=l.__E:(y?t.__c=l=new T(m,F):(t.__c=l=new H(m,F),l.constructor=T,l.render=ie),I&&I.sub(l),l.props=m,l.state||(l.state={}),l.context=F,l.__n=r,f=l.__d=!0,l.__h=[],l._sb=[]),y&&l.__s==null&&(l.__s=l.state),y&&T.getDerivedStateFromProps!=null&&(l.__s==l.state&&(l.__s=P({},l.__s)),P(l.__s,T.getDerivedStateFromProps(m,l.__s))),u=l.props,x=l.state,l.__v=t,f)y&&T.getDerivedStateFromProps==null&&l.componentWillMount!=null&&l.componentWillMount(),y&&l.componentDidMount!=null&&l.__h.push(l.componentDidMount);else{if(y&&T.getDerivedStateFromProps==null&&m!==u&&l.componentWillReceiveProps!=null&&l.componentWillReceiveProps(m,F),!l.__e&&(l.shouldComponentUpdate!=null&&l.shouldComponentUpdate(m,l.__s,F)===!1||t.__v===o.__v)){for(t.__v!==o.__v&&(l.props=m,l.state=l.__s,l.__d=!1),t.__e=o.__e,t.__k=o.__k,t.__k.some(function(tt){tt&&(tt.__=t)}),Q=0;Q<l._sb.length;Q++)l.__h.push(l._sb[Q]);l._sb=[],l.__h.length&&s.push(l);break t}l.componentWillUpdate!=null&&l.componentWillUpdate(m,l.__s,F),y&&l.componentDidUpdate!=null&&l.__h.push(function(){l.componentDidUpdate(u,x,W)})}if(l.context=F,l.props=m,l.__P=e,l.__e=!1,$=g.__r,Dt=0,y){for(l.state=l.__s,l.__d=!1,$&&$(t),d=l.render(l.props,l.state,l.context),Y=0;Y<l._sb.length;Y++)l.__h.push(l._sb[Y]);l._sb=[]}else do l.__d=!1,$&&$(t),d=l.render(l.props,l.state,l.context),l.state=l.__s;while(l.__d&&++Dt<25);l.state=l.__s,l.getChildContext!=null&&(r=P(P({},r),l.getChildContext())),y&&!f&&l.getSnapshotBeforeUpdate!=null&&(W=l.getSnapshotBeforeUpdate(u,x)),St(e,it(ct=d!=null&&d.type===N&&d.key==null?d.props.children:d)?ct:[ct],t,o,r,n,i,s,p,_,a),l.base=t.__e,t.__u&=-161,l.__h.length&&s.push(l),C&&(l.__E=l.__=null)}catch(tt){if(t.__v=null,_||i!=null){for(t.__u|=_?160:128;p&&p.nodeType===8&&p.nextSibling;)p=p.nextSibling;i[i.indexOf(p)]=null,t.__e=p}else t.__e=o.__e,t.__k=o.__k;g.__e(tt,t,o)}else i==null&&t.__v===o.__v?(t.__k=o.__k,t.__e=o.__e):t.__e=ne(o.__e,t,o,r,n,i,s,_,a);(d=g.diffed)&&d(t)}h(lt,"X");c(lt,"O");function Ht(e,t,o){t.__d=void 0;for(var r=0;r<o.length;r++)st(o[r],o[++r],o[++r]);g.__c&&g.__c(t,e),e.some(function(n){try{e=n.__h,n.__h=[],e.some(function(i){i.call(n)})}catch(i){g.__e(i,n.__v)}})}h(Ht,"be");c(Ht,"j");function ne(e,t,o,r,n,i,s,p,_){var a,d,l,f,u,x,W,C=o.props,m=t.props,y=t.type;if(y==="svg"?n="http://www.w3.org/2000/svg":y==="math"?n="http://www.w3.org/1998/Math/MathML":n||(n="http://www.w3.org/1999/xhtml"),i!=null){for(a=0;a<i.length;a++)if((u=i[a])&&"setAttribute"in u==!!y&&(y?u.localName===y:u.nodeType===3)){e=u,i[a]=null;break}}if(e==null){if(y===null)return document.createTextNode(m);e=document.createElementNS(n,y,m.is&&m),p&&(g.__m&&g.__m(t,i),p=!1),i=null}if(y===null)C===m||p&&e.data===m||(e.data=m);else{if(i=i&&nt.call(e.childNodes),C=o.props||j,!p&&i!=null)for(C={},a=0;a<e.attributes.length;a++)C[(u=e.attributes[a]).name]=u.value;for(a in C)if(u=C[a],a!="children"){if(a=="dangerouslySetInnerHTML")l=u;else if(!(a in m)){if(a=="value"&&"defaultValue"in m||a=="checked"&&"defaultChecked"in m)continue;z(e,a,null,u,n)}}for(a in m)u=m[a],a=="children"?f=u:a=="dangerouslySetInnerHTML"?d=u:a=="value"?x=u:a=="checked"?W=u:p&&typeof u!="function"||C[a]===u||z(e,a,u,C[a],n);if(d)p||l&&(d.__html===l.__html||d.__html===e.innerHTML)||(e.innerHTML=d.__html),t.__k=[];else if(l&&(e.innerHTML=""),St(e,it(f)?f:[f],t,o,r,y==="foreignObject"?"http://www.w3.org/1999/xhtml":n,i,s,i?i[0]:o.__k&&D(o,0),p,_),i!=null)for(a=i.length;a--;)Ct(i[a]);p||(a="value",y==="progress"&&x==null?e.removeAttribute("value"):x!==void 0&&(x!==e[a]||y==="progress"&&!x||y==="option"&&x!==C[a])&&z(e,a,x,C[a],n),a="checked",W!==void 0&&W!==e[a]&&z(e,a,W,C[a],n))}return e}h(ne,"tt");c(ne,"z");function st(e,t,o){try{if(typeof e=="function"){var r=typeof e.__u=="function";r&&e.__u(),r&&t==null||(e.__u=e(t))}else e.current=t}catch(n){g.__e(n,o)}}h(st,"ee");c(st,"N");function Wt(e,t,o){var r,n;if(g.unmount&&g.unmount(e),(r=e.ref)&&(r.current&&r.current!==e.__e||st(r,null,t)),(r=e.__c)!=null){if(r.componentWillUnmount)try{r.componentWillUnmount()}catch(i){g.__e(i,t)}r.base=r.__P=null}if(r=e.__k)for(n=0;n<r.length;n++)r[n]&&Wt(r[n],t,o||typeof e.type!="function");o||Ct(e.__e),e.__c=e.__=e.__e=e.__d=void 0}h(Wt,"Ce");c(Wt,"V");function ie(e,t,o){return this.constructor(e,o)}h(ie,"nt");c(ie,"q");function at(e,t,o){var r,n,i,s;g.__&&g.__(e,t),n=(r=typeof o=="function")?null:o&&o.__k||t.__k,i=[],s=[],lt(t,e=(!r&&o||t).__k=R(N,null,[e]),n||j,j,t.namespaceURI,!r&&o?[o]:n?null:t.firstChild?nt.call(t.childNodes):null,i,!r&&o?o:n?n.__e:t.firstChild,r,s),Ht(i,e,s)}h(at,"te");c(at,"B");nt=ee.slice,g={__e:c(function(e,t,o,r){for(var n,i,s;t=t.__;)if((n=t.__c)&&!n.__)try{if((i=n.constructor)&&i.getDerivedStateFromError!=null&&(n.setState(i.getDerivedStateFromError(e)),s=n.__d),n.componentDidCatch!=null&&(n.componentDidCatch(e,r||{}),s=n.__d),s)return n.__E=n}catch(p){e=p}throw e},"__e")},Yt=0,We=c(function(e){return e!=null&&e.constructor==null},"t"),H.prototype.setState=function(e,t){var o;o=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=P({},this.state),typeof e=="function"&&(e=e(P({},o),this.props)),e&&P(o,e),e!=null&&this.__v&&(t&&this._sb.push(t),mt(this))},H.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),mt(this))},H.prototype.render=N,L=[],te=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,dt=c(function(e,t){return e.__v.__b-t.__v.__b},"f"),q.__r=0,xt=0,ft=bt(!1),gt=bt(!0),Te=0;var M,b,ut,Mt,ot=0,le=[],v=g,It=v.__b,$t=v.__r,zt=v.diffed,Ot=v.__c,Ut=v.unmount,Vt=v.__;function G(e,t){v.__h&&v.__h(b,e,ot||t),ot=0;var o=b.__H||(b.__H={__:[],__h:[]});return e>=o.__.length&&o.__.push({}),o.__[e]}h(G,"q");c(G,"d");function Pe(e){return ot=1,se(Tt,e)}h(Pe,"He");c(Pe,"h");function se(e,t,o){var r=G(M++,2);if(r.t=e,!r.__c&&(r.__=[o?o(t):Tt(void 0,t),function(p){var _=r.__N?r.__N[0]:r.__[0],a=r.t(_,p);_!==a&&(r.__N=[a,r.__[1]],r.__c.setState({}))}],r.__c=b,!b.u)){var n=c(function(p,_,a){if(!r.__c.__H)return!0;var d=r.__c.__H.__.filter(function(f){return!!f.__c});if(d.every(function(f){return!f.__N}))return!i||i.call(this,p,_,a);var l=!1;return d.forEach(function(f){if(f.__N){var u=f.__[0];f.__=f.__N,f.__N=void 0,u!==f.__[0]&&(l=!0)}}),!(!l&&r.__c.props===p)&&(!i||i.call(this,p,_,a))},"f");b.u=!0;var i=b.shouldComponentUpdate,s=b.componentWillUpdate;b.componentWillUpdate=function(p,_,a){if(this.__e){var d=i;i=void 0,n(p,_,a),i=d}s&&s.call(this,p,_,a)},b.shouldComponentUpdate=n}return r.__N||r.__}h(se,"oe");c(se,"p");function Ae(e,t){var o=G(M++,3);!v.__s&&_t(o.__H,t)&&(o.__=e,o.i=t,b.__H.__h.push(o))}h(Ae,"De");c(Ae,"y");function Fe(e,t){var o=G(M++,4);!v.__s&&_t(o.__H,t)&&(o.__=e,o.i=t,b.__h.push(o))}h(Fe,"Te");c(Fe,"_");function ae(e,t){var o=G(M++,7);return _t(o.__H,t)&&(o.__=e(),o.__H=t,o.__h=e),o.__}h(ae,"re");c(ae,"T");function Le(e,t){return ot=8,ae(function(){return e},t)}h(Le,"Me");c(Le,"q");function _e(){for(var e;e=le.shift();)if(e.__P&&e.__H)try{e.__H.__h.forEach(V),e.__H.__h.forEach(rt),e.__H.__h=[]}catch(t){e.__H.__h=[],v.__e(t,e.__v)}}h(_e,"_t");c(_e,"j");v.__b=function(e){b=null,It&&It(e)},v.__=function(e,t){e&&t.__k&&t.__k.__m&&(e.__m=t.__k.__m),Vt&&Vt(e,t)},v.__r=function(e){$t&&$t(e),M=0;var t=(b=e.__c).__H;t&&(ut===b?(t.__h=[],b.__h=[],t.__.forEach(function(o){o.__N&&(o.__=o.__N),o.i=o.__N=void 0})):(t.__h.forEach(V),t.__h.forEach(rt),t.__h=[],M=0)),ut=b},v.diffed=function(e){zt&&zt(e);var t=e.__c;t&&t.__H&&(t.__H.__h.length&&(le.push(t)!==1&&Mt===v.requestAnimationFrame||((Mt=v.requestAnimationFrame)||he)(_e)),t.__H.__.forEach(function(o){o.i&&(o.__H=o.i),o.i=void 0})),ut=b=null},v.__c=function(e,t){t.some(function(o){try{o.__h.forEach(V),o.__h=o.__h.filter(function(r){return!r.__||rt(r)})}catch(r){t.some(function(n){n.__h&&(n.__h=[])}),t=[],v.__e(r,o.__v)}}),Ot&&Ot(e,t)},v.unmount=function(e){Ut&&Ut(e);var t,o=e.__c;o&&o.__H&&(o.__H.__.forEach(function(r){try{V(r)}catch(n){t=n}}),o.__H=void 0,t&&v.__e(t,o.__v))};var jt=typeof requestAnimationFrame=="function";function he(e){var t,o=c(function(){clearTimeout(r),jt&&cancelAnimationFrame(t),setTimeout(e)},"r"),r=setTimeout(o,100);jt&&(t=requestAnimationFrame(o))}h(he,"ot");c(he,"w");function V(e){var t=b,o=e.__c;typeof o=="function"&&(e.__c=void 0,o()),b=t}h(V,"z");c(V,"z");function rt(e){var t=b;e.__c=e.__(),b=t}h(rt,"_e");c(rt,"B");function _t(e,t){return!e||e.length!==t.length||t.some(function(o,r){return o!==e[r]})}h(_t,"ue");c(_t,"C");function Tt(e,t){return typeof t=="function"?t(e):t}h(Tt,"Ie");c(Tt,"D");function vt(e,t){for(var o in e)if(o!=="__source"&&!(o in t))return!0;for(var r in t)if(r!=="__source"&&e[r]!==t[r])return!0;return!1}h(vt,"Le");c(vt,"g");function wt(e,t){this.props=e,this.context=t}h(wt,"Oe");c(wt,"E");(wt.prototype=new H).isPureReactComponent=!0,wt.prototype.shouldComponentUpdate=function(e,t){return vt(this.props,e)||vt(this.state,t)};var qt=g.__b;g.__b=function(e){e.type&&e.type.__f&&e.ref&&(e.props.ref=e.ref,e.ref=null),qt&&qt(e)};var fo=typeof Symbol<"u"&&Symbol.for&&Symbol.for("react.forward_ref")||3911,Ne=g.__e;g.__e=function(e,t,o,r){if(e.then){for(var n,i=t;i=i.__;)if((n=i.__c)&&n.__c)return t.__e==null&&(t.__e=o.__e,t.__k=o.__k),n.__c(e,t)}Ne(e,t,o,r)};var Kt=g.unmount;function Rt(e,t,o){return e&&(e.__c&&e.__c.__H&&(e.__c.__H.__.forEach(function(r){typeof r.__c=="function"&&r.__c()}),e.__c.__H=null),(e=function(r,n){for(var i in n)r[i]=n[i];return r}({},e)).__c!=null&&(e.__c.__P===o&&(e.__c.__P=t),e.__c=null),e.__k=e.__k&&e.__k.map(function(r){return Rt(r,t,o)})),e}h(Rt,"je");c(Rt,"T");function Pt(e,t,o){return e&&o&&(e.__v=null,e.__k=e.__k&&e.__k.map(function(r){return Pt(r,t,o)}),e.__c&&e.__c.__P===t&&(e.__e&&o.appendChild(e.__e),e.__c.__e=!0,e.__c.__P=o)),e}h(Pt,"qe");c(Pt,"A");function et(){this.__u=0,this.t=null,this.__b=null}h(et,"ie");c(et,"D");function At(e){var t=e.__.__c;return t&&t.__a&&t.__a(e)}h(At,"Ge");c(At,"L");function O(){this.u=null,this.o=null}h(O,"G");c(O,"F");g.unmount=function(e){var t=e.__c;t&&t.__R&&t.__R(),t&&32&e.__u&&(e.type=null),Kt&&Kt(e)},(et.prototype=new H).__c=function(e,t){var o=t.__c,r=this;r.t==null&&(r.t=[]),r.t.push(o);var n=At(r.__v),i=!1,s=c(function(){i||(i=!0,o.__R=null,n?n(p):p())},"i");o.__R=s;var p=c(function(){if(!--r.__u){if(r.state.__a){var _=r.state.__a;r.__v.__k[0]=Pt(_,_.__c.__P,_.__c.__O)}var a;for(r.setState({__a:r.__b=null});a=r.t.pop();)a.forceUpdate()}},"c");r.__u++||32&t.__u||r.setState({__a:r.__b=r.__v.__k[0]}),e.then(s,s)},et.prototype.componentWillUnmount=function(){this.t=[]},et.prototype.render=function(e,t){if(this.__b){if(this.__v.__k){var o=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=Rt(this.__b,o,r.__O=r.__P)}this.__b=null}var n=t.__a&&R(N,null,e.fallback);return n&&(n.__u&=-33),[R(N,null,t.__a?null:e.children),n]};var Gt=c(function(e,t,o){if(++o[1]===o[0]&&e.o.delete(t),e.props.revealOrder&&(e.props.revealOrder[0]!=="t"||!e.o.size))for(o=e.u;o;){for(;o.length>3;)o.pop()();if(o[1]<o[0])break;e.u=o=o[2]}},"U");(O.prototype=new H).__a=function(e){var t=this,o=At(t.__v),r=t.o.get(e);return r[0]++,function(n){var i=c(function(){t.props.revealOrder?(r.push(n),Gt(t,e,r)):n()},"o");o?o(i):i()}},O.prototype.render=function(e){this.u=null,this.o=new Map;var t=K(e.children);e.revealOrder&&e.revealOrder[0]==="b"&&t.reverse();for(var o=t.length;o--;)this.o.set(t[o],this.u=[1,0,this.u]);return e.children},O.prototype.componentDidUpdate=O.prototype.componentDidMount=function(){var e=this;this.o.forEach(function(t,o){Gt(e,o,t)})};var De=typeof Symbol<"u"&&Symbol.for&&Symbol.for("react.element")||60103,Be=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,Me=/^on(Ani|Tra|Tou|BeforeInp|Compo)/,Ie=/[A-Z0-9]/g,$e=typeof document<"u",ze=c(function(e){return(typeof Symbol<"u"&&typeof Symbol()=="symbol"?/fil|che|rad/:/fil|che|ra/).test(e)},"Y");H.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(e){Object.defineProperty(H.prototype,e,{configurable:!0,get:c(function(){return this["UNSAFE_"+e]},"get"),set:c(function(t){Object.defineProperty(this,e,{configurable:!0,writable:!0,value:t})},"set")})});var Jt=g.event;function pe(){}h(pe,"dt");c(pe,"J");function ce(){return this.cancelBubble}h(ce,"ht");c(ce,"K");function ue(){return this.defaultPrevented}h(ue,"vt");c(ue,"Q");g.event=function(e){return Jt&&(e=Jt(e)),e.persist=pe,e.isPropagationStopped=ce,e.isDefaultPrevented=ue,e.nativeEvent=e};var de,Oe={enumerable:!1,configurable:!0,get:c(function(){return this.class},"get")},Xt=g.vnode;g.vnode=function(e){typeof e.type=="string"&&function(t){var o=t.props,r=t.type,n={},i=r.indexOf("-")===-1;for(var s in o){var p=o[s];if(!(s==="value"&&"defaultValue"in o&&p==null||$e&&s==="children"&&r==="noscript"||s==="class"||s==="className")){var _=s.toLowerCase();s==="defaultValue"&&"value"in o&&o.value==null?s="value":s==="download"&&p===!0?p="":_==="translate"&&p==="no"?p=!1:_[0]==="o"&&_[1]==="n"?_==="ondoubleclick"?s="ondblclick":_!=="onchange"||r!=="input"&&r!=="textarea"||ze(o.type)?_==="onfocus"?s="onfocusin":_==="onblur"?s="onfocusout":Me.test(s)&&(s=_):_=s="oninput":i&&Be.test(s)?s=s.replace(Ie,"-$&").toLowerCase():p===null&&(p=void 0),_==="oninput"&&n[s=_]&&(s="oninputCapture"),n[s]=p}}r=="select"&&n.multiple&&Array.isArray(n.value)&&(n.value=K(o.children).forEach(function(a){a.props.selected=n.value.indexOf(a.props.value)!=-1})),r=="select"&&n.defaultValue!=null&&(n.value=K(o.children).forEach(function(a){a.props.selected=n.multiple?n.defaultValue.indexOf(a.props.value)!=-1:n.defaultValue==a.props.value})),o.class&&!o.className?(n.class=o.class,Object.defineProperty(n,"className",Oe)):(o.className&&!o.class||o.class&&o.className)&&(n.class=n.className=o.className),t.props=n}(e),e.$$typeof=De,Xt&&Xt(e)};var Zt=g.__r;g.__r=function(e){Zt&&Zt(e),de=e.__c};var Qt=g.diffed;g.diffed=function(e){Qt&&Qt(e);var t=e.props,o=e.__e;o!=null&&e.type==="textarea"&&"value"in t&&t.value!==o.value&&(o.value=t.value==null?"":t.value),de=null};function Ue(e){return!!e.__k&&(at(null,e),!0)}h(Ue,"yt");c(Ue,"hn");var A=class extends Ve{static{h(this,"JSXWidget")}static Component=H;static createElement=R;rootNode;jsxRender(t,o){this.rootNode=at(t,o,this.rootNode)}};A.prototype._class+=" html_JSXWidget";import{select as ge}from"@hpcc-js/common";var J=class{static{h(this,"VNode")}_attrs;_children;constructor(t,o){this._attrs=t,this._children=o}type(){return"div"}attrs(){return this._attrs}attr(t){return this._attrs[t]}children(){return this._children}update(t){for(let o in this._attrs)t.attr(o,this._attrs[o])}render(t){let o=t.selectAll(`${t.node().tagName} > *`).data([this]);return o.exit().remove(),o.enter().append(this.type()).attr("reactd3",0).merge(o).each(function(r){let n=ge(this);r.update(n),r.renderChildren(n)})}renderChildren(t){let o=t.selectAll(`${t.node().tagName} > *`).data(this._children);return o.exit().remove(),o.enter().append(r=>document.createElement(r.type())).attr("reactd3",(r,n)=>n).merge(o).each(function(r){let n=ge(this);r.update(n),r.renderChildren(n)})}},Ft=class extends J{static{h(this,"ConstVNode")}_type;constructor(t,o,r){super(o,r),this._type=t}type(){return this._type}},Lt=class extends J{static{h(this,"TextVNode")}_text;constructor(t){super({},[]),this._text=t}type(){return"span"}update(t){super.update(t),t.text(this._text)}};function je(e){return typeof e=="function"}h(je,"isReactFn");function qe(e){return e.prototype&&e.prototype instanceof J}h(qe,"isIVNode");var me=class{static{h(this,"ReactD3")}static createElement(t,o,...r){return qe(t)?new t(o):je(t)?t(o):new Ft(t,o,r.map(n=>typeof n=="string"?new Lt(n):n))}static render(t,o){t.render(o)}};var ye=class extends A.Component{static{h(this,"VizComponent")}widget;refreshProps(){for(let t in this.props)this.widget[t]&&typeof this.widget[t]=="function"&&this.widget[t](this.props[t])}componentDidMount(){this.widget=new this.props.type().target(this.base),this.refreshProps(),this.widget.render()}componentWillUnmount(){this.widget.target(null).render()}render(){return R("div",{style:this.props.style})}componentDidUpdate(){this.refreshProps(),this.widget.render()}};var be=class extends A.Component{static{h(this,"VizInstance")}widget;refreshProps(){for(let t in this.props)this.widget[t]&&typeof this.widget[t]=="function"&&this.widget[t](this.props[t])}componentDidMount(){this.widget=this.props.instance.target(this.base),this.refreshProps(),this.widget.render()}componentWillUnmount(){this.widget.target(null).render()}render(){return R("div",{style:this.props.style})}componentDidUpdate(){this.refreshProps(),this.widget.render()}};import{format as ve}from"@hpcc-js/common";var E=class extends S{static{h(this,"StatsTable")}transformData(){let t=[["Total",0,0]],o=this.data();return o.forEach(r=>{t[0][1]+=r[1],t[0][2]+=r[2]}),o.concat(t).map(r=>[r[0],this.secondColumnFormat_exists()?ve(this.secondColumnFormat())(r[1]):r[1],this.thirdColumnFormat_exists()?ve(this.thirdColumnFormat())(r[2]):r[2]])}update(t,o){this.tbodyColumnStyles_default([{"font-weight":"bold",width:this.firstColumnWidth(),"text-align":"left"},{width:this.secondColumnWidth(),"text-align":"right"},{width:this.thirdColumnWidth(),"text-align":"right"}]),this.evenRowStyles_default([{"font-weight":"bold",width:this.firstColumnWidth(),"text-align":"left","font-color":this.evenRowFontColor(),"background-color":this.evenRowBackgroundColor()},{width:this.secondColumnWidth(),"text-align":"right","font-color":this.evenRowFontColor(),"background-color":this.evenRowBackgroundColor()},{width:this.thirdColumnWidth(),"text-align":"right","font-color":this.evenRowFontColor(),"background-color":this.evenRowBackgroundColor()}]),this.lastRowStyles_default({"font-weight":"bold"}),super.update(t,o)}};E.prototype._class+=" html_StatsTable";E.prototype.publish("labelColor","#333","html-color","Color of the text in the first column");E.prototype.publish("primaryValueColor","#333","html-color","Color of the text in the second column");E.prototype.publish("secondaryValueColor","#333","html-color","Color of the text in the third column");E.prototype.publish("evenRowBackgroundColor","#333","html-color","Background color of the even rows");E.prototype.publish("evenRowFontColor","#333","html-color","Font color of the even rows");E.prototype.publish("firstColumnWidth","auto","string","CSS style applied as the 'width' for the first column (ex: 40px)");E.prototype.publish("secondColumnWidth","1%","string","CSS style applied as the 'width' for the second column (ex: 40px)");E.prototype.publish("thirdColumnWidth","1%","string","CSS style applied as the 'width' for the third column (ex: 40px)");E.prototype.publish("secondColumnFormat","$,.0f","string","d3-format specifier applied to the second column's values",void 0,{optional:!0});E.prototype.publish("thirdColumnFormat",null,"string","d3-format specifier applied to the third column's values",void 0,{optional:!0});import{HTMLWidget as Ke}from"@hpcc-js/common";(function(){if(!document.getElementById("f5fc3b48")){var e=document.createElement("style");e.id="f5fc3b48",e.textContent=`#wrap
9
- {
10
- width: 100%;
11
- }
12
- #left, #right {padding:5px;}
13
-
14
- #left {
15
- background-color:red;
16
- text-align:left;
17
- display: block;
18
- text-overflow: ellipsis;
19
- white-space: nowrap;
20
- overflow: hidden;
21
- }
22
-
23
- #right {
24
- background-color:orange;
25
- float:right;
26
- text-align:right;
27
- white-space: nowrap;
28
- }
29
-
30
- .html_TitleBar > .main {
31
- width: 100%;
32
- display: block;
33
- }
34
-
35
- .html_TitleBar .title {
36
- padding:4px;
37
- text-align:left;
38
- display: block;
39
- text-overflow: ellipsis;
40
- white-space: nowrap;
41
- overflow: hidden;
42
- font-size:20px;
43
- font-weight: bold;
44
- }
45
-
46
- .html_TitleBar .icon-bar {
47
- padding:4px;
48
- float: right;
49
- text-align:right;
50
- white-space: nowrap;
51
- line-height: 28px;
52
- }
53
-
54
- .html_TitleBar .icon-bar-item {
55
- display: inline;
56
- }
57
-
58
- .html_TitleBar .icon-bar-item > div {
59
- display: inline;
60
- }
61
-
62
- .html_TitleBar .icon-bar a {
63
- text-align: center; /* Center-align text */
64
- padding-top: 4px;
65
- padding-bottom: 4px;
66
- transition: all 0.3s ease; /* Add transition for hover effects */
67
- color: darkgray; /* White text color */
68
- }
69
-
70
- .html_TitleBar .icon-bar a:hover {
71
- background-color: whitesmoke; /* Add a hover color */
72
- }
73
-
74
- .html_TitleBar .icon-bar a.selected {
75
- background-color: #efe5e5; /* Add a hover color */
76
- }
77
-
78
- .html_TitleBar .icon-bar a.spacer {
79
- text-align: center; /* Center-align text */
80
- padding-top: 2px;
81
- padding-left: 8px;
82
- padding-bottom: 0px;
83
- color: none;
84
- }
85
-
86
- .html_TitleBar .icon-bar a.spacer:hover {
87
- background-color: transparent;
88
- }
89
-
90
- .html_TitleBar .icon-bar .active {
91
- background-color: #4CAF50; /* Add an active/current color */
92
- }`,document.head.appendChild(e)}})();var X=class extends Ke{static{h(this,"Item")}_owner;constructor(t){super(),this._owner=t,this._tag="a"}};X.prototype._class+=" html_Item";var ht=class extends X{static{h(this,"Button")}_icon;constructor(t,o){super(t),this._icon=o}icon(){return this._icon}enter(t,o){super.enter(t,o),o.attr("href","#").on("click",(r,n,i)=>this._owner.titleBarClick(this,r,n,i)).append("i").attr("class",`fa ${this._icon} fa-lg fa-fw`)}};ht.prototype._class+=" html_Button";var pt=class extends ht{static{h(this,"ToggleButton")}enter(t,o){o.on("click.sel",(r,n,i)=>{this.selected(!this.selected()),this.render()}),super.enter(t,o)}update(t,o){super.update(t,o),this._element.classed("selected",this.selected())}};pt.prototype._class+=" html_ToggleButton";pt.prototype.publish("selected",!1,"boolean");var Nt=class extends X{static{h(this,"Spacer")}enter(t,o){super.enter(t,o),o.attr("class","spacer").attr("href","#").append("i")}};Nt.prototype._class+=" html_Spacer";var Z=class extends A{static{h(this,"TitleBar")}_divMain;_divIconBar;_divTitle;constructor(){super()}enter(t,o){super.enter(t,o),this._divMain=o.append("div").attr("class","main"),this._divIconBar=this._divMain.append("div").attr("class","icon-bar"),this._divTitle=this._divMain.append("div").attr("class","title")}update(t,o){super.update(t,o),this._divTitle.text(this.title());let r=this._divIconBar.selectAll(".icon-bar-item").data(this.buttons());r.enter().append("div").attr("class","icon-bar-item").each(function(n){n.target(this)}).merge(r).each(function(n){n.render()}),r.exit().each(function(n){n.target(null)}).remove(),r.order()}};Z.prototype._class+=" html_TitleBar";Z.prototype.publish("title","","string");Z.prototype.publish("buttons",[],"widgetArray");export{Ze as BUILD_VERSION,w as BreakdownTable,ht as Button,k as HTMLTooltip,X as Item,A as JSXWidget,Je as PKG_NAME,Xe as PKG_VERSION,me as ReactD3,B as SimpleTable,Nt as Spacer,E as StatsTable,S as StyledTable,Z as TitleBar,pt as ToggleButton,J as VNode,ye as VizComponent,be as VizInstance};
280
+ width:${Math.floor(99 / colCount)}%;
281
+ ">${row[0]}: ${row[1]}</div>`
282
+ ).join("")}</div>`;
283
+ });
284
+ }
285
+ update(domNode, element) {
286
+ if (this.theadColumnStyles_default([
287
+ {
288
+ color: this.thFirstColor(),
289
+ "font-size": this.thFontSize() + "px",
290
+ "font-weight": this.thFontWeight(),
291
+ "text-align": this.labelAlignment(),
292
+ width: "auto",
293
+ padding: "0px"
294
+ },
295
+ {
296
+ width: "1%",
297
+ "font-size": this.thFontSize() + "px",
298
+ "font-weight": this.thFontWeight(),
299
+ "text-align": this.percentageAlignment(),
300
+ padding: "0px"
301
+ }
302
+ ]), this.tbodyColumnStyles_default([
303
+ {
304
+ color: this.topLabelColor(),
305
+ "font-size": this.fontSize() + "px",
306
+ "font-weight": "normal",
307
+ "text-align": this.labelAlignment(),
308
+ width: "auto",
309
+ padding: "0px"
310
+ },
311
+ {
312
+ color: this.topPercentageColor(),
313
+ "font-size": this.fontSize() + "px",
314
+ "font-weight": "normal",
315
+ "text-align": this.percentageAlignment(),
316
+ width: "1%",
317
+ padding: "0px"
318
+ }
319
+ ]), this.lastRowStyles_default([
320
+ {
321
+ color: this.otherLabelColor(),
322
+ "font-size": this.fontSize() + "px",
323
+ "font-weight": this.otherLabelBold() ? "bold" : "normal",
324
+ "text-align": this.labelAlignment(),
325
+ width: "auto",
326
+ padding: "0px"
327
+ },
328
+ {
329
+ color: this.otherLabelColor(),
330
+ "font-size": this.fontSize() + "px",
331
+ "font-weight": this.otherPercentageBold() ? "bold" : "normal",
332
+ "text-align": this.percentageAlignment(),
333
+ width: "1%",
334
+ padding: "0px"
335
+ }
336
+ ]), super.update(domNode, element), (this.useCalculatedRowCount() ? this.calculateRowCount() : this.rowCount()) < this.data().length) {
337
+ const lastRow = element.select("tbody > tr:last-child"), context = this;
338
+ lastRow.on("mouseout.tooltip", (d) => {
339
+ context._tooltip._triggerElement = lastRow, context._tooltip.visible(!1).render();
340
+ }).on("mouseenter.tooltip", (d) => {
341
+ context._tooltip._triggerElement = lastRow, context._tooltip.direction("n").data(context.data()).visible(!0).render();
342
+ });
343
+ }
344
+ }
345
+ }
346
+ BreakdownTable.prototype._class += " html_BreakdownTable";
347
+ BreakdownTable.prototype.publish("useCalculatedRowCount", !0, "boolean", "If true, rowCount will be calculated and its default will be overwritten");
348
+ BreakdownTable.prototype.publish("rowCount", 5, "number", "Number of total rows to display (including the 'other' row)", void 0, { disable: (w) => w.useCalculatedRowCount() });
349
+ BreakdownTable.prototype.publish("fontSize", 14, "number", "Font size (pixels)");
350
+ BreakdownTable.prototype.publish("labelAlignment", "left", "set", "Alignment of the label column text", ["left", "center", "right"]);
351
+ BreakdownTable.prototype.publish("percentageAlignment", "center", "set", "Alignment of the percentage column text", ["left", "center", "right"]);
352
+ BreakdownTable.prototype.publish("topLabelColor", "#333", "html-color", "Color of displayed 'top' labels");
353
+ BreakdownTable.prototype.publish("topPercentageColor", "#1A99D5", "html-color", "Color of displayed 'top' percentages");
354
+ BreakdownTable.prototype.publish("topPercentageBold", !0, "html-color", "If true, the 'top' percentages will be bold");
355
+ BreakdownTable.prototype.publish("otherLabel", "Other", "string", "Label text for the 'other' row");
356
+ BreakdownTable.prototype.publish("otherLabelColor", "#AAA", "html-color", "Color of the 'other' label");
357
+ BreakdownTable.prototype.publish("otherLabelBold", !1, "html-color", "If true, the 'other' label will be bold");
358
+ BreakdownTable.prototype.publish("otherPercentageColor", "#AAA", "html-color", "Color of the 'other' percentage");
359
+ BreakdownTable.prototype.publish("otherPercentageBold", !1, "html-color", "If true, the 'other' percentage will be bold");
360
+ BreakdownTable.prototype.publish("thFontWeight", "bold", "string", "Font weight for th elements");
361
+ BreakdownTable.prototype.publish("thFontSize", 26, "number", "Font size for th elements");
362
+ BreakdownTable.prototype.publish("thFirstColor", "#333", "html-color", "Text color of the first th element");
363
+ BreakdownTable.prototype.publish("thLastColor", "#333", "html-color", "Text color of the last th element");
364
+ class JSXWidget extends HTMLWidget {
365
+ constructor() {
366
+ super(...arguments);
367
+ __publicField(this, "rootNode");
368
+ }
369
+ jsxRender(jsx, domNode) {
370
+ this.rootNode = React.render(jsx, domNode, this.rootNode);
371
+ }
372
+ }
373
+ __publicField(JSXWidget, "Component", React.Component), __publicField(JSXWidget, "createElement", React.createElement);
374
+ JSXWidget.prototype._class += " html_JSXWidget";
375
+ class VNode {
376
+ constructor(attrs, children) {
377
+ __publicField(this, "_attrs");
378
+ __publicField(this, "_children");
379
+ this._attrs = attrs, this._children = children;
380
+ }
381
+ type() {
382
+ return "div";
383
+ }
384
+ attrs() {
385
+ return this._attrs;
386
+ }
387
+ attr(key) {
388
+ return this._attrs[key];
389
+ }
390
+ children() {
391
+ return this._children;
392
+ }
393
+ update(targetElement) {
394
+ for (const key in this._attrs)
395
+ targetElement.attr(key, this._attrs[key]);
396
+ }
397
+ render(targetElement) {
398
+ const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data([this]);
399
+ return thisElement.exit().remove(), thisElement.enter().append(this.type()).attr("reactd3", 0).merge(thisElement).each(function(d) {
400
+ const element = select(this);
401
+ d.update(element), d.renderChildren(element);
402
+ });
403
+ }
404
+ renderChildren(targetElement) {
405
+ const thisElement = targetElement.selectAll(`${targetElement.node().tagName} > *`).data(this._children);
406
+ return thisElement.exit().remove(), thisElement.enter().append((d) => document.createElement(d.type())).attr("reactd3", (_d, i) => i).merge(thisElement).each(function(d) {
407
+ const element = select(this);
408
+ d.update(element), d.renderChildren(element);
409
+ });
410
+ }
411
+ }
412
+ class ConstVNode extends VNode {
413
+ constructor(type, attrs, children) {
414
+ super(attrs, children);
415
+ __publicField(this, "_type");
416
+ this._type = type;
417
+ }
418
+ type() {
419
+ return this._type;
420
+ }
421
+ }
422
+ class TextVNode extends VNode {
423
+ constructor(text) {
424
+ super({}, []);
425
+ __publicField(this, "_text");
426
+ this._text = text;
427
+ }
428
+ type() {
429
+ return "span";
430
+ }
431
+ update(targetElement) {
432
+ super.update(targetElement), targetElement.text(this._text);
433
+ }
434
+ }
435
+ function isReactFn(_) {
436
+ return typeof _ == "function";
437
+ }
438
+ function isIVNode(_) {
439
+ return _.prototype && _.prototype instanceof VNode;
440
+ }
441
+ class ReactD3 {
442
+ // static createElementXXX(type: string | ReactFn | IVNode, attrs: { [key: string]: string }, ...children: Array<string | VNode>): VNode {
443
+ static createElement(type, attrs, ...children) {
444
+ return isIVNode(type) ? new type(attrs) : isReactFn(type) ? type(attrs) : new ConstVNode(type, attrs, children.map((child) => typeof child == "string" ? new TextVNode(child) : child));
445
+ }
446
+ static render(vdom, targetElement) {
447
+ vdom.render(targetElement);
448
+ }
449
+ }
450
+ var l;
451
+ l = { __e: function(n, l2, u2, t) {
452
+ for (var i, o, r; l2 = l2.__; ) if ((i = l2.__c) && !i.__) try {
453
+ if ((o = i.constructor) && o.getDerivedStateFromError != null && (i.setState(o.getDerivedStateFromError(n)), r = i.__d), i.componentDidCatch != null && (i.componentDidCatch(n, t || {}), r = i.__d), r) return i.__E = i;
454
+ } catch (l3) {
455
+ n = l3;
456
+ }
457
+ throw n;
458
+ } }, typeof Promise == "function" && Promise.prototype.then.bind(Promise.resolve());
459
+ var f = 0;
460
+ function u(e, t, n, o, i, u2) {
461
+ t || (t = {});
462
+ var a, l$1 = t;
463
+ "ref" in t && (a = t.ref, delete t.ref);
464
+ var p = { type: e, props: l$1, key: n, ref: a, __k: null, __: null, __b: 0, __e: null, __d: void 0, __c: null, constructor: void 0, __v: --f, __i: -1, __u: 0, __source: i, __self: u2 };
465
+ return l.vnode && l.vnode(p), p;
466
+ }
467
+ class VizComponent extends JSXWidget.Component {
468
+ constructor() {
469
+ super(...arguments);
470
+ __publicField(this, "widget");
471
+ }
472
+ refreshProps() {
473
+ for (const key in this.props)
474
+ this.widget[key] && typeof this.widget[key] == "function" && this.widget[key](this.props[key]);
475
+ }
476
+ componentDidMount() {
477
+ this.widget = new this.props.type().target(this.base), this.refreshProps(), this.widget.render();
478
+ }
479
+ componentWillUnmount() {
480
+ this.widget.target(null).render();
481
+ }
482
+ render() {
483
+ return /* @__PURE__ */ u("div", { style: this.props.style });
484
+ }
485
+ componentDidUpdate() {
486
+ this.refreshProps(), this.widget.render();
487
+ }
488
+ }
489
+ class VizInstance extends JSXWidget.Component {
490
+ constructor() {
491
+ super(...arguments);
492
+ __publicField(this, "widget");
493
+ }
494
+ refreshProps() {
495
+ for (const key in this.props)
496
+ this.widget[key] && typeof this.widget[key] == "function" && this.widget[key](this.props[key]);
497
+ }
498
+ componentDidMount() {
499
+ this.widget = this.props.instance.target(this.base), this.refreshProps(), this.widget.render();
500
+ }
501
+ componentWillUnmount() {
502
+ this.widget.target(null).render();
503
+ }
504
+ render() {
505
+ return /* @__PURE__ */ u("div", { style: this.props.style });
506
+ }
507
+ componentDidUpdate() {
508
+ this.refreshProps(), this.widget.render();
509
+ }
510
+ }
511
+ class StatsTable extends StyledTable {
512
+ transformData() {
513
+ const totalRow = [["Total", 0, 0]], data = this.data();
514
+ return data.forEach((row) => {
515
+ totalRow[0][1] += row[1], totalRow[0][2] += row[2];
516
+ }), data.concat(totalRow).map((row) => [
517
+ row[0],
518
+ this.secondColumnFormat_exists() ? format(this.secondColumnFormat())(row[1]) : row[1],
519
+ this.thirdColumnFormat_exists() ? format(this.thirdColumnFormat())(row[2]) : row[2]
520
+ ]);
521
+ }
522
+ update(domNode, element) {
523
+ this.tbodyColumnStyles_default([
524
+ {
525
+ "font-weight": "bold",
526
+ width: this.firstColumnWidth(),
527
+ "text-align": "left"
528
+ },
529
+ {
530
+ width: this.secondColumnWidth(),
531
+ "text-align": "right"
532
+ },
533
+ {
534
+ width: this.thirdColumnWidth(),
535
+ "text-align": "right"
536
+ }
537
+ ]), this.evenRowStyles_default([
538
+ {
539
+ "font-weight": "bold",
540
+ width: this.firstColumnWidth(),
541
+ "text-align": "left",
542
+ "font-color": this.evenRowFontColor(),
543
+ "background-color": this.evenRowBackgroundColor()
544
+ },
545
+ {
546
+ width: this.secondColumnWidth(),
547
+ "text-align": "right",
548
+ "font-color": this.evenRowFontColor(),
549
+ "background-color": this.evenRowBackgroundColor()
550
+ },
551
+ {
552
+ width: this.thirdColumnWidth(),
553
+ "text-align": "right",
554
+ "font-color": this.evenRowFontColor(),
555
+ "background-color": this.evenRowBackgroundColor()
556
+ }
557
+ ]), this.lastRowStyles_default({
558
+ "font-weight": "bold"
559
+ }), super.update(domNode, element);
560
+ }
561
+ }
562
+ StatsTable.prototype._class += " html_StatsTable";
563
+ StatsTable.prototype.publish("labelColor", "#333", "html-color", "Color of the text in the first column");
564
+ StatsTable.prototype.publish("primaryValueColor", "#333", "html-color", "Color of the text in the second column");
565
+ StatsTable.prototype.publish("secondaryValueColor", "#333", "html-color", "Color of the text in the third column");
566
+ StatsTable.prototype.publish("evenRowBackgroundColor", "#333", "html-color", "Background color of the even rows");
567
+ StatsTable.prototype.publish("evenRowFontColor", "#333", "html-color", "Font color of the even rows");
568
+ StatsTable.prototype.publish("firstColumnWidth", "auto", "string", "CSS style applied as the 'width' for the first column (ex: 40px)");
569
+ StatsTable.prototype.publish("secondColumnWidth", "1%", "string", "CSS style applied as the 'width' for the second column (ex: 40px)");
570
+ StatsTable.prototype.publish("thirdColumnWidth", "1%", "string", "CSS style applied as the 'width' for the third column (ex: 40px)");
571
+ StatsTable.prototype.publish("secondColumnFormat", "$,.0f", "string", "d3-format specifier applied to the second column's values", void 0, { optional: !0 });
572
+ StatsTable.prototype.publish("thirdColumnFormat", null, "string", "d3-format specifier applied to the third column's values", void 0, { optional: !0 });
573
+ class Item extends HTMLWidget {
574
+ constructor(owner) {
575
+ super();
576
+ __publicField(this, "_owner");
577
+ this._owner = owner, this._tag = "a";
578
+ }
579
+ }
580
+ Item.prototype._class += " html_Item";
581
+ class Button extends Item {
582
+ constructor(owner, icon) {
583
+ super(owner);
584
+ __publicField(this, "_icon");
585
+ this._icon = icon;
586
+ }
587
+ icon() {
588
+ return this._icon;
589
+ }
590
+ enter(domNode, element) {
591
+ 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`);
592
+ }
593
+ }
594
+ Button.prototype._class += " html_Button";
595
+ class ToggleButton extends Button {
596
+ enter(domNode, element) {
597
+ element.on("click.sel", (d, idx, groups) => {
598
+ this.selected(!this.selected()), this.render();
599
+ }), super.enter(domNode, element);
600
+ }
601
+ update(domNode, element) {
602
+ super.update(domNode, element), this._element.classed("selected", this.selected());
603
+ }
604
+ }
605
+ ToggleButton.prototype._class += " html_ToggleButton";
606
+ ToggleButton.prototype.publish("selected", !1, "boolean");
607
+ class Spacer extends Item {
608
+ enter(domNode, element) {
609
+ super.enter(domNode, element), element.attr("class", "spacer").attr("href", "#").append("i");
610
+ }
611
+ }
612
+ Spacer.prototype._class += " html_Spacer";
613
+ class TitleBar extends JSXWidget {
614
+ constructor() {
615
+ super();
616
+ __publicField(this, "_divMain");
617
+ __publicField(this, "_divIconBar");
618
+ __publicField(this, "_divTitle");
619
+ }
620
+ enter(domNode, element) {
621
+ 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");
622
+ }
623
+ update(domNode, element) {
624
+ super.update(domNode, element), this._divTitle.text(this.title());
625
+ const icons = this._divIconBar.selectAll(".icon-bar-item").data(this.buttons());
626
+ icons.enter().append("div").attr("class", "icon-bar-item").each(function(d) {
627
+ d.target(this);
628
+ }).merge(icons).each(function(d) {
629
+ d.render();
630
+ }), icons.exit().each(function(d) {
631
+ d.target(null);
632
+ }).remove(), icons.order();
633
+ }
634
+ }
635
+ TitleBar.prototype._class += " html_TitleBar";
636
+ TitleBar.prototype.publish("title", "", "string");
637
+ TitleBar.prototype.publish("buttons", [], "widgetArray");
638
+ export {
639
+ BUILD_VERSION,
640
+ BreakdownTable,
641
+ Button,
642
+ HTMLTooltip,
643
+ Item,
644
+ JSXWidget,
645
+ PKG_NAME,
646
+ PKG_VERSION,
647
+ ReactD3,
648
+ SimpleTable,
649
+ Spacer,
650
+ StatsTable,
651
+ StyledTable,
652
+ TitleBar,
653
+ ToggleButton,
654
+ VNode,
655
+ VizComponent,
656
+ VizInstance
657
+ };
93
658
  //# sourceMappingURL=index.js.map