@chipmobilesdk/rn-chart 0.3.0 → 0.5.0

package/lib/module/react/ChartFrame.js

@@ -0,0 +1,263 @@
+"use strict";
+
+/**
+ * The shared chart shell.
+ *
+ * Every family routes through here, so validation, status resolution, budget
+ * checks, theming, layout, selection, accessibility, and failure containment
+ * are written once and behave identically across all five. The pieces live in
+ * their own hooks and components; this file is the order they run in.
+ *
+ * Layout note (FR-039): the frame imposes **no outer margin**. Insight text is
+ * out of scope for this package, so apps render their own text directly above
+ * or below a chart and must not have to fight a margin they cannot control.
+ */
+import React, { useId, useMemo } from 'react';
+import { Pressable, StyleSheet, Text, View } from 'react-native';
+import Svg from 'react-native-svg';
+import { drawsData, suppressesInteraction } from "../contract/state.js";
+import { chartStrings } from "../contract/strings.js";
+import { hitTest, hitTestByX } from "../geometry/hitTest.js";
+import { containsPoint } from "../geometry/layout.js";
+import { EMPTY_GEOMETRY } from "../geometry/types.js";
+import { SelectionHighlight } from "../render/Marks.js";
+import { ChartBoundary } from "./ChartBoundary.js";
+import { ChartLegend, ColorScaleLegend, buildLegendEntries } from "./ChartLegend.js";
+import { ChartPlot } from "./ChartPlot.js";
+import { ChartFailureOverlay, ChartStateOverlay } from "./ChartStateOverlay.js";
+import { useChartTheme } from "./ChartThemeProvider.js";
+import { pointEventFor } from "./pointEvent.js";
+import { useChartA11y } from "./useChartA11y.js";
+import { useChartFormatters } from "./useChartFormatters.js";
+import { useChartLayout, useGeometryInput } from "./useChartLayout.js";
+import { useChartSelection, useSeriesVisibility } from "./useChartSelection.js";
+import { useChartStatus } from "./useChartStatus.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+const DEFAULT_HEIGHT = 220;
+export function ChartFrame(props) {
+  const family = props.family;
+  const theme = useChartTheme(props.theme);
+  const strings = useMemo(() => chartStrings.resolve(props.strings), [props.strings]);
+  const generatedId = useId();
+  const instanceKey = props.chartId ?? generatedId;
+  const {
+    validation,
+    error,
+    status
+  } = useChartStatus({
+    datasource: props.datasource,
+    family,
+    chartId: props.chartId,
+    instanceKey,
+    declared: props.status,
+    onFailure: props.onFailure,
+    distributionValues: props.distributionValues
+  });
+  const formatters = useChartFormatters(props.formatters, props.datasource.format, instanceKey);
+  const layout = useChartLayout(theme, {
+    height: props.height
+  });
+  const geometryInput = useGeometryInput(props.datasource, theme, layout, formatters.geometry, family);
+  const showData = drawsData(status);
+  const visibility = useSeriesVisibility({
+    controlled: props.hiddenSeriesIds,
+    onVisibilityChange: props.onVisibilityChange,
+    enabled: props.seriesToggleEnabled === true,
+    initiallyHidden: useMemo(() => props.datasource.series.filter(s => s.hidden).map(s => s.id), [props.datasource.series])
+  });
+
+  // Runtime visibility has to reach the geometry, not just the legend —
+  // otherwise toggling a series greys out its swatch while the line keeps
+  // drawing (FR-049). With nothing hidden the original datasource is returned
+  // by identity, so the common case costs nothing.
+  const hidden = visibility.hidden;
+  const datasource = useMemo(() => {
+    if (hidden.size === 0) {
+      return props.datasource;
+    }
+    return {
+      ...props.datasource,
+      series: props.datasource.series.map(s => hidden.has(s.id) ? {
+        ...s,
+        hidden: true
+      } : s)
+    };
+  }, [props.datasource, hidden]);
+
+  // The single memoized artefact.
+  //
+  // The dependency list is narrow on purpose. Depending on the whole `props`
+  // object would invalidate the memo whenever any callback identity changed —
+  // and inline arrow callbacks are the norm in app code, so that would defeat
+  // FR-073 in exactly the case it exists for. Selection is absent for the same
+  // reason: highlighting repaints the highlight, it does not rebuild scales.
+  const buildGeometry = props.buildGeometry;
+  const geometry = useMemo(() => {
+    if (!layout.measured || !showData) {
+      return EMPTY_GEOMETRY;
+    }
+    return buildGeometry(datasource, geometryInput);
+  }, [layout.measured, showData, buildGeometry, datasource, geometryInput]);
+  const selection = useChartSelection({
+    controlled: props.selection,
+    onSelectionChange: props.onSelectionChange,
+    onSelectionUnresolvable: props.onSelectionUnresolvable,
+    hitRegions: geometry.hitRegions,
+    interactionSuppressed: suppressesInteraction(status),
+    geometryReady: layout.measured && showData && geometry.hitRegions.length > 0
+  });
+  const handlePress = event => {
+    if (suppressesInteraction(status) || !props.onSelectionChange) {
+      return;
+    }
+    const {
+      locationX,
+      locationY
+    } = event.nativeEvent;
+    if (!containsPoint(geometry.plot, locationX, locationY)) {
+      return;
+    }
+    const hit = props.hitTestMode === 'byX' ? hitTestByX(geometry.hitRegions, locationX) : hitTest(geometry.hitRegions, locationX, locationY);
+    if (!hit) {
+      selection.select(null, null);
+      return;
+    }
+    const pointEvent = pointEventFor(props.datasource, hit.seriesId, hit.pointId);
+    if (pointEvent) {
+      selection.select({
+        seriesId: hit.seriesId,
+        pointId: hit.pointId
+      }, pointEvent);
+    }
+  };
+  const incomplete = geometry.incomplete || validation.totalIncomplete;
+  const interactive = props.accessibility?.interactive ?? Boolean(props.onSelectionChange);
+  const a11y = useChartA11y({
+    datasource: props.datasource,
+    family,
+    status,
+    title: props.title,
+    accessibility: props.accessibility,
+    interactive,
+    incomplete,
+    hitRegions: geometry.hitRegions,
+    selection,
+    formatters,
+    strings
+  });
+  const legendEnabled = props.legend === undefined ? props.defaultLegend ?? false : props.legend !== false;
+  const legendPosition = typeof props.legend === 'object' ? props.legend.position : 'bottom';
+  const legendLabel = formatters.legendLabel;
+  const legendEntries = useMemo(() => legendEnabled ? buildLegendEntries(props.datasource, theme, hidden, visibility.enabled, family, legendLabel) : [], [legendEnabled, props.datasource, theme, hidden, visibility.enabled, family, legendLabel]);
+  const legend = legendEnabled ? /*#__PURE__*/_jsx(ChartLegend, {
+    entries: legendEntries,
+    theme: theme,
+    onToggle: visibility.enabled ? visibility.toggle : undefined,
+    strings: strings
+  }) : null;
+  const plotHeight = useMemo(() => ({
+    height: props.height ?? DEFAULT_HEIGHT
+  }), [props.height]);
+  const content = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [props.title ? /*#__PURE__*/_jsx(Text, {
+      style: [styles.title, {
+        color: theme.typography.valueLabel.color,
+        fontSize: theme.typography.valueLabel.fontSize
+      }],
+      accessibilityRole: "header",
+      children: props.title
+    }) : null, legendPosition === 'top' ? legend : null, /*#__PURE__*/_jsx(View, {
+      accessible: true,
+      accessibilityRole: interactive ? 'adjustable' : 'image',
+      accessibilityLabel: a11y.summary,
+      accessibilityValue: a11y.value,
+      accessibilityActions: a11y.actions,
+      onAccessibilityAction: a11y.onAction,
+      children: /*#__PURE__*/_jsxs(View, {
+        style: [styles.plotArea, plotHeight],
+        onLayout: layout.onLayout,
+        children: [layout.measured && showData ? /*#__PURE__*/_jsx(Pressable, {
+          onPress: handlePress,
+          disabled: !props.onSelectionChange,
+          style: StyleSheet.absoluteFill,
+          accessible: false,
+          importantForAccessibility: "no-hide-descendants",
+          children: /*#__PURE__*/_jsxs(Svg, {
+            width: layout.size.width,
+            height: layout.size.height,
+            children: [/*#__PURE__*/_jsx(ChartPlot, {
+              geometry: geometry,
+              theme: theme,
+              fontSize: layout.fontSize,
+              axes: props.axes ?? 'full'
+            }), selection.resolved && /*#__PURE__*/_jsx(SelectionHighlight, {
+              x: selection.resolved.x,
+              y: selection.resolved.y,
+              color: theme.onSurface
+            })]
+          })
+        }) : null, !showData || error ? /*#__PURE__*/_jsx(ChartStateOverlay, {
+          status: status,
+          supplied: props.stateContent?.[status],
+          strings: strings,
+          theme: theme,
+          error: error
+        }) : null]
+      })
+    }), legendPosition === 'bottom' ? legend : null, geometry.colorScale && props.legend !== false ? /*#__PURE__*/_jsx(ColorScaleLegend, {
+      scale: geometry.colorScale,
+      theme: theme,
+      formatValue: formatters.geometry.formatValue,
+      strings: strings
+    }) : null, incomplete ? /*#__PURE__*/_jsx(Text, {
+      style: [styles.note, {
+        color: theme.muted,
+        fontSize: theme.typography.axisLabel.fontSize
+      }],
+      children: strings['chart.note.incomplete']
+    }) : null, props.footer]
+  });
+  return /*#__PURE__*/_jsx(View, {
+    style: [styles.container, {
+      backgroundColor: theme.surface
+    }, props.style],
+    children: /*#__PURE__*/_jsx(ChartBoundary, {
+      family: props.family,
+      chartId: props.chartId,
+      onFailure: props.onFailure,
+      resetKey: props.datasource,
+      renderFallback: containedError => /*#__PURE__*/_jsx(View, {
+        accessible: true,
+        accessibilityRole: "image",
+        accessibilityLabel: a11y.summary,
+        style: [styles.plotArea, plotHeight],
+        children: /*#__PURE__*/_jsx(ChartFailureOverlay, {
+          supplied: props.stateContent?.error,
+          theme: theme,
+          error: containedError
+        })
+      }),
+      children: content
+    })
+  });
+}
+const styles = StyleSheet.create({
+  // No outer margin: app content must be able to sit flush against a chart.
+  container: {
+    width: '100%'
+  },
+  title: {
+    fontWeight: '600',
+    marginBottom: 4
+  },
+  plotArea: {
+    width: '100%',
+    position: 'relative'
+  },
+  // Colour and type size are applied inline from ChartTheme, so they follow
+  // the consuming app's tokens and the system text scale (UX-001).
+  note: {
+    marginTop: 4
+  }
+});
+//# sourceMappingURL=ChartFrame.js.map

