@lockin90/ui-native 0.0.0-stage → 1.0.1

package/lib/module/components/BarFill.js

@@ -0,0 +1,51 @@
+"use strict";
+
+import { View, StyleSheet } from 'react-native';
+import { LinearGradient } from 'expo-linear-gradient';
+import { gradients } from '@lockin90/tokens';
+
+/** Fill gradient — one of the `@lockin90/tokens` gradient tokens. */
+import { jsx as _jsx } from "react/jsx-runtime";
+/** Thin gradient progress bar. */
+export function BarFill({
+  value,
+  height = 8,
+  gradient = 'cta',
+  style,
+  ...rest
+}) {
+  const v = Math.max(0, Math.min(1, value));
+  const pct = `${v * 100}%`;
+  const stops = gradients[gradient].stops;
+  return /*#__PURE__*/_jsx(View, {
+    style: [styles.track, {
+      height,
+      borderRadius: height
+    }, style],
+    ...rest,
+    children: /*#__PURE__*/_jsx(LinearGradient, {
+      colors: stops,
+      start: {
+        x: 0,
+        y: 0
+      },
+      end: {
+        x: 1,
+        y: 0
+      },
+      style: {
+        height: '100%',
+        width: pct,
+        borderRadius: height
+      }
+    })
+  });
+}
+const styles = StyleSheet.create({
+  track: {
+    width: '100%',
+    backgroundColor: 'rgba(255,255,255,0.06)',
+    overflow: 'hidden'
+  }
+});
+//# sourceMappingURL=BarFill.js.map

package/lib/module/components/BarFill.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","StyleSheet","LinearGradient","gradients","jsx","_jsx","BarFill","value","height","gradient","style","rest","v","Math","max","min","pct","stops","styles","track","borderRadius","children","colors","start","x","y","end","width","create","backgroundColor","overflow"],"sourceRoot":"../../../src","sources":["components/BarFill.tsx"],"mappings":";;AAAA,SAASA,IAAI,EAAEC,UAAU,QAA6C,cAAc;AACpF,SAASC,cAAc,QAAQ,sBAAsB;AACrD,SAASC,SAAS,QAAQ,kBAAkB;;AAE5C;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAaA;AACA,OAAO,SAASC,OAAOA,CAAC;EAAEC,KAAK;EAAEC,MAAM,GAAG,CAAC;EAAEC,QAAQ,GAAG,KAAK;EAAEC,KAAK;EAAE,GAAGC;AAAmB,CAAC,EAAE;EAC7F,MAAMC,CAAC,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,GAAG,CAAC,CAAC,EAAER,KAAK,CAAC,CAAC;EACzC,MAAMS,GAAG,GAAG,GAAGJ,CAAC,GAAG,GAAG,GAAqB;EAC3C,MAAMK,KAAK,GAAGd,SAAS,CAACM,QAAQ,CAAC,CAACQ,KAA0D;EAC5F,oBACEZ,IAAA,CAACL,IAAI;IAACU,KAAK,EAAE,CAACQ,MAAM,CAACC,KAAK,EAAE;MAAEX,MAAM;MAAEY,YAAY,EAAEZ;IAAO,CAAC,EAAEE,KAAK,CAAE;IAAA,GAAKC,IAAI;IAAAU,QAAA,eAC5EhB,IAAA,CAACH,cAAc;MACboB,MAAM,EAAEL,KAAM;MACdM,KAAK,EAAE;QAAEC,CAAC,EAAE,CAAC;QAAEC,CAAC,EAAE;MAAE,CAAE;MACtBC,GAAG,EAAE;QAAEF,CAAC,EAAE,CAAC;QAAEC,CAAC,EAAE;MAAE,CAAE;MACpBf,KAAK,EAAE;QAAEF,MAAM,EAAE,MAAM;QAAEmB,KAAK,EAAEX,GAAG;QAAEI,YAAY,EAAEZ;MAAO;IAAE,CAC7D;EAAC,CACE,CAAC;AAEX;AAEA,MAAMU,MAAM,GAAGjB,UAAU,CAAC2B,MAAM,CAAC;EAC/BT,KAAK,EAAE;IAAEQ,KAAK,EAAE,MAAM;IAAEE,eAAe,EAAE,wBAAwB;IAAEC,QAAQ,EAAE;EAAS;AACxF,CAAC,CAAC","ignoreList":[]}

package/lib/module/components/BeeswarmChart.js

