@kyndryl-design-system/shidoka-charts 2.2.0 → 2.3.0

package/common/config/chartTypes/doughnut.js

@@ -1,2 +1,2 @@
-import{getComputedColorPalette as t}from"../colorPalettes.js";const a="doughnut",e=()=>({radius:"80%",plugins:{datalabels:{font:{size:14},display:"auto",align:"end",anchor:"end",formatter:function(t,a){const e=a.chart.data.datasets[0].data.filter(((t,e)=>!a.chart.legend.legendItems[e].hidden)).reduce(((t,a)=>t+a),0),o=Math.round(100*(t/e+Number.EPSILON))+"%";return e?o:""}}}}),o=a=>({backgroundColor:t(a.options.colorPalette||"categorical")});export{o as datasetOptions,e as options,a as type};
+import{getComputedColorPalette as t}from"../colorPalettes.js";const a="doughnut",e=()=>({radius:"80%",plugins:{datalabels:{font:{size:14},display:"auto",align:"end",anchor:"end",formatter:function(t,a){const e=a.chart.data.datasets[0].data.filter(((t,e)=>!a.chart.legend.legendItems[e]?.hidden)).reduce(((t,a)=>t+a),0),o=Math.round(100*(t/e+Number.EPSILON))+"%";return e?o:""}}}}),o=a=>({backgroundColor:t(a.options.colorPalette||"categorical")});export{o as datasetOptions,e as options,a as type};
 //# sourceMappingURL=doughnut.js.map

package/common/config/chartTypes/doughnut.js.map

@@ -1 +1 @@
-{"version":3,"file":"doughnut.js","sources":["../../../../src/common/config/chartTypes/doughnut.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'doughnut';\n\nexport const options = () => {\n  return {\n    radius: '80%',\n    plugins: {\n      datalabels: {\n        font: {\n          size: 14,\n        },\n        display: 'auto',\n        align: 'end',\n        anchor: 'end',\n        formatter: function (value, context) {\n          const total = context.chart.data.datasets[0].data\n            .filter(\n              (dataPoint, index) =>\n                !context.chart.legend.legendItems[index].hidden\n            )\n            .reduce((a, b) => a + b, 0);\n\n          const percentage =\n            Math.round((value / total + Number.EPSILON) * 100) + '%';\n\n          return !total ? '' : percentage;\n        },\n      },\n    },\n  };\n};\n\nexport const datasetOptions = (ctx) => {\n  return {\n    backgroundColor: getComputedColorPalette(\n      ctx.options.colorPalette || 'categorical'\n    ),\n  };\n};\n"],"names":["type","options","radius","plugins","datalabels","font","size","display","align","anchor","formatter","value","context","total","chart","data","datasets","filter","dataPoint","index","legend","legendItems","hidden","reduce","a","b","percentage","Math","round","Number","EPSILON","datasetOptions","ctx","backgroundColor","getComputedColorPalette","colorPalette"],"mappings":"8DAEY,MAACA,EAAO,WAEPC,EAAU,KACd,CACLC,OAAQ,MACRC,QAAS,CACPC,WAAY,CACVC,KAAM,CACJC,KAAM,IAERC,QAAS,OACTC,MAAO,MACPC,OAAQ,MACRC,UAAW,SAAUC,EAAOC,GAC1B,MAAMC,EAAQD,EAAQE,MAAMC,KAAKC,SAAS,GAAGD,KAC1CE,QACC,CAACC,EAAWC,KACTP,EAAQE,MAAMM,OAAOC,YAAYF,GAAOG,SAE5CC,QAAO,CAACC,EAAGC,IAAMD,EAAIC,GAAG,GAErBC,EACJC,KAAKC,MAAyC,KAAlCjB,EAAQE,EAAQgB,OAAOC,UAAkB,IAEvD,OAAQjB,EAAaa,EAAL,EACjB,MAMIK,EAAkBC,IACtB,CACLC,gBAAiBC,EACfF,EAAI/B,QAAQkC,cAAgB"}
+{"version":3,"file":"doughnut.js","sources":["../../../../src/common/config/chartTypes/doughnut.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'doughnut';\n\nexport const options = () => {\n  return {\n    radius: '80%',\n    plugins: {\n      datalabels: {\n        font: {\n          size: 14,\n        },\n        display: 'auto',\n        align: 'end',\n        anchor: 'end',\n        formatter: function (value, context) {\n          const total = context.chart.data.datasets[0].data\n            .filter(\n              (dataPoint, index) =>\n                !context.chart.legend.legendItems[index]?.hidden\n            )\n            .reduce((a, b) => a + b, 0);\n\n          const percentage =\n            Math.round((value / total + Number.EPSILON) * 100) + '%';\n\n          return !total ? '' : percentage;\n        },\n      },\n    },\n  };\n};\n\nexport const datasetOptions = (ctx) => {\n  return {\n    backgroundColor: getComputedColorPalette(\n      ctx.options.colorPalette || 'categorical'\n    ),\n  };\n};\n"],"names":["type","options","radius","plugins","datalabels","font","size","display","align","anchor","formatter","value","context","total","chart","data","datasets","filter","dataPoint","index","legend","legendItems","hidden","reduce","a","b","percentage","Math","round","Number","EPSILON","datasetOptions","ctx","backgroundColor","getComputedColorPalette","colorPalette"],"mappings":"8DAEY,MAACA,EAAO,WAEPC,EAAU,KACd,CACLC,OAAQ,MACRC,QAAS,CACPC,WAAY,CACVC,KAAM,CACJC,KAAM,IAERC,QAAS,OACTC,MAAO,MACPC,OAAQ,MACRC,UAAW,SAAUC,EAAOC,GAC1B,MAAMC,EAAQD,EAAQE,MAAMC,KAAKC,SAAS,GAAGD,KAC1CE,QACC,CAACC,EAAWC,KACTP,EAAQE,MAAMM,OAAOC,YAAYF,IAAQG,SAE7CC,QAAO,CAACC,EAAGC,IAAMD,EAAIC,GAAG,GAErBC,EACJC,KAAKC,MAAyC,KAAlCjB,EAAQE,EAAQgB,OAAOC,UAAkB,IAEvD,OAAQjB,EAAaa,EAAL,EACjB,MAMIK,EAAkBC,IACtB,CACLC,gBAAiBC,EACfF,EAAI/B,QAAQkC,cAAgB"}

package/common/config/chartTypes/pie.js

@@ -1,2 +1,2 @@
-import{getComputedColorPalette as t}from"../colorPalettes.js";const e="pie",a=()=>({radius:"80%",plugins:{datalabels:{font:{size:14},display:"auto",align:"end",anchor:"end",formatter:function(t,e){const a=e.chart.data.datasets[0].data.filter(((t,a)=>!e.chart.legend.legendItems[a].hidden)).reduce(((t,e)=>t+e),0),o=Math.round(100*(t/a+Number.EPSILON))+"%";return a?o:""}}}}),o=e=>({backgroundColor:t(e.options.colorPalette||"categorical")});export{o as datasetOptions,a as options,e as type};
+import{getComputedColorPalette as t}from"../colorPalettes.js";const e="pie",a=()=>({radius:"80%",plugins:{datalabels:{font:{size:14},display:"auto",align:"end",anchor:"end",formatter:function(t,e){const a=e.chart.data.datasets[0].data.filter(((t,a)=>!e.chart.legend.legendItems[a]?.hidden)).reduce(((t,e)=>t+e),0),o=Math.round(100*(t/a+Number.EPSILON))+"%";return a?o:""}}}}),o=e=>({backgroundColor:t(e.options.colorPalette||"categorical")});export{o as datasetOptions,a as options,e as type};
 //# sourceMappingURL=pie.js.map

package/common/config/chartTypes/pie.js.map

@@ -1 +1 @@
-{"version":3,"file":"pie.js","sources":["../../../../src/common/config/chartTypes/pie.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'pie';\n\nexport const options = () => {\n  return {\n    radius: '80%',\n    plugins: {\n      datalabels: {\n        font: {\n          size: 14,\n        },\n        display: 'auto',\n        align: 'end',\n        anchor: 'end',\n        formatter: function (value, context) {\n          const total = context.chart.data.datasets[0].data\n            .filter(\n              (dataPoint, index) =>\n                !context.chart.legend.legendItems[index].hidden\n            )\n            .reduce((a, b) => a + b, 0);\n\n          const percentage =\n            Math.round((value / total + Number.EPSILON) * 100) + '%';\n\n          return !total ? '' : percentage;\n        },\n      },\n    },\n  };\n};\n\nexport const datasetOptions = (ctx) => {\n  return {\n    backgroundColor: getComputedColorPalette(\n      ctx.options.colorPalette || 'categorical'\n    ),\n  };\n};\n"],"names":["type","options","radius","plugins","datalabels","font","size","display","align","anchor","formatter","value","context","total","chart","data","datasets","filter","dataPoint","index","legend","legendItems","hidden","reduce","a","b","percentage","Math","round","Number","EPSILON","datasetOptions","ctx","backgroundColor","getComputedColorPalette","colorPalette"],"mappings":"8DAEY,MAACA,EAAO,MAEPC,EAAU,KACd,CACLC,OAAQ,MACRC,QAAS,CACPC,WAAY,CACVC,KAAM,CACJC,KAAM,IAERC,QAAS,OACTC,MAAO,MACPC,OAAQ,MACRC,UAAW,SAAUC,EAAOC,GAC1B,MAAMC,EAAQD,EAAQE,MAAMC,KAAKC,SAAS,GAAGD,KAC1CE,QACC,CAACC,EAAWC,KACTP,EAAQE,MAAMM,OAAOC,YAAYF,GAAOG,SAE5CC,QAAO,CAACC,EAAGC,IAAMD,EAAIC,GAAG,GAErBC,EACJC,KAAKC,MAAyC,KAAlCjB,EAAQE,EAAQgB,OAAOC,UAAkB,IAEvD,OAAQjB,EAAaa,EAAL,EACjB,MAMIK,EAAkBC,IACtB,CACLC,gBAAiBC,EACfF,EAAI/B,QAAQkC,cAAgB"}
+{"version":3,"file":"pie.js","sources":["../../../../src/common/config/chartTypes/pie.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'pie';\n\nexport const options = () => {\n  return {\n    radius: '80%',\n    plugins: {\n      datalabels: {\n        font: {\n          size: 14,\n        },\n        display: 'auto',\n        align: 'end',\n        anchor: 'end',\n        formatter: function (value, context) {\n          const total = context.chart.data.datasets[0].data\n            .filter(\n              (dataPoint, index) =>\n                !context.chart.legend.legendItems[index]?.hidden\n            )\n            .reduce((a, b) => a + b, 0);\n\n          const percentage =\n            Math.round((value / total + Number.EPSILON) * 100) + '%';\n\n          return !total ? '' : percentage;\n        },\n      },\n    },\n  };\n};\n\nexport const datasetOptions = (ctx) => {\n  return {\n    backgroundColor: getComputedColorPalette(\n      ctx.options.colorPalette || 'categorical'\n    ),\n  };\n};\n"],"names":["type","options","radius","plugins","datalabels","font","size","display","align","anchor","formatter","value","context","total","chart","data","datasets","filter","dataPoint","index","legend","legendItems","hidden","reduce","a","b","percentage","Math","round","Number","EPSILON","datasetOptions","ctx","backgroundColor","getComputedColorPalette","colorPalette"],"mappings":"8DAEY,MAACA,EAAO,MAEPC,EAAU,KACd,CACLC,OAAQ,MACRC,QAAS,CACPC,WAAY,CACVC,KAAM,CACJC,KAAM,IAERC,QAAS,OACTC,MAAO,MACPC,OAAQ,MACRC,UAAW,SAAUC,EAAOC,GAC1B,MAAMC,EAAQD,EAAQE,MAAMC,KAAKC,SAAS,GAAGD,KAC1CE,QACC,CAACC,EAAWC,KACTP,EAAQE,MAAMM,OAAOC,YAAYF,IAAQG,SAE7CC,QAAO,CAACC,EAAGC,IAAMD,EAAIC,GAAG,GAErBC,EACJC,KAAKC,MAAyC,KAAlCjB,EAAQE,EAAQgB,OAAOC,UAAkB,IAEvD,OAAQjB,EAAaa,EAAL,EACjB,MAMIK,EAAkBC,IACtB,CACLC,gBAAiBC,EACfF,EAAI/B,QAAQkC,cAAgB"}

package/common/legend/htmlRenderer.js

@@ -1,2 +1,2 @@
-import{getLegendData as e}from"./getLegendData.js";const t={className:"shidoka-legend",itemClassName:"shidoka-legend-item",boxWidth:14,boxHeight:14,borderRadius:2,maxHeight:100,layout:"horizontal",fontSize:"12px",boxMargin:8,onItemClick:null,adjustChartHeight:!0,reservedLegendHeight:40};function i(e,t){Object.assign(e.style,t)}function n(n,a,o){if(!n||!a)return a;a.innerHTML="";const l=e(n);if(!l.length)return a;const r={...t,...o},s=document.createElement("div");s.className=`${r.className}-container`,i(s,{width:"100%",paddingLeft:"20px",paddingRight:"20px",marginRight:"auto",marginLeft:"auto",boxSizing:"border-box"});const d=document.createElement("div");d.className=r.className,i(d,{width:"100%",maxHeight:`${r.maxHeight}px`,overflowY:"auto",boxSizing:"border-box"}),d.tabIndex=0,d.setAttribute("role","region"),d.setAttribute("aria-label","Chart legend items"),d.addEventListener("keydown",(e=>{"ArrowDown"===e.key?(d.scrollTop+=40,e.preventDefault()):"ArrowUp"===e.key?(d.scrollTop-=40,e.preventDefault()):"PageDown"===e.key?(d.scrollTop+=d.clientHeight,e.preventDefault()):"PageUp"===e.key?(d.scrollTop-=d.clientHeight,e.preventDefault()):"Home"===e.key?(d.scrollTop=0,e.preventDefault()):"End"===e.key&&(d.scrollTop=d.scrollHeight,e.preventDefault())}));const c=document.createElement("ul");c.className=`${r.className}-items`,i(c,{display:"flex",flexWrap:"wrap",justifyContent:"center",listStyle:"none",margin:"0",paddingTop:"8px",paddingBottom:"8px",paddingLeft:"0",flexDirection:"vertical"===r.layout?"column":"row",gap:"12px",width:"100%"});const g=[];if(l.forEach((e=>{const t=document.createElement("li");t.className=r.itemClassName,t.setAttribute("data-legend-item",e.label),i(t,{display:"flex",alignItems:"center",cursor:"pointer",fontFamily:"var(--kd-font-family-body, inherit)",fontSize:r.fontSize,marginRight:"12px",height:"100%",userSelect:"none",opacity:e.isHidden?"0.5":"1",textDecoration:e.isHidden?"line-through":"none"});const o=document.createElement("button");o.className=`${r.itemClassName}-button`,o.setAttribute("data-color-name",e.label),i(o,{background:"none",border:"none",padding:"0",margin:"0",cursor:"pointer",display:"flex",alignItems:"center",width:"100%",height:"100%",fontFamily:"inherit",fontSize:"inherit",color:"inherit",textAlign:"left"}),o.setAttribute("aria-pressed",(!e.isHidden).toString()),o.setAttribute("aria-label",`${e.label}${e.isHidden?" (hidden)":""}`),o.addEventListener("focus",(()=>{o.style.outline="2px solid var(--kd-color-border-variants-focus)",o.style.outlineOffset="2px"})),o.addEventListener("blur",(()=>{o.style.outline="",o.style.outlineOffset=""})),t.setAttribute("role","listitem"),o.addEventListener("mouseover",(()=>{t.style.opacity="0.8"})),o.addEventListener("mouseout",(()=>{t.style.opacity=e.isHidden?"0.5":"1"}));const l=document.createElement("span");l.className=`${r.itemClassName}-color`,i(l,{width:`${r.boxWidth}px`,height:`${r.boxHeight}px`,borderRadius:`${r.borderRadius}px`,display:"inline-block",marginRight:`${r.boxMargin}px`,boxSizing:"border-box",backgroundColor:e.needsBorder?e.colorWithAlpha:e.color,border:e.needsBorder?`1.5px solid ${e.color}`:""});const s=document.createElement("span");s.className=`${r.itemClassName}-label`,s.textContent=e.label;o.addEventListener("click",(()=>{e.toggleVisibility();const i="dataIndex"in e?!1===n.getDataVisibility(e.dataIndex):n.getDatasetMeta(e.datasetIndex).hidden;t.style.opacity=i?"0.5":"1",t.style.textDecoration=i?"line-through":"none",o.setAttribute("aria-pressed",(!i).toString()),o.setAttribute("aria-label",`${e.label}${i?" (hidden)":""}`);const l={item:e,chart:n,isHidden:i,label:e.label,dataIndex:"dataIndex"in e?e.dataIndex:void 0,datasetIndex:"datasetIndex"in e?e.datasetIndex:void 0,element:t};"function"==typeof r.onItemClick&&r.onItemClick(l),a.dispatchEvent(new CustomEvent("legend-item-click",{detail:l,bubbles:!0,composed:!0}))})),o.appendChild(l),o.appendChild(s),t.appendChild(o),c.appendChild(t),g.push(o)})),g.length>0&&g.forEach(((e,t)=>{e.addEventListener("keydown",(e=>{if("ArrowRight"===e.key||"ArrowDown"===e.key){const i=(t+1)%g.length;g[i].focus(),e.preventDefault()}else if("ArrowLeft"===e.key||"ArrowUp"===e.key){const i=(t-1+g.length)%g.length;g[i].focus(),e.preventDefault()}}))})),d.appendChild(c),s.appendChild(d),a.appendChild(s),d.style.overflowY=d.scrollHeight>d.clientHeight?"scroll":"hidden",r.adjustChartHeight&&n.canvas){const e=Math.min(d.scrollHeight,r.maxHeight||d.scrollHeight);if(e+r.reservedLegendHeight>r.reservedLegendHeight){const t=n.canvas.parentElement;if(t){t.dataset.originalHeight||(t.dataset.originalHeight=t.style.height||"auto");const i=t.dataset.originalHeight,a="auto"!==i?`calc(${i} - ${e}px)`:`calc(100% - ${e}px)`;t.style.height=a,n.resize()}}}return a}export{n as renderHTMLLegend};
+import{getLegendData as e}from"./getLegendData.js";const t={className:"shidoka-legend",itemClassName:"shidoka-legend-item",boxWidth:14,boxHeight:14,borderRadius:2,maxHeight:100,layout:"horizontal",fontSize:"12px",boxMargin:8,onItemClick:null,adjustChartHeight:!0,reservedLegendHeight:40,columns:0,labelFormatter:null,itemClassResolver:null,position:"bottom"};function a(e,t){Object.assign(e.style,t)}function n(n,i,o){if(!n||!i)return i;i.innerHTML="";const l=e(n);if(!l.length)return i;const s={...t,...o},r=document.createElement("div");r.className=`${s.className}-container`,a(r,{width:"100%",paddingLeft:"20px",paddingRight:"20px",marginRight:"auto",marginLeft:"auto",boxSizing:"border-box"});const d=document.createElement("div");d.className=s.className,a(d,{width:"100%",maxHeight:`${s.maxHeight}px`,overflowY:"auto",boxSizing:"border-box"}),d.tabIndex=0,d.setAttribute("role","region"),d.setAttribute("aria-label","Chart legend items"),d.addEventListener("keydown",(e=>{"ArrowDown"===e.key?(d.scrollTop+=40,e.preventDefault()):"ArrowUp"===e.key?(d.scrollTop-=40,e.preventDefault()):"PageDown"===e.key?(d.scrollTop+=d.clientHeight,e.preventDefault()):"PageUp"===e.key?(d.scrollTop-=d.clientHeight,e.preventDefault()):"Home"===e.key?(d.scrollTop=0,e.preventDefault()):"End"===e.key&&(d.scrollTop=d.scrollHeight,e.preventDefault())}));const c=document.createElement("ul");c.className=`${s.className}-items`;const p={display:"flex",listStyle:"none",margin:"0",paddingTop:"8px",paddingBottom:"8px",paddingLeft:"0",gap:"12px",width:"100%"};"vertical"===s.layout?(p.flexDirection="column",p.flexWrap="nowrap",p.justifyContent="flex-start"):s.columns>0?(p.display="grid",p.gridTemplateColumns=`repeat(${s.columns}, 1fr)`,p.justifyContent="flex-start"):(p.flexWrap="wrap",p.justifyContent="center"),a(c,p);const m=[];if(l.forEach((e=>{const t=document.createElement("li");if(t.className=s.itemClassName,t.setAttribute("data-legend-item",e.label),t.setAttribute("data-index",void 0!==e.datasetIndex?e.datasetIndex:void 0!==e.dataIndex?e.dataIndex:""),s.itemClassResolver&&"function"==typeof s.itemClassResolver){const a=s.itemClassResolver(e);a&&t.classList.add(a)}a(t,{display:"flex",alignItems:"center",cursor:"pointer",fontFamily:"var(--kd-font-family-body, inherit)",fontSize:s.fontSize,marginRight:"12px",height:"100%",userSelect:"none",opacity:e.isHidden?"0.5":"1",textDecoration:e.isHidden?"line-through":"none"});const o=document.createElement("button");o.className=`${s.itemClassName}-button`,o.setAttribute("data-color-name",e.label),a(o,{background:"none",border:"none",padding:"0",margin:"0",cursor:"pointer",display:"flex",alignItems:"center",width:"100%",height:"100%",fontFamily:"inherit",fontSize:"inherit",color:"inherit",textAlign:"left"}),o.setAttribute("aria-pressed",(!e.isHidden).toString()),o.setAttribute("aria-label",`${e.label}${e.isHidden?" (hidden)":""}`),o.addEventListener("focus",(()=>{o.style.outline="2px solid var(--kd-color-border-variants-focus)",o.style.outlineOffset="2px"})),o.addEventListener("blur",(()=>{o.style.outline="",o.style.outlineOffset=""})),t.setAttribute("role","listitem"),o.addEventListener("mouseover",(()=>{t.style.opacity="0.8"})),o.addEventListener("mouseout",(()=>{t.style.opacity=e.isHidden?"0.5":"1"}));const l=document.createElement("span");l.className=`${s.itemClassName}-color`,a(l,{width:`${s.boxWidth}px`,height:`${s.boxHeight}px`,borderRadius:`${s.borderRadius}px`,display:"inline-block",marginRight:`${s.boxMargin}px`,boxSizing:"border-box",backgroundColor:e.needsBorder?e.colorWithAlpha:e.color,border:e.needsBorder?`1.5px solid ${e.color}`:""});const r="doughnut"===n.config.type||"pie"===n.config.type||"polarArea"===n.config.type,d=document.createElement("span");if(d.className=`${s.itemClassName}-label`,s.labelFormatter&&"function"==typeof s.labelFormatter?d.textContent=s.labelFormatter(e.label,e):d.textContent=e.label,r&&"dataIndex"in e&&n.data.datasets[0].data){const t=n.data.datasets[0].data[e.dataIndex];if(void 0!==t){const e=document.createElement("span");e.className=`${s.itemClassName}-value`,e.textContent=` (${t})`,a(e,{marginLeft:"4px",fontSize:"0.9em",opacity:"0.8"}),d.appendChild(e)}}const p=a=>{a.stopPropagation(),e.toggleVisibility();const l="dataIndex"in e?!1===n.getDataVisibility(e.dataIndex):n.getDatasetMeta(e.datasetIndex).hidden;t.style.opacity=l?"0.5":"1",t.style.textDecoration=l?"line-through":"none",o.setAttribute("aria-pressed",(!l).toString()),o.setAttribute("aria-label",`${e.label}${l?" (hidden)":""}`);const r={item:e,chart:n,isHidden:l,label:e.label,dataIndex:"dataIndex"in e?e.dataIndex:void 0,datasetIndex:"datasetIndex"in e?e.datasetIndex:void 0,element:t,event:a};"function"==typeof s.onItemClick&&s.onItemClick(r),i.dispatchEvent(new CustomEvent("on-click",{detail:r,bubbles:!0,composed:!0}))};o.addEventListener("click",p),o.addEventListener("keydown",(e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),p(e))})),o.appendChild(l),o.appendChild(d),t.appendChild(o),c.appendChild(t),m.push(o)})),m.length>0&&m.forEach(((e,t)=>{e.addEventListener("keydown",(e=>{const a=t=>{t>=0&&t<m.length&&(m[t].focus(),e.preventDefault())};if(s.columns>1){const n=Math.ceil(m.length/s.columns),i=Math.floor(t/s.columns),o=t%s.columns;switch(e.key){case"ArrowRight":a(i*s.columns+(o+1)%s.columns);break;case"ArrowLeft":a(i*s.columns+(o-1+s.columns)%s.columns);break;case"ArrowDown":a((i+1)%n*s.columns+o);break;case"ArrowUp":a((i-1+n)%n*s.columns+o)}}else if("vertical"===s.layout||1===s.columns)switch(e.key){case"ArrowDown":a((t+1)%m.length);break;case"ArrowUp":a((t-1+m.length)%m.length)}else switch(e.key){case"ArrowRight":case"ArrowDown":a((t+1)%m.length);break;case"ArrowLeft":case"ArrowUp":a((t-1+m.length)%m.length)}}))})),d.appendChild(c),r.appendChild(d),"left"!==s.position&&"right"!==s.position||(a(r,{float:s.position,maxWidth:"25%",paddingLeft:"right"===s.position?"15px":"0",paddingRight:"left"===s.position?"15px":"0"}),a(d,{maxHeight:"100%",height:"auto"}),"vertical"!==s.layout&&a(c,{flexDirection:"column",flexWrap:"nowrap",alignItems:"flex-start"})),i.appendChild(r),d.style.overflowY=d.scrollHeight>d.clientHeight?"auto":"hidden",s.adjustChartHeight&&n.canvas){const e=Math.min(d.scrollHeight,s.maxHeight||d.scrollHeight);if(e+s.reservedLegendHeight>s.reservedLegendHeight){const t=n.canvas.parentElement;if(t){t.dataset.originalHeight||(t.dataset.originalHeight=t.style.height||"auto");const a=t.dataset.originalHeight,i="auto"!==a?`calc(${a} - ${e}px)`:`calc(100% - ${e}px)`;t.style.height=i,n.resize()}}}return i}export{n as renderHTMLLegend};
 //# sourceMappingURL=htmlRenderer.js.map