package/lib/module/react/ChartFrame.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useId","useMemo","Pressable","StyleSheet","Text","View","Svg","drawsData","suppressesInteraction","chartStrings","hitTest","hitTestByX","containsPoint","EMPTY_GEOMETRY","SelectionHighlight","ChartBoundary","ChartLegend","ColorScaleLegend","buildLegendEntries","ChartPlot","ChartFailureOverlay","ChartStateOverlay","useChartTheme","pointEventFor","useChartA11y","useChartFormatters","useChartLayout","useGeometryInput","useChartSelection","useSeriesVisibility","useChartStatus","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","DEFAULT_HEIGHT","ChartFrame","props","family","theme","strings","resolve","generatedId","instanceKey","chartId","validation","error","status","datasource","declared","onFailure","distributionValues","formatters","format","layout","height","geometryInput","geometry","showData","visibility","controlled","hiddenSeriesIds","onVisibilityChange","enabled","seriesToggleEnabled","initiallyHidden","series","filter","s","hidden","map","id","size","has","buildGeometry","measured","selection","onSelectionChange","onSelectionUnresolvable","hitRegions","interactionSuppressed","geometryReady","length","handlePress","event","locationX","locationY","nativeEvent","plot","hit","hitTestMode","select","pointEvent","seriesId","pointId","incomplete","totalIncomplete","interactive","accessibility","Boolean","a11y","title","legendEnabled","legend","undefined","defaultLegend","legendPosition","position","legendLabel","legendEntries","entries","onToggle","toggle","plotHeight","content","children","style","styles","color","typography","valueLabel","fontSize","accessibilityRole","accessible","accessibilityLabel","summary","accessibilityValue","value","accessibilityActions","actions","onAccessibilityAction","onAction","plotArea","onLayout","onPress","disabled","absoluteFill","importantForAccessibility","width","axes","resolved","x","y","onSurface","supplied","stateContent","colorScale","scale","formatValue","note","muted","axisLabel","footer","container","backgroundColor","surface","resetKey","renderFallback","containedError","create","fontWeight","marginBottom","marginTop"],"sourceRoot":"../../../src","sources":["react/ChartFrame.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/react/ChartLegend.js

