@alfadocs/ui-kit-debug 1.28.3 → 1.30.0

package/dist/_chunks/{sparkline-BmGcEyZO.js → sparkline-Dx_sxK3J.js}

@@ -1,25 +1,25 @@
-import { jsx as c, jsxs as V } from "react/jsx-runtime";
-import { forwardRef as pe, useId as ue, useMemo as A, useRef as z, useState as W, useEffect as S, useImperativeHandle as he } from "react";
-import { c as K } from "./index-D2ZczOXr.js";
-import { useTranslation as me } from "react-i18next";
-import ge from "react-apexcharts";
-import E from "apexcharts";
-import { g as Q, u as fe } from "./apexcharts-theme-B_AxGC_h.js";
-import { m as ye } from "./annotation-marker-CsUJGZjQ.js";
-import { u as be } from "./registry-DvAUVLHh.js";
-function ve(t) {
-  if (t.length < 2)
+import { jsx as u, jsxs as K } from "react/jsx-runtime";
+import { forwardRef as ve, useId as we, useMemo as _, useRef as k, useState as $, useEffect as H, useImperativeHandle as ke } from "react";
+import { c as j } from "./index-D2ZczOXr.js";
+import { useTranslation as xe } from "react-i18next";
+import Ie from "react-apexcharts";
+import P from "apexcharts";
+import { g as re, u as Ne } from "./apexcharts-theme-B_AxGC_h.js";
+import { m as Re } from "./annotation-marker-CsUJGZjQ.js";
+import { u as Me } from "./registry-DvAUVLHh.js";
+function Te(n) {
+  if (n.length < 2)
     return { slope: 0, direction: "steady" };
-  const a = t.length, m = (a - 1) / 2, l = t.reduce((r, i) => r + i, 0) / a;
-  let s = 0, p = 0;
-  for (let r = 0; r < a; r++) {
-    const i = r - m;
-    s += i * (t[r] - l), p += i * i;
+  const r = n.length, g = (r - 1) / 2, p = n.reduce((c, d) => c + d, 0) / r;
+  let a = 0, h = 0;
+  for (let c = 0; c < r; c++) {
+    const d = c - g;
+    a += d * (n[c] - p), h += d * d;
   }
-  const h = p === 0 ? 0 : s / p, k = 0.01 * (Math.max(...t) - Math.min(...t) || 1), g = Math.abs(h) < k ? "steady" : h > 0 ? "increasing" : "decreasing";
-  return { slope: h, direction: g };
+  const f = h === 0 ? 0 : a / h, N = 0.01 * (Math.max(...n) - Math.min(...n) || 1), b = Math.abs(f) < N ? "steady" : f > 0 ? "increasing" : "decreasing";
+  return { slope: f, direction: b };
 }
-const we = {
+const Ce = {
   id: "sparkline",
   capabilities: [],
   // `select_annotation` enforces two preconditions silently and
@@ -39,19 +39,19 @@ const we = {
       type: "string[]",
       descriptionKey: "ui.agent.sparkline.state.annotationIds",
       description: "Ids of the annotations currently drawn, in declaration order. The only ids `select_annotation` will accept — check against this before calling. Ids only, never annotation labels.",
-      read: (t) => t.getAnnotationIds()
+      read: (n) => n.getAnnotationIds()
     },
     selectable: {
       type: "boolean",
       descriptionKey: "ui.agent.sparkline.state.selectable",
       description: "True when the host wired an annotation-select handler. False means every `select_annotation` call is a no-op, whatever id is passed.",
-      read: (t) => t.isSelectable()
+      read: (n) => n.isSelectable()
     },
     pointCount: {
       type: "number",
       descriptionKey: "ui.agent.sparkline.state.pointCount",
       description: "Number of positions in the currently rendered series, unmeasured gaps included — reflecting whichever applied last, the `data` prop or an `update_series` call. A count only; the plotted values are never exposed.",
-      read: (t) => t.getPointCount()
+      read: (n) => n.getPointCount()
     }
   },
   actions: {
@@ -73,9 +73,12 @@ const we = {
       },
       idempotent: !0,
       descriptionKey: "ui.agent.sparkline.actions.updateSeries",
-      description: "Replace the sparkline data without remounting. Writes straight into ApexCharts, bypassing React — read the `pointCount` slot back rather than expecting the host tree to reflect it.",
-      invoke: (t, a) => {
-        t.updateSeries(a.data);
+      description: "Replace the sparkline data without remounting. Writes straight into ApexCharts, bypassing React — read the `pointCount` slot back rather than expecting the host tree to reflect it. Host-supplied point labels are not updated, so the tooltip title is hidden after this call.",
+      errors: [
+        "Per-point tooltip titles are hidden after this call — the host point labels describe the previous series, not the one written."
+      ],
+      invoke: (n, r) => {
+        n.updateSeries(r.data);
       }
     },
     export_png: {
@@ -88,7 +91,7 @@ const we = {
       },
       descriptionKey: "ui.agent.sparkline.actions.exportPng",
       description: "Return a PNG data URI of the sparkline.",
-      invoke: (t) => t.dataURI()
+      invoke: (n) => n.dataURI()
     },
     select_annotation: {
       // Routes the host somewhere — the same thing a pointer press on the
@@ -113,8 +116,8 @@ const we = {
         "Silently ignored when `selectable` is false — the host wired no annotation-select handler.",
         "Silently ignored when the id is not in `annotationIds` — that annotation is not currently drawn."
       ],
-      invoke: (t, a) => {
-        t.selectAnnotation(a.annotationId);
+      invoke: (n, r) => {
+        n.selectAnnotation(r.annotationId);
       }
     }
   },
@@ -126,7 +129,7 @@ const we = {
       description: "Sourced from the id prop."
     }
   }
-}, X = K("ds:relative ds:inline-block ds:w-full", {
+}, ae = j("ds:relative ds:inline-block ds:w-full", {
   variants: {
     size: {
       xs: "ds:h-6",
@@ -138,7 +141,7 @@ const we = {
     }
   },
   defaultVariants: { size: "md" }
-}), Y = K("", {
+}), se = j("", {
   variants: {
     tone: {
       neutral: "ds:[--annotation-color:var(--muted-foreground)]",
@@ -153,7 +156,7 @@ const we = {
     }
   },
   defaultVariants: { tone: "neutral" }
-}), ke = K(
+}), Ae = j(
   "ds:pointer-events-none ds:absolute ds:inset-x-[2px]",
   {
     variants: {
@@ -169,204 +172,231 @@ const we = {
     },
     defaultVariants: { size: "md" }
   }
-), xe = {
+), Oe = {
   increasing: "↑",
   decreasing: "↓",
   steady: "→"
-}, Ie = {
+}, Se = {
   xs: 24,
   sm: 32,
   md: 40
-}, N = 2, ee = 2.5, te = 44;
-function Ne(t, a, m = te) {
-  const l = t.map((s) => ({
-    annotation: s,
-    centre: ne(s.position) * a
-  })).sort((s, p) => s.centre - p.centre);
-  return l.map((s, p) => {
-    const h = l[p - 1], w = l[p + 1], k = h ? (h.centre + s.centre) / 2 : 0, g = w ? (s.centre + w.centre) / 2 : a, r = Math.max(0, k), i = Math.min(a, g), b = Math.min(m, Math.max(0, i - r)), T = Math.min(
-      Math.max(s.centre - b / 2, r),
-      i - b
+}, M = 2, ie = 2.5, oe = 44;
+function ze(n, r, g = oe) {
+  const p = n.map((a) => ({
+    annotation: a,
+    centre: de(a.position) * r
+  })).sort((a, h) => a.centre - h.centre);
+  return p.map((a, h) => {
+    const f = p[h - 1], x = p[h + 1], N = f ? (f.centre + a.centre) / 2 : 0, b = x ? (a.centre + x.centre) / 2 : r, c = Math.max(0, N), d = Math.min(r, b), s = Math.min(g, Math.max(0, d - c)), y = Math.min(
+      Math.max(a.centre - s / 2, c),
+      d - s
     );
-    return { annotation: s.annotation, x: T, width: b };
+    return { annotation: a.annotation, x: y, width: s };
   });
 }
-function ne(t) {
-  return Number.isFinite(t) ? Math.min(1, Math.max(0, t)) : 0;
+function de(n) {
+  return Number.isFinite(n) ? Math.min(1, Math.max(0, n)) : 0;
 }
-function Te(t) {
-  return t.filter((a) => a != null);
+function _e(n) {
+  return n.filter((r) => r != null);
 }
-function Me() {
+function He() {
   return typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 }
-const Ce = pe(
+const Pe = ve(
   ({
-    id: t,
-    data: a,
-    variant: m = "line",
-    size: l = "md",
-    label: s,
-    color: p,
-    showEndpoint: h = !1,
-    showTooltip: w = !1,
-    width: k,
-    height: g,
-    annotations: r,
-    onAnnotationSelect: i,
-    className: b,
-    ...T
-  }, ae) => {
-    var J;
-    const { t: y, i18n: $ } = me(), j = ue(), x = A(
-      () => `sparkline-${j.replace(/[^a-zA-Z0-9-_]/g, "")}`,
-      [j]
-    ), M = z(null), [_, re] = W(0), [se, ie] = W(te), u = A(() => Te(a), [a]), { direction: O } = ve(u), B = A(() => {
-      const e = r && r.length > 0 ? y("sparkline.annotations", {
-        list: r.map((v) => v.label).join(", ")
-      }) : "", n = (v) => e ? `${v}. ${e}` : v;
-      if (u.length === 0)
-        return n(y("sparkline.noData", "No data"));
-      const o = (v) => new Intl.NumberFormat($.language).format(v), f = y(`sparkline.direction.${O}`), d = {
-        min: o(Math.min(...u)),
-        max: o(Math.max(...u)),
-        current: o(u[u.length - 1]),
-        direction: f
+    id: n,
+    data: r,
+    variant: g = "line",
+    size: p = "md",
+    label: a,
+    color: h,
+    showEndpoint: f = !1,
+    showTooltip: x = !1,
+    seriesName: N,
+    pointLabels: b,
+    width: c,
+    height: d,
+    annotations: s,
+    onAnnotationSelect: y,
+    className: G,
+    ...L
+  }, ce) => {
+    var ne;
+    const { t: v, i18n: q } = xe(), Z = we(), w = _(
+      () => `sparkline-${Z.replace(/[^a-zA-Z0-9-_]/g, "")}`,
+      [Z]
+    ), T = k(null), [D, le] = $(0), [ue, pe] = $(oe), m = _(() => _e(r), [r]), { direction: F } = Te(m), J = _(() => {
+      const e = s && s.length > 0 ? v("sparkline.annotations", {
+        list: s.map((I) => I.label).join(", ")
+      }) : "", t = (I) => e ? `${I}. ${e}` : I;
+      if (m.length === 0)
+        return t(v("sparkline.noData", "No data"));
+      const i = (I) => new Intl.NumberFormat(q.language).format(I), l = v(`sparkline.direction.${F}`), o = {
+        min: i(Math.min(...m)),
+        max: i(Math.max(...m)),
+        current: i(m[m.length - 1]),
+        direction: l
       };
-      return n(s ? y("sparkline.summary", { label: s, ...d }) : y("sparkline.summaryNoLabel", d));
-    }, [u, r, s, O, $.language, y]), [C, oe] = W(
+      return t(a ? v("sparkline.summary", { label: a, ...o }) : v("sparkline.summaryNoLabel", o));
+    }, [m, s, a, F, q.language, v]), [C, he] = $(
       () => {
         try {
-          return Q();
+          return re();
         } catch {
           return {};
         }
       }
     );
-    S(() => {
+    H(() => {
       let e;
-      const n = new MutationObserver(() => {
+      const t = new MutationObserver(() => {
         clearTimeout(e), e = setTimeout(() => {
           try {
-            oe(Q());
+            he(re());
           } catch {
           }
         }, 50);
       });
-      return n.observe(document.documentElement, {
+      return t.observe(document.documentElement, {
         attributes: !0,
         attributeFilter: ["class"]
       }), () => {
-        clearTimeout(e), n.disconnect();
+        clearTimeout(e), t.disconnect();
       };
-    }, []), S(() => {
-      const e = M.current;
+    }, []), H(() => {
+      const e = T.current;
       if (!e) return;
-      const n = () => {
-        const f = getComputedStyle(e).getPropertyValue("--min-target-size"), d = Number.parseFloat(f);
-        Number.isFinite(d) && d > 0 && ie(d);
+      const t = () => {
+        const l = getComputedStyle(e).getPropertyValue("--min-target-size"), o = Number.parseFloat(l);
+        Number.isFinite(o) && o > 0 && pe(o);
       };
-      n();
-      const o = new ResizeObserver((f) => {
-        const d = f[0];
-        d && re(Math.floor(d.contentRect.width)), n();
+      t();
+      const i = new ResizeObserver((l) => {
+        const o = l[0];
+        o && le(Math.floor(o.contentRect.width)), t();
       });
-      return o.observe(e), () => o.disconnect();
-    }, []), fe(M);
-    const I = z(i);
-    S(() => {
-      I.current = i;
-    }, [i]);
-    const H = z(r);
-    H.current = r;
-    const P = z(a.length);
-    S(() => {
-      P.current = a.length;
-    }, [a]);
-    const D = A(
+      return i.observe(e), () => i.disconnect();
+    }, []), Ne(T);
+    const R = k(y);
+    H(() => {
+      R.current = y;
+    }, [y]);
+    const U = k(s);
+    U.current = s;
+    const V = N ?? a ?? "", Q = k(V);
+    Q.current = V;
+    const W = k(r.length), A = k({ shown: !1 }), O = k(!1);
+    H(() => {
+      var e;
+      W.current = r.length, O.current && (O.current = !1, A.current.shown && ((e = P.getChartByID(w)) == null || e.updateOptions({
+        tooltip: { x: { show: !0 } }
+      })));
+    }, [r, w]);
+    const B = _(
       () => ({
         updateSeries(e) {
-          var n;
-          (n = E.getChartByID(x)) == null || n.updateSeries([{ data: e }]), P.current = e.length;
+          const t = P.getChartByID(w);
+          t == null || t.updateSeries([{ name: Q.current, data: e }]), W.current = e.length, A.current.shown && (O.current = !0, t == null || t.updateOptions({ tooltip: { x: { show: !1 } } }));
         },
         updateOptions(e) {
-          var n;
-          (n = E.getChartByID(x)) == null || n.updateOptions(e);
+          var t;
+          (t = P.getChartByID(w)) == null || t.updateOptions(e);
         },
         async dataURI() {
-          const e = E.getChartByID(x);
+          const e = P.getChartByID(w);
           return e ? (await e.dataURI()).imgURI : "";
         },
         selectAnnotation(e) {
-          var o, f;
-          (o = H.current) != null && o.some((d) => d.id === e) && ((f = I.current) == null || f.call(I, e));
+          var i, l;
+          (i = U.current) != null && i.some((o) => o.id === e) && ((l = R.current) == null || l.call(R, e));
         },
         // Read-back for the two preconditions `selectAnnotation` enforces
         // silently — without these an agent can check neither and gets no
         // signal from either failure.
-        getAnnotationIds: () => (H.current ?? []).map((e) => e.id),
-        isSelectable: () => I.current != null,
-        getPointCount: () => P.current
+        getAnnotationIds: () => (U.current ?? []).map((e) => e.id),
+        isSelectable: () => R.current != null,
+        getPointCount: () => W.current
       }),
-      [x]
+      [w]
     );
-    he(ae, () => D, [D]), be(we, D, t);
-    const F = p ?? ((J = C.colors) == null ? void 0 : J[0]) ?? "currentColor";
-    if (u.length === 0)
-      return /* @__PURE__ */ c(
+    ke(ce, () => B, [B]), Me(Ce, B, n);
+    const E = h ?? ((ne = C.colors) == null ? void 0 : ne[0]) ?? "currentColor";
+    if (m.length === 0)
+      return /* @__PURE__ */ u(
         "div",
         {
-          ref: M,
+          ref: T,
           role: "img",
-          "aria-label": B,
+          "aria-label": J,
           dir: "ltr",
-          className: X({
-            size: g !== void 0 ? "auto" : l,
-            className: b
+          className: ae({
+            size: d !== void 0 ? "auto" : p,
+            className: G
           }),
           "data-component": "sparkline",
-          "data-component-id": t,
-          ...T
+          "data-component-id": n,
+          ...L
         }
       );
-    const G = Me(), U = a.length > u.length, L = U ? a.flatMap((e, n) => e == null ? [] : [{ x: n, y: e }]) : u, de = {
+    const X = He(), S = r.length > m.length, Y = S ? r.flatMap((e, t) => e == null ? [] : [{ x: t, y: e }]) : m, me = S ? r.flatMap((e, t) => e == null ? [] : [t]) : void 0;
+    A.current = {
+      labels: b,
+      slotOf: me,
+      shown: x && b !== void 0
+    };
+    const fe = x ? {
+      enabled: !0,
+      x: b ? {
+        show: !0,
+        formatter: (e, t) => {
+          const { labels: i, slotOf: l } = A.current;
+          if (O.current || !i) return "";
+          const o = (t == null ? void 0 : t.dataPointIndex) ?? -1;
+          return i[l ? l[o] ?? -1 : o] ?? "";
+        }
+      } : (
+        // No labels: hide the title rather than show a raw index.
+        { show: !1 }
+      )
+    } : { enabled: !1 }, ge = {
       ...C,
       chart: {
         ...C.chart,
-        id: x,
-        type: m,
+        id: w,
+        type: g,
         sparkline: { enabled: !0 },
         toolbar: { show: !1 },
         animations: {
-          enabled: !G,
+          enabled: !X,
           // A gapped series is re-rendered as {x, y} pairs, and Apex's
           // update tween interpolates between the old and new paths point by
           // point. Across a width change the two have different lengths and
           // the tween emits `d="… NaN …"` for a few frames. The finished
           // render is correct either way; switching the tween off keeps the
           // console clean.
-          dynamicAnimation: { enabled: !G && !U }
+          dynamicAnimation: { enabled: !X && !S }
         },
         zoom: { enabled: !1 },
         parentHeightOffset: 0
       },
-      colors: [F],
+      colors: [E],
       stroke: {
         curve: "smooth",
-        width: m === "bar" ? 0 : 2
+        width: g === "bar" ? 0 : 2
       },
       fill: {
-        opacity: m === "area" ? 0.15 : 1
+        opacity: g === "area" ? 0.15 : 1
       },
       xaxis: {
         crosshairs: { show: !1 },
         // Pin the extent to the slot count so a gap at either end still holds
         // its place — otherwise the plot would rescale to the measurements
         // and the annotation fractions would no longer mean the same thing.
-        ...U ? { type: "numeric", min: 0, max: a.length - 1 } : {}
+        ...S ? { type: "numeric", min: 0, max: r.length - 1 } : {}
       },
-      tooltip: { enabled: w },
-      markers: h ? {
+      tooltip: fe,
+      markers: f ? {
         size: [0],
         discrete: [
           {
@@ -374,9 +404,9 @@ const Ce = pe(
             // removed — so this is the last MEASURED point, never a slot
             // the parameter was not measured at.
             seriesIndex: 0,
-            dataPointIndex: L.length - 1,
-            fillColor: F,
-            strokeColor: F,
+            dataPointIndex: Y.length - 1,
+            fillColor: E,
+            strokeColor: E,
             size: 4
           }
         ]
@@ -387,40 +417,40 @@ const Ce = pe(
         // ApexCharts grid.padding uses physical keys (not CSS logical properties).
         // The chart wrapper enforces dir="ltr" so these always resolve correctly.
         padding: {
-          top: N,
-          right: N,
-          bottom: N,
-          left: N
+          top: M,
+          right: M,
+          bottom: M,
+          left: M
         }
       }
-    }, ce = k ?? (_ > 0 ? _ : "100%"), le = g ?? Ie[l ?? "md"], R = r != null && r.length ? r : void 0, q = _ - N * 2, Z = i && R && q > 0 ? Ne(R, q, se) : void 0;
-    return /* @__PURE__ */ V(
+    }, ye = c ?? (D > 0 ? D : "100%"), be = d ?? Se[p ?? "md"], z = s != null && s.length ? s : void 0, ee = D - M * 2, te = y && z && ee > 0 ? ze(z, ee, ue) : void 0;
+    return /* @__PURE__ */ K(
       "div",
       {
-        ref: M,
+        ref: T,
         role: "img",
-        "aria-label": B,
+        "aria-label": J,
         dir: "ltr",
-        className: X({
-          size: g !== void 0 ? "auto" : l,
-          className: b
+        className: ae({
+          size: d !== void 0 ? "auto" : p,
+          className: G
         }),
         "data-component": "sparkline",
-        "data-component-id": t,
-        ...T,
+        "data-component-id": n,
+        ...L,
         children: [
-          /* @__PURE__ */ c(
-            ge,
+          /* @__PURE__ */ u(
+            Ie,
             {
-              type: m,
-              series: [{ data: L }],
-              options: de,
-              width: ce,
-              height: le,
+              type: g,
+              series: [{ name: V, data: Y }],
+              options: ge,
+              width: ye,
+              height: be,
               "aria-hidden": "true"
             }
           ),
-          R && /* Drawn over the plot rather than through ApexCharts' own xaxis
+          z && /* Drawn over the plot rather than through ApexCharts' own xaxis
           annotations: a fraction of the measured extent is the one
           positioning rule that survives series of different lengths, which
           is what makes a column of sparklines share an x. */
@@ -430,32 +460,32 @@ const Ce = pe(
              equal PLOT_EDGE_PADDING — Tailwind needs a static literal, so the
              two cannot share one source; change them together or the first and
              last annotation drift off the first and last data point. */
-          /* @__PURE__ */ c("div", { className: "ds:pointer-events-none ds:absolute ds:inset-y-0 ds:inset-x-[2px]", children: /* @__PURE__ */ c(
+          /* @__PURE__ */ u("div", { className: "ds:pointer-events-none ds:absolute ds:inset-y-0 ds:inset-x-[2px]", children: /* @__PURE__ */ u(
             "svg",
             {
               "aria-hidden": "true",
               focusable: "false",
               "data-testid": "sparkline-annotations",
               className: "ds:size-full",
-              children: R.map((e) => {
-                const n = ne(e.position);
+              children: z.map((e) => {
+                const t = de(e.position);
                 return (
                   /* A nested viewport placed at a percentage of the plot: the
                    one positioning rule that needs no measurement, so a column
                    of sparklines shares an x whatever their widths. */
-                  /* @__PURE__ */ V(
+                  /* @__PURE__ */ K(
                     "svg",
                     {
-                      x: `${n * 100}%`,
+                      x: `${t * 100}%`,
                       y: "0",
                       width: "1",
                       height: "100%",
                       overflow: "visible",
                       "data-annotation-id": e.id,
-                      "data-annotation-position": n,
-                      className: Y({ tone: e.tone }),
+                      "data-annotation-position": t,
+                      className: se({ tone: e.tone }),
                       children: [
-                        /* @__PURE__ */ c(
+                        /* @__PURE__ */ u(
                           "line",
                           {
                             x1: 0,
@@ -465,14 +495,14 @@ const Ce = pe(
                             className: "ds:[stroke:var(--annotation-color)] ds:[stroke-dasharray:2_3] ds:[stroke-width:1]"
                           }
                         ),
-                        /* @__PURE__ */ c(
+                        /* @__PURE__ */ u(
                           "path",
                           {
-                            d: ye(
+                            d: Re(
                               e.shape ?? "diamond",
                               0,
-                              ee,
-                              ee
+                              ie,
+                              ie
                             ),
                             className: "ds:[fill:var(--annotation-color)]"
                           }
@@ -485,41 +515,41 @@ const Ce = pe(
               })
             }
           ) }),
-          Z && i && /* Sized in px, not percentages: the target size is a measurement,
+          te && y && /* Sized in px, not percentages: the target size is a measurement,
           not a fraction of a box the reader can resize.
           `pointer-events-none` holds all the way down to the bands, so the
           only live pixels are the token-width each annotation owns. */
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ u(
             "div",
             {
-              className: ke({
-                size: g !== void 0 ? "auto" : l
+              className: Ae({
+                size: d !== void 0 ? "auto" : p
               }),
-              children: /* @__PURE__ */ c(
+              children: /* @__PURE__ */ u(
                 "svg",
                 {
                   "aria-hidden": "true",
                   focusable: "false",
                   "data-testid": "sparkline-annotation-hits",
                   className: "ds:size-full",
-                  children: Z.map(({ annotation: e, x: n, width: o }) => /* @__PURE__ */ V(
+                  children: te.map(({ annotation: e, x: t, width: i }) => /* @__PURE__ */ K(
                     "g",
                     {
                       "data-annotation-hit-id": e.id,
-                      onClick: () => i(e.id),
-                      className: `ds:group ds:pointer-events-auto ds:cursor-pointer ${Y(
+                      onClick: () => y(e.id),
+                      className: `ds:group ds:pointer-events-auto ds:cursor-pointer ${se(
                         { tone: e.tone }
                       )}`,
                       children: [
-                        /* @__PURE__ */ c("title", { children: y("sparkline.annotationAction", {
+                        /* @__PURE__ */ u("title", { children: v("sparkline.annotationAction", {
                           label: e.label
                         }) }),
-                        /* @__PURE__ */ c(
+                        /* @__PURE__ */ u(
                           "rect",
                           {
-                            x: n,
+                            x: t,
                             y: 0,
-                            width: o,
+                            width: i,
                             height: "100%",
                             className: "ds:[fill:var(--annotation-color)] ds:opacity-0 ds:transition-opacity ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:group-hover:opacity-20"
                           }
@@ -532,12 +562,12 @@ const Ce = pe(
               )
             }
           ),
-          h && /* @__PURE__ */ c(
+          f && /* @__PURE__ */ u(
             "span",
             {
               "aria-hidden": "true",
               className: "ds:pointer-events-none ds:absolute ds:end-0 ds:top-0 ds:text-[length:var(--font-size-xs)] ds:leading-none",
-              children: xe[O]
+              children: Oe[F]
             }
           )
         ]
@@ -545,10 +575,10 @@ const Ce = pe(
     );
   }
 );
-Ce.displayName = "Sparkline";
+Pe.displayName = "Sparkline";
 export {
-  Ce as S,
-  we as s,
-  ve as u
+  Pe as S,
+  Ce as s,
+  Te as u
 };
-//# sourceMappingURL=sparkline-BmGcEyZO.js.map
+//# sourceMappingURL=sparkline-Dx_sxK3J.js.map