@carbon/charts-react 1.23.14 → 1.23.15

package/dist/index.umd.js

@@ -50,7 +50,7 @@
 			  <div class="${de}--${s}-modal-footer-spacer"></div>
 			  <button class="cds--btn cds--btn--primary" type="button" data-modal-primary-focus>${i}</button>
 			</div>
-		</div>`}render(t=!1){const n=this.model.getOptions();if(!this.isEventListenerAdded){const r=I(this.services.domUtils.getHolder()),i=y(n,"style","prefix");this.modal=N.appendOrSelect(r,`div.${de}--${i}--modal`),this.addEventListeners(),this.isEventListenerAdded=!0}}destroy(){this.removeEventListeners(),this.isEventListenerAdded=!1}}class Es extends gt{constructor(){super(...arguments),this.type="title",this.renderType=it.HTML}render(t=!1){const n=this.getComponentContainer(),r=y(this.getOptions(),"title"),i=n.selectAll("p.title").data([r]);if(i.enter().append("p").classed("title",!0).attr("role","heading").attr("aria-level",2).merge(i).html(s=>ln(s)),i.node()&&i.node().offsetWidth<i.node().scrollWidth){const s=this;i.on("mouseover",function(a){s.services.events.dispatchEvent(T.Tooltip.SHOW,{event:a,hoveredElement:i,content:i.text()})}).on("mousemove",function(a){s.services.events.dispatchEvent(T.Tooltip.MOVE,{event:a})}).on("mouseout",function(){s.services.events.dispatchEvent(T.Tooltip.HIDE)})}i.exit().remove()}truncateTitle(t,n){if(n<=0)return;const r=t.text();if(t.node().getComputedTextLength()>n){t.append("tspan").text("...");const i=N.appendOrSelect(t,"tspan").node().getComputedTextLength(),s=t.text(),a=this.getSubstringIndex(t.node(),0,s.length-1,n-i);t.html(s.substring(0,a-1)).append("tspan").text("...");const o=this;t.on("mouseover",function(l){o.services.events.dispatchEvent(T.Tooltip.SHOW,{event:l,hoveredElement:t,content:r})}).on("mousemove",function(l){o.services.events.dispatchEvent(T.Tooltip.MOVE,{event:l})}).on("mouseout",function(){o.services.events.dispatchEvent(T.Tooltip.HIDE)})}}getMaxTitleWidth(){return N.getSVGElementSize(this.parent.node(),{useAttrs:!0}).width}getSubstringIndex(t,n,r,i){const s=Math.floor((r+n)/2);return t.getSubStringLength(0,s)>i?this.getSubstringIndex(t,n,s,i):t.getSubStringLength(0,s)<i?t.getSubStringLength(0,s+1)>i?s:this.getSubstringIndex(t,s,r,i):s}}class cu extends gt{constructor(){super(...arguments),this.type="legend",this.renderType=it.HTML}render(t=!1){const n=this.getOptions(),r=y(n,"legend"),i=y(r,"alignment"),s=y(n,"legend","orientation");let a=this.model.getDataGroups();const{DISABLED:o}=Nt.items.status,l=a.some(x=>x.status===o),c=y(r,"order"),u=this.getComponentContainer().classed("center-aligned",i===Ft.CENTER).classed("right-aligned",i===Ft.RIGHT).classed(s||"horizontal",!0).classed("has-deactivated-items",l).attr("role",ht.GROUP).attr("aria-label","Data groups").attr("data-name","legend-items");c&&(a=this.sortDataGroups(a,c));const d=u.selectAll("div.legend-item").data(a,x=>x.name),h=d.enter().append("div").attr("class","legend-item");h.merge(u.selectAll("div.legend-item")).classed("active",function(x){return x.status===Nt.items.status.ACTIVE});const p=y(this.getOptions(),"legend","clickable");u.classed("clickable",p&&a.length>1);const f=Nt.checkbox.radius,g=h.append("div").classed("checkbox",!0),m=g.merge(d.select("div.checkbox")).attr("role",ht.CHECKBOX).attr("tabindex",p?0:-1).attr("aria-labelledby",(x,_)=>this.services.domUtils.generateElementIDString(`legend-datagroup-${_}-title`)).attr("aria-checked",({status:x})=>x===Nt.items.status.ACTIVE).attr("width",f*2).attr("height",f*2).attr("class",x=>this.model.getColorClassName({classNameTypes:[st.BACKGROUND],dataGroupName:x.name,originalClassName:"checkbox"})).style("background",x=>x.status===Nt.items.status.ACTIVE?this.model.getFillColor(x.name)||this.model.getStrokeColor(x.name):null).classed("active",function(x){return x.status===Nt.items.status.ACTIVE});g.append("svg").attr("focusable",!1).attr("preserveAspectRatio","xMidYMid meet").attr("xmlns","http://www.w3.org/2000/svg").attr("width","11").attr("height","11").attr("viewBox","0 0 31 28").attr("aria-hidden",!0).style("will-change","transform").append("path").attr("d","M13 21.2l-7.1-7.1-1.4 1.4 7.1 7.1L13 24 27.1 9.9l-1.4-1.5z"),h.append("p").merge(d.select("p"));const v=y(n,"legend","additionalItems");if(v&&a.length){const x=this,_=u.selectAll("div.additional-item").data(v);_.exit().remove();const E=_.enter().append("div").merge(_).classed("legend-item",!0).classed("additional",!0).attr("aria-labelledby",(M,D)=>this.services.domUtils.generateElementIDString(`legend-datagroup-${m.size()+D}-title`));E.selectAll("*").remove();let b,S=1;E.append("svg").classed("icon",!0).each(function(M){const D=I(this);!b||b!=M.type?(b=M.type,S=1):S++,x.addAdditionalItem(D,M,S)}),E.append("p").merge(E.select("p")),this.truncateLegendText()}d.exit().on("mouseover",null).on("click",null).on("mouseout",null).remove(),p&&h.size()>1&&this.addEventListeners()}sortDataGroups(t,n){if(t.sort((r,i)=>n.indexOf(r.name)-n.indexOf(i.name)),n.length<t.length){const r=t.length-n.length;return t.slice(r).concat(t.slice(0,r))}return t}addAdditionalItem(t,n,r){const{width:i,height:s}=Nt.area;if(n.type===Wt.RADIUS?t.style("width",`${s}px`).style("height",`${s}px`):t.style("width",`${i}px`).style("height",`${s}px`),n.type===Wt.RADIUS){const{iconData:a,fill:o,stroke:l}=Nt.radius;t.attr("fill","none").selectAll("circle").data(a).enter().append("circle").classed("radius",!0).attr("role",ht.IMG).attr("aria-label","radius").attr("cx",c=>c.cx).attr("cy",c=>c.cy).attr("r",c=>c.r).style("fill",n.fill?n.fill:o).style("stroke",n.stroke?n.stroke:l)}else if(n.type===Wt.LINE){const a=Nt.line;t.select("line.line").empty()&&t.append("line").classed(`line-${r}`,!0).attr("role",ht.IMG).attr("aria-label","line").attr("x1",0).attr("y1",a.yPosition).attr("x2",i).attr("y2",a.yPosition).style("stroke",n.stroke?n.stroke:a.stroke).style("stroke-width",a.strokeWidth)}else if(n.type===Wt.AREA)t.select("rect.area").empty()&&t.append("rect").classed(`area-${r}`,!0).attr("role",ht.IMG).attr("aria-label","area").attr("width",i).attr("height",s).style("fill",r>3&&!n.fill?Nt.area.fill:n.fill).style("stroke",n.stroke);else if(n.type===Wt.SIZE){const{iconData:a,fill:o,stroke:l}=Nt.size;t.attr("fill","none").attr("role",ht.IMG).attr("aria-label","size").selectAll("rect").data(a).enter().append("rect").classed("size",!0).attr("width",c=>c.width).attr("height",c=>c.height).attr("y",()=>0).style("fill",n.fill?n.fill:o).style("stroke",n.stroke?n.stroke:l).style("stroke-width",1)}else if(n.type===Wt.QUARTILE){const{iconData:a}=Nt.quartile;t.selectAll("rect").attr("role",ht.IMG).attr("aria-label","quartile").data(a).enter().append("rect").attr("class",(o,l)=>`quartile-${l===0?"wrapper":"line"}`).attr("x",o=>o.x).attr("y",o=>o.y).attr("width",o=>o.width).attr("height",o=>o.height)}else if(n.type===Wt.ZOOM){const{iconData:a,color:o}=y(Nt,"zoom"),l=t.attr("role",ht.IMG).attr("aria-label","zoom").selectAll("g.icon").data(a).enter();l.append("g").attr("x",c=>c.x).attr("y",c=>c.y).attr("width",c=>c.width).attr("height",c=>c.height).append("polygon").attr("points","7.7 4.82 5.78 4.82 5.78 2.89 4.82 2.89 4.82 4.82 2.89 4.82 2.89 5.78 4.82 5.78 4.82 7.7 5.78 7.7 5.78 5.78 7.7 5.78 7.7 4.82").attr("fill",()=>n.color?n.color:o),l.append("path").attr("d","M9.36,8.67A5.22,5.22,0,0,0,10.59,5.3,5.3,5.3,0,1,0,5.3,10.59,5.22,5.22,0,0,0,8.67,9.36L12.32,13l.68-.68Zm-4.06,1A4.34,4.34,0,1,1,9.63,5.3,4.33,4.33,0,0,1,5.3,9.63Z").attr("fill",()=>n.color?n.color:o)}}truncateLegendText(){const t=this.getComponentContainer(),n=y(this.getOptions(),"legend","truncation"),r=y(n,"type"),i=y(n,"threshold"),s=y(n,"numCharacter"),a=t.selectAll("div.legend-item p");a.attr("id",function(){return(this.parentNode.querySelector("div.checkbox")||this.parentNode).getAttribute("aria-labelledby")}),r!==we.NONE?a.html(function(o){const l=ln(o.name);return l.length>i&&l.length!==s?Wi(l,r,s):l}):a.html(o=>ln(o.name))}addEventListeners(){const t=this,n=this.getComponentContainer(),r=this.getOptions(),i=y(r,"legend"),s=y(i,"truncation");n.selectAll("div.legend-item").on("mouseover",function(a){t.services.events.dispatchEvent(T.Legend.ITEM_HOVER,{hoveredElement:I(this)});const o=I(this);o.select("div.checkbox").classed("hovered",!0);const l=o.datum();l.name.length>s.threshold&&s.numCharacter<l.name.length&&s.type!==we.NONE&&t.services.events.dispatchEvent(T.Tooltip.SHOW,{event:a,hoveredElement:o,content:l.name})}).on("mousemove",function(a){I(this).datum().name.length>s.threshold&&s.type!==we.NONE&&t.services.events.dispatchEvent(T.Tooltip.MOVE,{event:a})}).on("click",function(){t.services.events.dispatchEvent(T.Legend.ITEM_CLICK,{clickedElement:I(this)});const a=I(this).datum();t.model.toggleDataLabel(a.name)}).on("mouseout",function(){const a=I(this);a.select("div.checkbox").classed("hovered",!1),a.datum().name.length>s.threshold&&s.type!==we.NONE&&t.services.events.dispatchEvent(T.Tooltip.HIDE),t.services.events.dispatchEvent(T.Legend.ITEM_MOUSEOUT,{hoveredElement:a})}),n.selectAll("div.legend-item div.checkbox").on("keyup",function(a){a.key&&a.key==="Tab"&&t.services.events.dispatchEvent(T.Legend.ITEM_HOVER,{hoveredElement:I(this)})}),n.selectAll("div.legend-item div.checkbox").on("keydown",function(a,o){a.key&&a.key===" "?(a.preventDefault(),t.model.toggleDataLabel(o.name)):a.key&&a.key==="Tab"&&t.services.events.dispatchEvent(T.Legend.ITEM_MOUSEOUT,{hoveredElement:I(this)})}),n.selectAll("g.additional-item").on("mouseover",function(a){const o=I(this),l=o.datum();l.name.length>s.threshold&&t.services.events.dispatchEvent(T.Tooltip.SHOW,{event:a,hoveredElement:o,content:l.name})})}}class Sg extends gt{constructor(t,n,r){super(t,n,r),this.type="chart-clip",this.renderType=it.SVG,this.chartClipId="chart-clip-id-"+Math.floor(Math.random()*99999999999),this.init()}init(){this.model.set({chartClipId:this.chartClipId},{skipUpdate:!0})}render(t=!0){this.createClipPath()}createClipPath(){const t=this.parent,{cartesianScales:n}=this.services;if(!n)throw new Error("Service cartesianScales was undefined");const r=n.getMainXScale(),i=n.getMainYScale(),[s,a]=r.range(),[o,l]=i.range();if(!t)throw new Error("svg is undefined");this.chartClipPath=N.appendOrSelect(t,`clipPath.${this.type}`).attr("id",this.chartClipId);const c=N.appendOrSelect(this.chartClipPath,`rect.${this.type}`);a-s>0&&c.attr("x",s).attr("y",l).attr("width",a-s).attr("height",o-l),this.chartClipPath.merge(c).lower()}}class CL extends Sg{constructor(){super(...arguments),this.type="canvas-chart-clip",this.chartClipId="canvas-chart-clip-id-"+Math.floor(Math.random()*99999999999)}createClipPath(){const t=this.parent,{width:n,height:r}=N.getSVGElementSize(this.parent,{useAttrs:!0});this.chartClipPath=N.appendOrSelect(t,`clipPath.${this.type}`).attr("id",this.chartClipId);const i=N.appendOrSelect(this.chartClipPath,`rect.${this.type}`);i.attr("x",0).attr("y",0).attr("width",n).attr("height",r),this.chartClipPath.merge(i).lower()}}var si,Gt;(function(e){e.LEFT="left",e.RIGHT="right",e.TOP="top",e.BOTTOM="bottom"})(Gt||(Gt={}));var Tg=(si={},si[Gt.LEFT]=function(e,t,n){return{top:e.top-Math.round(t.offsetHeight/2)+Math.round(n.height/2),left:Math.round(e.left-t.offsetWidth)}},si[Gt.RIGHT]=function(e,t,n){return{top:e.top-Math.round(t.offsetHeight/2)+Math.round(n.height/2),left:Math.round(e.left+n.width)}},si[Gt.TOP]=function(e,t,n){return{top:Math.round(e.top-t.offsetHeight),left:e.left-Math.round(t.offsetWidth/2)+Math.round(n.width/2)}},si[Gt.BOTTOM]=function(e,t,n){return{top:Math.round(e.top+n.height),left:e.left-Math.round(t.offsetWidth/2)+Math.round(n.width/2)}},si),wg=typeof window<"u"?window:{innerHeight:0,innerWidth:0},oo=function(){function e(t){t===void 0&&(t={}),this.positions=Tg,this.positions=Object.assign({},Tg,t)}return e.prototype.getRelativeOffset=function(t){for(var n={left:t.offsetLeft,top:t.offsetTop};t.offsetParent&&getComputedStyle(t.offsetParent).position==="static";)n.left+=t.offsetLeft,n.top+=t.offsetTop,t=t.offsetParent;return n},e.prototype.getAbsoluteOffset=function(t){for(var n=t,r={top:0,left:0};n.offsetParent;){var i=getComputedStyle(n.offsetParent);i.position==="static"&&i.marginLeft&&i.marginTop&&(parseInt(i.marginTop,10)&&(r.top+=parseInt(i.marginTop,10)),parseInt(i.marginLeft,10)&&(r.left+=parseInt(i.marginLeft,10))),n=n.offsetParent}var s=t.getBoundingClientRect(),a=document.body.getBoundingClientRect();return{top:s.top-a.top+r.top,left:s.left-a.left+r.left}},e.prototype.findRelative=function(t,n,r){var i=this.getRelativeOffset(t),s=t.getBoundingClientRect();return this.calculatePosition(i,s,n,r)},e.prototype.findAbsolute=function(t,n,r){var i=this.getAbsoluteOffset(t),s=t.getBoundingClientRect();return this.calculatePosition(i,s,n,r)},e.prototype.findPosition=function(t,n,r,i){i===void 0&&(i=this.getAbsoluteOffset.bind(this));var s=i(t),a=t.getBoundingClientRect();return this.calculatePosition(s,a,n,r)},e.prototype.findPositionAt=function(t,n,r){return this.calculatePosition(t,{top:0,left:0,height:0,width:0},n,r)},e.prototype.getPlacementBox=function(t,n){var r=t.offsetHeight+n.top,i=t.offsetWidth+n.left;return{top:n.top,bottom:r,left:n.left,right:i}},e.prototype.addOffset=function(t,n,r){return n===void 0&&(n=0),r===void 0&&(r=0),Object.assign({},t,{top:t.top+n,left:t.left+r})},e.prototype.setElement=function(t,n){t.style.top=n.top+"px",t.style.left=n.left+"px"},e.prototype.findBestPlacement=function(t,n,r,i,s){var a=this;i===void 0&&(i=this.defaultContainerFunction.bind(this)),s===void 0&&(s=this.findPosition.bind(this));var o=r.map(function(l){var c=s(t,n,l),u=a.getPlacementBox(n,c),d=0,h=0,p=i();u.top<p.top?d=p.top-u.top:u.bottom>p.height&&(d=u.bottom-p.height),u.left<p.left?h=p.left-u.left:u.right>p.width&&(h=u.right-p.width),d&&!h?h=1:h&&!d&&(d=1);var f=n.offsetHeight*n.offsetWidth,g=d*h,m=f-g,v=m/f;return{placement:l,weight:v}});return o.sort(function(l,c){return c.weight-l.weight}),o[0].placement},e.prototype.findBestPlacementAt=function(t,n,r,i){var s=this;i===void 0&&(i=this.defaultContainerFunction.bind(this));var a=function(o,l,c){return s.findPositionAt(t,l,c)};return this.findBestPlacement(null,n,r,i,a)},e.prototype.defaultContainerFunction=function(){return{top:0,left:0,height:wg.innerHeight,width:wg.innerWidth}},e.prototype.calculatePosition=function(t,n,r,i){return this.positions[i]?this.positions[i](t,r,n):(console.error("No function found for placement, defaulting to 0,0"),{left:0,top:0})},e}();new oo;class uu extends gt{constructor(t,n,r){super(t,n,r),this.type="tooltip",this.renderType=it.HTML,this.isEventListenerAdded=!1,this.lastTriggeredEventType="",this.positionService=new oo,this.handleShowTooltip=i=>{const s=i.detail.data||i.detail.items,a=I(i.detail.event.target).datum();let o;const l=this.formatItems(this.getItems(i));i.detail.content?o=`<div class="title-tooltip"><p>${io(i.detail.content)}</p></div>`:o=io(this.getTooltipHTML(l));const c=N.appendOrSelect(this.tooltip,"div.content-box");if(y(this.getOptions(),"tooltip","customHTML"))if(i.detail.content){const u=`<div class="title-tooltip"><p>${io(i.detail.content)}</p></div>`;c.html(u)}else c.html(`<div class="title-tooltip"><p>${io(this.model.getOptions().tooltip.customHTML(s,o,a))}</p></div>`);else c.html(o);c.selectAll(".datapoint-tooltip").each(function(u,d){const h=l[d];l[d]&&l[d].color&&I(this).select(".tooltip-color").attr("class","tooltip-color").style("background-color",h.color)}),this.positionTooltip(i),this.tooltip.classed("hidden",!1).attr("aria-hidden",!1),this.lastTriggeredEventType=i.type},this.handleHideTooltip=()=>{this.tooltip.classed("hidden",!0).attr("aria-hidden",!0)},this.init()}addTooltipEventListener(){this.services.events.addEventListener(T.Tooltip.MOVE,t=>{this.lastTriggeredEventType!==T.Toolbar.SHOW_TOOLTIP&&this.tooltip.classed("hidden")===!1&&this.positionTooltip(t)}),this.services.events.addEventListener(T.Tooltip.SHOW,this.handleShowTooltip),this.services.events.addEventListener(T.Tooltip.HIDE,this.handleHideTooltip),this.services.events.addEventListener(T.Chart.MOUSEOUT,this.handleHideTooltip),this.services.events.addEventListener(T.Toolbar.SHOW_TOOLTIP,this.handleShowTooltip),this.services.events.addEventListener(T.Toolbar.HIDE_TOOLTIP,this.handleHideTooltip)}removeTooltipEventListener(){this.services.events.removeEventListener(T.Tooltip.MOVE,null),this.services.events.removeEventListener(T.Tooltip.SHOW,this.handleShowTooltip),this.services.events.removeEventListener(T.Tooltip.HIDE,this.handleHideTooltip),this.services.events.removeEventListener(T.Chart.MOUSEOUT,this.handleHideTooltip),this.services.events.removeEventListener(T.Toolbar.SHOW_TOOLTIP,this.handleShowTooltip),this.services.events.removeEventListener(T.Toolbar.HIDE_TOOLTIP,this.handleHideTooltip)}getItems(t){return t.detail.items?t.detail.items:[]}formatItems(t){const n=this.getOptions(),r=y(n,"tooltip","truncation","type"),i=y(n,"tooltip","truncation","threshold"),s=y(n,"tooltip","truncation","numCharacter");return r!==we.NONE?t.map(a=>{const o=a.labelIcon?12:0;return a.value=this.valueFormatter(a.value,a.label),a.label&&a.label.length+o>i&&(a.label=Wi(a.label,r,s)),a.value&&a.value.length>i&&(a.value=Wi(a.value,r,s)),a}):t.map(a=>(a.value=this.valueFormatter(a.value,a.label),a))}getTooltipHTML(t){return'<ul class="multi-tooltip">'+t.map(n=>`<li>
+		</div>`}render(t=!1){const n=this.model.getOptions();if(!this.isEventListenerAdded){const r=I(this.services.domUtils.getHolder()),i=y(n,"style","prefix");this.modal=N.appendOrSelect(r,`div.${de}--${i}--modal`),this.addEventListeners(),this.isEventListenerAdded=!0}}destroy(){this.removeEventListeners(),this.isEventListenerAdded=!1}}class Es extends gt{constructor(){super(...arguments),this.type="title",this.renderType=it.HTML}render(t=!1){const n=this.getComponentContainer(),r=y(this.getOptions(),"title"),i=n.selectAll("p.title").data([r]);if(i.enter().append("p").classed("title",!0).attr("role","heading").attr("aria-level",2).merge(i).html(s=>ln(s)),i.node()&&i.node().offsetWidth<i.node().scrollWidth){const s=this;i.on("mouseover",function(a){s.services.events.dispatchEvent(T.Tooltip.SHOW,{event:a,hoveredElement:i,content:i.text()})}).on("mousemove",function(a){s.services.events.dispatchEvent(T.Tooltip.MOVE,{event:a})}).on("mouseout",function(){s.services.events.dispatchEvent(T.Tooltip.HIDE)})}i.exit().remove()}truncateTitle(t,n){if(n<=0)return;const r=t.text();if(t.node().getComputedTextLength()>n){t.append("tspan").text("...");const i=N.appendOrSelect(t,"tspan").node().getComputedTextLength(),s=t.text(),a=this.getSubstringIndex(t.node(),0,s.length-1,n-i);t.html(s.substring(0,a-1)).append("tspan").text("...");const o=this;t.on("mouseover",function(l){o.services.events.dispatchEvent(T.Tooltip.SHOW,{event:l,hoveredElement:t,content:r})}).on("mousemove",function(l){o.services.events.dispatchEvent(T.Tooltip.MOVE,{event:l})}).on("mouseout",function(){o.services.events.dispatchEvent(T.Tooltip.HIDE)})}}getMaxTitleWidth(){return N.getSVGElementSize(this.parent.node(),{useAttrs:!0}).width}getSubstringIndex(t,n,r,i){const s=Math.floor((r+n)/2);return t.getSubStringLength(0,s)>i?this.getSubstringIndex(t,n,s,i):t.getSubStringLength(0,s)<i?t.getSubStringLength(0,s+1)>i?s:this.getSubstringIndex(t,s,r,i):s}}class cu extends gt{constructor(){super(...arguments),this.type="legend",this.renderType=it.HTML}render(t=!1){const n=this.getOptions(),r=y(n,"legend"),i=y(r,"alignment"),s=y(n,"legend","orientation");let a=this.model.getDataGroups();const{DISABLED:o}=Nt.items.status,l=a.some(x=>x.status===o),c=y(r,"order"),u=this.getComponentContainer().classed("center-aligned",i===Ft.CENTER).classed("right-aligned",i===Ft.RIGHT).classed(s||"horizontal",!0).classed("has-deactivated-items",l).attr("role",ht.GROUP).attr("aria-label","Data groups").attr("data-name","legend-items");c&&(a=this.sortDataGroups(a,c));const d=u.selectAll("div.legend-item").data(a,x=>x.name),h=d.enter().append("div").attr("class","legend-item");h.merge(u.selectAll("div.legend-item")).classed("active",function(x){return x.status===Nt.items.status.ACTIVE});const p=y(this.getOptions(),"legend","clickable");u.classed("clickable",p&&a.length>1);const f=Nt.checkbox.radius,g=h.append("div").classed("checkbox",!0),m=g.merge(d.select("div.checkbox")).attr("role",ht.CHECKBOX).attr("tabindex",p?0:-1).attr("aria-labelledby",(x,_)=>this.services.domUtils.generateElementIDString(`legend-datagroup-${_}-title`)).attr("aria-checked",({status:x})=>x===Nt.items.status.ACTIVE).attr("width",f*2).attr("height",f*2).attr("class",x=>this.model.getColorClassName({classNameTypes:[st.BACKGROUND],dataGroupName:x.name,originalClassName:"checkbox"})).style("background",x=>x.status===Nt.items.status.ACTIVE?this.model.getFillColor(x.name)||this.model.getStrokeColor(x.name):null).classed("active",function(x){return x.status===Nt.items.status.ACTIVE});g.append("svg").attr("focusable",!1).attr("preserveAspectRatio","xMidYMid meet").attr("xmlns","http://www.w3.org/2000/svg").attr("width","11").attr("height","11").attr("viewBox","0 0 31 28").attr("aria-hidden",!0).style("will-change","transform").append("path").attr("d","M13 21.2l-7.1-7.1-1.4 1.4 7.1 7.1L13 24 27.1 9.9l-1.4-1.5z"),h.append("p").merge(d.select("p"));const v=y(n,"legend","additionalItems");if(v&&a.length){const x=this,_=u.selectAll("div.additional-item").data(v);_.exit().remove();const E=_.enter().append("div").merge(_).classed("legend-item",!0).classed("additional",!0).attr("role","img").attr("aria-labelledby",(M,D)=>this.services.domUtils.generateElementIDString(`legend-datagroup-${m.size()+D}-title`));E.selectAll("*").remove();let b,S=1;E.append("svg").classed("icon",!0).each(function(M){const D=I(this);!b||b!=M.type?(b=M.type,S=1):S++,x.addAdditionalItem(D,M,S)}),E.append("p").merge(E.select("p")),this.truncateLegendText()}d.exit().on("mouseover",null).on("click",null).on("mouseout",null).remove(),p&&h.size()>1&&this.addEventListeners()}sortDataGroups(t,n){if(t.sort((r,i)=>n.indexOf(r.name)-n.indexOf(i.name)),n.length<t.length){const r=t.length-n.length;return t.slice(r).concat(t.slice(0,r))}return t}addAdditionalItem(t,n,r){const{width:i,height:s}=Nt.area;if(n.type===Wt.RADIUS?t.style("width",`${s}px`).style("height",`${s}px`):t.style("width",`${i}px`).style("height",`${s}px`),n.type===Wt.RADIUS){const{iconData:a,fill:o,stroke:l}=Nt.radius;t.attr("fill","none").selectAll("circle").data(a).enter().append("circle").classed("radius",!0).attr("role",ht.IMG).attr("aria-label","radius").attr("cx",c=>c.cx).attr("cy",c=>c.cy).attr("r",c=>c.r).style("fill",n.fill?n.fill:o).style("stroke",n.stroke?n.stroke:l)}else if(n.type===Wt.LINE){const a=Nt.line;t.select("line.line").empty()&&t.append("line").classed(`line-${r}`,!0).attr("role",ht.IMG).attr("aria-label","line").attr("x1",0).attr("y1",a.yPosition).attr("x2",i).attr("y2",a.yPosition).style("stroke",n.stroke?n.stroke:a.stroke).style("stroke-width",a.strokeWidth)}else if(n.type===Wt.AREA)t.select("rect.area").empty()&&t.append("rect").classed(`area-${r}`,!0).attr("role",ht.IMG).attr("aria-label","area").attr("width",i).attr("height",s).style("fill",r>3&&!n.fill?Nt.area.fill:n.fill).style("stroke",n.stroke);else if(n.type===Wt.SIZE){const{iconData:a,fill:o,stroke:l}=Nt.size;t.attr("fill","none").attr("role",ht.IMG).attr("aria-label","size").selectAll("rect").data(a).enter().append("rect").classed("size",!0).attr("width",c=>c.width).attr("height",c=>c.height).attr("y",()=>0).style("fill",n.fill?n.fill:o).style("stroke",n.stroke?n.stroke:l).style("stroke-width",1)}else if(n.type===Wt.QUARTILE){const{iconData:a}=Nt.quartile;t.selectAll("rect").attr("role",ht.IMG).attr("aria-label","quartile").data(a).enter().append("rect").attr("class",(o,l)=>`quartile-${l===0?"wrapper":"line"}`).attr("x",o=>o.x).attr("y",o=>o.y).attr("width",o=>o.width).attr("height",o=>o.height)}else if(n.type===Wt.ZOOM){const{iconData:a,color:o}=y(Nt,"zoom"),l=t.attr("role",ht.IMG).attr("aria-label","zoom").selectAll("g.icon").data(a).enter();l.append("g").attr("x",c=>c.x).attr("y",c=>c.y).attr("width",c=>c.width).attr("height",c=>c.height).append("polygon").attr("points","7.7 4.82 5.78 4.82 5.78 2.89 4.82 2.89 4.82 4.82 2.89 4.82 2.89 5.78 4.82 5.78 4.82 7.7 5.78 7.7 5.78 5.78 7.7 5.78 7.7 4.82").attr("fill",()=>n.color?n.color:o),l.append("path").attr("d","M9.36,8.67A5.22,5.22,0,0,0,10.59,5.3,5.3,5.3,0,1,0,5.3,10.59,5.22,5.22,0,0,0,8.67,9.36L12.32,13l.68-.68Zm-4.06,1A4.34,4.34,0,1,1,9.63,5.3,4.33,4.33,0,0,1,5.3,9.63Z").attr("fill",()=>n.color?n.color:o)}}truncateLegendText(){const t=this.getComponentContainer(),n=y(this.getOptions(),"legend","truncation"),r=y(n,"type"),i=y(n,"threshold"),s=y(n,"numCharacter"),a=t.selectAll("div.legend-item p");a.attr("id",function(){return(this.parentNode.querySelector("div.checkbox")||this.parentNode).getAttribute("aria-labelledby")}),r!==we.NONE?a.html(function(o){const l=ln(o.name);return l.length>i&&l.length!==s?Wi(l,r,s):l}):a.html(o=>ln(o.name))}addEventListeners(){const t=this,n=this.getComponentContainer(),r=this.getOptions(),i=y(r,"legend"),s=y(i,"truncation");n.selectAll("div.legend-item").on("mouseover",function(a){t.services.events.dispatchEvent(T.Legend.ITEM_HOVER,{hoveredElement:I(this)});const o=I(this);o.select("div.checkbox").classed("hovered",!0);const l=o.datum();l.name.length>s.threshold&&s.numCharacter<l.name.length&&s.type!==we.NONE&&t.services.events.dispatchEvent(T.Tooltip.SHOW,{event:a,hoveredElement:o,content:l.name})}).on("mousemove",function(a){I(this).datum().name.length>s.threshold&&s.type!==we.NONE&&t.services.events.dispatchEvent(T.Tooltip.MOVE,{event:a})}).on("click",function(){t.services.events.dispatchEvent(T.Legend.ITEM_CLICK,{clickedElement:I(this)});const a=I(this).datum();t.model.toggleDataLabel(a.name)}).on("mouseout",function(){const a=I(this);a.select("div.checkbox").classed("hovered",!1),a.datum().name.length>s.threshold&&s.type!==we.NONE&&t.services.events.dispatchEvent(T.Tooltip.HIDE),t.services.events.dispatchEvent(T.Legend.ITEM_MOUSEOUT,{hoveredElement:a})}),n.selectAll("div.legend-item div.checkbox").on("keyup",function(a){a.key&&a.key==="Tab"&&t.services.events.dispatchEvent(T.Legend.ITEM_HOVER,{hoveredElement:I(this)})}),n.selectAll("div.legend-item div.checkbox").on("keydown",function(a,o){a.key&&a.key===" "?(a.preventDefault(),t.model.toggleDataLabel(o.name)):a.key&&a.key==="Tab"&&t.services.events.dispatchEvent(T.Legend.ITEM_MOUSEOUT,{hoveredElement:I(this)})}),n.selectAll("g.additional-item").on("mouseover",function(a){const o=I(this),l=o.datum();l.name.length>s.threshold&&t.services.events.dispatchEvent(T.Tooltip.SHOW,{event:a,hoveredElement:o,content:l.name})})}}class Sg extends gt{constructor(t,n,r){super(t,n,r),this.type="chart-clip",this.renderType=it.SVG,this.chartClipId="chart-clip-id-"+Math.floor(Math.random()*99999999999),this.init()}init(){this.model.set({chartClipId:this.chartClipId},{skipUpdate:!0})}render(t=!0){this.createClipPath()}createClipPath(){const t=this.parent,{cartesianScales:n}=this.services;if(!n)throw new Error("Service cartesianScales was undefined");const r=n.getMainXScale(),i=n.getMainYScale(),[s,a]=r.range(),[o,l]=i.range();if(!t)throw new Error("svg is undefined");this.chartClipPath=N.appendOrSelect(t,`clipPath.${this.type}`).attr("id",this.chartClipId);const c=N.appendOrSelect(this.chartClipPath,`rect.${this.type}`);a-s>0&&c.attr("x",s).attr("y",l).attr("width",a-s).attr("height",o-l),this.chartClipPath.merge(c).lower()}}class CL extends Sg{constructor(){super(...arguments),this.type="canvas-chart-clip",this.chartClipId="canvas-chart-clip-id-"+Math.floor(Math.random()*99999999999)}createClipPath(){const t=this.parent,{width:n,height:r}=N.getSVGElementSize(this.parent,{useAttrs:!0});this.chartClipPath=N.appendOrSelect(t,`clipPath.${this.type}`).attr("id",this.chartClipId);const i=N.appendOrSelect(this.chartClipPath,`rect.${this.type}`);i.attr("x",0).attr("y",0).attr("width",n).attr("height",r),this.chartClipPath.merge(i).lower()}}var si,Gt;(function(e){e.LEFT="left",e.RIGHT="right",e.TOP="top",e.BOTTOM="bottom"})(Gt||(Gt={}));var Tg=(si={},si[Gt.LEFT]=function(e,t,n){return{top:e.top-Math.round(t.offsetHeight/2)+Math.round(n.height/2),left:Math.round(e.left-t.offsetWidth)}},si[Gt.RIGHT]=function(e,t,n){return{top:e.top-Math.round(t.offsetHeight/2)+Math.round(n.height/2),left:Math.round(e.left+n.width)}},si[Gt.TOP]=function(e,t,n){return{top:Math.round(e.top-t.offsetHeight),left:e.left-Math.round(t.offsetWidth/2)+Math.round(n.width/2)}},si[Gt.BOTTOM]=function(e,t,n){return{top:Math.round(e.top+n.height),left:e.left-Math.round(t.offsetWidth/2)+Math.round(n.width/2)}},si),wg=typeof window<"u"?window:{innerHeight:0,innerWidth:0},oo=function(){function e(t){t===void 0&&(t={}),this.positions=Tg,this.positions=Object.assign({},Tg,t)}return e.prototype.getRelativeOffset=function(t){for(var n={left:t.offsetLeft,top:t.offsetTop};t.offsetParent&&getComputedStyle(t.offsetParent).position==="static";)n.left+=t.offsetLeft,n.top+=t.offsetTop,t=t.offsetParent;return n},e.prototype.getAbsoluteOffset=function(t){for(var n=t,r={top:0,left:0};n.offsetParent;){var i=getComputedStyle(n.offsetParent);i.position==="static"&&i.marginLeft&&i.marginTop&&(parseInt(i.marginTop,10)&&(r.top+=parseInt(i.marginTop,10)),parseInt(i.marginLeft,10)&&(r.left+=parseInt(i.marginLeft,10))),n=n.offsetParent}var s=t.getBoundingClientRect(),a=document.body.getBoundingClientRect();return{top:s.top-a.top+r.top,left:s.left-a.left+r.left}},e.prototype.findRelative=function(t,n,r){var i=this.getRelativeOffset(t),s=t.getBoundingClientRect();return this.calculatePosition(i,s,n,r)},e.prototype.findAbsolute=function(t,n,r){var i=this.getAbsoluteOffset(t),s=t.getBoundingClientRect();return this.calculatePosition(i,s,n,r)},e.prototype.findPosition=function(t,n,r,i){i===void 0&&(i=this.getAbsoluteOffset.bind(this));var s=i(t),a=t.getBoundingClientRect();return this.calculatePosition(s,a,n,r)},e.prototype.findPositionAt=function(t,n,r){return this.calculatePosition(t,{top:0,left:0,height:0,width:0},n,r)},e.prototype.getPlacementBox=function(t,n){var r=t.offsetHeight+n.top,i=t.offsetWidth+n.left;return{top:n.top,bottom:r,left:n.left,right:i}},e.prototype.addOffset=function(t,n,r){return n===void 0&&(n=0),r===void 0&&(r=0),Object.assign({},t,{top:t.top+n,left:t.left+r})},e.prototype.setElement=function(t,n){t.style.top=n.top+"px",t.style.left=n.left+"px"},e.prototype.findBestPlacement=function(t,n,r,i,s){var a=this;i===void 0&&(i=this.defaultContainerFunction.bind(this)),s===void 0&&(s=this.findPosition.bind(this));var o=r.map(function(l){var c=s(t,n,l),u=a.getPlacementBox(n,c),d=0,h=0,p=i();u.top<p.top?d=p.top-u.top:u.bottom>p.height&&(d=u.bottom-p.height),u.left<p.left?h=p.left-u.left:u.right>p.width&&(h=u.right-p.width),d&&!h?h=1:h&&!d&&(d=1);var f=n.offsetHeight*n.offsetWidth,g=d*h,m=f-g,v=m/f;return{placement:l,weight:v}});return o.sort(function(l,c){return c.weight-l.weight}),o[0].placement},e.prototype.findBestPlacementAt=function(t,n,r,i){var s=this;i===void 0&&(i=this.defaultContainerFunction.bind(this));var a=function(o,l,c){return s.findPositionAt(t,l,c)};return this.findBestPlacement(null,n,r,i,a)},e.prototype.defaultContainerFunction=function(){return{top:0,left:0,height:wg.innerHeight,width:wg.innerWidth}},e.prototype.calculatePosition=function(t,n,r,i){return this.positions[i]?this.positions[i](t,r,n):(console.error("No function found for placement, defaulting to 0,0"),{left:0,top:0})},e}();new oo;class uu extends gt{constructor(t,n,r){super(t,n,r),this.type="tooltip",this.renderType=it.HTML,this.isEventListenerAdded=!1,this.lastTriggeredEventType="",this.positionService=new oo,this.handleShowTooltip=i=>{const s=i.detail.data||i.detail.items,a=I(i.detail.event.target).datum();let o;const l=this.formatItems(this.getItems(i));i.detail.content?o=`<div class="title-tooltip"><p>${io(i.detail.content)}</p></div>`:o=io(this.getTooltipHTML(l));const c=N.appendOrSelect(this.tooltip,"div.content-box");if(y(this.getOptions(),"tooltip","customHTML"))if(i.detail.content){const u=`<div class="title-tooltip"><p>${io(i.detail.content)}</p></div>`;c.html(u)}else c.html(`<div class="title-tooltip"><p>${io(this.model.getOptions().tooltip.customHTML(s,o,a))}</p></div>`);else c.html(o);c.selectAll(".datapoint-tooltip").each(function(u,d){const h=l[d];l[d]&&l[d].color&&I(this).select(".tooltip-color").attr("class","tooltip-color").style("background-color",h.color)}),this.positionTooltip(i),this.tooltip.classed("hidden",!1).attr("aria-hidden",!1),this.lastTriggeredEventType=i.type},this.handleHideTooltip=()=>{this.tooltip.classed("hidden",!0).attr("aria-hidden",!0)},this.init()}addTooltipEventListener(){this.services.events.addEventListener(T.Tooltip.MOVE,t=>{this.lastTriggeredEventType!==T.Toolbar.SHOW_TOOLTIP&&this.tooltip.classed("hidden")===!1&&this.positionTooltip(t)}),this.services.events.addEventListener(T.Tooltip.SHOW,this.handleShowTooltip),this.services.events.addEventListener(T.Tooltip.HIDE,this.handleHideTooltip),this.services.events.addEventListener(T.Chart.MOUSEOUT,this.handleHideTooltip),this.services.events.addEventListener(T.Toolbar.SHOW_TOOLTIP,this.handleShowTooltip),this.services.events.addEventListener(T.Toolbar.HIDE_TOOLTIP,this.handleHideTooltip)}removeTooltipEventListener(){this.services.events.removeEventListener(T.Tooltip.MOVE,null),this.services.events.removeEventListener(T.Tooltip.SHOW,this.handleShowTooltip),this.services.events.removeEventListener(T.Tooltip.HIDE,this.handleHideTooltip),this.services.events.removeEventListener(T.Chart.MOUSEOUT,this.handleHideTooltip),this.services.events.removeEventListener(T.Toolbar.SHOW_TOOLTIP,this.handleShowTooltip),this.services.events.removeEventListener(T.Toolbar.HIDE_TOOLTIP,this.handleHideTooltip)}getItems(t){return t.detail.items?t.detail.items:[]}formatItems(t){const n=this.getOptions(),r=y(n,"tooltip","truncation","type"),i=y(n,"tooltip","truncation","threshold"),s=y(n,"tooltip","truncation","numCharacter");return r!==we.NONE?t.map(a=>{const o=a.labelIcon?12:0;return a.value=this.valueFormatter(a.value,a.label),a.label&&a.label.length+o>i&&(a.label=Wi(a.label,r,s)),a.value&&a.value.length>i&&(a.value=Wi(a.value,r,s)),a}):t.map(a=>(a.value=this.valueFormatter(a.value,a.label),a))}getTooltipHTML(t){return'<ul class="multi-tooltip">'+t.map(n=>`<li>
 					<div class="datapoint-tooltip${n.bold?" bold":""}">
 						${n.class||n.color?`<div class="tooltip-color ${n.class}"></div>`:""}
 						<div class="label">

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@carbon/charts-react",
-	"version": "1.23.14",
+	"version": "1.23.15",
 	"description": "Carbon Charts component library for React",
 	"type": "module",
 	"module": "./dist/index.mjs",
@@ -38,7 +38,7 @@
 		"format": "prettier . --write --ignore-path ../../.prettierignore"
 	},
 	"dependencies": {
-		"@carbon/charts": "1.23.14",
+		"@carbon/charts": "1.23.15",
 		"@carbon/icons-react": "^11.60.0",
 		"@ibm/telemetry-js": "^1.9.1"
 	},
@@ -119,5 +119,5 @@
 			"url": "https://github.com/theiliad"
 		}
 	],
-	"gitHead": "fad51f0642f7a64cf02e3ff9d7b9ba5deff3e633"
+	"gitHead": "e0553151bcdd280d64f2f60dbe766475db1d675e"
 }