package/common/legend/htmlRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"htmlRenderer.js","sources":["../../../src/common/legend/htmlRenderer.js"],"sourcesContent":["import { getLegendData } from './getLegendData';\n\nconst defaultOpts = {\n  className: 'shidoka-legend',\n  itemClassName: 'shidoka-legend-item',\n  boxWidth: 14,\n  boxHeight: 14,\n  borderRadius: 2,\n  maxHeight: 100,\n  layout: 'horizontal',\n  fontSize: '12px',\n  boxMargin: 8,\n  onItemClick: null,\n  adjustChartHeight: true,\n  reservedLegendHeight: 40,\n};\n\nfunction applyStyles(el, styles) {\n  Object.assign(el.style, styles);\n}\n\nexport function renderHTMLLegend(chart, container, options) {\n  if (!chart || !container) return container;\n\n  container.innerHTML = '';\n  const items = getLegendData(chart);\n  if (!items.length) return container;\n\n  const opts = { ...defaultOpts, ...options };\n\n  const legendOuterContainer = document.createElement('div');\n  legendOuterContainer.className = `${opts.className}-container`;\n  applyStyles(legendOuterContainer, {\n    width: '100%',\n    paddingLeft: '20px',\n    paddingRight: '20px',\n    marginRight: 'auto',\n    marginLeft: 'auto',\n    boxSizing: 'border-box',\n  });\n\n  const scrollableContainer = document.createElement('div');\n  scrollableContainer.className = opts.className;\n  applyStyles(scrollableContainer, {\n    width: '100%',\n    maxHeight: `${opts.maxHeight}px`,\n    overflowY: 'auto',\n    boxSizing: 'border-box',\n  });\n\n  scrollableContainer.tabIndex = 0;\n  scrollableContainer.setAttribute('role', 'region');\n  scrollableContainer.setAttribute('aria-label', 'Chart legend items');\n  scrollableContainer.addEventListener('keydown', (e) => {\n    if (e.key === 'ArrowDown') {\n      scrollableContainer.scrollTop += 40;\n      e.preventDefault();\n    } else if (e.key === 'ArrowUp') {\n      scrollableContainer.scrollTop -= 40;\n      e.preventDefault();\n    } else if (e.key === 'PageDown') {\n      scrollableContainer.scrollTop += scrollableContainer.clientHeight;\n      e.preventDefault();\n    } else if (e.key === 'PageUp') {\n      scrollableContainer.scrollTop -= scrollableContainer.clientHeight;\n      e.preventDefault();\n    } else if (e.key === 'Home') {\n      scrollableContainer.scrollTop = 0;\n      e.preventDefault();\n    } else if (e.key === 'End') {\n      scrollableContainer.scrollTop = scrollableContainer.scrollHeight;\n      e.preventDefault();\n    }\n  });\n\n  const ul = document.createElement('ul');\n  ul.className = `${opts.className}-items`;\n  applyStyles(ul, {\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: 'center',\n    listStyle: 'none',\n    margin: '0',\n    paddingTop: '8px',\n    paddingBottom: '8px',\n    paddingLeft: '0',\n    flexDirection: opts.layout === 'vertical' ? 'column' : 'row',\n    gap: '12px',\n    width: '100%',\n  });\n\n  const legendItems = [];\n\n  items.forEach((item) => {\n    const li = document.createElement('li');\n    li.className = opts.itemClassName;\n    li.setAttribute('data-legend-item', item.label);\n    applyStyles(li, {\n      display: 'flex',\n      alignItems: 'center',\n      cursor: 'pointer',\n      fontFamily: 'var(--kd-font-family-body, inherit)',\n      fontSize: opts.fontSize,\n      marginRight: '12px',\n      height: '100%',\n      userSelect: 'none',\n      opacity: item.isHidden ? '0.5' : '1',\n      textDecoration: item.isHidden ? 'line-through' : 'none',\n    });\n\n    const buttonWrapper = document.createElement('button');\n    buttonWrapper.className = `${opts.itemClassName}-button`;\n    buttonWrapper.setAttribute('data-color-name', item.label);\n    applyStyles(buttonWrapper, {\n      background: 'none',\n      border: 'none',\n      padding: '0',\n      margin: '0',\n      cursor: 'pointer',\n      display: 'flex',\n      alignItems: 'center',\n      width: '100%',\n      height: '100%',\n      fontFamily: 'inherit',\n      fontSize: 'inherit',\n      color: 'inherit',\n      textAlign: 'left',\n    });\n\n    buttonWrapper.setAttribute('aria-pressed', (!item.isHidden).toString());\n    buttonWrapper.setAttribute(\n      'aria-label',\n      `${item.label}${item.isHidden ? ' (hidden)' : ''}`\n    );\n\n    buttonWrapper.addEventListener('focus', () => {\n      buttonWrapper.style.outline =\n        '2px solid var(--kd-color-border-variants-focus)';\n      buttonWrapper.style.outlineOffset = '2px';\n    });\n\n    buttonWrapper.addEventListener('blur', () => {\n      buttonWrapper.style.outline = '';\n      buttonWrapper.style.outlineOffset = '';\n    });\n\n    li.setAttribute('role', 'listitem');\n\n    buttonWrapper.addEventListener('mouseover', () => {\n      li.style.opacity = '0.8';\n    });\n\n    buttonWrapper.addEventListener('mouseout', () => {\n      li.style.opacity = item.isHidden ? '0.5' : '1';\n    });\n\n    const colorBox = document.createElement('span');\n    colorBox.className = `${opts.itemClassName}-color`;\n    applyStyles(colorBox, {\n      width: `${opts.boxWidth}px`,\n      height: `${opts.boxHeight}px`,\n      borderRadius: `${opts.borderRadius}px`,\n      display: 'inline-block',\n      marginRight: `${opts.boxMargin}px`,\n      boxSizing: 'border-box',\n      backgroundColor: item.needsBorder ? item.colorWithAlpha : item.color,\n      border: item.needsBorder ? `1.5px solid ${item.color}` : '',\n    });\n\n    const label = document.createElement('span');\n    label.className = `${opts.itemClassName}-label`;\n    label.textContent = item.label;\n\n    const toggleItemVisibility = () => {\n      item.toggleVisibility();\n      const hidden =\n        'dataIndex' in item\n          ? chart.getDataVisibility(item.dataIndex) === false\n          : chart.getDatasetMeta(item.datasetIndex).hidden;\n      li.style.opacity = hidden ? '0.5' : '1';\n      li.style.textDecoration = hidden ? 'line-through' : 'none';\n      buttonWrapper.setAttribute('aria-pressed', (!hidden).toString());\n      buttonWrapper.setAttribute(\n        'aria-label',\n        `${item.label}${hidden ? ' (hidden)' : ''}`\n      );\n\n      const info = {\n        item,\n        chart,\n        isHidden: hidden,\n        label: item.label,\n        dataIndex: 'dataIndex' in item ? item.dataIndex : undefined,\n        datasetIndex: 'datasetIndex' in item ? item.datasetIndex : undefined,\n        element: li,\n      };\n\n      if (typeof opts.onItemClick === 'function') {\n        opts.onItemClick(info);\n      }\n\n      container.dispatchEvent(\n        new CustomEvent('legend-item-click', {\n          detail: info,\n          bubbles: true,\n          composed: true,\n        })\n      );\n    };\n\n    buttonWrapper.addEventListener('click', toggleItemVisibility);\n\n    buttonWrapper.appendChild(colorBox);\n    buttonWrapper.appendChild(label);\n    li.appendChild(buttonWrapper);\n    ul.appendChild(li);\n\n    legendItems.push(buttonWrapper);\n  });\n\n  if (legendItems.length > 0) {\n    legendItems.forEach((button, index) => {\n      button.addEventListener('keydown', (e) => {\n        if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n          const nextIndex = (index + 1) % legendItems.length;\n          legendItems[nextIndex].focus();\n          e.preventDefault();\n        } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n          const prevIndex =\n            (index - 1 + legendItems.length) % legendItems.length;\n          legendItems[prevIndex].focus();\n          e.preventDefault();\n        }\n      });\n    });\n  }\n\n  scrollableContainer.appendChild(ul);\n  legendOuterContainer.appendChild(scrollableContainer);\n  container.appendChild(legendOuterContainer);\n\n  scrollableContainer.style.overflowY =\n    scrollableContainer.scrollHeight > scrollableContainer.clientHeight\n      ? 'scroll'\n      : 'hidden';\n\n  if (opts.adjustChartHeight && chart.canvas) {\n    const legendHeight = Math.min(\n      scrollableContainer.scrollHeight,\n      opts.maxHeight || scrollableContainer.scrollHeight\n    );\n    const totalHeight = legendHeight + opts.reservedLegendHeight;\n\n    if (totalHeight > opts.reservedLegendHeight) {\n      const chartContainer = chart.canvas.parentElement;\n      if (chartContainer) {\n        if (!chartContainer.dataset.originalHeight) {\n          chartContainer.dataset.originalHeight =\n            chartContainer.style.height || 'auto';\n        }\n\n        const originalHeight = chartContainer.dataset.originalHeight;\n        const newHeight =\n          originalHeight !== 'auto'\n            ? `calc(${originalHeight} - ${legendHeight}px)`\n            : `calc(100% - ${legendHeight}px)`;\n\n        chartContainer.style.height = newHeight;\n        chart.resize();\n      }\n    }\n  }\n\n  return container;\n}\n"],"names":["defaultOpts","className","itemClassName","boxWidth","boxHeight","borderRadius","maxHeight","layout","fontSize","boxMargin","onItemClick","adjustChartHeight","reservedLegendHeight","applyStyles","el","styles","Object","assign","style","renderHTMLLegend","chart","container","options","innerHTML","items","getLegendData","length","opts","legendOuterContainer","document","createElement","width","paddingLeft","paddingRight","marginRight","marginLeft","boxSizing","scrollableContainer","overflowY","tabIndex","setAttribute","addEventListener","e","key","scrollTop","preventDefault","clientHeight","scrollHeight","ul","display","flexWrap","justifyContent","listStyle","margin","paddingTop","paddingBottom","flexDirection","gap","legendItems","forEach","item","li","label","alignItems","cursor","fontFamily","height","userSelect","opacity","isHidden","textDecoration","buttonWrapper","background","border","padding","color","textAlign","toString","outline","outlineOffset","colorBox","backgroundColor","needsBorder","colorWithAlpha","textContent","toggleVisibility","hidden","getDataVisibility","dataIndex","getDatasetMeta","datasetIndex","info","undefined","element","dispatchEvent","CustomEvent","detail","bubbles","composed","appendChild","push","button","index","nextIndex","focus","prevIndex","canvas","legendHeight","Math","min","chartContainer","parentElement","dataset","originalHeight","newHeight","resize"],"mappings":"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"}
+{"version":3,"file":"htmlRenderer.js","sources":["../../../src/common/legend/htmlRenderer.js"],"sourcesContent":["import { getLegendData } from './getLegendData';\n\nconst defaultOpts = {\n  className: 'shidoka-legend',\n  itemClassName: 'shidoka-legend-item',\n  boxWidth: 14,\n  boxHeight: 14,\n  borderRadius: 2,\n  maxHeight: 100,\n  layout: 'horizontal',\n  fontSize: '12px',\n  boxMargin: 8,\n  onItemClick: null,\n  adjustChartHeight: true,\n  reservedLegendHeight: 40,\n  columns: 0,\n  labelFormatter: null,\n  itemClassResolver: null,\n  position: 'bottom',\n};\n\nfunction applyStyles(el, styles) {\n  Object.assign(el.style, styles);\n}\n\nexport function renderHTMLLegend(chart, container, options) {\n  if (!chart || !container) return container;\n\n  container.innerHTML = '';\n  const items = getLegendData(chart);\n  if (!items.length) return container;\n\n  const opts = { ...defaultOpts, ...options };\n\n  const legendOuterContainer = document.createElement('div');\n  legendOuterContainer.className = `${opts.className}-container`;\n  applyStyles(legendOuterContainer, {\n    width: '100%',\n    paddingLeft: '20px',\n    paddingRight: '20px',\n    marginRight: 'auto',\n    marginLeft: 'auto',\n    boxSizing: 'border-box',\n  });\n\n  const scrollableContainer = document.createElement('div');\n  scrollableContainer.className = opts.className;\n  applyStyles(scrollableContainer, {\n    width: '100%',\n    maxHeight: `${opts.maxHeight}px`,\n    overflowY: 'auto',\n    boxSizing: 'border-box',\n  });\n\n  scrollableContainer.tabIndex = 0;\n  scrollableContainer.setAttribute('role', 'region');\n  scrollableContainer.setAttribute('aria-label', 'Chart legend items');\n  scrollableContainer.addEventListener('keydown', (e) => {\n    if (e.key === 'ArrowDown') {\n      scrollableContainer.scrollTop += 40;\n      e.preventDefault();\n    } else if (e.key === 'ArrowUp') {\n      scrollableContainer.scrollTop -= 40;\n      e.preventDefault();\n    } else if (e.key === 'PageDown') {\n      scrollableContainer.scrollTop += scrollableContainer.clientHeight;\n      e.preventDefault();\n    } else if (e.key === 'PageUp') {\n      scrollableContainer.scrollTop -= scrollableContainer.clientHeight;\n      e.preventDefault();\n    } else if (e.key === 'Home') {\n      scrollableContainer.scrollTop = 0;\n      e.preventDefault();\n    } else if (e.key === 'End') {\n      scrollableContainer.scrollTop = scrollableContainer.scrollHeight;\n      e.preventDefault();\n    }\n  });\n\n  const ul = document.createElement('ul');\n  ul.className = `${opts.className}-items`;\n\n  const ulStyles = {\n    display: 'flex',\n    listStyle: 'none',\n    margin: '0',\n    paddingTop: '8px',\n    paddingBottom: '8px',\n    paddingLeft: '0',\n    gap: '12px',\n    width: '100%',\n  };\n\n  if (opts.layout === 'vertical') {\n    ulStyles.flexDirection = 'column';\n    ulStyles.flexWrap = 'nowrap';\n    ulStyles.justifyContent = 'flex-start';\n  } else if (opts.columns > 0) {\n    ulStyles.display = 'grid';\n    ulStyles.gridTemplateColumns = `repeat(${opts.columns}, 1fr)`;\n    ulStyles.justifyContent = 'flex-start';\n  } else {\n    ulStyles.flexWrap = 'wrap';\n    ulStyles.justifyContent = 'center';\n  }\n\n  applyStyles(ul, ulStyles);\n\n  const legendItems = [];\n\n  items.forEach((item) => {\n    const li = document.createElement('li');\n    li.className = opts.itemClassName;\n    li.setAttribute('data-legend-item', item.label);\n    li.setAttribute(\n      'data-index',\n      item.datasetIndex !== undefined\n        ? item.datasetIndex\n        : item.dataIndex !== undefined\n        ? item.dataIndex\n        : ''\n    );\n\n    if (\n      opts.itemClassResolver &&\n      typeof opts.itemClassResolver === 'function'\n    ) {\n      const customClass = opts.itemClassResolver(item);\n      if (customClass) {\n        li.classList.add(customClass);\n      }\n    }\n\n    applyStyles(li, {\n      display: 'flex',\n      alignItems: 'center',\n      cursor: 'pointer',\n      fontFamily: 'var(--kd-font-family-body, inherit)',\n      fontSize: opts.fontSize,\n      marginRight: '12px',\n      height: '100%',\n      userSelect: 'none',\n      opacity: item.isHidden ? '0.5' : '1',\n      textDecoration: item.isHidden ? 'line-through' : 'none',\n    });\n\n    const buttonWrapper = document.createElement('button');\n    buttonWrapper.className = `${opts.itemClassName}-button`;\n    buttonWrapper.setAttribute('data-color-name', item.label);\n    applyStyles(buttonWrapper, {\n      background: 'none',\n      border: 'none',\n      padding: '0',\n      margin: '0',\n      cursor: 'pointer',\n      display: 'flex',\n      alignItems: 'center',\n      width: '100%',\n      height: '100%',\n      fontFamily: 'inherit',\n      fontSize: 'inherit',\n      color: 'inherit',\n      textAlign: 'left',\n    });\n\n    buttonWrapper.setAttribute('aria-pressed', (!item.isHidden).toString());\n    buttonWrapper.setAttribute(\n      'aria-label',\n      `${item.label}${item.isHidden ? ' (hidden)' : ''}`\n    );\n\n    buttonWrapper.addEventListener('focus', () => {\n      buttonWrapper.style.outline =\n        '2px solid var(--kd-color-border-variants-focus)';\n      buttonWrapper.style.outlineOffset = '2px';\n    });\n\n    buttonWrapper.addEventListener('blur', () => {\n      buttonWrapper.style.outline = '';\n      buttonWrapper.style.outlineOffset = '';\n    });\n\n    li.setAttribute('role', 'listitem');\n\n    buttonWrapper.addEventListener('mouseover', () => {\n      li.style.opacity = '0.8';\n    });\n\n    buttonWrapper.addEventListener('mouseout', () => {\n      li.style.opacity = item.isHidden ? '0.5' : '1';\n    });\n\n    const colorBox = document.createElement('span');\n    colorBox.className = `${opts.itemClassName}-color`;\n    applyStyles(colorBox, {\n      width: `${opts.boxWidth}px`,\n      height: `${opts.boxHeight}px`,\n      borderRadius: `${opts.borderRadius}px`,\n      display: 'inline-block',\n      marginRight: `${opts.boxMargin}px`,\n      boxSizing: 'border-box',\n      backgroundColor: item.needsBorder ? item.colorWithAlpha : item.color,\n      border: item.needsBorder ? `1.5px solid ${item.color}` : '',\n    });\n\n    const valueVisible =\n      chart.config.type === 'doughnut' ||\n      chart.config.type === 'pie' ||\n      chart.config.type === 'polarArea';\n\n    const label = document.createElement('span');\n    label.className = `${opts.itemClassName}-label`;\n\n    if (opts.labelFormatter && typeof opts.labelFormatter === 'function') {\n      label.textContent = opts.labelFormatter(item.label, item);\n    } else {\n      label.textContent = item.label;\n    }\n\n    if (valueVisible && 'dataIndex' in item && chart.data.datasets[0].data) {\n      const value = chart.data.datasets[0].data[item.dataIndex];\n      if (value !== undefined) {\n        const valueSpan = document.createElement('span');\n        valueSpan.className = `${opts.itemClassName}-value`;\n        valueSpan.textContent = ` (${value})`;\n        applyStyles(valueSpan, {\n          marginLeft: '4px',\n          fontSize: '0.9em',\n          opacity: '0.8',\n        });\n        label.appendChild(valueSpan);\n      }\n    }\n\n    const toggleItemVisibility = (e) => {\n      e.stopPropagation();\n\n      item.toggleVisibility();\n      const hidden =\n        'dataIndex' in item\n          ? chart.getDataVisibility(item.dataIndex) === false\n          : chart.getDatasetMeta(item.datasetIndex).hidden;\n      li.style.opacity = hidden ? '0.5' : '1';\n      li.style.textDecoration = hidden ? 'line-through' : 'none';\n      buttonWrapper.setAttribute('aria-pressed', (!hidden).toString());\n      buttonWrapper.setAttribute(\n        'aria-label',\n        `${item.label}${hidden ? ' (hidden)' : ''}`\n      );\n\n      const info = {\n        item,\n        chart,\n        isHidden: hidden,\n        label: item.label,\n        dataIndex: 'dataIndex' in item ? item.dataIndex : undefined,\n        datasetIndex: 'datasetIndex' in item ? item.datasetIndex : undefined,\n        element: li,\n        event: e,\n      };\n\n      if (typeof opts.onItemClick === 'function') {\n        opts.onItemClick(info);\n      }\n\n      container.dispatchEvent(\n        new CustomEvent('on-click', {\n          detail: info,\n          bubbles: true,\n          composed: true,\n        })\n      );\n    };\n\n    buttonWrapper.addEventListener('click', toggleItemVisibility);\n    buttonWrapper.addEventListener('keydown', (e) => {\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault();\n        toggleItemVisibility(e);\n      }\n    });\n\n    buttonWrapper.appendChild(colorBox);\n    buttonWrapper.appendChild(label);\n    li.appendChild(buttonWrapper);\n    ul.appendChild(li);\n\n    legendItems.push(buttonWrapper);\n  });\n\n  if (legendItems.length > 0) {\n    legendItems.forEach((button, index) => {\n      button.addEventListener('keydown', (e) => {\n        const navigateTo = (targetIndex) => {\n          if (targetIndex >= 0 && targetIndex < legendItems.length) {\n            legendItems[targetIndex].focus();\n            e.preventDefault();\n          }\n        };\n\n        if (opts.columns > 1) {\n          const totalRows = Math.ceil(legendItems.length / opts.columns);\n          const currentRow = Math.floor(index / opts.columns);\n          const currentCol = index % opts.columns;\n\n          switch (e.key) {\n            case 'ArrowRight':\n              navigateTo(\n                currentRow * opts.columns + ((currentCol + 1) % opts.columns)\n              );\n              break;\n            case 'ArrowLeft':\n              navigateTo(\n                currentRow * opts.columns +\n                  ((currentCol - 1 + opts.columns) % opts.columns)\n              );\n              break;\n            case 'ArrowDown':\n              navigateTo(\n                ((currentRow + 1) % totalRows) * opts.columns + currentCol\n              );\n              break;\n            case 'ArrowUp':\n              navigateTo(\n                ((currentRow - 1 + totalRows) % totalRows) * opts.columns +\n                  currentCol\n              );\n              break;\n          }\n        } else if (opts.layout === 'vertical' || opts.columns === 1) {\n          switch (e.key) {\n            case 'ArrowDown':\n              navigateTo((index + 1) % legendItems.length);\n              break;\n            case 'ArrowUp':\n              navigateTo((index - 1 + legendItems.length) % legendItems.length);\n              break;\n          }\n        } else {\n          switch (e.key) {\n            case 'ArrowRight':\n            case 'ArrowDown':\n              navigateTo((index + 1) % legendItems.length);\n              break;\n            case 'ArrowLeft':\n            case 'ArrowUp':\n              navigateTo((index - 1 + legendItems.length) % legendItems.length);\n              break;\n          }\n        }\n      });\n    });\n  }\n\n  scrollableContainer.appendChild(ul);\n  legendOuterContainer.appendChild(scrollableContainer);\n\n  if (opts.position === 'left' || opts.position === 'right') {\n    applyStyles(legendOuterContainer, {\n      float: opts.position,\n      maxWidth: '25%',\n      paddingLeft: opts.position === 'right' ? '15px' : '0',\n      paddingRight: opts.position === 'left' ? '15px' : '0',\n    });\n\n    applyStyles(scrollableContainer, {\n      maxHeight: '100%',\n      height: 'auto',\n    });\n\n    if (opts.layout !== 'vertical') {\n      applyStyles(ul, {\n        flexDirection: 'column',\n        flexWrap: 'nowrap',\n        alignItems: 'flex-start',\n      });\n    }\n  }\n\n  container.appendChild(legendOuterContainer);\n\n  scrollableContainer.style.overflowY =\n    scrollableContainer.scrollHeight > scrollableContainer.clientHeight\n      ? 'auto'\n      : 'hidden';\n\n  if (opts.adjustChartHeight && chart.canvas) {\n    const legendHeight = Math.min(\n      scrollableContainer.scrollHeight,\n      opts.maxHeight || scrollableContainer.scrollHeight\n    );\n    const totalHeight = legendHeight + opts.reservedLegendHeight;\n\n    if (totalHeight > opts.reservedLegendHeight) {\n      const chartContainer = chart.canvas.parentElement;\n      if (chartContainer) {\n        if (!chartContainer.dataset.originalHeight) {\n          chartContainer.dataset.originalHeight =\n            chartContainer.style.height || 'auto';\n        }\n\n        const originalHeight = chartContainer.dataset.originalHeight;\n        const newHeight =\n          originalHeight !== 'auto'\n            ? `calc(${originalHeight} - ${legendHeight}px)`\n            : `calc(100% - ${legendHeight}px)`;\n\n        chartContainer.style.height = newHeight;\n        chart.resize();\n      }\n    }\n  }\n\n  return container;\n}\n"],"names":["defaultOpts","className","itemClassName","boxWidth","boxHeight","borderRadius","maxHeight","layout","fontSize","boxMargin","onItemClick","adjustChartHeight","reservedLegendHeight","columns","labelFormatter","itemClassResolver","position","applyStyles","el","styles","Object","assign","style","renderHTMLLegend","chart","container","options","innerHTML","items","getLegendData","length","opts","legendOuterContainer","document","createElement","width","paddingLeft","paddingRight","marginRight","marginLeft","boxSizing","scrollableContainer","overflowY","tabIndex","setAttribute","addEventListener","e","key","scrollTop","preventDefault","clientHeight","scrollHeight","ul","ulStyles","display","listStyle","margin","paddingTop","paddingBottom","gap","flexDirection","flexWrap","justifyContent","gridTemplateColumns","legendItems","forEach","item","li","label","undefined","datasetIndex","dataIndex","customClass","classList","add","alignItems","cursor","fontFamily","height","userSelect","opacity","isHidden","textDecoration","buttonWrapper","background","border","padding","color","textAlign","toString","outline","outlineOffset","colorBox","backgroundColor","needsBorder","colorWithAlpha","valueVisible","config","type","textContent","data","datasets","value","valueSpan","appendChild","toggleItemVisibility","stopPropagation","toggleVisibility","hidden","getDataVisibility","getDatasetMeta","info","element","event","dispatchEvent","CustomEvent","detail","bubbles","composed","push","button","index","navigateTo","targetIndex","focus","totalRows","Math","ceil","currentRow","floor","currentCol","float","maxWidth","canvas","legendHeight","min","chartContainer","parentElement","dataset","originalHeight","newHeight","resize"],"mappings":"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"}

package/common/plugins/doughnutLabel.js

@@ -1,2 +1,2 @@
-import{getTokenThemeVal as e}from'./../../external/@kyndryl-design-system/shidoka-foundation/common/helpers/color.js';var t={id:"doughnutLabel",beforeDraw:(t,o,n)=>{const i=e("--kd-color-text-level-primary");if("doughnut"===t.config.type&&!t.config.options.doughnutLabel?.disabled){const{ctx:e}=t,o=t.config.data.datasets[0].data.filter(((e,o)=>!t.legend.legendItems[o].hidden)).reduce(((e,t)=>e+t),0);e.textAlign="center",e.textBaseline="middle";var l=(t.chartArea.left+t.chartArea.right)/2,a=(t.chartArea.top+t.chartArea.bottom)/2-10;e.fillStyle=i;const n=t.config.options.doughnutLabel?.line1text,s=t.config.options.doughnutLabel?.line1fontSize||"16px",r=t.config.options.doughnutLabel?.line2text,c=t.config.options.doughnutLabel?.line2fontSize||"16px";let d=o,f=t.config.options.scales.y.title.text;(n||""===n)&&(d="function"==typeof n?n(d,e):n),(r||""===r)&&(f="function"==typeof r?r(f,e):r),e.font=`${s} "Helvetica Neue", Helvetica, Arial, sans-serif`,e.fillText(d,l,a),e.font=`${c} "Helvetica Neue", Helvetica, Arial, sans-serif`,e.fillText(f,l,a+20)}}};export{t as default};
+import{getTokenThemeVal as e}from'./../../external/@kyndryl-design-system/shidoka-foundation/common/helpers/color.js';var t={id:"doughnutLabel",beforeDraw:(t,o,n)=>{const i=e("--kd-color-text-level-primary");if("doughnut"===t.config.type&&!t.config.options.doughnutLabel?.disabled){const{ctx:e}=t,o=t.config.data.datasets[0].data.filter(((e,o)=>!t.legend.legendItems[o]?.hidden)).reduce(((e,t)=>e+t),0);e.textAlign="center",e.textBaseline="middle";var l=(t.chartArea.left+t.chartArea.right)/2,a=(t.chartArea.top+t.chartArea.bottom)/2-10;e.fillStyle=i;const n=t.config.options.doughnutLabel?.line1text,s=t.config.options.doughnutLabel?.line1fontSize||"16px",r=t.config.options.doughnutLabel?.line2text,c=t.config.options.doughnutLabel?.line2fontSize||"16px";let d=o,f=t.config.options.scales.y.title.text;(n||""===n)&&(d="function"==typeof n?n(d,e):n),(r||""===r)&&(f="function"==typeof r?r(f,e):r),e.font=`${s} "Helvetica Neue", Helvetica, Arial, sans-serif`,e.fillText(d,l,a),e.font=`${c} "Helvetica Neue", Helvetica, Arial, sans-serif`,e.fillText(f,l,a+20)}}};export{t as default};
 //# sourceMappingURL=doughnutLabel.js.map