@@ -0,0 +1,610 @@
+"use strict";
+
+import { useId } from 'react';
+import { View, StyleSheet } from 'react-native';
+import Svg, { Circle, Defs, FeGaussianBlur, Filter, G, Line, Rect, Text as SvgText } from 'react-native-svg';
+import { colors, fonts } from '@lockin90/tokens';
+
+/* BeeswarmChart — the shared catalog beeswarm family (BW-01…BW-04,
+   lockin90-design/charts/beeswarm-charts.html): every session is a dot — your
+   whole history in one swarm along a value axis, drawn in a fixed 320×150
+   viewBox. Placement is the catalog's greedy collision-free algorithm ported
+   verbatim (sort by x, first non-colliding vertical offset wins). Native twin
+   of `@lockin90/ui` BeeswarmChart — same prop API; glows are real
+   Gaussian-blurred duplicates (Fabric-native SVG filters in react-native-svg
+   15) and the BW-02 TODAY pulse is a static duplicate halo (no CSS animation
+   on native). */
+
+/* BW-04 — two swarms stacked on a shared axis + mean ticks + delta pill */
+
+/** One swarm dot: a session/day value on the x axis. */
+
+/** One `month-swarm` row: a labeled swarm sharing the axis. */
+
+/** An x-axis tick: a domain value + its label. */
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/* ---- catalog geometry (viewBox units — charts/catalog.js + beeswarm page) ---- */
+const W = 320;
+const H = 150;
+const PAD = {
+  l: 10,
+  r: 12,
+  t: 16,
+  b: 14
+};
+/** Dot radius the swarm packs with (drawn radius can differ — BW-04 draws 2.8). */
+const R = 3.1;
+
+/** Round for compact attribute values. */
+const rd = n => Math.round(n * 100) / 100;
+
+/** Zone verdict color for a 0–100 value (same thresholds as the catalog). */
+const zoneColor = v => v >= 62 ? colors.zoneHigh : v >= 38 ? colors.zoneMid : colors.zoneLow;
+
+/** The catalog's deterministic PRNG — the default demo data reproduces the
+ *  design page dot-for-dot (seeds 7 / 11 / 13 / 21 / 22). */
+function mulberry32(a) {
+  return () => {
+    a |= 0;
+    a = a + 0x6d2b79f5 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+/** Greedy beeswarm (ported from the catalog): sort by x; for each dot try
+ *  vertical offsets 0, ±STEP, ±2·STEP … and keep the first that doesn't
+ *  collide with an already-placed dot. If all 24 offsets collide the dot is
+ *  placed at the last offset anyway (the catalog drops it — we never lose data). */
+function swarm(xs, cy) {
+  const step = R * 2 + 0.6;
+  const minD = 2 * R + 0.4;
+  const order = xs.map((x, i) => ({
+    x,
+    i
+  })).sort((a, b) => a.x - b.x);
+  const placed = [];
+  const out = new Array(xs.length);
+  for (const o of order) {
+    let py = cy;
+    for (let k = 0; k < 24; k++) {
+      const y = cy + (k % 2 ? -1 : 1) * Math.ceil(k / 2) * step;
+      py = y;
+      let ok = true;
+      for (let j = placed.length - 1; j >= 0; j--) {
+        const p = placed[j];
+        if (o.x - p.x > minD) break; // placed stays x-sorted
+        const dx = o.x - p.x;
+        const dy = y - p.y;
+        if (dx * dx + dy * dy < minD * minD) {
+          ok = false;
+          break;
+        }
+      }
+      if (ok) break;
+    }
+    placed.push({
+      x: o.x,
+      y: py
+    });
+    out[o.i] = {
+      x: o.x,
+      y: py
+    };
+  }
+  return out;
+}
+
+/* ---- per-variant catalog layout ---- */
+const LAYOUT = {
+  'history-swarm': {
+    x0: 26,
+    x1: 226,
+    cy: 74,
+    axisY: 126
+  },
+  'score-swarm': {
+    x0: 26,
+    x1: 292,
+    cy: 78,
+    axisY: 130
+  },
+  'pr-swarm': {
+    x0: 26,
+    x1: 250,
+    cy: 76,
+    axisY: 126
+  },
+  'month-swarm': {
+    x0: 46,
+    x1: 292,
+    cy: 52,
+    axisY: 136
+  } // second row at cy 106
+};
+const DEFAULT_DOMAINS = {
+  'history-swarm': [15, 95],
+  'score-swarm': [0, 100],
+  'pr-swarm': [55, 115],
+  'month-swarm': [15, 95]
+};
+const DEFAULT_TICKS = {
+  'history-swarm': [{
+    value: 20,
+    label: '20M'
+  }, {
+    value: 40,
+    label: '40M'
+  }, {
+    value: 60,
+    label: '60M'
+  }, {
+    value: 80,
+    label: '80M'
+  }],
+  'score-swarm': [0, 25, 50, 75, 100].map(v => ({
+    value: v,
+    label: String(v)
+  })),
+  'pr-swarm': [{
+    value: 60,
+    label: '60KG'
+  }, {
+    value: 80,
+    label: '80KG'
+  }, {
+    value: 100,
+    label: '100KG'
+  }],
+  'month-swarm': [{
+    value: 30,
+    label: '30M'
+  }, {
+    value: 50,
+    label: '50M'
+  }, {
+    value: 70,
+    label: '70M'
+  }]
+};
+
+/* ---- the catalog demo data (same seeds → dot-for-dot parity) ---- */
+function historyDefaults() {
+  const r = mulberry32(7);
+  const pts = [];
+  for (let i = 0; i < 60; i++) {
+    const value = 20 + 70 * (r() * 0.5 + r() * 0.5); // minutes 20..90
+    const tv = r();
+    pts.push({
+      value,
+      series: tv < 0.5 ? 0 : tv < 0.82 ? 1 : 2,
+      ring: i >= 55
+    });
+  }
+  return pts;
+}
+function scoreDefaults() {
+  const r = mulberry32(11);
+  const pts = [];
+  for (let i = 0; i < 50; i++) pts.push({
+    value: Math.round(28 + 66 * (r() * 0.5 + r() * 0.5))
+  });
+  pts[49] = {
+    value: 72,
+    hero: true
+  };
+  return pts;
+}
+function prDefaults() {
+  const r = mulberry32(13);
+  const pts = [];
+  for (let i = 0; i < 40; i++) pts.push({
+    value: 62 + 40 * (r() * 0.6 + r() * 0.4)
+  });
+  pts[39] = {
+    value: 110,
+    hero: true
+  };
+  return pts;
+}
+function monthDefaults() {
+  const gen = (seed, boost) => {
+    const r = mulberry32(seed);
+    const v = [];
+    for (let q = 0; q < 30; q++) v.push(22 + 62 * (r() * 0.5 + r() * 0.5) + boost);
+    return v;
+  };
+  return [{
+    label: 'JUN',
+    values: gen(21, 6)
+  }, {
+    label: 'MAY',
+    values: gen(22, 0)
+  }];
+}
+const DEFAULT_POINTS = {
+  'history-swarm': historyDefaults(),
+  'score-swarm': scoreDefaults(),
+  'pr-swarm': prDefaults()
+};
+const DEFAULT_GROUPS = monthDefaults();
+const DEFAULT_SERIES_LABELS = ['STRENGTH', 'CARDIO', 'MOBILITY'];
+const DEFAULT_PALETTE = [colors.violet, colors.cyan, colors.lime];
+
+/** Mono catalog label (8.5px JetBrains Mono, ~.06em tracking). */
+function Label({
+  x,
+  y,
+  fill,
+  anchor = 'middle',
+  children
+}) {
+  return /*#__PURE__*/_jsx(SvgText, {
+    x: rd(x),
+    y: rd(y),
+    fill: fill,
+    textAnchor: anchor,
+    fontSize: 8.5,
+    fontFamily: fonts.mono,
+    letterSpacing: 0.5,
+    children: children
+  });
+}
+
+/** Chip-pill annotation (dark rounded rect + tinted hairline + mono text). */
+function Tag({
+  x,
+  y,
+  color,
+  anchor = 'middle',
+  children
+}) {
+  const w = children.length * 5.35 + 12;
+  let xa = anchor === 'end' ? x - w : anchor === 'start' ? x : x - w / 2;
+  xa = Math.max(PAD.l - 4, Math.min(xa, W - PAD.r - w + 4));
+  return /*#__PURE__*/_jsxs(G, {
+    children: [/*#__PURE__*/_jsx(Rect, {
+      x: rd(xa),
+      y: rd(y - 6.5),
+      width: rd(w),
+      height: 13,
+      rx: 6.5,
+      fill: colors.bg0,
+      fillOpacity: 0.78,
+      stroke: color,
+      strokeOpacity: 0.35,
+      strokeWidth: 0.8
+    }), /*#__PURE__*/_jsx(SvgText, {
+      x: rd(xa + w / 2),
+      y: rd(y + 2.8),
+      fill: color,
+      textAnchor: "middle",
+      fontSize: 8,
+      fontFamily: fonts.mono,
+      letterSpacing: 0.4,
+      children: children
+    })]
+  });
+}
+
+/** The x axis: hairline + value ticks + labels (the catalog axis()). */
+function Axis({
+  x0,
+  x1,
+  y,
+  ticks,
+  domain
+}) {
+  const span = domain[1] - domain[0] || 1;
+  return /*#__PURE__*/_jsxs(G, {
+    children: [/*#__PURE__*/_jsx(Line, {
+      x1: x0,
+      x2: x1,
+      y1: y,
+      y2: y,
+      stroke: colors.text,
+      strokeOpacity: 0.12,
+      strokeWidth: 1
+    }), ticks.map((t, i) => {
+      const tx = x0 + (x1 - x0) * (t.value - domain[0]) / span;
+      return /*#__PURE__*/_jsxs(G, {
+        children: [/*#__PURE__*/_jsx(Line, {
+          x1: rd(tx),
+          x2: rd(tx),
+          y1: y - 2,
+          y2: y + 2,
+          stroke: colors.text,
+          strokeOpacity: 0.2,
+          strokeWidth: 1
+        }), /*#__PURE__*/_jsx(Label, {
+          x: tx,
+          y: y + 11,
+          fill: colors.textFaint,
+          children: t.label
+        })]
+      }, i);
+    })]
+  });
+}
+
+/**
+ * BeeswarmChart — dot-swarm distribution chart for product surfaces (catalog
+ * family BW-01…BW-04). `history-swarm` is THE training-history overview:
+ * every session is a dot along the duration axis, colored by type, this week
+ * ringed white. `score-swarm` places TODAY (pilled, static halo on native)
+ * inside your own score distribution, `pr-swarm` celebrates one glowing PR
+ * dot, `month-swarm` stacks two months on a shared axis with mean ticks and
+ * a delta pill.
+ */
+export function BeeswarmChart({
+  variant = 'history-swarm',
+  points,
+  groups,
+  domain,
+  ticks,
+  seriesLabels = DEFAULT_SERIES_LABELS,
+  palette = DEFAULT_PALETTE,
+  note,
+  caption,
+  endLabel,
+  title,
+  shine = false,
+  ariaLabel = 'Beeswarm chart',
+  style
+}) {
+  const uid = useId().replace(/[^a-zA-Z0-9]/g, '');
+  const blurId = `lk-swarm-blur-${uid}`;
+  const L = LAYOUT[variant];
+  const dom = domain ?? DEFAULT_DOMAINS[variant];
+  const axisTicks = ticks ?? DEFAULT_TICKS[variant];
+  const span = dom[1] - dom[0] || 1;
+  const xOf = v => L.x0 + (L.x1 - L.x0) * (v - dom[0]) / span;
+  const usingDefaultPoints = points === undefined;
+  const pts = variant === 'month-swarm' ? [] : points ?? DEFAULT_POINTS[variant];
+  const rows = variant === 'month-swarm' ? (groups ?? DEFAULT_GROUPS).slice(0, 2) : [];
+
+  /* shine underlay — a Gaussian-blurred faint duplicate behind a dot: the
+     native twin of the web helper's `blur(4px)` underlay. (Un-blurred wide
+     copies read as hard outlines on device.) */
+  const glow = (x, y, r, fill, key) => /*#__PURE__*/_jsx(Circle, {
+    cx: rd(x),
+    cy: rd(y),
+    r: rd(r),
+    fill: fill,
+    opacity: 0.4,
+    filter: `url(#${blurId})`
+  }, key);
+  let body = null;
+  if (variant === 'history-swarm') {
+    /* ---- BW-01 · the training-history swarm ---- */
+    const dots = swarm(pts.map(p => xOf(p.value)), L.cy);
+    const resolvedCaption = caption ?? (pts.some(p => p.ring) ? '○ = THIS WEEK' : undefined);
+    body = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [shine ? dots.map((d, i) => glow(d.x, d.y, R + 2.5, palette[(pts[i].series ?? 0) % palette.length], `g${i}`)) : null, dots.map((d, i) => /*#__PURE__*/_jsx(Circle, {
+        cx: rd(d.x),
+        cy: rd(d.y),
+        r: R,
+        fill: palette[(pts[i].series ?? 0) % palette.length],
+        opacity: 0.85,
+        stroke: pts[i].ring ? colors.text : undefined,
+        strokeOpacity: pts[i].ring ? 0.95 : undefined,
+        strokeWidth: pts[i].ring ? 1.2 : undefined
+      }, i)), /*#__PURE__*/_jsx(Axis, {
+        x0: L.x0,
+        x1: L.x1,
+        y: L.axisY,
+        ticks: axisTicks,
+        domain: dom
+      }), seriesLabels.map((lg, i) => /*#__PURE__*/_jsxs(G, {
+        children: [/*#__PURE__*/_jsx(Circle, {
+          cx: 246,
+          cy: 46 + i * 18,
+          r: 3.5,
+          fill: palette[i % palette.length]
+        }), /*#__PURE__*/_jsx(Label, {
+          x: 254,
+          y: 49 + i * 18,
+          fill: colors.textDim,
+          anchor: "start",
+          children: lg
+        })]
+      }, lg)), resolvedCaption ? /*#__PURE__*/_jsx(Label, {
+        x: 246,
+        y: 106,
+        fill: colors.textDim,
+        anchor: "start",
+        children: resolvedCaption
+      }) : null]
+    });
+  } else if (variant === 'score-swarm') {
+    /* ---- BW-02 · you vs your own history (TODAY — static halo on native) ---- */
+    const heroIdx = (() => {
+      const h = pts.findIndex(p => p.hero);
+      return h >= 0 ? h : pts.length - 1;
+    })();
+    const dots = swarm(pts.map(p => xOf(p.value)), L.cy);
+    const hero = dots[heroIdx];
+    const resolvedNote = note ?? (pts.length ? `TODAY · ${Math.round(pts[heroIdx].value)}` : undefined);
+    body = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [shine ? dots.map((d, i) => i === heroIdx ? null : glow(d.x, d.y, R + 2.5, zoneColor(pts[i].value), `g${i}`)) : null, dots.map((d, i) => i === heroIdx ? null : /*#__PURE__*/_jsx(Circle, {
+        cx: rd(d.x),
+        cy: rd(d.y),
+        r: R,
+        fill: zoneColor(pts[i].value),
+        opacity: 0.8
+      }, i)), hero ? /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(Circle, {
+          cx: rd(hero.x),
+          cy: rd(hero.y),
+          r: 7,
+          fill: "none",
+          stroke: colors.text,
+          strokeWidth: 1.4,
+          strokeOpacity: 0.4
+        }), /*#__PURE__*/_jsx(Circle, {
+          cx: rd(hero.x),
+          cy: rd(hero.y),
+          r: 3.6,
+          fill: colors.text
+        }), resolvedNote ? /*#__PURE__*/_jsx(Tag, {
+          x: hero.x,
+          y: hero.y - 16,
+          color: colors.mint,
+          children: resolvedNote
+        }) : null]
+      }) : null, /*#__PURE__*/_jsx(Axis, {
+        x0: L.x0,
+        x1: L.x1,
+        y: L.axisY,
+        ticks: axisTicks,
+        domain: dom
+      })]
+    });
+  } else if (variant === 'pr-swarm') {
+    /* ---- BW-03 · one hero dot (the PR glows — Gaussian-blurred duplicate) ---- */
+    const heroIdx = (() => {
+      const h = pts.findIndex(p => p.hero);
+      if (h >= 0) return h;
+      let best = 0;
+      pts.forEach((p, i) => {
+        if (p.value > (pts[best]?.value ?? -Infinity)) best = i;
+      });
+      return best;
+    })();
+    const dots = swarm(pts.map(p => xOf(p.value)), L.cy);
+    const hero = dots[heroIdx];
+    const resolvedNote = note ?? (pts.length ? `PR · ${Math.round(pts[heroIdx].value)}` : undefined);
+    const resolvedEnd = endLabel ?? (usingDefaultPoints ? 'SQUAT' : undefined);
+    body = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [dots.map((d, i) => i === heroIdx ? null : /*#__PURE__*/_jsx(Circle, {
+        cx: rd(d.x),
+        cy: rd(d.y),
+        r: R,
+        fill: colors.text,
+        opacity: 0.35
+      }, i)), hero ? /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(Circle, {
+          cx: rd(hero.x),
+          cy: rd(hero.y),
+          r: 7,
+          fill: colors.mint,
+          opacity: 0.6,
+          filter: `url(#${blurId})`
+        }), /*#__PURE__*/_jsx(Circle, {
+          cx: rd(hero.x),
+          cy: rd(hero.y),
+          r: 4.2,
+          fill: colors.mint
+        }), resolvedNote ? /*#__PURE__*/_jsx(Tag, {
+          x: hero.x - 2,
+          y: hero.y - 18,
+          color: colors.mint,
+          children: resolvedNote
+        }) : null]
+      }) : null, /*#__PURE__*/_jsx(Axis, {
+        x0: L.x0,
+        x1: L.x1,
+        y: L.axisY,
+        ticks: axisTicks,
+        domain: dom
+      }), resolvedEnd ? /*#__PURE__*/_jsx(Label, {
+        x: 282,
+        y: 76,
+        fill: colors.textDim,
+        children: resolvedEnd
+      }) : null]
+    });
+  } else {
+    /* ---- BW-04 · month vs month on a shared axis ---- */
+    const cys = [52, 106];
+    const meansX = [];
+    const rendered = rows.map((g, gi) => {
+      const cy = cys[gi] ?? 106;
+      const col = g.color ?? (gi === 0 ? colors.mint : colors.text);
+      const fillOp = g.color ? 1 : gi === 0 ? 1 : 0.5;
+      const op = gi === 0 ? 0.85 : 0.7;
+      const dots = swarm(g.values.map(xOf), cy);
+      const mean = g.values.length ? g.values.reduce((a, b) => a + b, 0) / g.values.length : dom[0];
+      const mx = xOf(mean);
+      meansX.push(mx);
+      return /*#__PURE__*/_jsxs(G, {
+        children: [shine ? dots.map((d, i) => glow(d.x, d.y, 2.8 + 2.5, col, `g${gi}-${i}`)) : null, dots.map((d, i) => /*#__PURE__*/_jsx(Circle, {
+          cx: rd(d.x),
+          cy: rd(d.y),
+          r: 2.8,
+          fill: col,
+          fillOpacity: fillOp,
+          opacity: op
+        }, i)), /*#__PURE__*/_jsx(Line, {
+          x1: rd(mx),
+          x2: rd(mx),
+          y1: cy - 15,
+          y2: cy + 15,
+          stroke: col,
+          strokeOpacity: rd(fillOp * 0.9),
+          strokeWidth: 1.6
+        }), /*#__PURE__*/_jsx(Label, {
+          x: 26,
+          y: cy + 3,
+          fill: gi === 0 ? col : colors.textDim,
+          anchor: "start",
+          children: g.label
+        })]
+      }, gi);
+    });
+    const meanOf = g => g && g.values.length ? g.values.reduce((a, b) => a + b, 0) / g.values.length : 0;
+    const delta = meanOf(rows[0]) - meanOf(rows[1]);
+    const resolvedNote = note ?? (rows.length >= 2 ? `${delta >= 0 ? '+' : ''}${Math.round(delta)} MIN AVG` : undefined);
+    body = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [rendered, /*#__PURE__*/_jsx(Axis, {
+        x0: L.x0,
+        x1: L.x1,
+        y: L.axisY,
+        ticks: axisTicks,
+        domain: dom
+      }), resolvedNote && meansX.length >= 2 ? /*#__PURE__*/_jsx(Tag, {
+        x: (meansX[0] + meansX[1]) / 2 + 30,
+        y: 24,
+        color: colors.mint,
+        children: resolvedNote
+      }) : null]
+    });
+  }
+  return /*#__PURE__*/_jsx(View, {
+    accessibilityRole: "image",
+    accessibilityLabel: ariaLabel,
+    style: [styles.root, style],
+    children: /*#__PURE__*/_jsxs(Svg, {
+      width: "100%",
+      height: "100%",
+      viewBox: `0 0 ${W} ${H}`,
+      children: [/*#__PURE__*/_jsx(Defs, {
+        children: /*#__PURE__*/_jsx(Filter, {
+          id: blurId,
+          filterUnits: "userSpaceOnUse",
+          x: -10,
+          y: -10,
+          width: W + 20,
+          height: H + 20,
+          children: /*#__PURE__*/_jsx(FeGaussianBlur, {
+            stdDeviation: 2
+          })
+        })
+      }), title ? /*#__PURE__*/_jsx(Label, {
+        x: PAD.l + 2,
+        y: 11,
+        fill: colors.textFaint,
+        anchor: "start",
+        children: title
+      }) : null, body]
+    })
+  });
+}
+const styles = StyleSheet.create({
+  /* fixed catalog aspect (320×150); the Svg scales the viewBox to fit */
+  root: {
+    width: '100%',
+    aspectRatio: W / H
+  }
+});
+//# sourceMappingURL=BeeswarmChart.js.map