@multiplatform.one/components 7.7.4 → 7.8.0

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

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","formatAxisTick","getLinearTicks","truncateLabel","G","Line","SvgText","useChartTheme","AXIS_TICK_LENGTH","AXIS_LABEL_GAP","TICK_LENGTH","LABEL_GAP","XAxis","param","plot","scale","tickValues","tickFormat","showLine","showTicks","showLabels","axisColor","labelColor","labelFontFamily","labelFontSize","values","domain","y","height","bandwidth","step","children","x1","x","y1","x2","width","y2","stroke","strokeWidth","map","value","index","position","center","text","textAnchor","fill","fontSize","fontFamily","Math","max","YAxis","ticks","showGrid","gridColor","tickNumbers","format"],"sources":["Axis.native.js"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { formatAxisTick, getLinearTicks, truncateLabel } from \"./math\";\nimport { G, Line, SvgText } from \"./svg\";\nimport { useChartTheme } from \"./useChartTheme\";\nvar AXIS_TICK_LENGTH = 4;\nvar AXIS_LABEL_GAP = 3;\nvar TICK_LENGTH = AXIS_TICK_LENGTH;\nvar LABEL_GAP = AXIS_LABEL_GAP;\nfunction XAxis(param) {\n  var { plot, scale, tickValues, tickFormat, showLine = true, showTicks = true, showLabels = true } = param;\n  var { axisColor, labelColor, labelFontFamily, labelFontSize } = useChartTheme();\n  var values = tickValues !== null && tickValues !== void 0 ? tickValues : scale.domain();\n  var y = plot.y + plot.height;\n  var bandwidth = scale.bandwidth();\n  var step = scale.step();\n  return /* @__PURE__ */ _jsxs(G, {\n    children: [\n      showLine ? /* @__PURE__ */ _jsx(Line, {\n        x1: plot.x,\n        y1: y,\n        x2: plot.x + plot.width,\n        y2: y,\n        stroke: axisColor,\n        strokeWidth: 1\n      }) : null,\n      values.map(function(value, index) {\n        var position = scale(value);\n        if (position === void 0) return null;\n        var center = position + bandwidth / 2;\n        var text = tickFormat ? tickFormat(value, index) : value;\n        return /* @__PURE__ */ _jsxs(G, {\n          children: [\n            showTicks ? /* @__PURE__ */ _jsx(Line, {\n              x1: center,\n              y1: y,\n              x2: center,\n              y2: y + TICK_LENGTH,\n              stroke: axisColor,\n              strokeWidth: 1\n            }) : null,\n            showLabels ? /* @__PURE__ */ _jsx(SvgText, {\n              x: center,\n              y: y + TICK_LENGTH + LABEL_GAP + labelFontSize * 0.8,\n              textAnchor: \"middle\",\n              fill: labelColor,\n              fontSize: labelFontSize,\n              ...labelFontFamily ? {\n                fontFamily: labelFontFamily\n              } : {},\n              children: truncateLabel(text, labelFontSize, Math.max(step, bandwidth))\n            }) : null\n          ]\n        }, `${value}-${index}`);\n      })\n    ]\n  });\n}\nfunction YAxis(param) {\n  var { plot, scale, ticks = 4, tickFormat, showLine = false, showTicks = false, showLabels = true, showGrid = true } = param;\n  var { axisColor, gridColor, labelColor, labelFontFamily, labelFontSize } = useChartTheme();\n  var tickNumbers = getLinearTicks(scale, ticks);\n  var format = tickFormat !== null && tickFormat !== void 0 ? tickFormat : function(value) {\n    return formatAxisTick(value);\n  };\n  return /* @__PURE__ */ _jsxs(G, {\n    children: [\n      showLine ? /* @__PURE__ */ _jsx(Line, {\n        x1: plot.x,\n        y1: plot.y,\n        x2: plot.x,\n        y2: plot.y + plot.height,\n        stroke: axisColor,\n        strokeWidth: 1\n      }) : null,\n      tickNumbers.map(function(value, index) {\n        var y = scale(value);\n        return /* @__PURE__ */ _jsxs(G, {\n          children: [\n            showGrid ? /* @__PURE__ */ _jsx(Line, {\n              x1: plot.x,\n              y1: y,\n              x2: plot.x + plot.width,\n              y2: y,\n              stroke: gridColor,\n              strokeWidth: 1\n            }) : null,\n            showTicks ? /* @__PURE__ */ _jsx(Line, {\n              x1: plot.x - TICK_LENGTH,\n              y1: y,\n              x2: plot.x,\n              y2: y,\n              stroke: axisColor,\n              strokeWidth: 1\n            }) : null,\n            showLabels ? /* @__PURE__ */ _jsx(SvgText, {\n              x: plot.x - TICK_LENGTH - LABEL_GAP,\n              y: y + labelFontSize * 0.35,\n              textAnchor: \"end\",\n              fill: labelColor,\n              fontSize: labelFontSize,\n              ...labelFontFamily ? {\n                fontFamily: labelFontFamily\n              } : {},\n              children: format(value, index)\n            }) : null\n          ]\n        }, `${value}-${index}`);\n      })\n    ]\n  });\n}\nexport {\n  AXIS_LABEL_GAP,\n  AXIS_TICK_LENGTH,\n  XAxis,\n  YAxis\n};\n//# sourceMappingURL=Axis.js.map\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","formatAxisTick","getLinearTicks","truncateLabel","G","Line","SvgText","chartChromeProps","useChartTheme","AXIS_TICK_LENGTH","AXIS_LABEL_GAP","TICK_LENGTH","LABEL_GAP","XAxis","param","plot","scale","tickValues","tickFormat","showLine","showTicks","showLabels","axisColor","labelColor","labelFontFamily","labelFontSize","values","domain","y","height","bandwidth","step","children","x1","x","y1","x2","width","y2","stroke","strokeWidth","map","value","index","position","center","text","textAnchor","fill","fontSize","fontFamily","Math","max","YAxis","ticks","showGrid","gridColor","tickNumbers","format"],"sources":["../../../src/charts/Axis.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/charts/BarChart.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, resolveSeriesFills, thinCategories } from "./composeChart.mjs";
 import { createBandScale, createLinearScale, formatChartValue, getLinearTicks, valueDomain } from "./math.mjs";
 import { BarSeries } from "./series.mjs";
@@ -47,64 +48,77 @@ function BarChart({
     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 = domainProp ?? valueDomain(data.map(datum => datum.value));
-      const nice = domainProp ? false : void 0;
-      const marginScale = createLinearScale({
-        domain,
-        range: [0, 1],
-        nice
-      });
-      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 = createBandScale({
-        domain: data.map(datum => datum.label),
-        range: [plot.x, plot.x + plot.width]
-      });
-      const yScale = createLinearScale({
-        domain,
-        range: [plot.y + plot.height, plot.y],
-        nice
-      });
-      return /* @__PURE__ */jsxs(Fragment, {
-        children: [showYAxis || showGrid ? /* @__PURE__ */jsx(YAxis, {
-          plot,
-          scale: yScale,
-          ticks: yTicks,
-          tickFormat: value => format(value),
-          showLabels: showYAxis,
-          showGrid
-        }) : null, /* @__PURE__ */jsx(BarSeries, {
-          data,
-          xScale,
-          yScale,
-          plot,
-          fills,
-          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: "bar",
+        separated: true,
+        datumText: false,
+        datumValues: chartDatumText(data, valueFormatter),
+        datumCount: data.length
+      },
+      height,
+      width,
+      ...stackProps,
+      children: size => {
+        const domain = domainProp ?? valueDomain(data.map(datum => datum.value));
+        const nice = domainProp ? false : void 0;
+        const marginScale = createLinearScale({
+          domain,
+          range: [0, 1],
+          nice
+        });
+        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 = createBandScale({
+          domain: data.map(datum => datum.label),
+          range: [plot.x, plot.x + plot.width]
+        });
+        const yScale = createLinearScale({
+          domain,
+          range: [plot.y + plot.height, plot.y],
+          nice
+        });
+        return /* @__PURE__ */jsxs(Fragment, {
+          children: [showYAxis || showGrid ? /* @__PURE__ */jsx(YAxis, {
+            plot,
+            scale: yScale,
+            ticks: yTicks,
+            tickFormat: value => format(value),
+            showLabels: showYAxis,
+            showGrid
+          }) : null, /* @__PURE__ */jsx(BarSeries, {
+            data,
+            xScale,
+            yScale,
+            plot,
+            fills,
+            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]
+        });
+      }
+    })
   });
 }
 export { BarChart };

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

@@ -1 +1 @@
-{"version":3,"names":["useTranslation","XAxis","YAxis","ChartSurface","describeChart","describeDatum","computeCartesianPlot","resolveSeriesFills","thinCategories","createBandScale","createLinearScale","formatChartValue","getLinearTicks","valueDomain","BarSeries","useChartTheme","Fragment","jsx","jsxs","BarChart","data","height","width","categorical","color","colors","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","domain","domainProp","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","palette","labelFontSize","fills","format","ariaLabel","typeLabel","formatValue","interactive","Boolean","children","size","map","datum","value","nice","marginScale","range","tickValues","plot","yTickLabels","fontSize","length","xScale","x","yScale","y","scale","ticks","tickFormat","showLabels","datumLabel"],"sources":["../../../src/charts/BarChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useTranslation","XAxis","YAxis","ChartDataFrame","ChartSurface","chartDatumText","describeChart","describeDatum","computeCartesianPlot","resolveSeriesFills","thinCategories","createBandScale","createLinearScale","formatChartValue","getLinearTicks","valueDomain","BarSeries","useChartTheme","Fragment","jsx","jsxs","BarChart","data","height","width","categorical","color","colors","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","domain","domainProp","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","palette","labelFontSize","fills","format","ariaLabel","typeLabel","formatValue","interactive","Boolean","children","proof","kind","separated","datumText","datumValues","datumCount","length","size","map","datum","value","nice","marginScale","range","tickValues","plot","yTickLabels","fontSize","xScale","x","yScale","y","scale","ticks","tickFormat","showLabels","datumLabel"],"sources":["../../../src/charts/BarChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

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

@@ -1,8 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useTranslation } from "../shared/i18n.native.js";
 import { XAxis, YAxis } from "./Axis.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 { computeCartesianPlot, resolveSeriesFills, thinCategories } from "./composeChart.native.js";
 import { createBandScale, createLinearScale, formatChartValue, getLinearTicks, valueDomain } from "./math.native.js";
 import { BarSeries } from "./series.native.js";
@@ -48,76 +49,89 @@ function BarChart(param) {
     formatValue: valueFormatter
   });
   var interactive = Boolean(onDatumPress || onDatumHoverIn || onDatumHoverOut);
-  return /* @__PURE__ */_jsx(ChartSurface, {
-    label: ariaLabel,
-    height,
+  return /* @__PURE__ */_jsx(ChartDataFrame, {
+    data,
+    title,
+    valueFormatter,
     width,
-    ...stackProps,
-    children: function children(size) {
-      var domain = domainProp !== null && domainProp !== void 0 ? domainProp : valueDomain(data.map(function (datum) {
-        return datum.value;
-      }));
-      var nice = domainProp ? false : void 0;
-      var marginScale = createLinearScale({
-        domain,
-        range: [0, 1],
-        nice
-      });
-      var tickValues = getLinearTicks(marginScale, yTicks);
-      var plot = 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 = createBandScale({
-        domain: data.map(function (datum) {
-          return datum.label;
-        }),
-        range: [plot.x, plot.x + plot.width]
-      });
-      var yScale = createLinearScale({
-        domain,
-        range: [plot.y + plot.height, plot.y],
-        nice
-      });
-      return /* @__PURE__ */_jsxs(_Fragment, {
-        children: [showYAxis || showGrid ? /* @__PURE__ */_jsx(YAxis, {
-          plot,
-          scale: yScale,
-          ticks: yTicks,
-          tickFormat: function tickFormat(value) {
+    children: /* @__PURE__ */_jsx(ChartSurface, {
+      label: ariaLabel,
+      proof: {
+        kind: "bar",
+        separated: true,
+        datumText: false,
+        datumValues: chartDatumText(data, valueFormatter),
+        datumCount: data.length
+      },
+      height,
+      width,
+      ...stackProps,
+      children: function children(size) {
+        var domain = domainProp !== null && domainProp !== void 0 ? domainProp : valueDomain(data.map(function (datum) {
+          return datum.value;
+        }));
+        var nice = domainProp ? false : void 0;
+        var marginScale = createLinearScale({
+          domain,
+          range: [0, 1],
+          nice
+        });
+        var tickValues = getLinearTicks(marginScale, yTicks);
+        var plot = computeCartesianPlot(size, {
+          showXAxis,
+          showYAxis,
+          yTickLabels: tickValues.map(function (value) {
             return format(value);
-          },
-          showLabels: showYAxis,
-          showGrid
-        }) : null, /* @__PURE__ */_jsx(BarSeries, {
-          data,
-          xScale,
-          yScale,
-          plot,
-          fills,
-          onDatumPress,
-          onDatumHoverIn,
-          onDatumHoverOut,
-          datumLabel: interactive ? function (datum) {
-            return describeDatum({
-              datum,
-              formatValue: valueFormatter
-            });
-          } : void 0
-        }), showXAxis ? /* @__PURE__ */_jsx(XAxis, {
-          plot,
-          scale: xScale,
-          tickValues: thinCategories(data.map(function (datum) {
+          }),
+          fontSize: labelFontSize
+        });
+        if (plot.width <= 0 || plot.height <= 0 || data.length === 0) return null;
+        var xScale = createBandScale({
+          domain: data.map(function (datum) {
             return datum.label;
-          }), plot.width, labelFontSize)
-        }) : null]
-      });
-    }
+          }),
+          range: [plot.x, plot.x + plot.width]
+        });
+        var yScale = createLinearScale({
+          domain,
+          range: [plot.y + plot.height, plot.y],
+          nice
+        });
+        return /* @__PURE__ */_jsxs(_Fragment, {
+          children: [showYAxis || showGrid ? /* @__PURE__ */_jsx(YAxis, {
+            plot,
+            scale: yScale,
+            ticks: yTicks,
+            tickFormat: function tickFormat(value) {
+              return format(value);
+            },
+            showLabels: showYAxis,
+            showGrid
+          }) : null, /* @__PURE__ */_jsx(BarSeries, {
+            data,
+            xScale,
+            yScale,
+            plot,
+            fills,
+            onDatumPress,
+            onDatumHoverIn,
+            onDatumHoverOut,
+            datumLabel: interactive ? function (datum) {
+              return describeDatum({
+                datum,
+                formatValue: valueFormatter
+              });
+            } : void 0
+          }), showXAxis ? /* @__PURE__ */_jsx(XAxis, {
+            plot,
+            scale: xScale,
+            tickValues: thinCategories(data.map(function (datum) {
+              return datum.label;
+            }), plot.width, labelFontSize)
+          }) : null]
+        });
+      }
+    })
   });
 }
 export { BarChart };

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

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useTranslation","XAxis","YAxis","ChartSurface","describeChart","describeDatum","computeCartesianPlot","resolveSeriesFills","thinCategories","createBandScale","createLinearScale","formatChartValue","getLinearTicks","valueDomain","BarSeries","useChartTheme","BarChart","param","data","height","width","categorical","color","colors","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","domain","domainProp","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","palette","labelFontSize","fills","format","ariaLabel","typeLabel","formatValue","interactive","Boolean","children","size","map","datum","value","nice","marginScale","range","tickValues","plot","yTickLabels","fontSize","length","xScale","x","yScale","y","scale","ticks","tickFormat","showLabels","datumLabel"],"sources":["BarChart.native.js"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { useTranslation } from \"../shared/i18n\";\nimport { XAxis, YAxis } from \"./Axis\";\nimport { ChartSurface } from \"./ChartSurface\";\nimport { describeChart, describeDatum } from \"./accessibility\";\nimport { computeCartesianPlot, resolveSeriesFills, thinCategories } from \"./composeChart\";\nimport { createBandScale, createLinearScale, formatChartValue, getLinearTicks, valueDomain } from \"./math\";\nimport { BarSeries } from \"./series\";\nimport { useChartTheme } from \"./useChartTheme\";\nfunction BarChart(param) {\n  var { data, height = 200, width, categorical = false, color, colors, showXAxis = true, showYAxis = true, showGrid = true, yTicks = 4, valueFormatter, title, label, domain: domainProp, onDatumPress, onDatumHoverIn, onDatumHoverOut, ...stackProps } = param;\n  var { t } = useTranslation();\n  var { palette, labelFontSize } = useChartTheme();\n  var fills = resolveSeriesFills(data, palette, {\n    color,\n    colors,\n    categorical\n  });\n  var format = valueFormatter !== null && valueFormatter !== void 0 ? valueFormatter : formatChartValue;\n  var ariaLabel = label !== null && label !== void 0 ? label : describeChart({\n    typeLabel: t(\"Bar chart\"),\n    title,\n    data,\n    formatValue: valueFormatter\n  });\n  var interactive = Boolean(onDatumPress || onDatumHoverIn || onDatumHoverOut);\n  return /* @__PURE__ */ _jsx(ChartSurface, {\n    label: ariaLabel,\n    height,\n    width,\n    ...stackProps,\n    children: function children(size) {\n      var domain = domainProp !== null && domainProp !== void 0 ? domainProp : valueDomain(data.map(function(datum) {\n        return datum.value;\n      }));\n      var nice = domainProp ? false : void 0;\n      var marginScale = createLinearScale({\n        domain,\n        range: [\n          0,\n          1\n        ],\n        nice\n      });\n      var tickValues = getLinearTicks(marginScale, yTicks);\n      var plot = computeCartesianPlot(size, {\n        showXAxis,\n        showYAxis,\n        yTickLabels: tickValues.map(function(value) {\n          return format(value);\n        }),\n        fontSize: labelFontSize\n      });\n      if (plot.width <= 0 || plot.height <= 0 || data.length === 0) return null;\n      var xScale = createBandScale({\n        domain: data.map(function(datum) {\n          return datum.label;\n        }),\n        range: [\n          plot.x,\n          plot.x + plot.width\n        ]\n      });\n      var yScale = createLinearScale({\n        domain,\n        range: [\n          plot.y + plot.height,\n          plot.y\n        ],\n        nice\n      });\n      return /* @__PURE__ */ _jsxs(_Fragment, {\n        children: [\n          showYAxis || showGrid ? /* @__PURE__ */ _jsx(YAxis, {\n            plot,\n            scale: yScale,\n            ticks: yTicks,\n            tickFormat: function tickFormat(value) {\n              return format(value);\n            },\n            showLabels: showYAxis,\n            showGrid\n          }) : null,\n          /* @__PURE__ */ _jsx(BarSeries, {\n            data,\n            xScale,\n            yScale,\n            plot,\n            fills,\n            onDatumPress,\n            onDatumHoverIn,\n            onDatumHoverOut,\n            datumLabel: interactive ? function(datum) {\n              return describeDatum({\n                datum,\n                formatValue: valueFormatter\n              });\n            } : void 0\n          }),\n          showXAxis ? /* @__PURE__ */ _jsx(XAxis, {\n            plot,\n            scale: xScale,\n            tickValues: thinCategories(data.map(function(datum) {\n              return datum.label;\n            }), plot.width, labelFontSize)\n          }) : null\n        ]\n      });\n    }\n  });\n}\nexport {\n  BarChart\n};\n//# sourceMappingURL=BarChart.js.map\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useTranslation","XAxis","YAxis","ChartDataFrame","ChartSurface","chartDatumText","describeChart","describeDatum","computeCartesianPlot","resolveSeriesFills","thinCategories","createBandScale","createLinearScale","formatChartValue","getLinearTicks","valueDomain","BarSeries","useChartTheme","BarChart","param","data","height","width","categorical","color","colors","showXAxis","showYAxis","showGrid","yTicks","valueFormatter","title","label","domain","domainProp","onDatumPress","onDatumHoverIn","onDatumHoverOut","stackProps","t","palette","labelFontSize","fills","format","ariaLabel","typeLabel","formatValue","interactive","Boolean","children","proof","kind","separated","datumText","datumValues","datumCount","length","size","map","datum","value","nice","marginScale","range","tickValues","plot","yTickLabels","fontSize","xScale","x","yScale","y","scale","ticks","tickFormat","showLabels","datumLabel"],"sources":["../../../src/charts/BarChart.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/charts/ChartDataView.mjs

@@ -0,0 +1,185 @@
+import { Button } from "@multiplatform.one/forms";
+import { isWeb } from "@multiplatform.one/platform";
+import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { createContext, useContext, useId, useState } from "react";
+import { Dialog, Paragraph, ScrollView, XStack, YStack } from "tamagui";
+import { sectionHeading } from "../componentColors.mjs";
+import { useTranslation } from "../shared/i18n.mjs";
+import { DialogContent, DialogOverlay } from "../surfaces.mjs";
+import { describeDatum } from "./accessibility.mjs";
+import { formatChartValue } from "./math.mjs";
+import { chartWebProps } from "./svg.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+const ChartDataContext = createContext(null);
+function ChartDataView({
+  data,
+  title,
+  valueFormatter,
+  children
+}) {
+  const {
+    t
+  } = useTranslation();
+  const {
+    knobProps
+  } = useResolvedKnobs();
+  const {
+    knobProps: datumKnobs
+  } = useResolvedKnobs({
+    compact: true
+  });
+  const [open, setOpen] = useState(false);
+  const id = `mpo-chart-data-${useId().replace(/[^a-zA-Z0-9_-]/g, "_")}`;
+  const triggerId = `${id}-trigger`;
+  const normalized = data.map((datum, index) => typeof datum === "number" ? {
+    label: String(index + 1),
+    value: datum
+  } : datum);
+  const format = valueFormatter ?? formatChartValue;
+  const actionLabel = title ? `${t("View data for")} ${title}` : t("View chart data");
+  const action = /* @__PURE__ */jsx(Dialog.Trigger, {
+    asChild: true,
+    children: /* @__PURE__ */jsx(Button, {
+      compact: true,
+      id: triggerId,
+      ...(isWeb ? {
+        "aria-label": actionLabel
+      } : {
+        accessibilityLabel: actionLabel
+      }),
+      ...chartWebProps({
+        "data-mpo-chart-data-trigger": id
+      }),
+      children: t("View data")
+    })
+  });
+  return /* @__PURE__ */jsx(ChartDataContext.Provider, {
+    value: {
+      id,
+      triggerId
+    },
+    children: /* @__PURE__ */jsxs(Dialog, {
+      modal: true,
+      open,
+      onOpenChange: setOpen,
+      children: [children({
+        action,
+        data: normalized,
+        valueFormatter: format
+      }), /* @__PURE__ */jsxs(Dialog.Portal, {
+        children: [/* @__PURE__ */jsx(DialogOverlay, {}, "overlay"), /* @__PURE__ */jsxs(DialogContent, {
+          width: "90%",
+          maxWidth: 480,
+          maxHeight: "80%",
+          ...chartWebProps({
+            "data-mpo-chart-data-panel": id
+          }),
+          children: [/* @__PURE__ */jsx(Dialog.Title, {
+            ...knobProps.heading,
+            ...sectionHeading,
+            children: title ? `${title}: ${t("data")}` : t("Chart data")
+          }), /* @__PURE__ */jsx(Dialog.Description, {
+            ...knobProps.body,
+            children: `${normalized.length} ${t("data points")}`
+          }), /* @__PURE__ */jsx(ScrollView, {
+            flexShrink: 1,
+            minHeight: 0,
+            children: /* @__PURE__ */jsx(YStack, {
+              ...knobProps.gap,
+              children: normalized.map((datum, index) => /* @__PURE__ */jsxs(XStack, {
+                alignItems: "flex-start",
+                flexWrap: "wrap",
+                ...datumKnobs.gap,
+                ...chartWebProps({
+                  "data-mpo-chart-data-row": String(index)
+                }),
+                ...(!isWeb ? {
+                  accessible: true,
+                  accessibilityLabel: describeDatum({
+                    datum,
+                    formatValue: format
+                  })
+                } : {}),
+                children: [/* @__PURE__ */jsx(Paragraph, {
+                  flexBasis: "50%",
+                  flexGrow: 1,
+                  flexShrink: 1,
+                  minWidth: 0,
+                  ...knobProps.body,
+                  ...chartWebProps({
+                    "data-mpo-chart-data-label": "true"
+                  }),
+                  children: datum.label
+                }), /* @__PURE__ */jsx(Paragraph, {
+                  flexShrink: 1,
+                  maxWidth: "100%",
+                  ...knobProps.body,
+                  ...chartWebProps({
+                    "data-mpo-chart-data-value": "true"
+                  }),
+                  children: format(datum.value)
+                })]
+              }, index))
+            })
+          }), /* @__PURE__ */jsx(XStack, {
+            justifyContent: "flex-end",
+            children: /* @__PURE__ */jsx(Dialog.Close, {
+              asChild: true,
+              "aria-label": t("Close"),
+              children: /* @__PURE__ */jsx(Button, {
+                "aria-label": t("Close"),
+                ...(!isWeb ? {
+                  accessibilityLabel: t("Close")
+                } : {}),
+                ...chartWebProps({
+                  "data-mpo-chart-data-close": id
+                }),
+                children: t("Close")
+              })
+            })
+          })]
+        }, "content")]
+      })]
+    })
+  });
+}
+function ChartDataFrame({
+  data,
+  title,
+  valueFormatter,
+  width,
+  children
+}) {
+  const inherited = useContext(ChartDataContext);
+  const {
+    knobProps
+  } = useResolvedKnobs();
+  if (inherited) return children;
+  return /* @__PURE__ */jsx(ChartDataView, {
+    data,
+    title,
+    valueFormatter,
+    children: ({
+      action
+    }) => /* @__PURE__ */jsxs(YStack, {
+      minWidth: 0,
+      width: width ?? "100%",
+      maxWidth: "100%",
+      ...knobProps.gap,
+      children: [children, /* @__PURE__ */jsx(XStack, {
+        justifyContent: "flex-end",
+        children: action
+      })]
+    })
+  });
+}
+function useChartDataViewProps() {
+  const context = useContext(ChartDataContext);
+  if (!context) return {};
+  return chartWebProps({
+    "data-mpo-chart-data-view": context.id,
+    "aria-describedby": context.triggerId
+  });
+}
+export { ChartDataFrame, ChartDataView, useChartDataViewProps };
+//# sourceMappingURL=ChartDataView.mjs.map