package/common/plugins/doughnutLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"doughnutLabel.js","sources":["../../../src/common/plugins/doughnutLabel.js"],"sourcesContent":["import { getTokenThemeVal } from '@kyndryl-design-system/shidoka-foundation/common/helpers/color';\n\nexport default {\n  id: 'doughnutLabel',\n  beforeDraw: (chart, args, options) => {\n    const TextColor = getTokenThemeVal('--kd-color-text-level-primary');\n\n    if (\n      chart.config.type === 'doughnut' &&\n      !chart.config.options.doughnutLabel?.disabled\n    ) {\n      const { ctx } = chart;\n\n      // get sum of all visible data points\n      const total = chart.config.data.datasets[0].data\n        .filter((dataPoint, index) => !chart.legend.legendItems[index].hidden)\n        .reduce((a, b) => a + b, 0);\n\n      ctx.textAlign = 'center';\n      ctx.textBaseline = 'middle';\n      var centerX = (chart.chartArea.left + chart.chartArea.right) / 2;\n      var centerY = (chart.chartArea.top + chart.chartArea.bottom) / 2 - 10;\n      ctx.fillStyle = TextColor;\n\n      //Draw text in center\n      // get custom options for center text\n      const Line1textOption = chart.config.options.doughnutLabel?.line1text;\n      const Line1fontSize =\n        chart.config.options.doughnutLabel?.line1fontSize || '16px';\n      const Line2textOption = chart.config.options.doughnutLabel?.line2text;\n      const Line2fontSize =\n        chart.config.options.doughnutLabel?.line2fontSize || '16px';\n\n      // set default values\n      let Line1text = total;\n      let Line2text = chart.config.options.scales.y.title.text;\n\n      // determine if line1text option is given, is a function or not, and update text\n      if (Line1textOption || Line1textOption === '') {\n        Line1text =\n          typeof Line1textOption === 'function'\n            ? Line1textOption(Line1text, ctx)\n            : Line1textOption;\n      }\n\n      // determine if line2text option is given, is a function or not, and update text\n      if (Line2textOption || Line2textOption === '') {\n        Line2text =\n          typeof Line2textOption === 'function'\n            ? Line2textOption(Line2text, ctx)\n            : Line2textOption;\n      }\n\n      ctx.font = `${Line1fontSize} \"Helvetica Neue\", Helvetica, Arial, sans-serif`;\n      ctx.fillText(Line1text, centerX, centerY);\n      ctx.font = `${Line2fontSize} \"Helvetica Neue\", Helvetica, Arial, sans-serif`;\n      ctx.fillText(Line2text, centerX, centerY + 20);\n    }\n  },\n};\n"],"names":["doughnutLabelPlugin","id","beforeDraw","chart","args","options","TextColor","getTokenThemeVal","config","type","doughnutLabel","disabled","ctx","total","data","datasets","filter","dataPoint","index","legend","legendItems","hidden","reduce","a","b","textAlign","textBaseline","centerX","chartArea","left","right","centerY","top","bottom","fillStyle","Line1textOption","line1text","Line1fontSize","line1fontSize","Line2textOption","line2text","Line2fontSize","line2fontSize","Line1text","Line2text","scales","y","title","text","font","fillText"],"mappings":"wHAEA,IAAeA,EAAA,CACbC,GAAI,gBACJC,WAAY,CAACC,EAAOC,EAAMC,KACxB,MAAMC,EAAYC,EAAiB,iCAEnC,GACwB,aAAtBJ,EAAMK,OAAOC,OACZN,EAAMK,OAAOH,QAAQK,eAAeC,SACrC,CACA,MAAMC,IAAEA,GAAQT,EAGVU,EAAQV,EAAMK,OAAOM,KAAKC,SAAS,GAAGD,KACzCE,QAAO,CAACC,EAAWC,KAAWf,EAAMgB,OAAOC,YAAYF,GAAOG,SAC9DC,QAAO,CAACC,EAAGC,IAAMD,EAAIC,GAAG,GAE3BZ,EAAIa,UAAY,SAChBb,EAAIc,aAAe,SACnB,IAAIC,GAAWxB,EAAMyB,UAAUC,KAAO1B,EAAMyB,UAAUE,OAAS,EAC3DC,GAAW5B,EAAMyB,UAAUI,IAAM7B,EAAMyB,UAAUK,QAAU,EAAI,GACnErB,EAAIsB,UAAY5B,EAIhB,MAAM6B,EAAkBhC,EAAMK,OAAOH,QAAQK,eAAe0B,UACtDC,EACJlC,EAAMK,OAAOH,QAAQK,eAAe4B,eAAiB,OACjDC,EAAkBpC,EAAMK,OAAOH,QAAQK,eAAe8B,UACtDC,EACJtC,EAAMK,OAAOH,QAAQK,eAAegC,eAAiB,OAGvD,IAAIC,EAAY9B,EACZ+B,EAAYzC,EAAMK,OAAOH,QAAQwC,OAAOC,EAAEC,MAAMC,MAGhDb,GAAuC,KAApBA,KACrBQ,EAC6B,mBAApBR,EACHA,EAAgBQ,EAAW/B,GAC3BuB,IAIJI,GAAuC,KAApBA,KACrBK,EAC6B,mBAApBL,EACHA,EAAgBK,EAAWhC,GAC3B2B,GAGR3B,EAAIqC,KAAO,GAAGZ,mDACdzB,EAAIsC,SAASP,EAAWhB,EAASI,GACjCnB,EAAIqC,KAAO,GAAGR,mDACd7B,EAAIsC,SAASN,EAAWjB,EAASI,EAAU,GAC5C"}
+{"version":3,"file":"doughnutLabel.js","sources":["../../../src/common/plugins/doughnutLabel.js"],"sourcesContent":["import { getTokenThemeVal } from '@kyndryl-design-system/shidoka-foundation/common/helpers/color';\n\nexport default {\n  id: 'doughnutLabel',\n  beforeDraw: (chart, args, options) => {\n    const TextColor = getTokenThemeVal('--kd-color-text-level-primary');\n\n    if (\n      chart.config.type === 'doughnut' &&\n      !chart.config.options.doughnutLabel?.disabled\n    ) {\n      const { ctx } = chart;\n\n      // get sum of all visible data points\n      const total = chart.config.data.datasets[0].data\n        .filter((dataPoint, index) => !chart.legend.legendItems[index]?.hidden)\n        .reduce((a, b) => a + b, 0);\n\n      ctx.textAlign = 'center';\n      ctx.textBaseline = 'middle';\n      var centerX = (chart.chartArea.left + chart.chartArea.right) / 2;\n      var centerY = (chart.chartArea.top + chart.chartArea.bottom) / 2 - 10;\n      ctx.fillStyle = TextColor;\n\n      //Draw text in center\n      // get custom options for center text\n      const Line1textOption = chart.config.options.doughnutLabel?.line1text;\n      const Line1fontSize =\n        chart.config.options.doughnutLabel?.line1fontSize || '16px';\n      const Line2textOption = chart.config.options.doughnutLabel?.line2text;\n      const Line2fontSize =\n        chart.config.options.doughnutLabel?.line2fontSize || '16px';\n\n      // set default values\n      let Line1text = total;\n      let Line2text = chart.config.options.scales.y.title.text;\n\n      // determine if line1text option is given, is a function or not, and update text\n      if (Line1textOption || Line1textOption === '') {\n        Line1text =\n          typeof Line1textOption === 'function'\n            ? Line1textOption(Line1text, ctx)\n            : Line1textOption;\n      }\n\n      // determine if line2text option is given, is a function or not, and update text\n      if (Line2textOption || Line2textOption === '') {\n        Line2text =\n          typeof Line2textOption === 'function'\n            ? Line2textOption(Line2text, ctx)\n            : Line2textOption;\n      }\n\n      ctx.font = `${Line1fontSize} \"Helvetica Neue\", Helvetica, Arial, sans-serif`;\n      ctx.fillText(Line1text, centerX, centerY);\n      ctx.font = `${Line2fontSize} \"Helvetica Neue\", Helvetica, Arial, sans-serif`;\n      ctx.fillText(Line2text, centerX, centerY + 20);\n    }\n  },\n};\n"],"names":["doughnutLabelPlugin","id","beforeDraw","chart","args","options","TextColor","getTokenThemeVal","config","type","doughnutLabel","disabled","ctx","total","data","datasets","filter","dataPoint","index","legend","legendItems","hidden","reduce","a","b","textAlign","textBaseline","centerX","chartArea","left","right","centerY","top","bottom","fillStyle","Line1textOption","line1text","Line1fontSize","line1fontSize","Line2textOption","line2text","Line2fontSize","line2fontSize","Line1text","Line2text","scales","y","title","text","font","fillText"],"mappings":"wHAEA,IAAeA,EAAA,CACbC,GAAI,gBACJC,WAAY,CAACC,EAAOC,EAAMC,KACxB,MAAMC,EAAYC,EAAiB,iCAEnC,GACwB,aAAtBJ,EAAMK,OAAOC,OACZN,EAAMK,OAAOH,QAAQK,eAAeC,SACrC,CACA,MAAMC,IAAEA,GAAQT,EAGVU,EAAQV,EAAMK,OAAOM,KAAKC,SAAS,GAAGD,KACzCE,QAAO,CAACC,EAAWC,KAAWf,EAAMgB,OAAOC,YAAYF,IAAQG,SAC/DC,QAAO,CAACC,EAAGC,IAAMD,EAAIC,GAAG,GAE3BZ,EAAIa,UAAY,SAChBb,EAAIc,aAAe,SACnB,IAAIC,GAAWxB,EAAMyB,UAAUC,KAAO1B,EAAMyB,UAAUE,OAAS,EAC3DC,GAAW5B,EAAMyB,UAAUI,IAAM7B,EAAMyB,UAAUK,QAAU,EAAI,GACnErB,EAAIsB,UAAY5B,EAIhB,MAAM6B,EAAkBhC,EAAMK,OAAOH,QAAQK,eAAe0B,UACtDC,EACJlC,EAAMK,OAAOH,QAAQK,eAAe4B,eAAiB,OACjDC,EAAkBpC,EAAMK,OAAOH,QAAQK,eAAe8B,UACtDC,EACJtC,EAAMK,OAAOH,QAAQK,eAAegC,eAAiB,OAGvD,IAAIC,EAAY9B,EACZ+B,EAAYzC,EAAMK,OAAOH,QAAQwC,OAAOC,EAAEC,MAAMC,MAGhDb,GAAuC,KAApBA,KACrBQ,EAC6B,mBAApBR,EACHA,EAAgBQ,EAAW/B,GAC3BuB,IAIJI,GAAuC,KAApBA,KACrBK,EAC6B,mBAApBL,EACHA,EAAgBK,EAAWhC,GAC3B2B,GAGR3B,EAAIqC,KAAO,GAAGZ,mDACdzB,EAAIsC,SAASP,EAAWhB,EAASI,GACjCnB,EAAIqC,KAAO,GAAGR,mDACd7B,EAAIsC,SAASN,EAAWjB,EAASI,EAAU,GAC5C"}

package/common/plugins/htmlLegendPlugin.d.ts

