@automattic/charts 0.5.0 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
5
5
  The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
6
6
  and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
7
 
8
+ ## [0.6.0] - 2025-01-23
9
+ ### Changed
10
+ - size props renamed to width for semi circle chart [#41270]
11
+
8
12
  ## [0.5.0] - 2025-01-22
9
13
  ### Changed
10
14
  - Simplify rollup config and remove a cjs import [#41266]
@@ -71,6 +75,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
71
75
  - Fixed lints following ESLint rule changes for TS [#40584]
72
76
  - Fixing a bug in Chart storybook data. [#40640]
73
77
 
78
+ [0.6.0]: https://github.com/Automattic/charts/compare/v0.5.0...v0.6.0
74
79
  [0.5.0]: https://github.com/Automattic/charts/compare/v0.4.0...v0.5.0
75
80
  [0.4.0]: https://github.com/Automattic/charts/compare/v0.3.0...v0.4.0
76
81
  [0.3.0]: https://github.com/Automattic/charts/compare/v0.2.3...v0.3.0
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("react/jsx-runtime"),a=require("@visx/group"),s=require("@visx/shape"),r=require("clsx");require("react");var t=require("../../hooks/use-chart-mouse-handler.js"),i=require("../../providers/theme/theme-provider.js"),l=require("../../providers/theme/themes.js"),o=require("../legend/base-legend.js"),n=require("../shared/with-responsive.js"),d=require("../tooltip/base-tooltip.js"),c=require("./pie-chart.module.scss.js");const u=({data:n,withTooltips:u=!1,className:p,showLegend:h,legendOrientation:m,size:v,thickness:g=1,padding:x=20,gapScale:j=0,cornerScale:f=0})=>{const q=i.useChartTheme(),{onMouseMove:M,onMouseLeave:b,tooltipOpen:N,tooltipData:w,tooltipLeft:T,tooltipTop:V}=t({withTooltips:u}),{isValid:A,message:B}=(e=>{if(!e.length)return{isValid:!1,message:"No data available"};if(e.some((e=>e.percentage<0||e.value<0)))return{isValid:!1,message:"Invalid data: Negative values are not allowed"};const a=e.reduce(((e,a)=>e+a.percentage),0);return Math.abs(a-100)>.01?{isValid:!1,message:"Invalid percentage total: Must equal 100"}:{isValid:!0,message:""}})(n);if(!A)return e.jsx("div",{className:r("pie-chart",c["pie-chart"],p),children:e.jsx("div",{className:c["error-message"],children:B})});const L=v,R=v,k=Math.min(L,R)/2,y=L/2,C=R/2,S=j*(2*Math.PI/n.length),I=k-x,P=I*(1-g),$=(I-P)/2,z=f?Math.min(f*I,$):0,O=n.map(((e,a)=>({...e,index:a}))),D={value:e=>e.value,fill:e=>e?.color||q.colors[e.index]},E=n.map(((e,a)=>({label:e.label,value:e.value.toString(),color:q.colors[a%q.colors.length]})));return e.jsxs("div",{className:r("pie-chart",c["pie-chart"],p),children:[e.jsx("svg",{viewBox:`0 0 ${v} ${v}`,preserveAspectRatio:"xMidYMid meet",children:e.jsx(a.Group,{top:C,left:y,children:e.jsx(s.Pie,{data:O,pieValue:D.value,outerRadius:I,innerRadius:P,padAngle:S,cornerRadius:z,children:a=>a.arcs.map(((s,r)=>{const[t,i]=a.path.centroid(s),o=s.endAngle-s.startAngle>=.25,n=e=>M(e,s.data),d={d:a.path(s)||"",fill:D.fill(s.data)};return u&&(d.onMouseMove=n,d.onMouseLeave=b),e.jsxs("g",{children:[e.jsx("path",{...d}),o&&e.jsx("text",{x:t,y:i,dy:".33em",fill:q.labelBackgroundColor||l.defaultTheme.labelBackgroundColor,fontSize:12,textAnchor:"middle",pointerEvents:"none",children:s.data.label})]},`arc-${r}`)}))})})}),h&&e.jsx(o.BaseLegend,{items:E,orientation:m,className:c["pie-chart-legend"]}),u&&N&&w&&e.jsx(d.BaseTooltip,{data:w,top:V||0,left:T||0,style:{transform:"translate(-50%, -100%)"}})]})};u.displayName="PieChart";var p=n.withResponsive(u);module.exports=p;
1
+ "use strict";var e=require("react/jsx-runtime"),a=require("@visx/group"),s=require("@visx/shape"),t=require("clsx");require("react");var r=require("../../hooks/use-chart-mouse-handler.js"),i=require("../../providers/theme/theme-provider.js"),l=require("../../providers/theme/themes.js"),o=require("../legend/base-legend.js"),n=require("../shared/with-responsive.js"),d=require("../tooltip/base-tooltip.js"),c=require("./pie-chart.module.scss.js");const u=({data:n,withTooltips:u=!1,className:h,showLegend:p,legendOrientation:m,size:v,thickness:g=1,padding:x=20,gapScale:j=0,cornerScale:f=0})=>{const q=i.useChartTheme(),{onMouseMove:M,onMouseLeave:b,tooltipOpen:w,tooltipData:N,tooltipLeft:T,tooltipTop:V}=r({withTooltips:u}),{isValid:A,message:B}=(e=>{if(!e.length)return{isValid:!1,message:"No data available"};if(e.some((e=>e.percentage<0||e.value<0)))return{isValid:!1,message:"Invalid data: Negative values are not allowed"};const a=e.reduce(((e,a)=>e+a.percentage),0);return Math.abs(a-100)>.01?{isValid:!1,message:"Invalid percentage total: Must equal 100"}:{isValid:!0,message:""}})(n);if(!A)return e.jsx("div",{className:t("pie-chart",c["pie-chart"],h),children:e.jsx("div",{className:c["error-message"],children:B})});const L=v,R=v,k=Math.min(L,R)/2,y=L/2,C=R/2,S=j*(2*Math.PI/n.length),I=k-x,P=I*(1-g),$=(I-P)/2,z=f?Math.min(f*I,$):0,O=n.map(((e,a)=>({...e,index:a}))),D={value:e=>e.value,fill:e=>e?.color||q.colors[e.index]},E=n.map(((e,a)=>({label:e.label,value:e.value.toString(),color:q.colors[a%q.colors.length]})));return e.jsxs("div",{className:t("pie-chart",c["pie-chart"],h),children:[e.jsx("svg",{viewBox:`0 0 ${v} ${v}`,preserveAspectRatio:"xMidYMid meet",width:v,height:v,children:e.jsx(a.Group,{top:C,left:y,children:e.jsx(s.Pie,{data:O,pieValue:D.value,outerRadius:I,innerRadius:P,padAngle:S,cornerRadius:z,children:a=>a.arcs.map(((s,t)=>{const[r,i]=a.path.centroid(s),o=s.endAngle-s.startAngle>=.25,n=e=>M(e,s.data),d={d:a.path(s)||"",fill:D.fill(s.data)};return u&&(d.onMouseMove=n,d.onMouseLeave=b),e.jsxs("g",{children:[e.jsx("path",{...d}),o&&e.jsx("text",{x:r,y:i,dy:".33em",fill:q.labelBackgroundColor||l.defaultTheme.labelBackgroundColor,fontSize:12,textAnchor:"middle",pointerEvents:"none",children:s.data.label})]},`arc-${t}`)}))})})}),p&&e.jsx(o.BaseLegend,{items:E,orientation:m,className:c["pie-chart-legend"]}),u&&w&&N&&e.jsx(d.BaseTooltip,{data:N,top:V||0,left:T||0,style:{transform:"translate(-50%, -100%)"}})]})};u.displayName="PieChart";var h=n.withResponsive(u);module.exports=h;
2
2
  //# sourceMappingURL=pie-chart.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"pie-chart.js","sources":["/@automattic/charts/../../../../src/components/pie-chart/pie-chart.tsx"],"sourcesContent":[null],"names":["PieChart","data","withTooltips","className","showLegend","legendOrientation","size","thickness","padding","gapScale","cornerScale","providerTheme","useChartTheme","onMouseMove","onMouseLeave","tooltipOpen","tooltipData","tooltipLeft","tooltipTop","useChartMouseHandler","isValid","message","length","some","item","percentage","value","totalPercentage","reduce","sum","Math","abs","validateData","_jsx","jsx","clsx","styles","children","width","height","radius","min","centerX","centerY","padAngle","PI","outerRadius","innerRadius","maxCornerRadius","cornerRadius","dataWithIndex","map","d","index","accessors","fill","color","colors","legendItems","label","toString","_jsxs","viewBox","preserveAspectRatio","Group","top","left","Pie","pieValue","pie","arcs","arc","centroidX","centroidY","path","centroid","hasSpaceForLabel","endAngle","startAngle","handleMouseMove","event","pathProps","jsxs","x","y","dy","labelBackgroundColor","defaultTheme","fontSize","textAnchor","pointerEvents","Legend","items","orientation","BaseTooltip","style","transform","displayName","withResponsive"],"mappings":"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"}
1
+ {"version":3,"file":"pie-chart.js","sources":["/@automattic/charts/../../../../src/components/pie-chart/pie-chart.tsx"],"sourcesContent":[null],"names":["PieChart","data","withTooltips","className","showLegend","legendOrientation","size","thickness","padding","gapScale","cornerScale","providerTheme","useChartTheme","onMouseMove","onMouseLeave","tooltipOpen","tooltipData","tooltipLeft","tooltipTop","useChartMouseHandler","isValid","message","length","some","item","percentage","value","totalPercentage","reduce","sum","Math","abs","validateData","_jsx","jsx","clsx","styles","children","width","height","radius","min","centerX","centerY","padAngle","PI","outerRadius","innerRadius","maxCornerRadius","cornerRadius","dataWithIndex","map","d","index","accessors","fill","color","colors","legendItems","label","toString","_jsxs","viewBox","preserveAspectRatio","Group","top","left","Pie","pieValue","pie","arcs","arc","centroidX","centroidY","path","centroid","hasSpaceForLabel","endAngle","startAngle","handleMouseMove","event","pathProps","jsxs","x","y","dy","labelBackgroundColor","defaultTheme","fontSize","textAnchor","pointerEvents","Legend","items","orientation","BaseTooltip","style","transform","displayName","withResponsive"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("react/jsx-runtime"),l=require("@visx/event"),i=require("@visx/group"),t=require("@visx/shape"),a=require("@visx/text"),s=require("@visx/tooltip"),r=require("clsx"),o=require("react"),c=require("../../providers/theme/theme-provider.js"),n=require("../legend/base-legend.js"),p=require("../shared/with-responsive.js"),u=require("../tooltip/base-tooltip.js"),d=require("./pie-semi-circle-chart.module.scss.js");const h=({data:p,size:h=500,label:v,note:x,className:m,withTooltips:j=!1,clockwise:g=!0,thickness:q=.4,showLegend:b,legendOrientation:T})=>{const f=c.useChartTheme(),{tooltipOpen:w,tooltipLeft:y,tooltipTop:A,tooltipData:M,hideTooltip:P,showTooltip:C}=s.useTooltip(),N=h/2,k=h/2,D=h/2,L=D*(1-q+.03),I=p.map(((e,l)=>({...e,index:l}))),R=g?-Math.PI/2:Math.PI/2,B=g?Math.PI/2:-Math.PI/2,S={value:e=>e.value,sort:(e,l)=>l.value-e.value,fill:e=>e.color||f.colors[e.index%f.colors.length]},G=o.useCallback(((e,i)=>{const t=l.localPoint(e);t&&C({tooltipData:i.data,tooltipLeft:t.x,tooltipTop:t.y-10})}),[C]),O=o.useCallback((()=>{P()}),[P]),$=o.useCallback((e=>l=>{G(l,e)}),[G]),z=p.map(((e,l)=>({label:e.label,value:e.valueDisplay||e.value.toString(),color:S.fill({...e,index:l})})));return e.jsxs("div",{className:r("pie-semi-circle-chart",d["pie-semi-circle-chart"],m),children:[e.jsx("svg",{viewBox:`0 0 ${h} ${k}`,children:e.jsxs(i.Group,{top:N,left:N,children:[e.jsx(t.Pie,{data:I,pieValue:S.value,outerRadius:D,innerRadius:L,cornerRadius:3,padAngle:.03,startAngle:R,endAngle:B,pieSort:S.sort,children:l=>l.arcs.map((i=>e.jsx("g",{onMouseMove:$(i),onMouseLeave:O,children:e.jsx("path",{d:l.path(i)||"",fill:S.fill(i.data)})},i.data.label)))}),e.jsxs(i.Group,{children:[e.jsx(a.Text,{textAnchor:"middle",verticalAnchor:"start",y:-40,className:d.label,children:v}),e.jsx(a.Text,{textAnchor:"middle",verticalAnchor:"start",y:-20,className:d.note,children:x})]})]})}),j&&w&&M&&e.jsx(u.BaseTooltip,{data:{label:M.label,value:M.value,valueDisplay:M.valueDisplay},top:A||0,left:y||0}),b&&e.jsx(n.BaseLegend,{items:z,orientation:T,className:d["pie-semi-circle-chart-legend"]})]})};h.displayName="PieSemiCircleChart";var v=p.withResponsive(h);module.exports=v;
1
+ "use strict";var e=require("react/jsx-runtime"),i=require("@visx/event"),l=require("@visx/group"),t=require("@visx/shape"),a=require("@visx/text"),s=require("@visx/tooltip"),r=require("clsx"),o=require("react"),c=require("../../providers/theme/theme-provider.js"),n=require("../legend/base-legend.js"),p=require("../shared/with-responsive.js"),u=require("../tooltip/base-tooltip.js"),d=require("./pie-semi-circle-chart.module.scss.js");const h=({data:p,width:h,label:v,note:x,className:m,withTooltips:j=!1,clockwise:g=!0,thickness:q=.4,showLegend:b,legendOrientation:T})=>{const w=c.useChartTheme(),{tooltipOpen:f,tooltipLeft:y,tooltipTop:A,tooltipData:M,hideTooltip:P,showTooltip:C}=s.useTooltip(),N=h/2,k=h/2,D=h/2,L=D*(1-q+.03),I=p.map(((e,i)=>({...e,index:i}))),R=g?-Math.PI/2:Math.PI/2,B=g?Math.PI/2:-Math.PI/2,S={value:e=>e.value,sort:(e,i)=>i.value-e.value,fill:e=>e.color||w.colors[e.index%w.colors.length]},G=o.useCallback(((e,l)=>{const t=i.localPoint(e);t&&C({tooltipData:l.data,tooltipLeft:t.x,tooltipTop:t.y-10})}),[C]),O=o.useCallback((()=>{P()}),[P]),$=o.useCallback((e=>i=>{G(i,e)}),[G]),V=p.map(((e,i)=>({label:e.label,value:e.valueDisplay||e.value.toString(),color:S.fill({...e,index:i})})));return e.jsxs("div",{className:r("pie-semi-circle-chart",d["pie-semi-circle-chart"],m),children:[e.jsx("svg",{viewBox:`0 0 ${h} ${k}`,width:h,height:k,children:e.jsxs(l.Group,{top:N,left:N,children:[e.jsx(t.Pie,{data:I,pieValue:S.value,outerRadius:D,innerRadius:L,cornerRadius:3,padAngle:.03,startAngle:R,endAngle:B,pieSort:S.sort,children:i=>i.arcs.map((l=>e.jsx("g",{onMouseMove:$(l),onMouseLeave:O,children:e.jsx("path",{d:i.path(l)||"",fill:S.fill(l.data)})},l.data.label)))}),e.jsxs(l.Group,{children:[e.jsx(a.Text,{textAnchor:"middle",verticalAnchor:"start",y:-40,className:d.label,children:v}),e.jsx(a.Text,{textAnchor:"middle",verticalAnchor:"start",y:-20,className:d.note,children:x})]})]})}),j&&f&&M&&e.jsx(u.BaseTooltip,{data:{label:M.label,value:M.value,valueDisplay:M.valueDisplay},top:A||0,left:y||0}),b&&e.jsx(n.BaseLegend,{items:V,orientation:T,className:d["pie-semi-circle-chart-legend"]})]})};h.displayName="PieSemiCircleChart";var v=p.withResponsive(h);module.exports=v;
2
2
  //# sourceMappingURL=pie-semi-circle-chart.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"pie-semi-circle-chart.js","sources":["/@automattic/charts/../../../../src/components/pie-semi-circle-chart/pie-semi-circle-chart.tsx"],"sourcesContent":[null],"names":["PieSemiCircleChart","data","size","label","note","className","withTooltips","clockwise","thickness","showLegend","legendOrientation","providerTheme","useChartTheme","tooltipOpen","tooltipLeft","tooltipTop","tooltipData","hideTooltip","showTooltip","useTooltip","centerX","height","radius","innerRadius","dataWithIndex","map","d","index","startAngle","Math","PI","endAngle","accessors","value","sort","a","b","fill","color","colors","length","handleMouseMove","useCallback","event","arc","coords","localPoint","x","y","handleMouseLeave","handleArcMouseMove","legendItems","item","valueDisplay","toString","_jsxs","clsx","styles","children","_jsx","viewBox","Group","top","left","Pie","pieValue","outerRadius","cornerRadius","padAngle","pieSort","pie","arcs","onMouseMove","onMouseLeave","jsx","path","Text","textAnchor","verticalAnchor","BaseTooltip","Legend","items","orientation","displayName","withResponsive"],"mappings":"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"}
1
+ {"version":3,"file":"pie-semi-circle-chart.js","sources":["/@automattic/charts/../../../../src/components/pie-semi-circle-chart/pie-semi-circle-chart.tsx"],"sourcesContent":[null],"names":["PieSemiCircleChart","data","width","label","note","className","withTooltips","clockwise","thickness","showLegend","legendOrientation","providerTheme","useChartTheme","tooltipOpen","tooltipLeft","tooltipTop","tooltipData","hideTooltip","showTooltip","useTooltip","centerX","height","radius","innerRadius","dataWithIndex","map","d","index","startAngle","Math","PI","endAngle","accessors","value","sort","a","b","fill","color","colors","length","handleMouseMove","useCallback","event","arc","coords","localPoint","x","y","handleMouseLeave","handleArcMouseMove","legendItems","item","valueDisplay","toString","_jsxs","jsxs","clsx","styles","_jsx","jsx","viewBox","Group","top","left","children","Pie","pieValue","outerRadius","cornerRadius","padAngle","pieSort","pie","arcs","onMouseMove","onMouseLeave","path","Text","textAnchor","verticalAnchor","BaseTooltip","Legend","items","orientation","displayName","withResponsive"],"mappings":"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"}
package/dist/index.d.ts CHANGED
@@ -182,9 +182,9 @@ declare const _default$1: (props: Omit<PieChartProps, "width" | "height" | "size
182
182
 
183
183
  interface PieSemiCircleChartProps extends BaseChartProps<DataPointPercentage[]> {
184
184
  /**
185
- * Size of the chart in pixels
185
+ * Width of the chart in pixels; height would be half of this value calculated automatically.
186
186
  */
187
- size?: number;
187
+ width?: number;
188
188
  /**
189
189
  * Thickness of the pie chart. A value between 0 and 1
190
190
  */
@@ -1,2 +1,2 @@
1
- import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Group as t}from"@visx/group";import{Pie as o}from"@visx/shape";import r from"clsx";import"react";import i from"../../hooks/use-chart-mouse-handler.js";import{useChartTheme as s}from"../../providers/theme/theme-provider.js";import{defaultTheme as l}from"../../providers/theme/themes.js";import{BaseLegend as n}from"../legend/base-legend.js";import{withResponsive as d}from"../shared/with-responsive.js";import{BaseTooltip as p}from"../tooltip/base-tooltip.js";import m from"./pie-chart.module.scss.js";const c=({data:d,withTooltips:c=!1,className:h,showLegend:u,legendOrientation:g,size:v,thickness:f=1,padding:M=20,gapScale:x=0,cornerScale:b=0})=>{const j=s(),{onMouseMove:N,onMouseLeave:w,tooltipOpen:V,tooltipData:A,tooltipLeft:k,tooltipTop:y}=i({withTooltips:c}),{isValid:L,message:R}=(e=>{if(!e.length)return{isValid:!1,message:"No data available"};if(e.some((e=>e.percentage<0||e.value<0)))return{isValid:!1,message:"Invalid data: Negative values are not allowed"};const a=e.reduce(((e,a)=>e+a.percentage),0);return Math.abs(a-100)>.01?{isValid:!1,message:"Invalid percentage total: Must equal 100"}:{isValid:!0,message:""}})(d);if(!L)return e("div",{className:r("pie-chart",m["pie-chart"],h),children:e("div",{className:m["error-message"],children:R})});const S=v,B=v,C=Math.min(S,B)/2,I=S/2,T=B/2,$=x*(2*Math.PI/d.length),z=C-M,O=z*(1-f),P=(z-O)/2,q=b?Math.min(b*z,P):0,D=d.map(((e,a)=>({...e,index:a}))),E={value:e=>e.value,fill:e=>e?.color||j.colors[e.index]},Y=d.map(((e,a)=>({label:e.label,value:e.value.toString(),color:j.colors[a%j.colors.length]})));return a("div",{className:r("pie-chart",m["pie-chart"],h),children:[e("svg",{viewBox:`0 0 ${v} ${v}`,preserveAspectRatio:"xMidYMid meet",children:e(t,{top:T,left:I,children:e(o,{data:D,pieValue:E.value,outerRadius:z,innerRadius:O,padAngle:$,cornerRadius:q,children:t=>t.arcs.map(((o,r)=>{const[i,s]=t.path.centroid(o),n=o.endAngle-o.startAngle>=.25,d=e=>N(e,o.data),p={d:t.path(o)||"",fill:E.fill(o.data)};return c&&(p.onMouseMove=d,p.onMouseLeave=w),a("g",{children:[e("path",{...p}),n&&e("text",{x:i,y:s,dy:".33em",fill:j.labelBackgroundColor||l.labelBackgroundColor,fontSize:12,textAnchor:"middle",pointerEvents:"none",children:o.data.label})]},`arc-${r}`)}))})})}),u&&e(n,{items:Y,orientation:g,className:m["pie-chart-legend"]}),c&&V&&A&&e(p,{data:A,top:y||0,left:k||0,style:{transform:"translate(-50%, -100%)"}})]})};c.displayName="PieChart";var h=d(c);export{h as default};
1
+ import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Group as t}from"@visx/group";import{Pie as o}from"@visx/shape";import r from"clsx";import"react";import i from"../../hooks/use-chart-mouse-handler.js";import{useChartTheme as s}from"../../providers/theme/theme-provider.js";import{defaultTheme as l}from"../../providers/theme/themes.js";import{BaseLegend as n}from"../legend/base-legend.js";import{withResponsive as d}from"../shared/with-responsive.js";import{BaseTooltip as p}from"../tooltip/base-tooltip.js";import m from"./pie-chart.module.scss.js";const c=({data:d,withTooltips:c=!1,className:h,showLegend:u,legendOrientation:g,size:v,thickness:f=1,padding:M=20,gapScale:x=0,cornerScale:b=0})=>{const j=s(),{onMouseMove:N,onMouseLeave:w,tooltipOpen:V,tooltipData:A,tooltipLeft:k,tooltipTop:y}=i({withTooltips:c}),{isValid:L,message:R}=(e=>{if(!e.length)return{isValid:!1,message:"No data available"};if(e.some((e=>e.percentage<0||e.value<0)))return{isValid:!1,message:"Invalid data: Negative values are not allowed"};const a=e.reduce(((e,a)=>e+a.percentage),0);return Math.abs(a-100)>.01?{isValid:!1,message:"Invalid percentage total: Must equal 100"}:{isValid:!0,message:""}})(d);if(!L)return e("div",{className:r("pie-chart",m["pie-chart"],h),children:e("div",{className:m["error-message"],children:R})});const S=v,B=v,C=Math.min(S,B)/2,I=S/2,T=B/2,$=x*(2*Math.PI/d.length),z=C-M,O=z*(1-f),P=(z-O)/2,q=b?Math.min(b*z,P):0,D=d.map(((e,a)=>({...e,index:a}))),E={value:e=>e.value,fill:e=>e?.color||j.colors[e.index]},Y=d.map(((e,a)=>({label:e.label,value:e.value.toString(),color:j.colors[a%j.colors.length]})));return a("div",{className:r("pie-chart",m["pie-chart"],h),children:[e("svg",{viewBox:`0 0 ${v} ${v}`,preserveAspectRatio:"xMidYMid meet",width:v,height:v,children:e(t,{top:T,left:I,children:e(o,{data:D,pieValue:E.value,outerRadius:z,innerRadius:O,padAngle:$,cornerRadius:q,children:t=>t.arcs.map(((o,r)=>{const[i,s]=t.path.centroid(o),n=o.endAngle-o.startAngle>=.25,d=e=>N(e,o.data),p={d:t.path(o)||"",fill:E.fill(o.data)};return c&&(p.onMouseMove=d,p.onMouseLeave=w),a("g",{children:[e("path",{...p}),n&&e("text",{x:i,y:s,dy:".33em",fill:j.labelBackgroundColor||l.labelBackgroundColor,fontSize:12,textAnchor:"middle",pointerEvents:"none",children:o.data.label})]},`arc-${r}`)}))})})}),u&&e(n,{items:Y,orientation:g,className:m["pie-chart-legend"]}),c&&V&&A&&e(p,{data:A,top:y||0,left:k||0,style:{transform:"translate(-50%, -100%)"}})]})};c.displayName="PieChart";var h=d(c);export{h as default};
2
2
  //# sourceMappingURL=pie-chart.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"pie-chart.js","sources":["../../../../src/components/pie-chart/pie-chart.tsx"],"sourcesContent":[null],"names":["PieChart","data","withTooltips","className","showLegend","legendOrientation","size","thickness","padding","gapScale","cornerScale","providerTheme","useChartTheme","onMouseMove","onMouseLeave","tooltipOpen","tooltipData","tooltipLeft","tooltipTop","useChartMouseHandler","isValid","message","length","some","item","percentage","value","totalPercentage","reduce","sum","Math","abs","validateData","_jsx","clsx","styles","children","width","height","radius","min","centerX","centerY","padAngle","PI","outerRadius","innerRadius","maxCornerRadius","cornerRadius","dataWithIndex","map","d","index","accessors","fill","color","colors","legendItems","label","toString","_jsxs","viewBox","preserveAspectRatio","Group","top","left","Pie","pieValue","pie","arcs","arc","centroidX","centroidY","path","centroid","hasSpaceForLabel","endAngle","startAngle","handleMouseMove","event","pathProps","x","y","dy","labelBackgroundColor","defaultTheme","fontSize","textAnchor","pointerEvents","Legend","items","orientation","BaseTooltip","style","transform","displayName","pieChart","withResponsive"],"mappings":"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"}
1
+ {"version":3,"file":"pie-chart.js","sources":["../../../../src/components/pie-chart/pie-chart.tsx"],"sourcesContent":[null],"names":["PieChart","data","withTooltips","className","showLegend","legendOrientation","size","thickness","padding","gapScale","cornerScale","providerTheme","useChartTheme","onMouseMove","onMouseLeave","tooltipOpen","tooltipData","tooltipLeft","tooltipTop","useChartMouseHandler","isValid","message","length","some","item","percentage","value","totalPercentage","reduce","sum","Math","abs","validateData","_jsx","clsx","styles","children","width","height","radius","min","centerX","centerY","padAngle","PI","outerRadius","innerRadius","maxCornerRadius","cornerRadius","dataWithIndex","map","d","index","accessors","fill","color","colors","legendItems","label","toString","_jsxs","viewBox","preserveAspectRatio","Group","top","left","Pie","pieValue","pie","arcs","arc","centroidX","centroidY","path","centroid","hasSpaceForLabel","endAngle","startAngle","handleMouseMove","event","pathProps","x","y","dy","labelBackgroundColor","defaultTheme","fontSize","textAnchor","pointerEvents","Legend","items","orientation","BaseTooltip","style","transform","displayName","pieChart","withResponsive"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{jsxs as e,jsx as t}from"react/jsx-runtime";import{localPoint as o}from"@visx/event";import{Group as i}from"@visx/group";import{Pie as l}from"@visx/shape";import{Text as a}from"@visx/text";import{useTooltip as r}from"@visx/tooltip";import s from"clsx";import{useCallback as p}from"react";import{useChartTheme as c}from"../../providers/theme/theme-provider.js";import{BaseLegend as m}from"../legend/base-legend.js";import{withResponsive as n}from"../shared/with-responsive.js";import{BaseTooltip as d}from"../tooltip/base-tooltip.js";import h from"./pie-semi-circle-chart.module.scss.js";const v=({data:n,size:v=500,label:u,note:f,className:x,withTooltips:g=!1,clockwise:b=!0,thickness:y=.4,showLegend:A,legendOrientation:M})=>{const j=c(),{tooltipOpen:w,tooltipLeft:N,tooltipTop:D,tooltipData:P,hideTooltip:T,showTooltip:I}=r(),L=v/2,R=v/2,S=v/2,k=S*(1-y+.03),C=n.map(((e,t)=>({...e,index:t}))),O=b?-Math.PI/2:Math.PI/2,$=b?Math.PI/2:-Math.PI/2,z={value:e=>e.value,sort:(e,t)=>t.value-e.value,fill:e=>e.color||j.colors[e.index%j.colors.length]},B=p(((e,t)=>{const i=o(e);i&&I({tooltipData:t.data,tooltipLeft:i.x,tooltipTop:i.y-10})}),[I]),V=p((()=>{T()}),[T]),q=p((e=>t=>{B(t,e)}),[B]),E=n.map(((e,t)=>({label:e.label,value:e.valueDisplay||e.value.toString(),color:z.fill({...e,index:t})})));return e("div",{className:s("pie-semi-circle-chart",h["pie-semi-circle-chart"],x),children:[t("svg",{viewBox:`0 0 ${v} ${R}`,children:e(i,{top:L,left:L,children:[t(l,{data:C,pieValue:z.value,outerRadius:S,innerRadius:k,cornerRadius:3,padAngle:.03,startAngle:O,endAngle:$,pieSort:z.sort,children:e=>e.arcs.map((o=>t("g",{onMouseMove:q(o),onMouseLeave:V,children:t("path",{d:e.path(o)||"",fill:z.fill(o.data)})},o.data.label)))}),e(i,{children:[t(a,{textAnchor:"middle",verticalAnchor:"start",y:-40,className:h.label,children:u}),t(a,{textAnchor:"middle",verticalAnchor:"start",y:-20,className:h.note,children:f})]})]})}),g&&w&&P&&t(d,{data:{label:P.label,value:P.value,valueDisplay:P.valueDisplay},top:D||0,left:N||0}),A&&t(m,{items:E,orientation:M,className:h["pie-semi-circle-chart-legend"]})]})};v.displayName="PieSemiCircleChart";var u=n(v);export{u as default};
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import{localPoint as o}from"@visx/event";import{Group as i}from"@visx/group";import{Pie as l}from"@visx/shape";import{Text as a}from"@visx/text";import{useTooltip as r}from"@visx/tooltip";import s from"clsx";import{useCallback as p}from"react";import{useChartTheme as c}from"../../providers/theme/theme-provider.js";import{BaseLegend as m}from"../legend/base-legend.js";import{withResponsive as n}from"../shared/with-responsive.js";import{BaseTooltip as d}from"../tooltip/base-tooltip.js";import h from"./pie-semi-circle-chart.module.scss.js";const v=({data:n,width:v,label:u,note:f,className:x,withTooltips:g=!1,clockwise:b=!0,thickness:w=.4,showLegend:y,legendOrientation:A})=>{const M=c(),{tooltipOpen:j,tooltipLeft:N,tooltipTop:D,tooltipData:P,hideTooltip:T,showTooltip:I}=r(),L=v/2,R=v/2,S=v/2,k=S*(1-w+.03),C=n.map(((e,t)=>({...e,index:t}))),O=b?-Math.PI/2:Math.PI/2,$=b?Math.PI/2:-Math.PI/2,B={value:e=>e.value,sort:(e,t)=>t.value-e.value,fill:e=>e.color||M.colors[e.index%M.colors.length]},V=p(((e,t)=>{const i=o(e);i&&I({tooltipData:t.data,tooltipLeft:i.x,tooltipTop:i.y-10})}),[I]),q=p((()=>{T()}),[T]),z=p((e=>t=>{V(t,e)}),[V]),E=n.map(((e,t)=>({label:e.label,value:e.valueDisplay||e.value.toString(),color:B.fill({...e,index:t})})));return e("div",{className:s("pie-semi-circle-chart",h["pie-semi-circle-chart"],x),children:[t("svg",{viewBox:`0 0 ${v} ${R}`,width:v,height:R,children:e(i,{top:L,left:L,children:[t(l,{data:C,pieValue:B.value,outerRadius:S,innerRadius:k,cornerRadius:3,padAngle:.03,startAngle:O,endAngle:$,pieSort:B.sort,children:e=>e.arcs.map((o=>t("g",{onMouseMove:z(o),onMouseLeave:q,children:t("path",{d:e.path(o)||"",fill:B.fill(o.data)})},o.data.label)))}),e(i,{children:[t(a,{textAnchor:"middle",verticalAnchor:"start",y:-40,className:h.label,children:u}),t(a,{textAnchor:"middle",verticalAnchor:"start",y:-20,className:h.note,children:f})]})]})}),g&&j&&P&&t(d,{data:{label:P.label,value:P.value,valueDisplay:P.valueDisplay},top:D||0,left:N||0}),y&&t(m,{items:E,orientation:A,className:h["pie-semi-circle-chart-legend"]})]})};v.displayName="PieSemiCircleChart";var u=n(v);export{u as default};
2
2
  //# sourceMappingURL=pie-semi-circle-chart.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"pie-semi-circle-chart.js","sources":["../../../../src/components/pie-semi-circle-chart/pie-semi-circle-chart.tsx"],"sourcesContent":[null],"names":["PieSemiCircleChart","data","size","label","note","className","withTooltips","clockwise","thickness","showLegend","legendOrientation","providerTheme","useChartTheme","tooltipOpen","tooltipLeft","tooltipTop","tooltipData","hideTooltip","showTooltip","useTooltip","centerX","height","radius","innerRadius","dataWithIndex","map","d","index","startAngle","Math","PI","endAngle","accessors","value","sort","a","b","fill","color","colors","length","handleMouseMove","useCallback","event","arc","coords","localPoint","x","y","handleMouseLeave","handleArcMouseMove","legendItems","item","valueDisplay","toString","_jsxs","clsx","styles","children","_jsx","viewBox","Group","top","left","Pie","pieValue","outerRadius","cornerRadius","padAngle","pieSort","pie","arcs","onMouseMove","onMouseLeave","path","Text","textAnchor","verticalAnchor","BaseTooltip","Legend","items","orientation","displayName","pieSemiCircleChart","withResponsive"],"mappings":"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"}
1
+ {"version":3,"file":"pie-semi-circle-chart.js","sources":["../../../../src/components/pie-semi-circle-chart/pie-semi-circle-chart.tsx"],"sourcesContent":[null],"names":["PieSemiCircleChart","data","width","label","note","className","withTooltips","clockwise","thickness","showLegend","legendOrientation","providerTheme","useChartTheme","tooltipOpen","tooltipLeft","tooltipTop","tooltipData","hideTooltip","showTooltip","useTooltip","centerX","height","radius","innerRadius","dataWithIndex","map","d","index","startAngle","Math","PI","endAngle","accessors","value","sort","a","b","fill","color","colors","length","handleMouseMove","useCallback","event","arc","coords","localPoint","x","y","handleMouseLeave","handleArcMouseMove","legendItems","item","valueDisplay","toString","_jsxs","clsx","styles","_jsx","viewBox","Group","top","left","children","Pie","pieValue","outerRadius","cornerRadius","padAngle","pieSort","pie","arcs","onMouseMove","onMouseLeave","path","Text","textAnchor","verticalAnchor","BaseTooltip","Legend","items","orientation","displayName","pieSemiCircleChart","withResponsive"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@automattic/charts",
3
- "version": "0.5.0",
3
+ "version": "0.6.0",
4
4
  "description": "Display charts within Automattic products.",
5
5
  "homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/charts/#readme",
6
6
  "bugs": {
@@ -151,7 +151,12 @@ const PieChart = ( {
151
151
 
152
152
  return (
153
153
  <div className={ clsx( 'pie-chart', styles[ 'pie-chart' ], className ) }>
154
- <svg viewBox={ `0 0 ${ size } ${ size }` } preserveAspectRatio="xMidYMid meet">
154
+ <svg
155
+ viewBox={ `0 0 ${ size } ${ size }` }
156
+ preserveAspectRatio="xMidYMid meet"
157
+ width={ size }
158
+ height={ size }
159
+ >
155
160
  <Group top={ centerY } left={ centerX }>
156
161
  <Pie< DataPointPercentage & { index: number } >
157
162
  data={ dataWithIndex }
@@ -15,9 +15,9 @@ import type { PieArcDatum } from '@visx/shape/lib/shapes/Pie';
15
15
 
16
16
  interface PieSemiCircleChartProps extends BaseChartProps< DataPointPercentage[] > {
17
17
  /**
18
- * Size of the chart in pixels
18
+ * Width of the chart in pixels; height would be half of this value calculated automatically.
19
19
  */
20
- size?: number;
20
+ width?: number;
21
21
 
22
22
  /**
23
23
  * Thickness of the pie chart. A value between 0 and 1
@@ -43,7 +43,7 @@ type ArcData = PieArcDatum< DataPointPercentage >;
43
43
 
44
44
  const PieSemiCircleChart: FC< PieSemiCircleChartProps > = ( {
45
45
  data,
46
- size = 500,
46
+ width,
47
47
  label,
48
48
  note,
49
49
  className,
@@ -57,9 +57,9 @@ const PieSemiCircleChart: FC< PieSemiCircleChartProps > = ( {
57
57
  const { tooltipOpen, tooltipLeft, tooltipTop, tooltipData, hideTooltip, showTooltip } =
58
58
  useTooltip< DataPointPercentage >();
59
59
 
60
- const centerX = size / 2;
61
- const height = size / 2;
62
- const radius = size / 2;
60
+ const centerX = width / 2;
61
+ const height = width / 2;
62
+ const radius = width / 2;
63
63
  const pad = 0.03;
64
64
  const innerRadius = radius * ( 1 - thickness + pad );
65
65
 
@@ -120,7 +120,7 @@ const PieSemiCircleChart: FC< PieSemiCircleChartProps > = ( {
120
120
  <div
121
121
  className={ clsx( 'pie-semi-circle-chart', styles[ 'pie-semi-circle-chart' ], className ) }
122
122
  >
123
- <svg viewBox={ `0 0 ${ size } ${ height }` }>
123
+ <svg viewBox={ `0 0 ${ width } ${ height }` } width={ width } height={ height }>
124
124
  { /* Main chart group that contains both the pie and text elements */ }
125
125
  <Group top={ centerX } left={ centerX }>
126
126
  { /* Pie chart */ }