@vesture/react 0.2.10 → 0.3.1

package/dist/index.js

@@ -2001,8 +2001,7 @@ var root2 = "Calendar_root__1uy43my0";
 var weekRow = "Calendar_weekRow__1uy43my5";
 var weekdayCell = "Calendar_weekdayCell__1uy43my6";
 
-// src/components/Calendar/Calendar.tsx
-import { jsx as jsx35, jsxs as jsxs18 } from "react/jsx-runtime";
+// src/utils/date.ts
 function startOfMonth(date) {
   return new Date(date.getFullYear(), date.getMonth(), 1);
 }
@@ -2038,6 +2037,9 @@ function endOfWeek(date, weekStartsOn) {
 function dateKey(date) {
   return `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`;
 }
+
+// src/components/Calendar/Calendar.tsx
+import { jsx as jsx35, jsxs as jsxs18 } from "react/jsx-runtime";
 function getCalendarWeeks(month, weekStartsOn) {
   const gridStart = startOfWeek(startOfMonth(month), weekStartsOn);
   const gridEnd = endOfWeek(endOfMonth(month), weekStartsOn);
@@ -2598,10 +2600,10 @@ function clampToMidnight3(date) {
   return new Date(date.getFullYear(), date.getMonth(), date.getDate());
 }
 function compareDates(a, b) {
-  const x = clampToMidnight3(a).getTime();
-  const y = clampToMidnight3(b).getTime();
-  if (x < y) return -1;
-  if (x > y) return 1;
+  const x2 = clampToMidnight3(a).getTime();
+  const y2 = clampToMidnight3(b).getTime();
+  if (x2 < y2) return -1;
+  if (x2 > y2) return 1;
   return 0;
 }
 function isDisabled2(date, minDate, maxDate, isDateDisabled) {
@@ -4213,16 +4215,2021 @@ function useCommandPaletteShortcut(onOpenChange, options = {}) {
   }, [onOpenChange, key, metaKey, ctrlKey]);
 }
 
+// src/components/charts/LineChart/LineChart.tsx
+import { AxisBottom, AxisLeft } from "@visx/axis";
+import { GridRows } from "@visx/grid";
+import { Group } from "@visx/group";
+import { LinePath } from "@visx/shape";
+import { vars as vars4 } from "@vesture/tokens";
+
+// src/components/charts/LineChart/LineChart.render.ts
+import { scaleBand, scaleLinear, scaleTime } from "@visx/scale";
+
+// ../../node_modules/d3-shape/src/constant.js
+function constant_default(x2) {
+  return function constant() {
+    return x2;
+  };
+}
+
+// ../../node_modules/d3-path/src/path.js
+var pi = Math.PI;
+var tau = 2 * pi;
+var epsilon = 1e-6;
+var tauEpsilon = tau - epsilon;
+function append(strings) {
+  this._ += strings[0];
+  for (let i = 1, n = strings.length; i < n; ++i) {
+    this._ += arguments[i] + strings[i];
+  }
+}
+function appendRound(digits) {
+  let d = Math.floor(digits);
+  if (!(d >= 0)) throw new Error(`invalid digits: ${digits}`);
+  if (d > 15) return append;
+  const k = 10 ** d;
+  return function(strings) {
+    this._ += strings[0];
+    for (let i = 1, n = strings.length; i < n; ++i) {
+      this._ += Math.round(arguments[i] * k) / k + strings[i];
+    }
+  };
+}
+var Path = class {
+  constructor(digits) {
+    this._x0 = this._y0 = // start of current subpath
+    this._x1 = this._y1 = null;
+    this._ = "";
+    this._append = digits == null ? append : appendRound(digits);
+  }
+  moveTo(x2, y2) {
+    this._append`M${this._x0 = this._x1 = +x2},${this._y0 = this._y1 = +y2}`;
+  }
+  closePath() {
+    if (this._x1 !== null) {
+      this._x1 = this._x0, this._y1 = this._y0;
+      this._append`Z`;
+    }
+  }
+  lineTo(x2, y2) {
+    this._append`L${this._x1 = +x2},${this._y1 = +y2}`;
+  }
+  quadraticCurveTo(x1, y1, x2, y2) {
+    this._append`Q${+x1},${+y1},${this._x1 = +x2},${this._y1 = +y2}`;
+  }
+  bezierCurveTo(x1, y1, x2, y2, x3, y3) {
+    this._append`C${+x1},${+y1},${+x2},${+y2},${this._x1 = +x3},${this._y1 = +y3}`;
+  }
+  arcTo(x1, y1, x2, y2, r) {
+    x1 = +x1, y1 = +y1, x2 = +x2, y2 = +y2, r = +r;
+    if (r < 0) throw new Error(`negative radius: ${r}`);
+    let x0 = this._x1, y0 = this._y1, x21 = x2 - x1, y21 = y2 - y1, x01 = x0 - x1, y01 = y0 - y1, l01_2 = x01 * x01 + y01 * y01;
+    if (this._x1 === null) {
+      this._append`M${this._x1 = x1},${this._y1 = y1}`;
+    } else if (!(l01_2 > epsilon)) ;
+    else if (!(Math.abs(y01 * x21 - y21 * x01) > epsilon) || !r) {
+      this._append`L${this._x1 = x1},${this._y1 = y1}`;
+    } else {
+      let x20 = x2 - x0, y20 = y2 - y0, l21_2 = x21 * x21 + y21 * y21, l20_2 = x20 * x20 + y20 * y20, l21 = Math.sqrt(l21_2), l01 = Math.sqrt(l01_2), l = r * Math.tan((pi - Math.acos((l21_2 + l01_2 - l20_2) / (2 * l21 * l01))) / 2), t01 = l / l01, t21 = l / l21;
+      if (Math.abs(t01 - 1) > epsilon) {
+        this._append`L${x1 + t01 * x01},${y1 + t01 * y01}`;
+      }
+      this._append`A${r},${r},0,0,${+(y01 * x20 > x01 * y20)},${this._x1 = x1 + t21 * x21},${this._y1 = y1 + t21 * y21}`;
+    }
+  }
+  arc(x2, y2, r, a0, a1, ccw) {
+    x2 = +x2, y2 = +y2, r = +r, ccw = !!ccw;
+    if (r < 0) throw new Error(`negative radius: ${r}`);
+    let dx = r * Math.cos(a0), dy = r * Math.sin(a0), x0 = x2 + dx, y0 = y2 + dy, cw = 1 ^ ccw, da = ccw ? a0 - a1 : a1 - a0;
+    if (this._x1 === null) {
+      this._append`M${x0},${y0}`;
+    } else if (Math.abs(this._x1 - x0) > epsilon || Math.abs(this._y1 - y0) > epsilon) {
+      this._append`L${x0},${y0}`;
+    }
+    if (!r) return;
+    if (da < 0) da = da % tau + tau;
+    if (da > tauEpsilon) {
+      this._append`A${r},${r},0,1,${cw},${x2 - dx},${y2 - dy}A${r},${r},0,1,${cw},${this._x1 = x0},${this._y1 = y0}`;
+    } else if (da > epsilon) {
+      this._append`A${r},${r},0,${+(da >= pi)},${cw},${this._x1 = x2 + r * Math.cos(a1)},${this._y1 = y2 + r * Math.sin(a1)}`;
+    }
+  }
+  rect(x2, y2, w, h) {
+    this._append`M${this._x0 = this._x1 = +x2},${this._y0 = this._y1 = +y2}h${w = +w}v${+h}h${-w}Z`;
+  }
+  toString() {
+    return this._;
+  }
+};
+function path() {
+  return new Path();
+}
+path.prototype = Path.prototype;
+
+// ../../node_modules/d3-shape/src/path.js
+function withPath(shape) {
+  let digits = 3;
+  shape.digits = function(_) {
+    if (!arguments.length) return digits;
+    if (_ == null) {
+      digits = null;
+    } else {
+      const d = Math.floor(_);
+      if (!(d >= 0)) throw new RangeError(`invalid digits: ${_}`);
+      digits = d;
+    }
+    return shape;
+  };
+  return () => new Path(digits);
+}
+
+// ../../node_modules/d3-shape/src/array.js
+var slice = Array.prototype.slice;
+function array_default(x2) {
+  return typeof x2 === "object" && "length" in x2 ? x2 : Array.from(x2);
+}
+
+// ../../node_modules/d3-shape/src/curve/linear.js
+function Linear(context) {
+  this._context = context;
+}
+Linear.prototype = {
+  areaStart: function() {
+    this._line = 0;
+  },
+  areaEnd: function() {
+    this._line = NaN;
+  },
+  lineStart: function() {
+    this._point = 0;
+  },
+  lineEnd: function() {
+    if (this._line || this._line !== 0 && this._point === 1) this._context.closePath();
+    this._line = 1 - this._line;
+  },
+  point: function(x2, y2) {
+    x2 = +x2, y2 = +y2;
+    switch (this._point) {
+      case 0:
+        this._point = 1;
+        this._line ? this._context.lineTo(x2, y2) : this._context.moveTo(x2, y2);
+        break;
+      case 1:
+        this._point = 2;
+      // falls through
+      default:
+        this._context.lineTo(x2, y2);
+        break;
+    }
+  }
+};
+function linear_default(context) {
+  return new Linear(context);
+}
+
+// ../../node_modules/d3-shape/src/point.js
+function x(p) {
+  return p[0];
+}
+function y(p) {
+  return p[1];
+}
+
+// ../../node_modules/d3-shape/src/line.js
+function line_default(x2, y2) {
+  var defined = constant_default(true), context = null, curve = linear_default, output = null, path2 = withPath(line);
+  x2 = typeof x2 === "function" ? x2 : x2 === void 0 ? x : constant_default(x2);
+  y2 = typeof y2 === "function" ? y2 : y2 === void 0 ? y : constant_default(y2);
+  function line(data) {
+    var i, n = (data = array_default(data)).length, d, defined0 = false, buffer;
+    if (context == null) output = curve(buffer = path2());
+    for (i = 0; i <= n; ++i) {
+      if (!(i < n && defined(d = data[i], i, data)) === defined0) {
+        if (defined0 = !defined0) output.lineStart();
+        else output.lineEnd();
+      }
+      if (defined0) output.point(+x2(d, i, data), +y2(d, i, data));
+    }
+    if (buffer) return output = null, buffer + "" || null;
+  }
+  line.x = function(_) {
+    return arguments.length ? (x2 = typeof _ === "function" ? _ : constant_default(+_), line) : x2;
+  };
+  line.y = function(_) {
+    return arguments.length ? (y2 = typeof _ === "function" ? _ : constant_default(+_), line) : y2;
+  };
+  line.defined = function(_) {
+    return arguments.length ? (defined = typeof _ === "function" ? _ : constant_default(!!_), line) : defined;
+  };
+  line.curve = function(_) {
+    return arguments.length ? (curve = _, context != null && (output = curve(context)), line) : curve;
+  };
+  line.context = function(_) {
+    return arguments.length ? (_ == null ? context = output = null : output = curve(context = _), line) : context;
+  };
+  return line;
+}
+
+// ../../node_modules/d3-shape/src/area.js
+function area_default(x0, y0, y1) {
+  var x1 = null, defined = constant_default(true), context = null, curve = linear_default, output = null, path2 = withPath(area);
+  x0 = typeof x0 === "function" ? x0 : x0 === void 0 ? x : constant_default(+x0);
+  y0 = typeof y0 === "function" ? y0 : y0 === void 0 ? constant_default(0) : constant_default(+y0);
+  y1 = typeof y1 === "function" ? y1 : y1 === void 0 ? y : constant_default(+y1);
+  function area(data) {
+    var i, j, k, n = (data = array_default(data)).length, d, defined0 = false, buffer, x0z = new Array(n), y0z = new Array(n);
+    if (context == null) output = curve(buffer = path2());
+    for (i = 0; i <= n; ++i) {
+      if (!(i < n && defined(d = data[i], i, data)) === defined0) {
+        if (defined0 = !defined0) {
+          j = i;
+          output.areaStart();
+          output.lineStart();
+        } else {
+          output.lineEnd();
+          output.lineStart();
+          for (k = i - 1; k >= j; --k) {
+            output.point(x0z[k], y0z[k]);
+          }
+          output.lineEnd();
+          output.areaEnd();
+        }
+      }
+      if (defined0) {
+        x0z[i] = +x0(d, i, data), y0z[i] = +y0(d, i, data);
+        output.point(x1 ? +x1(d, i, data) : x0z[i], y1 ? +y1(d, i, data) : y0z[i]);
+      }
+    }
+    if (buffer) return output = null, buffer + "" || null;
+  }
+  function arealine() {
+    return line_default().defined(defined).curve(curve).context(context);
+  }
+  area.x = function(_) {
+    return arguments.length ? (x0 = typeof _ === "function" ? _ : constant_default(+_), x1 = null, area) : x0;
+  };
+  area.x0 = function(_) {
+    return arguments.length ? (x0 = typeof _ === "function" ? _ : constant_default(+_), area) : x0;
+  };
+  area.x1 = function(_) {
+    return arguments.length ? (x1 = _ == null ? null : typeof _ === "function" ? _ : constant_default(+_), area) : x1;
+  };
+  area.y = function(_) {
+    return arguments.length ? (y0 = typeof _ === "function" ? _ : constant_default(+_), y1 = null, area) : y0;
+  };
+  area.y0 = function(_) {
+    return arguments.length ? (y0 = typeof _ === "function" ? _ : constant_default(+_), area) : y0;
+  };
+  area.y1 = function(_) {
+    return arguments.length ? (y1 = _ == null ? null : typeof _ === "function" ? _ : constant_default(+_), area) : y1;
+  };
+  area.lineX0 = area.lineY0 = function() {
+    return arealine().x(x0).y(y0);
+  };
+  area.lineY1 = function() {
+    return arealine().x(x0).y(y1);
+  };
+  area.lineX1 = function() {
+    return arealine().x(x1).y(y0);
+  };
+  area.defined = function(_) {
+    return arguments.length ? (defined = typeof _ === "function" ? _ : constant_default(!!_), area) : defined;
+  };
+  area.curve = function(_) {
+    return arguments.length ? (curve = _, context != null && (output = curve(context)), area) : curve;
+  };
+  area.context = function(_) {
+    return arguments.length ? (_ == null ? context = output = null : output = curve(context = _), area) : context;
+  };
+  return area;
+}
+
+// src/components/charts/LineChart/LineChart.render.ts
+import { vars as vars3 } from "@vesture/tokens";
+var DEFAULT_MARGIN = { top: 16, right: 16, bottom: 32, left: 48 };
+var SERIES_COLOR_CYCLE = [
+  vars3.chart.series1,
+  vars3.chart.series2,
+  vars3.chart.series3,
+  vars3.chart.series4,
+  vars3.chart.series5,
+  vars3.chart.series6,
+  vars3.chart.series7,
+  vars3.chart.series8
+];
+function getSeriesColor(series, index) {
+  return series.color ?? SERIES_COLOR_CYCLE[index % SERIES_COLOR_CYCLE.length];
+}
+function resolveMargin(margin) {
+  return { ...DEFAULT_MARGIN, ...margin };
+}
+function inferXScaleType(data) {
+  const first = data[0]?.x;
+  if (first instanceof Date) return "time";
+  if (typeof first === "number") return "linear";
+  return "band";
+}
+function numericValue(value) {
+  if (value === void 0) return void 0;
+  const n = value instanceof Date ? value.getTime() : Number(value);
+  return Number.isFinite(n) ? n : void 0;
+}
+function buildScales(data, series, width, height, margin, xScaleType, stacked = false) {
+  const innerWidth = Math.max(0, width - margin.left - margin.right);
+  const innerHeight = Math.max(0, height - margin.top - margin.bottom);
+  let xScale;
+  if (xScaleType === "time") {
+    const xValues = data.map((d) => new Date(d.x).getTime());
+    xScale = scaleTime({
+      domain: [Math.min(...xValues), Math.max(...xValues)],
+      range: [0, innerWidth]
+    });
+  } else if (xScaleType === "linear") {
+    const xValues = data.map((d) => Number(d.x));
+    xScale = scaleLinear({
+      domain: [Math.min(...xValues), Math.max(...xValues)],
+      range: [0, innerWidth]
+    });
+  } else {
+    xScale = scaleBand({
+      domain: data.map((d) => String(d.x)),
+      range: [0, innerWidth],
+      padding: 0.2
+    });
+  }
+  const yValues = stacked ? data.map((d) => series.reduce((sum, s) => sum + (numericValue(d[s.key]) ?? 0), 0)) : data.flatMap(
+    (d) => series.map((s) => numericValue(d[s.key])).filter((v) => v !== void 0)
+  );
+  const yMin = stacked ? 0 : yValues.length > 0 ? Math.min(0, ...yValues) : 0;
+  const yMax = yValues.length > 0 ? Math.max(...yValues) : 1;
+  const yScale = scaleLinear({
+    domain: [yMin, yMax],
+    range: [innerHeight, 0],
+    nice: true
+  });
+  return { xScale, yScale, xScaleType, innerWidth, innerHeight, margin };
+}
+function getXPixel(scales, x2) {
+  const { xScale, xScaleType } = scales;
+  if (xScaleType === "band") {
+    const pos = xScale(String(x2));
+    if (pos === void 0) return void 0;
+    return pos + xScale.bandwidth() / 2;
+  }
+  if (xScaleType === "time") {
+    return xScale(new Date(x2));
+  }
+  return xScale(Number(x2));
+}
+function getYPixel(scales, value) {
+  const n = numericValue(value);
+  if (n === void 0) return void 0;
+  return scales.yScale(n);
+}
+var pathGenerator = line_default().x((p) => p.x).y((p) => p.y);
+function buildLineChartLayout(data, series, width, height, margin, xScaleType) {
+  const resolvedMargin = resolveMargin(margin);
+  const resolvedXScaleType = xScaleType ?? inferXScaleType(data);
+  const scales = buildScales(data, series, width, height, resolvedMargin, resolvedXScaleType);
+  const seriesLayouts = series.map((s, index) => {
+    const points = [];
+    data.forEach((d, dataIndex) => {
+      const x2 = getXPixel(scales, d.x);
+      const y2 = getYPixel(scales, d[s.key]);
+      if (x2 !== void 0 && y2 !== void 0) {
+        points.push({ dataIndex, x: x2, y: y2 });
+      }
+    });
+    return {
+      key: s.key,
+      label: s.label,
+      color: getSeriesColor(s, index),
+      points,
+      path: points.length >= 2 ? pathGenerator(points) ?? "" : ""
+    };
+  });
+  return { scales, seriesLayouts };
+}
+function findNearestDataIndex(data, scales, pixelX) {
+  if (data.length === 0) return null;
+  let nearestIndex = 0;
+  let nearestDistance = Infinity;
+  data.forEach((d, index) => {
+    const x2 = getXPixel(scales, d.x);
+    if (x2 === void 0) return;
+    const distance = Math.abs(x2 - pixelX);
+    if (distance < nearestDistance) {
+      nearestDistance = distance;
+      nearestIndex = index;
+    }
+  });
+  return nearestDistance === Infinity ? null : nearestIndex;
+}
+
+// src/components/charts/LineChart/LineChart.css.ts
+var emptyState4 = "chartSurfaces_emptyState__n6njm11";
+var legend = "chartSurfaces_legend__n6njm15";
+var legendItem = "chartSurfaces_legendItem__n6njm16";
+var legendItemHidden = "chartSurfaces_legendItemHidden__n6njm17";
+var legendSwatch = "chartSurfaces_legendSwatch__n6njm18";
+var overlayRect = "LineChart_overlayRect__1kfw0no0";
+var root5 = "chartSurfaces_root__n6njm10";
+var tooltip2 = "chartSurfaces_tooltip__n6njm12";
+var tooltipRow = "chartSurfaces_tooltipRow__n6njm13";
+var tooltipSwatch = "chartSurfaces_tooltipSwatch__n6njm14";
+
+// src/components/charts/LineChart/LineChart.tsx
+import { jsx as jsx43, jsxs as jsxs26 } from "react/jsx-runtime";
+function LineChart({
+  data,
+  series,
+  width,
+  height,
+  margin,
+  xScale
+}) {
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsx43("div", { className: root5, style: { width, height }, children: /* @__PURE__ */ jsx43("div", { className: emptyState4, style: { width, height }, children: "No data" }) });
+  }
+  const { scales, seriesLayouts } = buildLineChartLayout(data, series, width, height, margin, xScale);
+  const { xScale: scaleX, yScale, innerWidth, innerHeight, margin: resolvedMargin } = scales;
+  return /* @__PURE__ */ jsx43("div", { className: root5, children: /* @__PURE__ */ jsx43("svg", { width, height, role: "img", "aria-label": "Line chart", children: /* @__PURE__ */ jsxs26(Group, { left: resolvedMargin.left, top: resolvedMargin.top, children: [
+    /* @__PURE__ */ jsx43(GridRows, { scale: yScale, width: innerWidth, height: innerHeight, stroke: vars4.chart.grid }),
+    seriesLayouts.map((s) => /* @__PURE__ */ jsx43(
+      LinePath,
+      {
+        data: s.points,
+        x: (p) => p.x,
+        y: (p) => p.y,
+        stroke: s.color,
+        strokeWidth: 2,
+        fill: "none"
+      },
+      s.key
+    )),
+    /* @__PURE__ */ jsx43(
+      AxisBottom,
+      {
+        top: innerHeight,
+        scale: scaleX,
+        stroke: vars4.chart.axis,
+        tickStroke: vars4.chart.axis,
+        tickLabelProps: () => ({ fill: vars4.chart.axis, fontSize: 11, textAnchor: "middle" })
+      }
+    ),
+    /* @__PURE__ */ jsx43(
+      AxisLeft,
+      {
+        scale: yScale,
+        stroke: vars4.chart.axis,
+        tickStroke: vars4.chart.axis,
+        tickLabelProps: () => ({ fill: vars4.chart.axis, fontSize: 11, textAnchor: "end", dx: "-0.25em" })
+      }
+    )
+  ] }) }) });
+}
+
+// src/components/charts/LineChart/LineChart.interactive.tsx
+import { useMemo as useMemo6, useState as useState17 } from "react";
+import { ParentSize } from "@visx/responsive";
+import { TooltipWithBounds, useTooltip } from "@visx/tooltip";
+import { jsx as jsx44, jsxs as jsxs27 } from "react/jsx-runtime";
+function InteractiveLineChart({
+  data,
+  series,
+  margin,
+  xScale,
+  height = 320
+}) {
+  const [hiddenKeys, setHiddenKeys] = useState17(/* @__PURE__ */ new Set());
+  const coloredSeries = useMemo6(
+    () => series.map((s, index) => ({ ...s, color: s.color ?? getSeriesColor(s, index) })),
+    [series]
+  );
+  const visibleSeries = useMemo6(
+    () => coloredSeries.filter((s) => !hiddenKeys.has(s.key)),
+    [coloredSeries, hiddenKeys]
+  );
+  const { tooltipData, tooltipLeft, tooltipTop, tooltipOpen, showTooltip, hideTooltip } = useTooltip();
+  function toggleSeries(key) {
+    setHiddenKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      return next;
+    });
+  }
+  return /* @__PURE__ */ jsxs27("div", { className: root5, children: [
+    /* @__PURE__ */ jsx44(ParentSize, { initialSize: { width: 600, height }, style: { height }, children: ({ width }) => {
+      if (width === 0) return null;
+      const { scales } = buildLineChartLayout(data, visibleSeries, width, height, margin, xScale);
+      function handleMouseMove(event) {
+        const bounds = event.currentTarget.getBoundingClientRect();
+        const pixelX = event.clientX - bounds.left;
+        const dataIndex = findNearestDataIndex(data, scales, pixelX);
+        if (dataIndex === null) {
+          hideTooltip();
+          return;
+        }
+        const dataPoint = data[dataIndex];
+        const xPixel = getXPixel(scales, dataPoint.x) ?? pixelX;
+        showTooltip({
+          tooltipData: { dataPoint, visibleSeries },
+          tooltipLeft: scales.margin.left + xPixel,
+          tooltipTop: 0
+        });
+      }
+      return /* @__PURE__ */ jsxs27("div", { style: { position: "relative", width, height }, children: [
+        /* @__PURE__ */ jsx44(
+          LineChart,
+          {
+            data,
+            series: visibleSeries,
+            width,
+            height,
+            margin,
+            xScale
+          }
+        ),
+        /* @__PURE__ */ jsx44(
+          "svg",
+          {
+            width,
+            height,
+            style: { position: "absolute", top: 0, left: 0 },
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ jsx44(
+              "rect",
+              {
+                className: overlayRect,
+                "data-testid": "line-chart-overlay",
+                x: scales.margin.left,
+                y: scales.margin.top,
+                width: scales.innerWidth,
+                height: scales.innerHeight,
+                onMouseMove: handleMouseMove,
+                onMouseLeave: () => hideTooltip()
+              }
+            )
+          }
+        ),
+        tooltipOpen && tooltipData ? /* @__PURE__ */ jsxs27(TooltipWithBounds, { left: tooltipLeft, top: tooltipTop, className: tooltip2, children: [
+          /* @__PURE__ */ jsx44("div", { children: String(tooltipData.dataPoint.x) }),
+          tooltipData.visibleSeries.map((s) => /* @__PURE__ */ jsxs27("div", { className: tooltipRow, children: [
+            /* @__PURE__ */ jsx44("span", { className: tooltipSwatch, style: { background: s.color } }),
+            /* @__PURE__ */ jsxs27("span", { children: [
+              s.label,
+              ": ",
+              String(tooltipData.dataPoint[s.key])
+            ] })
+          ] }, s.key))
+        ] }) : null
+      ] });
+    } }),
+    /* @__PURE__ */ jsx44("div", { className: legend, children: coloredSeries.map((s) => {
+      const hidden = hiddenKeys.has(s.key);
+      return /* @__PURE__ */ jsxs27(
+        "button",
+        {
+          type: "button",
+          className: [legendItem, hidden ? legendItemHidden : null].filter(Boolean).join(" "),
+          onClick: () => toggleSeries(s.key),
+          "aria-pressed": !hidden,
+          children: [
+            /* @__PURE__ */ jsx44("span", { className: legendSwatch, style: { background: s.color } }),
+            s.label
+          ]
+        },
+        s.key
+      );
+    }) })
+  ] });
+}
+
+// src/components/charts/BarChart/BarChart.tsx
+import { AxisBottom as AxisBottom2, AxisLeft as AxisLeft2 } from "@visx/axis";
+import { GridRows as GridRows2 } from "@visx/grid";
+import { Group as Group2 } from "@visx/group";
+import { BarGroup, BarStack } from "@visx/shape";
+import { vars as vars6 } from "@vesture/tokens";
+
+// src/components/charts/BarChart/BarChart.render.ts
+import { scaleBand as scaleBand2, scaleLinear as scaleLinear2 } from "@visx/scale";
+import { vars as vars5 } from "@vesture/tokens";
+var DEFAULT_MARGIN2 = { top: 16, right: 16, bottom: 32, left: 48 };
+var SERIES_COLOR_CYCLE2 = [
+  vars5.chart.series1,
+  vars5.chart.series2,
+  vars5.chart.series3,
+  vars5.chart.series4,
+  vars5.chart.series5,
+  vars5.chart.series6,
+  vars5.chart.series7,
+  vars5.chart.series8
+];
+function getSeriesColor2(series, index) {
+  return series.color ?? SERIES_COLOR_CYCLE2[index % SERIES_COLOR_CYCLE2.length];
+}
+function buildSeriesColorMap(series) {
+  const map = {};
+  series.forEach((s, index) => {
+    map[s.key] = getSeriesColor2(s, index);
+  });
+  return map;
+}
+function resolveMargin2(margin) {
+  return { ...DEFAULT_MARGIN2, ...margin };
+}
+function numericValue2(value) {
+  if (value === void 0) return 0;
+  const n = Number(value);
+  return Number.isFinite(n) ? n : 0;
+}
+function buildScales2(data, series, width, height, margin, layout) {
+  const innerWidth = Math.max(0, width - margin.left - margin.right);
+  const innerHeight = Math.max(0, height - margin.top - margin.bottom);
+  const x0Scale = scaleBand2({
+    domain: data.map((d) => d.category),
+    range: [0, innerWidth],
+    padding: 0.2
+  });
+  const x1Scale = layout === "grouped" ? scaleBand2({
+    domain: series.map((s) => s.key),
+    range: [0, x0Scale.bandwidth()],
+    padding: 0.1
+  }) : void 0;
+  const yMax = layout === "stacked" ? Math.max(0, ...data.map((d) => series.reduce((sum, s) => sum + numericValue2(d[s.key]), 0))) : Math.max(0, ...data.flatMap((d) => series.map((s) => numericValue2(d[s.key]))));
+  const yScale = scaleLinear2({
+    domain: [0, yMax > 0 ? yMax : 1],
+    range: [innerHeight, 0],
+    nice: true
+  });
+  return { x0Scale, x1Scale, xScale: x0Scale, yScale, layout, innerWidth, innerHeight, margin };
+}
+function buildBarChartLayout(data, series, width, height, margin, layout = "grouped") {
+  const resolvedMargin = resolveMargin2(margin);
+  const scales = buildScales2(data, series, width, height, resolvedMargin, layout);
+  const colorMap = buildSeriesColorMap(series);
+  return { scales, colorMap };
+}
+
+// src/components/charts/BarChart/BarChart.css.ts
+var emptyState5 = "chartSurfaces_emptyState__n6njm11";
+var legend2 = "chartSurfaces_legend__n6njm15";
+var legendItem2 = "chartSurfaces_legendItem__n6njm16";
+var legendItemHidden2 = "chartSurfaces_legendItemHidden__n6njm17";
+var legendSwatch2 = "chartSurfaces_legendSwatch__n6njm18";
+var root6 = "chartSurfaces_root__n6njm10";
+var tooltip3 = "chartSurfaces_tooltip__n6njm12";
+var tooltipRow2 = "chartSurfaces_tooltipRow__n6njm13";
+var tooltipSwatch2 = "chartSurfaces_tooltipSwatch__n6njm14";
+
+// src/components/charts/BarChart/BarChart.tsx
+import { jsx as jsx45, jsxs as jsxs28 } from "react/jsx-runtime";
+function BarChart({
+  data,
+  series,
+  width,
+  height,
+  margin,
+  layout = "grouped"
+}) {
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsx45("div", { className: root6, style: { width, height }, children: /* @__PURE__ */ jsx45("div", { className: emptyState5, style: { width, height }, children: "No data" }) });
+  }
+  const { scales, colorMap } = buildBarChartLayout(data, series, width, height, margin, layout);
+  const { x0Scale, x1Scale, xScale, yScale, innerWidth, innerHeight, margin: resolvedMargin } = scales;
+  const keys = series.map((s) => s.key);
+  const color = (key, index) => colorMap[key] ?? SERIES_COLOR_CYCLE2[index % 8];
+  return /* @__PURE__ */ jsx45("div", { className: root6, children: /* @__PURE__ */ jsx45("svg", { width, height, role: "img", "aria-label": "Bar chart", children: /* @__PURE__ */ jsxs28(Group2, { left: resolvedMargin.left, top: resolvedMargin.top, children: [
+    /* @__PURE__ */ jsx45(GridRows2, { scale: yScale, width: innerWidth, height: innerHeight, stroke: vars6.chart.grid }),
+    layout === "stacked" ? /* @__PURE__ */ jsx45(BarStack, { data, keys, x: (d) => d.category, xScale, yScale, color }) : /* @__PURE__ */ jsx45(
+      BarGroup,
+      {
+        data,
+        keys,
+        height: innerHeight,
+        x0: (d) => d.category,
+        x0Scale,
+        x1Scale,
+        yScale,
+        color
+      }
+    ),
+    /* @__PURE__ */ jsx45(
+      AxisBottom2,
+      {
+        top: innerHeight,
+        scale: x0Scale,
+        stroke: vars6.chart.axis,
+        tickStroke: vars6.chart.axis,
+        tickLabelProps: () => ({ fill: vars6.chart.axis, fontSize: 11, textAnchor: "middle" })
+      }
+    ),
+    /* @__PURE__ */ jsx45(
+      AxisLeft2,
+      {
+        scale: yScale,
+        stroke: vars6.chart.axis,
+        tickStroke: vars6.chart.axis,
+        tickLabelProps: () => ({ fill: vars6.chart.axis, fontSize: 11, textAnchor: "end", dx: "-0.25em" })
+      }
+    )
+  ] }) }) });
+}
+
+// src/components/charts/BarChart/BarChart.interactive.tsx
+import { useMemo as useMemo7, useState as useState18 } from "react";
+import { AxisBottom as AxisBottom3, AxisLeft as AxisLeft3 } from "@visx/axis";
+import { GridRows as GridRows3 } from "@visx/grid";
+import { Group as Group3 } from "@visx/group";
+import { ParentSize as ParentSize2 } from "@visx/responsive";
+import { Bar, BarGroup as BarGroup2, BarStack as BarStack2 } from "@visx/shape";
+import { TooltipWithBounds as TooltipWithBounds2, useTooltip as useTooltip2 } from "@visx/tooltip";
+import { vars as vars7 } from "@vesture/tokens";
+import { jsx as jsx46, jsxs as jsxs29 } from "react/jsx-runtime";
+function InteractiveBarChart({
+  data,
+  series,
+  margin,
+  layout = "grouped",
+  height = 320
+}) {
+  const [hiddenKeys, setHiddenKeys] = useState18(/* @__PURE__ */ new Set());
+  const coloredSeries = useMemo7(
+    () => series.map((s, index) => ({ ...s, color: s.color ?? getSeriesColor2(s, index) })),
+    [series]
+  );
+  const visibleSeries = useMemo7(
+    () => coloredSeries.filter((s) => !hiddenKeys.has(s.key)),
+    [coloredSeries, hiddenKeys]
+  );
+  const { tooltipData, tooltipLeft, tooltipTop, tooltipOpen, showTooltip, hideTooltip } = useTooltip2();
+  function toggleSeries(key) {
+    setHiddenKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      return next;
+    });
+  }
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsx46("div", { className: root6, style: { height }, children: /* @__PURE__ */ jsx46("div", { className: emptyState5, style: { height }, children: "No data" }) });
+  }
+  return /* @__PURE__ */ jsxs29("div", { className: root6, children: [
+    /* @__PURE__ */ jsx46(ParentSize2, { initialSize: { width: 600, height }, style: { height }, children: ({ width }) => {
+      if (width === 0) return null;
+      const { scales, colorMap } = buildBarChartLayout(data, visibleSeries, width, height, margin, layout);
+      const { x0Scale, x1Scale, xScale, yScale, innerWidth, innerHeight, margin: resolvedMargin } = scales;
+      const keys = visibleSeries.map((s) => s.key);
+      const seriesByKey = new Map(visibleSeries.map((s) => [s.key, s]));
+      const color = (key, index) => colorMap[key] ?? SERIES_COLOR_CYCLE2[index % 8];
+      function handleBarHover(categoryValue, seriesKey, value, event) {
+        const s = seriesByKey.get(seriesKey);
+        if (!s) return;
+        const bounds = event.currentTarget;
+        const x2 = Number(bounds.getAttribute("x") ?? 0);
+        const y2 = Number(bounds.getAttribute("y") ?? 0);
+        const barWidth = Number(bounds.getAttribute("width") ?? 0);
+        showTooltip({
+          tooltipData: { category: categoryValue, series: s, value },
+          tooltipLeft: resolvedMargin.left + x2 + barWidth / 2,
+          tooltipTop: resolvedMargin.top + y2
+        });
+      }
+      return /* @__PURE__ */ jsxs29("div", { style: { position: "relative", width, height }, children: [
+        /* @__PURE__ */ jsx46("svg", { width, height, role: "img", "aria-label": "Bar chart", children: /* @__PURE__ */ jsxs29(Group3, { left: resolvedMargin.left, top: resolvedMargin.top, children: [
+          /* @__PURE__ */ jsx46(GridRows3, { scale: yScale, width: innerWidth, height: innerHeight, stroke: vars7.chart.grid }),
+          layout === "stacked" ? /* @__PURE__ */ jsx46(
+            BarStack2,
+            {
+              data,
+              keys,
+              x: (d) => d.category,
+              xScale,
+              yScale,
+              color,
+              children: (barStacks) => barStacks.map(
+                (barStack) => barStack.bars.map((bar) => /* @__PURE__ */ jsx46(
+                  Bar,
+                  {
+                    x: bar.x,
+                    y: bar.y,
+                    width: bar.width,
+                    height: bar.height,
+                    fill: bar.color,
+                    onMouseEnter: (event) => handleBarHover(
+                      bar.bar.data.category,
+                      String(barStack.key),
+                      Number(bar.bar.data[barStack.key]),
+                      event
+                    ),
+                    onMouseLeave: () => hideTooltip()
+                  },
+                  `bar-stack-${barStack.index}-${bar.index}`
+                ))
+              )
+            }
+          ) : /* @__PURE__ */ jsx46(
+            BarGroup2,
+            {
+              data,
+              keys,
+              height: innerHeight,
+              x0: (d) => d.category,
+              x0Scale,
+              x1Scale,
+              yScale,
+              color,
+              children: (barGroups) => barGroups.map((barGroup) => /* @__PURE__ */ jsx46(Group3, { left: barGroup.x0, children: barGroup.bars.map((bar) => /* @__PURE__ */ jsx46(
+                Bar,
+                {
+                  x: bar.x,
+                  y: bar.y,
+                  width: bar.width,
+                  height: bar.height,
+                  fill: bar.color,
+                  onMouseEnter: (event) => handleBarHover(data[barGroup.index].category, String(bar.key), bar.value, event),
+                  onMouseLeave: () => hideTooltip()
+                },
+                `bar-group-bar-${barGroup.index}-${bar.key}`
+              )) }, `bar-group-${barGroup.index}`))
+            }
+          ),
+          /* @__PURE__ */ jsx46(
+            AxisBottom3,
+            {
+              top: innerHeight,
+              scale: x0Scale,
+              stroke: vars7.chart.axis,
+              tickStroke: vars7.chart.axis,
+              tickLabelProps: () => ({ fill: vars7.chart.axis, fontSize: 11, textAnchor: "middle" })
+            }
+          ),
+          /* @__PURE__ */ jsx46(
+            AxisLeft3,
+            {
+              scale: yScale,
+              stroke: vars7.chart.axis,
+              tickStroke: vars7.chart.axis,
+              tickLabelProps: () => ({
+                fill: vars7.chart.axis,
+                fontSize: 11,
+                textAnchor: "end",
+                dx: "-0.25em"
+              })
+            }
+          )
+        ] }) }),
+        tooltipOpen && tooltipData ? /* @__PURE__ */ jsxs29(TooltipWithBounds2, { left: tooltipLeft, top: tooltipTop, className: tooltip3, children: [
+          /* @__PURE__ */ jsx46("div", { children: tooltipData.category }),
+          /* @__PURE__ */ jsxs29("div", { className: tooltipRow2, children: [
+            /* @__PURE__ */ jsx46("span", { className: tooltipSwatch2, style: { background: tooltipData.series.color } }),
+            /* @__PURE__ */ jsxs29("span", { children: [
+              tooltipData.series.label,
+              ": ",
+              tooltipData.value
+            ] })
+          ] })
+        ] }) : null
+      ] });
+    } }),
+    /* @__PURE__ */ jsx46("div", { className: legend2, children: coloredSeries.map((s) => {
+      const hidden = hiddenKeys.has(s.key);
+      return /* @__PURE__ */ jsxs29(
+        "button",
+        {
+          type: "button",
+          className: [legendItem2, hidden ? legendItemHidden2 : null].filter(Boolean).join(" "),
+          onClick: () => toggleSeries(s.key),
+          "aria-pressed": !hidden,
+          children: [
+            /* @__PURE__ */ jsx46("span", { className: legendSwatch2, style: { background: s.color } }),
+            s.label
+          ]
+        },
+        s.key
+      );
+    }) })
+  ] });
+}
+
+// src/components/charts/AreaChart/AreaChart.tsx
+import { AxisBottom as AxisBottom4, AxisLeft as AxisLeft4 } from "@visx/axis";
+import { GridRows as GridRows4 } from "@visx/grid";
+import { Group as Group4 } from "@visx/group";
+import { Area } from "@visx/shape";
+import { vars as vars8 } from "@vesture/tokens";
+
+// src/components/charts/AreaChart/AreaChart.render.ts
+var OVERLAP_FILL_OPACITY = 0.35;
+var areaGenerator = area_default().x((p) => p.x).y0((p) => p.y0).y1((p) => p.y1);
+function buildAreaChartLayout(data, series, width, height, margin, xScaleType, stacked = false) {
+  const resolvedMargin = resolveMargin(margin);
+  const resolvedXScaleType = xScaleType ?? inferXScaleType(data);
+  const scales = buildScales(data, series, width, height, resolvedMargin, resolvedXScaleType, stacked);
+  const cumulative = data.map(() => 0);
+  const seriesLayouts = series.map((s, index) => {
+    const points = [];
+    data.forEach((d, dataIndex) => {
+      const rawValue = numericValue(d[s.key]);
+      if (!stacked && rawValue === void 0) return;
+      const x2 = getXPixel(scales, d.x);
+      if (x2 === void 0) return;
+      const baseline = stacked ? cumulative[dataIndex] : 0;
+      const top = stacked ? baseline + (rawValue ?? 0) : rawValue;
+      if (stacked) cumulative[dataIndex] = top;
+      points.push({ dataIndex, x: x2, y0: scales.yScale(baseline), y1: scales.yScale(top) });
+    });
+    return {
+      key: s.key,
+      label: s.label,
+      color: getSeriesColor(s, index),
+      opacity: stacked ? 1 : OVERLAP_FILL_OPACITY,
+      points,
+      path: points.length >= 2 ? areaGenerator(points) ?? "" : ""
+    };
+  });
+  return { scales, seriesLayouts };
+}
+
+// src/components/charts/AreaChart/AreaChart.css.ts
+var emptyState6 = "chartSurfaces_emptyState__n6njm11";
+var legend3 = "chartSurfaces_legend__n6njm15";
+var legendItem3 = "chartSurfaces_legendItem__n6njm16";
+var legendItemHidden3 = "chartSurfaces_legendItemHidden__n6njm17";
+var legendSwatch3 = "chartSurfaces_legendSwatch__n6njm18";
+var overlayRect2 = "AreaChart_overlayRect__1cqtbh30";
+var root7 = "chartSurfaces_root__n6njm10";
+var tooltip4 = "chartSurfaces_tooltip__n6njm12";
+var tooltipRow3 = "chartSurfaces_tooltipRow__n6njm13";
+var tooltipSwatch3 = "chartSurfaces_tooltipSwatch__n6njm14";
+
+// src/components/charts/AreaChart/AreaChart.tsx
+import { jsx as jsx47, jsxs as jsxs30 } from "react/jsx-runtime";
+function AreaChart({
+  data,
+  series,
+  width,
+  height,
+  margin,
+  xScale,
+  stacked = false
+}) {
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsx47("div", { className: root7, style: { width, height }, children: /* @__PURE__ */ jsx47("div", { className: emptyState6, style: { width, height }, children: "No data" }) });
+  }
+  const { scales, seriesLayouts } = buildAreaChartLayout(data, series, width, height, margin, xScale, stacked);
+  const { xScale: scaleX, yScale, innerWidth, innerHeight, margin: resolvedMargin } = scales;
+  return /* @__PURE__ */ jsx47("div", { className: root7, children: /* @__PURE__ */ jsx47("svg", { width, height, role: "img", "aria-label": "Area chart", children: /* @__PURE__ */ jsxs30(Group4, { left: resolvedMargin.left, top: resolvedMargin.top, children: [
+    /* @__PURE__ */ jsx47(GridRows4, { scale: yScale, width: innerWidth, height: innerHeight, stroke: vars8.chart.grid }),
+    seriesLayouts.map((s) => /* @__PURE__ */ jsx47(
+      Area,
+      {
+        data: s.points,
+        x: (p) => p.x,
+        y0: (p) => p.y0,
+        y1: (p) => p.y1,
+        fill: s.color,
+        fillOpacity: s.opacity,
+        stroke: s.color,
+        strokeWidth: 1.5
+      },
+      s.key
+    )),
+    /* @__PURE__ */ jsx47(
+      AxisBottom4,
+      {
+        top: innerHeight,
+        scale: scaleX,
+        stroke: vars8.chart.axis,
+        tickStroke: vars8.chart.axis,
+        tickLabelProps: () => ({ fill: vars8.chart.axis, fontSize: 11, textAnchor: "middle" })
+      }
+    ),
+    /* @__PURE__ */ jsx47(
+      AxisLeft4,
+      {
+        scale: yScale,
+        stroke: vars8.chart.axis,
+        tickStroke: vars8.chart.axis,
+        tickLabelProps: () => ({ fill: vars8.chart.axis, fontSize: 11, textAnchor: "end", dx: "-0.25em" })
+      }
+    )
+  ] }) }) });
+}
+
+// src/components/charts/AreaChart/AreaChart.interactive.tsx
+import { useMemo as useMemo8, useState as useState19 } from "react";
+import { ParentSize as ParentSize3 } from "@visx/responsive";
+import { TooltipWithBounds as TooltipWithBounds3, useTooltip as useTooltip3 } from "@visx/tooltip";
+import { jsx as jsx48, jsxs as jsxs31 } from "react/jsx-runtime";
+function InteractiveAreaChart({
+  data,
+  series,
+  margin,
+  xScale,
+  stacked = false,
+  height = 320
+}) {
+  const [hiddenKeys, setHiddenKeys] = useState19(/* @__PURE__ */ new Set());
+  const coloredSeries = useMemo8(
+    () => series.map((s, index) => ({ ...s, color: s.color ?? getSeriesColor(s, index) })),
+    [series]
+  );
+  const visibleSeries = useMemo8(
+    () => coloredSeries.filter((s) => !hiddenKeys.has(s.key)),
+    [coloredSeries, hiddenKeys]
+  );
+  const { tooltipData, tooltipLeft, tooltipTop, tooltipOpen, showTooltip, hideTooltip } = useTooltip3();
+  function toggleSeries(key) {
+    setHiddenKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      return next;
+    });
+  }
+  return /* @__PURE__ */ jsxs31("div", { className: root7, children: [
+    /* @__PURE__ */ jsx48(ParentSize3, { initialSize: { width: 600, height }, style: { height }, children: ({ width }) => {
+      if (width === 0) return null;
+      const { scales } = buildAreaChartLayout(data, visibleSeries, width, height, margin, xScale, stacked);
+      function handleMouseMove(event) {
+        const bounds = event.currentTarget.getBoundingClientRect();
+        const pixelX = event.clientX - bounds.left;
+        const dataIndex = findNearestDataIndex(data, scales, pixelX);
+        if (dataIndex === null) {
+          hideTooltip();
+          return;
+        }
+        const dataPoint = data[dataIndex];
+        const xPixel = getXPixel(scales, dataPoint.x) ?? pixelX;
+        showTooltip({
+          tooltipData: { dataPoint, visibleSeries },
+          tooltipLeft: scales.margin.left + xPixel,
+          tooltipTop: 0
+        });
+      }
+      return /* @__PURE__ */ jsxs31("div", { style: { position: "relative", width, height }, children: [
+        /* @__PURE__ */ jsx48(
+          AreaChart,
+          {
+            data,
+            series: visibleSeries,
+            width,
+            height,
+            margin,
+            xScale,
+            stacked
+          }
+        ),
+        /* @__PURE__ */ jsx48(
+          "svg",
+          {
+            width,
+            height,
+            style: { position: "absolute", top: 0, left: 0 },
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ jsx48(
+              "rect",
+              {
+                className: overlayRect2,
+                "data-testid": "area-chart-overlay",
+                x: scales.margin.left,
+                y: scales.margin.top,
+                width: scales.innerWidth,
+                height: scales.innerHeight,
+                onMouseMove: handleMouseMove,
+                onMouseLeave: () => hideTooltip()
+              }
+            )
+          }
+        ),
+        tooltipOpen && tooltipData ? /* @__PURE__ */ jsxs31(TooltipWithBounds3, { left: tooltipLeft, top: tooltipTop, className: tooltip4, children: [
+          /* @__PURE__ */ jsx48("div", { children: String(tooltipData.dataPoint.x) }),
+          tooltipData.visibleSeries.map((s) => /* @__PURE__ */ jsxs31("div", { className: tooltipRow3, children: [
+            /* @__PURE__ */ jsx48("span", { className: tooltipSwatch3, style: { background: s.color } }),
+            /* @__PURE__ */ jsxs31("span", { children: [
+              s.label,
+              ": ",
+              String(tooltipData.dataPoint[s.key])
+            ] })
+          ] }, s.key))
+        ] }) : null
+      ] });
+    } }),
+    /* @__PURE__ */ jsx48("div", { className: legend3, children: coloredSeries.map((s) => {
+      const hidden = hiddenKeys.has(s.key);
+      return /* @__PURE__ */ jsxs31(
+        "button",
+        {
+          type: "button",
+          className: [legendItem3, hidden ? legendItemHidden3 : null].filter(Boolean).join(" "),
+          onClick: () => toggleSeries(s.key),
+          "aria-pressed": !hidden,
+          children: [
+            /* @__PURE__ */ jsx48("span", { className: legendSwatch3, style: { background: s.color } }),
+            s.label
+          ]
+        },
+        s.key
+      );
+    }) })
+  ] });
+}
+
+// src/components/charts/PieChart/PieChart.tsx
+import { Group as Group5 } from "@visx/group";
+import { Pie } from "@visx/shape";
+import { vars as vars10 } from "@vesture/tokens";
+
+// src/components/charts/PieChart/PieChart.render.ts
+import { vars as vars9 } from "@vesture/tokens";
+var SERIES_COLOR_CYCLE3 = [
+  vars9.chart.series1,
+  vars9.chart.series2,
+  vars9.chart.series3,
+  vars9.chart.series4,
+  vars9.chart.series5,
+  vars9.chart.series6,
+  vars9.chart.series7,
+  vars9.chart.series8
+];
+function getSeriesColor3(slice2, index) {
+  return slice2.color ?? SERIES_COLOR_CYCLE3[index % SERIES_COLOR_CYCLE3.length];
+}
+function computePercentages(slices) {
+  const total = slices.reduce((sum, s) => sum + s.value, 0);
+  return slices.map((s) => ({ ...s, percentage: total > 0 ? s.value / total * 100 : 0 }));
+}
+function colorSlices(data) {
+  return data.map((d, index) => ({ key: d.key, label: d.label, value: d.value, color: getSeriesColor3(d, index) }));
+}
+function preparePieSlices(data) {
+  const positive = colorSlices(data).filter((s) => s.value > 0);
+  return computePercentages(positive);
+}
+var MIN_LABEL_ARC_LENGTH_PX = 28;
+function isLabelFittable(startAngle, endAngle, outerRadius) {
+  return (endAngle - startAngle) * outerRadius >= MIN_LABEL_ARC_LENGTH_PX;
+}
+function arcBisectorDirection(startAngle, endAngle) {
+  const bisector = (startAngle + endAngle) / 2;
+  return [Math.sin(bisector), -Math.cos(bisector)];
+}
+
+// src/components/charts/PieChart/PieChart.css.ts
+var emptyState7 = "chartSurfaces_emptyState__n6njm11";
+var legend4 = "chartSurfaces_legend__n6njm15";
+var legendItem4 = "chartSurfaces_legendItem__n6njm16";
+var legendItemHidden4 = "chartSurfaces_legendItemHidden__n6njm17";
+var legendPercentage = "PieChart_legendPercentage__19xd4rn0";
+var legendSwatch4 = "chartSurfaces_legendSwatch__n6njm18";
+var root8 = "chartSurfaces_root__n6njm10";
+var sliceGroup = "PieChart_sliceGroup__19xd4rn1";
+var tooltip5 = "chartSurfaces_tooltip__n6njm12";
+var tooltipRow4 = "chartSurfaces_tooltipRow__n6njm13";
+var tooltipSwatch4 = "chartSurfaces_tooltipSwatch__n6njm14";
+
+// src/components/charts/PieChart/PieChart.tsx
+import { jsx as jsx49, jsxs as jsxs32 } from "react/jsx-runtime";
+var OUTER_PADDING = 8;
+function PieChart({
+  data,
+  width,
+  height,
+  innerRadius = 0,
+  showLabels = true
+}) {
+  const slices = preparePieSlices(data);
+  if (slices.length === 0) {
+    return /* @__PURE__ */ jsx49("div", { className: root8, style: { width, height }, children: /* @__PURE__ */ jsx49("div", { className: emptyState7, style: { width, height }, children: "No data" }) });
+  }
+  const outerRadius = Math.max(0, Math.min(width, height) / 2 - OUTER_PADDING);
+  const pieInnerRadius = outerRadius * innerRadius;
+  return /* @__PURE__ */ jsx49("div", { className: root8, children: /* @__PURE__ */ jsx49("svg", { width, height, role: "img", "aria-label": "Pie chart", children: /* @__PURE__ */ jsx49(Group5, { top: height / 2, left: width / 2, children: /* @__PURE__ */ jsx49(
+    Pie,
+    {
+      data: slices,
+      pieValue: (s) => s.value,
+      pieSort: null,
+      outerRadius,
+      innerRadius: pieInnerRadius,
+      children: (pie) => pie.arcs.map((arc) => {
+        const [labelX, labelY] = pie.path.centroid(arc);
+        const showLabel = showLabels && isLabelFittable(arc.startAngle, arc.endAngle, outerRadius);
+        return /* @__PURE__ */ jsxs32("g", { children: [
+          /* @__PURE__ */ jsx49("path", { d: pie.path(arc) ?? "", fill: arc.data.color }),
+          showLabel ? /* @__PURE__ */ jsx49(
+            "text",
+            {
+              x: labelX,
+              y: labelY,
+              textAnchor: "middle",
+              dominantBaseline: "middle",
+              fill: vars10.color.textInverse,
+              fontSize: vars10.font.sizeXs,
+              fontFamily: vars10.font.body,
+              children: `${Math.round(arc.data.percentage)}%`
+            }
+          ) : null
+        ] }, arc.data.key);
+      })
+    }
+  ) }) }) });
+}
+
+// src/components/charts/PieChart/PieChart.interactive.tsx
+import { useMemo as useMemo9, useState as useState20 } from "react";
+import { Group as Group6 } from "@visx/group";
+import { ParentSize as ParentSize4 } from "@visx/responsive";
+import { Pie as Pie2 } from "@visx/shape";
+import { TooltipWithBounds as TooltipWithBounds4, useTooltip as useTooltip4 } from "@visx/tooltip";
+import { vars as vars11 } from "@vesture/tokens";
+import { jsx as jsx50, jsxs as jsxs33 } from "react/jsx-runtime";
+var OUTER_PADDING2 = 8;
+var HOVER_OFFSET_PX = 8;
+function InteractivePieChart({
+  data,
+  innerRadius = 0,
+  showLabels = true,
+  height = 320
+}) {
+  const [hiddenKeys, setHiddenKeys] = useState20(/* @__PURE__ */ new Set());
+  const [hoveredKey, setHoveredKey] = useState20(null);
+  const coloredSlices = useMemo9(() => colorSlices(data), [data]);
+  const visibleSlices = useMemo9(
+    () => coloredSlices.filter((s) => s.value > 0 && !hiddenKeys.has(s.key)),
+    [coloredSlices, hiddenKeys]
+  );
+  const slices = useMemo9(() => computePercentages(visibleSlices), [visibleSlices]);
+  const percentageByKey = useMemo9(() => new Map(slices.map((s) => [s.key, s.percentage])), [slices]);
+  const { tooltipData, tooltipLeft, tooltipTop, tooltipOpen, showTooltip, hideTooltip } = useTooltip4();
+  function toggleSlice(key) {
+    setHiddenKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      return next;
+    });
+  }
+  if (slices.length === 0) {
+    return /* @__PURE__ */ jsx50("div", { className: root8, style: { height }, children: /* @__PURE__ */ jsx50("div", { className: emptyState7, style: { height }, children: "No data" }) });
+  }
+  return /* @__PURE__ */ jsxs33("div", { className: root8, children: [
+    /* @__PURE__ */ jsx50(ParentSize4, { initialSize: { width: 600, height }, style: { height }, children: ({ width }) => {
+      if (width === 0) return null;
+      const outerRadius = Math.max(0, Math.min(width, height) / 2 - OUTER_PADDING2);
+      const pieInnerRadius = outerRadius * innerRadius;
+      function handleSliceHover(datum, centroidX, centroidY) {
+        showTooltip({
+          tooltipData: datum,
+          tooltipLeft: width / 2 + centroidX,
+          tooltipTop: height / 2 + centroidY
+        });
+        setHoveredKey(datum.key);
+      }
+      function handleSliceLeave() {
+        hideTooltip();
+        setHoveredKey(null);
+      }
+      return /* @__PURE__ */ jsxs33("div", { style: { position: "relative", width, height }, children: [
+        /* @__PURE__ */ jsx50("svg", { width, height, role: "img", "aria-label": "Pie chart", children: /* @__PURE__ */ jsx50(Group6, { top: height / 2, left: width / 2, children: /* @__PURE__ */ jsx50(
+          Pie2,
+          {
+            data: slices,
+            pieValue: (s) => s.value,
+            pieSort: null,
+            outerRadius,
+            innerRadius: pieInnerRadius,
+            children: (pie) => pie.arcs.map((arc) => {
+              const [centroidX, centroidY] = pie.path.centroid(arc);
+              const showLabel = showLabels && isLabelFittable(arc.startAngle, arc.endAngle, outerRadius);
+              const isHovered = hoveredKey === arc.data.key;
+              const [dx, dy] = arcBisectorDirection(arc.startAngle, arc.endAngle);
+              const transform = isHovered ? `translate(${dx * HOVER_OFFSET_PX}px, ${dy * HOVER_OFFSET_PX}px)` : void 0;
+              return /* @__PURE__ */ jsxs33("g", { className: sliceGroup, style: { transform }, children: [
+                /* @__PURE__ */ jsx50(
+                  "path",
+                  {
+                    d: pie.path(arc) ?? "",
+                    fill: arc.data.color,
+                    "data-testid": `pie-slice-${arc.data.key}`,
+                    onMouseEnter: () => handleSliceHover(arc.data, centroidX, centroidY),
+                    onMouseLeave: handleSliceLeave
+                  }
+                ),
+                showLabel ? /* @__PURE__ */ jsx50(
+                  "text",
+                  {
+                    x: centroidX,
+                    y: centroidY,
+                    textAnchor: "middle",
+                    dominantBaseline: "middle",
+                    fill: vars11.color.textInverse,
+                    fontSize: vars11.font.sizeXs,
+                    fontFamily: vars11.font.body,
+                    style: { pointerEvents: "none" },
+                    children: `${Math.round(arc.data.percentage)}%`
+                  }
+                ) : null
+              ] }, arc.data.key);
+            })
+          }
+        ) }) }),
+        tooltipOpen && tooltipData ? /* @__PURE__ */ jsx50(TooltipWithBounds4, { left: tooltipLeft, top: tooltipTop, className: tooltip5, children: /* @__PURE__ */ jsxs33("div", { className: tooltipRow4, children: [
+          /* @__PURE__ */ jsx50("span", { className: tooltipSwatch4, style: { background: tooltipData.color } }),
+          /* @__PURE__ */ jsxs33("span", { children: [
+            tooltipData.label,
+            ": ",
+            tooltipData.value,
+            " (",
+            Math.round(tooltipData.percentage),
+            "%)"
+          ] })
+        ] }) }) : null
+      ] });
+    } }),
+    /* @__PURE__ */ jsx50("div", { className: legend4, children: coloredSlices.filter((s) => s.value > 0).map((s) => {
+      const hidden = hiddenKeys.has(s.key);
+      const percentage = percentageByKey.get(s.key);
+      return /* @__PURE__ */ jsxs33(
+        "button",
+        {
+          type: "button",
+          className: [legendItem4, hidden ? legendItemHidden4 : null].filter(Boolean).join(" "),
+          onClick: () => toggleSlice(s.key),
+          "aria-pressed": !hidden,
+          children: [
+            /* @__PURE__ */ jsx50("span", { className: legendSwatch4, style: { background: s.color } }),
+            s.label,
+            !hidden && percentage !== void 0 ? /* @__PURE__ */ jsxs33("span", { className: legendPercentage, children: [
+              Math.round(percentage),
+              "%"
+            ] }) : null
+          ]
+        },
+        s.key
+      );
+    }) })
+  ] });
+}
+
+// src/components/Scheduler/Scheduler.tsx
+import { useMemo as useMemo10, useRef as useRef12, useState as useState21 } from "react";
+
+// src/components/Scheduler/Scheduler.css.ts
+var allDayCell = "Scheduler_allDayCell__1to95h2c";
+var allDayEventBlock = "Scheduler_allDayEventBlock__1to95h2o";
+var allDayGutter = "Scheduler_allDayGutter__1to95h2b";
+var allDayRow = "Scheduler_allDayRow__1to95h2a";
+var dayColumn = "Scheduler_dayColumn__1to95h2g";
+var dayHeaderCell = "Scheduler_dayHeaderCell__1to95h28";
+var dayHeaderDateNumber = "Scheduler_dayHeaderDateNumber__1to95h29";
+var dayHeaderGutter = "Scheduler_dayHeaderGutter__1to95h27";
+var dayHeaderRow = "Scheduler_dayHeaderRow__1to95h26";
+var dragPreview = "Scheduler_dragPreview__1to95h2l";
+var dragPreviewLabel = "Scheduler_dragPreviewLabel__1to95h2m";
+var eventBlock = "Scheduler_eventBlock__1to95h2j";
+var eventTime = "Scheduler_eventTime__1to95h2q";
+var eventTitle = "Scheduler_eventTitle__1to95h2p";
+var header2 = "Scheduler_header__1to95h21";
+var headerNav = "Scheduler_headerNav__1to95h22";
+var hourLabel = "Scheduler_hourLabel__1to95h2f";
+var navButton2 = "Scheduler_navButton__1to95h23";
+var nowLine = "Scheduler_nowLine__1to95h2h";
+var nowLineDot = "Scheduler_nowLineDot__1to95h2i";
+var rangeLabel = "Scheduler_rangeLabel__1to95h25";
+var resizeHandle2 = "Scheduler_resizeHandle__1to95h2k";
+var root9 = "Scheduler_root__1to95h20";
+var scrollArea = "Scheduler_scrollArea__1to95h2d";
+var timeGutter = "Scheduler_timeGutter__1to95h2e";
+var todayButton = "Scheduler_todayButton__1to95h24";
+var visuallyHidden = "Scheduler_visuallyHidden__1to95h2n";
+
+// src/components/Scheduler/scheduler-layout.ts
+import { vars as vars12 } from "@vesture/tokens";
+var SLOT_HEIGHT_PX = 24;
+function layoutOverlappingEvents(events) {
+  if (events.length === 0) return [];
+  const sorted = [...events].sort((a, b) => {
+    const startDiff = a.start.getTime() - b.start.getTime();
+    if (startDiff !== 0) return startDiff;
+    return a.end.getTime() - b.end.getTime();
+  });
+  const results = /* @__PURE__ */ new Map();
+  let cluster = [];
+  let clusterEnd = -Infinity;
+  const flushCluster = () => {
+    if (cluster.length === 0) return;
+    const columnEndTimes = [];
+    for (const event of cluster) {
+      const startTime = event.start.getTime();
+      let columnIndex = columnEndTimes.findIndex((end) => end <= startTime);
+      if (columnIndex === -1) {
+        columnIndex = columnEndTimes.length;
+        columnEndTimes.push(event.end.getTime());
+      } else {
+        columnEndTimes[columnIndex] = event.end.getTime();
+      }
+      results.set(event.id, { id: event.id, columnIndex, columnCount: 0 });
+    }
+    const columnCount = columnEndTimes.length;
+    for (const event of cluster) {
+      results.get(event.id).columnCount = columnCount;
+    }
+    cluster = [];
+  };
+  for (const event of sorted) {
+    const startTime = event.start.getTime();
+    const endTime = event.end.getTime();
+    if (cluster.length === 0 || startTime < clusterEnd) {
+      cluster.push(event);
+      clusterEnd = Math.max(clusterEnd, endTime);
+    } else {
+      flushCluster();
+      cluster.push(event);
+      clusterEnd = endTime;
+    }
+  }
+  flushCluster();
+  return events.map((event) => results.get(event.id));
+}
+function getVerticalMetrics(start, end, startHour, endHour) {
+  const rangeStartMinutes = startHour * 60;
+  const rangeEndMinutes = endHour * 60;
+  const totalMinutes = rangeEndMinutes - rangeStartMinutes;
+  if (totalMinutes <= 0) return null;
+  const startMinutes = start.getHours() * 60 + start.getMinutes();
+  const endMinutes = end.getHours() * 60 + end.getMinutes();
+  const clippedStart = Math.max(startMinutes, rangeStartMinutes);
+  const clippedEnd = Math.min(endMinutes, rangeEndMinutes);
+  if (clippedEnd <= clippedStart) return null;
+  return {
+    top: (clippedStart - rangeStartMinutes) / totalMinutes * 100,
+    height: (clippedEnd - clippedStart) / totalMinutes * 100
+  };
+}
+function pixelDeltaToSnappedMinutes(deltaPx, slotDuration) {
+  const rawSlots = deltaPx / SLOT_HEIGHT_PX;
+  return Math.round(rawSlots) * slotDuration;
+}
+function minutesOfDay(date) {
+  return date.getHours() * 60 + date.getMinutes();
+}
+function combineDayAndMinutes(day, minutesOfDayValue) {
+  const result = new Date(day.getFullYear(), day.getMonth(), day.getDate());
+  result.setMinutes(minutesOfDayValue);
+  return result;
+}
+function computeMoveResult(params) {
+  const { originalStart, originalEnd, targetDay, deltaYPx, slotDuration, startHour, endHour } = params;
+  const durationMinutes = (originalEnd.getTime() - originalStart.getTime()) / 6e4;
+  const deltaMinutes = pixelDeltaToSnappedMinutes(deltaYPx, slotDuration);
+  const rawStartMinutes = minutesOfDay(originalStart) + deltaMinutes;
+  const rangeStart = startHour * 60;
+  const rangeEnd = endHour * 60;
+  const maxStart = Math.max(rangeStart, rangeEnd - durationMinutes);
+  const clampedStartMinutes = Math.min(Math.max(rawStartMinutes, rangeStart), maxStart);
+  const start = combineDayAndMinutes(targetDay, clampedStartMinutes);
+  const end = new Date(start.getTime() + durationMinutes * 6e4);
+  return { start, end };
+}
+function computeResizeResult(params) {
+  const { originalStart, originalEnd, deltaYPx, slotDuration, minEventDuration, endHour } = params;
+  const deltaMinutes = pixelDeltaToSnappedMinutes(deltaYPx, slotDuration);
+  const rawEndMinutes = minutesOfDay(originalEnd) + deltaMinutes;
+  const startMinutes = minutesOfDay(originalStart);
+  const rangeEnd = endHour * 60;
+  const clampedEndMinutes = Math.min(
+    Math.max(rawEndMinutes, startMinutes + minEventDuration),
+    rangeEnd
+  );
+  const end = combineDayAndMinutes(originalStart, clampedEndMinutes);
+  return { end };
+}
+var SERIES_COLOR_CYCLE4 = [
+  vars12.chart.series1,
+  vars12.chart.series2,
+  vars12.chart.series3,
+  vars12.chart.series4,
+  vars12.chart.series5,
+  vars12.chart.series6,
+  vars12.chart.series7,
+  vars12.chart.series8
+];
+function hashStringToIndex(value, bucketCount) {
+  let hash = 5381;
+  for (let i = 0; i < value.length; i++) {
+    hash = hash * 33 ^ value.charCodeAt(i);
+  }
+  return Math.abs(hash) % bucketCount;
+}
+function getEventColor(id, override) {
+  if (override) return override;
+  return SERIES_COLOR_CYCLE4[hashStringToIndex(id, SERIES_COLOR_CYCLE4.length)];
+}
+
+// src/components/Scheduler/Scheduler.tsx
+import { jsx as jsx51, jsxs as jsxs34 } from "react/jsx-runtime";
+function formatEventTime(date, locale) {
+  return new Intl.DateTimeFormat(locale, {
+    hour: "numeric",
+    minute: "2-digit"
+  }).format(date);
+}
+function Scheduler({
+  events,
+  date,
+  onDateChange,
+  weekStartsOn = 1,
+  startHour = 0,
+  endHour = 24,
+  slotDuration = 30,
+  onEventClick,
+  onEventChange,
+  editable = false,
+  minEventDuration,
+  selectedEventId,
+  locale = "en-US",
+  className
+}) {
+  const weekStart = useMemo10(
+    () => startOfWeek(clampToMidnight(date), weekStartsOn),
+    [date, weekStartsOn]
+  );
+  const days = useMemo10(
+    () => Array.from({ length: 7 }, (_, i) => addDays(weekStart, i)),
+    [weekStart]
+  );
+  const today = useMemo10(() => clampToMidnight(/* @__PURE__ */ new Date()), []);
+  const now = useMemo10(() => /* @__PURE__ */ new Date(), []);
+  const weekdayFormatter = useMemo10(
+    () => new Intl.DateTimeFormat(locale, { weekday: "short" }),
+    [locale]
+  );
+  const dayNumberFormatter = useMemo10(
+    () => new Intl.DateTimeFormat(locale, { day: "numeric" }),
+    [locale]
+  );
+  const monthDayFormatter = useMemo10(
+    () => new Intl.DateTimeFormat(locale, { month: "short", day: "numeric" }),
+    [locale]
+  );
+  const yearFormatter = useMemo10(
+    () => new Intl.DateTimeFormat(locale, { year: "numeric" }),
+    [locale]
+  );
+  const hourFormatter = useMemo10(
+    () => new Intl.DateTimeFormat(locale, { hour: "numeric" }),
+    [locale]
+  );
+  const weekdayLongFormatter = useMemo10(
+    () => new Intl.DateTimeFormat(locale, { weekday: "long" }),
+    [locale]
+  );
+  const weekEnd = days[6];
+  const rangeLabelText = `${monthDayFormatter.format(weekStart)} \u2013 ${monthDayFormatter.format(weekEnd)}, ${yearFormatter.format(weekEnd)}`;
+  const totalMinutes = (endHour - startHour) * 60;
+  const slotsCount = Math.max(1, Math.ceil(totalMinutes / slotDuration));
+  const totalHeightPx = slotsCount * SLOT_HEIGHT_PX;
+  const resolvedMinEventDuration = minEventDuration ?? slotDuration;
+  const hourMarks = useMemo10(() => {
+    const marks = [];
+    for (let hour = startHour; hour <= endHour; hour++) {
+      const labelDate = new Date(2e3, 0, 1, hour === 24 ? 0 : hour, 0);
+      marks.push({
+        hour,
+        label: hourFormatter.format(labelDate),
+        top: (hour - startHour) * 60 / totalMinutes * 100
+      });
+    }
+    return marks;
+  }, [startHour, endHour, totalMinutes, hourFormatter]);
+  const nowMinutes = now.getHours() * 60 + now.getMinutes();
+  const showNowLine = nowMinutes >= startHour * 60 && nowMinutes < endHour * 60;
+  const nowTop = (nowMinutes - startHour * 60) / totalMinutes * 100;
+  const allDayEventsByDay = useMemo10(
+    () => days.map(
+      (day) => events.filter((event) => event.allDay && isSameDay(event.start, day))
+    ),
+    [days, events]
+  );
+  const timedEventsByDay = useMemo10(
+    () => days.map((day) => {
+      const dayEvents = events.filter(
+        (event) => !event.allDay && isSameDay(event.start, day)
+      );
+      const layout = layoutOverlappingEvents(
+        dayEvents.map((event) => ({
+          id: event.id,
+          start: event.start,
+          end: event.end
+        }))
+      );
+      const layoutById = new Map(layout.map((l) => [l.id, l]));
+      return dayEvents.map((event) => {
+        const metrics = getVerticalMetrics(
+          event.start,
+          event.end,
+          startHour,
+          endHour
+        );
+        if (!metrics) return null;
+        const placement = layoutById.get(event.id);
+        return { event, metrics, placement };
+      }).filter(
+        (entry) => entry !== null
+      );
+    }),
+    [days, events, startHour, endHour]
+  );
+  const [drag, setDrag] = useState21(null);
+  const [announcement, setAnnouncement] = useState21("");
+  const suppressClickRef = useRef12(false);
+  const dayColumnRefs = useRef12([]);
+  const announceMove = (event, start, end) => {
+    setAnnouncement(
+      `${event.title} moved to ${weekdayLongFormatter.format(start)}, ${formatEventTime(start, locale)} to ${formatEventTime(end, locale)}.`
+    );
+  };
+  const announceResize = (event, end) => {
+    setAnnouncement(
+      `${event.title} resized to end at ${formatEventTime(end, locale)}.`
+    );
+  };
+  const handleEventActivate = (event) => {
+    if (suppressClickRef.current) {
+      suppressClickRef.current = false;
+      return;
+    }
+    onEventClick?.(event);
+  };
+  const handleMovePointerDown = (event, dayIndex) => (pointerEvent) => {
+    if (!editable) return;
+    pointerEvent.preventDefault();
+    const target = pointerEvent.currentTarget;
+    try {
+      target.setPointerCapture(pointerEvent.pointerId);
+    } catch {
+    }
+    target.focus();
+    setDrag({
+      kind: "move",
+      event,
+      pointerId: pointerEvent.pointerId,
+      startClientX: pointerEvent.clientX,
+      startClientY: pointerEvent.clientY,
+      startDayIndex: dayIndex,
+      currentDayIndex: dayIndex,
+      currentStart: event.start,
+      currentEnd: event.end,
+      moved: false
+    });
+  };
+  const handleResizePointerDown = (event, dayIndex) => (pointerEvent) => {
+    if (!editable) return;
+    pointerEvent.preventDefault();
+    pointerEvent.stopPropagation();
+    const target = pointerEvent.currentTarget;
+    try {
+      target.setPointerCapture(pointerEvent.pointerId);
+    } catch {
+    }
+    setDrag({
+      kind: "resize",
+      event,
+      pointerId: pointerEvent.pointerId,
+      startClientX: pointerEvent.clientX,
+      startClientY: pointerEvent.clientY,
+      startDayIndex: dayIndex,
+      currentDayIndex: dayIndex,
+      currentStart: event.start,
+      currentEnd: event.end,
+      moved: false
+    });
+  };
+  const handleDragPointerMove = (pointerEvent) => {
+    if (!drag || pointerEvent.pointerId !== drag.pointerId) return;
+    pointerEvent.stopPropagation();
+    const deltaY = pointerEvent.clientY - drag.startClientY;
+    if (drag.kind === "move") {
+      const deltaX = pointerEvent.clientX - drag.startClientX;
+      const columnWidth = dayColumnRefs.current[drag.startDayIndex]?.getBoundingClientRect().width ?? 0;
+      const dayDelta = columnWidth > 0 ? Math.round(deltaX / columnWidth) : 0;
+      const targetDayIndex = Math.min(6, Math.max(0, drag.startDayIndex + dayDelta));
+      const targetDay = days[targetDayIndex];
+      const { start, end } = computeMoveResult({
+        originalStart: drag.event.start,
+        originalEnd: drag.event.end,
+        targetDay,
+        deltaYPx: deltaY,
+        slotDuration,
+        startHour,
+        endHour
+      });
+      const moved = targetDayIndex !== drag.startDayIndex || start.getTime() !== drag.event.start.getTime();
+      setDrag({ ...drag, currentDayIndex: targetDayIndex, currentStart: start, currentEnd: end, moved });
+    } else {
+      const { end } = computeResizeResult({
+        originalStart: drag.event.start,
+        originalEnd: drag.event.end,
+        deltaYPx: deltaY,
+        slotDuration,
+        minEventDuration: resolvedMinEventDuration,
+        endHour
+      });
+      const moved = end.getTime() !== drag.event.end.getTime();
+      setDrag({ ...drag, currentEnd: end, moved });
+    }
+  };
+  const handleDragPointerUp = (pointerEvent) => {
+    if (!drag || pointerEvent.pointerId !== drag.pointerId) return;
+    pointerEvent.stopPropagation();
+    const finished = drag;
+    setDrag(null);
+    if (finished.kind === "move") {
+      if (!finished.moved) {
+        suppressClickRef.current = true;
+        onEventClick?.(finished.event);
+        return;
+      }
+      onEventChange?.(finished.event, finished.currentStart, finished.currentEnd);
+      announceMove(finished.event, finished.currentStart, finished.currentEnd);
+      return;
+    }
+    if (!finished.moved) return;
+    onEventChange?.(finished.event, finished.currentStart, finished.currentEnd);
+    announceResize(finished.event, finished.currentEnd);
+  };
+  const handleDragPointerCancel = (pointerEvent) => {
+    if (!drag || pointerEvent.pointerId !== drag.pointerId) return;
+    pointerEvent.stopPropagation();
+    setDrag(null);
+  };
+  const handleEventKeyDown = (keyboardEvent, event, dayIndex) => {
+    if (!editable) return;
+    if (keyboardEvent.shiftKey && (keyboardEvent.key === "ArrowDown" || keyboardEvent.key === "ArrowUp")) {
+      keyboardEvent.preventDefault();
+      const direction2 = keyboardEvent.key === "ArrowDown" ? 1 : -1;
+      const { end } = computeResizeResult({
+        originalStart: event.start,
+        originalEnd: event.end,
+        deltaYPx: direction2 * SLOT_HEIGHT_PX,
+        slotDuration,
+        minEventDuration: resolvedMinEventDuration,
+        endHour
+      });
+      if (end.getTime() === event.end.getTime()) return;
+      onEventChange?.(event, event.start, end);
+      announceResize(event, end);
+      return;
+    }
+    switch (keyboardEvent.key) {
+      case "ArrowUp":
+      case "ArrowDown": {
+        keyboardEvent.preventDefault();
+        const direction2 = keyboardEvent.key === "ArrowDown" ? 1 : -1;
+        const { start, end } = computeMoveResult({
+          originalStart: event.start,
+          originalEnd: event.end,
+          targetDay: days[dayIndex],
+          deltaYPx: direction2 * SLOT_HEIGHT_PX,
+          slotDuration,
+          startHour,
+          endHour
+        });
+        if (start.getTime() === event.start.getTime()) return;
+        onEventChange?.(event, start, end);
+        announceMove(event, start, end);
+        break;
+      }
+      case "ArrowLeft":
+      case "ArrowRight": {
+        keyboardEvent.preventDefault();
+        const direction2 = keyboardEvent.key === "ArrowRight" ? 1 : -1;
+        const targetDayIndex = Math.min(6, Math.max(0, dayIndex + direction2));
+        if (targetDayIndex === dayIndex) return;
+        const { start, end } = computeMoveResult({
+          originalStart: event.start,
+          originalEnd: event.end,
+          targetDay: days[targetDayIndex],
+          deltaYPx: 0,
+          slotDuration,
+          startHour,
+          endHour
+        });
+        onEventChange?.(event, start, end);
+        announceMove(event, start, end);
+        break;
+      }
+      default:
+        return;
+    }
+  };
+  const dragPreviewMetrics = drag && drag.kind === "move" ? getVerticalMetrics(drag.currentStart, drag.currentEnd, startHour, endHour) : null;
+  return /* @__PURE__ */ jsxs34("div", { className: [root9, className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsx51(
+      "div",
+      {
+        "aria-live": "polite",
+        className: visuallyHidden,
+        children: announcement
+      }
+    ),
+    /* @__PURE__ */ jsxs34("div", { className: header2, children: [
+      /* @__PURE__ */ jsx51("span", { className: rangeLabel, children: rangeLabelText }),
+      /* @__PURE__ */ jsxs34("div", { className: headerNav, children: [
+        /* @__PURE__ */ jsx51(
+          "button",
+          {
+            type: "button",
+            className: navButton2,
+            "aria-label": "Previous week",
+            onClick: () => onDateChange?.(addDays(date, -7)),
+            children: "\u2039"
+          }
+        ),
+        /* @__PURE__ */ jsx51(
+          "button",
+          {
+            type: "button",
+            className: todayButton,
+            onClick: () => onDateChange?.(/* @__PURE__ */ new Date()),
+            children: "Today"
+          }
+        ),
+        /* @__PURE__ */ jsx51(
+          "button",
+          {
+            type: "button",
+            className: navButton2,
+            "aria-label": "Next week",
+            onClick: () => onDateChange?.(addDays(date, 7)),
+            children: "\u203A"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs34("div", { className: dayHeaderRow, children: [
+      /* @__PURE__ */ jsx51("div", { className: dayHeaderGutter }),
+      days.map((day) => {
+        const isToday = isSameDay(day, today);
+        return /* @__PURE__ */ jsxs34("div", { className: dayHeaderCell, "data-today": isToday || void 0, children: [
+          /* @__PURE__ */ jsx51("span", { children: weekdayFormatter.format(day) }),
+          /* @__PURE__ */ jsx51("span", { className: dayHeaderDateNumber, "data-today": isToday || void 0, children: dayNumberFormatter.format(day) })
+        ] }, day.toISOString());
+      })
+    ] }),
+    /* @__PURE__ */ jsxs34("div", { className: allDayRow, children: [
+      /* @__PURE__ */ jsx51("div", { className: allDayGutter, children: "All day" }),
+      days.map((day, dayIndex) => /* @__PURE__ */ jsx51("div", { className: allDayCell, children: allDayEventsByDay[dayIndex].map((event) => {
+        const color = getEventColor(event.id, event.color);
+        const selected = event.id === selectedEventId;
+        return /* @__PURE__ */ jsx51(
+          "button",
+          {
+            type: "button",
+            className: allDayEventBlock,
+            style: { background: color },
+            "data-selected": selected || void 0,
+            onClick: () => handleEventActivate(event),
+            children: event.title
+          },
+          event.id
+        );
+      }) }, day.toISOString()))
+    ] }),
+    /* @__PURE__ */ jsxs34("div", { className: scrollArea, children: [
+      /* @__PURE__ */ jsx51("div", { className: timeGutter, style: { height: totalHeightPx }, children: hourMarks.map((mark) => /* @__PURE__ */ jsx51(
+        "span",
+        {
+          className: hourLabel,
+          style: { top: `${mark.top}%` },
+          children: mark.label
+        },
+        mark.hour
+      )) }),
+      days.map((day, dayIndex) => {
+        const isToday = isSameDay(day, today);
+        return /* @__PURE__ */ jsxs34(
+          "div",
+          {
+            ref: (el) => {
+              dayColumnRefs.current[dayIndex] = el;
+            },
+            className: dayColumn,
+            style: { height: totalHeightPx },
+            children: [
+              isToday && showNowLine ? /* @__PURE__ */ jsx51("div", { className: nowLine, style: { top: `${nowTop}%` }, children: /* @__PURE__ */ jsx51("span", { className: nowLineDot }) }) : null,
+              timedEventsByDay[dayIndex].map(({ event, metrics, placement }) => {
+                const color = getEventColor(event.id, event.color);
+                const selected = event.id === selectedEventId;
+                const isResizingThis = drag?.kind === "resize" && drag.event.id === event.id;
+                const isDraggingThis = drag?.event.id === event.id;
+                const displayMetrics = isResizingThis ? getVerticalMetrics(event.start, drag.currentEnd, startHour, endHour) ?? metrics : metrics;
+                const displayEnd = isResizingThis ? drag.currentEnd : event.end;
+                const width = 100 / placement.columnCount;
+                const left = placement.columnIndex * width;
+                const showTime = displayMetrics.height > 6;
+                return /* @__PURE__ */ jsxs34(
+                  "button",
+                  {
+                    type: "button",
+                    className: eventBlock,
+                    "data-selected": selected || void 0,
+                    "data-editable": editable || void 0,
+                    "data-dragging": isDraggingThis || void 0,
+                    style: {
+                      top: `${displayMetrics.top}%`,
+                      height: `${displayMetrics.height}%`,
+                      left: `${left}%`,
+                      width: `${width}%`,
+                      background: color
+                    },
+                    onClick: () => handleEventActivate(event),
+                    onPointerDown: editable ? handleMovePointerDown(event, dayIndex) : void 0,
+                    onPointerMove: editable ? handleDragPointerMove : void 0,
+                    onPointerUp: editable ? handleDragPointerUp : void 0,
+                    onPointerCancel: editable ? handleDragPointerCancel : void 0,
+                    onKeyDown: editable ? (e) => handleEventKeyDown(e, event, dayIndex) : void 0,
+                    children: [
+                      /* @__PURE__ */ jsx51("span", { className: eventTitle, children: event.title }),
+                      showTime ? /* @__PURE__ */ jsxs34("span", { className: eventTime, children: [
+                        formatEventTime(event.start, locale),
+                        " \u2013",
+                        " ",
+                        formatEventTime(displayEnd, locale)
+                      ] }) : null,
+                      editable ? /* @__PURE__ */ jsx51(
+                        "span",
+                        {
+                          className: resizeHandle2,
+                          onPointerDown: handleResizePointerDown(event, dayIndex),
+                          onPointerMove: handleDragPointerMove,
+                          onPointerUp: handleDragPointerUp,
+                          onPointerCancel: handleDragPointerCancel
+                        }
+                      ) : null
+                    ]
+                  },
+                  event.id
+                );
+              }),
+              drag && drag.kind === "move" && drag.currentDayIndex === dayIndex && dragPreviewMetrics ? /* @__PURE__ */ jsxs34(
+                "div",
+                {
+                  className: dragPreview,
+                  style: {
+                    top: `${dragPreviewMetrics.top}%`,
+                    height: `${dragPreviewMetrics.height}%`,
+                    left: 0,
+                    width: "100%"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx51("span", { className: dragPreviewLabel, children: drag.event.title }),
+                    /* @__PURE__ */ jsxs34("span", { className: dragPreviewLabel, children: [
+                      formatEventTime(drag.currentStart, locale),
+                      " \u2013",
+                      " ",
+                      formatEventTime(drag.currentEnd, locale)
+                    ] })
+                  ]
+                }
+              ) : null
+            ]
+          },
+          day.toISOString()
+        );
+      })
+    ] })
+  ] });
+}
+
 // src/index.ts
-import { vars as vars3, defaultThemeClass, defaultThemeVars } from "@vesture/tokens";
+import { vars as vars13, defaultThemeClass, defaultThemeVars } from "@vesture/tokens";
 export {
   Accordion2 as Accordion,
   AccordionContent,
   AccordionItem,
   AccordionTrigger,
   Alert,
+  AreaChart,
   Avatar,
   Badge,
+  BarChart,
   Breadcrumbs2 as Breadcrumbs,
   BreadcrumbsItem,
   Button,
@@ -4238,13 +6245,20 @@ export {
   DropdownMenu2 as DropdownMenu,
   DropdownMenuItem,
   Input,
+  InteractiveAreaChart,
+  InteractiveBarChart,
+  InteractiveLineChart,
+  InteractivePieChart,
   Label,
+  LineChart,
   Modal,
   NumberInput,
   Pagination,
+  PieChart,
   Popover,
   Progress,
   Radio,
+  Scheduler,
   Select,
   Slider,
   Spinner,
@@ -4262,6 +6276,6 @@ export {
   defaultThemeVars,
   useCommandPaletteShortcut,
   useToast,
-  vars3 as vars
+  vars13 as vars
 };
 //# sourceMappingURL=index.js.map