@nyaruka/temba-components 0.126.0 → 0.127.0

package/CHANGELOG.md

@@ -4,8 +4,18 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### [v0.127.0](https://github.com/nyaruka/temba-components/compare/v0.126.0...v0.127.0)
+
+- Configure max ticks, add auto date format option [`#579`](https://github.com/nyaruka/temba-components/pull/579)
+- Only snap on drop [`#576`](https://github.com/nyaruka/temba-components/pull/576)
+- Configure max x ticks, some formatting [`af6ffe4`](https://github.com/nyaruka/temba-components/commit/af6ffe463cc3ef1c6b09e18eb5e515ccb8b66d95)
+- Remove problematic test [`b42421a`](https://github.com/nyaruka/temba-components/commit/b42421ab4b04fd62b71efc772594079f4e55271b)
+- Disable flaky test [`b86ac02`](https://github.com/nyaruka/temba-components/commit/b86ac02202c22c931952a57310639943f0f23431)
+
 #### [v0.126.0](https://github.com/nyaruka/temba-components/compare/v0.125.0...v0.126.0)
 
+> 19 June 2025
+
 - Add xtype and xformat to TembaChart [`#575`](https://github.com/nyaruka/temba-components/pull/575)
 - Add snap to grid for node movement [`#574`](https://github.com/nyaruka/temba-components/pull/574)
 - Add flow saving for dev server [`#573`](https://github.com/nyaruka/temba-components/pull/573)

package/demo/chart/example.html

@@ -50,7 +50,19 @@
     <div class="example">
       <h3>Summation Chart</h3>
       <p>A basic chart, summing all datasets</p>
-      <temba-chart url="../data/server/opened-tickets.json"></temba-chart>
+      <temba-chart
+        url="../data/server/opened-tickets.json"
+        xtype="time"
+      ></temba-chart>
+    </div>
+
+    <div class="example">
+      <h3>Summation Chart</h3>
+      <p>Auto date format, spanning year</p>
+      <temba-chart
+        url="../data/server/opened-tickets-long.json"
+        xtype="time"
+      ></temba-chart>
     </div>
 
     <div class="example">
@@ -61,6 +73,7 @@
         dataname="Tickets"
         config
         legend
+        xtype="time"
       ></temba-chart>
     </div>
 
@@ -73,6 +86,7 @@
         splits="Tracking,Orders"
         hideother
         legend
+        xtype="time"
       ></temba-chart>
     </div>
     <div class="example">
@@ -83,6 +97,7 @@
         dataname="Tickets"
         showall
         legend
+        xtype="time"
       ></temba-chart>
     </div>
 
@@ -97,6 +112,7 @@
         dataname="Average Response"
         formatDuration
         header="Response Time"
+        xtype="time"
         url="../data/server/response-time.json"
       ></temba-chart>
       <p>Here is the same duration chart, but as a line chart</p>
@@ -106,6 +122,7 @@
         single
         dataName="Average Response"
         formatDuration
+        xtype="time"
         url="../data/server/response-time.json"
       ></temba-chart>
     </div>

package/demo/data/flows/sample-flow.json

@@ -858,7 +858,7 @@
           "type": "split_by_groups",
           "position": {
             "left": 640,
-            "top": 320
+            "top": 300
           },
           "config": {
             "cases": {}

package/demo/data/server/opened-tickets-long.json

@@ -0,0 +1,53 @@
+{
+  "period": ["2023-12-31", "2025-06-07"],
+  "data": {
+    "labels": [
+      "2023-12-31",
+      "2025-05-27",
+      "2025-05-28",
+      "2025-05-29",
+      "2025-05-30",
+      "2025-05-31",
+      "2025-06-01",
+      "2025-06-02",
+      "2025-06-03",
+      "2025-06-04",
+      "2025-06-05",
+      "2025-06-06"
+    ],
+    "datasets": [
+      {
+        "label": "General",
+        "data": [31, 141, 60, 20, 49, 92, 109, 140, 214, 60, 70]
+      },
+      {
+        "label": "VIPs",
+        "data": [9, 97, 95, 55, 32, 61, 78, 115, 20, 91, 83]
+      },
+      {
+        "label": "Orders",
+        "data": [51, 84, 71, 78, 44, 45, 106, 114, 138, 125, 83]
+      },
+      {
+        "label": "Survey",
+        "data": [57, 31, 42, 63, 32, 11, 52, 35, 14, 160, 15]
+      },
+      {
+        "label": "Tracking",
+        "data": [10, 26, 28, 43, 16, 10, 36, 24, 18, 26, 9]
+      },
+      {
+        "label": "Birds",
+        "data": [31, 141, 60, 20, 49, 92, 109, 140, 214, 60, 70]
+      },
+      {
+        "label": "Dogs",
+        "data": [9, 97, 95, 55, 32, 61, 78, 115, 20, 91, 83]
+      },
+      {
+        "label": "Cats",
+        "data": [51, 84, 71, 78, 44, 45, 106, 114, 138, 125, 83]
+      }
+    ]
+  }
+}

package/dist/temba-components.js

@@ -8155,7 +8155,7 @@ const{I:hd}=at,dd=()=>document.createComment(""),ud=(t,e,i)=>{const n=t._$AA.par
         padding-top: 10px;
         margin-bottom: -10px;
       }
-  }`}updated(t){if(super.updated(t),t.has("node")){this.plumber.makeTarget(this.node.uuid);for(const t of this.node.exits)t.destination_uuid?this.plumber.connectIds(t.uuid,t.destination_uuid):this.plumber.makeSource(t.uuid);const t=this.querySelector(".node").getBoundingClientRect();_a().getState().expandCanvas(this.ui.position.left+t.width,this.ui.position.top+t.height),this.addDragEventListeners()}}addDragEventListeners(){const t=this.querySelector(".node");t&&(t.addEventListener("mousedown",this.handleMouseDown.bind(this)),document.addEventListener("mousemove",this.boundMouseMove),document.addEventListener("mouseup",this.boundMouseUp))}handleMouseDown(t){const e=t.target;if(e.classList.contains("exit")||e.closest(".exit"))return;this.isDragging=!0,this.dragStartPos={x:t.clientX,y:t.clientY},this.nodeStartPos={left:this.ui.position.left,top:this.ui.position.top};const i=this.querySelector(".node");i&&i.classList.add("dragging"),this.plumber&&this.plumber.elevateNodeConnections(this.node.uuid),t.preventDefault(),t.stopPropagation()}handleMouseMove(t){if(!this.isDragging)return;const e=t.clientX-this.dragStartPos.x,i=t.clientY-this.dragStartPos.y,n=this.nodeStartPos.left+e,o=this.nodeStartPos.top+i,s=this.snapToGrid(n),r=this.snapToGrid(o),a=this.querySelector(".node");a&&(a.style.left=`${s}px`,a.style.top=`${r}px`),this.plumber&&this.plumber.repaintEverything()}handleMouseUp(t){if(!this.isDragging)return;this.isDragging=!1;const e=this.querySelector(".node");e&&e.classList.remove("dragging"),this.plumber&&this.plumber.restoreNodeConnections(this.node.uuid);const i=t.clientX-this.dragStartPos.x,n=t.clientY-this.dragStartPos.y,o=this.nodeStartPos.left+i,s=this.nodeStartPos.top+n,r={left:this.snapToGrid(o),top:this.snapToGrid(s)};_a().getState().updateCanvasPositions({[this.node.uuid]:r}),this.plumber&&this.plumber.repaintEverything(),_a().getState().updateNodePosition(this.node.uuid,r)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("mousemove",this.boundMouseMove),document.removeEventListener("mouseup",this.boundMouseUp)}renderTitle(t){return U`<div class="title" style="background:${t.color}">
+  }`}updated(t){if(super.updated(t),t.has("node")){this.plumber.makeTarget(this.node.uuid);for(const t of this.node.exits)t.destination_uuid?this.plumber.connectIds(t.uuid,t.destination_uuid):this.plumber.makeSource(t.uuid);const t=this.querySelector(".node").getBoundingClientRect();_a().getState().expandCanvas(this.ui.position.left+t.width,this.ui.position.top+t.height),this.addDragEventListeners()}}addDragEventListeners(){const t=this.querySelector(".node");t&&(t.addEventListener("mousedown",this.handleMouseDown.bind(this)),document.addEventListener("mousemove",this.boundMouseMove),document.addEventListener("mouseup",this.boundMouseUp))}handleMouseDown(t){const e=t.target;if(e.classList.contains("exit")||e.closest(".exit"))return;this.isDragging=!0,this.dragStartPos={x:t.clientX,y:t.clientY},this.nodeStartPos={left:this.ui.position.left,top:this.ui.position.top};const i=this.querySelector(".node");i&&i.classList.add("dragging"),this.plumber&&this.plumber.elevateNodeConnections(this.node.uuid),t.preventDefault(),t.stopPropagation()}handleMouseMove(t){if(!this.isDragging)return;const e=t.clientX-this.dragStartPos.x,i=t.clientY-this.dragStartPos.y,n=this.nodeStartPos.left+e,o=this.nodeStartPos.top+i,s=this.querySelector(".node");s&&(s.style.left=`${n}px`,s.style.top=`${o}px`),this.plumber&&this.plumber.repaintEverything()}handleMouseUp(t){if(!this.isDragging)return;this.isDragging=!1;const e=this.querySelector(".node");e&&e.classList.remove("dragging"),this.plumber&&this.plumber.restoreNodeConnections(this.node.uuid);const i=t.clientX-this.dragStartPos.x,n=t.clientY-this.dragStartPos.y,o=this.nodeStartPos.left+i,s=this.nodeStartPos.top+n,r={left:this.snapToGrid(o),top:this.snapToGrid(s)};_a().getState().updateCanvasPositions({[this.node.uuid]:r}),this.plumber&&this.plumber.repaintEverything(),_a().getState().updateNodePosition(this.node.uuid,r)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("mousemove",this.boundMouseMove),document.removeEventListener("mouseup",this.boundMouseUp)}renderTitle(t){return U`<div class="title" style="background:${t.color}">
       ${t.name}
     </div>`}renderAction(t,e){const i=lb[e.type];return i?U`<div class="action ${e.type}">
         ${this.renderTitle(i)}
@@ -8748,7 +8748,7 @@ var UE=function(){if("undefined"!=typeof window){if(window.devicePixelRatio)retu
         padding: 2em 1em 1.5em 1em;
         max-height: 50px;
       }
-    `}constructor(){super(),this.chartType="bar",this.header="",this.other=!1,this.datasets=[],this.maxSplits=2,this.xType="category",this.yType="count",this.xFormat="MMM dd",this.hideOther=!1,this.splits=[],this.dataname="Counts",this.single=!1,this.legend=!1,this.config=!1,this.showAll=!1,this.colorIndex=0,this.showConfig=!1,this.opacity=1,this.seriesBorderRadius=2,this.seriesBorderWidth=1,this.showPercent=!1}firstUpdated(t){super.firstUpdated(t);const e=this.shadowRoot.querySelector("#canvas-wrapper");this.canvas=document.createElement("canvas"),this.canvas.setAttribute("height","300px"),e.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d")}updated(t){if(super.updated(t),t.has("splitNames")&&(this.splits=this.splitNames.split(",").map((t=>t.trim()))),(t.has("data")||t.has("splits"))&&this.calculateSplits(),t.has("datasets")&&this.updateChart(),t.has("url")){_a().getUrl(this.url,{skipCache:!0}).then((t=>{this.data=t.json.data}))}if(t.has("chartType")&&"line"===this.chartType&&(this.seriesBorderWidth=Math.max(1,this.seriesBorderWidth)),t.has("showPercent")&&this.chart){const t=this.chart.options.scales.y;t.ticks.display=!this.showPercent,t.grid.display=!this.showPercent,t.border.display=!this.showPercent,t.max=this.showPercent?this.getInflatedMax():void 0,this.chart.update()}}get colors(){const t=MA[this.palette]||MA["qualitative-set1"],e=Math.max(0,Math.min(1,this.opacity)),i=t.map((t=>ce(t,.25))),n=t.map((t=>{if(t.startsWith("rgba"))return t.replace(/rgba\(([^,]+),([^,]+),([^,]+),([^)]+)\)/,((t,i,n,o)=>`rgba(${i},${n},${o},${e})`));if(t.startsWith("rgb("))return t.replace(/rgb\(([^,]+),([^,]+),([^,]+)\)/,((t,i,n,o)=>`rgba(${i},${n},${o},${e})`));if(t.startsWith("#")){let i=t.replace("#","");3===i.length&&(i=i.split("").map((t=>t+t)).join(""));const n=parseInt(i,16);return`rgba(${n>>16&255},${n>>8&255},${255&n},${e})`}return t}));return[n,i]}calculateSplits(){if(this.data){const t=[],e=[],[i,n]=this.colors;for(const o of this.data.datasets)if(this.showAll||void 0!==this.splits.find((t=>t===o.label))){const e=(t.length+this.colorIndex)%i.length,s=i[e],r=n[e];t.push({...o,backgroundColor:s,borderColor:r,borderWidth:this.seriesBorderWidth,borderRadius:this.seriesBorderRadius})}else for(let t=0;t<o.data.length;t++)void 0===e[t]?e[t]=o.data[t]:e[t]+=o.data[t];if(0===t.length){const o=this.colorIndex%i.length;t.push({label:this.single?this.dataname:`All ${this.dataname}`,data:e,backgroundColor:i[o],borderColor:n[o],borderWidth:this.seriesBorderWidth,borderRadius:this.seriesBorderRadius})}else this.hideOther||this.showAll||t.push({label:"Other",data:e,backgroundColor:TA,borderColor:ce(TA,.05),borderWidth:1,borderRadius:this.seriesBorderRadius});this.datasets=t}}updateChart(){var t;if((null===(t=this.datasets)||void 0===t?void 0:t.length)>0){const t=this.datasets.reduce(((t,e)=>t+e.data.reduce(((t,e)=>t+(null!=e?e:0)),0)),0)||void 0,e=e=>{const i=t?e/t*100:0;return`${Math.round(i)}%`};if(this.chart){this.chart.data.labels=this.data.labels,this.chart.data.datasets=this.datasets,this.showPercent&&(this.chart.options.scales.y.max=this.getInflatedMax());const t=this.chart.options.plugins.datalabels||{};t.display=this.showPercent,this.showPercent?t.formatter=e:delete t.formatter,this.chart.options.plugins.datalabels=t,this.chart.update()}else{const t={type:this.chartType,data:{labels:this.data.labels,datasets:this.datasets},options:{maxBarThickness:80,plugins:{legend:{display:this.legend},tooltip:{callbacks:{label:t=>{const e=t.dataset.label||"",i=t.parsed.y;return"duration"===this.yType?`${e}: ${PA(i)}`:`${e}: ${i}`}}},datalabels:{display:this.showPercent,anchor:"end",align:"end",offset:-3,clamp:!0,...this.showPercent&&{formatter:e},color:"#666",font:{weight:"600"}}},responsive:!0,maintainAspectRatio:!1,animations:{x:{duration:0},y:{duration:200,easing:"easeOutCubic"}},scales:{y:{min:0,...this.showPercent&&{max:this.getInflatedMax()},stacked:!0,grid:{color:"rgba(0,0,0,0.04)",display:!this.showPercent,drawBorder:!this.showPercent},border:{display:!this.showPercent},ticks:{display:!this.showPercent,..."duration"===this.yType&&!this.showPercent&&{callback:t=>PA(t)}}},x:{type:this.xType,grid:{display:!1},stacked:!0,..."time"===this.xType&&{time:{unit:"day",tooltipFormat:"DDD",displayFormats:{day:this.xFormat}}}}}}};this.chart=new VS(this.ctx,t)}}}handleSplitsChanged(t){const e=t.target;this.splits=e.values.map((t=>t.value))}handleToggleConfig(){this.showConfig=!this.showConfig,this.showConfig||(this.splits=[])}render(){var t,e,i;return U`<div>
+    `}constructor(){super(),this.chartType="bar",this.header="",this.other=!1,this.datasets=[],this.maxSplits=2,this.xType="category",this.xMaxTicks=10,this.yType="count",this.xFormat="auto",this.hideOther=!1,this.splits=[],this.dataname="Counts",this.single=!1,this.legend=!1,this.config=!1,this.showAll=!1,this.colorIndex=0,this.showConfig=!1,this.opacity=1,this.seriesBorderRadius=2,this.seriesBorderWidth=1,this.showPercent=!1}firstUpdated(t){super.firstUpdated(t);const e=this.shadowRoot.querySelector("#canvas-wrapper");this.canvas=document.createElement("canvas"),this.canvas.setAttribute("height","300px"),e.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d")}updated(t){if(super.updated(t),t.has("splitNames")&&(this.splits=this.splitNames.split(",").map((t=>t.trim()))),(t.has("data")||t.has("splits"))&&this.calculateSplits(),t.has("datasets")&&this.updateChart(),t.has("url")){_a().getUrl(this.url,{skipCache:!0}).then((t=>{this.data=t.json.data}))}if(t.has("chartType")&&"line"===this.chartType&&(this.seriesBorderWidth=Math.max(1,this.seriesBorderWidth)),t.has("showPercent")&&this.chart){const t=this.chart.options.scales.y;t.ticks.display=!this.showPercent,t.grid.display=!this.showPercent,t.border.display=!this.showPercent,t.max=this.showPercent?this.getInflatedMax():void 0,this.chart.update()}}get colors(){const t=MA[this.palette]||MA["qualitative-set1"],e=Math.max(0,Math.min(1,this.opacity)),i=t.map((t=>ce(t,.25))),n=t.map((t=>{if(t.startsWith("rgba"))return t.replace(/rgba\(([^,]+),([^,]+),([^,]+),([^)]+)\)/,((t,i,n,o)=>`rgba(${i},${n},${o},${e})`));if(t.startsWith("rgb("))return t.replace(/rgb\(([^,]+),([^,]+),([^,]+)\)/,((t,i,n,o)=>`rgba(${i},${n},${o},${e})`));if(t.startsWith("#")){let i=t.replace("#","");3===i.length&&(i=i.split("").map((t=>t+t)).join(""));const n=parseInt(i,16);return`rgba(${n>>16&255},${n>>8&255},${255&n},${e})`}return t}));return[n,i]}calculateSplits(){if(this.data){const t=[],e=[],[i,n]=this.colors;for(const o of this.data.datasets)if(this.showAll||void 0!==this.splits.find((t=>t===o.label))){const e=(t.length+this.colorIndex)%i.length,s=i[e],r=n[e];t.push({...o,backgroundColor:s,borderColor:r,borderWidth:this.seriesBorderWidth,borderRadius:this.seriesBorderRadius})}else for(let t=0;t<o.data.length;t++)void 0===e[t]?e[t]=o.data[t]:e[t]+=o.data[t];if(0===t.length){const o=this.colorIndex%i.length;t.push({label:this.single?this.dataname:`All ${this.dataname}`,data:e,backgroundColor:i[o],borderColor:n[o],borderWidth:this.seriesBorderWidth,borderRadius:this.seriesBorderRadius})}else this.hideOther||this.showAll||t.push({label:"Other",data:e,backgroundColor:TA,borderColor:ce(TA,.05),borderWidth:1,borderRadius:this.seriesBorderRadius});this.datasets=t}}updateChart(){var t;if((null===(t=this.datasets)||void 0===t?void 0:t.length)>0){const t=this.datasets.reduce(((t,e)=>t+e.data.reduce(((t,e)=>t+(null!=e?e:0)),0)),0)||void 0,e=e=>{const i=t?e/t*100:0;return 0===i?"":`${Math.round(i)}%`};if(this.chart){this.chart.data.labels=this.data.labels,this.chart.data.datasets=this.datasets,this.showPercent&&(this.chart.options.scales.y.max=this.getInflatedMax());const t=this.chart.options.plugins.datalabels||{};t.display=this.showPercent,this.showPercent?t.formatter=e:delete t.formatter,this.chart.options.plugins.datalabels=t,this.chart.update()}else{let t=this.xFormat;if("time"===this.xType&&"auto"===this.xFormat){const e=this.data.labels[0],i=this.data.labels[this.data.labels.length-1],n=Date.parse(e),o=Date.parse(i);t="MMM dd",Math.ceil((o-n)/864e5)>365&&(t="MMM yyyy")}const i={type:this.chartType,data:{labels:this.data.labels,datasets:this.datasets},options:{maxBarThickness:80,plugins:{legend:{display:this.legend},tooltip:{callbacks:{label:t=>{const e=t.dataset.label||"",i=t.parsed.y;return"duration"===this.yType?`${e}: ${PA(i)}`:`${e}: ${i}`}}},datalabels:{display:this.showPercent,anchor:"end",align:"end",offset:-3,clamp:!0,...this.showPercent&&{formatter:e},color:"#666",font:{weight:"600"}}},responsive:!0,maintainAspectRatio:!1,animations:{x:{duration:0},y:{duration:200,easing:"easeOutCubic"}},scales:{y:{min:0,...this.showPercent&&{max:this.getInflatedMax()},stacked:!0,grid:{color:"rgba(0,0,0,0.04)",display:!this.showPercent,drawBorder:!this.showPercent},border:{display:!this.showPercent},ticks:{display:!this.showPercent,..."duration"===this.yType&&!this.showPercent&&{callback:t=>PA(t)}}},x:{type:this.xType,grid:{display:!1},stacked:!0,ticks:{maxTicksLimit:this.xMaxTicks},..."time"===this.xType&&{time:{unit:"day",tooltipFormat:"DDD",displayFormats:{day:t}}}}}}};this.chart=new VS(this.ctx,i)}}}handleSplitsChanged(t){const e=t.target;this.splits=e.values.map((t=>t.value))}handleToggleConfig(){this.showConfig=!this.showConfig,this.showConfig||(this.splits=[])}render(){var t,e,i;return U`<div>
       ${this.header?U`<div class="chart-title">${this.header}</div>`:null}
       <div id="canvas-wrapper"></div>
       ${this.config&&this.data?U`
@@ -8780,7 +8780,7 @@ var UE=function(){if("undefined"!=typeof window){if(window.devicePixelRatio)retu
         </temba-select>
         <div></div>
       </div>
-    </div>`}}function DA(t,e){window.customElements.get(t)||window.customElements.define(t,e)}t([ue({type:String})],OA.prototype,"chartType",void 0),t([ue({type:String})],OA.prototype,"url",void 0),t([ue({type:String})],OA.prototype,"header",void 0),t([ue({type:Boolean})],OA.prototype,"other",void 0),t([ue({type:Object})],OA.prototype,"data",void 0),t([pe()],OA.prototype,"datasets",void 0),t([ue({type:Number})],OA.prototype,"maxSplits",void 0),t([ue({type:String,attribute:"splits"})],OA.prototype,"splitNames",void 0),t([ue({type:String})],OA.prototype,"xType",void 0),t([ue({type:String})],OA.prototype,"yType",void 0),t([ue({type:String})],OA.prototype,"xFormat",void 0),t([ue({type:Boolean})],OA.prototype,"hideOther",void 0),t([pe()],OA.prototype,"splits",void 0),t([ue({type:String})],OA.prototype,"dataname",void 0),t([ue({type:Boolean})],OA.prototype,"single",void 0),t([ue({type:Boolean})],OA.prototype,"legend",void 0),t([ue({type:Boolean})],OA.prototype,"config",void 0),t([ue({type:Boolean})],OA.prototype,"showAll",void 0),t([ue({type:Number})],OA.prototype,"colorIndex",void 0),t([pe()],OA.prototype,"showConfig",void 0),t([ue({type:String})],OA.prototype,"palette",void 0),t([ue({type:Number})],OA.prototype,"opacity",void 0),t([ue({type:Number})],OA.prototype,"seriesBorderRadius",void 0),t([ue({type:Number})],OA.prototype,"seriesBorderWidth",void 0),t([ue({type:Boolean,attribute:"percent"})],OA.prototype,"showPercent",void 0),DA("temba-anchor",wh),DA("temba-alert",dh),DA("temba-store",wa),DA("temba-textinput",Ie),DA("temba-datepicker",Fh),DA("temba-date",Yh),DA("temba-completion",pc),DA("temba-checkbox",be),DA("temba-select",uc),DA("temba-options",ka),DA("temba-loading",xc),DA("temba-lightbox",Kh),DA("temba-button",yc),DA("temba-omnibox",gh),DA("temba-tip",bh),DA("temba-contact-name",Ah),DA("temba-contact-name-fetch",jh),DA("temba-contact-field",Oh),DA("temba-contact-fields",Th),DA("temba-field-manager",Hh),DA("temba-urn",Mh),DA("temba-content-menu",Gh),DA("temba-field",bc),DA("temba-dialog",gc),DA("temba-modax",vc),DA("temba-charcount",Tc),DA("temba-contact-chat",rh),DA("temba-contact-details",class extends Dc{static get styles(){return a`
+    </div>`}}function DA(t,e){window.customElements.get(t)||window.customElements.define(t,e)}t([ue({type:String})],OA.prototype,"chartType",void 0),t([ue({type:String})],OA.prototype,"url",void 0),t([ue({type:String})],OA.prototype,"header",void 0),t([ue({type:Boolean})],OA.prototype,"other",void 0),t([ue({type:Object})],OA.prototype,"data",void 0),t([pe()],OA.prototype,"datasets",void 0),t([ue({type:Number})],OA.prototype,"maxSplits",void 0),t([ue({type:String,attribute:"splits"})],OA.prototype,"splitNames",void 0),t([ue({type:String})],OA.prototype,"xType",void 0),t([ue({type:Number})],OA.prototype,"xMaxTicks",void 0),t([ue({type:String})],OA.prototype,"yType",void 0),t([ue({type:String})],OA.prototype,"xFormat",void 0),t([ue({type:Boolean})],OA.prototype,"hideOther",void 0),t([pe()],OA.prototype,"splits",void 0),t([ue({type:String})],OA.prototype,"dataname",void 0),t([ue({type:Boolean})],OA.prototype,"single",void 0),t([ue({type:Boolean})],OA.prototype,"legend",void 0),t([ue({type:Boolean})],OA.prototype,"config",void 0),t([ue({type:Boolean})],OA.prototype,"showAll",void 0),t([ue({type:Number})],OA.prototype,"colorIndex",void 0),t([pe()],OA.prototype,"showConfig",void 0),t([ue({type:String})],OA.prototype,"palette",void 0),t([ue({type:Number})],OA.prototype,"opacity",void 0),t([ue({type:Number})],OA.prototype,"seriesBorderRadius",void 0),t([ue({type:Number})],OA.prototype,"seriesBorderWidth",void 0),t([ue({type:Boolean,attribute:"percent"})],OA.prototype,"showPercent",void 0),DA("temba-anchor",wh),DA("temba-alert",dh),DA("temba-store",wa),DA("temba-textinput",Ie),DA("temba-datepicker",Fh),DA("temba-date",Yh),DA("temba-completion",pc),DA("temba-checkbox",be),DA("temba-select",uc),DA("temba-options",ka),DA("temba-loading",xc),DA("temba-lightbox",Kh),DA("temba-button",yc),DA("temba-omnibox",gh),DA("temba-tip",bh),DA("temba-contact-name",Ah),DA("temba-contact-name-fetch",jh),DA("temba-contact-field",Oh),DA("temba-contact-fields",Th),DA("temba-field-manager",Hh),DA("temba-urn",Mh),DA("temba-content-menu",Gh),DA("temba-field",bc),DA("temba-dialog",gc),DA("temba-modax",vc),DA("temba-charcount",Tc),DA("temba-contact-chat",rh),DA("temba-contact-details",class extends Dc{static get styles(){return a`
       .urn {
         display: flex;
         padding: 0.4em 1em 0.8em 1em;