import { o as R } from "./rolldown-runtime.js";
import { i as K, t as E } from "./vendor/react.js";
import { C as H, S as W, _ as q, v as F, x as G, y as V } from "./vendor/recharts.js";
import { t as U } from "./dist.js";
import { t as g } from "./utils.js";
import { a as X, i as Y, n as B, o as J, r as Q, t as Z } from "./use-reduced-motion2.js";
var p = /* @__PURE__ */ R(K(), 1), P = { transition: "opacity 200ms ease-out" };
function tt(a) {
  const [e, l] = (0, p.useState)(null);
  return {
    highlightedSeries: e,
    setHighlightedSeries: l,
    getOpacity: (o) => e && e !== o ? 0.2 : 1,
    dimTransition: a ? void 0 : P
  };
}
var t = E(), h = [
  "var(--chart-1)",
  "var(--chart-2)",
  "var(--chart-3)",
  "var(--chart-4)",
  "var(--chart-5)"
], et = U("relative w-full", {
  variants: { size: {
    sm: "h-40",
    default: "h-60",
    lg: "h-80",
    xl: "h-96"
  } },
  defaultVariants: { size: "default" }
}), u = (a) => a ? a.replace(/\s+/g, "_") : "", S = ({ series: a, position: e, maxLabelWidth: l, onSeriesHover: n, highlightedSeries: o }) => {
  const c = a.map((s, m) => s.color || h[m % h.length]);
  return /* @__PURE__ */ (0, t.jsx)("ul", {
    className: g("flex gap-3 overflow-hidden list-none m-0 p-0", e === "top" ? "justify-center flex-wrap" : "flex-col"),
    children: a.map((s, m) => {
      const x = !o || o === s.id;
      return /* @__PURE__ */ (0, t.jsxs)("li", {
        className: g("flex items-center gap-2 min-w-0 transition-opacity duration-200 ease-smooth motion-reduce:transition-none", !n && "hover:opacity-80"),
        style: n ? { opacity: x ? 1 : 0.35 } : void 0,
        onMouseEnter: () => n?.(s.id),
        onMouseLeave: () => n?.(null),
        children: [/* @__PURE__ */ (0, t.jsx)("div", {
          className: "size-2 rounded-full shrink-0",
          style: { backgroundColor: c[m] }
        }), /* @__PURE__ */ (0, t.jsx)("span", {
          className: "text-sm text-muted-foreground truncate",
          style: { maxWidth: l ?? 120 },
          title: s.label,
          children: s.label
        })]
      }, s.id);
    })
  });
};
function rt({ cx: a = 0, cy: e = 0, stroke: l, fill: n }) {
  const o = l || n || "currentColor";
  return /* @__PURE__ */ (0, t.jsxs)("g", { children: [/* @__PURE__ */ (0, t.jsx)("circle", {
    cx: a,
    cy: e,
    r: 10,
    fill: o,
    fillOpacity: 0.15
  }), /* @__PURE__ */ (0, t.jsx)("circle", {
    cx: a,
    cy: e,
    r: 5,
    fill: o,
    stroke: "var(--background)",
    strokeWidth: 2
  })] });
}
function at({ data: a, series: e, showYAxis: l = !0, showXAxis: n = !0, yAxisLabel: o, xAxisLabel: c, legendPosition: s = "none", yAxisTicks: m, yAxisFormat: x = (d) => d.toLocaleString(), showArea: j = !0, strokeWidth: L = 2, showDots: M = !1, curveType: $ = "smooth", showTooltip: O = !0, size: T, className: w, "aria-label": z, ...A }) {
  const d = Z(), y = p.useId().replace(/:/g, ""), { highlightedSeries: k, setHighlightedSeries: C, getOpacity: N, dimTransition: b } = tt(d), D = p.useMemo(() => a.map((i) => {
    const r = { label: i.label };
    for (const f of e) {
      const v = u(f.id);
      r[v] = i.values[f.id] ?? 0;
    }
    return r;
  }), [a, e]), I = p.useMemo(() => {
    const i = {};
    for (const [r, f] of e.entries()) {
      const v = u(f.id);
      i[v] = {
        label: f.label,
        color: f.color || h[r % h.length]
      };
    }
    return i;
  }, [e]), _ = $ === "smooth" ? "monotone" : "linear";
  return /* @__PURE__ */ (0, t.jsx)("div", {
    className: g(et({ size: T }), w),
    role: "img",
    "aria-label": z || "Line chart",
    ...A,
    children: /* @__PURE__ */ (0, t.jsxs)("div", {
      className: "flex h-full gap-1",
      children: [o && /* @__PURE__ */ (0, t.jsx)("div", {
        className: "flex items-center justify-center pb-6",
        children: /* @__PURE__ */ (0, t.jsx)("span", {
          className: "text-xs font-medium text-muted-foreground whitespace-nowrap",
          style: {
            writingMode: "vertical-rl",
            transform: "rotate(180deg)"
          },
          children: o
        })
      }), /* @__PURE__ */ (0, t.jsxs)("div", {
        className: "flex-1 flex flex-col min-w-0",
        children: [
          s === "top" && /* @__PURE__ */ (0, t.jsx)("div", {
            className: "flex justify-end pb-2",
            children: /* @__PURE__ */ (0, t.jsx)(S, {
              series: e,
              position: "top",
              onSeriesHover: C,
              highlightedSeries: k
            })
          }),
          /* @__PURE__ */ (0, t.jsxs)("div", {
            className: "flex-1 flex",
            children: [/* @__PURE__ */ (0, t.jsx)(B, {
              config: I,
              className: "flex-1 min-h-0 aspect-auto",
              children: /* @__PURE__ */ (0, t.jsxs)(q, {
                data: D,
                margin: {
                  top: 8,
                  right: 8,
                  bottom: c ? 20 : 0,
                  left: 0
                },
                children: [
                  /* @__PURE__ */ (0, t.jsx)(H, {
                    strokeDasharray: "0",
                    vertical: !1,
                    className: "stroke-border"
                  }),
                  n && /* @__PURE__ */ (0, t.jsx)(V, {
                    dataKey: "label",
                    tickLine: !1,
                    axisLine: !1,
                    tickMargin: 8,
                    tick: {
                      fill: "var(--muted-foreground)",
                      fontSize: 12
                    },
                    label: c ? {
                      value: c,
                      position: "bottom",
                      offset: 0,
                      style: {
                        fill: "var(--muted-foreground)",
                        fontSize: 12
                      }
                    } : void 0
                  }),
                  l && /* @__PURE__ */ (0, t.jsx)(F, {
                    tickLine: !1,
                    axisLine: !1,
                    tickMargin: 8,
                    tick: {
                      fill: "var(--muted-foreground)",
                      fontSize: 12
                    },
                    tickFormatter: x,
                    ticks: m,
                    width: 48
                  }),
                  O && /* @__PURE__ */ (0, t.jsx)(X, {
                    content: /* @__PURE__ */ (0, t.jsx)(J, {}),
                    cursor: d ? !1 : { stroke: "var(--border)" }
                  }),
                  s !== "none" && /* @__PURE__ */ (0, t.jsx)(Q, { content: /* @__PURE__ */ (0, t.jsx)(Y, {}) }),
                  j && e.map((i) => {
                    const r = u(i.id);
                    return /* @__PURE__ */ (0, t.jsx)("defs", { children: /* @__PURE__ */ (0, t.jsxs)("linearGradient", {
                      id: `fill-${y}-${r}`,
                      x1: "0",
                      y1: "0",
                      x2: "0",
                      y2: "1",
                      children: [/* @__PURE__ */ (0, t.jsx)("stop", {
                        offset: "0%",
                        stopColor: `var(--color-${r})`,
                        stopOpacity: 0.2
                      }), /* @__PURE__ */ (0, t.jsx)("stop", {
                        offset: "100%",
                        stopColor: `var(--color-${r})`,
                        stopOpacity: 0.02
                      })]
                    }) }, `gradient-${r}`);
                  }),
                  j && e.map((i) => {
                    const r = u(i.id);
                    return /* @__PURE__ */ (0, t.jsx)(G, {
                      dataKey: r,
                      type: _,
                      fill: `url(#fill-${y}-${r})`,
                      stroke: "none",
                      opacity: N(i.id),
                      style: b,
                      isAnimationActive: !d
                    }, `area-${r}`);
                  }),
                  e.map((i) => {
                    const r = u(i.id);
                    return /* @__PURE__ */ (0, t.jsx)(W, {
                      dataKey: r,
                      type: _,
                      stroke: `var(--color-${r})`,
                      strokeWidth: L,
                      dot: M ? {
                        fill: `var(--color-${r})`,
                        r: 4
                      } : !1,
                      activeDot: /* @__PURE__ */ (0, t.jsx)(rt, {}),
                      opacity: N(i.id),
                      style: b,
                      isAnimationActive: !d
                    }, r);
                  })
                ]
              })
            }), s === "right" && /* @__PURE__ */ (0, t.jsx)("div", {
              className: "ps-3 flex items-start pt-2",
              children: /* @__PURE__ */ (0, t.jsx)(S, {
                series: e,
                position: "right",
                onSeriesHover: C,
                highlightedSeries: k
              })
            })]
          }),
          c && /* @__PURE__ */ (0, t.jsx)("div", {
            className: "flex justify-center pt-2",
            children: /* @__PURE__ */ (0, t.jsx)("span", {
              className: "text-xs font-medium text-muted-foreground",
              children: c
            })
          })
        ]
      })]
    })
  });
}
at.displayName = "LineChart";
export {
  tt as a,
  u as i,
  at as n,
  S as r,
  h as t
};

//# sourceMappingURL=LineChart.js.map