@multiplatform.one/components 7.7.6 → 7.10.0

package/dist/esm/charts/PieChart.mjs

@@ -1,12 +1,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 +15,7 @@ function PieChart({
   data,
   height = 200,
   donut = false,
-  padAngle = 0,
+  padAngle,
   colors,
   showLegend = true,
   valueFormatter,
@@ -49,80 +50,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: knobProps.textAccentColor,
+          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

package/dist/esm/charts/PieChart.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["useResolvedKnobs","useTranslation","Text","XStack","YStack","componentColors","ChartSurface","describeChart","describeDatum","resolveSeriesFills","formatChartValue","PieSeries","useChartTheme","jsx","jsxs","DEFAULT_DONUT_RATIO","PieChart","data","height","donut","padAngle","colors","showLegend","valueFormatter","title","label","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","knobProps","palette","fills","categorical","format","total","reduce","sum","datum","value","ariaLabel","typeLabel","formatValue","includeShare","interactive","Boolean","innerRatio","Math","min","max","flexWrap","alignItems","flexShrink","minWidth","gap","children","width","size","outerRadius","cx","cy","innerRadius","datumLabel","flex","justifyContent","map","index","borderRadius","backgroundColor","fontSize","color","text","muted","numberOfLines","fontWeight"],"sources":["../../../src/charts/PieChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useResolvedKnobs","useTranslation","Text","XStack","YStack","ChartDataFrame","ChartSurface","chartDatumText","describeChart","describeDatum","resolveSeriesFills","formatChartValue","pieSlices","canMaskPieSlices","PieSeries","chartDatumTextProps","chartWebProps","useChartTheme","jsx","jsxs","DEFAULT_DONUT_RATIO","PieChart","data","height","donut","padAngle","colors","showLegend","valueFormatter","title","label","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","knobProps","palette","fills","categorical","format","total","reduce","sum","datum","value","ariaLabel","typeLabel","formatValue","includeShare","interactive","Boolean","innerRatio","Math","min","max","chart","flexWrap","alignItems","flexShrink","minWidth","gap","children","width","proof","kind","separated","datumText","datumValues","datumCount","length","size","outerRadius","cx","cy","innerRadius","datumLabel","flex","justifyContent","map","index","borderRadius","backgroundColor","body","fontSize","color","textAccentColor","numberOfLines"],"sources":["../../../src/charts/PieChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/charts/PieChart.native.js

@@ -2,12 +2,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useResolvedKnobs } from "@multiplatform.one/theme";
 import { useTranslation } from "../shared/i18n.native.js";
 import { Text, XStack, YStack } from "tamagui";
-import { componentColors } from "../componentColors.native.js";
+import { ChartDataFrame } from "./ChartDataView.native.js";
 import { ChartSurface } from "./ChartSurface.native.js";
-import { describeChart, describeDatum } from "./accessibility.native.js";
+import { chartDatumText, describeChart, describeDatum } from "./accessibility.native.js";
 import { resolveSeriesFills } from "./composeChart.native.js";
-import { formatChartValue } from "./math.native.js";
+import { formatChartValue, pieSlices, canMaskPieSlices } from "./math.native.js";
 import { PieSeries } from "./series.native.js";
+import { chartDatumTextProps, chartWebProps } from "./svg.native.js";
 import { useChartTheme } from "./useChartTheme.native.js";
 var DEFAULT_DONUT_RATIO = 0.55;
 function PieChart(param) {
@@ -15,7 +16,7 @@ function PieChart(param) {
     data,
     height = 200,
     donut = false,
-    padAngle = 0,
+    padAngle,
     colors,
     showLegend = true,
     valueFormatter,
@@ -52,91 +53,114 @@ function PieChart(param) {
   });
   var interactive = Boolean(onDatumPress || onDatumHoverIn || onDatumHoverOut);
   var 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,
+  var 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: function children(size) {
-            var 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 ? function (datum) {
-                return 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(function (datum, index) {
-          return /* @__PURE__ */_jsxs(XStack, {
-            gap: "$2",
-            alignItems: "center",
-            minWidth: 0,
-            children: [
-            /* Legend keys are chart CHROME, not marks: the swatch follows
-            the radius knob and goes square in the `none` world (Axiom 3
-            NULL). The pinned $2 arc was knob-dead (D-09 / LC-60). */
-            /* @__PURE__ */
-            _jsx(YStack, {
-              width: 12,
-              height: 12,
-              borderRadius: knobProps.borderRadius.borderRadius,
-              flexShrink: 0,
-              backgroundColor: fills[index]
+        width: height,
+        children: function children(size) {
+          var 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 ? function (datum) {
+              return 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(function (datum, index) {
+        return /* @__PURE__ */_jsxs(XStack, {
+          ...chartDatumTextProps(index),
+          gap: "$2",
+          alignItems: "center",
+          minWidth: 0,
+          children: [
+          /* Legend keys are chart CHROME, not marks: the swatch follows
+          the radius knob and goes square in the `none` world (Axiom 3
+          NULL). The pinned $2 arc was knob-dead (D-09 / LC-60). */
+          /* @__PURE__ */
+          _jsx(YStack, {
+            width: 12,
+            height: 12,
+            borderRadius: knobProps.borderRadius.borderRadius,
+            flexShrink: 0,
+            backgroundColor: fills[index]
+          }),
+          /* The label yields (truncates) before the value — values are
+          data and never truncate (Axiom 11). */
+          /* @__PURE__ */
+          _jsx(Text, {
+            ...chartWebProps({
+              "data-mpo-chart-datum-label": "true"
             }),
-            /* The label yields (truncates) before the value — values are
-            data and never truncate (Axiom 11). */
-            /* @__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]
-    })
-  );
+            ...knobProps.body,
+            fontSize: "$2",
+            color: knobProps.textAccentColor,
+            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.native.js.map

package/dist/esm/charts/PieChart.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","useResolvedKnobs","useTranslation","Text","XStack","YStack","componentColors","ChartSurface","describeChart","describeDatum","resolveSeriesFills","formatChartValue","PieSeries","useChartTheme","DEFAULT_DONUT_RATIO","PieChart","param","data","height","donut","padAngle","colors","showLegend","valueFormatter","title","label","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","knobProps","palette","fills","categorical","format","total","reduce","sum","datum","value","ariaLabel","typeLabel","formatValue","includeShare","interactive","Boolean","innerRatio","Math","min","max","flexWrap","alignItems","flexShrink","minWidth","gap","children","width","size","outerRadius","cx","cy","innerRadius","datumLabel","flex","justifyContent","map","index","borderRadius","backgroundColor","fontSize","color","text","muted"],"sources":["../../../src/charts/PieChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","useResolvedKnobs","useTranslation","Text","XStack","YStack","ChartDataFrame","ChartSurface","chartDatumText","describeChart","describeDatum","resolveSeriesFills","formatChartValue","pieSlices","canMaskPieSlices","PieSeries","chartDatumTextProps","chartWebProps","useChartTheme","DEFAULT_DONUT_RATIO","PieChart","param","data","height","donut","padAngle","colors","showLegend","valueFormatter","title","label","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","knobProps","palette","fills","categorical","format","total","reduce","sum","datum","value","ariaLabel","typeLabel","formatValue","includeShare","interactive","Boolean","innerRatio","Math","min","max","chart","flexWrap","alignItems","flexShrink","minWidth","gap","children","width","proof","kind","separated","datumText","datumValues","datumCount","length","size","outerRadius","cx","cy","innerRadius","datumLabel","flex","justifyContent","map","index","borderRadius","backgroundColor","body","fontSize","color","textAccentColor","numberOfLines"],"sources":["../../../src/charts/PieChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/charts/Sparkline.mjs

@@ -1,6 +1,6 @@
 import { useTranslation } from "../shared/i18n.mjs";
 import { ChartSurface } from "./ChartSurface.mjs";
-import { describeChart } from "./accessibility.mjs";
+import { chartDatumText, describeChart } from "./accessibility.mjs";
 import { createLinearScale, createPointScale, valueDomain } from "./math.mjs";
 import { AreaSeries, LineSeries } from "./series.mjs";
 import { useChartTheme } from "./useChartTheme.mjs";
@@ -15,6 +15,7 @@ function Sparkline({
   strokeWidth = 1.5,
   title,
   label,
+  valueFormatter,
   ...stackProps
 }) {
   const {
@@ -31,10 +32,18 @@ function Sparkline({
   const ariaLabel = label ?? describeChart({
     typeLabel: t("Sparkline"),
     title,
-    data: normalized
+    data: normalized,
+    formatValue: valueFormatter
   });
   return /* @__PURE__ */jsx(ChartSurface, {
     label: ariaLabel,
+    proof: {
+      kind: showArea ? "area" : "line",
+      separated: false,
+      datumText: false,
+      datumValues: chartDatumText(normalized, valueFormatter),
+      datumCount: normalized.length
+    },
     height,
     width,
     ...stackProps,

package/dist/esm/charts/Sparkline.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["useTranslation","ChartSurface","describeChart","createLinearScale","createPointScale","valueDomain","AreaSeries","LineSeries","useChartTheme","Fragment","jsx","jsxs","Sparkline","data","height","width","color","showArea","curve","strokeWidth","title","label","stackProps","t","palette","stroke","single","normalized","map","entry","index","String","value","ariaLabel","typeLabel","children","size","length","inset","xScale","domain","datum","range","yScale","zeroBased","nice","points","x","y","baseline","showPoints"],"sources":["../../../src/charts/Sparkline.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,cAAA,QAAsB;AAE/B,SAASC,YAAA,QAAoB;AAC7B,SAASC,aAAA,QAAqB;AAC9B,SAASC,iBAAA,EAAmBC,gBAAA,EAAkBC,WAAA,QAAmB;AACjE,SAASC,UAAA,EAAYC,UAAA,QAAkB;AAEvC,SAASC,aAAA,QAAqB;AAoEpB,SAAAC,QAAA,EAEIC,GAAA,EAFJC,IAAA;AA1CH,SAASC,UAAU;EACxBC,IAAA;EACAC,MAAA,GAAS;EACTC,KAAA;EACAC,KAAA;EACAC,QAAA,GAAW;EACXC,KAAA,GAAQ;EACRC,WAAA,GAAc;EACdC,KAAA;EACAC,KAAA;EACA,GAAGC;AACL,GAAmB;EACjB,MAAM;IAAEC;EAAE,IAAIvB,cAAA,CAAe;EAC7B,MAAM;IAAEwB;EAAQ,IAAIhB,aAAA,CAAc;EAClC,MAAMiB,MAAA,GAAST,KAAA,IAASQ,OAAA,CAAQE,MAAA;EAChC,MAAMC,UAAA,GAA2Bd,IAAA,CAAKe,GAAA,CAAI,CAACC,KAAA,EAAOC,KAAA,KAChD,OAAOD,KAAA,KAAU,WAAW;IAAER,KAAA,EAAOU,MAAA,CAAOD,KAAA,GAAQ,CAAC;IAAGE,KAAA,EAAOH;EAAM,IAAIA,KAC3E;EACA,MAAMI,SAAA,GAAYZ,KAAA,IAASnB,aAAA,CAAc;IAAEgC,SAAA,EAAWX,CAAA,CAAE,WAAW;IAAGH,KAAA;IAAOP,IAAA,EAAMc;EAAW,CAAC;EAE/F,OACE,eAAAjB,GAAA,CAACT,YAAA;IAAaoB,KAAA,EAAOY,SAAA;IAAWnB,MAAA;IAAgBC,KAAA;IAAe,GAAGO,UAAA;IAC/Da,QAAA,EAACC,IAAA,IAAS;MACT,IAAIT,UAAA,CAAWU,MAAA,KAAW,GAAG,OAAO;MACpC,MAAMC,KAAA,GAAQnB,WAAA,GAAc;MAC5B,MAAMoB,MAAA,GAASnC,gBAAA,CAAiB;QAC9BoC,MAAA,EAAQb,UAAA,CAAWC,GAAA,CAAKa,KAAA,IAAUA,KAAA,CAAMpB,KAAK;QAC7CqB,KAAA,EAAO,CAACJ,KAAA,EAAOF,IAAA,CAAKrB,KAAA,GAAQuB,KAAK;MACnC,CAAC;MACD,MAAMK,MAAA,GAASxC,iBAAA,CAAkB;QAC/BqC,MAAA,EAAQnC,WAAA,CACNsB,UAAA,CAAWC,GAAA,CAAKa,KAAA,IAAUA,KAAA,CAAMT,KAAK,GACrC;UAAEY,SAAA,EAAW;QAAM,CACrB;QACAF,KAAA,EAAO,CAACN,IAAA,CAAKtB,MAAA,GAASwB,KAAA,EAAOA,KAAK;QAClCO,IAAA,EAAM;MACR,CAAC;MACD,MAAMC,MAAA,GAASnB,UAAA,CAAWC,GAAA,CAAKa,KAAA,KAAW;QACxCM,CAAA,EAAGR,MAAA,CAAOE,KAAA,CAAMpB,KAAK,KAAKiB,KAAA;QAC1BU,CAAA,EAAGL,MAAA,CAAOF,KAAA,CAAMT,KAAK;MACvB,EAAE;MACF,OACE,eAAArB,IAAA,CAAAF,QAAA;QACG0B,QAAA,GAAAlB,QAAA,GACC,eAAAP,GAAA,CAACJ,UAAA;UACCwC,MAAA;UACAG,QAAA,EAAUb,IAAA,CAAKtB,MAAA,GAASwB,KAAA;UACxBtB,KAAA,EAAOS,MAAA;UACPP;QAAA,CACF,IACE,MACJ,eAAAR,GAAA,CAACH,UAAA;UACCM,IAAA,EAAMc,UAAA;UACNmB,MAAA;UACA9B,KAAA,EAAOS,MAAA;UACPN,WAAA;UACAD,KAAA;UACAgC,UAAA,EAAY;QAAA,CACd;MAAA,CACF;IAEJ;EAAA,CACF;AAEJ","ignoreList":[]}
+{"version":3,"names":["useTranslation","ChartSurface","chartDatumText","describeChart","createLinearScale","createPointScale","valueDomain","AreaSeries","LineSeries","useChartTheme","Fragment","jsx","jsxs","Sparkline","data","height","width","color","showArea","curve","strokeWidth","title","label","valueFormatter","stackProps","t","palette","stroke","single","normalized","map","entry","index","String","value","ariaLabel","typeLabel","formatValue","proof","kind","separated","datumText","datumValues","datumCount","length","children","size","inset","xScale","domain","datum","range","yScale","zeroBased","nice","points","x","y","baseline","showPoints"],"sources":["../../../src/charts/Sparkline.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/charts/Sparkline.native.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useTranslation } from "../shared/i18n.native.js";
 import { ChartSurface } from "./ChartSurface.native.js";
-import { describeChart } from "./accessibility.native.js";
+import { chartDatumText, describeChart } from "./accessibility.native.js";
 import { createLinearScale, createPointScale, valueDomain } from "./math.native.js";
 import { AreaSeries, LineSeries } from "./series.native.js";
 import { useChartTheme } from "./useChartTheme.native.js";
@@ -16,6 +16,7 @@ function Sparkline(param) {
     strokeWidth = 1.5,
     title,
     label,
+    valueFormatter,
     ...stackProps
   } = param;
   var {
@@ -34,10 +35,18 @@ function Sparkline(param) {
   var ariaLabel = label !== null && label !== void 0 ? label : describeChart({
     typeLabel: t("Sparkline"),
     title,
-    data: normalized
+    data: normalized,
+    formatValue: valueFormatter
   });
   return /* @__PURE__ */_jsx(ChartSurface, {
     label: ariaLabel,
+    proof: {
+      kind: showArea ? "area" : "line",
+      separated: false,
+      datumText: false,
+      datumValues: chartDatumText(normalized, valueFormatter),
+      datumCount: normalized.length
+    },
     height,
     width,
     ...stackProps,

package/dist/esm/charts/Sparkline.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useTranslation","ChartSurface","describeChart","createLinearScale","createPointScale","valueDomain","AreaSeries","LineSeries","useChartTheme","Sparkline","param","data","height","width","color","showArea","curve","strokeWidth","title","label","stackProps","t","palette","stroke","single","normalized","map","entry","index","String","value","ariaLabel","typeLabel","children","size","length","inset","xScale","domain","datum","range","yScale","zeroBased","nice","points","_xScale","x","y","baseline"],"sources":["../../../src/charts/Sparkline.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAsB,EAAAC,QAAA,IAAAC,SAAA;AAE/B,SAASC,cAAA,QAAoB;AAC7B,SAASC,YAAA,kCAAqB;AAC9B,SAASC,aAAA,QAAmB,2BAAkB;AAC9C,SAASC,iBAAY,EAAAC,gBAAkB,EAAAC,WAAA;AAEvC,SAASC,UAAA,EAAAC,UAAqB;AAoEpB,SAAAC,aAEI,QAFJ;AA1CH,SAASC,UAAUC,KAAA;EACxB;IAAAC,IAAA;IAAAC,MAAA;IAAAC,KAAA;IAAAC,KAAA;IAAAC,QAAA;IAAAC,KAAA;IAAAC,WAAA;IAAAC,KAAA;IAAAC,KAAA;IAAA,GAAAC;EAAA,IAAAV,KAAA;EACA;IAAAW;EAAA,CAAS,GAAArB,cAAA;EACT;IAAAsB;EAAA,IAAAd,aAAA;EACA,IAAAe,MAAA,GAAAT,KAAA,aAAAA,KAAA,cAAAA,KAAA,GAAAQ,OAAA,CAAAE,MAAA;EACA,IAAAC,UAAW,GAAAd,IAAA,CAAAe,GAAA,WAAAC,KAAA,EAAAC,KAAA;IACX,OAAQ,OAAAD,KAAA;MACRR,KAAA,EAAAU,MAAc,CAAAD,KAAA;MACdE,KAAA,EAAAH;IACA,IAAAA,KAAA;EACA;EACF,IAAmBI,SAAA,GAAAZ,KAAA,aAAAA,KAAA,cAAAA,KAAA,GAAAjB,aAAA;IACjB8B,SAAU,EAAAX,CAAI;IACdH,KAAM;IACNP,IAAM,EAAAc;EACN;EAAsC,OAAK,eACzC9B,IAAO,CAAAM,YAAU;IACnBkB,KAAA,EAAAY,SAAA;IACAnB,MAAM;IAENC,KACE;IAEI,GAAAO,UAAI;IACJa,QAAM,WAAQA,SAAcC,IAAA;MAC5B,IAAMT,UAAS,CAAAU,MAAA,eAAiB;MAC9B,IAAAC,KAAQ,GAAAnB,WAAe,GAAC;MACxB,IAAAoB,MAAQ,GAAAjC,gBAAoB;QAC7BkC,MAAA,EAAAb,UAAA,CAAAC,GAAA,WAAAa,KAAA;UACK,OAAAA,KAAS,CAAApB,KAAA;QACb;QACEqB,KAAA,GACEJ,KAAA,EACJF,IAAA,CAAArB,KAAA,GAAAuB,KAAA;MAEA;MACD,IAAAK,MAAA,GAAAtC,iBAAA;QACDmC,MAAM,EAAAjC,WAAS,CAAAoB,UAAgB,CAAAC,GAAA,WAAWa,KAAA;UACrC,OAAOA,KAAM,CAAAT,KAAK;QACrB,CAAG;UACHY,SAAA;QACF;QAEKF,KAAA,GACEN,IAAA,CAAAtB,MAAA,GAAAwB,KAAA,EAAAA,KAAA;QACCO,IACA;MAAwB;MACjB,IACPC,MAAA,GAAAnB,UAAA,CAAAC,GAAA,WAAAa,KAAA;QAAA,IAAAM,OAAA;QACF,OACE;UACJC,CAAA,GAAAD,OAAA,GAAAR,MAAA,CAAAE,KAAA,CAAApB,KAAA,eAAA0B,OAAA,cAAAA,OAAA,GAAAT,KAAA;UAACW,CAAA,EAAAN,MAAA,CAAAF,KAAA,CAAAT,KAAA;QAAA;MAAA;MACO,OACN,eAAAjC,KAAA,CAAAE,SAAA;QAAAkC,QACA,EAAO,CACPlB,QAAA,kBAAApB,IAAA,CAAAW,UAAA;UACAsC,MAAA;UACAI,QAAA,EAAYd,IAAA,CAAAtB,MAAA,GAAAwB,KAAA;UAAAtB,KAAA,EAAAS,MAAA;UACdP;QACF,WAGN,eAAArB,IAAA,CAAAY,UAAA;UAEJI,IAAA,EAAAc,UAAA","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useTranslation","ChartSurface","chartDatumText","describeChart","createLinearScale","createPointScale","valueDomain","AreaSeries","LineSeries","useChartTheme","Sparkline","param","data","height","width","color","showArea","curve","strokeWidth","title","label","valueFormatter","stackProps","t","palette","stroke","single","normalized","map","entry","index","String","value","ariaLabel","typeLabel","formatValue","proof","kind","separated","datumText","datumValues","datumCount","length","children","size","inset","xScale","domain","datum","range","yScale","zeroBased","nice","points","_xScale","x","y","baseline","showPoints"],"sources":["../../../src/charts/Sparkline.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/charts/accessibility.mjs

@@ -32,5 +32,8 @@ function describeDatum(input) {
   }
   return base;
 }
-export { describeChart, describeDatum };
+function chartDatumText(data, formatValue = formatChartValue) {
+  return data.map(datum => [datum.label.trim(), formatValue(datum.value).trim()]);
+}
+export { chartDatumText, describeChart, describeDatum };
 //# sourceMappingURL=accessibility.mjs.map