@@ -0,0 +1,234 @@
+"use strict";
+
+/**
+ * Legend (FR-066).
+ *
+ * On by default for multi-series and multi-segment charts, disableable, and its
+ * model is exported so an app can render its own layout instead. Every entry
+ * carries a dash pattern as well as a colour, so series stay distinguishable
+ * without colour perception.
+ */
+import { formatMessage } from '@chipmobilesdk/rn-core';
+import React from 'react';
+import { Pressable, StyleSheet, Text, View } from 'react-native';
+import { chartStrings } from "../contract/strings.js";
+import { resolveSegmentColors, resolveSeriesColor, segmentKey } from "../contract/theme.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/** Minimum tap target, per platform accessibility guidance (UX-003). */
+const MIN_TAP_TARGET = 44;
+
+/**
+ * Legend model. A distribution chart gets one entry per segment, in the colour
+ * its arc is drawn in; it used to get one per series, so a one-series donut of
+ * four segments showed a single entry (CHT-02).
+ */
+export function buildLegendEntries(datasource, theme, hidden, toggleable, family, /** The app's `legendLabel` formatter, when it has one. */
+formatLabel = series => series.label) {
+  if (family === 'distribution') {
+    const colors = resolveSegmentColors(datasource, theme);
+    return datasource.series.flatMap(series => series.points.map(point => {
+      const single = series.points.length === 1;
+      let label = formatLabel({
+        id: series.id,
+        label: series.label
+      });
+      if (!single) {
+        label = point.position.kind === 'category' ? point.position.category : point.id;
+      }
+      return {
+        seriesId: series.id,
+        pointId: point.id,
+        label,
+        color: colors[segmentKey(series.id, point.id)],
+        pattern: 'solid',
+        visible: !hidden.has(series.id),
+        // Visibility is per series, so only a one-segment series toggles.
+        toggleable: toggleable && single
+      };
+    }));
+  }
+  return datasource.series.map((series, index) => ({
+    seriesId: series.id,
+    label: formatLabel({
+      id: series.id,
+      label: series.label
+    }),
+    color: resolveSeriesColor(theme, index, series.color),
+    pattern: series.pattern ?? 'solid',
+    visible: !hidden.has(series.id),
+    toggleable
+  }));
+}
+function keyOf(entry) {
+  return entry.pointId === undefined ? entry.seriesId : segmentKey(entry.seriesId, entry.pointId);
+}
+function segmentCountFor(pattern) {
+  switch (pattern) {
+    case 'dotted':
+      return 4;
+    case 'dashed':
+    case 'dashDot':
+      return 2;
+    default:
+      return 1;
+  }
+}
+function PatternSwatch({
+  entry,
+  theme
+}) {
+  // Dashes are drawn as gapped segments so the pattern reads at swatch size —
+  // this is what gives a series an identity beyond its colour (FR-064).
+  const segments = segmentCountFor(entry.pattern);
+  const gap = segments > 1 ? 1 : 0;
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.swatchRow,
+    children: Array.from({
+      length: segments
+    }, (_, i) => /*#__PURE__*/_jsx(View, {
+      style: [styles.swatchSegment, entry.visible ? styles.swatchVisible : styles.swatchHidden, {
+        width: 12 / segments - gap,
+        marginRight: gap,
+        backgroundColor: entry.visible ? entry.color : theme.muted
+      }]
+    }, i))
+  });
+}
+export function ChartLegend({
+  entries,
+  theme,
+  onToggle,
+  strings = chartStrings.defaults
+}) {
+  if (entries.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.container,
+    accessibilityRole: "list",
+    children: entries.map(entry => {
+      const content = /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(PatternSwatch, {
+          entry: entry,
+          theme: theme
+        }), /*#__PURE__*/_jsx(Text, {
+          style: [styles.label, {
+            color: entry.visible ? theme.typography.legendLabel.color : theme.muted,
+            fontSize: theme.typography.legendLabel.fontSize
+          }],
+          numberOfLines: 1,
+          children: entry.label
+        })]
+      });
+      if (!entry.toggleable || !onToggle) {
+        return /*#__PURE__*/_jsx(View, {
+          style: styles.entry,
+          accessibilityRole: "text",
+          children: content
+        }, keyOf(entry));
+      }
+      return /*#__PURE__*/_jsx(Pressable, {
+        onPress: () => onToggle(entry.seriesId),
+        accessibilityRole: "switch",
+        accessibilityState: {
+          checked: entry.visible
+        },
+        accessibilityLabel: entry.label,
+        accessibilityHint: entry.visible ? strings['chart.legend.hide'] : strings['chart.legend.show'],
+        style: [styles.entry, styles.tappable],
+        children: content
+      }, keyOf(entry));
+    })
+  });
+}
+
+/**
+ * The key to a colour ramp: its lowest and highest value around the colours
+ * between them. Without it a heatmap's shades meant nothing (CHT-15).
+ */
+export function ColorScaleLegend({
+  scale,
+  theme,
+  formatValue,
+  strings = chartStrings.defaults
+}) {
+  const min = formatValue(scale.min);
+  const max = formatValue(scale.max);
+  const text = {
+    color: theme.typography.legendLabel.color,
+    fontSize: theme.typography.legendLabel.fontSize
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.scale,
+    accessible: true,
+    accessibilityRole: "text",
+    accessibilityLabel: formatMessage(strings['chart.legend.scale'], {
+      min,
+      max
+    }),
+    children: [/*#__PURE__*/_jsx(Text, {
+      style: text,
+      children: min
+    }), /*#__PURE__*/_jsx(View, {
+      style: styles.scaleRamp,
+      children: scale.colors.map((color, index) => /*#__PURE__*/_jsx(View, {
+        style: [styles.scaleStep, {
+          backgroundColor: color
+        }]
+      }, `${index}-${color}`))
+    }), /*#__PURE__*/_jsx(Text, {
+      style: text,
+      children: max
+    })]
+  });
+}
+const styles = StyleSheet.create({
+  scale: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginTop: 4
+  },
+  scaleRamp: {
+    flexDirection: 'row',
+    marginHorizontal: 8
+  },
+  scaleStep: {
+    width: 16,
+    height: 8
+  },
+  container: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    alignItems: 'center'
+  },
+  entry: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginRight: 12,
+    marginTop: 4
+  },
+  tappable: {
+    minHeight: MIN_TAP_TARGET,
+    paddingVertical: 4
+  },
+  swatchRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    width: 12,
+    marginRight: 6
+  },
+  swatchSegment: {
+    height: 3,
+    borderRadius: 2
+  },
+  swatchVisible: {
+    opacity: 1
+  },
+  swatchHidden: {
+    opacity: 0.4
+  },
+  label: {
+    flexShrink: 1
+  }
+});
+//# sourceMappingURL=ChartLegend.js.map