@@ -7,6 +7,7 @@ export interface LegendItemClickInfo {
     dataIndex?: number;
     datasetIndex?: number;
     element: HTMLElement;
+    event?: Event;
 }
 export interface HtmlLegendPluginOptions {
     containerId: string;
@@ -20,6 +21,12 @@ export interface HtmlLegendPluginOptions {
     onItemClick?: (info: LegendItemClickInfo) => void;
     adjustChartHeight?: boolean;
     reservedLegendHeight?: number;
+    columns?: number;
+    labelFormatter?: (label: string, item: any) => string;
+    itemClassResolver?: (item: any) => string | null;
+    searchEnabled?: boolean;
+    searchPlaceholder?: string;
+    position?: 'top' | 'bottom' | 'left' | 'right';
 }
 export declare const htmlLegendPlugin: {
     id: string;

package/common/plugins/htmlLegendPlugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"htmlLegendPlugin.d.ts","sourceRoot":"","sources":["../../../src/common/plugins/htmlLegendPlugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAGjC,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,GAAG,CAAC;IACV,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,MAAM,WAAW,uBAAuB;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACnC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,gBAAgB;;uBAER,KAAK,KAAK,GAAG,WAAW,uBAAuB;CAKnE,CAAC"}
+{"version":3,"file":"htmlLegendPlugin.d.ts","sourceRoot":"","sources":["../../../src/common/plugins/htmlLegendPlugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAGjC,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,GAAG,CAAC;IACV,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,WAAW,CAAC;IACrB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,MAAM,WAAW,uBAAuB;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACnC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,MAAM,CAAC;IACtD,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,MAAM,GAAG,IAAI,CAAC;IACjD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;CAChD;AAED,eAAO,MAAM,gBAAgB;;uBAER,KAAK,KAAK,GAAG,WAAW,uBAAuB;CAKnE,CAAC"}

package/common/plugins/htmlLegendPlugin.js

@@ -0,0 +1,2 @@
+import{renderHTMLLegend as e}from"../legend/htmlRenderer.js";const t={id:"htmlLegend",afterUpdate(t,n,d){const o=document.getElementById(d.containerId);o&&e(t,o,d)}};export{t as htmlLegendPlugin};
+//# sourceMappingURL=htmlLegendPlugin.js.map

package/common/plugins/htmlLegendPlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"htmlLegendPlugin.js","sources":["../../../src/common/plugins/htmlLegendPlugin.ts"],"sourcesContent":["import { Chart } from 'chart.js';\nimport { renderHTMLLegend } from '../legend/htmlRenderer';\n\nexport interface LegendItemClickInfo {\n  item: any;\n  chart: Chart;\n  isHidden: boolean;\n  label: string;\n  dataIndex?: number;\n  datasetIndex?: number;\n  element: HTMLElement;\n  event?: Event;\n}\n\nexport interface HtmlLegendPluginOptions {\n  containerId: string;\n  boxWidth?: number;\n  boxHeight?: number;\n  borderRadius?: number;\n  className?: string;\n  itemClassName?: string;\n  maxHeight?: number;\n  layout?: 'horizontal' | 'vertical';\n  onItemClick?: (info: LegendItemClickInfo) => void;\n  adjustChartHeight?: boolean;\n  reservedLegendHeight?: number;\n  columns?: number;\n  labelFormatter?: (label: string, item: any) => string;\n  itemClassResolver?: (item: any) => string | null;\n  searchEnabled?: boolean;\n  searchPlaceholder?: string;\n  position?: 'top' | 'bottom' | 'left' | 'right';\n}\n\nexport const htmlLegendPlugin = {\n  id: 'htmlLegend',\n  afterUpdate(chart: Chart, _: any, options: HtmlLegendPluginOptions) {\n    const container = document.getElementById(options.containerId);\n    if (!container) return;\n    renderHTMLLegend(chart, container, options);\n  },\n};\n"],"names":["htmlLegendPlugin","id","afterUpdate","chart","_","options","container","document","getElementById","containerId","renderHTMLLegend"],"mappings":"6DAkCa,MAAAA,EAAmB,CAC9BC,GAAI,aACJ,WAAAC,CAAYC,EAAcC,EAAQC,GAChC,MAAMC,EAAYC,SAASC,eAAeH,EAAQI,aAC7CH,GACLI,EAAiBP,EAAOG,EAAWD,EACpC"}

package/components/chart/chart.d.ts

@@ -1,5 +1,37 @@
 import { LitElement } from 'lit';
+import Chart from 'chart.js/auto';
 import 'chartjs-adapter-date-fns';
+export interface LegendClickInfo {
+    item: any;
+    chart: Chart;
+    isHidden: boolean;
+    label: string;
+    dataIndex?: number;
+    datasetIndex?: number;
+    element: HTMLElement;
+    event?: MouseEvent;
+}
+export interface HtmlLegendOptions {
+    boxWidth?: number;
+    boxHeight?: number;
+    borderRadius?: number;
+    className?: string;
+    itemClassName?: string;
+    layout?: 'horizontal' | 'vertical';
+    fontSize?: number;
+    boxMargin?: number;
+    adjustChartHeight?: boolean;
+    reservedLegendHeight?: number;
+    /**
+     * Callback fired when a legend item is clicked.
+     * This handler receives comprehensive information and can interact with external APIs.
+     */
+    onItemClick?: (info: LegendClickInfo) => void;
+    columns?: number;
+    labelFormatter?: (label: string, item: any) => string;
+    itemClassResolver?: (item: any) => string | null;
+    position?: 'top' | 'bottom' | 'left' | 'right';
+}
 /**
  * Chart.js wrapper component.
  * @slot unnamed - Slot for custom content between header and chart.
@@ -56,6 +88,8 @@ export declare class KDChart extends LitElement {
     useHtmlLegend: boolean;
     /** Max height for HTML legend scroll container (px). */
     htmlLegendMaxHeight: number;
+    /** Full set of legend customization options */
+    htmlLegendOptions: HtmlLegendOptions;
     /**
      * Queries the container element.
      * @ignore

package/components/chart/chart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../src/components/chart/chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,OAAO,0BAA0B,CAAC;AA+ClC;;;;;;GAMG;AACH,qBACa,OAAQ,SAAQ,UAAU;IACrC,OAAgB,MAAM,+BAAa;IAEnC,mBAAmB;IAEnB,UAAU,SAAM;IAEhB,yBAAyB;IAEzB,WAAW,SAAM;IAEjB,2BAA2B;IAE3B,IAAI,EAAE,GAAG,CAAM;IAEf,4BAA4B;IAE5B,MAAM,EAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IAEvB,8BAA8B;IAE9B,QAAQ,EAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IAEtB,uDAAuD;IAEvD,OAAO,EAAE,GAAG,CAAM;IAElB,yHAAyH;IAEzH,OAAO,EAAE,GAAG,CAAM;IAElB,wEAAwE;IAExE,MAAM,EAAE,GAAG,CAAQ;IAEnB,uEAAuE;IAEvE,KAAK,EAAE,GAAG,CAAQ;IAElB,sCAAsC;IAEtC,eAAe,UAAS;IAExB,0CAA0C;IAE1C,YAAY,UAAS;IAErB,qCAAqC;IAErC,UAAU,UAAS;IAEnB,0BAA0B;IAE1B,YAAY,UAAS;IAErB,4CAA4C;IAE5C,QAAQ,UAAS;IAEjB,gCAAgC;IAEhC,YAAY;;;;;;;MAOV;IAEF;;OAEG;IAEH,UAAU,UAAS;IAEnB;;OAEG;IAEH,aAAa,UAAS;IAEtB,wDAAwD;IAExD,mBAAmB,SAAO;IAE1B;;;OAGG;IAEH,SAAS,EAAG,iBAAiB,CAAC;IAE9B;;;OAGG;IAEH,MAAM,EAAG,iBAAiB,CAAC;IAE3B;;;OAGG;IAEH,KAAK,EAAG,cAAc,CAAC;IAEvB;;OAEG;IAEH,KAAK,EAAE,GAAG,CAAQ;IAElB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,aAAa,EAAE,GAAG,CAAM;IAExB;;OAEG;IAEH,cAAc,EAAE,GAAG,CAAM;IAEzB;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IACH,eAAe,EAAE,GAAG,CAIlB;IAEF,cAAc,EAAE,GAAG,CAMhB;IAEM,MAAM;IA4Xf,OAAO,CAAC,YAAY;IAMX,iBAAiB;IASjB,oBAAoB;IAOpB,YAAY;IAKrB,OAAO,CAAC,wBAAwB;IAkBvB,OAAO,CAAC,YAAY,EAAE,GAAG;IA6FlC;;;OAGG;IACH,OAAO,CAAC,SAAS;IA2CjB;;;OAGG;YACW,YAAY;IAgF1B,OAAO,CAAC,iBAAiB;IAoBzB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,SAAS;IAMjB,OAAO,CAAC,mBAAmB;IA+F3B,OAAO,CAAC,gBAAgB;IAoBxB,OAAO,CAAC,sBAAsB;IAuD9B,OAAO,CAAC,iBAAiB;IA2BzB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,sBAAsB;CAG/B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
+{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../src/components/chart/chart.ts"],"names":[],"mappings":"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"}

package/components/chart/chart.js

@@ -1,4 +1,4 @@
-import{__decorate as t}from"../../_virtual/_tslib.js";import'./../../external/@lit/reactive-element/reactive-element.js';import{html as e}from'./../../external/lit-html/lit-html.js';import{LitElement as o}from'./../../external/lit-element/lit-element.js';import{customElement as s}from'./../../external/@lit/reactive-element/decorators/custom-element.js';import{property as i}from'./../../external/@lit/reactive-element/decorators/property.js';import{state as a}from'./../../external/@lit/reactive-element/decorators/state.js';import{query as n}from'./../../external/@lit/reactive-element/decorators/query.js';import'./../../external/@lit/reactive-element/decorators/query-assigned-elements.js';import{classMap as r}from'./../../external/lit-html/directives/class-map.js';import{deepmerge as l,deepmergeCustom as d}from'./../../external/deepmerge-ts/dist/node/index.js';import'./../../external/chart.js/auto/auto.js';import'./../../external/chartjs-adapter-date-fns/dist/chartjs-adapter-date-fns.esm.js';import{ChoroplethController as h,BubbleMapController as c,GeoFeature as p,ColorScale as m,SizeScale as u,ProjectionScale as g}from'./../../external/chartjs-chart-geo/build/index.js';import{TreemapController as y,TreemapElement as v}from'./../../external/chartjs-chart-treemap/dist/chartjs-chart-treemap.esm.js';import{MatrixController as b,MatrixElement as f}from'./../../external/chartjs-chart-matrix/dist/chartjs-chart-matrix.esm.js';import j from"../../common/plugins/canvasBackground.js";import $ from"../../common/plugins/doughnutLabel.js";import w from"../../common/plugins/meterGaugeNeedle.js";import x from"../../common/plugins/gradientLegend.js";import{renderHTMLLegend as T}from"../../common/legend/htmlRenderer.js";import k from'./../../external/chartjs-plugin-a11y-legend/dist/plugin.js';import O from'./../../external/chartjs-plugin-datalabels/dist/chartjs-plugin-datalabels.esm.js';import C from'./../../external/chartjs-plugin-annotation/dist/chartjs-plugin-annotation.esm.js';import{debounce as _,convertChartDataToCSV as L}from"../../common/helpers/helpers.js";import D from"./chart.scss.js";import A from"../../common/config/globalOptions.js";import S from"../../common/config/globalOptionsNonRadial.js";import M from"../../common/config/globalOptionsRadial.js";import E from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/analytics.svg.js';import H from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/table-view.svg.js';import V from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/download.svg.js';import B from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/expand.svg.js';import N from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/shrink.svg.js';import{unsafeSVG as R}from'./../../external/lit-html/directives/unsafe-svg.js';import{getTokenThemeVal as q}from'./../../external/@kyndryl-design-system/shidoka-foundation/common/helpers/color.js';import{Chart as J}from'./../../external/chart.js/dist/chart.js';function z(t){switch(t){case"../../common/config/chartTypes/bar.js":return import("../../common/config/chartTypes/bar.js");case"../../common/config/chartTypes/bubble.js":return import("../../common/config/chartTypes/bubble.js");case"../../common/config/chartTypes/bubbleMap.js":return import("../../common/config/chartTypes/bubbleMap.js");case"../../common/config/chartTypes/choropleth.js":return import("../../common/config/chartTypes/choropleth.js");case"../../common/config/chartTypes/doughnut.js":return import("../../common/config/chartTypes/doughnut.js");case"../../common/config/chartTypes/line.js":return import("../../common/config/chartTypes/line.js");case"../../common/config/chartTypes/matrix.js":return import("../../common/config/chartTypes/matrix.js");case"../../common/config/chartTypes/meter.js":return import("../../common/config/chartTypes/meter.js");case"../../common/config/chartTypes/pie.js":return import("../../common/config/chartTypes/pie.js");case"../../common/config/chartTypes/polarArea.js":return import("../../common/config/chartTypes/polarArea.js");case"../../common/config/chartTypes/radar.js":return import("../../common/config/chartTypes/radar.js");case"../../common/config/chartTypes/scatter.js":return import("../../common/config/chartTypes/scatter.js");case"../../common/config/chartTypes/treemap.js":return import("../../common/config/chartTypes/treemap.js");default:return new Promise((function(e,o){("function"==typeof queueMicrotask?queueMicrotask:setTimeout)(o.bind(null,new Error("Unknown variable dynamic import: "+t)))}))}}J.register(h,c,p,m,u,g,y,v,b,f,C,O);let F=class extends o{constructor(){super(...arguments),this.chartTitle="",this.description="",this.type="",this.options={},this.plugins=[],this.height=null,this.width=null,this.hideDescription=!1,this.hideCaptions=!1,this.hideHeader=!1,this.hideControls=!1,this.noBorder=!1,this.customLabels={toggleView:"Toggle View Mode",toggleFullscreen:"Toggle Fullscreen",downloadMenu:"Download Menu",downloadCsv:"Download as CSV",downloadPng:"Download as PNG",downloadJpg:"Download as JPG"},this.fullscreen=!1,this.useHtmlLegend=!1,this.htmlLegendMaxHeight=100,this.chart=null,this.tableView=!1,this.tableDisabled=!1,this.mergedOptions={},this.mergedDatasets={},this._widget=!1,this._resizeObserver=new ResizeObserver(_((()=>{this._resizeChart()}))),this._themeObserver=new MutationObserver((()=>{this.chart&&this.mergeOptions().then((()=>{this.initChart()}))}))}render(){var t,o,s,i,a,n,l,d,h;const c={container:!0,fullscreen:this.fullscreen,"no-border":this.noBorder||this._widget,widget:this._widget};return e`
+import{__decorate as t}from"../../_virtual/_tslib.js";import'./../../external/@lit/reactive-element/reactive-element.js';import{html as e}from'./../../external/lit-html/lit-html.js';import{LitElement as o}from'./../../external/lit-element/lit-element.js';import{customElement as s}from'./../../external/@lit/reactive-element/decorators/custom-element.js';import{property as i}from'./../../external/@lit/reactive-element/decorators/property.js';import{state as a}from'./../../external/@lit/reactive-element/decorators/state.js';import{query as n}from'./../../external/@lit/reactive-element/decorators/query.js';import'./../../external/@lit/reactive-element/decorators/query-assigned-elements.js';import{classMap as r}from'./../../external/lit-html/directives/class-map.js';import{deepmerge as l,deepmergeCustom as d}from'./../../external/deepmerge-ts/dist/node/index.js';import'./../../external/chart.js/auto/auto.js';import'./../../external/chartjs-adapter-date-fns/dist/chartjs-adapter-date-fns.esm.js';import{ChoroplethController as h,BubbleMapController as c,GeoFeature as p,ColorScale as m,SizeScale as u,ProjectionScale as g}from'./../../external/chartjs-chart-geo/build/index.js';import{TreemapController as y,TreemapElement as v}from'./../../external/chartjs-chart-treemap/dist/chartjs-chart-treemap.esm.js';import{MatrixController as b,MatrixElement as f}from'./../../external/chartjs-chart-matrix/dist/chartjs-chart-matrix.esm.js';import j from"../../common/plugins/canvasBackground.js";import w from"../../common/plugins/doughnutLabel.js";import $ from"../../common/plugins/meterGaugeNeedle.js";import T from"../../common/plugins/gradientLegend.js";import{renderHTMLLegend as x}from"../../common/legend/htmlRenderer.js";import{htmlLegendPlugin as O}from"../../common/plugins/htmlLegendPlugin.js";import k from'./../../external/chartjs-plugin-a11y-legend/dist/plugin.js';import C from'./../../external/chartjs-plugin-datalabels/dist/chartjs-plugin-datalabels.esm.js';import L from'./../../external/chartjs-plugin-annotation/dist/chartjs-plugin-annotation.esm.js';import{debounce as _,convertChartDataToCSV as D}from"../../common/helpers/helpers.js";import A from"./chart.scss.js";import S from"../../common/config/globalOptions.js";import M from"../../common/config/globalOptionsNonRadial.js";import E from"../../common/config/globalOptionsRadial.js";import H from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/analytics.svg.js';import V from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/table-view.svg.js';import N from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/download.svg.js';import B from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/expand.svg.js';import R from'./../../external/@kyndryl-design-system/shidoka-icons/svg/monochrome/16/shrink.svg.js';import{unsafeSVG as q}from'./../../external/lit-html/directives/unsafe-svg.js';import{getTokenThemeVal as F}from'./../../external/@kyndryl-design-system/shidoka-foundation/common/helpers/color.js';import{Chart as J}from'./../../external/chart.js/dist/chart.js';function z(t){switch(t){case"../../common/config/chartTypes/bar.js":return import("../../common/config/chartTypes/bar.js");case"../../common/config/chartTypes/bubble.js":return import("../../common/config/chartTypes/bubble.js");case"../../common/config/chartTypes/bubbleMap.js":return import("../../common/config/chartTypes/bubbleMap.js");case"../../common/config/chartTypes/choropleth.js":return import("../../common/config/chartTypes/choropleth.js");case"../../common/config/chartTypes/doughnut.js":return import("../../common/config/chartTypes/doughnut.js");case"../../common/config/chartTypes/line.js":return import("../../common/config/chartTypes/line.js");case"../../common/config/chartTypes/matrix.js":return import("../../common/config/chartTypes/matrix.js");case"../../common/config/chartTypes/meter.js":return import("../../common/config/chartTypes/meter.js");case"../../common/config/chartTypes/pie.js":return import("../../common/config/chartTypes/pie.js");case"../../common/config/chartTypes/polarArea.js":return import("../../common/config/chartTypes/polarArea.js");case"../../common/config/chartTypes/radar.js":return import("../../common/config/chartTypes/radar.js");case"../../common/config/chartTypes/scatter.js":return import("../../common/config/chartTypes/scatter.js");case"../../common/config/chartTypes/treemap.js":return import("../../common/config/chartTypes/treemap.js");default:return new Promise((function(e,o){("function"==typeof queueMicrotask?queueMicrotask:setTimeout)(o.bind(null,new Error("Unknown variable dynamic import: "+t)))}))}}J.register(h,c,p,m,u,g,y,v,b,f,L,C);let I=class extends o{constructor(){super(...arguments),this.chartTitle="",this.description="",this.type="",this.options={},this.plugins=[],this.height=null,this.width=null,this.hideDescription=!1,this.hideCaptions=!1,this.hideHeader=!1,this.hideControls=!1,this.noBorder=!1,this.customLabels={toggleView:"Toggle View Mode",toggleFullscreen:"Toggle Fullscreen",downloadMenu:"Download Menu",downloadCsv:"Download as CSV",downloadPng:"Download as PNG",downloadJpg:"Download as JPG"},this.fullscreen=!1,this.useHtmlLegend=!1,this.htmlLegendMaxHeight=100,this.htmlLegendOptions={},this.chart=null,this.tableView=!1,this.tableDisabled=!1,this.mergedOptions={},this.mergedDatasets={},this._widget=!1,this._resizeObserver=new ResizeObserver(_((()=>{this._resizeChart()}))),this._themeObserver=new MutationObserver((()=>{this.chart&&this.mergeOptions().then((()=>{this.initChart()}))}))}render(){var t,o,s,i,a,n,l,d,h;const c={container:!0,fullscreen:this.fullscreen,"no-border":this.noBorder||this._widget,widget:this._widget};return e`
       <div
         class=${r(c)}
         @fullscreenchange=${()=>this.handleFullscreenChange()}
@@ -30,7 +30,7 @@ import{__decorate as t}from"../../_virtual/_tslib.js";import'./../../external/@l
                                 title=${this.customLabels.toggleView}
                               >
                                 <span slot="icon">
-                                  ${this.tableView?R(E):R(H)}
+                                  ${this.tableView?q(H):q(V)}
                                 </span>
                               </button>
                             `}
@@ -42,7 +42,7 @@ import{__decorate as t}from"../../_virtual/_tslib.js";import'./../../external/@l
                           title=${this.customLabels.toggleFullscreen}
                         >
                           <span slot="icon">
-                            ${this.fullscreen?R(N):R(B)}
+                            ${this.fullscreen?q(R):q(B)}
                           </span>
                         </button>
 
@@ -54,7 +54,7 @@ import{__decorate as t}from"../../_virtual/_tslib.js";import'./../../external/@l
                             title=${this.customLabels.downloadMenu}
                           >
                             <span slot="icon">
-                              ${R(V)}
+                              ${q(N)}
                             </span>
                           </button>
 
@@ -226,5 +226,5 @@ import{__decorate as t}from"../../_virtual/_tslib.js";import'./../../external/@l
               </div>
             `:null}
       </div>
-    `}_resizeChart(){this.chart&&this.chart.resize()}connectedCallback(){super.connectedCallback(),this._themeObserver.observe(document.querySelector('meta[name="color-scheme"]'),{attributes:!0})}disconnectedCallback(){this._resizeObserver.disconnect(),this._themeObserver.disconnect(),super.disconnectedCallback()}firstUpdated(){var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector(".canvas-container");this._resizeObserver.observe(e)}generateScrollableLegend(){var t;if(!this.chart||!this.useHtmlLegend)return;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector(".html-legend-container");if(!e)return;const o=this.mergedOptions.plugins.customLegend;T(this.chart,e,{maxHeight:this.htmlLegendMaxHeight,boxWidth:(null==o?void 0:o.boxWidth)||16,boxHeight:(null==o?void 0:o.boxHeight)||16,borderRadius:(null==o?void 0:o.borderRadius)||2})}updated(t){var e,o;this.chart&&(t.has("labels")||t.has("datasets")||t.has("options"))&&this.mergeOptions().then((()=>{this.chart.data.labels=this.labels,this.chart.options=this.mergedOptions,this.chart.data.datasets.forEach(((t,e)=>{this.mergedDatasets.find((e=>e.label===t.label))||this.chart.data.datasets.splice(e,1)})),this.mergedDatasets.forEach((t=>{const e=this.chart.data.datasets.find((e=>e.label===t.label));e?Object.keys(t).forEach((o=>{e[o]=t[o]})):this.chart.data.datasets.push(t)})),this.chart.update(),this.generateScrollableLegend()}));let s=!1;if(this.datasets&&this.datasets.length)for(const t of this.datasets)if(s=(null===(e=t.data)||void 0===e?void 0:e.length)>0||(null===(o=t.tree)||void 0===o?void 0:o.length)>0||t.tree&&Object.keys(t.tree).length>0,!s){console.error("Missing data for one or more chart datasets.");break}!this.chart&&this.type&&t.has("datasets")&&s&&(this.mergeOptions().then((()=>{this.initChart()})),this.checkType()),this.chart&&(t.has("type")||t.has("plugins")||t.has("width")||t.has("height")||t.has("useHtmlLegend"))&&(this.mergeOptions().then((()=>{this.initChart()})),this.checkType()),this.chart&&t.has("noBorder")&&this.chart.resize()}initChart(){J.defaults.color=q("--kd-color-text-level-primary");const t="meter"===this.type?w:$;let e=[j,t,x,...this.plugins];["choropleth","treemap","bubbleMap"].includes(this.type)||(e=[...e,k]),this.chart&&this.chart.destroy(),this.chart=new J(this.canvas,{type:"meter"===this.type?"doughnut":this.type,data:{labels:this.labels,datasets:this.mergedDatasets},options:this.mergedOptions,plugins:e}),this.generateScrollableLegend()}async mergeOptions(){const t=[];this.datasets.forEach((e=>{e.type&&t.push(function(t){switch(t){case"../../common/config/chartTypes/bar.js":return import("../../common/config/chartTypes/bar.js");case"../../common/config/chartTypes/bubble.js":return import("../../common/config/chartTypes/bubble.js");case"../../common/config/chartTypes/bubbleMap.js":return import("../../common/config/chartTypes/bubbleMap.js");case"../../common/config/chartTypes/choropleth.js":return import("../../common/config/chartTypes/choropleth.js");case"../../common/config/chartTypes/doughnut.js":return import("../../common/config/chartTypes/doughnut.js");case"../../common/config/chartTypes/line.js":return import("../../common/config/chartTypes/line.js");case"../../common/config/chartTypes/matrix.js":return import("../../common/config/chartTypes/matrix.js");case"../../common/config/chartTypes/meter.js":return import("../../common/config/chartTypes/meter.js");case"../../common/config/chartTypes/pie.js":return import("../../common/config/chartTypes/pie.js");case"../../common/config/chartTypes/polarArea.js":return import("../../common/config/chartTypes/polarArea.js");case"../../common/config/chartTypes/radar.js":return import("../../common/config/chartTypes/radar.js");case"../../common/config/chartTypes/scatter.js":return import("../../common/config/chartTypes/scatter.js");case"../../common/config/chartTypes/treemap.js":return import("../../common/config/chartTypes/treemap.js");default:return new Promise((function(e,o){("function"==typeof queueMicrotask?queueMicrotask:setTimeout)(o.bind(null,new Error("Unknown variable dynamic import: "+t)))}))}}(`../../common/config/chartTypes/${e.type}.js`))}));const e=await Promise.all([z(`../../common/config/chartTypes/${this.type}.js`),...t]);let o=A(this);this.useHtmlLegend||(o.plugins=o.plugins||{},o.plugins.legend=o.plugins.legend||{},o.plugins.legend.display=!0,o.plugins.customLegend&&(o.plugins.customLegend.display=!1)),["pie","doughnut","radar","polarArea","meter"].includes(this.type)?o=l(o,M()):["choropleth","treemap","bubbleMap"].includes(this.type)||(o=l(o,S(this)));const s=JSON.parse(JSON.stringify(this.datasets));e.forEach((t=>{o=l(o,t.options(this)),s.forEach(((e,o)=>{(!e.type&&t.type===this.type||e.type===t.type)&&(s[o]=l(e,t.datasetOptions(this,o)))}))})),this.options&&(o=l(o,this.options)),this.mergedOptions=o,s.forEach(((t,e)=>{const o=d({mergeArrays:!1});s[e]=o(t,this.datasets[e])})),this.mergedDatasets=s}getTableAxisLabel(){var t,e,o,s,i,a,n,r,l,d,h;let c="";return c="y"===(null===(t=this.options)||void 0===t?void 0:t.indexAxis)?(null===(i=null===(s=null===(o=null===(e=this.options)||void 0===e?void 0:e.scales)||void 0===o?void 0:o.y)||void 0===s?void 0:s.title)||void 0===i?void 0:i.text)?null===(a=this.options)||void 0===a?void 0:a.scales.y.title.text:"Y Axis":(null===(d=null===(l=null===(r=null===(n=this.options)||void 0===n?void 0:n.scales)||void 0===r?void 0:r.x)||void 0===l?void 0:l.title)||void 0===d?void 0:d.text)?null===(h=this.options)||void 0===h?void 0:h.scales.x.title.text:"X Axis",c}handleViewToggle(){this.tableView=!this.tableView}checkType(){this.tableDisabled=[].includes(this.type)}handleDownloadImage(t,e){t.preventDefault();const o=e?"image/jpeg":"image/png",s=e?"jpg":"png";if(this.useHtmlLegend&&this.chart){if(["doughnut","pie"].includes(this.type))return void this.exportSimpleCanvasOnly(o,s);const t={options:JSON.parse(JSON.stringify(this.chart.options)),data:JSON.parse(JSON.stringify(this.chart.data)),type:this.chart.config.type},e=this.chart.data.datasets.map(((t,e)=>this.chart.getDatasetMeta(e).hidden));try{this.chart.options.plugins||(this.chart.options.plugins={}),this.chart.options.plugins.legend||(this.chart.options.plugins.legend={}),this.chart.options.plugins.legend.display=!0,this.chart.options.plugins.legend.position="bottom",this.chart.options.plugins.legend.labels={boxWidth:12,boxHeight:12,padding:10,font:{size:12}},this.chart.options.layout?this.chart.options.layout.padding?"number"==typeof this.chart.options.layout.padding?this.chart.options.layout.padding={top:this.chart.options.layout.padding,right:this.chart.options.layout.padding,bottom:Math.max(this.chart.options.layout.padding,40),left:this.chart.options.layout.padding}:this.chart.options.layout.padding&&(this.chart.options.layout.padding.bottom=Math.max(this.chart.options.layout.padding.bottom||0,40)):this.chart.options.layout.padding={bottom:40}:this.chart.options.layout={padding:{bottom:40}},this.chart.update("none");const i=this.canvas.getContext("2d");if(!i)throw new Error("Could not get canvas context");const a=q("--kd-color-background-page-default");i.save(),i.globalCompositeOperation="destination-over",i.fillStyle=a,i.fillRect(0,0,this.canvas.width,this.canvas.height);const n=this.chart.toBase64Image(o,1),r=document.createElement("a");r.href=n,r.download=this.chartTitle+"."+s,document.body.appendChild(r),r.click(),document.body.removeChild(r),i.restore(),this.chart.options=t.options,e.forEach(((t,e)=>{this.chart.getDatasetMeta(e).hidden=t})),this.chart.update()}catch(t){console.error("Error exporting chart with legend:",t),this.exportCanvasOnly(o,s)}}else this.exportCanvasOnly(o,s)}exportCanvasOnly(t,e){const o=this.canvas.getContext("2d");if(!o||!this.chart)return;const s=q("--kd-color-background-page-default");o.save(),o.globalCompositeOperation="destination-over",o.fillStyle=s,o.fillRect(0,0,this.canvas.width,this.canvas.height);const i=document.createElement("a");i.href=this.chart.toBase64Image(t,1),i.download=this.chartTitle+"."+e,document.body.appendChild(i),i.click(),document.body.removeChild(i),o.restore()}exportSimpleCanvasOnly(t,e){const o=this.canvas.getContext("2d");if(o&&this.chart)try{const s=JSON.parse(JSON.stringify(this.chart.options));o.save();const i=q("--kd-color-background-page-default");o.globalCompositeOperation="destination-over",o.fillStyle=i,o.fillRect(0,0,this.canvas.width,this.canvas.height),this.chart.options={...this.chart.options,plugins:{legend:{display:!0,position:"bottom",labels:{boxWidth:12,boxHeight:12,padding:10,font:{size:12}}},datalabels:{display:!1,formatter:null},tooltip:{enabled:!1},doughnutLabel:{enabled:!1}},layout:{padding:{bottom:40}}},this.chart.update("none");const a=this.chart.toBase64Image(t,1),n=document.createElement("a");n.href=a,n.download=this.chartTitle+"."+e,document.body.appendChild(n),n.click(),document.body.removeChild(n),o.restore(),this.chart.options=s,this.chart.update()}catch(o){console.error("Error in exportSimpleCanvasOnly:",o),this.exportCanvasOnly(t,e)}}handleDownloadCsv(t){t.preventDefault();let e="";for(let t=0;t<this.chart.data.datasets.length;t++)e+=L({data:this.chart.data.datasets[t],labels:this.labels});if(null==e)return;const o=this.chartTitle+".csv";e.match(/^data:text\/csv/i)||(e="data:text/csv;charset=utf-8,"+e);const s=encodeURI(e),i=document.createElement("a");i.setAttribute("href",s),i.setAttribute("download",o),document.body.appendChild(i),i.click(),document.body.removeChild(i)}handleFullscreen(){var t;(null===(t=this.shadowRoot)||void 0===t?void 0:t.fullscreenElement)?document.exitFullscreen():this.container.requestFullscreen()}handleFullscreenChange(){var t;this.fullscreen=null!==(null===(t=this.shadowRoot)||void 0===t?void 0:t.fullscreenElement)}};F.styles=D,t([i({type:String})],F.prototype,"chartTitle",void 0),t([i({type:String})],F.prototype,"description",void 0),t([i({type:String})],F.prototype,"type",void 0),t([i({type:Array})],F.prototype,"labels",void 0),t([i({type:Array})],F.prototype,"datasets",void 0),t([i({type:Object})],F.prototype,"options",void 0),t([i({type:Array})],F.prototype,"plugins",void 0),t([i({type:Number})],F.prototype,"height",void 0),t([i({type:Number})],F.prototype,"width",void 0),t([i({type:Boolean})],F.prototype,"hideDescription",void 0),t([i({type:Boolean})],F.prototype,"hideCaptions",void 0),t([i({type:Boolean})],F.prototype,"hideHeader",void 0),t([i({type:Boolean})],F.prototype,"hideControls",void 0),t([i({type:Boolean})],F.prototype,"noBorder",void 0),t([i({type:Object})],F.prototype,"customLabels",void 0),t([a()],F.prototype,"fullscreen",void 0),t([i({type:Boolean})],F.prototype,"useHtmlLegend",void 0),t([i({type:Number,reflect:!0})],F.prototype,"htmlLegendMaxHeight",void 0),t([n(".container")],F.prototype,"container",void 0),t([n("canvas")],F.prototype,"canvas",void 0),t([n(".closed-caption")],F.prototype,"ccDiv",void 0),t([a()],F.prototype,"chart",void 0),t([a()],F.prototype,"tableView",void 0),t([a()],F.prototype,"tableDisabled",void 0),t([a()],F.prototype,"mergedOptions",void 0),t([a()],F.prototype,"mergedDatasets",void 0),t([a()],F.prototype,"_widget",void 0),F=t([s("kd-chart")],F);export{F as KDChart};
+    `}_resizeChart(){this.chart&&this.chart.resize()}connectedCallback(){super.connectedCallback();try{const t=document.querySelector('meta[name="color-scheme"]');t instanceof Node&&this._themeObserver.observe(t,{attributes:!0})}catch(t){console.warn("Failed to set up theme observer:",t)}}disconnectedCallback(){this._resizeObserver.disconnect(),this._themeObserver.disconnect(),super.disconnectedCallback()}firstUpdated(){var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector(".canvas-container");this._resizeObserver.observe(e)}generateScrollableLegend(){if(!this.chart||!this.useHtmlLegend)return;const t=this.shadowRoot.querySelector(".html-legend-container");t.innerHTML="";const e={maxHeight:this.htmlLegendMaxHeight,...this.htmlLegendOptions,onItemClick:t=>{this.htmlLegendOptions.onItemClick&&this.htmlLegendOptions.onItemClick(t),this.dispatchEvent(new CustomEvent("on-click",{detail:t,bubbles:!0,composed:!0}))}};x(this.chart,t,e)}updated(t){var e,o;this.chart&&(t.has("labels")||t.has("datasets")||t.has("options"))&&this.mergeOptions().then((()=>{this.chart.data.labels=this.labels,this.chart.options=this.mergedOptions,this.chart.data.datasets.forEach(((t,e)=>{this.mergedDatasets.find((e=>e.label===t.label))||this.chart.data.datasets.splice(e,1)})),this.mergedDatasets.forEach((t=>{const e=this.chart.data.datasets.find((e=>e.label===t.label));e?Object.keys(t).forEach((o=>{e[o]=t[o]})):this.chart.data.datasets.push(t)})),this.chart.update(),this.generateScrollableLegend()}));let s=!1;if(this.datasets&&this.datasets.length)for(const t of this.datasets)if(s=(null===(e=t.data)||void 0===e?void 0:e.length)>0||(null===(o=t.tree)||void 0===o?void 0:o.length)>0||t.tree&&Object.keys(t.tree).length>0,!s){console.error("Missing data for one or more chart datasets.");break}!this.chart&&this.type&&t.has("datasets")&&s&&(this.mergeOptions().then((()=>{this.initChart()})),this.checkType()),this.chart&&(t.has("type")||t.has("plugins")||t.has("width")||t.has("height")||t.has("useHtmlLegend"))&&(this.mergeOptions().then((()=>{this.initChart()})),this.checkType()),this.chart&&t.has("noBorder")&&this.chart.resize()}initChart(){const t="meter"===this.type?$:w,e=[j,t,T,...this.plugins,k];this.useHtmlLegend&&e.push(O),this.chart&&this.chart.destroy(),this.chart=new J(this.canvas,{type:"meter"===this.type?"doughnut":this.type,data:{labels:this.labels,datasets:this.mergedDatasets},options:this.mergedOptions,plugins:e}),this.generateScrollableLegend()}async mergeOptions(){const t=[];this.datasets.forEach((e=>{e.type&&t.push(function(t){switch(t){case"../../common/config/chartTypes/bar.js":return import("../../common/config/chartTypes/bar.js");case"../../common/config/chartTypes/bubble.js":return import("../../common/config/chartTypes/bubble.js");case"../../common/config/chartTypes/bubbleMap.js":return import("../../common/config/chartTypes/bubbleMap.js");case"../../common/config/chartTypes/choropleth.js":return import("../../common/config/chartTypes/choropleth.js");case"../../common/config/chartTypes/doughnut.js":return import("../../common/config/chartTypes/doughnut.js");case"../../common/config/chartTypes/line.js":return import("../../common/config/chartTypes/line.js");case"../../common/config/chartTypes/matrix.js":return import("../../common/config/chartTypes/matrix.js");case"../../common/config/chartTypes/meter.js":return import("../../common/config/chartTypes/meter.js");case"../../common/config/chartTypes/pie.js":return import("../../common/config/chartTypes/pie.js");case"../../common/config/chartTypes/polarArea.js":return import("../../common/config/chartTypes/polarArea.js");case"../../common/config/chartTypes/radar.js":return import("../../common/config/chartTypes/radar.js");case"../../common/config/chartTypes/scatter.js":return import("../../common/config/chartTypes/scatter.js");case"../../common/config/chartTypes/treemap.js":return import("../../common/config/chartTypes/treemap.js");default:return new Promise((function(e,o){("function"==typeof queueMicrotask?queueMicrotask:setTimeout)(o.bind(null,new Error("Unknown variable dynamic import: "+t)))}))}}(`../../common/config/chartTypes/${e.type}.js`))}));const e=await Promise.all([z(`../../common/config/chartTypes/${this.type}.js`),...t]);let o=S(this);o.plugins=o.plugins||{},this.useHtmlLegend?(o.plugins.legend={display:!1},o.plugins.htmlLegend=o.plugins.htmlLegend||{}):(o.plugins.legend=o.plugins.legend||{},o.plugins.legend.display=!0),["pie","doughnut","radar","polarArea","meter"].includes(this.type)?o=l(o,E()):["choropleth","treemap","bubbleMap"].includes(this.type)||(o=l(o,M(this)));const s=JSON.parse(JSON.stringify(this.datasets));e.forEach((t=>{o=l(o,t.options(this)),s.forEach(((e,o)=>{(!e.type&&t.type===this.type||e.type===t.type)&&(s[o]=l(e,t.datasetOptions(this,o)))}))})),this.options&&(o=l(o,this.options)),this.mergedOptions=o,s.forEach(((t,e)=>{const o=d({mergeArrays:!1});s[e]=o(t,this.datasets[e])})),this.mergedDatasets=s}getTableAxisLabel(){var t,e,o,s,i,a,n,r,l,d,h;let c="";return c="y"===(null===(t=this.options)||void 0===t?void 0:t.indexAxis)?(null===(i=null===(s=null===(o=null===(e=this.options)||void 0===e?void 0:e.scales)||void 0===o?void 0:o.y)||void 0===s?void 0:s.title)||void 0===i?void 0:i.text)?null===(a=this.options)||void 0===a?void 0:a.scales.y.title.text:"Y Axis":(null===(d=null===(l=null===(r=null===(n=this.options)||void 0===n?void 0:n.scales)||void 0===r?void 0:r.x)||void 0===l?void 0:l.title)||void 0===d?void 0:d.text)?null===(h=this.options)||void 0===h?void 0:h.scales.x.title.text:"X Axis",c}handleViewToggle(){this.tableView=!this.tableView}checkType(){this.tableDisabled=[].includes(this.type)}handleDownloadImage(t,e){t.preventDefault();const o=e?"image/jpeg":"image/png",s=e?"jpg":"png";if(this.useHtmlLegend&&this.chart){if(["doughnut","pie"].includes(this.type))return void this.exportSimpleCanvasOnly(o,s);const t={options:JSON.parse(JSON.stringify(this.chart.options)),data:JSON.parse(JSON.stringify(this.chart.data)),type:this.chart.config.type},e=this.chart.data.datasets.map(((t,e)=>this.chart.getDatasetMeta(e).hidden));try{this.chart.options.plugins||(this.chart.options.plugins={}),this.chart.options.plugins.legend||(this.chart.options.plugins.legend={}),this.chart.options.plugins.legend.display=!0,this.chart.options.plugins.legend.position="bottom",this.chart.options.plugins.legend.labels={boxWidth:12,boxHeight:12,padding:10,font:{size:12}},this.chart.options.layout?this.chart.options.layout.padding?"number"==typeof this.chart.options.layout.padding?this.chart.options.layout.padding={top:this.chart.options.layout.padding,right:this.chart.options.layout.padding,bottom:Math.max(this.chart.options.layout.padding,40),left:this.chart.options.layout.padding}:this.chart.options.layout.padding&&(this.chart.options.layout.padding.bottom=Math.max(this.chart.options.layout.padding.bottom||0,40)):this.chart.options.layout.padding={bottom:40}:this.chart.options.layout={padding:{bottom:40}},this.chart.update("none");const i=this.canvas.getContext("2d");if(!i)throw new Error("Could not get canvas context");const a=F("--kd-color-background-page-default");i.save(),i.globalCompositeOperation="destination-over",i.fillStyle=a,i.fillRect(0,0,this.canvas.width,this.canvas.height);const n=this.chart.toBase64Image(o,1),r=document.createElement("a");r.href=n,r.download=this.chartTitle+"."+s,document.body.appendChild(r),r.click(),document.body.removeChild(r),i.restore(),this.chart.options=t.options,e.forEach(((t,e)=>{this.chart.getDatasetMeta(e).hidden=t})),this.chart.update()}catch(t){console.error("Error exporting chart with legend:",t),this.exportCanvasOnly(o,s)}}else this.exportCanvasOnly(o,s)}exportCanvasOnly(t,e){const o=this.canvas.getContext("2d");if(!o||!this.chart)return;const s=F("--kd-color-background-page-default");o.save(),o.globalCompositeOperation="destination-over",o.fillStyle=s,o.fillRect(0,0,this.canvas.width,this.canvas.height);const i=document.createElement("a");i.href=this.chart.toBase64Image(t,1),i.download=this.chartTitle+"."+e,document.body.appendChild(i),i.click(),document.body.removeChild(i),o.restore()}exportSimpleCanvasOnly(t,e){const o=this.canvas.getContext("2d");if(o&&this.chart)try{const s=JSON.parse(JSON.stringify(this.chart.options));o.save();const i=F("--kd-color-background-page-default");o.globalCompositeOperation="destination-over",o.fillStyle=i,o.fillRect(0,0,this.canvas.width,this.canvas.height),this.chart.options={...this.chart.options,plugins:{legend:{display:!0,position:"bottom",labels:{boxWidth:12,boxHeight:12,padding:10,font:{size:12}}},datalabels:{display:!1,formatter:null},tooltip:{enabled:!1},doughnutLabel:{enabled:!1}},layout:{padding:{bottom:40}}},this.chart.update("none");const a=this.chart.toBase64Image(t,1),n=document.createElement("a");n.href=a,n.download=this.chartTitle+"."+e,document.body.appendChild(n),n.click(),document.body.removeChild(n),o.restore(),this.chart.options=s,this.chart.update()}catch(o){console.error("Error in exportSimpleCanvasOnly:",o),this.exportCanvasOnly(t,e)}}handleDownloadCsv(t){t.preventDefault();let e="";for(let t=0;t<this.chart.data.datasets.length;t++)e+=D({data:this.chart.data.datasets[t],labels:this.labels});if(null==e)return;const o=this.chartTitle+".csv";e.match(/^data:text\/csv/i)||(e="data:text/csv;charset=utf-8,"+e);const s=encodeURI(e),i=document.createElement("a");i.setAttribute("href",s),i.setAttribute("download",o),document.body.appendChild(i),i.click(),document.body.removeChild(i)}handleFullscreen(){var t;(null===(t=this.shadowRoot)||void 0===t?void 0:t.fullscreenElement)?document.exitFullscreen():this.container.requestFullscreen()}handleFullscreenChange(){var t;this.fullscreen=null!==(null===(t=this.shadowRoot)||void 0===t?void 0:t.fullscreenElement)}};I.styles=A,t([i({type:String})],I.prototype,"chartTitle",void 0),t([i({type:String})],I.prototype,"description",void 0),t([i({type:String})],I.prototype,"type",void 0),t([i({type:Array})],I.prototype,"labels",void 0),t([i({type:Array})],I.prototype,"datasets",void 0),t([i({type:Object})],I.prototype,"options",void 0),t([i({type:Array})],I.prototype,"plugins",void 0),t([i({type:Number})],I.prototype,"height",void 0),t([i({type:Number})],I.prototype,"width",void 0),t([i({type:Boolean})],I.prototype,"hideDescription",void 0),t([i({type:Boolean})],I.prototype,"hideCaptions",void 0),t([i({type:Boolean})],I.prototype,"hideHeader",void 0),t([i({type:Boolean})],I.prototype,"hideControls",void 0),t([i({type:Boolean})],I.prototype,"noBorder",void 0),t([i({type:Object})],I.prototype,"customLabels",void 0),t([a()],I.prototype,"fullscreen",void 0),t([i({type:Boolean})],I.prototype,"useHtmlLegend",void 0),t([i({type:Number,reflect:!0})],I.prototype,"htmlLegendMaxHeight",void 0),t([i({type:Object})],I.prototype,"htmlLegendOptions",void 0),t([n(".container")],I.prototype,"container",void 0),t([n("canvas")],I.prototype,"canvas",void 0),t([n(".closed-caption")],I.prototype,"ccDiv",void 0),t([a()],I.prototype,"chart",void 0),t([a()],I.prototype,"tableView",void 0),t([a()],I.prototype,"tableDisabled",void 0),t([a()],I.prototype,"mergedOptions",void 0),t([a()],I.prototype,"mergedDatasets",void 0),t([a()],I.prototype,"_widget",void 0),I=t([s("kd-chart")],I);export{I as KDChart};
 //# sourceMappingURL=chart.js.map

package/components/chart/chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart.js","sources":["../../../src/components/chart/chart.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, state, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { deepmerge, deepmergeCustom } from 'deepmerge-ts';\nimport Chart from 'chart.js/auto';\nimport 'chartjs-adapter-date-fns';\nimport {\n  ChoroplethController,\n  BubbleMapController,\n  GeoFeature,\n  ColorScale,\n  SizeScale,\n  ProjectionScale,\n} from 'chartjs-chart-geo';\nimport { TreemapController, TreemapElement } from 'chartjs-chart-treemap';\nimport { MatrixController, MatrixElement } from 'chartjs-chart-matrix';\nimport canvasBackgroundPlugin from '../../common/plugins/canvasBackground';\nimport doughnutLabelPlugin from '../../common/plugins/doughnutLabel';\nimport meterGaugePlugin from '../../common/plugins/meterGaugeNeedle';\nimport gradientLegendPlugin from '../../common/plugins/gradientLegend';\nimport { renderHTMLLegend } from '../../common/legend';\nimport a11yPlugin from 'chartjs-plugin-a11y-legend';\nimport datalabelsPlugin from 'chartjs-plugin-datalabels';\nimport annotationPlugin from 'chartjs-plugin-annotation';\nimport { convertChartDataToCSV, debounce } from '../../common/helpers/helpers';\nimport ChartScss from './chart.scss';\nimport globalOptions from '../../common/config/globalOptions';\nimport globalOptionsNonRadial from '../../common/config/globalOptionsNonRadial';\nimport globalOptionsRadial from '../../common/config/globalOptionsRadial';\nimport chartIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/analytics.svg';\nimport tableIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/table-view.svg';\nimport downloadIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/download.svg';\nimport maximizeIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/expand.svg';\nimport minimizeIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/shrink.svg';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { getTokenThemeVal } from '@kyndryl-design-system/shidoka-foundation/common/helpers/color';\n\nChart.register(\n  ChoroplethController,\n  BubbleMapController,\n  GeoFeature,\n  ColorScale,\n  SizeScale,\n  ProjectionScale,\n  TreemapController,\n  TreemapElement,\n  MatrixController,\n  MatrixElement,\n  annotationPlugin,\n  datalabelsPlugin\n);\n\n/**\n * Chart.js wrapper component.\n * @slot unnamed - Slot for custom content between header and chart.\n * @slot controls - Slot for custom controls such as an overflow menu.\n * @slot tooltip - Slot for tooltip in header.\n * @slot draghandle - Slot for widget drag handle.\n */\n@customElement('kd-chart')\nexport class KDChart extends LitElement {\n  static override styles = ChartScss;\n\n  /** Chart title. */\n  @property({ type: String })\n  chartTitle = '';\n\n  /** Chart description. */\n  @property({ type: String })\n  description = '';\n\n  /** Chart.js chart type. */\n  @property({ type: String })\n  type: any = '';\n\n  /** Chart.js data.labels. */\n  @property({ type: Array })\n  labels!: Array<string>;\n\n  /** Chart.js data.datasets. */\n  @property({ type: Array })\n  datasets!: Array<any>;\n\n  /** Chart.js options. Can override Shidoka defaults. */\n  @property({ type: Object })\n  options: any = {};\n\n  /** Chart.js additional plugins. Must be registerable inline via Chart.plugins array, not globally via Chart.register. */\n  @property({ type: Array })\n  plugins: any = [];\n\n  /** Chart.js canvas height (px). Disables maintainAspectRatio option. */\n  @property({ type: Number })\n  height: any = null;\n\n  /** Chart.js canvas width (px). Disables maintainAspectRatio option. */\n  @property({ type: Number })\n  width: any = null;\n\n  /** Hides the description visually. */\n  @property({ type: Boolean })\n  hideDescription = false;\n\n  /** Hides the closed captions visually. */\n  @property({ type: Boolean })\n  hideCaptions = false;\n\n  /** Hides the title & description. */\n  @property({ type: Boolean })\n  hideHeader = false;\n\n  /** Hides the controls. */\n  @property({ type: Boolean })\n  hideControls = false;\n\n  /** Removes the outer border and padding. */\n  @property({ type: Boolean })\n  noBorder = false;\n\n  /** Customizable text labels. */\n  @property({ type: Object })\n  customLabels = {\n    toggleView: 'Toggle View Mode',\n    toggleFullscreen: 'Toggle Fullscreen',\n    downloadMenu: 'Download Menu',\n    downloadCsv: 'Download as CSV',\n    downloadPng: 'Download as PNG',\n    downloadJpg: 'Download as JPG',\n  };\n\n  /** Fullscreen state.\n   * @ignore\n   */\n  @state()\n  fullscreen = false;\n\n  /** Use HTML legend instead of Chart.js built-in canvas legend.\n   * @public\n   */\n  @property({ type: Boolean })\n  useHtmlLegend = false;\n\n  /** Max height for HTML legend scroll container (px). */\n  @property({ type: Number, reflect: true })\n  htmlLegendMaxHeight = 100;\n\n  /**\n   * Queries the container element.\n   * @ignore\n   */\n  @query('.container')\n  container!: HTMLCanvasElement;\n\n  /**\n   * Queries the canvas element.\n   * @ignore\n   */\n  @query('canvas')\n  canvas!: HTMLCanvasElement;\n\n  /**\n   * Queries the closed caption div.\n   * @ignore\n   */\n  @query('.closed-caption')\n  ccDiv!: HTMLDivElement;\n\n  /** The chart instance.\n   * @ignore\n   */\n  @state()\n  chart: any = null;\n\n  /** Table view mode.\n   * @ignore\n   */\n  @state()\n  tableView = false;\n\n  /** Disable table view feature.\n   * @ignore\n   */\n  @state()\n  tableDisabled = false;\n\n  /** Merged options.\n   * @ignore\n   */\n  @state()\n  mergedOptions: any = {};\n\n  /** Merged datasets.\n   * @ignore\n   */\n  @state()\n  mergedDatasets: any = {};\n\n  /** Is Widget. Inherited from kyn-widget.\n   * @internal\n   */\n  @state()\n  _widget = false;\n\n  /** ResizeObserver for canvas-container.\n   * @internal\n   */\n  _resizeObserver: any = new ResizeObserver(\n    debounce(() => {\n      this._resizeChart();\n    })\n  );\n\n  _themeObserver: any = new MutationObserver(() => {\n    if (this.chart) {\n      this.mergeOptions().then(() => {\n        this.initChart();\n      });\n    }\n  });\n\n  override render() {\n    const Classes = {\n      container: true,\n      fullscreen: this.fullscreen,\n      'no-border': this.noBorder || this._widget,\n      widget: this._widget,\n    };\n\n    return html`\n      <div\n        class=${classMap(Classes)}\n        @fullscreenchange=${() => this.handleFullscreenChange()}\n      >\n        ${!this.hideHeader || !this.hideControls\n          ? html`\n              <div class=\"header\">\n                ${!this.hideHeader\n                  ? html`\n                      <slot name=\"draghandle\"></slot>\n\n                      <div id=\"titleDesc\">\n                        <div class=\"title\">\n                          ${this.chartTitle}\n                          <slot name=\"tooltip\"></slot>\n                        </div>\n                        <div\n                          class=\"description ${this.hideDescription\n                            ? 'hidden-visually'\n                            : ''}\"\n                        >\n                          ${this.description}\n                        </div>\n                      </div>\n                    `\n                  : null}\n                ${!this.hideControls\n                  ? html`\n                      <div class=\"controls\">\n                        ${!this.tableDisabled\n                          ? html`\n                              <button\n                                class=\"control-button\"\n                                @click=${() => this.handleViewToggle()}\n                                aria-label=${this.customLabels.toggleView}\n                                title=${this.customLabels.toggleView}\n                              >\n                                <span slot=\"icon\">\n                                  ${this.tableView\n                                    ? unsafeSVG(chartIcon)\n                                    : unsafeSVG(tableIcon)}\n                                </span>\n                              </button>\n                            `\n                          : null}\n\n                        <button\n                          class=\"control-button\"\n                          @click=${() => this.handleFullscreen()}\n                          aria-label=${this.customLabels.toggleFullscreen}\n                          title=${this.customLabels.toggleFullscreen}\n                        >\n                          <span slot=\"icon\">\n                            ${this.fullscreen\n                              ? unsafeSVG(minimizeIcon)\n                              : unsafeSVG(maximizeIcon)}\n                          </span>\n                        </button>\n\n                        <div class=\"download\">\n                          <button\n                            tabindex=\"0\"\n                            class=\"control-button\"\n                            aria-label=${this.customLabels.downloadMenu}\n                            title=${this.customLabels.downloadMenu}\n                          >\n                            <span slot=\"icon\">\n                              ${unsafeSVG(downloadIcon)}\n                            </span>\n                          </button>\n\n                          <div class=\"download-menu\">\n                            ${!this.tableDisabled\n                              ? html`\n                                  <button\n                                    tabindex=\"0\"\n                                    @click=${(e: Event) =>\n                                      this.handleDownloadCsv(e)}\n                                  >\n                                    ${this.customLabels.downloadCsv}\n                                  </button>\n                                `\n                              : null}\n                            <button\n                              tabindex=\"0\"\n                              @click=${(e: Event) =>\n                                this.handleDownloadImage(e, false)}\n                            >\n                              ${this.customLabels.downloadPng}\n                            </button>\n                            <button\n                              tabindex=\"0\"\n                              @click=${(e: Event) =>\n                                this.handleDownloadImage(e, true)}\n                            >\n                              ${this.customLabels.downloadJpg}\n                            </button>\n                          </div>\n                        </div>\n\n                        <slot name=\"controls\"></slot>\n                      </div>\n                    `\n                  : null}\n              </div>\n            `\n          : null}\n\n        <div>\n          <slot></slot>\n        </div>\n\n        <figure class=\"${this.tableView ? 'hidden' : ''}\">\n          <div\n            class=\"canvas-container\"\n            style=\"${this.width ? `width: ${this.width}px;` : ''}\n            ${this.height ? `height: ${this.height}px;` : ''}\"\n          >\n            <canvas role=\"img\" aria-labelledby=\"titleDesc\"></canvas>\n          </div>\n          <figcaption>\n            <div\n              class=\"closed-caption ${this.hideCaptions\n                ? 'hidden-visually'\n                : ''}\"\n            ></div>\n          </figcaption>\n\n          <div\n            class=\"html-legend-container\"\n            ?hidden=${!this.useHtmlLegend}\n          ></div>\n        </figure>\n\n        ${!this.tableDisabled && this.tableView\n          ? html`\n              <div class=\"table\">\n                <table>\n                  ${['pie', 'doughnut', 'polarArea'].includes(this.type)\n                    ? html`\n                        <thead>\n                          <tr>\n                            <th>Label</th>\n                            <th>Value</th>\n                          </tr>\n                        </thead>\n                        <tbody>\n                          ${this.labels.map(\n                            (label, i) => html`\n                              <tr>\n                                <td>${label}</td>\n                                <td>${this.datasets[0].data[i]}</td>\n                              </tr>\n                            `\n                          )}\n                        </tbody>\n                      `\n                    : this.type === 'matrix'\n                    ? html`\n                        <thead>\n                          <tr>\n                            <th>\n                              ${this.options?.scales?.y?.title?.text ||\n                              'Y Axis'}\n                            </th>\n                            <th>\n                              ${this.options?.scales?.x?.title?.text ||\n                              'X Axis'}\n                            </th>\n                            ${this.datasets.map(\n                              (dataset) => html`<th>${dataset.label}</th>`\n                            )}\n                          </tr>\n                        </thead>\n                        <tbody>\n                          ${this.datasets[0].data.map((cell: any) => {\n                            const xLabel = Array.isArray(this.labels)\n                              ? this.labels[cell.x - 1] || ''\n                              : (this.labels as any).x?.[cell.x - 1] || '';\n                            const yLabel = Array.isArray(this.labels)\n                              ? this.labels[cell.y - 1] || ''\n                              : (this.labels as any).y?.[cell.y - 1] || '';\n                            return html`\n                              <tr>\n                                <td>${yLabel}</td>\n                                <td>${xLabel}</td>\n                                ${this.datasets.map(\n                                  () => html`<td>${cell.value}</td>`\n                                )}\n                              </tr>\n                            `;\n                          })}\n                        </tbody>\n                      `\n                    : html`\n                        <thead>\n                          <tr>\n                            ${this.labels?.length || this.type === 'treemap'\n                              ? html`<th>${this.getTableAxisLabel()}</th>`\n                              : null}\n                            ${this.datasets.map(\n                              (dataset) => html`<th>${dataset.label}</th>`\n                            )}\n                          </tr>\n                        </thead>\n                        <tbody>\n                          ${this.type === 'treemap'\n                            ? Array.isArray(this.datasets[0].tree)\n                              ? this.datasets[0].tree.map(\n                                  (_value: any) => html`\n                                    <tr>\n                                      <td>\n                                        ${_value[this.datasets[0].labelKey]}\n                                      </td>\n                                      <td>${_value[this.datasets[0].key]}</td>\n                                    </tr>\n                                  `\n                                )\n                              : Object.entries(this.datasets[0].tree).map(\n                                  (_value: any) => {\n                                    const HtmlStrings = [];\n                                    if (_value[1].value) {\n                                      HtmlStrings.push(html`\n                                        <tr>\n                                          <td>${_value[0]}</td>\n                                          <td>${_value[1].value}</td>\n                                        </tr>\n                                      `);\n                                    } else {\n                                      Object.entries(_value[1]).map(\n                                        (_subValue: any) => {\n                                          if (_subValue[1].value) {\n                                            HtmlStrings.push(html`\n                                              <tr>\n                                                <td>${_subValue[0]}</td>\n                                                <td>${_subValue[1].value}</td>\n                                              </tr>\n                                            `);\n                                          } else {\n                                            Object.entries(_subValue[1]).map(\n                                              (_subSubValue: any) => {\n                                                HtmlStrings.push(html`\n                                                  <tr>\n                                                    <td>${_subSubValue[0]}</td>\n                                                    <td>\n                                                      ${_subSubValue[1].value}\n                                                    </td>\n                                                  </tr>\n                                                `);\n                                              }\n                                            );\n                                          }\n                                        }\n                                      );\n                                    }\n                                    return HtmlStrings;\n                                  }\n                                )\n                            : this.datasets[0].data.map(\n                                (_value: any, i: number) => {\n                                  const IndexAxis =\n                                    this.options.indexAxis || 'x';\n                                  const NonIndexAxis =\n                                    IndexAxis === 'x' ? 'y' : 'x';\n                                  return html`\n                                    <tr>\n                                      ${this.labels?.length\n                                        ? html`\n                                            ${this.options?.scales?.[IndexAxis]\n                                              ?.type === 'time'\n                                              ? html`\n                                                  <td>\n                                                    ${new Date(\n                                                      this.labels[i]\n                                                    ).toLocaleString()}\n                                                  </td>\n                                                `\n                                              : html`\n                                                  <td>${this.labels[i]}</td>\n                                                `}\n                                          `\n                                        : null}\n                                      ${this.datasets.map((dataset) => {\n                                        if (i >= dataset.data.length)\n                                          return html`<td></td>`;\n\n                                        const dataPoint = dataset.data[i];\n                                        if (\n                                          this.type === 'bubbleMap' ||\n                                          this.type === 'choropleth'\n                                        ) {\n                                          return html`\n                                            <td>${dataset.data[i].value}</td>\n                                          `;\n                                        } else if (\n                                          this.options?.scales[NonIndexAxis]\n                                            ?.type === 'time'\n                                        ) {\n                                          return html`\n                                            <td>\n                                              ${new Date(\n                                                dataPoint\n                                              ).toLocaleString()}\n                                            </td>\n                                          `;\n                                        } else if (Array.isArray(dataPoint)) {\n                                          return html`\n                                            <td>\n                                              ${dataPoint[0]}, ${dataPoint[1]}\n                                            </td>\n                                          `;\n                                        } else if (\n                                          [\n                                            'pie',\n                                            'doughnut',\n                                            'polarArea',\n                                          ].includes(this.type)\n                                        ) {\n                                          return html` <td>${dataPoint}</td> `;\n                                        } else if (\n                                          typeof dataPoint === 'object' &&\n                                          !Array.isArray(dataPoint) &&\n                                          dataPoint !== null\n                                        ) {\n                                          return html`\n                                            <td>\n                                              ${Object.keys(dataPoint).map(\n                                                (key) => {\n                                                  const Label =\n                                                    this.options?.scales?.[key]\n                                                      ?.title?.text || key;\n                                                  const DisplayData =\n                                                    this.options?.scales?.[key]\n                                                      ?.type === 'time' &&\n                                                    dataPoint[key]\n                                                      ? new Date(\n                                                          dataPoint[key]\n                                                        ).toLocaleString()\n                                                      : dataPoint[key];\n                                                  return html`\n                                                    <div>\n                                                      <strong>\n                                                        ${Label}:\n                                                      </strong>\n                                                      ${DisplayData}\n                                                    </div>\n                                                  `;\n                                                }\n                                              )}\n                                            </td>\n                                          `;\n                                        } else {\n                                          return html`\n                                            <td>${dataset.data[i]}</td>\n                                          `;\n                                        }\n                                      })}\n                                    </tr>\n                                  `;\n                                }\n                              )}\n                        </tbody>\n                      `}\n                </table>\n              </div>\n            `\n          : null}\n      </div>\n    `;\n  }\n\n  private _resizeChart() {\n    if (this.chart) {\n      this.chart.resize();\n    }\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this._themeObserver.observe(\n      document.querySelector('meta[name=\"color-scheme\"]'),\n      { attributes: true }\n    );\n  }\n\n  override disconnectedCallback() {\n    this._resizeObserver.disconnect();\n    this._themeObserver.disconnect();\n\n    super.disconnectedCallback();\n  }\n\n  override firstUpdated() {\n    const el = this.shadowRoot?.querySelector('.canvas-container');\n    this._resizeObserver.observe(el);\n  }\n\n  private generateScrollableLegend() {\n    if (!this.chart || !this.useHtmlLegend) return;\n\n    const legendContainer = this.shadowRoot?.querySelector(\n      '.html-legend-container'\n    );\n    if (!legendContainer) return;\n\n    const legendOptions = this.mergedOptions.plugins.customLegend;\n\n    renderHTMLLegend(this.chart, legendContainer as HTMLElement, {\n      maxHeight: this.htmlLegendMaxHeight,\n      boxWidth: legendOptions?.boxWidth || 16,\n      boxHeight: legendOptions?.boxHeight || 16,\n      borderRadius: legendOptions?.borderRadius || 2,\n    });\n  }\n\n  override updated(changedProps: any) {\n    // Update chart instance when data changes.\n    if (\n      this.chart &&\n      (changedProps.has('labels') ||\n        changedProps.has('datasets') ||\n        changedProps.has('options'))\n    ) {\n      this.mergeOptions().then(() => {\n        this.chart.data.labels = this.labels;\n        this.chart.options = this.mergedOptions;\n\n        // remove datasets not in mergedDatasets\n        this.chart.data.datasets.forEach((dataset: any, index: number) => {\n          const NewDataset = this.mergedDatasets.find(\n            (newDataset: any) => newDataset.label === dataset.label\n          );\n\n          if (!NewDataset) {\n            // remove\n            this.chart.data.datasets.splice(index, 1);\n          }\n        });\n\n        // update datasets, add new ones\n        this.mergedDatasets.forEach((dataset: any) => {\n          const OldDataset = this.chart.data.datasets.find(\n            (oldDataset: any) => oldDataset.label === dataset.label\n          );\n\n          if (!OldDataset) {\n            // add new dataset\n            this.chart.data.datasets.push(dataset);\n          } else {\n            // update each key/entry in the dataset object\n            Object.keys(dataset).forEach((key) => {\n              OldDataset[key] = dataset[key];\n            });\n          }\n        });\n\n        this.chart.update();\n\n        this.generateScrollableLegend();\n      });\n    }\n\n    // init chart\n    // check to make sure initial datasets + data have been provided\n    let hasData = false;\n    if (this.datasets && this.datasets.length) {\n      for (const dataset of this.datasets) {\n        hasData =\n          dataset.data?.length > 0 ||\n          dataset.tree?.length > 0 ||\n          (dataset.tree && Object.keys(dataset.tree).length > 0);\n\n        if (!hasData) {\n          console.error('Missing data for one or more chart datasets.');\n          break;\n        }\n      }\n    }\n\n    if (!this.chart && this.type && changedProps.has('datasets') && hasData) {\n      this.mergeOptions().then(() => {\n        this.initChart();\n      });\n\n      this.checkType();\n    }\n\n    // Re-init chart instance when type, plugins, colorPalette, width, height, or useHtmlLegend change.\n    if (\n      this.chart &&\n      (changedProps.has('type') ||\n        changedProps.has('plugins') ||\n        changedProps.has('width') ||\n        changedProps.has('height') ||\n        changedProps.has('useHtmlLegend'))\n    ) {\n      this.mergeOptions().then(() => {\n        this.initChart();\n      });\n\n      this.checkType();\n    }\n\n    if (this.chart && changedProps.has('noBorder')) {\n      this.chart.resize();\n    }\n  }\n\n  /**\n   * Initializes a bar chart using the Chart.js library with provided labels, datasets,\n   * and options.\n   */\n  private initChart() {\n    const ignoredTypes = ['choropleth', 'treemap', 'bubbleMap'];\n\n    // Configure chart options\n    Chart.defaults.color = getTokenThemeVal('--kd-color-text-level-primary');\n\n    // We already handled legend config in mergeOptions\n\n    // Select plugin when type='meter'. Otherwise both plugins (meterGaugePlugin & doughnutLabelPlugin) are called\n    const pluginSelectForDoghnutMeter =\n      this.type === 'meter' ? meterGaugePlugin : doughnutLabelPlugin;\n\n    let plugins = [\n      canvasBackgroundPlugin,\n      pluginSelectForDoghnutMeter,\n      gradientLegendPlugin,\n      ...this.plugins,\n    ];\n\n    // only add certain plugins for standard chart types\n    if (!ignoredTypes.includes(this.type)) {\n      // plugins = [...plugins, a11yPlugin, musicPlugin];\n      plugins = [...plugins, a11yPlugin];\n    }\n\n    if (this.chart) {\n      this.chart.destroy();\n    }\n\n    this.chart = new Chart(this.canvas, {\n      //type: this.type,\n      type: this.type === 'meter' ? 'doughnut' : this.type,\n      data: {\n        labels: this.labels,\n        datasets: this.mergedDatasets,\n      },\n      options: this.mergedOptions,\n      plugins: plugins,\n    });\n\n    this.generateScrollableLegend();\n  }\n\n  /**\n   * Merges various chart type options and dataset options to create a\n   * final set of options for a chart.\n   */\n  private async mergeOptions() {\n    const radialTypes = ['pie', 'doughnut', 'radar', 'polarArea', 'meter'];\n    const ignoredTypes = ['choropleth', 'treemap', 'bubbleMap'];\n\n    const additionalTypeImports: any = [];\n    this.datasets.forEach((dataset) => {\n      // get chart types from datasets so we can import additional configs\n      if (dataset.type) {\n        additionalTypeImports.push(\n          import(`../../common/config/chartTypes/${dataset.type}.js`)\n        );\n      }\n    });\n\n    // import main and additional chart type configs\n    const chartTypeConfigs = await Promise.all([\n      import(`../../common/config/chartTypes/${this.type}.js`),\n      ...additionalTypeImports,\n    ]);\n\n    // start with global options\n    let mergedOptions: any = globalOptions(this);\n\n    // Configure legend display based on useHtmlLegend property\n    if (!this.useHtmlLegend) {\n      // Enable built-in Chart.js legend when HTML legend is disabled\n      mergedOptions.plugins = mergedOptions.plugins || {};\n      mergedOptions.plugins.legend = mergedOptions.plugins.legend || {};\n      mergedOptions.plugins.legend.display = true;\n\n      // Disable customLegend options when using built-in legend\n      if (mergedOptions.plugins.customLegend) {\n        mergedOptions.plugins.customLegend.display = false;\n      }\n    }\n\n    // merge global type options\n    if (radialTypes.includes(this.type)) {\n      mergedOptions = deepmerge(mergedOptions, globalOptionsRadial(this));\n    } else if (!ignoredTypes.includes(this.type)) {\n      mergedOptions = deepmerge(mergedOptions, globalOptionsNonRadial(this));\n    }\n\n    const mergedDatasets: any = JSON.parse(JSON.stringify(this.datasets));\n\n    chartTypeConfigs.forEach((chartTypeConfig: any) => {\n      // merge all of the imported chart type options with the global options\n      mergedOptions = deepmerge(mergedOptions, chartTypeConfig.options(this));\n\n      // merge all of the imported chart type dataset options\n      mergedDatasets.forEach((dataset: any, index: number) => {\n        if (\n          (!dataset.type && chartTypeConfig.type === this.type) ||\n          dataset.type === chartTypeConfig.type\n        ) {\n          mergedDatasets[index] = deepmerge(\n            dataset,\n            chartTypeConfig.datasetOptions(this, index)\n          );\n        }\n      });\n    });\n\n    if (this.options) {\n      // merge any consumer supplied options with defaults\n      mergedOptions = deepmerge(mergedOptions, this.options);\n    }\n    this.mergedOptions = mergedOptions;\n\n    // merge default chart type dataset options with consumer supplied datasets\n    mergedDatasets.forEach((dataset: object, index: number) => {\n      const customDeepmerge = deepmergeCustom({\n        mergeArrays: false,\n      });\n      mergedDatasets[index] = customDeepmerge(dataset, this.datasets[index]);\n    });\n\n    this.mergedDatasets = mergedDatasets;\n  }\n\n  private getTableAxisLabel() {\n    let label = '';\n\n    if (this.options?.indexAxis === 'y') {\n      if (this.options?.scales?.y?.title?.text) {\n        label = this.options?.scales.y.title.text;\n      } else {\n        label = 'Y Axis';\n      }\n    } else {\n      if (this.options?.scales?.x?.title?.text) {\n        label = this.options?.scales.x.title.text;\n      } else {\n        label = 'X Axis';\n      }\n    }\n\n    return label;\n  }\n\n  private handleViewToggle() {\n    this.tableView = !this.tableView;\n  }\n\n  private checkType() {\n    // chart types that can't have a data table view\n    const blacklist: any = [];\n    this.tableDisabled = blacklist.includes(this.type);\n  }\n\n  private handleDownloadImage(e: Event, jpeg: boolean) {\n    e.preventDefault();\n\n    const imgFormat = jpeg ? 'image/jpeg' : 'image/png';\n    const fileExt = jpeg ? 'jpg' : 'png';\n\n    if (this.useHtmlLegend && this.chart) {\n      if (['doughnut', 'pie'].includes(this.type)) {\n        this.exportSimpleCanvasOnly(imgFormat, fileExt);\n        return;\n      }\n\n      const originalConfig = {\n        options: JSON.parse(JSON.stringify(this.chart.options)),\n        data: JSON.parse(JSON.stringify(this.chart.data)),\n        type: this.chart.config.type,\n      };\n\n      const originalHidden = this.chart.data.datasets.map(\n        (_: unknown, i: number) => this.chart.getDatasetMeta(i).hidden\n      );\n\n      try {\n        if (!this.chart.options.plugins) {\n          this.chart.options.plugins = {};\n        }\n\n        if (!this.chart.options.plugins.legend) {\n          this.chart.options.plugins.legend = {};\n        }\n\n        this.chart.options.plugins.legend.display = true;\n        this.chart.options.plugins.legend.position = 'bottom';\n        this.chart.options.plugins.legend.labels = {\n          boxWidth: 12,\n          boxHeight: 12,\n          padding: 10,\n          font: {\n            size: 12,\n          },\n        };\n\n        if (!this.chart.options.layout) {\n          this.chart.options.layout = { padding: { bottom: 40 } };\n        } else if (!this.chart.options.layout.padding) {\n          this.chart.options.layout.padding = { bottom: 40 };\n        } else if (typeof this.chart.options.layout.padding === 'number') {\n          this.chart.options.layout.padding = {\n            top: this.chart.options.layout.padding,\n            right: this.chart.options.layout.padding,\n            bottom: Math.max(this.chart.options.layout.padding, 40),\n            left: this.chart.options.layout.padding,\n          };\n        } else if (this.chart.options.layout.padding) {\n          this.chart.options.layout.padding.bottom = Math.max(\n            this.chart.options.layout.padding.bottom || 0,\n            40\n          );\n        }\n\n        this.chart.update('none');\n\n        const context = this.canvas.getContext('2d');\n        if (!context) throw new Error('Could not get canvas context');\n\n        const color = getTokenThemeVal('--kd-color-background-page-default');\n        context.save();\n        context.globalCompositeOperation = 'destination-over';\n        context.fillStyle = color;\n        context.fillRect(0, 0, this.canvas.width, this.canvas.height);\n\n        const imgData = this.chart.toBase64Image(imgFormat, 1);\n\n        const a = document.createElement('a');\n        a.href = imgData;\n        a.download = this.chartTitle + '.' + fileExt;\n        document.body.appendChild(a);\n        a.click();\n        document.body.removeChild(a);\n\n        context.restore();\n        this.chart.options = originalConfig.options;\n        originalHidden.forEach((hidden: boolean, i: number) => {\n          this.chart.getDatasetMeta(i).hidden = hidden;\n        });\n        this.chart.update();\n      } catch (error) {\n        console.error('Error exporting chart with legend:', error);\n        this.exportCanvasOnly(imgFormat, fileExt);\n      }\n    } else {\n      this.exportCanvasOnly(imgFormat, fileExt);\n    }\n  }\n\n  private exportCanvasOnly(imgFormat: string, fileExt: string) {\n    const context = this.canvas.getContext('2d');\n    if (!context || !this.chart) return;\n\n    const color = getTokenThemeVal('--kd-color-background-page-default');\n    context.save();\n    context.globalCompositeOperation = 'destination-over';\n    context.fillStyle = color;\n    context.fillRect(0, 0, this.canvas.width, this.canvas.height);\n\n    const a = document.createElement('a');\n    a.href = this.chart.toBase64Image(imgFormat, 1);\n    a.download = this.chartTitle + '.' + fileExt;\n    document.body.appendChild(a);\n    a.click();\n    document.body.removeChild(a);\n\n    context.restore();\n  }\n\n  private exportSimpleCanvasOnly(imgFormat: string, fileExt: string) {\n    const context = this.canvas.getContext('2d');\n    if (!context || !this.chart) return;\n\n    try {\n      const originalOptions = JSON.parse(JSON.stringify(this.chart.options));\n\n      context.save();\n      const color = getTokenThemeVal('--kd-color-background-page-default');\n      context.globalCompositeOperation = 'destination-over';\n      context.fillStyle = color;\n      context.fillRect(0, 0, this.canvas.width, this.canvas.height);\n\n      this.chart.options = {\n        ...this.chart.options,\n        plugins: {\n          legend: {\n            display: true,\n            position: 'bottom',\n            labels: {\n              boxWidth: 12,\n              boxHeight: 12,\n              padding: 10,\n              font: { size: 12 },\n            },\n          },\n          datalabels: { display: false, formatter: null },\n          tooltip: { enabled: false },\n          doughnutLabel: { enabled: false },\n        },\n        layout: {\n          padding: { bottom: 40 },\n        },\n      };\n\n      this.chart.update('none');\n\n      const imgData = this.chart.toBase64Image(imgFormat, 1);\n\n      const a = document.createElement('a');\n      a.href = imgData;\n      a.download = this.chartTitle + '.' + fileExt;\n      document.body.appendChild(a);\n      a.click();\n      document.body.removeChild(a);\n\n      context.restore();\n      this.chart.options = originalOptions;\n      this.chart.update();\n    } catch (error) {\n      console.error('Error in exportSimpleCanvasOnly:', error);\n      this.exportCanvasOnly(imgFormat, fileExt);\n    }\n  }\n\n  private handleDownloadCsv(e: Event) {\n    e.preventDefault();\n    let csv = '';\n\n    for (let i = 0; i < this.chart.data.datasets.length; i++) {\n      csv += convertChartDataToCSV({\n        data: this.chart.data.datasets[i],\n        labels: this.labels,\n      });\n    }\n    if (csv == null) return;\n\n    const filename = this.chartTitle + '.csv';\n    if (!csv.match(/^data:text\\/csv/i)) {\n      csv = 'data:text/csv;charset=utf-8,' + csv;\n    }\n\n    // not sure if anything below this comment works\n    const data = encodeURI(csv);\n    const link = document.createElement('a');\n    link.setAttribute('href', data);\n    link.setAttribute('download', filename);\n    document.body.appendChild(link); // Required for FF\n    link.click();\n    document.body.removeChild(link);\n  }\n\n  private handleFullscreen() {\n    if (this.shadowRoot?.fullscreenElement) {\n      document.exitFullscreen();\n    } else {\n      this.container.requestFullscreen();\n    }\n  }\n\n  private handleFullscreenChange() {\n    this.fullscreen = this.shadowRoot?.fullscreenElement !== null;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kd-chart': KDChart;\n  }\n}\n"],"names":["Chart","register","ChoroplethController","BubbleMapController","GeoFeature","ColorScale","SizeScale","ProjectionScale","TreemapController","TreemapElement","MatrixController","MatrixElement","annotationPlugin","datalabelsPlugin","KDChart","LitElement","constructor","this","chartTitle","description","type","options","plugins","height","width","hideDescription","hideCaptions","hideHeader","hideControls","noBorder","customLabels","toggleView","toggleFullscreen","downloadMenu","downloadCsv","downloadPng","downloadJpg","fullscreen","useHtmlLegend","htmlLegendMaxHeight","chart","tableView","tableDisabled","mergedOptions","mergedDatasets","_widget","_resizeObserver","ResizeObserver","debounce","_resizeChart","_themeObserver","MutationObserver","mergeOptions","then","initChart","render","Classes","container","widget","html","classMap","handleFullscreenChange","handleViewToggle","unsafeSVG","chartIcon","tableIcon","handleFullscreen","minimizeIcon","maximizeIcon","downloadIcon","e","handleDownloadCsv","handleDownloadImage","includes","labels","map","label","i","datasets","data","_d","_c","_b","_a","scales","y","title","text","_h","_g","_f","_e","x","dataset","cell","xLabel","Array","isArray","yLabel","value","_j","length","getTableAxisLabel","tree","_value","labelKey","key","Object","entries","HtmlStrings","push","_subValue","_subSubValue","IndexAxis","indexAxis","NonIndexAxis","Date","toLocaleString","dataPoint","keys","Label","DisplayData","resize","connectedCallback","super","observe","document","querySelector","attributes","disconnectedCallback","disconnect","firstUpdated","el","shadowRoot","generateScrollableLegend","legendContainer","legendOptions","customLegend","renderHTMLLegend","maxHeight","boxWidth","boxHeight","borderRadius","updated","changedProps","has","forEach","index","find","newDataset","splice","OldDataset","oldDataset","update","hasData","console","error","checkType","defaults","color","getTokenThemeVal","pluginSelectForDoghnutMeter","meterGaugePlugin","doughnutLabelPlugin","canvasBackgroundPlugin","gradientLegendPlugin","a11yPlugin","destroy","canvas","additionalTypeImports","__variableDynamicImportRuntime0__","chartTypeConfigs","Promise","all","__variableDynamicImportRuntime1__","globalOptions","legend","display","deepmerge","globalOptionsRadial","globalOptionsNonRadial","JSON","parse","stringify","chartTypeConfig","datasetOptions","customDeepmerge","deepmergeCustom","mergeArrays","_k","_l","jpeg","preventDefault","imgFormat","fileExt","exportSimpleCanvasOnly","originalConfig","config","originalHidden","_","getDatasetMeta","hidden","position","padding","font","size","layout","top","right","bottom","Math","max","left","context","getContext","Error","save","globalCompositeOperation","fillStyle","fillRect","imgData","toBase64Image","a","createElement","href","download","body","appendChild","click","removeChild","restore","exportCanvasOnly","originalOptions","datalabels","formatter","tooltip","enabled","doughnutLabel","csv","convertChartDataToCSV","filename","match","encodeURI","link","setAttribute","fullscreenElement","exitFullscreen","requestFullscreen","styles","ChartScss","__decorate","property","String","prototype","Number","Boolean","state","reflect","query","customElement"],"mappings":"ukJAqCAA,EAAMC,SACJC,EACAC,EACAC,EACAC,EACAC,EACAC,EACAC,EACAC,EACAC,EACAC,EACAC,EACAC,GAWK,IAAMC,EAAN,cAAsBC,EAAtB,WAAAC,uBAKLC,KAAUC,WAAG,GAIbD,KAAWE,YAAG,GAIdF,KAAIG,KAAQ,GAYZH,KAAOI,QAAQ,GAIfJ,KAAOK,QAAQ,GAIfL,KAAMM,OAAQ,KAIdN,KAAKO,MAAQ,KAIbP,KAAeQ,iBAAG,EAIlBR,KAAYS,cAAG,EAIfT,KAAUU,YAAG,EAIbV,KAAYW,cAAG,EAIfX,KAAQY,UAAG,EAIXZ,KAAAa,aAAe,CACbC,WAAY,mBACZC,iBAAkB,oBAClBC,aAAc,gBACdC,YAAa,kBACbC,YAAa,kBACbC,YAAa,mBAOfnB,KAAUoB,YAAG,EAMbpB,KAAaqB,eAAG,EAIhBrB,KAAmBsB,oBAAG,IA2BtBtB,KAAKuB,MAAQ,KAMbvB,KAASwB,WAAG,EAMZxB,KAAayB,eAAG,EAMhBzB,KAAa0B,cAAQ,GAMrB1B,KAAc2B,eAAQ,GAMtB3B,KAAO4B,SAAG,EAKV5B,KAAA6B,gBAAuB,IAAIC,eACzBC,GAAS,KACP/B,KAAKgC,cAAc,KAIvBhC,KAAAiC,eAAsB,IAAIC,kBAAiB,KACrClC,KAAKuB,OACPvB,KAAKmC,eAAeC,MAAK,KACvBpC,KAAKqC,WAAW,GAEnB,GA03BJ,CAv3BU,MAAAC,yBACP,MAAMC,EAAU,CACdC,WAAW,EACXpB,WAAYpB,KAAKoB,WACjB,YAAapB,KAAKY,UAAYZ,KAAK4B,QACnCa,OAAQzC,KAAK4B,SAGf,OAAOc,CAAI;;gBAECC,EAASJ;4BACG,IAAMvC,KAAK4C;;UAE5B5C,KAAKU,YAAeV,KAAKW,aAsGxB,KArGA+B,CAAI;;kBAEG1C,KAAKU,WAkBJ,KAjBAgC,CAAI;;;;;4BAKI1C,KAAKC;;;;+CAIcD,KAAKQ,gBACtB,kBACA;;4BAEFR,KAAKE;;;;kBAKdF,KAAKW,aA6EJ,KA5EA+B,CAAI;;0BAEG1C,KAAKyB,cAeJ,KAdAiB,CAAI;;;yCAGS,IAAM1C,KAAK6C;6CACP7C,KAAKa,aAAaC;wCACvBd,KAAKa,aAAaC;;;oCAGtBd,KAAKwB,UACHsB,EAAUC,GACVD,EAAUE;;;;;;;mCAQb,IAAMhD,KAAKiD;uCACPjD,KAAKa,aAAaE;kCACvBf,KAAKa,aAAaE;;;8BAGtBf,KAAKoB,WACH0B,EAAUI,GACVJ,EAAUK;;;;;;;;yCAQDnD,KAAKa,aAAaG;oCACvBhB,KAAKa,aAAaG;;;gCAGtB8B,EAAUM;;;;;8BAKXpD,KAAKyB,cAUJ,KATAiB,CAAI;;;6CAGUW,GACRrD,KAAKsD,kBAAkBD;;sCAEvBrD,KAAKa,aAAaI;;;;;uCAMhBoC,GACRrD,KAAKuD,oBAAoBF,GAAG;;gCAE5BrD,KAAKa,aAAaK;;;;uCAIVmC,GACRrD,KAAKuD,oBAAoBF,GAAG;;gCAE5BrD,KAAKa,aAAaM;;;;;;;;;;;;;;;yBAiBzBnB,KAAKwB,UAAY,SAAW;;;qBAGhCxB,KAAKO,MAAQ,UAAUP,KAAKO,WAAa;cAChDP,KAAKM,OAAS,WAAWN,KAAKM,YAAc;;;;;;sCAMpBN,KAAKS,aACzB,kBACA;;;;;;uBAMKT,KAAKqB;;;;WAIjBrB,KAAKyB,eAAiBzB,KAAKwB,UAC1BkB,CAAI;;;oBAGI,CAAC,MAAO,WAAY,aAAac,SAASxD,KAAKG,MAC7CuC,CAAI;;;;;;;;4BAQE1C,KAAKyD,OAAOC,KACZ,CAACC,EAAOC,IAAMlB,CAAI;;sCAERiB;sCACA3D,KAAK6D,SAAS,GAAGC,KAAKF;;;;wBAMxB,WAAd5D,KAAKG,KACLuC,CAAI;;;;yCAIMqB,EAAyB,QAAzBC,EAAsB,QAAtBC,EAAc,QAAdC,EAAAlE,KAAKI,eAAS,IAAA8D,OAAA,EAAAA,EAAAC,cAAQ,IAAAF,OAAA,EAAAA,EAAAG,SAAG,IAAAJ,OAAA,EAAAA,EAAAK,4BAAOC,OAClC;;;yCAGEC,EAAyB,QAAzBC,EAAsB,QAAtBC,EAAc,QAAdC,EAAA1E,KAAKI,eAAS,IAAAsE,OAAA,EAAAA,EAAAP,cAAQ,IAAAM,OAAA,EAAAA,EAAAE,SAAG,IAAAH,OAAA,EAAAA,EAAAH,4BAAOC,OAClC;;8BAEAtE,KAAK6D,SAASH,KACbkB,GAAYlC,CAAI,OAAOkC,EAAQjB;;;;4BAKlC3D,KAAK6D,SAAS,GAAGC,KAAKJ,KAAKmB,YAC3B,MAAMC,EAASC,MAAMC,QAAQhF,KAAKyD,QAC9BzD,KAAKyD,OAAOoB,EAAKF,EAAI,IAAM,IACF,QAAzBT,EAAClE,KAAKyD,OAAekB,SAAI,IAAAT,OAAA,EAAAA,EAAAW,EAAKF,EAAI,KAAM,GACtCM,EAASF,MAAMC,QAAQhF,KAAKyD,QAC9BzD,KAAKyD,OAAOoB,EAAKT,EAAI,IAAM,IACF,QAAzBH,EAACjE,KAAKyD,OAAeW,SAAI,IAAAH,OAAA,EAAAA,EAAAY,EAAKT,EAAI,KAAM,GAC5C,OAAO1B,CAAI;;sCAEDuC;sCACAH;kCACJ9E,KAAK6D,SAASH,KACd,IAAMhB,CAAI,OAAOmC,EAAKK;;6BAG3B;;wBAIPxC,CAAI;;;+BAGe,QAAXyC,EAAAnF,KAAKyD,cAAM,IAAA0B,OAAA,EAAAA,EAAEC,SAAwB,YAAdpF,KAAKG,KAC1BuC,CAAI,OAAO1C,KAAKqF,2BAChB;8BACFrF,KAAK6D,SAASH,KACbkB,GAAYlC,CAAI,OAAOkC,EAAQjB;;;;4BAKpB,YAAd3D,KAAKG,KACH4E,MAAMC,QAAQhF,KAAK6D,SAAS,GAAGyB,MAC7BtF,KAAK6D,SAAS,GAAGyB,KAAK5B,KACnB6B,GAAgB7C,CAAI;;;0CAGb6C,EAAOvF,KAAK6D,SAAS,GAAG2B;;4CAEtBD,EAAOvF,KAAK6D,SAAS,GAAG4B;;sCAIpCC,OAAOC,QAAQ3F,KAAK6D,SAAS,GAAGyB,MAAM5B,KACnC6B,IACC,MAAMK,EAAc,GAmCpB,OAlCIL,EAAO,GAAGL,MACZU,EAAYC,KAAKnD,CAAI;;gDAEX6C,EAAO;gDACPA,EAAO,GAAGL;;yCAIpBQ,OAAOC,QAAQJ,EAAO,IAAI7B,KACvBoC,IACKA,EAAU,GAAGZ,MACfU,EAAYC,KAAKnD,CAAI;;sDAEXoD,EAAU;sDACVA,EAAU,GAAGZ;;+CAIvBQ,OAAOC,QAAQG,EAAU,IAAIpC,KAC1BqC,IACCH,EAAYC,KAAKnD,CAAI;;0DAEXqD,EAAa;;wDAEfA,EAAa,GAAGb;;;kDAGtB,GAGP,IAIAU,CAAW,IAGxB5F,KAAK6D,SAAS,GAAGC,KAAKJ,KACpB,CAAC6B,EAAa3B,iBACZ,MAAMoC,EACJhG,KAAKI,QAAQ6F,WAAa,IACtBC,EACU,MAAdF,EAAoB,IAAM,IAC5B,OAAOtD,CAAI;;iDAELwB,EAAAlE,KAAKyD,6BAAQ2B,QACX1C,CAAI;8CAEW,UAAT,QADFqB,EAAoB,QAApBC,EAAY,QAAZC,EAAAjE,KAAKI,eAAO,IAAA6D,OAAA,EAAAA,EAAEE,cAAM,IAAAH,OAAA,EAAAA,EAAGgC,UACrB,IAAAjC,OAAA,EAAAA,EAAA5D,MACAuC,CAAI;;sDAEE,IAAIyD,KACJnG,KAAKyD,OAAOG,IACZwC;;kDAGN1D,CAAI;wDACI1C,KAAKyD,OAAOG;;4CAG1B;wCACF5D,KAAK6D,SAASH,KAAKkB,YACnB,GAAIhB,GAAKgB,EAAQd,KAAKsB,OACpB,OAAO1C,CAAI,YAEb,MAAM2D,EAAYzB,EAAQd,KAAKF,GAC/B,MACgB,cAAd5D,KAAKG,MACS,eAAdH,KAAKG,KAEEuC,CAAI;kDACHkC,EAAQd,KAAKF,GAAGsB;4CAIX,UADqB,QAAlCjB,EAAY,QAAZC,EAAAlE,KAAKI,eAAO,IAAA8D,OAAA,EAAAA,EAAEC,OAAO+B,UAAa,IAAAjC,OAAA,EAAAA,EAC9B9D,MAEGuC,CAAI;;gDAEL,IAAIyD,KACJE,GACAD;;4CAGGrB,MAAMC,QAAQqB,GAChB3D,CAAI;;gDAEL2D,EAAU,OAAOA,EAAU;;4CAIjC,CACE,MACA,WACA,aACA7C,SAASxD,KAAKG,MAETuC,CAAI,QAAQ2D,UAEE,iBAAdA,GACNtB,MAAMC,QAAQqB,IACD,OAAdA,EA8BO3D,CAAI;kDACHkC,EAAQd,KAAKF;4CA7BdlB,CAAI;;gDAELgD,OAAOY,KAAKD,GAAW3C,KACtB+B,sBACC,MAAMc,GAEO,QADXxC,EAA2B,UAAP,QAApBE,UAAAC,EAAAlE,KAAKI,8BAAS+D,cAAM,IAAAF,OAAA,EAAAA,EAAGwB,UAAI,IAAAzB,OAAA,EAAAA,EACvBK,aAAO,IAAAN,OAAA,EAAAA,EAAAO,OAAQmB,EACfe,EAES,UAAT,QADJhC,EAAuB,QAAvBC,EAAY,UAAZzE,KAAKI,eAAO,IAAAsE,OAAA,EAAAA,EAAEP,cAAS,IAAAM,OAAA,EAAAA,EAAAgB,UACnB,IAAAjB,OAAA,EAAAA,EAAArE,OACJkG,EAAUZ,GACN,IAAIU,KACFE,EAAUZ,IACVW,iBACFC,EAAUZ,GAChB,OAAO/C,CAAI;;;0DAGH6D;;wDAEFC;;mDAEL;;2CASV;;mCAGN;;;;;cAQvB;;KAGT,CAEO,YAAAxE,GACFhC,KAAKuB,OACPvB,KAAKuB,MAAMkF,QAEd,CAEQ,iBAAAC,GACPC,MAAMD,oBAEN1G,KAAKiC,eAAe2E,QAClBC,SAASC,cAAc,6BACvB,CAAEC,YAAY,GAEjB,CAEQ,oBAAAC,GACPhH,KAAK6B,gBAAgBoF,aACrBjH,KAAKiC,eAAegF,aAEpBN,MAAMK,sBACP,CAEQ,YAAAE,SACP,MAAMC,EAAoB,QAAfjD,EAAAlE,KAAKoH,kBAAU,IAAAlD,OAAA,EAAAA,EAAE4C,cAAc,qBAC1C9G,KAAK6B,gBAAgB+E,QAAQO,EAC9B,CAEO,wBAAAE,SACN,IAAKrH,KAAKuB,QAAUvB,KAAKqB,cAAe,OAExC,MAAMiG,EAAiC,QAAfpD,EAAAlE,KAAKoH,kBAAU,IAAAlD,OAAA,EAAAA,EAAE4C,cACvC,0BAEF,IAAKQ,EAAiB,OAEtB,MAAMC,EAAgBvH,KAAK0B,cAAcrB,QAAQmH,aAEjDC,EAAiBzH,KAAKuB,MAAO+F,EAAgC,CAC3DI,UAAW1H,KAAKsB,oBAChBqG,UAAUJ,eAAAA,EAAeI,WAAY,GACrCC,WAAWL,eAAAA,EAAeK,YAAa,GACvCC,cAAcN,eAAAA,EAAeM,eAAgB,GAEhD,CAEQ,OAAAC,CAAQC,WAGb/H,KAAKuB,QACJwG,EAAaC,IAAI,WAChBD,EAAaC,IAAI,aACjBD,EAAaC,IAAI,aAEnBhI,KAAKmC,eAAeC,MAAK,KACvBpC,KAAKuB,MAAMuC,KAAKL,OAASzD,KAAKyD,OAC9BzD,KAAKuB,MAAMnB,QAAUJ,KAAK0B,cAG1B1B,KAAKuB,MAAMuC,KAAKD,SAASoE,SAAQ,CAACrD,EAAcsD,KAC3BlI,KAAK2B,eAAewG,MACpCC,GAAoBA,EAAWzE,QAAUiB,EAAQjB,SAKlD3D,KAAKuB,MAAMuC,KAAKD,SAASwE,OAAOH,EAAO,EACxC,IAIHlI,KAAK2B,eAAesG,SAASrD,IAC3B,MAAM0D,EAAatI,KAAKuB,MAAMuC,KAAKD,SAASsE,MACzCI,GAAoBA,EAAW5E,QAAUiB,EAAQjB,QAG/C2E,EAKH5C,OAAOY,KAAK1B,GAASqD,SAASxC,IAC5B6C,EAAW7C,GAAOb,EAAQa,EAAI,IAJhCzF,KAAKuB,MAAMuC,KAAKD,SAASgC,KAAKjB,EAM/B,IAGH5E,KAAKuB,MAAMiH,SAEXxI,KAAKqH,0BAA0B,IAMnC,IAAIoB,GAAU,EACd,GAAIzI,KAAK6D,UAAY7D,KAAK6D,SAASuB,OACjC,IAAK,MAAMR,KAAW5E,KAAK6D,SAMzB,GALA4E,GACgB,UAAd7D,EAAQd,YAAM,IAAAI,OAAA,EAAAA,EAAAkB,QAAS,IACT,UAAdR,EAAQU,YAAM,IAAArB,OAAA,EAAAA,EAAAmB,QAAS,GACtBR,EAAQU,MAAQI,OAAOY,KAAK1B,EAAQU,MAAMF,OAAS,GAEjDqD,EAAS,CACZC,QAAQC,MAAM,gDACd,KACD,EAIA3I,KAAKuB,OAASvB,KAAKG,MAAQ4H,EAAaC,IAAI,aAAeS,IAC9DzI,KAAKmC,eAAeC,MAAK,KACvBpC,KAAKqC,WAAW,IAGlBrC,KAAK4I,aAKL5I,KAAKuB,QACJwG,EAAaC,IAAI,SAChBD,EAAaC,IAAI,YACjBD,EAAaC,IAAI,UACjBD,EAAaC,IAAI,WACjBD,EAAaC,IAAI,oBAEnBhI,KAAKmC,eAAeC,MAAK,KACvBpC,KAAKqC,WAAW,IAGlBrC,KAAK4I,aAGH5I,KAAKuB,OAASwG,EAAaC,IAAI,aACjChI,KAAKuB,MAAMkF,QAEd,CAMO,SAAApE,GAINtD,EAAM8J,SAASC,MAAQC,EAAiB,iCAKxC,MAAMC,EACU,UAAdhJ,KAAKG,KAAmB8I,EAAmBC,EAE7C,IAAI7I,EAAU,CACZ8I,EACAH,EACAI,KACGpJ,KAAKK,SAfW,CAAC,aAAc,UAAW,aAmB7BmD,SAASxD,KAAKG,QAE9BE,EAAU,IAAIA,EAASgJ,IAGrBrJ,KAAKuB,OACPvB,KAAKuB,MAAM+H,UAGbtJ,KAAKuB,MAAQ,IAAIxC,EAAMiB,KAAKuJ,OAAQ,CAElCpJ,KAAoB,UAAdH,KAAKG,KAAmB,WAAaH,KAAKG,KAChD2D,KAAM,CACJL,OAAQzD,KAAKyD,OACbI,SAAU7D,KAAK2B,gBAEjBvB,QAASJ,KAAK0B,cACdrB,QAASA,IAGXL,KAAKqH,0BACN,CAMO,kBAAMlF,GACZ,MAGMqH,EAA6B,GACnCxJ,KAAK6D,SAASoE,SAASrD,IAEjBA,EAAQzE,MACVqJ,EAAsB3D,miDACpB4D,CAAO,kCAAkC7E,EAAQzE,WAEpD,IAIH,MAAMuJ,QAAyBC,QAAQC,IAAI,CACzCC,EAAO,kCAAkC7J,KAAKG,cAC3CqJ,IAIL,IAAI9H,EAAqBoI,EAAc9J,MAGlCA,KAAKqB,gBAERK,EAAcrB,QAAUqB,EAAcrB,SAAW,CAAA,EACjDqB,EAAcrB,QAAQ0J,OAASrI,EAAcrB,QAAQ0J,QAAU,GAC/DrI,EAAcrB,QAAQ0J,OAAOC,SAAU,EAGnCtI,EAAcrB,QAAQmH,eACxB9F,EAAcrB,QAAQmH,aAAawC,SAAU,IA/B7B,CAAC,MAAO,WAAY,QAAS,YAAa,SAoC9CxG,SAASxD,KAAKG,MAC5BuB,EAAgBuI,EAAUvI,EAAewI,KApCtB,CAAC,aAAc,UAAW,aAqCtB1G,SAASxD,KAAKG,QACrCuB,EAAgBuI,EAAUvI,EAAeyI,EAAuBnK,QAGlE,MAAM2B,EAAsByI,KAAKC,MAAMD,KAAKE,UAAUtK,KAAK6D,WAE3D6F,EAAiBzB,SAASsC,IAExB7I,EAAgBuI,EAAUvI,EAAe6I,EAAgBnK,QAAQJ,OAGjE2B,EAAesG,SAAQ,CAACrD,EAAcsD,OAEhCtD,EAAQzE,MAAQoK,EAAgBpK,OAASH,KAAKG,MAChDyE,EAAQzE,OAASoK,EAAgBpK,QAEjCwB,EAAeuG,GAAS+B,EACtBrF,EACA2F,EAAgBC,eAAexK,KAAMkI,IAExC,GACD,IAGAlI,KAAKI,UAEPsB,EAAgBuI,EAAUvI,EAAe1B,KAAKI,UAEhDJ,KAAK0B,cAAgBA,EAGrBC,EAAesG,SAAQ,CAACrD,EAAiBsD,KACvC,MAAMuC,EAAkBC,EAAgB,CACtCC,aAAa,IAEfhJ,EAAeuG,GAASuC,EAAgB7F,EAAS5E,KAAK6D,SAASqE,GAAO,IAGxElI,KAAK2B,eAAiBA,CACvB,CAEO,iBAAA0D,6BACN,IAAI1B,EAAQ,GAgBZ,OAZIA,EAF4B,OAAd,UAAd3D,KAAKI,eAAS,IAAA8D,OAAA,EAAAA,EAAA+B,YACkB,QAA9BvB,EAAuB,QAAvBX,UAAAC,EAAc,QAAdC,EAAAjE,KAAKI,eAAS,IAAA6D,OAAA,EAAAA,EAAAE,6BAAQC,SAAC,IAAAL,OAAA,EAAAA,EAAEM,aAAK,IAAAK,OAAA,EAAAA,EAAEJ,MACd,QAAZG,EAAAzE,KAAKI,eAAO,IAAAqE,OAAA,EAAAA,EAAEN,OAAOC,EAAEC,MAAMC,KAE7B,UAGwB,QAA9BsG,EAAuB,QAAvBzF,UAAAZ,EAAc,QAAdC,EAAAxE,KAAKI,eAAS,IAAAoE,OAAA,EAAAA,EAAAL,6BAAQQ,SAAC,IAAAQ,OAAA,EAAAA,EAAEd,aAAK,IAAAuG,OAAA,EAAAA,EAAEtG,MACd,QAAZuG,EAAA7K,KAAKI,eAAO,IAAAyK,OAAA,EAAAA,EAAE1G,OAAOQ,EAAEN,MAAMC,KAE7B,SAILX,CACR,CAEO,gBAAAd,GACN7C,KAAKwB,WAAaxB,KAAKwB,SACxB,CAEO,SAAAoH,GAGN5I,KAAKyB,cADkB,GACQ+B,SAASxD,KAAKG,KAC9C,CAEO,mBAAAoD,CAAoBF,EAAUyH,GACpCzH,EAAE0H,iBAEF,MAAMC,EAAYF,EAAO,aAAe,YAClCG,EAAUH,EAAO,MAAQ,MAE/B,GAAI9K,KAAKqB,eAAiBrB,KAAKuB,MAAO,CACpC,GAAI,CAAC,WAAY,OAAOiC,SAASxD,KAAKG,MAEpC,YADAH,KAAKkL,uBAAuBF,EAAWC,GAIzC,MAAME,EAAiB,CACrB/K,QAASgK,KAAKC,MAAMD,KAAKE,UAAUtK,KAAKuB,MAAMnB,UAC9C0D,KAAMsG,KAAKC,MAAMD,KAAKE,UAAUtK,KAAKuB,MAAMuC,OAC3C3D,KAAMH,KAAKuB,MAAM6J,OAAOjL,MAGpBkL,EAAiBrL,KAAKuB,MAAMuC,KAAKD,SAASH,KAC9C,CAAC4H,EAAY1H,IAAc5D,KAAKuB,MAAMgK,eAAe3H,GAAG4H,SAG1D,IACOxL,KAAKuB,MAAMnB,QAAQC,UACtBL,KAAKuB,MAAMnB,QAAQC,QAAU,CAAA,GAG1BL,KAAKuB,MAAMnB,QAAQC,QAAQ0J,SAC9B/J,KAAKuB,MAAMnB,QAAQC,QAAQ0J,OAAS,CAAA,GAGtC/J,KAAKuB,MAAMnB,QAAQC,QAAQ0J,OAAOC,SAAU,EAC5ChK,KAAKuB,MAAMnB,QAAQC,QAAQ0J,OAAO0B,SAAW,SAC7CzL,KAAKuB,MAAMnB,QAAQC,QAAQ0J,OAAOtG,OAAS,CACzCkE,SAAU,GACVC,UAAW,GACX8D,QAAS,GACTC,KAAM,CACJC,KAAM,KAIL5L,KAAKuB,MAAMnB,QAAQyL,OAEZ7L,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAEkB,iBAAtC1L,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAC1C1L,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAAU,CAClCI,IAAK9L,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAC/BK,MAAO/L,KAAKuB,MAAMnB,QAAQyL,OAAOH,QACjCM,OAAQC,KAAKC,IAAIlM,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAAS,IACpDS,KAAMnM,KAAKuB,MAAMnB,QAAQyL,OAAOH,SAEzB1L,KAAKuB,MAAMnB,QAAQyL,OAAOH,UACnC1L,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAAQM,OAASC,KAAKC,IAC9ClM,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAAQM,QAAU,EAC5C,KAXFhM,KAAKuB,MAAMnB,QAAQyL,OAAOH,QAAU,CAAEM,OAAQ,IAF9ChM,KAAKuB,MAAMnB,QAAQyL,OAAS,CAAEH,QAAS,CAAEM,OAAQ,KAiBnDhM,KAAKuB,MAAMiH,OAAO,QAElB,MAAM4D,EAAUpM,KAAKuJ,OAAO8C,WAAW,MACvC,IAAKD,EAAS,MAAM,IAAIE,MAAM,gCAE9B,MAAMxD,EAAQC,EAAiB,sCAC/BqD,EAAQG,OACRH,EAAQI,yBAA2B,mBACnCJ,EAAQK,UAAY3D,EACpBsD,EAAQM,SAAS,EAAG,EAAG1M,KAAKuJ,OAAOhJ,MAAOP,KAAKuJ,OAAOjJ,QAEtD,MAAMqM,EAAU3M,KAAKuB,MAAMqL,cAAc5B,EAAW,GAE9C6B,EAAIhG,SAASiG,cAAc,KACjCD,EAAEE,KAAOJ,EACTE,EAAEG,SAAWhN,KAAKC,WAAa,IAAMgL,EACrCpE,SAASoG,KAAKC,YAAYL,GAC1BA,EAAEM,QACFtG,SAASoG,KAAKG,YAAYP,GAE1BT,EAAQiB,UACRrN,KAAKuB,MAAMnB,QAAU+K,EAAe/K,QACpCiL,EAAepD,SAAQ,CAACuD,EAAiB5H,KACvC5D,KAAKuB,MAAMgK,eAAe3H,GAAG4H,OAASA,CAAM,IAE9CxL,KAAKuB,MAAMiH,QACZ,CAAC,MAAOG,GACPD,QAAQC,MAAM,qCAAsCA,GACpD3I,KAAKsN,iBAAiBtC,EAAWC,EAClC,CACF,MACCjL,KAAKsN,iBAAiBtC,EAAWC,EAEpC,CAEO,gBAAAqC,CAAiBtC,EAAmBC,GAC1C,MAAMmB,EAAUpM,KAAKuJ,OAAO8C,WAAW,MACvC,IAAKD,IAAYpM,KAAKuB,MAAO,OAE7B,MAAMuH,EAAQC,EAAiB,sCAC/BqD,EAAQG,OACRH,EAAQI,yBAA2B,mBACnCJ,EAAQK,UAAY3D,EACpBsD,EAAQM,SAAS,EAAG,EAAG1M,KAAKuJ,OAAOhJ,MAAOP,KAAKuJ,OAAOjJ,QAEtD,MAAMuM,EAAIhG,SAASiG,cAAc,KACjCD,EAAEE,KAAO/M,KAAKuB,MAAMqL,cAAc5B,EAAW,GAC7C6B,EAAEG,SAAWhN,KAAKC,WAAa,IAAMgL,EACrCpE,SAASoG,KAAKC,YAAYL,GAC1BA,EAAEM,QACFtG,SAASoG,KAAKG,YAAYP,GAE1BT,EAAQiB,SACT,CAEO,sBAAAnC,CAAuBF,EAAmBC,GAChD,MAAMmB,EAAUpM,KAAKuJ,OAAO8C,WAAW,MACvC,GAAKD,GAAYpM,KAAKuB,MAEtB,IACE,MAAMgM,EAAkBnD,KAAKC,MAAMD,KAAKE,UAAUtK,KAAKuB,MAAMnB,UAE7DgM,EAAQG,OACR,MAAMzD,EAAQC,EAAiB,sCAC/BqD,EAAQI,yBAA2B,mBACnCJ,EAAQK,UAAY3D,EACpBsD,EAAQM,SAAS,EAAG,EAAG1M,KAAKuJ,OAAOhJ,MAAOP,KAAKuJ,OAAOjJ,QAEtDN,KAAKuB,MAAMnB,QAAU,IAChBJ,KAAKuB,MAAMnB,QACdC,QAAS,CACP0J,OAAQ,CACNC,SAAS,EACTyB,SAAU,SACVhI,OAAQ,CACNkE,SAAU,GACVC,UAAW,GACX8D,QAAS,GACTC,KAAM,CAAEC,KAAM,MAGlB4B,WAAY,CAAExD,SAAS,EAAOyD,UAAW,MACzCC,QAAS,CAAEC,SAAS,GACpBC,cAAe,CAAED,SAAS,IAE5B9B,OAAQ,CACNH,QAAS,CAAEM,OAAQ,MAIvBhM,KAAKuB,MAAMiH,OAAO,QAElB,MAAMmE,EAAU3M,KAAKuB,MAAMqL,cAAc5B,EAAW,GAE9C6B,EAAIhG,SAASiG,cAAc,KACjCD,EAAEE,KAAOJ,EACTE,EAAEG,SAAWhN,KAAKC,WAAa,IAAMgL,EACrCpE,SAASoG,KAAKC,YAAYL,GAC1BA,EAAEM,QACFtG,SAASoG,KAAKG,YAAYP,GAE1BT,EAAQiB,UACRrN,KAAKuB,MAAMnB,QAAUmN,EACrBvN,KAAKuB,MAAMiH,QACZ,CAAC,MAAOG,GACPD,QAAQC,MAAM,mCAAoCA,GAClD3I,KAAKsN,iBAAiBtC,EAAWC,EAClC,CACF,CAEO,iBAAA3H,CAAkBD,GACxBA,EAAE0H,iBACF,IAAI8C,EAAM,GAEV,IAAK,IAAIjK,EAAI,EAAGA,EAAI5D,KAAKuB,MAAMuC,KAAKD,SAASuB,OAAQxB,IACnDiK,GAAOC,EAAsB,CAC3BhK,KAAM9D,KAAKuB,MAAMuC,KAAKD,SAASD,GAC/BH,OAAQzD,KAAKyD,SAGjB,GAAW,MAAPoK,EAAa,OAEjB,MAAME,EAAW/N,KAAKC,WAAa,OAC9B4N,EAAIG,MAAM,sBACbH,EAAM,+BAAiCA,GAIzC,MAAM/J,EAAOmK,UAAUJ,GACjBK,EAAOrH,SAASiG,cAAc,KACpCoB,EAAKC,aAAa,OAAQrK,GAC1BoK,EAAKC,aAAa,WAAYJ,GAC9BlH,SAASoG,KAAKC,YAAYgB,GAC1BA,EAAKf,QACLtG,SAASoG,KAAKG,YAAYc,EAC3B,CAEO,gBAAAjL,UACa,UAAfjD,KAAKoH,kBAAU,IAAAlD,OAAA,EAAAA,EAAEkK,mBACnBvH,SAASwH,iBAETrO,KAAKwC,UAAU8L,mBAElB,CAEO,sBAAA1L,SACN5C,KAAKoB,WAAoD,QAAtB,QAAjB8C,EAAAlE,KAAKoH,kBAAY,IAAAlD,OAAA,EAAAA,EAAAkK,kBACpC,GArhCevO,EAAM0O,OAAGC,EAIzBC,EAAA,CADCC,EAAS,CAAEvO,KAAMwO,UACF9O,EAAA+O,UAAA,kBAAA,GAIhBH,EAAA,CADCC,EAAS,CAAEvO,KAAMwO,UACD9O,EAAA+O,UAAA,mBAAA,GAIjBH,EAAA,CADCC,EAAS,CAAEvO,KAAMwO,UACH9O,EAAA+O,UAAA,YAAA,GAIfH,EAAA,CADCC,EAAS,CAAEvO,KAAM4E,SACKlF,EAAA+O,UAAA,cAAA,GAIvBH,EAAA,CADCC,EAAS,CAAEvO,KAAM4E,SACIlF,EAAA+O,UAAA,gBAAA,GAItBH,EAAA,CADCC,EAAS,CAAEvO,KAAMuF,UACA7F,EAAA+O,UAAA,eAAA,GAIlBH,EAAA,CADCC,EAAS,CAAEvO,KAAM4E,SACAlF,EAAA+O,UAAA,eAAA,GAIlBH,EAAA,CADCC,EAAS,CAAEvO,KAAM0O,UACChP,EAAA+O,UAAA,cAAA,GAInBH,EAAA,CADCC,EAAS,CAAEvO,KAAM0O,UACAhP,EAAA+O,UAAA,aAAA,GAIlBH,EAAA,CADCC,EAAS,CAAEvO,KAAM2O,WACMjP,EAAA+O,UAAA,uBAAA,GAIxBH,EAAA,CADCC,EAAS,CAAEvO,KAAM2O,WACGjP,EAAA+O,UAAA,oBAAA,GAIrBH,EAAA,CADCC,EAAS,CAAEvO,KAAM2O,WACCjP,EAAA+O,UAAA,kBAAA,GAInBH,EAAA,CADCC,EAAS,CAAEvO,KAAM2O,WACGjP,EAAA+O,UAAA,oBAAA,GAIrBH,EAAA,CADCC,EAAS,CAAEvO,KAAM2O,WACDjP,EAAA+O,UAAA,gBAAA,GAIjBH,EAAA,CADCC,EAAS,CAAEvO,KAAMuF,UAQhB7F,EAAA+O,UAAA,oBAAA,GAMFH,EAAA,CADCM,KACkBlP,EAAA+O,UAAA,kBAAA,GAMnBH,EAAA,CADCC,EAAS,CAAEvO,KAAM2O,WACIjP,EAAA+O,UAAA,qBAAA,GAItBH,EAAA,CADCC,EAAS,CAAEvO,KAAM0O,OAAQG,SAAS,KACTnP,EAAA+O,UAAA,2BAAA,GAO1BH,EAAA,CADCQ,EAAM,eACuBpP,EAAA+O,UAAA,iBAAA,GAO9BH,EAAA,CADCQ,EAAM,WACoBpP,EAAA+O,UAAA,cAAA,GAO3BH,EAAA,CADCQ,EAAM,oBACgBpP,EAAA+O,UAAA,aAAA,GAMvBH,EAAA,CADCM,KACiBlP,EAAA+O,UAAA,aAAA,GAMlBH,EAAA,CADCM,KACiBlP,EAAA+O,UAAA,iBAAA,GAMlBH,EAAA,CADCM,KACqBlP,EAAA+O,UAAA,qBAAA,GAMtBH,EAAA,CADCM,KACuBlP,EAAA+O,UAAA,qBAAA,GAMxBH,EAAA,CADCM,KACwBlP,EAAA+O,UAAA,sBAAA,GAMzBH,EAAA,CADCM,KACelP,EAAA+O,UAAA,eAAA,GA7IL/O,EAAO4O,EAAA,CADnBS,EAAc,aACFrP"}
+{"version":3,"file":"chart.js","sources":["../../../src/components/chart/chart.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, state, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { deepmerge, deepmergeCustom } from 'deepmerge-ts';\nimport Chart from 'chart.js/auto';\nimport 'chartjs-adapter-date-fns';\nimport {\n  ChoroplethController,\n  BubbleMapController,\n  GeoFeature,\n  ColorScale,\n  SizeScale,\n  ProjectionScale,\n} from 'chartjs-chart-geo';\nimport { TreemapController, TreemapElement } from 'chartjs-chart-treemap';\nimport { MatrixController, MatrixElement } from 'chartjs-chart-matrix';\nimport canvasBackgroundPlugin from '../../common/plugins/canvasBackground';\nimport doughnutLabelPlugin from '../../common/plugins/doughnutLabel';\nimport meterGaugePlugin from '../../common/plugins/meterGaugeNeedle';\nimport gradientLegendPlugin from '../../common/plugins/gradientLegend';\nimport { renderHTMLLegend } from '../../common/legend';\nimport { htmlLegendPlugin } from '../../common/plugins/htmlLegendPlugin';\nimport a11yPlugin from 'chartjs-plugin-a11y-legend';\nimport datalabelsPlugin from 'chartjs-plugin-datalabels';\nimport annotationPlugin from 'chartjs-plugin-annotation';\nimport { convertChartDataToCSV, debounce } from '../../common/helpers/helpers';\nimport ChartScss from './chart.scss';\nimport globalOptions from '../../common/config/globalOptions';\nimport globalOptionsNonRadial from '../../common/config/globalOptionsNonRadial';\nimport globalOptionsRadial from '../../common/config/globalOptionsRadial';\nimport chartIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/analytics.svg';\nimport tableIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/table-view.svg';\nimport downloadIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/download.svg';\nimport maximizeIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/expand.svg';\nimport minimizeIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/shrink.svg';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { getTokenThemeVal } from '@kyndryl-design-system/shidoka-foundation/common/helpers/color';\n\nChart.register(\n  ChoroplethController,\n  BubbleMapController,\n  GeoFeature,\n  ColorScale,\n  SizeScale,\n  ProjectionScale,\n  TreemapController,\n  TreemapElement,\n  MatrixController,\n  MatrixElement,\n  annotationPlugin,\n  datalabelsPlugin\n);\n\nexport interface LegendClickInfo {\n  item: any;\n  chart: Chart;\n  isHidden: boolean;\n  label: string;\n  dataIndex?: number;\n  datasetIndex?: number;\n  element: HTMLElement;\n  event?: MouseEvent;\n}\n\nexport interface HtmlLegendOptions {\n  boxWidth?: number;\n  boxHeight?: number;\n  borderRadius?: number;\n  className?: string;\n  itemClassName?: string;\n  layout?: 'horizontal' | 'vertical';\n  fontSize?: number;\n  boxMargin?: number;\n  adjustChartHeight?: boolean;\n  reservedLegendHeight?: number;\n  /**\n   * Callback fired when a legend item is clicked.\n   * This handler receives comprehensive information and can interact with external APIs.\n   */\n  onItemClick?: (info: LegendClickInfo) => void;\n  columns?: number;\n  labelFormatter?: (label: string, item: any) => string;\n  itemClassResolver?: (item: any) => string | null;\n  position?: 'top' | 'bottom' | 'left' | 'right';\n}\n\n/**\n * Chart.js wrapper component.\n * @slot unnamed - Slot for custom content between header and chart.\n * @slot controls - Slot for custom controls such as an overflow menu.\n * @slot tooltip - Slot for tooltip in header.\n * @slot draghandle - Slot for widget drag handle.\n */\n@customElement('kd-chart')\nexport class KDChart extends LitElement {\n  static override styles = ChartScss;\n\n  /** Chart title. */\n  @property({ type: String })\n  chartTitle = '';\n\n  /** Chart description. */\n  @property({ type: String })\n  description = '';\n\n  /** Chart.js chart type. */\n  @property({ type: String })\n  type: any = '';\n\n  /** Chart.js data.labels. */\n  @property({ type: Array })\n  labels!: Array<string>;\n\n  /** Chart.js data.datasets. */\n  @property({ type: Array })\n  datasets!: Array<any>;\n\n  /** Chart.js options. Can override Shidoka defaults. */\n  @property({ type: Object })\n  options: any = {};\n\n  /** Chart.js additional plugins. Must be registerable inline via Chart.plugins array, not globally via Chart.register. */\n  @property({ type: Array })\n  plugins: any = [];\n\n  /** Chart.js canvas height (px). Disables maintainAspectRatio option. */\n  @property({ type: Number })\n  height: any = null;\n\n  /** Chart.js canvas width (px). Disables maintainAspectRatio option. */\n  @property({ type: Number })\n  width: any = null;\n\n  /** Hides the description visually. */\n  @property({ type: Boolean })\n  hideDescription = false;\n\n  /** Hides the closed captions visually. */\n  @property({ type: Boolean })\n  hideCaptions = false;\n\n  /** Hides the title & description. */\n  @property({ type: Boolean })\n  hideHeader = false;\n\n  /** Hides the controls. */\n  @property({ type: Boolean })\n  hideControls = false;\n\n  /** Removes the outer border and padding. */\n  @property({ type: Boolean })\n  noBorder = false;\n\n  /** Customizable text labels. */\n  @property({ type: Object })\n  customLabels = {\n    toggleView: 'Toggle View Mode',\n    toggleFullscreen: 'Toggle Fullscreen',\n    downloadMenu: 'Download Menu',\n    downloadCsv: 'Download as CSV',\n    downloadPng: 'Download as PNG',\n    downloadJpg: 'Download as JPG',\n  };\n\n  /** Fullscreen state.\n   * @ignore\n   */\n  @state()\n  fullscreen = false;\n\n  /** Use HTML legend instead of Chart.js built-in canvas legend.\n   * @public\n   */\n  @property({ type: Boolean })\n  useHtmlLegend = false;\n\n  /** Max height for HTML legend scroll container (px). */\n  @property({ type: Number, reflect: true })\n  htmlLegendMaxHeight = 100;\n\n  /** Full set of legend customization options */\n  @property({ type: Object })\n  htmlLegendOptions: HtmlLegendOptions = {};\n\n  /**\n   * Queries the container element.\n   * @ignore\n   */\n  @query('.container')\n  container!: HTMLCanvasElement;\n\n  /**\n   * Queries the canvas element.\n   * @ignore\n   */\n  @query('canvas')\n  canvas!: HTMLCanvasElement;\n\n  /**\n   * Queries the closed caption div.\n   * @ignore\n   */\n  @query('.closed-caption')\n  ccDiv!: HTMLDivElement;\n\n  /** The chart instance.\n   * @ignore\n   */\n  @state()\n  chart: any = null;\n\n  /** Table view mode.\n   * @ignore\n   */\n  @state()\n  tableView = false;\n\n  /** Disable table view feature.\n   * @ignore\n   */\n  @state()\n  tableDisabled = false;\n\n  /** Merged options.\n   * @ignore\n   */\n  @state()\n  mergedOptions: any = {};\n\n  /** Merged datasets.\n   * @ignore\n   */\n  @state()\n  mergedDatasets: any = {};\n\n  /** Is Widget. Inherited from kyn-widget.\n   * @internal\n   */\n  @state()\n  _widget = false;\n\n  /** ResizeObserver for canvas-container.\n   * @internal\n   */\n  _resizeObserver: any = new ResizeObserver(\n    debounce(() => {\n      this._resizeChart();\n    })\n  );\n\n  _themeObserver: any = new MutationObserver(() => {\n    if (this.chart) {\n      this.mergeOptions().then(() => {\n        this.initChart();\n      });\n    }\n  });\n\n  override render() {\n    const Classes = {\n      container: true,\n      fullscreen: this.fullscreen,\n      'no-border': this.noBorder || this._widget,\n      widget: this._widget,\n    };\n\n    return html`\n      <div\n        class=${classMap(Classes)}\n        @fullscreenchange=${() => this.handleFullscreenChange()}\n      >\n        ${!this.hideHeader || !this.hideControls\n          ? html`\n              <div class=\"header\">\n                ${!this.hideHeader\n                  ? html`\n                      <slot name=\"draghandle\"></slot>\n\n                      <div id=\"titleDesc\">\n                        <div class=\"title\">\n                          ${this.chartTitle}\n                          <slot name=\"tooltip\"></slot>\n                        </div>\n                        <div\n                          class=\"description ${this.hideDescription\n                            ? 'hidden-visually'\n                            : ''}\"\n                        >\n                          ${this.description}\n                        </div>\n                      </div>\n                    `\n                  : null}\n                ${!this.hideControls\n                  ? html`\n                      <div class=\"controls\">\n                        ${!this.tableDisabled\n                          ? html`\n                              <button\n                                class=\"control-button\"\n                                @click=${() => this.handleViewToggle()}\n                                aria-label=${this.customLabels.toggleView}\n                                title=${this.customLabels.toggleView}\n                              >\n                                <span slot=\"icon\">\n                                  ${this.tableView\n                                    ? unsafeSVG(chartIcon)\n                                    : unsafeSVG(tableIcon)}\n                                </span>\n                              </button>\n                            `\n                          : null}\n\n                        <button\n                          class=\"control-button\"\n                          @click=${() => this.handleFullscreen()}\n                          aria-label=${this.customLabels.toggleFullscreen}\n                          title=${this.customLabels.toggleFullscreen}\n                        >\n                          <span slot=\"icon\">\n                            ${this.fullscreen\n                              ? unsafeSVG(minimizeIcon)\n                              : unsafeSVG(maximizeIcon)}\n                          </span>\n                        </button>\n\n                        <div class=\"download\">\n                          <button\n                            tabindex=\"0\"\n                            class=\"control-button\"\n                            aria-label=${this.customLabels.downloadMenu}\n                            title=${this.customLabels.downloadMenu}\n                          >\n                            <span slot=\"icon\">\n                              ${unsafeSVG(downloadIcon)}\n                            </span>\n                          </button>\n\n                          <div class=\"download-menu\">\n                            ${!this.tableDisabled\n                              ? html`\n                                  <button\n                                    tabindex=\"0\"\n                                    @click=${(e: Event) =>\n                                      this.handleDownloadCsv(e)}\n                                  >\n                                    ${this.customLabels.downloadCsv}\n                                  </button>\n                                `\n                              : null}\n                            <button\n                              tabindex=\"0\"\n                              @click=${(e: Event) =>\n                                this.handleDownloadImage(e, false)}\n                            >\n                              ${this.customLabels.downloadPng}\n                            </button>\n                            <button\n                              tabindex=\"0\"\n                              @click=${(e: Event) =>\n                                this.handleDownloadImage(e, true)}\n                            >\n                              ${this.customLabels.downloadJpg}\n                            </button>\n                          </div>\n                        </div>\n\n                        <slot name=\"controls\"></slot>\n                      </div>\n                    `\n                  : null}\n              </div>\n            `\n          : null}\n\n        <div>\n          <slot></slot>\n        </div>\n\n        <figure class=\"${this.tableView ? 'hidden' : ''}\">\n          <div\n            class=\"canvas-container\"\n            style=\"${this.width ? `width: ${this.width}px;` : ''}\n            ${this.height ? `height: ${this.height}px;` : ''}\"\n          >\n            <canvas role=\"img\" aria-labelledby=\"titleDesc\"></canvas>\n          </div>\n          <figcaption>\n            <div\n              class=\"closed-caption ${this.hideCaptions\n                ? 'hidden-visually'\n                : ''}\"\n            ></div>\n          </figcaption>\n\n          <div\n            class=\"html-legend-container\"\n            ?hidden=${!this.useHtmlLegend}\n          ></div>\n        </figure>\n\n        ${!this.tableDisabled && this.tableView\n          ? html`\n              <div class=\"table\">\n                <table>\n                  ${['pie', 'doughnut', 'polarArea'].includes(this.type)\n                    ? html`\n                        <thead>\n                          <tr>\n                            <th>Label</th>\n                            <th>Value</th>\n                          </tr>\n                        </thead>\n                        <tbody>\n                          ${this.labels.map(\n                            (label, i) => html`\n                              <tr>\n                                <td>${label}</td>\n                                <td>${this.datasets[0].data[i]}</td>\n                              </tr>\n                            `\n                          )}\n                        </tbody>\n                      `\n                    : this.type === 'matrix'\n                    ? html`\n                        <thead>\n                          <tr>\n                            <th>\n                              ${this.options?.scales?.y?.title?.text ||\n                              'Y Axis'}\n                            </th>\n                            <th>\n                              ${this.options?.scales?.x?.title?.text ||\n                              'X Axis'}\n                            </th>\n                            ${this.datasets.map(\n                              (dataset) => html`<th>${dataset.label}</th>`\n                            )}\n                          </tr>\n                        </thead>\n                        <tbody>\n                          ${this.datasets[0].data.map((cell: any) => {\n                            const xLabel = Array.isArray(this.labels)\n                              ? this.labels[cell.x - 1] || ''\n                              : (this.labels as any).x?.[cell.x - 1] || '';\n                            const yLabel = Array.isArray(this.labels)\n                              ? this.labels[cell.y - 1] || ''\n                              : (this.labels as any).y?.[cell.y - 1] || '';\n                            return html`\n                              <tr>\n                                <td>${yLabel}</td>\n                                <td>${xLabel}</td>\n                                ${this.datasets.map(\n                                  () => html`<td>${cell.value}</td>`\n                                )}\n                              </tr>\n                            `;\n                          })}\n                        </tbody>\n                      `\n                    : html`\n                        <thead>\n                          <tr>\n                            ${this.labels?.length || this.type === 'treemap'\n                              ? html`<th>${this.getTableAxisLabel()}</th>`\n                              : null}\n                            ${this.datasets.map(\n                              (dataset) => html`<th>${dataset.label}</th>`\n                            )}\n                          </tr>\n                        </thead>\n                        <tbody>\n                          ${this.type === 'treemap'\n                            ? Array.isArray(this.datasets[0].tree)\n                              ? this.datasets[0].tree.map(\n                                  (_value: any) => html`\n                                    <tr>\n                                      <td>\n                                        ${_value[this.datasets[0].labelKey]}\n                                      </td>\n                                      <td>${_value[this.datasets[0].key]}</td>\n                                    </tr>\n                                  `\n                                )\n                              : Object.entries(this.datasets[0].tree).map(\n                                  (_value: any) => {\n                                    const HtmlStrings = [];\n                                    if (_value[1].value) {\n                                      HtmlStrings.push(html`\n                                        <tr>\n                                          <td>${_value[0]}</td>\n                                          <td>${_value[1].value}</td>\n                                        </tr>\n                                      `);\n                                    } else {\n                                      Object.entries(_value[1]).map(\n                                        (_subValue: any) => {\n                                          if (_subValue[1].value) {\n                                            HtmlStrings.push(html`\n                                              <tr>\n                                                <td>${_subValue[0]}</td>\n                                                <td>${_subValue[1].value}</td>\n                                              </tr>\n                                            `);\n                                          } else {\n                                            Object.entries(_subValue[1]).map(\n                                              (_subSubValue: any) => {\n                                                HtmlStrings.push(html`\n                                                  <tr>\n                                                    <td>${_subSubValue[0]}</td>\n                                                    <td>\n                                                      ${_subSubValue[1].value}\n                                                    </td>\n                                                  </tr>\n                                                `);\n                                              }\n                                            );\n                                          }\n                                        }\n                                      );\n                                    }\n                                    return HtmlStrings;\n                                  }\n                                )\n                            : this.datasets[0].data.map(\n                                (_value: any, i: number) => {\n                                  const IndexAxis =\n                                    this.options.indexAxis || 'x';\n                                  const NonIndexAxis =\n                                    IndexAxis === 'x' ? 'y' : 'x';\n                                  return html`\n                                    <tr>\n                                      ${this.labels?.length\n                                        ? html`\n                                            ${this.options?.scales?.[IndexAxis]\n                                              ?.type === 'time'\n                                              ? html`\n                                                  <td>\n                                                    ${new Date(\n                                                      this.labels[i]\n                                                    ).toLocaleString()}\n                                                  </td>\n                                                `\n                                              : html`\n                                                  <td>${this.labels[i]}</td>\n                                                `}\n                                          `\n                                        : null}\n                                      ${this.datasets.map((dataset) => {\n                                        if (i >= dataset.data.length)\n                                          return html`<td></td>`;\n\n                                        const dataPoint = dataset.data[i];\n                                        if (\n                                          this.type === 'bubbleMap' ||\n                                          this.type === 'choropleth'\n                                        ) {\n                                          return html`\n                                            <td>${dataset.data[i].value}</td>\n                                          `;\n                                        } else if (\n                                          this.options?.scales[NonIndexAxis]\n                                            ?.type === 'time'\n                                        ) {\n                                          return html`\n                                            <td>\n                                              ${new Date(\n                                                dataPoint\n                                              ).toLocaleString()}\n                                            </td>\n                                          `;\n                                        } else if (Array.isArray(dataPoint)) {\n                                          return html`\n                                            <td>\n                                              ${dataPoint[0]}, ${dataPoint[1]}\n                                            </td>\n                                          `;\n                                        } else if (\n                                          [\n                                            'pie',\n                                            'doughnut',\n                                            'polarArea',\n                                          ].includes(this.type)\n                                        ) {\n                                          return html` <td>${dataPoint}</td> `;\n                                        } else if (\n                                          typeof dataPoint === 'object' &&\n                                          !Array.isArray(dataPoint) &&\n                                          dataPoint !== null\n                                        ) {\n                                          return html`\n                                            <td>\n                                              ${Object.keys(dataPoint).map(\n                                                (key) => {\n                                                  const Label =\n                                                    this.options?.scales?.[key]\n                                                      ?.title?.text || key;\n                                                  const DisplayData =\n                                                    this.options?.scales?.[key]\n                                                      ?.type === 'time' &&\n                                                    dataPoint[key]\n                                                      ? new Date(\n                                                          dataPoint[key]\n                                                        ).toLocaleString()\n                                                      : dataPoint[key];\n                                                  return html`\n                                                    <div>\n                                                      <strong>\n                                                        ${Label}:\n                                                      </strong>\n                                                      ${DisplayData}\n                                                    </div>\n                                                  `;\n                                                }\n                                              )}\n                                            </td>\n                                          `;\n                                        } else {\n                                          return html`\n                                            <td>${dataset.data[i]}</td>\n                                          `;\n                                        }\n                                      })}\n                                    </tr>\n                                  `;\n                                }\n                              )}\n                        </tbody>\n                      `}\n                </table>\n              </div>\n            `\n          : null}\n      </div>\n    `;\n  }\n\n  private _resizeChart() {\n    if (this.chart) {\n      this.chart.resize();\n    }\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    try {\n      const meta = document.querySelector('meta[name=\"color-scheme\"]');\n      if (meta instanceof Node) {\n        this._themeObserver.observe(meta, { attributes: true });\n      }\n    } catch (error) {\n      console.warn('Failed to set up theme observer:', error);\n    }\n  }\n\n  override disconnectedCallback() {\n    this._resizeObserver.disconnect();\n    this._themeObserver.disconnect();\n\n    super.disconnectedCallback();\n  }\n\n  override firstUpdated() {\n    const el = this.shadowRoot?.querySelector('.canvas-container');\n    this._resizeObserver.observe(el);\n  }\n\n  private generateScrollableLegend(): void {\n    if (!this.chart || !this.useHtmlLegend) return;\n\n    const legendContainer = this.shadowRoot!.querySelector<HTMLElement>(\n      '.html-legend-container'\n    )!;\n    legendContainer.innerHTML = '';\n\n    const opts = {\n      maxHeight: this.htmlLegendMaxHeight,\n      ...this.htmlLegendOptions,\n      onItemClick: (info: LegendClickInfo) => {\n        if (this.htmlLegendOptions.onItemClick) {\n          this.htmlLegendOptions.onItemClick(info);\n        }\n\n        this.dispatchEvent(\n          new CustomEvent('on-click', {\n            detail: info,\n            bubbles: true,\n            composed: true,\n          })\n        );\n      },\n    };\n\n    renderHTMLLegend(this.chart, legendContainer, opts);\n  }\n\n  override updated(changedProps: any) {\n    if (\n      this.chart &&\n      (changedProps.has('labels') ||\n        changedProps.has('datasets') ||\n        changedProps.has('options'))\n    ) {\n      this.mergeOptions().then(() => {\n        this.chart.data.labels = this.labels;\n        this.chart.options = this.mergedOptions;\n\n        this.chart.data.datasets.forEach((dataset: any, index: number) => {\n          const NewDataset = this.mergedDatasets.find(\n            (newDataset: any) => newDataset.label === dataset.label\n          );\n\n          if (!NewDataset) {\n            this.chart.data.datasets.splice(index, 1);\n          }\n        });\n\n        this.mergedDatasets.forEach((dataset: any) => {\n          const prevDataset = this.chart.data.datasets.find(\n            (prevDataset: any) => prevDataset.label === dataset.label\n          );\n\n          if (!prevDataset) {\n            this.chart.data.datasets.push(dataset);\n          } else {\n            Object.keys(dataset).forEach((key) => {\n              prevDataset[key] = dataset[key];\n            });\n          }\n        });\n\n        this.chart.update();\n\n        this.generateScrollableLegend();\n      });\n    }\n\n    // init chart\n    // check to make sure initial datasets + data have been provided\n    let hasData = false;\n    if (this.datasets && this.datasets.length) {\n      for (const dataset of this.datasets) {\n        hasData =\n          dataset.data?.length > 0 ||\n          dataset.tree?.length > 0 ||\n          (dataset.tree && Object.keys(dataset.tree).length > 0);\n\n        if (!hasData) {\n          console.error('Missing data for one or more chart datasets.');\n          break;\n        }\n      }\n    }\n\n    if (!this.chart && this.type && changedProps.has('datasets') && hasData) {\n      this.mergeOptions().then(() => {\n        this.initChart();\n      });\n\n      this.checkType();\n    }\n\n    // Re-init chart instance when type, plugins, colorPalette, width, height, or useHtmlLegend change.\n    if (\n      this.chart &&\n      (changedProps.has('type') ||\n        changedProps.has('plugins') ||\n        changedProps.has('width') ||\n        changedProps.has('height') ||\n        changedProps.has('useHtmlLegend'))\n    ) {\n      this.mergeOptions().then(() => {\n        this.initChart();\n      });\n\n      this.checkType();\n    }\n\n    if (this.chart && changedProps.has('noBorder')) {\n      this.chart.resize();\n    }\n  }\n\n  /**\n   * Initializes a bar chart using the Chart.js library with provided labels, datasets,\n   * and options.\n   */\n  private initChart() {\n    const pluginSelect =\n      this.type === 'meter' ? meterGaugePlugin : doughnutLabelPlugin;\n\n    const chartPlugins = [\n      canvasBackgroundPlugin,\n      pluginSelect,\n      gradientLegendPlugin,\n      ...this.plugins,\n      a11yPlugin,\n    ];\n\n    // add htmlLegendPlugin if useHtmlLegend is enabled\n    if (this.useHtmlLegend) {\n      chartPlugins.push(htmlLegendPlugin);\n    }\n\n    if (this.chart) this.chart.destroy();\n    this.chart = new Chart(this.canvas, {\n      type: this.type === 'meter' ? 'doughnut' : this.type,\n      data: { labels: this.labels, datasets: this.mergedDatasets },\n      options: this.mergedOptions,\n      plugins: chartPlugins,\n    });\n\n    this.generateScrollableLegend();\n  }\n\n  /**\n   * Merges various chart type options and dataset options to create a\n   * final set of options for a chart.\n   */\n  private async mergeOptions() {\n    const radialTypes = ['pie', 'doughnut', 'radar', 'polarArea', 'meter'];\n    const ignoredTypes = ['choropleth', 'treemap', 'bubbleMap'];\n\n    // dynamically import type-specific configs\n    const additionalTypeImports: any[] = [];\n    this.datasets.forEach((dataset) => {\n      if (dataset.type) {\n        additionalTypeImports.push(\n          import(`../../common/config/chartTypes/${dataset.type}.js`)\n        );\n      }\n    });\n    const chartTypeConfigs = await Promise.all([\n      import(`../../common/config/chartTypes/${this.type}.js`),\n      ...additionalTypeImports,\n    ]);\n\n    let mergedOptions: any = globalOptions(this);\n    mergedOptions.plugins = mergedOptions.plugins || {};\n\n    if (this.useHtmlLegend) {\n      mergedOptions.plugins.legend = { display: false };\n      mergedOptions.plugins.htmlLegend = mergedOptions.plugins.htmlLegend || {};\n    } else {\n      mergedOptions.plugins.legend = mergedOptions.plugins.legend || {};\n      mergedOptions.plugins.legend.display = true;\n    }\n\n    // merge radial vs non-radial defaults\n    if (radialTypes.includes(this.type)) {\n      mergedOptions = deepmerge(mergedOptions, globalOptionsRadial(this));\n    } else if (!ignoredTypes.includes(this.type)) {\n      mergedOptions = deepmerge(mergedOptions, globalOptionsNonRadial(this));\n    }\n\n    const mergedDatasets: any[] = JSON.parse(JSON.stringify(this.datasets));\n\n    chartTypeConfigs.forEach((cfg: any) => {\n      mergedOptions = deepmerge(mergedOptions, cfg.options(this));\n      mergedDatasets.forEach((ds: any, i: number) => {\n        if ((!ds.type && cfg.type === this.type) || ds.type === cfg.type) {\n          mergedDatasets[i] = deepmerge(ds, cfg.datasetOptions(this, i));\n        }\n      });\n    });\n\n    if (this.options) {\n      mergedOptions = deepmerge(mergedOptions, this.options);\n    }\n    this.mergedOptions = mergedOptions;\n\n    mergedDatasets.forEach((ds: object, i: number) => {\n      const customDeep = deepmergeCustom({ mergeArrays: false });\n      mergedDatasets[i] = customDeep(ds, this.datasets[i]);\n    });\n    this.mergedDatasets = mergedDatasets;\n  }\n\n  private getTableAxisLabel() {\n    let label = '';\n\n    if (this.options?.indexAxis === 'y') {\n      if (this.options?.scales?.y?.title?.text) {\n        label = this.options?.scales.y.title.text;\n      } else {\n        label = 'Y Axis';\n      }\n    } else {\n      if (this.options?.scales?.x?.title?.text) {\n        label = this.options?.scales.x.title.text;\n      } else {\n        label = 'X Axis';\n      }\n    }\n\n    return label;\n  }\n\n  private handleViewToggle() {\n    this.tableView = !this.tableView;\n  }\n\n  private checkType() {\n    // chart types that can't have a data table view\n    const blacklist: any = [];\n    this.tableDisabled = blacklist.includes(this.type);\n  }\n\n  private handleDownloadImage(e: Event, jpeg: boolean) {\n    e.preventDefault();\n\n    const imgFormat = jpeg ? 'image/jpeg' : 'image/png';\n    const fileExt = jpeg ? 'jpg' : 'png';\n\n    if (this.useHtmlLegend && this.chart) {\n      if (['doughnut', 'pie'].includes(this.type)) {\n        this.exportSimpleCanvasOnly(imgFormat, fileExt);\n        return;\n      }\n\n      const originalConfig = {\n        options: JSON.parse(JSON.stringify(this.chart.options)),\n        data: JSON.parse(JSON.stringify(this.chart.data)),\n        type: this.chart.config.type,\n      };\n\n      const originalHidden = this.chart.data.datasets.map(\n        (_: unknown, i: number) => this.chart.getDatasetMeta(i).hidden\n      );\n\n      try {\n        if (!this.chart.options.plugins) {\n          this.chart.options.plugins = {};\n        }\n\n        if (!this.chart.options.plugins.legend) {\n          this.chart.options.plugins.legend = {};\n        }\n\n        this.chart.options.plugins.legend.display = true;\n        this.chart.options.plugins.legend.position = 'bottom';\n        this.chart.options.plugins.legend.labels = {\n          boxWidth: 12,\n          boxHeight: 12,\n          padding: 10,\n          font: {\n            size: 12,\n          },\n        };\n\n        if (!this.chart.options.layout) {\n          this.chart.options.layout = { padding: { bottom: 40 } };\n        } else if (!this.chart.options.layout.padding) {\n          this.chart.options.layout.padding = { bottom: 40 };\n        } else if (typeof this.chart.options.layout.padding === 'number') {\n          this.chart.options.layout.padding = {\n            top: this.chart.options.layout.padding,\n            right: this.chart.options.layout.padding,\n            bottom: Math.max(this.chart.options.layout.padding, 40),\n            left: this.chart.options.layout.padding,\n          };\n        } else if (this.chart.options.layout.padding) {\n          this.chart.options.layout.padding.bottom = Math.max(\n            this.chart.options.layout.padding.bottom || 0,\n            40\n          );\n        }\n\n        this.chart.update('none');\n\n        const context = this.canvas.getContext('2d');\n        if (!context) throw new Error('Could not get canvas context');\n\n        const color = getTokenThemeVal('--kd-color-background-page-default');\n        context.save();\n        context.globalCompositeOperation = 'destination-over';\n        context.fillStyle = color;\n        context.fillRect(0, 0, this.canvas.width, this.canvas.height);\n\n        const imgData = this.chart.toBase64Image(imgFormat, 1);\n\n        const a = document.createElement('a');\n        a.href = imgData;\n        a.download = this.chartTitle + '.' + fileExt;\n        document.body.appendChild(a);\n        a.click();\n        document.body.removeChild(a);\n\n        context.restore();\n        this.chart.options = originalConfig.options;\n        originalHidden.forEach((hidden: boolean, i: number) => {\n          this.chart.getDatasetMeta(i).hidden = hidden;\n        });\n        this.chart.update();\n      } catch (error) {\n        console.error('Error exporting chart with legend:', error);\n        this.exportCanvasOnly(imgFormat, fileExt);\n      }\n    } else {\n      this.exportCanvasOnly(imgFormat, fileExt);\n    }\n  }\n\n  private exportCanvasOnly(imgFormat: string, fileExt: string) {\n    const context = this.canvas.getContext('2d');\n    if (!context || !this.chart) return;\n\n    const color = getTokenThemeVal('--kd-color-background-page-default');\n    context.save();\n    context.globalCompositeOperation = 'destination-over';\n    context.fillStyle = color;\n    context.fillRect(0, 0, this.canvas.width, this.canvas.height);\n\n    const a = document.createElement('a');\n    a.href = this.chart.toBase64Image(imgFormat, 1);\n    a.download = this.chartTitle + '.' + fileExt;\n    document.body.appendChild(a);\n    a.click();\n    document.body.removeChild(a);\n\n    context.restore();\n  }\n\n  private exportSimpleCanvasOnly(imgFormat: string, fileExt: string) {\n    const context = this.canvas.getContext('2d');\n    if (!context || !this.chart) return;\n\n    try {\n      const originalOptions = JSON.parse(JSON.stringify(this.chart.options));\n\n      context.save();\n      const color = getTokenThemeVal('--kd-color-background-page-default');\n      context.globalCompositeOperation = 'destination-over';\n      context.fillStyle = color;\n      context.fillRect(0, 0, this.canvas.width, this.canvas.height);\n\n      this.chart.options = {\n        ...this.chart.options,\n        plugins: {\n          legend: {\n            display: true,\n            position: 'bottom',\n            labels: {\n              boxWidth: 12,\n              boxHeight: 12,\n              padding: 10,\n              font: { size: 12 },\n            },\n          },\n          datalabels: { display: false, formatter: null },\n          tooltip: { enabled: false },\n          doughnutLabel: { enabled: false },\n        },\n        layout: {\n          padding: { bottom: 40 },\n        },\n      };\n\n      this.chart.update('none');\n\n      const imgData = this.chart.toBase64Image(imgFormat, 1);\n\n      const a = document.createElement('a');\n      a.href = imgData;\n      a.download = this.chartTitle + '.' + fileExt;\n      document.body.appendChild(a);\n      a.click();\n      document.body.removeChild(a);\n\n      context.restore();\n      this.chart.options = originalOptions;\n      this.chart.update();\n    } catch (error) {\n      console.error('Error in exportSimpleCanvasOnly:', error);\n      this.exportCanvasOnly(imgFormat, fileExt);\n    }\n  }\n\n  private handleDownloadCsv(e: Event) {\n    e.preventDefault();\n    let csv = '';\n\n    for (let i = 0; i < this.chart.data.datasets.length; i++) {\n      csv += convertChartDataToCSV({\n        data: this.chart.data.datasets[i],\n        labels: this.labels,\n      });\n    }\n    if (csv == null) return;\n\n    const filename = this.chartTitle + '.csv';\n    if (!csv.match(/^data:text\\/csv/i)) {\n      csv = 'data:text/csv;charset=utf-8,' + csv;\n    }\n\n    // not sure if anything below this comment works\n    const data = encodeURI(csv);\n    const link = document.createElement('a');\n    link.setAttribute('href', data);\n    link.setAttribute('download', filename);\n    document.body.appendChild(link); // Required for FF\n    link.click();\n    document.body.removeChild(link);\n  }\n\n  private handleFullscreen() {\n    if (this.shadowRoot?.fullscreenElement) {\n      document.exitFullscreen();\n    } else {\n      this.container.requestFullscreen();\n    }\n  }\n\n  private handleFullscreenChange() {\n    this.fullscreen = this.shadowRoot?.fullscreenElement !== null;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kd-chart': KDChart;\n  }\n}\n"],"names":["Chart","register","ChoroplethController","BubbleMapController","GeoFeature","ColorScale","SizeScale","ProjectionScale","TreemapController","TreemapElement","MatrixController","MatrixElement","annotationPlugin","datalabelsPlugin","KDChart","LitElement","constructor","this","chartTitle","description","type","options","plugins","height","width","hideDescription","hideCaptions","hideHeader","hideControls","noBorder","customLabels","toggleView","toggleFullscreen","downloadMenu","downloadCsv","downloadPng","downloadJpg","fullscreen","useHtmlLegend","htmlLegendMaxHeight","htmlLegendOptions","chart","tableView","tableDisabled","mergedOptions","mergedDatasets","_widget","_resizeObserver","ResizeObserver","debounce","_resizeChart","_themeObserver","MutationObserver","mergeOptions","then","initChart","render","Classes","container","widget","html","classMap","handleFullscreenChange","handleViewToggle","unsafeSVG","chartIcon","tableIcon","handleFullscreen","minimizeIcon","maximizeIcon","downloadIcon","e","handleDownloadCsv","handleDownloadImage","includes","labels","map","label","i","datasets","data","_d","_c","_b","_a","scales","y","title","text","_h","_g","_f","_e","x","dataset","cell","xLabel","Array","isArray","yLabel","value","_j","length","getTableAxisLabel","tree","_value","labelKey","key","Object","entries","HtmlStrings","push","_subValue","_subSubValue","IndexAxis","indexAxis","NonIndexAxis","Date","toLocaleString","dataPoint","keys","Label","DisplayData","resize","connectedCallback","super","meta","document","querySelector","Node","observe","attributes","error","console","warn","disconnectedCallback","disconnect","firstUpdated","el","shadowRoot","generateScrollableLegend","legendContainer","innerHTML","opts","maxHeight","onItemClick","info","dispatchEvent","CustomEvent","detail","bubbles","composed","renderHTMLLegend","updated","changedProps","has","forEach","index","find","newDataset","splice","prevDataset","update","hasData","checkType","pluginSelect","meterGaugePlugin","doughnutLabelPlugin","chartPlugins","canvasBackgroundPlugin","gradientLegendPlugin","a11yPlugin","htmlLegendPlugin","destroy","canvas","additionalTypeImports","__variableDynamicImportRuntime0__","chartTypeConfigs","Promise","all","__variableDynamicImportRuntime1__","globalOptions","legend","display","htmlLegend","deepmerge","globalOptionsRadial","globalOptionsNonRadial","JSON","parse","stringify","cfg","ds","datasetOptions","customDeep","deepmergeCustom","mergeArrays","_k","_l","jpeg","preventDefault","imgFormat","fileExt","exportSimpleCanvasOnly","originalConfig","config","originalHidden","_","getDatasetMeta","hidden","position","boxWidth","boxHeight","padding","font","size","layout","top","right","bottom","Math","max","left","context","getContext","Error","color","getTokenThemeVal","save","globalCompositeOperation","fillStyle","fillRect","imgData","toBase64Image","a","createElement","href","download","body","appendChild","click","removeChild","restore","exportCanvasOnly","originalOptions","datalabels","formatter","tooltip","enabled","doughnutLabel","csv","convertChartDataToCSV","filename","match","encodeURI","link","setAttribute","fullscreenElement","exitFullscreen","requestFullscreen","styles","ChartScss","__decorate","property","String","prototype","Number","Boolean","state","reflect","query","customElement"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kyndryl-design-system/shidoka-charts",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "description": "Shidoka Charts",
   "license": "MIT",
   "main": "index.js",