@automattic/charts 0.8.3 → 0.8.4

package/CHANGELOG.md

@@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.8.4] - 2025-02-27
+### Fixed
+- Line chart: no need for min x tick num [#42087]
+
 ## [0.8.3] - 2025-02-25
 ### Changed
 - Set options as optional for series [#42047]
@@ -124,6 +128,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fixed lints following ESLint rule changes for TS [#40584]
 - Fixing a bug in Chart storybook data. [#40640]
 
+[0.8.4]: https://github.com/Automattic/charts/compare/v0.8.3...v0.8.4
 [0.8.3]: https://github.com/Automattic/charts/compare/v0.8.2...v0.8.3
 [0.8.2]: https://github.com/Automattic/charts/compare/v0.8.1...v0.8.2
 [0.8.1]: https://github.com/Automattic/charts/compare/v0.8.0...v0.8.1

package/dist/cjs/components/line-chart/line-chart.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("@visx/curve"),a=require("@visx/gradient"),i=require("@visx/xychart");require("@visx/xychart/lib/components/Tooltip");var r=require("clsx"),o=require("react"),s=require("../../providers/theme/theme-provider.js"),l=require("../legend/base-legend.js"),n=require("../shared/with-responsive.js"),c=require("./line-chart.module.scss.js");const d=({tooltipData:t})=>{const a=t?.nearestDatum?.datum;if(!a)return null;const i=Object.entries(t?.datumByKey||{}).map((([e,{datum:t}])=>({key:e,value:t.value}))).sort(((e,t)=>t.value-e.value));return e.jsxs("div",{className:c["line-chart__tooltip"],children:[e.jsx("div",{className:c["line-chart__tooltip-date"],children:a.date?.toLocaleDateString()}),i.map((t=>e.jsxs("div",{className:c["line-chart__tooltip-row"],children:[e.jsxs("span",{className:c["line-chart__tooltip-label"],children:[t.key,":"]}),e.jsx("span",{className:c["line-chart__tooltip-value"],children:t.value})]},t.key)))]})},m=e=>new Date(e).toLocaleDateString(void 0,{month:"short",day:"numeric"});var u=n.withResponsive((({data:n,width:u,height:h,className:p,margin:x,withTooltips:v=!0,showLegend:g=!1,legendOrientation:j="horizontal",withGradientFill:y=!1,smoothing:T=!0,renderTooltip:b=d,options:N={}})=>{const q=s.useChartTheme(),f=o.useId(),k=o.useMemo((()=>n.map((e=>({...e,data:e.data.sort(((e,t)=>e.date.getTime()-t.date.getTime()))})))),[n]),w=o.useMemo((()=>{const e=k?.map((e=>e.options?.stroke??"")).filter(Boolean)??[];return i.buildChartTheme({...q,colors:[...e,...q.colors]})}),[q,k]);x=o.useMemo((()=>{let e={};return"right"===N.axis?.y?.orientation&&(e={...e,right:40,left:0}),"top"===N.axis?.x?.orientation&&(e={...e,top:20,bottom:10}),{...e,...x}}),[x,N]);const _=o.useMemo((()=>Math.max(Math.floor(Math.min(k[0]?.data.length,u/60)),5)),[k,u]),A=(e=>e?.length?e.some((e=>e.data.some((e=>isNaN(e.value)||null===e.value||void 0===e.value||isNaN(e.date.getTime())))))?"Invalid data":null:"No data available")(k);if(A)return e.jsx("div",{className:r("line-chart",c["line-chart"]),children:A});const S=k.map(((e,t)=>({label:e.label,value:"",color:q.colors[t%q.colors.length]}))),D={xAccessor:e=>e?.date,yAccessor:e=>e?.value};return e.jsxs("div",{className:r("line-chart",c["line-chart"],p),"data-testid":"line-chart",role:"img","aria-label":"line chart",children:[e.jsxs(i.XYChart,{theme:w,width:u,height:h,margin:{top:10,right:0,bottom:20,left:40,...x},xScale:{type:"time",...N?.xScale},yScale:{type:"linear",nice:!0,zero:!1,...N?.yScale},children:[e.jsx(i.AnimatedGrid,{columns:!1,numTicks:4}),e.jsx(i.AnimatedAxis,{orientation:"bottom",numTicks:_,tickFormat:m,...N?.axis?.x}),e.jsx(i.AnimatedAxis,{orientation:"left",numTicks:4,...N?.axis?.y}),k.map(((r,o)=>{const s=r.options?.stroke??w.colors[o%w.colors.length];return e.jsxs("g",{children:[y&&e.jsx(a.LinearGradient,{id:`area-gradient-${f}-${o+1}`,from:s,fromOpacity:.4,toOpacity:.1,to:w.backgroundColor,...r.options?.gradient,"data-testid":"line-gradient"}),e.jsx(i.AnimatedAreaSeries,{dataKey:r?.label,data:r.data,...D,fill:y?`url(#area-gradient-${f}-${o+1})`:void 0,renderLine:!0,curve:T?t.curveCatmullRom:t.curveLinear},r?.label)]},r?.label||o)})),v&&e.jsx(i.Tooltip,{snapTooltipToDatumX:!0,snapTooltipToDatumY:!0,showSeriesGlyphs:!0,renderTooltip:b})]}),g&&e.jsx(l.BaseLegend,{items:S,orientation:j,className:c["line-chart-legend"]})]})}));module.exports=u;
+"use strict";var e=require("react/jsx-runtime"),t=require("@visx/curve"),a=require("@visx/gradient"),i=require("@visx/xychart");require("@visx/xychart/lib/components/Tooltip");var r=require("clsx"),o=require("react"),s=require("../../providers/theme/theme-provider.js"),l=require("../legend/base-legend.js"),n=require("../shared/with-responsive.js"),c=require("./line-chart.module.scss.js");const d=({tooltipData:t})=>{const a=t?.nearestDatum?.datum;if(!a)return null;const i=Object.entries(t?.datumByKey||{}).map((([e,{datum:t}])=>({key:e,value:t.value}))).sort(((e,t)=>t.value-e.value));return e.jsxs("div",{className:c["line-chart__tooltip"],children:[e.jsx("div",{className:c["line-chart__tooltip-date"],children:a.date?.toLocaleDateString()}),i.map((t=>e.jsxs("div",{className:c["line-chart__tooltip-row"],children:[e.jsxs("span",{className:c["line-chart__tooltip-label"],children:[t.key,":"]}),e.jsx("span",{className:c["line-chart__tooltip-value"],children:t.value})]},t.key)))]})},m=e=>new Date(e).toLocaleDateString(void 0,{month:"short",day:"numeric"});var u=n.withResponsive((({data:n,width:u,height:h,className:p,margin:v,withTooltips:x=!0,showLegend:g=!1,legendOrientation:j="horizontal",withGradientFill:y=!1,smoothing:T=!0,renderTooltip:b=d,options:N={}})=>{const q=s.useChartTheme(),k=o.useId(),w=o.useMemo((()=>n.map((e=>({...e,data:e.data.sort(((e,t)=>e.date.getTime()-t.date.getTime()))})))),[n]),_=o.useMemo((()=>{const e=w?.map((e=>e.options?.stroke??"")).filter(Boolean)??[];return i.buildChartTheme({...q,colors:[...e,...q.colors]})}),[q,w]);v=o.useMemo((()=>{let e={};return"right"===N.axis?.y?.orientation&&(e={...e,right:40,left:0}),"top"===N.axis?.x?.orientation&&(e={...e,top:20,bottom:10}),{...e,...v}}),[v,N]);const f=o.useMemo((()=>Math.min(w[0]?.data.length,Math.ceil(u/100))),[w,u]),A=(e=>e?.length?e.some((e=>e.data.some((e=>isNaN(e.value)||null===e.value||void 0===e.value||isNaN(e.date.getTime())))))?"Invalid data":null:"No data available")(w);if(A)return e.jsx("div",{className:r("line-chart",c["line-chart"]),children:A});const S=w.map(((e,t)=>({label:e.label,value:"",color:q.colors[t%q.colors.length]}))),D={xAccessor:e=>e?.date,yAccessor:e=>e?.value};return e.jsxs("div",{className:r("line-chart",c["line-chart"],p),"data-testid":"line-chart",role:"img","aria-label":"line chart",children:[e.jsxs(i.XYChart,{theme:_,width:u,height:h,margin:{top:10,right:0,bottom:20,left:40,...v},xScale:{type:"time",...N?.xScale},yScale:{type:"linear",nice:!0,zero:!1,...N?.yScale},children:[e.jsx(i.AnimatedGrid,{columns:!1,numTicks:4}),e.jsx(i.AnimatedAxis,{orientation:"bottom",numTicks:f,tickFormat:m,...N?.axis?.x}),e.jsx(i.AnimatedAxis,{orientation:"left",numTicks:4,...N?.axis?.y}),w.map(((r,o)=>{const s=r.options?.stroke??_.colors[o%_.colors.length];return e.jsxs("g",{children:[y&&e.jsx(a.LinearGradient,{id:`area-gradient-${k}-${o+1}`,from:s,fromOpacity:.4,toOpacity:.1,to:_.backgroundColor,...r.options?.gradient,"data-testid":"line-gradient"}),e.jsx(i.AnimatedAreaSeries,{dataKey:r?.label,data:r.data,...D,fill:y?`url(#area-gradient-${k}-${o+1})`:void 0,renderLine:!0,curve:T?t.curveCatmullRom:t.curveLinear},r?.label)]},r?.label||o)})),x&&e.jsx(i.Tooltip,{snapTooltipToDatumX:!0,snapTooltipToDatumY:!0,showSeriesGlyphs:!0,renderTooltip:b})]}),g&&e.jsx(l.BaseLegend,{items:S,orientation:j,className:c["line-chart-legend"]})]})}));module.exports=u;
 //# sourceMappingURL=line-chart.js.map

package/dist/cjs/components/line-chart/line-chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"line-chart.js","sources":["/@automattic/charts/../../../../src/components/line-chart/line-chart.tsx"],"sourcesContent":[null],"names":["renderDefaultTooltip","tooltipData","nearestDatum","datum","tooltipPoints","Object","entries","datumByKey","map","key","value","sort","a","b","_jsxs","jsxs","className","styles","children","_jsx","date","toLocaleDateString","point","formatDateTick","Date","undefined","month","day","withResponsive","data","width","height","margin","withTooltips","showLegend","legendOrientation","withGradientFill","smoothing","renderTooltip","options","providerTheme","useChartTheme","chartId","useId","dataSorted","useMemo","series","getTime","theme","seriesColors","stroke","filter","Boolean","buildChartTheme","colors","defaultMargin","axis","y","orientation","right","left","x","top","bottom","xNumTicks","Math","max","floor","min","length","error","some","isNaN","validateData","clsx","legendItems","group","index","label","color","accessors","xAccessor","d","yAccessor","role","XYChart","xScale","type","yScale","nice","zero","jsx","AnimatedGrid","columns","numTicks","AnimatedAxis","tickFormat","seriesData","LinearGradient","id","from","fromOpacity","toOpacity","to","backgroundColor","gradient","AnimatedAreaSeries","dataKey","fill","renderLine","curve","curveCatmullRom","curveLinear","Tooltip","snapTooltipToDatumX","snapTooltipToDatumY","showSeriesGlyphs","Legend","items"],"mappings":"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"}
+{"version":3,"file":"line-chart.js","sources":["/@automattic/charts/../../../../src/components/line-chart/line-chart.tsx"],"sourcesContent":[null],"names":["renderDefaultTooltip","tooltipData","nearestDatum","datum","tooltipPoints","Object","entries","datumByKey","map","key","value","sort","a","b","_jsxs","jsxs","className","styles","children","_jsx","date","toLocaleDateString","point","formatDateTick","timestamp","Date","undefined","month","day","withResponsive","data","width","height","margin","withTooltips","showLegend","legendOrientation","withGradientFill","smoothing","renderTooltip","options","providerTheme","useChartTheme","chartId","useId","dataSorted","useMemo","series","getTime","theme","seriesColors","stroke","filter","Boolean","buildChartTheme","colors","defaultMargin","axis","y","orientation","right","left","x","top","bottom","xNumTicks","Math","min","length","ceil","error","some","isNaN","validateData","clsx","legendItems","group","index","label","color","accessors","xAccessor","d","yAccessor","role","XYChart","xScale","type","yScale","nice","zero","AnimatedGrid","columns","numTicks","jsx","AnimatedAxis","tickFormat","seriesData","LinearGradient","id","from","fromOpacity","toOpacity","to","backgroundColor","gradient","AnimatedAreaSeries","dataKey","fill","renderLine","curve","curveCatmullRom","curveLinear","Tooltip","snapTooltipToDatumX","snapTooltipToDatumY","showSeriesGlyphs","Legend","items"],"mappings":"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"}

package/dist/mjs/components/line-chart/line-chart.js

@@ -1,2 +1,2 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{curveCatmullRom as a,curveLinear as o}from"@visx/curve";import{LinearGradient as i}from"@visx/gradient";import{buildChartTheme as r,XYChart as l,AnimatedGrid as n,AnimatedAxis as s,AnimatedAreaSeries as c,Tooltip as m}from"@visx/xychart";import"@visx/xychart/lib/components/Tooltip";import d from"clsx";import{useId as h,useMemo as p}from"react";import{useChartTheme as u}from"../../providers/theme/theme-provider.js";import{BaseLegend as v}from"../legend/base-legend.js";import{withResponsive as g}from"../shared/with-responsive.js";import f from"./line-chart.module.scss.js";const x=({tooltipData:a})=>{const o=a?.nearestDatum?.datum;if(!o)return null;const i=Object.entries(a?.datumByKey||{}).map((([t,{datum:e}])=>({key:t,value:e.value}))).sort(((t,e)=>e.value-t.value));return e("div",{className:f["line-chart__tooltip"],children:[t("div",{className:f["line-chart__tooltip-date"],children:o.date?.toLocaleDateString()}),i.map((a=>e("div",{className:f["line-chart__tooltip-row"],children:[e("span",{className:f["line-chart__tooltip-label"],children:[a.key,":"]}),t("span",{className:f["line-chart__tooltip-value"],children:a.value})]},a.key)))]})},y=t=>new Date(t).toLocaleDateString(void 0,{month:"short",day:"numeric"});var b=g((({data:g,width:b,height:N,className:T,margin:k,withTooltips:_=!0,showLegend:w=!1,legendOrientation:D="horizontal",withGradientFill:S=!1,smoothing:j=!0,renderTooltip:L=x,options:O={}})=>{const $=u(),M=h(),z=p((()=>g.map((t=>({...t,data:t.data.sort(((t,e)=>t.date.getTime()-e.date.getTime()))})))),[g]),A=p((()=>{const t=z?.map((t=>t.options?.stroke??"")).filter(Boolean)??[];return r({...$,colors:[...t,...$.colors]})}),[$,z]);k=p((()=>{let t={};return"right"===O.axis?.y?.orientation&&(t={...t,right:40,left:0}),"top"===O.axis?.x?.orientation&&(t={...t,top:20,bottom:10}),{...t,...k}}),[k,O]);const B=p((()=>Math.max(Math.floor(Math.min(z[0]?.data.length,b/60)),5)),[z,b]),F=(t=>t?.length?t.some((t=>t.data.some((t=>isNaN(t.value)||null===t.value||void 0===t.value||isNaN(t.date.getTime())))))?"Invalid data":null:"No data available")(z);if(F)return t("div",{className:d("line-chart",f["line-chart"]),children:F});const G=z.map(((t,e)=>({label:t.label,value:"",color:$.colors[e%$.colors.length]}))),K={xAccessor:t=>t?.date,yAccessor:t=>t?.value};return e("div",{className:d("line-chart",f["line-chart"],T),"data-testid":"line-chart",role:"img","aria-label":"line chart",children:[e(l,{theme:A,width:b,height:N,margin:{top:10,right:0,bottom:20,left:40,...k},xScale:{type:"time",...O?.xScale},yScale:{type:"linear",nice:!0,zero:!1,...O?.yScale},children:[t(n,{columns:!1,numTicks:4}),t(s,{orientation:"bottom",numTicks:B,tickFormat:y,...O?.axis?.x}),t(s,{orientation:"left",numTicks:4,...O?.axis?.y}),z.map(((r,l)=>{const n=r.options?.stroke??A.colors[l%A.colors.length];return e("g",{children:[S&&t(i,{id:`area-gradient-${M}-${l+1}`,from:n,fromOpacity:.4,toOpacity:.1,to:A.backgroundColor,...r.options?.gradient,"data-testid":"line-gradient"}),t(c,{dataKey:r?.label,data:r.data,...K,fill:S?`url(#area-gradient-${M}-${l+1})`:void 0,renderLine:!0,curve:j?a:o},r?.label)]},r?.label||l)})),_&&t(m,{snapTooltipToDatumX:!0,snapTooltipToDatumY:!0,showSeriesGlyphs:!0,renderTooltip:L})]}),w&&t(v,{items:G,orientation:D,className:f["line-chart-legend"]})]})}));export{b as default};
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{curveCatmullRom as a,curveLinear as o}from"@visx/curve";import{LinearGradient as i}from"@visx/gradient";import{buildChartTheme as r,XYChart as l,AnimatedGrid as n,AnimatedAxis as s,AnimatedAreaSeries as c,Tooltip as m}from"@visx/xychart";import"@visx/xychart/lib/components/Tooltip";import d from"clsx";import{useId as h,useMemo as p}from"react";import{useChartTheme as u}from"../../providers/theme/theme-provider.js";import{BaseLegend as v}from"../legend/base-legend.js";import{withResponsive as g}from"../shared/with-responsive.js";import f from"./line-chart.module.scss.js";const y=({tooltipData:a})=>{const o=a?.nearestDatum?.datum;if(!o)return null;const i=Object.entries(a?.datumByKey||{}).map((([t,{datum:e}])=>({key:t,value:e.value}))).sort(((t,e)=>e.value-t.value));return e("div",{className:f["line-chart__tooltip"],children:[t("div",{className:f["line-chart__tooltip-date"],children:o.date?.toLocaleDateString()}),i.map((a=>e("div",{className:f["line-chart__tooltip-row"],children:[e("span",{className:f["line-chart__tooltip-label"],children:[a.key,":"]}),t("span",{className:f["line-chart__tooltip-value"],children:a.value})]},a.key)))]})},x=t=>new Date(t).toLocaleDateString(void 0,{month:"short",day:"numeric"});var b=g((({data:g,width:b,height:N,className:T,margin:k,withTooltips:_=!0,showLegend:w=!1,legendOrientation:D="horizontal",withGradientFill:S=!1,smoothing:j=!0,renderTooltip:L=y,options:O={}})=>{const $=u(),z=h(),A=p((()=>g.map((t=>({...t,data:t.data.sort(((t,e)=>t.date.getTime()-e.date.getTime()))})))),[g]),B=p((()=>{const t=A?.map((t=>t.options?.stroke??"")).filter(Boolean)??[];return r({...$,colors:[...t,...$.colors]})}),[$,A]);k=p((()=>{let t={};return"right"===O.axis?.y?.orientation&&(t={...t,right:40,left:0}),"top"===O.axis?.x?.orientation&&(t={...t,top:20,bottom:10}),{...t,...k}}),[k,O]);const F=p((()=>Math.min(A[0]?.data.length,Math.ceil(b/100))),[A,b]),G=(t=>t?.length?t.some((t=>t.data.some((t=>isNaN(t.value)||null===t.value||void 0===t.value||isNaN(t.date.getTime())))))?"Invalid data":null:"No data available")(A);if(G)return t("div",{className:d("line-chart",f["line-chart"]),children:G});const K=A.map(((t,e)=>({label:t.label,value:"",color:$.colors[e%$.colors.length]}))),M={xAccessor:t=>t?.date,yAccessor:t=>t?.value};return e("div",{className:d("line-chart",f["line-chart"],T),"data-testid":"line-chart",role:"img","aria-label":"line chart",children:[e(l,{theme:B,width:b,height:N,margin:{top:10,right:0,bottom:20,left:40,...k},xScale:{type:"time",...O?.xScale},yScale:{type:"linear",nice:!0,zero:!1,...O?.yScale},children:[t(n,{columns:!1,numTicks:4}),t(s,{orientation:"bottom",numTicks:F,tickFormat:x,...O?.axis?.x}),t(s,{orientation:"left",numTicks:4,...O?.axis?.y}),A.map(((r,l)=>{const n=r.options?.stroke??B.colors[l%B.colors.length];return e("g",{children:[S&&t(i,{id:`area-gradient-${z}-${l+1}`,from:n,fromOpacity:.4,toOpacity:.1,to:B.backgroundColor,...r.options?.gradient,"data-testid":"line-gradient"}),t(c,{dataKey:r?.label,data:r.data,...M,fill:S?`url(#area-gradient-${z}-${l+1})`:void 0,renderLine:!0,curve:j?a:o},r?.label)]},r?.label||l)})),_&&t(m,{snapTooltipToDatumX:!0,snapTooltipToDatumY:!0,showSeriesGlyphs:!0,renderTooltip:L})]}),w&&t(v,{items:K,orientation:D,className:f["line-chart-legend"]})]})}));export{b as default};
 //# sourceMappingURL=line-chart.js.map

package/dist/mjs/components/line-chart/line-chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"line-chart.js","sources":["../../../../src/components/line-chart/line-chart.tsx"],"sourcesContent":[null],"names":["renderDefaultTooltip","tooltipData","nearestDatum","datum","tooltipPoints","Object","entries","datumByKey","map","key","value","sort","a","b","_jsxs","className","styles","children","_jsx","date","toLocaleDateString","point","formatDateTick","Date","undefined","month","day","lineChart","withResponsive","data","width","height","margin","withTooltips","showLegend","legendOrientation","withGradientFill","smoothing","renderTooltip","options","providerTheme","useChartTheme","chartId","useId","dataSorted","useMemo","series","getTime","theme","seriesColors","stroke","filter","Boolean","buildChartTheme","colors","defaultMargin","axis","y","orientation","right","left","x","top","bottom","xNumTicks","Math","max","floor","min","length","error","some","isNaN","validateData","clsx","legendItems","group","index","label","color","accessors","xAccessor","d","yAccessor","role","XYChart","xScale","type","yScale","nice","zero","AnimatedGrid","columns","numTicks","AnimatedAxis","tickFormat","seriesData","LinearGradient","id","from","fromOpacity","toOpacity","to","backgroundColor","gradient","AnimatedAreaSeries","dataKey","fill","renderLine","curve","curveCatmullRom","curveLinear","Tooltip","snapTooltipToDatumX","snapTooltipToDatumY","showSeriesGlyphs","Legend","items"],"mappings":"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"}
+{"version":3,"file":"line-chart.js","sources":["../../../../src/components/line-chart/line-chart.tsx"],"sourcesContent":[null],"names":["renderDefaultTooltip","tooltipData","nearestDatum","datum","tooltipPoints","Object","entries","datumByKey","map","key","value","sort","a","b","_jsxs","className","styles","children","_jsx","date","toLocaleDateString","point","formatDateTick","timestamp","Date","undefined","month","day","lineChart","withResponsive","data","width","height","margin","withTooltips","showLegend","legendOrientation","withGradientFill","smoothing","renderTooltip","options","providerTheme","useChartTheme","chartId","useId","dataSorted","useMemo","series","getTime","theme","seriesColors","stroke","filter","Boolean","buildChartTheme","colors","defaultMargin","axis","y","orientation","right","left","x","top","bottom","xNumTicks","Math","min","length","ceil","error","some","isNaN","validateData","clsx","legendItems","group","index","label","color","accessors","xAccessor","d","yAccessor","role","XYChart","xScale","type","yScale","nice","zero","AnimatedGrid","columns","numTicks","AnimatedAxis","tickFormat","seriesData","LinearGradient","id","from","fromOpacity","toOpacity","to","backgroundColor","gradient","AnimatedAreaSeries","dataKey","fill","renderLine","curve","curveCatmullRom","curveLinear","Tooltip","snapTooltipToDatumX","snapTooltipToDatumY","showSeriesGlyphs","Legend","items"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/charts",
-	"version": "0.8.3",
+	"version": "0.8.4",
 	"description": "Display charts within Automattic products.",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/charts/#readme",
 	"bugs": {

package/src/components/line-chart/line-chart.tsx

@@ -17,7 +17,7 @@ import { withResponsive } from '../shared/with-responsive';
 import styles from './line-chart.module.scss';
 import type { BaseChartProps, DataPointDate, SeriesData } from '../../types';
 
-const X_TICK_WIDTH = 60;
+const X_TICK_WIDTH = 100;
 
 interface LineChartProps extends BaseChartProps< SeriesData[] > {
 	withGradientFill: boolean;
@@ -66,8 +66,8 @@ const renderDefaultTooltip = ( {
 	);
 };
 
-const formatDateTick = ( value: number ) => {
-	const date = new Date( value );
+const formatDateTick = ( timestamp: number ) => {
+	const date = new Date( timestamp );
 	return date.toLocaleDateString( undefined, {
 		month: 'short',
 		day: 'numeric',
@@ -141,8 +141,7 @@ const LineChart: FC< LineChartProps > = ( {
 	}, [ margin, options ] );
 
 	const xNumTicks = useMemo(
-		() =>
-			Math.max( Math.floor( Math.min( dataSorted[ 0 ]?.data.length, width / X_TICK_WIDTH ) ), 5 ),
+		() => Math.min( dataSorted[ 0 ]?.data.length, Math.ceil( width / X_TICK_WIDTH ) ),
 		[ dataSorted, width ]
 	);
 
@@ -175,6 +174,7 @@ const LineChart: FC< LineChartProps > = ( {
 				width={ width }
 				height={ height }
 				margin={ { top: 10, right: 0, bottom: 20, left: 40, ...margin } }
+				// xScale and yScale could be set in Axis as well, but they are `scale` props there.
 				xScale={ { type: 'time', ...options?.xScale } }
 				yScale={ { type: 'linear', nice: true, zero: false, ...options?.yScale } }
 			>