package/lib/module/react/ChartLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["formatMessage","React","Pressable","StyleSheet","Text","View","chartStrings","resolveSegmentColors","resolveSeriesColor","segmentKey","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","MIN_TAP_TARGET","buildLegendEntries","datasource","theme","hidden","toggleable","family","formatLabel","series","label","colors","flatMap","points","map","point","single","length","id","position","kind","category","seriesId","pointId","color","pattern","visible","has","index","keyOf","entry","undefined","segmentCountFor","PatternSwatch","segments","gap","style","styles","swatchRow","children","Array","from","_","i","swatchSegment","swatchVisible","swatchHidden","width","marginRight","backgroundColor","muted","ChartLegend","entries","onToggle","strings","defaults","container","accessibilityRole","content","typography","legendLabel","fontSize","numberOfLines","onPress","accessibilityState","checked","accessibilityLabel","accessibilityHint","tappable","ColorScaleLegend","scale","formatValue","min","max","text","accessible","scaleRamp","scaleStep","create","flexDirection","alignItems","marginTop","marginHorizontal","height","flexWrap","minHeight","paddingVertical","borderRadius","opacity","flexShrink"],"sourceRoot":"../../../src","sources":["react/ChartLegend.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/react/ChartPlot.js

@@ -0,0 +1,56 @@
+"use strict";
+
+/**
+ * Everything the chart draws from its geometry.
+ *
+ * Memoized on the geometry: selecting a point re-renders the frame and moves
+ * the highlight, and this subtree — the long path strings — is skipped
+ * (CHT-08). It used to be reconciled again on every tap.
+ */
+import React from 'react';
+import { Grid, XAxis, YAxis } from "../render/Axis.js";
+import { GeometryLabels, MarkerLines, Marks, NonValueTextures } from "../render/Marks.js";
+
+/** `labels` names rows and columns without drawing axis lines or a grid. */
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export const ChartPlot = /*#__PURE__*/React.memo(function ChartPlot({
+  geometry,
+  theme,
+  fontSize,
+  axes
+}) {
+  const lines = axes === 'full';
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(NonValueTextures, {
+      theme: theme
+    }), axes !== 'none' && /*#__PURE__*/_jsxs(_Fragment, {
+      children: [lines && /*#__PURE__*/_jsx(Grid, {
+        plot: geometry.plot,
+        yTicks: geometry.yTicks,
+        theme: theme
+      }), /*#__PURE__*/_jsx(YAxis, {
+        plot: geometry.plot,
+        ticks: geometry.yTicks,
+        theme: theme,
+        fontSize: fontSize,
+        line: lines
+      }), /*#__PURE__*/_jsx(XAxis, {
+        plot: geometry.plot,
+        ticks: geometry.xTicks,
+        theme: theme,
+        fontSize: fontSize,
+        line: lines
+      })]
+    }), /*#__PURE__*/_jsx(Marks, {
+      paths: geometry.paths
+    }), /*#__PURE__*/_jsx(MarkerLines, {
+      markers: geometry.markers,
+      theme: theme
+    }), /*#__PURE__*/_jsx(GeometryLabels, {
+      labels: geometry.labels,
+      theme: theme,
+      fontSize: fontSize
+    })]
+  });
+});
+//# sourceMappingURL=ChartPlot.js.map

