@ebay/ui-core-react/ebay-donut-chart/index.js

Skin components build off React

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("../tslib.es6-BW4cJBUu.js"),e=require("react"),E=require("classnames"),C=require("@highcharts/react"),v=require("highcharts");require("highcharts/modules/accessibility");require("highcharts/modules/pattern-fill");const c=require("../shared-DrsztGqS.js"),N=require("../chart-legend-QlYP-Aia.js");function S(a){a.wrap(a.seriesTypes.pie.prototype,"translate",function(r){if(r.call(this),this.points.length===1)return;const t=this.center[2],i=2*Math.asin(5/t);this.points.forEach(d=>{d.shapeArgs.start+=i/2,d.shapeArgs.end-=i/2})})}function q({name:a,value:r,tooltip:t}){const s=c.escapeHtml(t??r);return`<div class="donut-tooltip tooltip__overlay" role="tooltip"><div class="tooltip__mask"><div class="tooltip__cell"><div class="tooltip__content"><b>${c.escapeHtml(a)}</b><br>${s}</div></div></div></div>`}S(v);const D=`
    .donut-tooltip.tooltip__overlay { display: block; position: relative; }
`;function O(a){var r;const t=a[0];if(!t)return{prepared:void 0,colors:[]};const s=Object.assign(Object.assign({},t),{type:(r=t.type)!==null&&r!==void 0?r:"pie"}),i=c.setDonutColors(s);return{prepared:s,colors:i}}const T=a=>{var{title:r,metricValue:t,metricLabel:s,series:i,highchartsDescription:d,renderTooltipOutside:p=!0,className:_}=a,g=f.__rest(a,["title","metricValue","metricLabel","series","highchartsDescription","renderTooltipOutside","className"]);i.length===0&&console.warn("EbayDonutChart: at least one series is required."),i.length>1&&console.warn("EbayDonutChart: only one series is supported. Additional series will be ignored.");const{prepared:o,colors:h}=e.useMemo(()=>O(i),[i]),b=e.useMemo(()=>{var n,l;return(l=(n=o?.data)===null||n===void 0?void 0:n.map(m=>{var u;return{name:(u=m.name)!==null&&u!==void 0?u:"",value:m.y}}))!==null&&l!==void 0?l:[]},[o]),y=e.useMemo(()=>({chart:{type:"pie",spacing:[0,0,0,0],margin:[0,0,0,0],backgroundColor:c.backgroundColor,style:{fontFamily:c.chartFontFamily}},colors:h,title:{text:void 0},plotOptions:{pie:{description:d,size:"100%",thickness:10,allowPointSelect:!1,cursor:"pointer",borderRadius:"30%",dataLabels:{enabled:!1},states:{hover:{halo:{size:0}}}}},tooltip:{hideDelay:250,useHTML:!0,backgroundColor:"transparent",padding:0,borderWidth:0,borderRadius:0,outside:p,shadow:!1,shared:!0,style:{filter:c.tooltipShadows,fontSize:"12px"},formatter:function(){var n,l;return q({name:String((n=this.key)!==null&&n!==void 0?n:""),value:String((l=this.y)!==null&&l!==void 0?l:""),tooltip:this.tooltip})}},series:o?[o]:[],credits:{enabled:!1}}),[o,h,d,p]);return e.createElement(e.Fragment,null,e.createElement("style",null,D),e.createElement("div",Object.assign({},g,{className:E("donut-chart",_)}),e.createElement("div",{className:"donut-chart__grid"},r&&e.createElement("div",{className:"donut-chart__title"},r),(t||s)&&e.createElement("div",{className:"donut-chart__metric"},t&&e.createElement("div",{className:"donut-chart__metric-value"},t),s&&e.createElement("div",{className:"donut-chart__metric-label"},s)),e.createElement("div",{className:"donut-chart__graph"},e.createElement(C.Chart,{highcharts:v,options:y})),e.createElement("div",{className:"donut-chart__legend"},e.createElement(N.EbayChartLegend,{items:b})))))};exports.EbayDonutChart=T;