@multiplatform.one/components 7.7.4 → 7.8.0

package/dist/jsx/charts/LineChart.mjs

@@ -1,7 +1,8 @@
 import { useTranslation } from "../shared/i18n.mjs";
 import { XAxis, YAxis } from "./Axis.mjs";
+import { ChartDataFrame } from "./ChartDataView.mjs";
 import { ChartSurface } from "./ChartSurface.mjs";
-import { describeChart, describeDatum } from "./accessibility.mjs";
+import { chartDatumText, describeChart, describeDatum } from "./accessibility.mjs";
 import { computeCartesianPlot, thinCategories } from "./composeChart.mjs";
 import { createLinearScale, createPointScale, formatChartValue, getLinearTicks, valueDomain } from "./math.mjs";
 import { AreaSeries, LineSeries } from "./series.mjs";
@@ -46,74 +47,87 @@ function LineChart({
     formatValue: valueFormatter
   });
   const interactive = Boolean(onDatumPress || onDatumHoverIn || onDatumHoverOut);
-  return /* @__PURE__ */jsx(ChartSurface, {
-    label: ariaLabel,
-    height,
+  return /* @__PURE__ */jsx(ChartDataFrame, {
+    data,
+    title,
+    valueFormatter,
     width,
-    ...stackProps,
-    children: size => {
-      const domain = valueDomain(data.map(datum => datum.value));
-      const marginScale = createLinearScale({
-        domain,
-        range: [0, 1]
-      });
-      const tickValues = getLinearTicks(marginScale, yTicks);
-      const plot = computeCartesianPlot(size, {
-        showXAxis,
-        showYAxis,
-        yTickLabels: tickValues.map(value => format(value)),
-        fontSize: labelFontSize
-      });
-      if (plot.width <= 0 || plot.height <= 0 || data.length === 0) return null;
-      const xScale = createPointScale({
-        domain: data.map(datum => datum.label),
-        range: [plot.x, plot.x + plot.width],
-        padding: 0.5
-      });
-      const yScale = createLinearScale({
-        domain,
-        range: [plot.y + plot.height, plot.y]
-      });
-      const points = data.map(datum => ({
-        x: xScale(datum.label) ?? plot.x,
-        y: yScale(datum.value)
-      }));
-      return /* @__PURE__ */jsxs(Fragment, {
-        children: [showYAxis || showGrid ? /* @__PURE__ */jsx(YAxis, {
-          plot,
-          scale: yScale,
-          ticks: yTicks,
-          tickFormat: value => format(value),
-          showLabels: showYAxis,
-          showGrid
-        }) : null, showArea ? /* @__PURE__ */jsx(AreaSeries, {
-          points,
-          baseline: plot.y + plot.height,
-          color: stroke,
-          opacity: areaOpacity,
-          curve
-        }) : null, /* @__PURE__ */jsx(LineSeries, {
-          data,
-          points,
-          color: stroke,
-          strokeWidth,
-          curve,
-          showPoints,
-          bounds: size,
-          onDatumPress,
-          onDatumHoverIn,
-          onDatumHoverOut,
-          datumLabel: interactive ? datum => describeDatum({
-            datum,
-            formatValue: valueFormatter
-          }) : void 0
-        }), showXAxis ? /* @__PURE__ */jsx(XAxis, {
-          plot,
-          scale: xScale,
-          tickValues: thinCategories(data.map(datum => datum.label), plot.width, labelFontSize)
-        }) : null]
-      });
-    }
+    children: /* @__PURE__ */jsx(ChartSurface, {
+      label: ariaLabel,
+      proof: {
+        kind: showArea ? "area" : "line",
+        separated: false,
+        datumText: false,
+        datumValues: chartDatumText(data, valueFormatter),
+        datumCount: data.length
+      },
+      height,
+      width,
+      ...stackProps,
+      children: size => {
+        const domain = valueDomain(data.map(datum => datum.value));
+        const marginScale = createLinearScale({
+          domain,
+          range: [0, 1]
+        });
+        const tickValues = getLinearTicks(marginScale, yTicks);
+        const plot = computeCartesianPlot(size, {
+          showXAxis,
+          showYAxis,
+          yTickLabels: tickValues.map(value => format(value)),
+          fontSize: labelFontSize
+        });
+        if (plot.width <= 0 || plot.height <= 0 || data.length === 0) return null;
+        const xScale = createPointScale({
+          domain: data.map(datum => datum.label),
+          range: [plot.x, plot.x + plot.width],
+          padding: 0.5
+        });
+        const yScale = createLinearScale({
+          domain,
+          range: [plot.y + plot.height, plot.y]
+        });
+        const points = data.map(datum => ({
+          x: xScale(datum.label) ?? plot.x,
+          y: yScale(datum.value)
+        }));
+        return /* @__PURE__ */jsxs(Fragment, {
+          children: [showYAxis || showGrid ? /* @__PURE__ */jsx(YAxis, {
+            plot,
+            scale: yScale,
+            ticks: yTicks,
+            tickFormat: value => format(value),
+            showLabels: showYAxis,
+            showGrid
+          }) : null, showArea ? /* @__PURE__ */jsx(AreaSeries, {
+            points,
+            baseline: plot.y + plot.height,
+            color: stroke,
+            opacity: areaOpacity,
+            curve
+          }) : null, /* @__PURE__ */jsx(LineSeries, {
+            data,
+            points,
+            color: stroke,
+            strokeWidth,
+            curve,
+            showPoints,
+            bounds: size,
+            onDatumPress,
+            onDatumHoverIn,
+            onDatumHoverOut,
+            datumLabel: interactive ? datum => describeDatum({
+              datum,
+              formatValue: valueFormatter
+            }) : void 0
+          }), showXAxis ? /* @__PURE__ */jsx(XAxis, {
+            plot,
+            scale: xScale,
+            tickValues: thinCategories(data.map(datum => datum.label), plot.width, labelFontSize)
+          }) : null]
+        });
+      }
+    })
   });
 }
 function AreaChart(props) {

package/dist/jsx/charts/LineChart.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["useTranslation","XAxis","YAxis","ChartSurface","describeChart","describeDatum","computeCartesianPlot","thinCategories","createLinearScale","createPointScale","formatChartValue","getLinearTicks","valueDomain","AreaSeries","LineSeries","useChartTheme","Fragment","jsx","jsxs","LineChart","data","height","width","color","showArea","areaOpacity","curve","showPoints","strokeWidth","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","typeLabel","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","palette","labelFontSize","stroke","single","format","ariaLabel","formatValue","interactive","Boolean","children","size","domain","map","datum","value","marginScale","range","tickValues","plot","yTickLabels","fontSize","length","xScale","x","padding","yScale","y","points","scale","ticks","tickFormat","showLabels","baseline","opacity","bounds","datumLabel","AreaChart","props"],"sources":["../../../src/charts/LineChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useTranslation","XAxis","YAxis","ChartDataFrame","ChartSurface","chartDatumText","describeChart","describeDatum","computeCartesianPlot","thinCategories","createLinearScale","createPointScale","formatChartValue","getLinearTicks","valueDomain","AreaSeries","LineSeries","useChartTheme","Fragment","jsx","jsxs","LineChart","data","height","width","color","showArea","areaOpacity","curve","showPoints","strokeWidth","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","typeLabel","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","palette","labelFontSize","stroke","single","format","ariaLabel","formatValue","interactive","Boolean","children","proof","kind","separated","datumText","datumValues","datumCount","length","size","domain","map","datum","value","marginScale","range","tickValues","plot","yTickLabels","fontSize","xScale","x","padding","yScale","y","points","scale","ticks","tickFormat","showLabels","baseline","opacity","bounds","datumLabel","AreaChart","props"],"sources":["../../../src/charts/LineChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/charts/LineChart.native.js

@@ -31,6 +31,7 @@ module.exports = __toCommonJS(LineChart_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_i18n = require("../shared/i18n.native.js");
 var import_Axis = require("./Axis.native.js");
+var import_ChartDataView = require("./ChartDataView.native.js");
 var import_ChartSurface = require("./ChartSurface.native.js");
 var import_accessibility = require("./accessibility.native.js");
 var import_composeChart = require("./composeChart.native.js");
@@ -77,89 +78,102 @@ function LineChart(param) {
     formatValue: valueFormatter
   });
   var interactive = Boolean(onDatumPress || onDatumHoverIn || onDatumHoverOut);
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ChartSurface.ChartSurface, {
-    label: ariaLabel,
-    height,
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ChartDataView.ChartDataFrame, {
+    data,
+    title,
+    valueFormatter,
     width,
-    ...stackProps,
-    children: function children(size) {
-      var domain = (0, import_math.valueDomain)(data.map(function (datum) {
-        return datum.value;
-      }));
-      var marginScale = (0, import_math.createLinearScale)({
-        domain,
-        range: [0, 1]
-      });
-      var tickValues = (0, import_math.getLinearTicks)(marginScale, yTicks);
-      var plot = (0, import_composeChart.computeCartesianPlot)(size, {
-        showXAxis,
-        showYAxis,
-        yTickLabels: tickValues.map(function (value) {
-          return format(value);
-        }),
-        fontSize: labelFontSize
-      });
-      if (plot.width <= 0 || plot.height <= 0 || data.length === 0) return null;
-      var xScale = (0, import_math.createPointScale)({
-        domain: data.map(function (datum) {
-          return datum.label;
-        }),
-        range: [plot.x, plot.x + plot.width],
-        padding: 0.5
-      });
-      var yScale = (0, import_math.createLinearScale)({
-        domain,
-        range: [plot.y + plot.height, plot.y]
-      });
-      var points = data.map(function (datum) {
-        var _xScale;
-        return {
-          x: (_xScale = xScale(datum.label)) !== null && _xScale !== void 0 ? _xScale : plot.x,
-          y: yScale(datum.value)
-        };
-      });
-      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
-        children: [showYAxis || showGrid ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Axis.YAxis, {
-          plot,
-          scale: yScale,
-          ticks: yTicks,
-          tickFormat: function tickFormat(value) {
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ChartSurface.ChartSurface, {
+      label: ariaLabel,
+      proof: {
+        kind: showArea ? "area" : "line",
+        separated: false,
+        datumText: false,
+        datumValues: (0, import_accessibility.chartDatumText)(data, valueFormatter),
+        datumCount: data.length
+      },
+      height,
+      width,
+      ...stackProps,
+      children: function children(size) {
+        var domain = (0, import_math.valueDomain)(data.map(function (datum) {
+          return datum.value;
+        }));
+        var marginScale = (0, import_math.createLinearScale)({
+          domain,
+          range: [0, 1]
+        });
+        var tickValues = (0, import_math.getLinearTicks)(marginScale, yTicks);
+        var plot = (0, import_composeChart.computeCartesianPlot)(size, {
+          showXAxis,
+          showYAxis,
+          yTickLabels: tickValues.map(function (value) {
             return format(value);
-          },
-          showLabels: showYAxis,
-          showGrid
-        }) : null, showArea ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_series.AreaSeries, {
-          points,
-          baseline: plot.y + plot.height,
-          color: stroke,
-          opacity: areaOpacity,
-          curve
-        }) : null, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_series.LineSeries, {
-          data,
-          points,
-          color: stroke,
-          strokeWidth,
-          curve,
-          showPoints,
-          bounds: size,
-          onDatumPress,
-          onDatumHoverIn,
-          onDatumHoverOut,
-          datumLabel: interactive ? function (datum) {
-            return (0, import_accessibility.describeDatum)({
-              datum,
-              formatValue: valueFormatter
-            });
-          } : void 0
-        }), showXAxis ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Axis.XAxis, {
-          plot,
-          scale: xScale,
-          tickValues: (0, import_composeChart.thinCategories)(data.map(function (datum) {
+          }),
+          fontSize: labelFontSize
+        });
+        if (plot.width <= 0 || plot.height <= 0 || data.length === 0) return null;
+        var xScale = (0, import_math.createPointScale)({
+          domain: data.map(function (datum) {
             return datum.label;
-          }), plot.width, labelFontSize)
-        }) : null]
-      });
-    }
+          }),
+          range: [plot.x, plot.x + plot.width],
+          padding: 0.5
+        });
+        var yScale = (0, import_math.createLinearScale)({
+          domain,
+          range: [plot.y + plot.height, plot.y]
+        });
+        var points = data.map(function (datum) {
+          var _xScale;
+          return {
+            x: (_xScale = xScale(datum.label)) !== null && _xScale !== void 0 ? _xScale : plot.x,
+            y: yScale(datum.value)
+          };
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+          children: [showYAxis || showGrid ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Axis.YAxis, {
+            plot,
+            scale: yScale,
+            ticks: yTicks,
+            tickFormat: function tickFormat(value) {
+              return format(value);
+            },
+            showLabels: showYAxis,
+            showGrid
+          }) : null, showArea ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_series.AreaSeries, {
+            points,
+            baseline: plot.y + plot.height,
+            color: stroke,
+            opacity: areaOpacity,
+            curve
+          }) : null, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_series.LineSeries, {
+            data,
+            points,
+            color: stroke,
+            strokeWidth,
+            curve,
+            showPoints,
+            bounds: size,
+            onDatumPress,
+            onDatumHoverIn,
+            onDatumHoverOut,
+            datumLabel: interactive ? function (datum) {
+              return (0, import_accessibility.describeDatum)({
+                datum,
+                formatValue: valueFormatter
+              });
+            } : void 0
+          }), showXAxis ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Axis.XAxis, {
+            plot,
+            scale: xScale,
+            tickValues: (0, import_composeChart.thinCategories)(data.map(function (datum) {
+              return datum.label;
+            }), plot.width, labelFontSize)
+          }) : null]
+        });
+      }
+    })
   });
 }
 function AreaChart(props) {

package/dist/jsx/charts/LineChart.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","LineChart_exports","AreaChart","LineChart","module","exports","import_jsx_runtime","require","import_i18n","import_Axis","import_ChartSurface","import_accessibility","import_composeChart","import_math","import_series","import_useChartTheme","param","data","height","width","color","showArea","areaOpacity","curve","showPoints","strokeWidth","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","typeLabel","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","useTranslation","palette","labelFontSize","useChartTheme","stroke","single","format","formatChartValue","ariaLabel","describeChart","formatValue","interactive","Boolean","jsx","ChartSurface","children","size","domain","valueDomain","map","datum","marginScale","createLinearScale","range","tickValues","getLinearTicks","plot","computeCartesianPlot","yTickLabels","fontSize","length","xScale","createPointScale","x","padding","yScale","y","points","_xScale","jsxs","Fragment","YAxis","scale","ticks","tickFormat","showLabels","AreaSeries","baseline","opacity","LineSeries","bounds","datumLabel","describeDatum"],"sources":["../../../src/charts/LineChart.tsx"],"sourcesContent":[null],"mappings":"AAAA,YAAS;;AAET,IAAAA,SAAS,GAAOC,MAAA,CAAAC,cAAa;AAC7B,IAAAC,gBAAS,GAAAF,MAAoB,CAAAG,wBAAA;AAC7B,IAAAC,iBAAS,GAAeJ,MAAA,CAAAK,mBAAqB;AAC7C,IAAAC,YAAS,GAAAN,MAAA,CAAAO,SAAsB,CAAAC,cAAA;AAC/B,IAAAC,QAAA,GAAAA,CAAAC,MAAA,EAAAC,GAAA;EACE,SAAAC,IAAA,IAAAD,GAAA,EACAZ,SAAA,CAAAW,MAAA,EAAAE,IAAA;IAAAC,GAAA,EAAAF,GAAA,CAAAC,IAAA;IAAAE,UAAA;EAAA;AAAA;AACA,IACAC,WAAA,GAAAA,CAAAC,EAAA,EAAAC,IAAA,EAAAC,MAAA,EAAAC,IAAA;EACA,IAAAF,IAAA,WAAAA,IAAA,wBAAAA,IAAA;IAAA,KACK,IAAAG,GAAA,IAAAhB,iBAAA,CAAAa,IAAA,GACP,IAAS,CAAAX,YAAY,CAAAe,IAAA,CAAAL,EAAA,EAAAI,GAAA,KAAkBA,GAAA,KAAAF,MAAA,EAEvCnB,SAAS,CAAAiB,EAAA,EAAAI,GAAA;MAAAP,GAAqB,EAAAA,CAAA,KAAAI,IAAA,CAAAG,GAAA;MAAAN,UAAA,IAAAK,IAAA,GAAAjB,gBAAA,CAAAe,IAAA,EAAAG,GAAA,MAAAD,IAAA,CAAAL;IAAA;EAsGpB;EAlEH,OAASE,EAAA;AAAU;AACxB,IACAM,YAAS,GAAAC,GAAA,IAAAR,WAAA,CAAAhB,SAAA;EAAAyB,KAAA;AAAA,IAAAD,GAAA;AAAA,IACTE,iBAAA;AAAAhB,QACA,CAAAgB,iBAAA;EACAC,SAAA,EAAWA,CAAA,KAAAA,SAAA;EACXC,SAAA,EAAAA,CAAA,KAAAA;AAAA,EACA;AAAQC,MACR,CAAAC,OAAA,GAAaP,YAAA,CAAAG,iBAAA;AAAA,IACbK,kBAAc,GAAAC,OAAA;AAAA,IACdC,WAAY,GAAAD,OAAA;AAAA,IACZE,WAAY,GAAAF,OAAA;AAAA,IACZG,mBAAW,GAAAH,OAAA;AAAA,IACXI,oBAAS,GAAAJ,OAAA;AAAA,IACTK,mBAAA,GAAAL,OAAA;AAAA,IACAM,WAAA,GAAAN,OAAA;AAAA,IACAO,aAAA,GAAAP,OAAA;AAAA,IACAQ,oBAAA,GAAAR,OAAA;AAAA,SACAJ,UAAAa,KAAA;EACA;IAAAC,IAAA;IAAAC,MAAA;IAAAC,KAAA;IAAAC,KAAA;IAAAC,QAAA;IAAAC,WAAA;IAAAC,KAAA;IAAAC,UAAA;IAAAC,WAAA;IAAAC,SAAA;IAAAC,SAAA;IAAAC,QAAA;IAAAC,MAAA;IAAAC,cAAA;IAAAC,KAAA;IAAAC,KAAA;IAAAC,SAAA;IAAAC,YAAA;IAAAC,cAAA;IAAAC,eAAA;IAAA,GAAAC;EAAA,IAAArB,KAAA;EACA;IAAAsB;EAAA,QAAA9B,WAAA,CAAA+B,cAAA;EACA,IAAG;IAAAC,OAAA;IAAAC;EAAA,QAAA1B,oBAAA,CAAA2B,aAAA;EACL,IAAmBC,MAAA,GAAAvB,KAAA,aAAAA,KAAA,cAAAA,KAAA,GAAAoB,OAAA,CAAAI,MAAA;EACjB,IAAAC,MAAU,GAAAf,cAAI,KAAe,QAAAA,cAAA,cAAAA,cAAA,GAAAjB,WAAA,CAAAiC,gBAAA;EAC7B,IAAAC,SAAQ,GAAAf,KAAS,aAAcA,KAAI,UAAc,IAAAA,KAAA,OAAArB,oBAAA,CAAAqC,aAAA;IAGjDf,SAAM,EAAAA,SAAS,KAAS,QAAQA,SAAA,cAAAA,SAAA,GAAAZ,QAAA,GAAAiB,CAAA,iBAAAA,CAAA;IAChCP,KAAM;IACNd,IAAM;IAGFgC,WAAW,EAAAnB;EAAyD,EACpE;EAAA,IACAoB,WAAA,GAAAC,OAAA,CAAAjB,YAAA,IAAAC,cAAA,IAAAC,eAAA;EAAA,OACA,eAAa,IAAA9B,kBAAA,CAAA8C,GAAA,EAAA1C,mBAAA,CAAA2C,YAAA;IACdrB,KAAA,EAAAe,SAAA;IACH7B,MAAM;IAENC,KACE;IAEI,GAAAkB,UAAM;IACNiB,QAAM,WAAAA,QAAcA,CAAAC,IAAA;MACpB,IAAMC,MAAA,OAAa3C,WAAA,CAAA4C,WAAe,EAAAxC,IAAa,CAAAyC,GAAA,CAAM,UAAAC,KAAA;QACrD,OAAMA,KAAO,CAAA3D,KAAA;MACX;MACA,IAAA4D,WAAA,OAAA/C,WAAA,CAAAgD,iBAAA;QACAL,MAAA;QACAM,KAAA,GACD,GACG;MAEF;MACA,IAAAC,UAAa,GAAG,IAAKlD,WAAS,CAAAmD,cAAK,EAAAJ,WAAA,EAAA/B,MAAA;MACnC,IAAAoC,IAAA,GAAS,IAAArD,mBAAA,CAAAsD,oBAAA,EAAAX,IAAA;QACV7B,SAAA;QACDC,SAAM;QACJwC,WAAA,EAAAJ,UAAA,CAAAL,GAAA,WAAA1D,KAAA;UACA,OAAQ6C,MAAS,CAAA7C,KAAK;QACvB;QACDoE,QAAM,EAAA3B;MACJ;MACA,IAAGwB,IAAA,CAAA9C,KAAO,IAAM,KAAK8C,IAAA,CAAA/C,MAAA,SAAAD,IAAA,CAAAoD,MAAA;MACrB,IAAAC,MAAA,OAAAzD,WAAA,CAAA0D,gBAAA;QACFf,MACE,EAAAvC,IAAA,CAAAyC,GAAA,WAAAC,KAAA;UACG,OAAAA,KAAa,CAAA3B,KAAA;QACX;QAAA8B,KAAA,GACCG,IAAA,CAAAO,CAAA,EACAP,IAAA,CAAAO,CAAA,GAAOP,IAAA,CAAA9C,KAAA;QACAsD,OACP;MAAmC;MACvB,IACZC,MAAA,OAAA7D,WAAA,CAAAgD,iBAAA;QAAAL,MAAA;QACFM,KACE,GACHG,IAAA,CAAAU,CAAA,GACCV,IAAA,CAAA/C,MAAA,EAAC+C,IAAA,CAAAU,CAAA;MAAA;MACC,IACAC,MAAA,GAAA3D,IAAU,CAAAyC,GAAK,WAASC,KAAA;QAAA,IACxBkB,OAAO;QAAA,OACP;UACAL,CAAA,GAAAK,OAAA,GAAAP,MAAA,CAAAX,KAAA,CAAA3B,KAAA,eAAA6C,OAAA,cAAAA,OAAA,GAAAZ,IAAA,CAAAO,CAAA;UAAAG,CAAA,EAAAD,MAAA,CAAAf,KAAA,CAAA3D,KAAA;QACF;MAEF;MAAA,OAAC,mBAAAM,kBAAA,CAAAwE,IAAA,EAAAxE,kBAAA,CAAAyE,QAAA;QAAAzB,QAAA,GACC3B,SAAA,IAAAC,QAAA,sBAAAtB,kBAAA,CAAA8C,GAAA,EAAA3C,WAAA,CAAAuE,KAAA;UACAf,IAAA;UACAgB,KAAO,EAAAP,MAAA;UACPQ,KAAA,EAAArD,MAAA;UACAsD,UAAA,WAAAA,WAAAnF,KAAA;YACA,OAAA6C,MAAA,CAAA7C,KAAA;UACA;UACAoF,UAAA,EAAAzD,SAAA;UACAC;QACA,WACAP,QAAA,kBAEO,IAAAf,kBAAU,CAAA8C,GAAgB,EAAAtC,aAAO,CAAAuE,UAAa;UAC/CT,MAAA;UAERU,QAAA,EAAArB,IAAA,CAAAU,CAAA,GAAAV,IAAA,CAAA/C,MAAA;UACCE,KAAA,EACCuB,MAAA;UAAC4C,OAAA,EAAAjE,WAAA;UAAAC;QACC,WACA,eAAO,IAAAjB,kBAAA,CAAA8C,GAAA,EAAAtC,aAAA,CAAA0E,UAAA;UACPvE,IAAA;UACE2D,MAAK;UACLxD,KAAK,EAAAuB,MAAA;UACLlB,WAAA;UACFF,KAAA;UAAAC,UAAA;UAEAiE,MAAA,EAAAlC,IAAA;UACNrB,YAAA;UAGNC,cAAA;UAEJC,eAAA;UAKgBsD,UAAU,EAAAxC,WAAuB,aAAAS,KAAA;YACxC,WAAAhD,oBAAW,CAAAgF,aAAU,EAAG;cACjChC,KAAA","ignoreList":[]}
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","LineChart_exports","AreaChart","LineChart","module","exports","import_jsx_runtime","require","import_i18n","import_Axis","import_ChartDataView","import_ChartSurface","import_accessibility","import_composeChart","import_math","import_series","import_useChartTheme","param","data","height","width","color","showArea","areaOpacity","curve","showPoints","strokeWidth","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","typeLabel","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","useTranslation","palette","labelFontSize","useChartTheme","stroke","single","format","formatChartValue","ariaLabel","describeChart","formatValue","interactive","Boolean","jsx","ChartDataFrame","children","ChartSurface","proof","kind","separated","datumText","datumValues","chartDatumText","datumCount","length","size","domain","valueDomain","map","datum","marginScale","createLinearScale","range","tickValues","getLinearTicks","plot","computeCartesianPlot","yTickLabels","fontSize","xScale","createPointScale","x","padding","yScale","y","points","_xScale","jsxs","Fragment","YAxis","scale","ticks","tickFormat","showLabels","AreaSeries","baseline","opacity","LineSeries","bounds","datumLabel","describeDatum"],"sources":["../../../src/charts/LineChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/charts/PieChart.mjs

@@ -2,11 +2,13 @@ import { useResolvedKnobs } from "@multiplatform.one/theme";
 import { useTranslation } from "../shared/i18n.mjs";
 import { Text, XStack, YStack } from "tamagui";
 import { componentColors } from "../componentColors.mjs";
+import { ChartDataFrame } from "./ChartDataView.mjs";
 import { ChartSurface } from "./ChartSurface.mjs";
-import { describeChart, describeDatum } from "./accessibility.mjs";
+import { chartDatumText, describeChart, describeDatum } from "./accessibility.mjs";
 import { resolveSeriesFills } from "./composeChart.mjs";
-import { formatChartValue } from "./math.mjs";
+import { formatChartValue, pieSlices, canMaskPieSlices } from "./math.mjs";
 import { PieSeries } from "./series.mjs";
+import { chartDatumTextProps, chartWebProps } from "./svg.mjs";
 import { useChartTheme } from "./useChartTheme.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 const DEFAULT_DONUT_RATIO = 0.55;
@@ -14,7 +16,7 @@ function PieChart({
   data,
   height = 200,
   donut = false,
-  padAngle = 0,
+  padAngle,
   colors,
   showLegend = true,
   valueFormatter,
@@ -49,80 +51,103 @@ function PieChart({
   });
   const interactive = Boolean(onDatumPress || onDatumHoverIn || onDatumHoverOut);
   const innerRatio = donut === false ? 0 : donut === true ? DEFAULT_DONUT_RATIO : Math.min(Math.max(donut, 0), 0.9);
-  return (
-    // LC-10: `flexShrink` + `minWidth 0` let a row parent (e.g. Card.Footer)
-    // constrain the chart below its intrinsic width — the wrap then stacks
-    // the legend under the pie instead of painting past the frame.
-    /* @__PURE__ */
-    jsxs(XStack, {
-      flexWrap: "wrap",
-      alignItems: "center",
-      flexShrink: 1,
-      minWidth: 0,
-      ...knobProps.gap,
-      ...stackProps,
-      children: [/* @__PURE__ */jsx(YStack, {
-        width: height,
+  const chart =
+  // LC-10: `flexShrink` + `minWidth 0` let a row parent (e.g. Card.Footer)
+  // constrain the chart below its intrinsic width — the wrap then stacks
+  // the legend under the pie instead of painting past the frame.
+  /* @__PURE__ */
+  jsxs(XStack, {
+    flexWrap: "wrap",
+    alignItems: "center",
+    flexShrink: 1,
+    minWidth: 0,
+    ...knobProps.gap,
+    ...chartWebProps({
+      "data-mpo-chart-owner": "true"
+    }),
+    ...stackProps,
+    children: [/* @__PURE__ */jsx(YStack, {
+      width: height,
+      height,
+      children: /* @__PURE__ */jsx(ChartSurface, {
+        label: ariaLabel,
+        proof: {
+          kind: innerRatio > 0 ? "donut" : "pie",
+          separated: padAngle === void 0 ? canMaskPieSlices(pieSlices(data), height / 2 * innerRatio, height / 2) : padAngle > 0,
+          datumText: showLegend,
+          datumValues: chartDatumText(data, valueFormatter),
+          datumCount: data.length
+        },
         height,
-        children: /* @__PURE__ */jsx(ChartSurface, {
-          label: ariaLabel,
-          height,
-          width: height,
-          children: size => {
-            const outerRadius = Math.min(size.width, size.height) / 2;
-            return /* @__PURE__ */jsx(PieSeries, {
-              data,
-              cx: size.width / 2,
-              cy: size.height / 2,
-              outerRadius,
-              innerRadius: outerRadius * innerRatio,
-              padAngle,
-              fills,
-              onDatumPress,
-              onDatumHoverIn,
-              onDatumHoverOut,
-              datumLabel: interactive ? datum => describeDatum({
-                datum,
-                total,
-                formatValue: valueFormatter
-              }) : void 0
-            });
-          }
-        })
-      }), showLegend ? /* @__PURE__ */jsx(YStack, {
-        flex: 1,
-        minWidth: 140,
-        justifyContent: "center",
+        width: height,
+        children: size => {
+          const outerRadius = Math.min(size.width, size.height) / 2;
+          return /* @__PURE__ */jsx(PieSeries, {
+            data,
+            cx: size.width / 2,
+            cy: size.height / 2,
+            outerRadius,
+            innerRadius: outerRadius * innerRatio,
+            padAngle,
+            fills,
+            onDatumPress,
+            onDatumHoverIn,
+            onDatumHoverOut,
+            datumLabel: interactive ? datum => describeDatum({
+              datum,
+              total,
+              formatValue: valueFormatter
+            }) : void 0
+          });
+        }
+      })
+    }), showLegend ? /* @__PURE__ */jsx(YStack, {
+      flex: 1,
+      minWidth: 140,
+      justifyContent: "center",
+      gap: "$2",
+      ...{
+        "data-pie-legend": "true"
+      },
+      children: data.map((datum, index) => /* @__PURE__ */jsxs(XStack, {
+        ...chartDatumTextProps(index),
         gap: "$2",
-        ...{
-          "data-pie-legend": "true"
-        },
-        children: data.map((datum, index) => /* @__PURE__ */jsxs(XStack, {
-          gap: "$2",
-          alignItems: "center",
-          minWidth: 0,
-          children: [/* @__PURE__ */jsx(YStack, {
-            width: 12,
-            height: 12,
-            borderRadius: knobProps.borderRadius.borderRadius,
-            flexShrink: 0,
-            backgroundColor: fills[index]
-          }), /* @__PURE__ */jsx(Text, {
-            fontSize: "$2",
-            color: componentColors.text.muted,
-            flex: 1,
-            numberOfLines: 1,
-            children: datum.label
-          }), /* @__PURE__ */jsx(Text, {
-            fontSize: "$2",
-            fontWeight: "500",
-            flexShrink: 0,
-            children: format(datum.value)
-          })]
-        }, `${datum.label}-${index}`))
-      }) : null]
-    })
-  );
+        alignItems: "center",
+        minWidth: 0,
+        children: [/* @__PURE__ */jsx(YStack, {
+          width: 12,
+          height: 12,
+          borderRadius: knobProps.borderRadius.borderRadius,
+          flexShrink: 0,
+          backgroundColor: fills[index]
+        }), /* @__PURE__ */jsx(Text, {
+          ...chartWebProps({
+            "data-mpo-chart-datum-label": "true"
+          }),
+          ...knobProps.body,
+          fontSize: "$2",
+          color: componentColors.text.muted,
+          flex: 1,
+          numberOfLines: 1,
+          children: datum.label
+        }), /* @__PURE__ */jsx(Text, {
+          ...chartWebProps({
+            "data-mpo-chart-datum-value": "true"
+          }),
+          ...knobProps.body,
+          fontSize: "$2",
+          flexShrink: 0,
+          children: format(datum.value)
+        })]
+      }, `${datum.label}-${index}`))
+    }) : null]
+  });
+  return showLegend ? chart : /* @__PURE__ */jsx(ChartDataFrame, {
+    data,
+    title,
+    valueFormatter,
+    children: chart
+  });
 }
 export { PieChart };
 //# sourceMappingURL=PieChart.mjs.map