package/lib/module/react/ChartPlot.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Grid","XAxis","YAxis","GeometryLabels","MarkerLines","Marks","NonValueTextures","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ChartPlot","memo","geometry","theme","fontSize","axes","lines","children","plot","yTicks","ticks","line","xTicks","paths","markers","labels"],"sourceRoot":"../../../src","sources":["react/ChartPlot.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAIzB,SAASC,IAAI,EAAEC,KAAK,EAAEC,KAAK,QAAQ,mBAAgB;AACnD,SAASC,cAAc,EAAEC,WAAW,EAAEC,KAAK,EAAEC,gBAAgB,QAAQ,oBAAiB;;AAEtF;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAGA,OAAO,MAAMC,SAAS,gBAAGd,KAAK,CAACe,IAAI,CAAC,SAASD,SAASA,CAAC;EACtDE,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC;AAMD,CAAC,EAAE;EACF,MAAMC,KAAK,GAAGD,IAAI,KAAK,MAAM;EAC7B,oBACCN,KAAA,CAAAF,SAAA;IAAAU,QAAA,gBACCZ,IAAA,CAACF,gBAAgB;MAACU,KAAK,EAAEA;IAAM,CAAE,CAAC,EACjCE,IAAI,KAAK,MAAM,iBACfN,KAAA,CAAAF,SAAA;MAAAU,QAAA,GACED,KAAK,iBAAIX,IAAA,CAACR,IAAI;QAACqB,IAAI,EAAEN,QAAQ,CAACM,IAAK;QAACC,MAAM,EAAEP,QAAQ,CAACO,MAAO;QAACN,KAAK,EAAEA;MAAM,CAAE,CAAC,eAC9ER,IAAA,CAACN,KAAK;QACLmB,IAAI,EAAEN,QAAQ,CAACM,IAAK;QACpBE,KAAK,EAAER,QAAQ,CAACO,MAAO;QACvBN,KAAK,EAAEA,KAAM;QACbC,QAAQ,EAAEA,QAAS;QACnBO,IAAI,EAAEL;MAAM,CACZ,CAAC,eACFX,IAAA,CAACP,KAAK;QACLoB,IAAI,EAAEN,QAAQ,CAACM,IAAK;QACpBE,KAAK,EAAER,QAAQ,CAACU,MAAO;QACvBT,KAAK,EAAEA,KAAM;QACbC,QAAQ,EAAEA,QAAS;QACnBO,IAAI,EAAEL;MAAM,CACZ,CAAC;IAAA,CACD,CACF,eACDX,IAAA,CAACH,KAAK;MAACqB,KAAK,EAAEX,QAAQ,CAACW;IAAM,CAAE,CAAC,eAChClB,IAAA,CAACJ,WAAW;MAACuB,OAAO,EAAEZ,QAAQ,CAACY,OAAQ;MAACX,KAAK,EAAEA;IAAM,CAAE,CAAC,eACxDR,IAAA,CAACL,cAAc;MAACyB,MAAM,EAAEb,QAAQ,CAACa,MAAO;MAACZ,KAAK,EAAEA,KAAM;MAACC,QAAQ,EAAEA;IAAS,CAAE,CAAC;EAAA,CAC5E,CAAC;AAEL,CAAC,CAAC","ignoreList":[]}