@epilot/spark-ui 1.0.0-alpha.4 → 1.0.0-alpha.6

package/dist/components/bar-chart.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"bar-chart.cjs","names":["localeNumberFormat","BarStack","buildYAxisScale","useMeasuredSize","clampTooltipPosition","SectionTitle","SeriesLegend","ChartTooltipCard","formatYAxisTick","Group"],"sources":["../../src/components/bar-chart.tsx"],"sourcesContent":["import { localPoint } from '@visx/event'\nimport { Group } from '@visx/group'\nimport { scaleBand, scaleLinear, scaleOrdinal } from '@visx/scale'\nimport { BarStack } from '@visx/shape'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { buildYAxisScale, formatYAxisTick } from '../utils/chart-scale'\nimport { cn } from '../utils/cn'\nimport { localeNumberFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend } from './series-legend'\nimport { SectionTitle } from './typography'\n\nconst defaultTotalFormat = localeNumberFormat()\n\nexport type BarChartCategory = string | number\n\nexport interface BarChartSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  hoverFill?: string\n  getValue: (datum: TDatum) => number\n}\n\nexport interface BarChartLineSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  /** `null` gaps break the line (e.g. hours without a reading). */\n  getValue: (datum: TDatum) => number | null\n  /** Own y-domain for this line (e.g. `[0, 100]` for a percentage). Defaults to the bar scale. */\n  domain?: [number, number]\n  /** Start hidden; the user can enable the line from the legend. */\n  hiddenByDefault?: boolean\n  /** Formats this line's value in the hover tooltip. Defaults to `formatValue`. */\n  formatValue?: (value: number) => string\n  strokeDasharray?: string\n}\n\nexport interface BarChartProps<TDatum> {\n  data: TDatum[]\n  series: BarChartSeries<TDatum>[]\n  /** Line overlays drawn on top of the bars, toggleable from the legend. */\n  lines?: BarChartLineSeries<TDatum>[]\n  getCategory: (datum: TDatum) => BarChartCategory\n  /** Full ordered set of categories on the x-axis. Defaults to `data.map(getCategory)`. */\n  categories?: BarChartCategory[]\n  /** Subset of categories that should render an x-axis label. Defaults to every category. */\n  categoryTicks?: BarChartCategory[]\n  formatCategory?: (category: BarChartCategory) => string\n  /** Formats the hovered category in the tooltip header. Defaults to `formatCategory`. */\n  formatTooltipCategory?: (category: BarChartCategory) => string\n  highlightedCategory?: BarChartCategory\n  showHighlightLine?: boolean\n  /**\n   * Horizontal reference line drawn across the plot at a given y-value.\n   * Useful for thresholds (e.g. price ceiling).\n   */\n  referenceLine?: { value: number; label?: string; color?: string }\n  title?: string\n  yAxisUnit?: string\n  height?: number\n  /**\n   * Override how the total value (sum of focused or all categories) is\n   * rendered. `animated` is false while a bar is focused (hover), so an\n   * animated total can snap between hovered buckets instead of re-firing a\n   * tween on every bar the pointer crosses.\n   */\n  renderTotal?: (value: number, animated: boolean) => React.ReactNode\n  /** Format function used when `renderTotal` is not provided. */\n  formatTotal?: (value: number) => string\n  /** Formats per-series values in the hover tooltip. Defaults to `formatTotal`. */\n  formatValue?: (value: number) => string\n  className?: string\n}\n\ninterface StackDatum {\n  __category: BarChartCategory\n  __values: Record<string, number>\n}\n\ninterface BarStackLayerProps<TDatum> {\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  seriesByKey: Map<string, BarChartSeries<TDatum>>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n  colorScale: ReturnType<typeof scaleOrdinal<string, string>>\n}\n\ninterface CategoryTicksProps {\n  ticks: BarChartCategory[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  formatCategory: (category: BarChartCategory) => string\n}\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst HOVER_FADE_MS = 200\nconst FOCUS_TRANSITION_MS = 180\nconst DEFAULT_HEIGHT = 220\nconst BAR_RADIUS = 2\nconst Y_AXIS_GUTTER = 34\n\nfunction buildBarPath(\n  x: number,\n  y: number,\n  width: number,\n  height: number,\n  radius: number,\n  roundTop: boolean,\n  roundBottom: boolean,\n) {\n  const r = Math.max(0, Math.min(radius, width / 2, height / 2))\n\n  if (r === 0 || (!roundTop && !roundBottom)) {\n    return `M ${x} ${y} H ${x + width} V ${y + height} H ${x} Z`\n  }\n\n  const tl = roundTop ? r : 0\n  const tr = roundTop ? r : 0\n  const br = roundBottom ? r : 0\n  const bl = roundBottom ? r : 0\n\n  return [\n    `M ${x + tl} ${y}`,\n    `H ${x + width - tr}`,\n    tr > 0\n      ? `Q ${x + width} ${y} ${x + width} ${y + tr}`\n      : `L ${x + width} ${y}`,\n    `V ${y + height - br}`,\n    br > 0\n      ? `Q ${x + width} ${y + height} ${x + width - br} ${y + height}`\n      : `L ${x + width} ${y + height}`,\n    `H ${x + bl}`,\n    bl > 0\n      ? `Q ${x} ${y + height} ${x} ${y + height - bl}`\n      : `L ${x} ${y + height}`,\n    `V ${y + tl}`,\n    tl > 0 ? `Q ${x} ${y} ${x + tl} ${y}` : `L ${x} ${y}`,\n    'Z',\n  ].join(' ')\n}\n\nfunction BarStackLayer<TDatum>({\n  stackData,\n  series,\n  seriesByKey,\n  xScale,\n  yScale,\n  colorScale,\n}: BarStackLayerProps<TDatum>) {\n  return (\n    <BarStack<StackDatum, string>\n      data={stackData}\n      keys={series.map((entry) => entry.key)}\n      x={(record) => record.__category}\n      value={(record, key) => record.__values[key] ?? 0}\n      xScale={xScale}\n      yScale={yScale}\n      color={colorScale}\n      offset=\"diverging\"\n    >\n      {(barStacks) =>\n        barStacks.map((barStack) =>\n          barStack.bars.map((bar) => {\n            const values = bar.bar.data.__values\n            const segmentValue = values[barStack.key] ?? 0\n\n            if (segmentValue === 0) {\n              return null\n            }\n\n            const seriesEntry = seriesByKey.get(barStack.key)\n            const strokeColor = seriesEntry?.color ?? bar.color\n            const fillColor = strokeColor\n\n            // Positive segments stack up from the baseline, negatives down.\n            // Round only the outermost corner of each side of the axis.\n            const positiveKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) > 0)\n            const negativeKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) < 0)\n            const roundTop =\n              segmentValue > 0 &&\n              positiveKeys[positiveKeys.length - 1] === barStack.key\n            const roundBottom =\n              segmentValue > 0\n                ? positiveKeys[0] === barStack.key\n                : negativeKeys[negativeKeys.length - 1] === barStack.key\n\n            // visx returns a signed height for below-baseline bars; normalize\n            // to a top-left origin with a positive height for the path.\n            const top = bar.height < 0 ? bar.y + bar.height : bar.y\n            const barHeight = Math.abs(bar.height)\n\n            return (\n              <path\n                key={`bar-${barStack.index}-${bar.index}`}\n                d={buildBarPath(\n                  bar.x,\n                  top,\n                  bar.width,\n                  Math.max(0, barHeight),\n                  BAR_RADIUS,\n                  roundTop,\n                  roundBottom,\n                )}\n                fill={fillColor}\n                stroke={strokeColor}\n                strokeWidth={1}\n                style={{ transition: 'fill 180ms ease' }}\n              />\n            )\n          }),\n        )\n      }\n    </BarStack>\n  )\n}\n\ninterface FocusBorderProps<TDatum> {\n  category: BarChartCategory\n  visible: boolean\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n}\n\nfunction FocusBorder<TDatum>({\n  category,\n  visible,\n  stackData,\n  series,\n  xScale,\n  yScale,\n}: FocusBorderProps<TDatum>) {\n  const x = xScale(category)\n  const datum = stackData.find((entry) => entry.__category === category)\n\n  if (x === undefined || !datum) {\n    return null\n  }\n\n  const hasAnyValue = series.some(\n    (entry) => (datum.__values[entry.key] ?? 0) !== 0,\n  )\n\n  if (!hasAnyValue) {\n    return null\n  }\n\n  const topY = PADDING_TOP\n  // Extend past the baseline to cover any below-axis (feed-in) segment.\n  const negativeSum = series.reduce(\n    (sum, entry) => sum + Math.min(0, datum.__values[entry.key] ?? 0),\n    0,\n  )\n  const bottomY = yScale(negativeSum)\n  const borderPaddingX = 4\n  const borderPaddingY = 3\n  const borderXRaw = x - borderPaddingX\n  const borderY = topY - borderPaddingY\n  const borderWidthRaw = xScale.bandwidth() + borderPaddingX * 2\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n  const borderX = Math.max(minX, borderXRaw)\n  const borderRight = Math.min(maxX, borderXRaw + borderWidthRaw)\n  const borderWidth = Math.max(0, borderRight - borderX)\n  const borderHeight = Math.max(1, bottomY - topY + borderPaddingY * 2)\n\n  if (borderWidth <= 0) {\n    return null\n  }\n\n  return (\n    <rect\n      x={borderX}\n      y={borderY}\n      width={borderWidth}\n      height={borderHeight}\n      rx={6}\n      fill=\"var(--spark-a2)\"\n      stroke=\"var(--spark-a9)\"\n      strokeWidth={2}\n      pointerEvents=\"none\"\n      style={{\n        opacity: visible ? 1 : 0,\n        transition: `x ${FOCUS_TRANSITION_MS}ms ease, y ${FOCUS_TRANSITION_MS}ms ease, width ${FOCUS_TRANSITION_MS}ms ease, height ${FOCUS_TRANSITION_MS}ms ease, opacity ${FOCUS_TRANSITION_MS}ms ease`,\n      }}\n    />\n  )\n}\n\ninterface InteractionLayerProps {\n  xDomain: BarChartCategory[]\n  activeCategories: Set<BarChartCategory>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  onHoverChange: (category: BarChartCategory | null) => void\n}\n\nfunction InteractionLayer({\n  xDomain,\n  activeCategories,\n  xScale,\n  height,\n  onHoverChange,\n}: InteractionLayerProps) {\n  const bandwidth = xScale.bandwidth()\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n\n  // A single overlay that maps the pointer to the nearest category with data,\n  // so there are no dead zones between/around bars to break the hover.\n  const handleMove = (\n    event: React.MouseEvent<SVGRectElement> | React.TouchEvent<SVGRectElement>,\n  ) => {\n    const point = localPoint(event)\n    if (!point) return\n\n    let nearest: BarChartCategory | null = null\n    let best = Infinity\n    for (const category of xDomain) {\n      if (!activeCategories.has(category)) continue\n      const x = xScale(category)\n      if (x === undefined) continue\n      const distance = Math.abs(x + bandwidth / 2 - point.x)\n      if (distance < best) {\n        best = distance\n        nearest = category\n      }\n    }\n\n    if (nearest !== null) onHoverChange(nearest)\n  }\n\n  return (\n    <rect\n      x={minX}\n      y={PADDING_TOP}\n      width={Math.max(0, maxX - minX)}\n      height={height - PADDING_TOP - PADDING_BOTTOM}\n      fill=\"transparent\"\n      onMouseMove={handleMove}\n      onMouseLeave={() => onHoverChange(null)}\n      onTouchMove={handleMove}\n      onTouchEnd={() => onHoverChange(null)}\n    />\n  )\n}\n\nfunction CategoryTicks({\n  ticks,\n  xScale,\n  height,\n  formatCategory,\n}: CategoryTicksProps) {\n  return (\n    <>\n      {ticks.map((category) => {\n        const x = xScale(category)\n\n        if (x === undefined) {\n          return null\n        }\n\n        return (\n          <text\n            key={`tick-${String(category)}`}\n            x={x + xScale.bandwidth() / 2}\n            y={height - PADDING_BOTTOM + 16}\n            textAnchor=\"middle\"\n            fill=\"var(--gray-a11)\"\n            fontSize={10}\n          >\n            {formatCategory(category)}\n          </text>\n        )\n      })}\n    </>\n  )\n}\n\nfunction defaultFormatTotal(value: number) {\n  return defaultTotalFormat.format(value)\n}\n\nexport function BarChart<TDatum>({\n  data,\n  series,\n  lines,\n  getCategory,\n  categories,\n  categoryTicks,\n  formatCategory = (category) => String(category),\n  formatTooltipCategory = formatCategory,\n  highlightedCategory,\n  showHighlightLine = false,\n  referenceLine,\n  title,\n  yAxisUnit,\n  height = DEFAULT_HEIGHT,\n  renderTotal,\n  formatTotal = defaultFormatTotal,\n  formatValue,\n  className,\n}: BarChartProps<TDatum>): React.ReactElement {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [width, setWidth] = useState(0)\n  const [hoveredCategory, setHoveredCategory] =\n    useState<BarChartCategory | null>(null)\n  const [trailingHoverLabel, setTrailingHoverLabel] = useState<string | null>(\n    null,\n  )\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () =>\n      new Set(\n        (lines ?? [])\n          .filter((line) => line.hiddenByDefault)\n          .map((line) => line.key),\n      ),\n  )\n\n  const toggleSeries = useCallback((id: string) => {\n    setHiddenSeries((prev) => {\n      const next = new Set(prev)\n      if (next.has(id)) {\n        next.delete(id)\n      } else {\n        next.add(id)\n      }\n      return next\n    })\n  }, [])\n\n  useEffect(() => {\n    const element = containerRef.current\n\n    if (!element) {\n      return\n    }\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n\n      if (!entry) {\n        return\n      }\n\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n\n    return () => {\n      resizeObserver.disconnect()\n    }\n  }, [])\n\n  const seriesByKey = useMemo(() => {\n    const map = new Map<string, BarChartSeries<TDatum>>()\n\n    for (const entry of series) {\n      map.set(entry.key, entry)\n    }\n\n    return map\n  }, [series])\n\n  const stackData = useMemo<StackDatum[]>(\n    () =>\n      data.map((datum) => {\n        const values: Record<string, number> = {}\n\n        for (const entry of series) {\n          values[entry.key] = hiddenSeries.has(entry.key)\n            ? 0\n            : entry.getValue(datum)\n        }\n\n        return { __category: getCategory(datum), __values: values }\n      }),\n    [data, getCategory, series, hiddenSeries],\n  )\n\n  const yMax = useMemo(\n    () =>\n      Math.max(\n        1,\n        referenceLine?.value ?? 0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.max(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [referenceLine, series, stackData],\n  )\n\n  // Most negative stack sum across buckets (0 when nothing dips below the axis).\n  const yMin = useMemo(\n    () =>\n      Math.min(\n        0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.min(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [series, stackData],\n  )\n\n  const xDomain = useMemo(\n    () => categories ?? stackData.map((record) => record.__category),\n    [categories, stackData],\n  )\n\n  const xScale = useMemo(\n    () =>\n      scaleBand<BarChartCategory>({\n        domain: xDomain,\n        range: [Y_AXIS_GUTTER, Math.max(Y_AXIS_GUTTER, width)],\n        padding: 0.32,\n      }),\n    [xDomain, width],\n  )\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [yMin, yMax],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [height, yMax, yMin],\n  )\n\n  const colorScale = useMemo(\n    () =>\n      scaleOrdinal<string, string>({\n        domain: series.map((entry) => entry.key),\n        range: series.map((entry) => entry.color),\n      }),\n    [series],\n  )\n\n  const linePaths = useMemo(() => {\n    if (!lines || width === 0) {\n      return []\n    }\n\n    return lines\n      .filter((line) => !hiddenSeries.has(line.key))\n      .map((line) => {\n        const lineScale = line.domain\n          ? scaleLinear<number>({\n              domain: line.domain,\n              range: [height - PADDING_BOTTOM, PADDING_TOP],\n            })\n          : yScale\n        const segments: string[] = []\n        let previous: { x: number; y: number } | null = null\n\n        for (const datum of data) {\n          const x = xScale(getCategory(datum))\n          const value = line.getValue(datum)\n\n          if (x === undefined || value === null || !Number.isFinite(value)) {\n            previous = null\n            continue\n          }\n\n          const point = {\n            x: x + xScale.bandwidth() / 2,\n            y: lineScale(value),\n          }\n          segments.push(\n            previous === null\n              ? `M ${point.x} ${point.y}`\n              : `L ${point.x} ${point.y}`,\n          )\n          previous = point\n        }\n\n        return {\n          key: line.key,\n          d: segments.join(' '),\n          color: line.color,\n          strokeDasharray: line.strokeDasharray ?? '5 4',\n        }\n      })\n      .filter((path) => path.d !== '')\n  }, [lines, hiddenSeries, data, getCategory, xScale, yScale, height, width])\n\n  const stackCategorySet = useMemo(\n    () => new Set(stackData.map((record) => record.__category)),\n    [stackData],\n  )\n\n  const lastFocusCategoryRef = useRef<BarChartCategory | null>(null)\n  if (hoveredCategory !== null) {\n    lastFocusCategoryRef.current = hoveredCategory\n  }\n  const focusCategory = lastFocusCategoryRef.current\n\n  const focused = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (stackData.find((record) => record.__category === hoveredCategory) ??\n          null),\n    [hoveredCategory, stackData],\n  )\n\n  // Below-baseline segments (feed-in) are context, not part of the headline\n  // sum, so the total counts only the positive stack (energy consumed).\n  const totalValue = useMemo(() => {\n    if (focused) {\n      return series.reduce(\n        (sum, entry) => sum + Math.max(0, focused.__values[entry.key] ?? 0),\n        0,\n      )\n    }\n\n    return stackData.reduce(\n      (sum, record) =>\n        sum +\n        series.reduce(\n          (s, entry) => s + Math.max(0, record.__values[entry.key] ?? 0),\n          0,\n        ),\n      0,\n    )\n  }, [focused, series, stackData])\n\n  const hoverLabel = focused ? formatTooltipCategory(focused.__category) : null\n\n  useEffect(() => {\n    if (hoverLabel) {\n      setTrailingHoverLabel(hoverLabel)\n      return\n    }\n\n    const timeoutId = window.setTimeout(() => {\n      setTrailingHoverLabel(null)\n    }, HOVER_FADE_MS)\n\n    return () => {\n      window.clearTimeout(timeoutId)\n    }\n  }, [hoverLabel])\n\n  const ticks = categoryTicks ?? xDomain\n  const yTicks = useMemo(() => buildYAxisScale(yMin, yMax).ticks, [yMin, yMax])\n  const highlightX = useMemo(() => {\n    if (!showHighlightLine || highlightedCategory === undefined) {\n      return null\n    }\n\n    const x = xScale(highlightedCategory)\n\n    if (x === undefined) {\n      return null\n    }\n\n    return x + xScale.bandwidth() / 2\n  }, [highlightedCategory, showHighlightLine, xScale])\n\n  const focusedDatum = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (data.find((datum) => getCategory(datum) === hoveredCategory) ??\n          null),\n    [hoveredCategory, data, getCategory],\n  )\n\n  // The bars don't depend on hover state, so memoize the layer: hovering\n  // across bars must not re-render (and re-stack) every bar path each move.\n  const barStackLayer = useMemo(\n    () => (\n      <BarStackLayer\n        stackData={stackData}\n        series={series}\n        seriesByKey={seriesByKey}\n        xScale={xScale}\n        yScale={yScale}\n        colorScale={colorScale}\n      />\n    ),\n    [stackData, series, seriesByKey, xScale, yScale, colorScale],\n  )\n\n  const fmtTooltipValue = formatValue ?? formatTotal\n  const tooltipRows: ChartTooltipRow[] = focused\n    ? [\n        ...series\n          .filter((entry) => (focused.__values[entry.key] ?? 0) !== 0)\n          .map((entry) => ({\n            key: entry.key,\n            label: entry.label,\n            color: entry.color,\n            value: fmtTooltipValue(Math.abs(focused.__values[entry.key] ?? 0)),\n          })),\n        ...(lines ?? [])\n          .filter((line) => !hiddenSeries.has(line.key))\n          .flatMap((line) => {\n            const value =\n              focusedDatum === null ? null : line.getValue(focusedDatum)\n\n            if (value === null || !Number.isFinite(value)) {\n              return []\n            }\n\n            return [\n              {\n                key: line.key,\n                label: line.label,\n                color: line.color,\n                value: (line.formatValue ?? fmtTooltipValue)(value),\n              },\n            ]\n          }),\n      ]\n    : []\n  const tooltipActive = tooltipRows.length > 0\n  const anchorX =\n    focusCategory !== null\n      ? (xScale(focusCategory) ?? 0) + xScale.bandwidth() / 2\n      : 0\n  const anchorY = yScale(totalValue)\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX,\n    anchorY,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col', className)}>\n      <div className=\"flex items-baseline justify-between\">\n        {title && <SectionTitle>{title}</SectionTitle>}\n        <span className=\"tabular-nums\">\n          {renderTotal ? (\n            renderTotal(totalValue, focused === null)\n          ) : (\n            <span className=\"text-base font-bold text-gray tabular-nums\">\n              {formatTotal(totalValue)}\n            </span>\n          )}\n        </span>\n      </div>\n\n      <div className=\"flex min-h-5 items-baseline justify-between gap-4\">\n        <SeriesLegend\n          items={[\n            ...series.map((entry) => ({\n              id: entry.key,\n              label: entry.label,\n              color: entry.color,\n            })),\n            ...(lines ?? []).map((line) => ({\n              id: line.key,\n              label: line.label,\n              color: line.color,\n              marker: 'dashed-line' as const,\n            })),\n          ]}\n          hiddenIds={hiddenSeries}\n          onToggle={toggleSeries}\n          className=\"gap-y-1\"\n        />\n        <span\n          className={cn(\n            'text-xs text-gray-light transition-opacity duration-200',\n            hoverLabel ? 'opacity-100' : 'opacity-0',\n          )}\n        >\n          {trailingHoverLabel ?? ' '}\n        </span>\n      </div>\n\n      <div\n        ref={containerRef}\n        className=\"relative mt-2 w-full\"\n        style={{ height }}\n      >\n        <div\n          ref={tooltipRef}\n          className=\"pointer-events-none absolute z-10\"\n          style={{\n            left: tooltipPos.left,\n            top: tooltipPos.top,\n            opacity: tooltipActive ? 1 : 0,\n            transition:\n              'left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out',\n          }}\n        >\n          {focusCategory !== null && (\n            <ChartTooltipCard\n              label={formatTooltipCategory(focusCategory)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={Y_AXIS_GUTTER}\n              y1={PADDING_TOP}\n              y2={height - PADDING_BOTTOM}\n              stroke=\"var(--gray-a6)\"\n              strokeWidth={1}\n            />\n\n            {yTicks.map((tick, index) => {\n              const y = yScale(tick)\n              const hideTickLabel =\n                yAxisUnit !== undefined && index === yTicks.length - 1\n\n              return (\n                <g key={`y-tick-${tick}`}>\n                  {!hideTickLabel && (\n                    <line\n                      x1={Y_AXIS_GUTTER - 4}\n                      x2={Y_AXIS_GUTTER}\n                      y1={y}\n                      y2={y}\n                      stroke=\"var(--gray-a8)\"\n                      strokeWidth={1}\n                    />\n                  )}\n                  {!hideTickLabel && (\n                    <text\n                      x={Y_AXIS_GUTTER - 7}\n                      y={y + 3}\n                      textAnchor=\"end\"\n                      fill=\"var(--gray-a11)\"\n                      fontSize={10}\n                    >\n                      {formatYAxisTick(tick)}\n                    </text>\n                  )}\n                </g>\n              )\n            })}\n\n            {yAxisUnit && (\n              <text\n                x={0}\n                y={PADDING_TOP - 6}\n                textAnchor=\"start\"\n                fill=\"var(--gray-a11)\"\n                fontSize={10}\n                fontWeight={600}\n              >\n                {yAxisUnit}\n              </text>\n            )}\n\n            {highlightX !== null && (\n              <line\n                x1={highlightX}\n                x2={highlightX}\n                y1={PADDING_TOP}\n                y2={height - PADDING_BOTTOM}\n                stroke=\"var(--spark-a9)\"\n                strokeWidth={1.5}\n                strokeDasharray=\"5 4\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={width}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--gray-a5)\"\n              strokeWidth={1}\n            />\n\n            <Group>\n              {focusCategory !== null && (\n                <FocusBorder\n                  category={focusCategory}\n                  visible={hoveredCategory !== null}\n                  stackData={stackData}\n                  series={series}\n                  xScale={xScale}\n                  yScale={yScale}\n                />\n              )}\n              {barStackLayer}\n\n              {referenceLine && (\n                <line\n                  x1={Y_AXIS_GUTTER}\n                  x2={width}\n                  y1={yScale(referenceLine.value)}\n                  y2={yScale(referenceLine.value)}\n                  stroke={referenceLine.color ?? 'var(--gray-a11)'}\n                  strokeWidth={1.5}\n                  pointerEvents=\"none\"\n                />\n              )}\n\n              {linePaths.map((path) => (\n                <path\n                  key={`line-${path.key}`}\n                  d={path.d}\n                  fill=\"none\"\n                  stroke={path.color}\n                  strokeWidth={1.5}\n                  strokeDasharray={path.strokeDasharray}\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  pointerEvents=\"none\"\n                />\n              ))}\n            </Group>\n\n            <InteractionLayer\n              xDomain={xDomain}\n              activeCategories={stackCategorySet}\n              xScale={xScale}\n              height={height}\n              onHoverChange={setHoveredCategory}\n            />\n\n            <CategoryTicks\n              ticks={ticks}\n              xScale={xScale}\n              height={height}\n              formatCategory={formatCategory}\n            />\n          </svg>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAM,qBAAqBA,qBAAAA,oBAAoB;AAqF/C,MAAM,cAAc;AACpB,MAAM,iBAAiB;AACvB,MAAM,gBAAgB;AACtB,MAAM,sBAAsB;AAC5B,MAAM,iBAAiB;AACvB,MAAM,aAAa;AACnB,MAAM,gBAAgB;AAEtB,SAAS,aACP,GACA,GACA,OACA,QACA,QACA,UACA,aACA;CACA,MAAM,IAAI,KAAK,IAAI,GAAG,KAAK,IAAI,QAAQ,QAAQ,GAAG,SAAS,EAAE,CAAC;AAE9D,KAAI,MAAM,KAAM,CAAC,YAAY,CAAC,YAC5B,QAAO,KAAK,EAAE,GAAG,EAAE,KAAK,IAAI,MAAM,KAAK,IAAI,OAAO,KAAK,EAAE;CAG3D,MAAM,KAAK,WAAW,IAAI;CAC1B,MAAM,KAAK,WAAW,IAAI;CAC1B,MAAM,KAAK,cAAc,IAAI;CAC7B,MAAM,KAAK,cAAc,IAAI;AAE7B,QAAO;EACL,KAAK,IAAI,GAAG,GAAG;EACf,KAAK,IAAI,QAAQ;EACjB,KAAK,IACD,KAAK,IAAI,MAAM,GAAG,EAAE,GAAG,IAAI,MAAM,GAAG,IAAI,OACxC,KAAK,IAAI,MAAM,GAAG;EACtB,KAAK,IAAI,SAAS;EAClB,KAAK,IACD,KAAK,IAAI,MAAM,GAAG,IAAI,OAAO,GAAG,IAAI,QAAQ,GAAG,GAAG,IAAI,WACtD,KAAK,IAAI,MAAM,GAAG,IAAI;EAC1B,KAAK,IAAI;EACT,KAAK,IACD,KAAK,EAAE,GAAG,IAAI,OAAO,GAAG,EAAE,GAAG,IAAI,SAAS,OAC1C,KAAK,EAAE,GAAG,IAAI;EAClB,KAAK,IAAI;EACT,KAAK,IAAI,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,GAAG,GAAG,MAAM,KAAK,EAAE,GAAG;EAClD;EACD,CAAC,KAAK,IAAI;;AAGb,SAAS,cAAsB,EAC7B,WACA,QACA,aACA,QACA,QACA,cAC6B;AAC7B,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,UAAD;EACE,MAAM;EACN,MAAM,OAAO,KAAK,UAAU,MAAM,IAAI;EACtC,IAAI,WAAW,OAAO;EACtB,QAAQ,QAAQ,QAAQ,OAAO,SAAS,QAAQ;EACxC;EACA;EACR,OAAO;EACP,QAAO;aAEL,cACA,UAAU,KAAK,aACb,SAAS,KAAK,KAAK,QAAQ;GACzB,MAAM,SAAS,IAAI,IAAI,KAAK;GAC5B,MAAM,eAAe,OAAO,SAAS,QAAQ;AAE7C,OAAI,iBAAiB,EACnB,QAAO;GAIT,MAAM,cADc,YAAY,IAAI,SAAS,IACd,EAAE,SAAS,IAAI;GAC9C,MAAM,YAAY;GAIlB,MAAM,eAAe,OAClB,KAAK,UAAU,MAAM,IAAI,CACzB,QAAQ,SAAS,OAAO,QAAQ,KAAK,EAAE;GAC1C,MAAM,eAAe,OAClB,KAAK,UAAU,MAAM,IAAI,CACzB,QAAQ,SAAS,OAAO,QAAQ,KAAK,EAAE;GAC1C,MAAM,WACJ,eAAe,KACf,aAAa,aAAa,SAAS,OAAO,SAAS;GACrD,MAAM,cACJ,eAAe,IACX,aAAa,OAAO,SAAS,MAC7B,aAAa,aAAa,SAAS,OAAO,SAAS;GAIzD,MAAM,MAAM,IAAI,SAAS,IAAI,IAAI,IAAI,IAAI,SAAS,IAAI;GACtD,MAAM,YAAY,KAAK,IAAI,IAAI,OAAO;AAEtC,UACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAEE,GAAG,aACD,IAAI,GACJ,KACA,IAAI,OACJ,KAAK,IAAI,GAAG,UAAU,EACtB,YACA,UACA,YACD;IACD,MAAM;IACN,QAAQ;IACR,aAAa;IACb,OAAO,EAAE,YAAY,mBAAmB;IACxC,EAdK,OAAO,SAAS,MAAM,GAAG,IAAI,QAclC;IAEJ,CACH;EAEM,CAAA;;AAaf,SAAS,YAAoB,EAC3B,UACA,SACA,WACA,QACA,QACA,UAC2B;CAC3B,MAAM,IAAI,OAAO,SAAS;CAC1B,MAAM,QAAQ,UAAU,MAAM,UAAU,MAAM,eAAe,SAAS;AAEtE,KAAI,MAAM,KAAA,KAAa,CAAC,MACtB,QAAO;AAOT,KAAI,CAJgB,OAAO,MACxB,WAAW,MAAM,SAAS,MAAM,QAAQ,OAAO,EAGlC,CACd,QAAO;CAGT,MAAM,OAAO;CAMb,MAAM,UAAU,OAJI,OAAO,QACxB,KAAK,UAAU,MAAM,KAAK,IAAI,GAAG,MAAM,SAAS,MAAM,QAAQ,EAAE,EACjE,EAEgC,CAAC;CACnC,MAAM,iBAAiB;CACvB,MAAM,iBAAiB;CACvB,MAAM,aAAa,IAAI;CACvB,MAAM,UAAU,OAAO;CACvB,MAAM,iBAAiB,OAAO,WAAW,GAAG,iBAAiB;CAC7D,MAAM,CAAC,YAAY,YAAY,OAAO,OAAO;CAC7C,MAAM,OAAO,KAAK,IAAI,YAAY,SAAS;CAC3C,MAAM,OAAO,KAAK,IAAI,YAAY,SAAS;CAC3C,MAAM,UAAU,KAAK,IAAI,MAAM,WAAW;CAC1C,MAAM,cAAc,KAAK,IAAI,MAAM,aAAa,eAAe;CAC/D,MAAM,cAAc,KAAK,IAAI,GAAG,cAAc,QAAQ;CACtD,MAAM,eAAe,KAAK,IAAI,GAAG,UAAU,OAAO,iBAAiB,EAAE;AAErE,KAAI,eAAe,EACjB,QAAO;AAGT,QACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,GAAG;EACH,GAAG;EACH,OAAO;EACP,QAAQ;EACR,IAAI;EACJ,MAAK;EACL,QAAO;EACP,aAAa;EACb,eAAc;EACd,OAAO;GACL,SAAS,UAAU,IAAI;GACvB,YAAY,KAAK,oBAAoB,aAAa,oBAAoB,iBAAiB,oBAAoB,kBAAkB,oBAAoB,mBAAmB,oBAAoB;GACzL;EACD,CAAA;;AAYN,SAAS,iBAAiB,EACxB,SACA,kBACA,QACA,QACA,iBACwB;CACxB,MAAM,YAAY,OAAO,WAAW;CACpC,MAAM,CAAC,YAAY,YAAY,OAAO,OAAO;CAC7C,MAAM,OAAO,KAAK,IAAI,YAAY,SAAS;CAC3C,MAAM,OAAO,KAAK,IAAI,YAAY,SAAS;CAI3C,MAAM,cACJ,UACG;EACH,MAAM,SAAA,GAAA,YAAA,YAAmB,MAAM;AAC/B,MAAI,CAAC,MAAO;EAEZ,IAAI,UAAmC;EACvC,IAAI,OAAO;AACX,OAAK,MAAM,YAAY,SAAS;AAC9B,OAAI,CAAC,iBAAiB,IAAI,SAAS,CAAE;GACrC,MAAM,IAAI,OAAO,SAAS;AAC1B,OAAI,MAAM,KAAA,EAAW;GACrB,MAAM,WAAW,KAAK,IAAI,IAAI,YAAY,IAAI,MAAM,EAAE;AACtD,OAAI,WAAW,MAAM;AACnB,WAAO;AACP,cAAU;;;AAId,MAAI,YAAY,KAAM,eAAc,QAAQ;;AAG9C,QACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;EACE,GAAG;EACH,GAAG;EACH,OAAO,KAAK,IAAI,GAAG,OAAO,KAAK;EAC/B,QAAQ,SAAS,cAAc;EAC/B,MAAK;EACL,aAAa;EACb,oBAAoB,cAAc,KAAK;EACvC,aAAa;EACb,kBAAkB,cAAc,KAAK;EACrC,CAAA;;AAIN,SAAS,cAAc,EACrB,OACA,QACA,QACA,kBACqB;AACrB,QACE,iBAAA,GAAA,kBAAA,KAAA,kBAAA,UAAA,EAAA,UACG,MAAM,KAAK,aAAa;EACvB,MAAM,IAAI,OAAO,SAAS;AAE1B,MAAI,MAAM,KAAA,EACR,QAAO;AAGT,SACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAEE,GAAG,IAAI,OAAO,WAAW,GAAG;GAC5B,GAAG,SAAS,iBAAiB;GAC7B,YAAW;GACX,MAAK;GACL,UAAU;aAET,eAAe,SAAS;GACpB,EARA,QAAQ,OAAO,SAAS,GAQxB;GAET,EACD,CAAA;;AAIP,SAAS,mBAAmB,OAAe;AACzC,QAAO,mBAAmB,OAAO,MAAM;;AAGzC,SAAgB,SAAiB,EAC/B,MACA,QACA,OACA,aACA,YACA,eACA,kBAAkB,aAAa,OAAO,SAAS,EAC/C,wBAAwB,gBACxB,qBACA,oBAAoB,OACpB,eACA,OACA,WACA,SAAS,gBACT,aACA,cAAc,oBACd,aACA,aAC4C;CAC5C,MAAM,gBAAA,GAAA,MAAA,QAAsC,KAAK;CACjD,MAAM,CAAC,OAAO,aAAA,GAAA,MAAA,UAAqB,EAAE;CACrC,MAAM,CAAC,iBAAiB,uBAAA,GAAA,MAAA,UACY,KAAK;CACzC,MAAM,CAAC,oBAAoB,0BAAA,GAAA,MAAA,UACzB,KACD;CACD,MAAM,CAAC,cAAc,oBAAA,GAAA,MAAA,gBAEjB,IAAI,KACD,SAAS,EAAE,EACT,QAAQ,SAAS,KAAK,gBAAgB,CACtC,KAAK,SAAS,KAAK,IAAI,CAC3B,CACJ;CAED,MAAM,gBAAA,GAAA,MAAA,cAA4B,OAAe;AAC/C,mBAAiB,SAAS;GACxB,MAAM,OAAO,IAAI,IAAI,KAAK;AAC1B,OAAI,KAAK,IAAI,GAAG,CACd,MAAK,OAAO,GAAG;OAEf,MAAK,IAAI,GAAG;AAEd,UAAO;IACP;IACD,EAAE,CAAC;AAEN,EAAA,GAAA,MAAA,iBAAgB;EACd,MAAM,UAAU,aAAa;AAE7B,MAAI,CAAC,QACH;EAGF,MAAM,iBAAiB,IAAI,gBAAgB,YAAY;GACrD,MAAM,QAAQ,QAAQ;AAEtB,OAAI,CAAC,MACH;AAGF,YAAS,MAAM,YAAY,MAAM;IACjC;AAEF,iBAAe,QAAQ,QAAQ;AAE/B,eAAa;AACX,kBAAe,YAAY;;IAE5B,EAAE,CAAC;CAEN,MAAM,eAAA,GAAA,MAAA,eAA4B;EAChC,MAAM,sBAAM,IAAI,KAAqC;AAErD,OAAK,MAAM,SAAS,OAClB,KAAI,IAAI,MAAM,KAAK,MAAM;AAG3B,SAAO;IACN,CAAC,OAAO,CAAC;CAEZ,MAAM,aAAA,GAAA,MAAA,eAEF,KAAK,KAAK,UAAU;EAClB,MAAM,SAAiC,EAAE;AAEzC,OAAK,MAAM,SAAS,OAClB,QAAO,MAAM,OAAO,aAAa,IAAI,MAAM,IAAI,GAC3C,IACA,MAAM,SAAS,MAAM;AAG3B,SAAO;GAAE,YAAY,YAAY,MAAM;GAAE,UAAU;GAAQ;GAC3D,EACJ;EAAC;EAAM;EAAa;EAAQ;EAAa,CAC1C;CAED,MAAM,QAAA,GAAA,MAAA,eAEF,KAAK,IACH,GACA,eAAe,SAAS,GACxB,GAAG,UAAU,KAAK,WAChB,OAAO,QACJ,KAAK,UAAU,MAAM,KAAK,IAAI,GAAG,OAAO,SAAS,MAAM,QAAQ,EAAE,EAClE,EACD,CACF,CACF,EACH;EAAC;EAAe;EAAQ;EAAU,CACnC;CAGD,MAAM,QAAA,GAAA,MAAA,eAEF,KAAK,IACH,GACA,GAAG,UAAU,KAAK,WAChB,OAAO,QACJ,KAAK,UAAU,MAAM,KAAK,IAAI,GAAG,OAAO,SAAS,MAAM,QAAQ,EAAE,EAClE,EACD,CACF,CACF,EACH,CAAC,QAAQ,UAAU,CACpB;CAED,MAAM,WAAA,GAAA,MAAA,eACE,cAAc,UAAU,KAAK,WAAW,OAAO,WAAW,EAChE,CAAC,YAAY,UAAU,CACxB;CAED,MAAM,UAAA,GAAA,MAAA,gBAAA,GAAA,YAAA,WAE0B;EAC1B,QAAQ;EACR,OAAO,CAAC,eAAe,KAAK,IAAI,eAAe,MAAM,CAAC;EACtD,SAAS;EACV,CAAC,EACJ,CAAC,SAAS,MAAM,CACjB;CAED,MAAM,UAAA,GAAA,MAAA,gBAAA,GAAA,YAAA,aAEkB;EAClB,QAAQ,CAAC,MAAM,KAAK;EACpB,OAAO,CAAC,SAAS,gBAAgB,YAAY;EAC9C,CAAC,EACJ;EAAC;EAAQ;EAAM;EAAK,CACrB;CAED,MAAM,cAAA,GAAA,MAAA,gBAAA,GAAA,YAAA,cAE2B;EAC3B,QAAQ,OAAO,KAAK,UAAU,MAAM,IAAI;EACxC,OAAO,OAAO,KAAK,UAAU,MAAM,MAAM;EAC1C,CAAC,EACJ,CAAC,OAAO,CACT;CAED,MAAM,aAAA,GAAA,MAAA,eAA0B;AAC9B,MAAI,CAAC,SAAS,UAAU,EACtB,QAAO,EAAE;AAGX,SAAO,MACJ,QAAQ,SAAS,CAAC,aAAa,IAAI,KAAK,IAAI,CAAC,CAC7C,KAAK,SAAS;GACb,MAAM,YAAY,KAAK,UAAA,GAAA,YAAA,aACC;IAClB,QAAQ,KAAK;IACb,OAAO,CAAC,SAAS,gBAAgB,YAAY;IAC9C,CAAC,GACF;GACJ,MAAM,WAAqB,EAAE;GAC7B,IAAI,WAA4C;AAEhD,QAAK,MAAM,SAAS,MAAM;IACxB,MAAM,IAAI,OAAO,YAAY,MAAM,CAAC;IACpC,MAAM,QAAQ,KAAK,SAAS,MAAM;AAElC,QAAI,MAAM,KAAA,KAAa,UAAU,QAAQ,CAAC,OAAO,SAAS,MAAM,EAAE;AAChE,gBAAW;AACX;;IAGF,MAAM,QAAQ;KACZ,GAAG,IAAI,OAAO,WAAW,GAAG;KAC5B,GAAG,UAAU,MAAM;KACpB;AACD,aAAS,KACP,aAAa,OACT,KAAK,MAAM,EAAE,GAAG,MAAM,MACtB,KAAK,MAAM,EAAE,GAAG,MAAM,IAC3B;AACD,eAAW;;AAGb,UAAO;IACL,KAAK,KAAK;IACV,GAAG,SAAS,KAAK,IAAI;IACrB,OAAO,KAAK;IACZ,iBAAiB,KAAK,mBAAmB;IAC1C;IACD,CACD,QAAQ,SAAS,KAAK,MAAM,GAAG;IACjC;EAAC;EAAO;EAAc;EAAM;EAAa;EAAQ;EAAQ;EAAQ;EAAM,CAAC;CAE3E,MAAM,oBAAA,GAAA,MAAA,eACE,IAAI,IAAI,UAAU,KAAK,WAAW,OAAO,WAAW,CAAC,EAC3D,CAAC,UAAU,CACZ;CAED,MAAM,wBAAA,GAAA,MAAA,QAAuD,KAAK;AAClE,KAAI,oBAAoB,KACtB,sBAAqB,UAAU;CAEjC,MAAM,gBAAgB,qBAAqB;CAE3C,MAAM,WAAA,GAAA,MAAA,eAEF,oBAAoB,OAChB,OACC,UAAU,MAAM,WAAW,OAAO,eAAe,gBAAgB,IAClE,MACN,CAAC,iBAAiB,UAAU,CAC7B;CAID,MAAM,cAAA,GAAA,MAAA,eAA2B;AAC/B,MAAI,QACF,QAAO,OAAO,QACX,KAAK,UAAU,MAAM,KAAK,IAAI,GAAG,QAAQ,SAAS,MAAM,QAAQ,EAAE,EACnE,EACD;AAGH,SAAO,UAAU,QACd,KAAK,WACJ,MACA,OAAO,QACJ,GAAG,UAAU,IAAI,KAAK,IAAI,GAAG,OAAO,SAAS,MAAM,QAAQ,EAAE,EAC9D,EACD,EACH,EACD;IACA;EAAC;EAAS;EAAQ;EAAU,CAAC;CAEhC,MAAM,aAAa,UAAU,sBAAsB,QAAQ,WAAW,GAAG;AAEzE,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,YAAY;AACd,yBAAsB,WAAW;AACjC;;EAGF,MAAM,YAAY,OAAO,iBAAiB;AACxC,yBAAsB,KAAK;KAC1B,cAAc;AAEjB,eAAa;AACX,UAAO,aAAa,UAAU;;IAE/B,CAAC,WAAW,CAAC;CAEhB,MAAM,QAAQ,iBAAiB;CAC/B,MAAM,UAAA,GAAA,MAAA,eAAuBC,0BAAAA,gBAAgB,MAAM,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC;CAC7E,MAAM,cAAA,GAAA,MAAA,eAA2B;AAC/B,MAAI,CAAC,qBAAqB,wBAAwB,KAAA,EAChD,QAAO;EAGT,MAAM,IAAI,OAAO,oBAAoB;AAErC,MAAI,MAAM,KAAA,EACR,QAAO;AAGT,SAAO,IAAI,OAAO,WAAW,GAAG;IAC/B;EAAC;EAAqB;EAAmB;EAAO,CAAC;CAEpD,MAAM,gBAAA,GAAA,MAAA,eAEF,oBAAoB,OAChB,OACC,KAAK,MAAM,UAAU,YAAY,MAAM,KAAK,gBAAgB,IAC7D,MACN;EAAC;EAAiB;EAAM;EAAY,CACrC;CAID,MAAM,iBAAA,GAAA,MAAA,eAEF,iBAAA,GAAA,kBAAA,KAAC,eAAD;EACa;EACH;EACK;EACL;EACA;EACI;EACZ,CAAA,EAEJ;EAAC;EAAW;EAAQ;EAAa;EAAQ;EAAQ;EAAW,CAC7D;CAED,MAAM,kBAAkB,eAAe;CACvC,MAAM,cAAiC,UACnC,CACE,GAAG,OACA,QAAQ,WAAW,QAAQ,SAAS,MAAM,QAAQ,OAAO,EAAE,CAC3D,KAAK,WAAW;EACf,KAAK,MAAM;EACX,OAAO,MAAM;EACb,OAAO,MAAM;EACb,OAAO,gBAAgB,KAAK,IAAI,QAAQ,SAAS,MAAM,QAAQ,EAAE,CAAC;EACnE,EAAE,EACL,IAAI,SAAS,EAAE,EACZ,QAAQ,SAAS,CAAC,aAAa,IAAI,KAAK,IAAI,CAAC,CAC7C,SAAS,SAAS;EACjB,MAAM,QACJ,iBAAiB,OAAO,OAAO,KAAK,SAAS,aAAa;AAE5D,MAAI,UAAU,QAAQ,CAAC,OAAO,SAAS,MAAM,CAC3C,QAAO,EAAE;AAGX,SAAO,CACL;GACE,KAAK,KAAK;GACV,OAAO,KAAK;GACZ,OAAO,KAAK;GACZ,QAAQ,KAAK,eAAe,iBAAiB,MAAM;GACpD,CACF;GACD,CACL,GACD,EAAE;CACN,MAAM,gBAAgB,YAAY,SAAS;CAC3C,MAAM,UACJ,kBAAkB,QACb,OAAO,cAAc,IAAI,KAAK,OAAO,WAAW,GAAG,IACpD;CACN,MAAM,UAAU,OAAO,WAAW;CAClC,MAAM,CAAC,YAAY,eAAeC,yBAAAA,iBAAiC;CACnE,MAAM,aAAaC,yBAAAA,qBAAqB;EACtC;EACA;EACA;EACA;EACA,UAAU,YAAY;EACtB,WAAW,YAAY;EACxB,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,YAAA,GAAA,OAAA,IAAc,wBAAwB,UAAU;YAArD;GACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf,CACG,SAAS,iBAAA,GAAA,kBAAA,KAACC,8BAAAA,cAAD,EAAA,UAAe,OAAqB,CAAA,EAC9C,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,WAAU;eACb,cACC,YAAY,YAAY,YAAY,KAAK,GAEzC,iBAAA,GAAA,kBAAA,KAAC,QAAD;MAAM,WAAU;gBACb,YAAY,WAAW;MACnB,CAAA;KAEJ,CAAA,CACH;;GAEN,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf,CACE,iBAAA,GAAA,kBAAA,KAACC,iCAAAA,cAAD;KACE,OAAO,CACL,GAAG,OAAO,KAAK,WAAW;MACxB,IAAI,MAAM;MACV,OAAO,MAAM;MACb,OAAO,MAAM;MACd,EAAE,EACH,IAAI,SAAS,EAAE,EAAE,KAAK,UAAU;MAC9B,IAAI,KAAK;MACT,OAAO,KAAK;MACZ,OAAO,KAAK;MACZ,QAAQ;MACT,EAAE,CACJ;KACD,WAAW;KACX,UAAU;KACV,WAAU;KACV,CAAA,EACF,iBAAA,GAAA,kBAAA,KAAC,QAAD;KACE,YAAA,GAAA,OAAA,IACE,2DACA,aAAa,gBAAgB,YAC9B;eAEA,sBAAsB;KAClB,CAAA,CACH;;GAEN,iBAAA,GAAA,kBAAA,MAAC,OAAD;IACE,KAAK;IACL,WAAU;IACV,OAAO,EAAE,QAAQ;cAHnB,CAKE,iBAAA,GAAA,kBAAA,KAAC,OAAD;KACE,KAAK;KACL,WAAU;KACV,OAAO;MACL,MAAM,WAAW;MACjB,KAAK,WAAW;MAChB,SAAS,gBAAgB,IAAI;MAC7B,YACE;MACH;eAEA,kBAAkB,QACjB,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,kBAAD;MACE,OAAO,sBAAsB,cAAc;MAC3C,MAAM;MACN,CAAA;KAEA,CAAA,EACL,QAAQ,KACP,iBAAA,GAAA,kBAAA,MAAC,OAAD;KAAY;KAAe;eAA3B;MACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;OACE,IAAI;OACJ,IAAI;OACJ,IAAI;OACJ,IAAI,SAAS;OACb,QAAO;OACP,aAAa;OACb,CAAA;MAED,OAAO,KAAK,MAAM,UAAU;OAC3B,MAAM,IAAI,OAAO,KAAK;OACtB,MAAM,gBACJ,cAAc,KAAA,KAAa,UAAU,OAAO,SAAS;AAEvD,cACE,iBAAA,GAAA,kBAAA,MAAC,KAAD,EAAA,UAAA,CACG,CAAC,iBACA,iBAAA,GAAA,kBAAA,KAAC,QAAD;QACE,IAAI,gBAAgB;QACpB,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,QAAO;QACP,aAAa;QACb,CAAA,EAEH,CAAC,iBACA,iBAAA,GAAA,kBAAA,KAAC,QAAD;QACE,GAAG,gBAAgB;QACnB,GAAG,IAAI;QACP,YAAW;QACX,MAAK;QACL,UAAU;kBAETC,0BAAAA,gBAAgB,KAAK;QACjB,CAAA,CAEP,EAAA,EAtBI,UAAU,OAsBd;QAEN;MAED,aACC,iBAAA,GAAA,kBAAA,KAAC,QAAD;OACE,GAAG;OACH,GAAG,cAAc;OACjB,YAAW;OACX,MAAK;OACL,UAAU;OACV,YAAY;iBAEX;OACI,CAAA;MAGR,eAAe,QACd,iBAAA,GAAA,kBAAA,KAAC,QAAD;OACE,IAAI;OACJ,IAAI;OACJ,IAAI;OACJ,IAAI,SAAS;OACb,QAAO;OACP,aAAa;OACb,iBAAgB;OAChB,eAAc;OACd,CAAA;MAGJ,iBAAA,GAAA,kBAAA,KAAC,QAAD;OACE,IAAI;OACJ,IAAI;OACJ,IAAI,OAAO,EAAE;OACb,IAAI,OAAO,EAAE;OACb,QAAO;OACP,aAAa;OACb,CAAA;MAEF,iBAAA,GAAA,kBAAA,MAACC,YAAAA,OAAD,EAAA,UAAA;OACG,kBAAkB,QACjB,iBAAA,GAAA,kBAAA,KAAC,aAAD;QACE,UAAU;QACV,SAAS,oBAAoB;QAClB;QACH;QACA;QACA;QACR,CAAA;OAEH;OAEA,iBACC,iBAAA,GAAA,kBAAA,KAAC,QAAD;QACE,IAAI;QACJ,IAAI;QACJ,IAAI,OAAO,cAAc,MAAM;QAC/B,IAAI,OAAO,cAAc,MAAM;QAC/B,QAAQ,cAAc,SAAS;QAC/B,aAAa;QACb,eAAc;QACd,CAAA;OAGH,UAAU,KAAK,SACd,iBAAA,GAAA,kBAAA,KAAC,QAAD;QAEE,GAAG,KAAK;QACR,MAAK;QACL,QAAQ,KAAK;QACb,aAAa;QACb,iBAAiB,KAAK;QACtB,eAAc;QACd,gBAAe;QACf,eAAc;QACd,EATK,QAAQ,KAAK,MASlB,CACF;OACI,EAAA,CAAA;MAER,iBAAA,GAAA,kBAAA,KAAC,kBAAD;OACW;OACT,kBAAkB;OACV;OACA;OACR,eAAe;OACf,CAAA;MAEF,iBAAA,GAAA,kBAAA,KAAC,eAAD;OACS;OACC;OACA;OACQ;OAChB,CAAA;MACE;OAEJ;;GACF"}
+{"version":3,"file":"bar-chart.cjs","names":["localeNumberFormat","BarStack","useReducedMotion","buildYAxisScale","useMeasuredSize","clampTooltipPosition","SectionTitle","SeriesLegend","ChartTooltipCard","formatYAxisTick","Group"],"sources":["../../src/components/bar-chart.tsx"],"sourcesContent":["import { localPoint } from '@visx/event'\nimport { Group } from '@visx/group'\nimport { scaleBand, scaleLinear, scaleOrdinal } from '@visx/scale'\nimport { BarStack } from '@visx/shape'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { buildYAxisScale, formatYAxisTick } from '../utils/chart-scale'\nimport { cn } from '../utils/cn'\nimport { localeNumberFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend } from './series-legend'\nimport { SectionTitle } from './typography'\n\nconst defaultTotalFormat = localeNumberFormat()\n\nexport type BarChartCategory = string | number\n\nexport interface BarChartSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  hoverFill?: string\n  getValue: (datum: TDatum) => number\n}\n\nexport interface BarChartLineSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  /** `null` gaps break the line (e.g. hours without a reading). */\n  getValue: (datum: TDatum) => number | null\n  /** Own y-domain for this line (e.g. `[0, 100]` for a percentage). Defaults to the bar scale. */\n  domain?: [number, number]\n  /** Start hidden; the user can enable the line from the legend. */\n  hiddenByDefault?: boolean\n  /** Formats this line's value in the hover tooltip. Defaults to `formatValue`. */\n  formatValue?: (value: number) => string\n  strokeDasharray?: string\n}\n\nexport interface BarChartProps<TDatum> {\n  data: TDatum[]\n  series: BarChartSeries<TDatum>[]\n  /** Line overlays drawn on top of the bars, toggleable from the legend. */\n  lines?: BarChartLineSeries<TDatum>[]\n  getCategory: (datum: TDatum) => BarChartCategory\n  /** Full ordered set of categories on the x-axis. Defaults to `data.map(getCategory)`. */\n  categories?: BarChartCategory[]\n  /** Subset of categories that should render an x-axis label. Defaults to every category. */\n  categoryTicks?: BarChartCategory[]\n  formatCategory?: (category: BarChartCategory) => string\n  /** Formats the hovered category in the tooltip header. Defaults to `formatCategory`. */\n  formatTooltipCategory?: (category: BarChartCategory) => string\n  highlightedCategory?: BarChartCategory\n  showHighlightLine?: boolean\n  /**\n   * Horizontal reference line drawn across the plot at a given y-value.\n   * Useful for thresholds (e.g. price ceiling).\n   */\n  referenceLine?: { value: number; label?: string; color?: string }\n  title?: string\n  yAxisUnit?: string\n  height?: number\n  /**\n   * Override how the total value (sum of focused or all categories) is\n   * rendered. `animated` is false while a bar is focused (hover), so an\n   * animated total can snap between hovered buckets instead of re-firing a\n   * tween on every bar the pointer crosses.\n   */\n  renderTotal?: (value: number, animated: boolean) => React.ReactNode\n  /** Format function used when `renderTotal` is not provided. */\n  formatTotal?: (value: number) => string\n  /** Formats per-series values in the hover tooltip. Defaults to `formatTotal`. */\n  formatValue?: (value: number) => string\n  className?: string\n}\n\ninterface StackDatum {\n  __category: BarChartCategory\n  __values: Record<string, number>\n}\n\ninterface BarStackLayerProps<TDatum> {\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  seriesByKey: Map<string, BarChartSeries<TDatum>>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n  colorScale: ReturnType<typeof scaleOrdinal<string, string>>\n}\n\ninterface CategoryTicksProps {\n  ticks: BarChartCategory[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  formatCategory: (category: BarChartCategory) => string\n}\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst HOVER_FADE_MS = 200\nconst FOCUS_TRANSITION_MS = 180\nconst DEFAULT_HEIGHT = 220\nconst BAR_RADIUS = 2\nconst Y_AXIS_GUTTER = 34\n\nfunction buildBarPath(\n  x: number,\n  y: number,\n  width: number,\n  height: number,\n  radius: number,\n  roundTop: boolean,\n  roundBottom: boolean,\n) {\n  const r = Math.max(0, Math.min(radius, width / 2, height / 2))\n\n  if (r === 0 || (!roundTop && !roundBottom)) {\n    return `M ${x} ${y} H ${x + width} V ${y + height} H ${x} Z`\n  }\n\n  const tl = roundTop ? r : 0\n  const tr = roundTop ? r : 0\n  const br = roundBottom ? r : 0\n  const bl = roundBottom ? r : 0\n\n  return [\n    `M ${x + tl} ${y}`,\n    `H ${x + width - tr}`,\n    tr > 0\n      ? `Q ${x + width} ${y} ${x + width} ${y + tr}`\n      : `L ${x + width} ${y}`,\n    `V ${y + height - br}`,\n    br > 0\n      ? `Q ${x + width} ${y + height} ${x + width - br} ${y + height}`\n      : `L ${x + width} ${y + height}`,\n    `H ${x + bl}`,\n    bl > 0\n      ? `Q ${x} ${y + height} ${x} ${y + height - bl}`\n      : `L ${x} ${y + height}`,\n    `V ${y + tl}`,\n    tl > 0 ? `Q ${x} ${y} ${x + tl} ${y}` : `L ${x} ${y}`,\n    'Z',\n  ].join(' ')\n}\n\nfunction BarStackLayer<TDatum>({\n  stackData,\n  series,\n  seriesByKey,\n  xScale,\n  yScale,\n  colorScale,\n}: BarStackLayerProps<TDatum>) {\n  return (\n    <BarStack<StackDatum, string>\n      data={stackData}\n      keys={series.map((entry) => entry.key)}\n      x={(record) => record.__category}\n      value={(record, key) => record.__values[key] ?? 0}\n      xScale={xScale}\n      yScale={yScale}\n      color={colorScale}\n      offset=\"diverging\"\n    >\n      {(barStacks) =>\n        barStacks.map((barStack) =>\n          barStack.bars.map((bar) => {\n            const values = bar.bar.data.__values\n            const segmentValue = values[barStack.key] ?? 0\n\n            if (segmentValue === 0) {\n              return null\n            }\n\n            const seriesEntry = seriesByKey.get(barStack.key)\n            const strokeColor = seriesEntry?.color ?? bar.color\n            const fillColor = strokeColor\n\n            // Positive segments stack up from the baseline, negatives down.\n            // Round only the outermost corner of each side of the axis.\n            const positiveKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) > 0)\n            const negativeKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) < 0)\n            const roundTop =\n              segmentValue > 0 &&\n              positiveKeys[positiveKeys.length - 1] === barStack.key\n            const roundBottom =\n              segmentValue > 0\n                ? positiveKeys[0] === barStack.key\n                : negativeKeys[negativeKeys.length - 1] === barStack.key\n\n            // visx returns a signed height for below-baseline bars; normalize\n            // to a top-left origin with a positive height for the path.\n            const top = bar.height < 0 ? bar.y + bar.height : bar.y\n            const barHeight = Math.abs(bar.height)\n\n            return (\n              <path\n                key={`bar-${barStack.index}-${bar.index}`}\n                d={buildBarPath(\n                  bar.x,\n                  top,\n                  bar.width,\n                  Math.max(0, barHeight),\n                  BAR_RADIUS,\n                  roundTop,\n                  roundBottom,\n                )}\n                fill={fillColor}\n                stroke={strokeColor}\n                strokeWidth={1}\n                style={{ transition: 'fill 180ms ease' }}\n              />\n            )\n          }),\n        )\n      }\n    </BarStack>\n  )\n}\n\ninterface FocusBorderProps<TDatum> {\n  category: BarChartCategory\n  visible: boolean\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n}\n\nfunction FocusBorder<TDatum>({\n  category,\n  visible,\n  stackData,\n  series,\n  xScale,\n  yScale,\n}: FocusBorderProps<TDatum>) {\n  const reducedMotion = useReducedMotion()\n  const x = xScale(category)\n  const datum = stackData.find((entry) => entry.__category === category)\n\n  if (x === undefined || !datum) {\n    return null\n  }\n\n  const hasAnyValue = series.some(\n    (entry) => (datum.__values[entry.key] ?? 0) !== 0,\n  )\n\n  if (!hasAnyValue) {\n    return null\n  }\n\n  const topY = PADDING_TOP\n  // Extend past the baseline to cover any below-axis (feed-in) segment.\n  const negativeSum = series.reduce(\n    (sum, entry) => sum + Math.min(0, datum.__values[entry.key] ?? 0),\n    0,\n  )\n  const bottomY = yScale(negativeSum)\n  const borderPaddingX = 4\n  const borderPaddingY = 3\n  const borderXRaw = x - borderPaddingX\n  const borderY = topY - borderPaddingY\n  const borderWidthRaw = xScale.bandwidth() + borderPaddingX * 2\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n  const borderX = Math.max(minX, borderXRaw)\n  const borderRight = Math.min(maxX, borderXRaw + borderWidthRaw)\n  const borderWidth = Math.max(0, borderRight - borderX)\n  const borderHeight = Math.max(1, bottomY - topY + borderPaddingY * 2)\n\n  if (borderWidth <= 0) {\n    return null\n  }\n\n  return (\n    <rect\n      x={borderX}\n      y={borderY}\n      width={borderWidth}\n      height={borderHeight}\n      rx={6}\n      fill=\"var(--spark-a2)\"\n      stroke=\"var(--spark-a9)\"\n      strokeWidth={2}\n      pointerEvents=\"none\"\n      style={{\n        opacity: visible ? 1 : 0,\n        transition: reducedMotion\n          ? `opacity ${FOCUS_TRANSITION_MS}ms ease`\n          : `x ${FOCUS_TRANSITION_MS}ms ease, y ${FOCUS_TRANSITION_MS}ms ease, width ${FOCUS_TRANSITION_MS}ms ease, height ${FOCUS_TRANSITION_MS}ms ease, opacity ${FOCUS_TRANSITION_MS}ms ease`,\n      }}\n    />\n  )\n}\n\ninterface InteractionLayerProps {\n  xDomain: BarChartCategory[]\n  activeCategories: Set<BarChartCategory>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  onHoverChange: (category: BarChartCategory | null) => void\n}\n\nfunction InteractionLayer({\n  xDomain,\n  activeCategories,\n  xScale,\n  height,\n  onHoverChange,\n}: InteractionLayerProps) {\n  const bandwidth = xScale.bandwidth()\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n\n  // A single overlay that maps the pointer to the nearest category with data,\n  // so there are no dead zones between/around bars to break the hover.\n  const handleMove = (\n    event: React.MouseEvent<SVGRectElement> | React.TouchEvent<SVGRectElement>,\n  ) => {\n    const point = localPoint(event)\n    if (!point) return\n\n    let nearest: BarChartCategory | null = null\n    let best = Infinity\n    for (const category of xDomain) {\n      if (!activeCategories.has(category)) continue\n      const x = xScale(category)\n      if (x === undefined) continue\n      const distance = Math.abs(x + bandwidth / 2 - point.x)\n      if (distance < best) {\n        best = distance\n        nearest = category\n      }\n    }\n\n    if (nearest !== null) onHoverChange(nearest)\n  }\n\n  return (\n    <rect\n      x={minX}\n      y={PADDING_TOP}\n      width={Math.max(0, maxX - minX)}\n      height={height - PADDING_TOP - PADDING_BOTTOM}\n      fill=\"transparent\"\n      onMouseMove={handleMove}\n      onMouseLeave={() => onHoverChange(null)}\n      onTouchMove={handleMove}\n      onTouchEnd={() => onHoverChange(null)}\n    />\n  )\n}\n\nfunction CategoryTicks({\n  ticks,\n  xScale,\n  height,\n  formatCategory,\n}: CategoryTicksProps) {\n  return (\n    <>\n      {ticks.map((category) => {\n        const x = xScale(category)\n\n        if (x === undefined) {\n          return null\n        }\n\n        return (\n          <text\n            key={`tick-${String(category)}`}\n            x={x + xScale.bandwidth() / 2}\n            y={height - PADDING_BOTTOM + 16}\n            textAnchor=\"middle\"\n            fill=\"var(--neutral-a11)\"\n            fontSize={10}\n          >\n            {formatCategory(category)}\n          </text>\n        )\n      })}\n    </>\n  )\n}\n\nfunction defaultFormatTotal(value: number) {\n  return defaultTotalFormat.format(value)\n}\n\nexport function BarChart<TDatum>({\n  data,\n  series,\n  lines,\n  getCategory,\n  categories,\n  categoryTicks,\n  formatCategory = (category) => String(category),\n  formatTooltipCategory = formatCategory,\n  highlightedCategory,\n  showHighlightLine = false,\n  referenceLine,\n  title,\n  yAxisUnit,\n  height = DEFAULT_HEIGHT,\n  renderTotal,\n  formatTotal = defaultFormatTotal,\n  formatValue,\n  className,\n}: BarChartProps<TDatum>): React.ReactElement {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [width, setWidth] = useState(0)\n  const [hoveredCategory, setHoveredCategory] =\n    useState<BarChartCategory | null>(null)\n  const [trailingHoverLabel, setTrailingHoverLabel] = useState<string | null>(\n    null,\n  )\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () =>\n      new Set(\n        (lines ?? [])\n          .filter((line) => line.hiddenByDefault)\n          .map((line) => line.key),\n      ),\n  )\n\n  const toggleSeries = useCallback((id: string) => {\n    setHiddenSeries((prev) => {\n      const next = new Set(prev)\n      if (next.has(id)) {\n        next.delete(id)\n      } else {\n        next.add(id)\n      }\n      return next\n    })\n  }, [])\n\n  useEffect(() => {\n    const element = containerRef.current\n\n    if (!element) {\n      return\n    }\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n\n      if (!entry) {\n        return\n      }\n\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n\n    return () => {\n      resizeObserver.disconnect()\n    }\n  }, [])\n\n  const seriesByKey = useMemo(() => {\n    const map = new Map<string, BarChartSeries<TDatum>>()\n\n    for (const entry of series) {\n      map.set(entry.key, entry)\n    }\n\n    return map\n  }, [series])\n\n  const stackData = useMemo<StackDatum[]>(\n    () =>\n      data.map((datum) => {\n        const values: Record<string, number> = {}\n\n        for (const entry of series) {\n          values[entry.key] = hiddenSeries.has(entry.key)\n            ? 0\n            : entry.getValue(datum)\n        }\n\n        return { __category: getCategory(datum), __values: values }\n      }),\n    [data, getCategory, series, hiddenSeries],\n  )\n\n  const yMax = useMemo(\n    () =>\n      Math.max(\n        1,\n        referenceLine?.value ?? 0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.max(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [referenceLine, series, stackData],\n  )\n\n  // Most negative stack sum across buckets (0 when nothing dips below the axis).\n  const yMin = useMemo(\n    () =>\n      Math.min(\n        0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.min(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [series, stackData],\n  )\n\n  const xDomain = useMemo(\n    () => categories ?? stackData.map((record) => record.__category),\n    [categories, stackData],\n  )\n\n  const xScale = useMemo(\n    () =>\n      scaleBand<BarChartCategory>({\n        domain: xDomain,\n        range: [Y_AXIS_GUTTER, Math.max(Y_AXIS_GUTTER, width)],\n        padding: 0.32,\n      }),\n    [xDomain, width],\n  )\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [yMin, yMax],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [height, yMax, yMin],\n  )\n\n  const colorScale = useMemo(\n    () =>\n      scaleOrdinal<string, string>({\n        domain: series.map((entry) => entry.key),\n        range: series.map((entry) => entry.color),\n      }),\n    [series],\n  )\n\n  const linePaths = useMemo(() => {\n    if (!lines || width === 0) {\n      return []\n    }\n\n    return lines\n      .filter((line) => !hiddenSeries.has(line.key))\n      .map((line) => {\n        const lineScale = line.domain\n          ? scaleLinear<number>({\n              domain: line.domain,\n              range: [height - PADDING_BOTTOM, PADDING_TOP],\n            })\n          : yScale\n        const segments: string[] = []\n        let previous: { x: number; y: number } | null = null\n\n        for (const datum of data) {\n          const x = xScale(getCategory(datum))\n          const value = line.getValue(datum)\n\n          if (x === undefined || value === null || !Number.isFinite(value)) {\n            previous = null\n            continue\n          }\n\n          const point = {\n            x: x + xScale.bandwidth() / 2,\n            y: lineScale(value),\n          }\n          segments.push(\n            previous === null\n              ? `M ${point.x} ${point.y}`\n              : `L ${point.x} ${point.y}`,\n          )\n          previous = point\n        }\n\n        return {\n          key: line.key,\n          d: segments.join(' '),\n          color: line.color,\n          strokeDasharray: line.strokeDasharray ?? '5 4',\n        }\n      })\n      .filter((path) => path.d !== '')\n  }, [lines, hiddenSeries, data, getCategory, xScale, yScale, height, width])\n\n  const stackCategorySet = useMemo(\n    () => new Set(stackData.map((record) => record.__category)),\n    [stackData],\n  )\n\n  const lastFocusCategoryRef = useRef<BarChartCategory | null>(null)\n  if (hoveredCategory !== null) {\n    lastFocusCategoryRef.current = hoveredCategory\n  }\n  const focusCategory = lastFocusCategoryRef.current\n\n  const focused = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (stackData.find((record) => record.__category === hoveredCategory) ??\n          null),\n    [hoveredCategory, stackData],\n  )\n\n  // Below-baseline segments (feed-in) are context, not part of the headline\n  // sum, so the total counts only the positive stack (energy consumed).\n  const totalValue = useMemo(() => {\n    if (focused) {\n      return series.reduce(\n        (sum, entry) => sum + Math.max(0, focused.__values[entry.key] ?? 0),\n        0,\n      )\n    }\n\n    return stackData.reduce(\n      (sum, record) =>\n        sum +\n        series.reduce(\n          (s, entry) => s + Math.max(0, record.__values[entry.key] ?? 0),\n          0,\n        ),\n      0,\n    )\n  }, [focused, series, stackData])\n\n  const hoverLabel = focused ? formatTooltipCategory(focused.__category) : null\n\n  useEffect(() => {\n    if (hoverLabel) {\n      setTrailingHoverLabel(hoverLabel)\n      return\n    }\n\n    const timeoutId = window.setTimeout(() => {\n      setTrailingHoverLabel(null)\n    }, HOVER_FADE_MS)\n\n    return () => {\n      window.clearTimeout(timeoutId)\n    }\n  }, [hoverLabel])\n\n  const ticks = categoryTicks ?? xDomain\n  const yTicks = useMemo(() => buildYAxisScale(yMin, yMax).ticks, [yMin, yMax])\n  const highlightX = useMemo(() => {\n    if (!showHighlightLine || highlightedCategory === undefined) {\n      return null\n    }\n\n    const x = xScale(highlightedCategory)\n\n    if (x === undefined) {\n      return null\n    }\n\n    return x + xScale.bandwidth() / 2\n  }, [highlightedCategory, showHighlightLine, xScale])\n\n  const focusedDatum = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (data.find((datum) => getCategory(datum) === hoveredCategory) ??\n          null),\n    [hoveredCategory, data, getCategory],\n  )\n\n  // The bars don't depend on hover state, so memoize the layer: hovering\n  // across bars must not re-render (and re-stack) every bar path each move.\n  const barStackLayer = useMemo(\n    () => (\n      <BarStackLayer\n        stackData={stackData}\n        series={series}\n        seriesByKey={seriesByKey}\n        xScale={xScale}\n        yScale={yScale}\n        colorScale={colorScale}\n      />\n    ),\n    [stackData, series, seriesByKey, xScale, yScale, colorScale],\n  )\n\n  const fmtTooltipValue = formatValue ?? formatTotal\n  const tooltipRows: ChartTooltipRow[] = focused\n    ? [\n        ...series\n          .filter((entry) => (focused.__values[entry.key] ?? 0) !== 0)\n          .map((entry) => ({\n            key: entry.key,\n            label: entry.label,\n            color: entry.color,\n            value: fmtTooltipValue(Math.abs(focused.__values[entry.key] ?? 0)),\n          })),\n        ...(lines ?? [])\n          .filter((line) => !hiddenSeries.has(line.key))\n          .flatMap((line) => {\n            const value =\n              focusedDatum === null ? null : line.getValue(focusedDatum)\n\n            if (value === null || !Number.isFinite(value)) {\n              return []\n            }\n\n            return [\n              {\n                key: line.key,\n                label: line.label,\n                color: line.color,\n                value: (line.formatValue ?? fmtTooltipValue)(value),\n              },\n            ]\n          }),\n      ]\n    : []\n  const tooltipActive = tooltipRows.length > 0\n  const anchorX =\n    focusCategory !== null\n      ? (xScale(focusCategory) ?? 0) + xScale.bandwidth() / 2\n      : 0\n  const anchorY = yScale(totalValue)\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX,\n    anchorY,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col', className)}>\n      <div className=\"flex items-baseline justify-between\">\n        {title && <SectionTitle>{title}</SectionTitle>}\n        <span className=\"tabular-nums\">\n          {renderTotal ? (\n            renderTotal(totalValue, focused === null)\n          ) : (\n            <span className=\"text-base font-bold text-gray tabular-nums\">\n              {formatTotal(totalValue)}\n            </span>\n          )}\n        </span>\n      </div>\n\n      <div className=\"flex min-h-5 items-baseline justify-between gap-4\">\n        <SeriesLegend\n          items={[\n            ...series.map((entry) => ({\n              id: entry.key,\n              label: entry.label,\n              color: entry.color,\n            })),\n            ...(lines ?? []).map((line) => ({\n              id: line.key,\n              label: line.label,\n              color: line.color,\n              marker: 'dashed-line' as const,\n            })),\n          ]}\n          hiddenIds={hiddenSeries}\n          onToggle={toggleSeries}\n          className=\"gap-y-1\"\n        />\n        <span\n          className={cn(\n            'text-xs text-gray-light transition-opacity duration-200',\n            hoverLabel ? 'opacity-100' : 'opacity-0',\n          )}\n        >\n          {trailingHoverLabel ?? ' '}\n        </span>\n      </div>\n\n      <div\n        ref={containerRef}\n        className=\"relative mt-2 w-full\"\n        style={{ height }}\n      >\n        <div\n          ref={tooltipRef}\n          className=\"pointer-events-none absolute z-10\"\n          style={{\n            left: tooltipPos.left,\n            top: tooltipPos.top,\n            opacity: tooltipActive ? 1 : 0,\n            transition: reducedMotion\n              ? 'opacity 140ms ease-out'\n              : 'left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out',\n          }}\n        >\n          {focusCategory !== null && (\n            <ChartTooltipCard\n              label={formatTooltipCategory(focusCategory)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={Y_AXIS_GUTTER}\n              y1={PADDING_TOP}\n              y2={height - PADDING_BOTTOM}\n              stroke=\"var(--neutral-a6)\"\n              strokeWidth={1}\n            />\n\n            {yTicks.map((tick, index) => {\n              const y = yScale(tick)\n              const hideTickLabel =\n                yAxisUnit !== undefined && index === yTicks.length - 1\n\n              return (\n                <g key={`y-tick-${tick}`}>\n                  {!hideTickLabel && (\n                    <line\n                      x1={Y_AXIS_GUTTER - 4}\n                      x2={Y_AXIS_GUTTER}\n                      y1={y}\n                      y2={y}\n                      stroke=\"var(--neutral-a8)\"\n                      strokeWidth={1}\n                    />\n                  )}\n                  {!hideTickLabel && (\n                    <text\n                      x={Y_AXIS_GUTTER - 7}\n                      y={y + 3}\n                      textAnchor=\"end\"\n                      fill=\"var(--neutral-a11)\"\n                      fontSize={10}\n                    >\n                      {formatYAxisTick(tick)}\n                    </text>\n                  )}\n                </g>\n              )\n            })}\n\n            {yAxisUnit && (\n              <text\n                x={0}\n                y={PADDING_TOP - 6}\n                textAnchor=\"start\"\n                fill=\"var(--neutral-a11)\"\n                fontSize={10}\n                fontWeight={600}\n              >\n                {yAxisUnit}\n              </text>\n            )}\n\n            {highlightX !== null && (\n              <line\n                x1={highlightX}\n                x2={highlightX}\n                y1={PADDING_TOP}\n                y2={height - PADDING_BOTTOM}\n                stroke=\"var(--spark-a9)\"\n                strokeWidth={1.5}\n                strokeDasharray=\"5 4\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={width}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--neutral-a5)\"\n              strokeWidth={1}\n            />\n\n            <Group>\n              {focusCategory !== null && (\n                <FocusBorder\n                  category={focusCategory}\n                  visible={hoveredCategory !== null}\n                  stackData={stackData}\n                  series={series}\n                  xScale={xScale}\n                  yScale={yScale}\n                />\n              )}\n              {barStackLayer}\n\n              {referenceLine && (\n                <line\n                  x1={Y_AXIS_GUTTER}\n                  x2={width}\n                  y1={yScale(referenceLine.value)}\n                  y2={yScale(referenceLine.value)}\n                  stroke={referenceLine.color ?? 'var(--neutral-a11)'}\n                  strokeWidth={1.5}\n                  pointerEvents=\"none\"\n                />\n              )}\n\n              {linePaths.map((path) => (\n                <path\n                  key={`line-${path.key}`}\n                  d={path.d}\n                  fill=\"none\"\n                  stroke={path.color}\n                  strokeWidth={1.5}\n                  strokeDasharray={path.strokeDasharray}\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  pointerEvents=\"none\"\n                />\n              ))}\n            </Group>\n\n            <InteractionLayer\n              xDomain={xDomain}\n              activeCategories={stackCategorySet}\n              xScale={xScale}\n              height={height}\n              onHoverChange={setHoveredCategory}\n            />\n\n            <CategoryTicks\n              ticks={ticks}\n              xScale={xScale}\n              height={height}\n              formatCategory={formatCategory}\n            />\n          </svg>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/bar-chart.js

@@ -1,4 +1,5 @@
 "use client";
+import { useReducedMotion } from "../hooks/use-reduced-motion.js";
 import { cn } from "../utils/cn.js";
 import { localeNumberFormat } from "../utils/format.js";
 import { buildYAxisScale, formatYAxisTick } from "../utils/chart-scale.js";
@@ -73,6 +74,7 @@ function BarStackLayer({ stackData, series, seriesByKey, xScale, yScale, colorSc
 	});
 }
 function FocusBorder({ category, visible, stackData, series, xScale, yScale }) {
+	const reducedMotion = useReducedMotion();
 	const x = xScale(category);
 	const datum = stackData.find((entry) => entry.__category === category);
 	if (x === void 0 || !datum) return null;
@@ -104,7 +106,7 @@ function FocusBorder({ category, visible, stackData, series, xScale, yScale }) {
 		pointerEvents: "none",
 		style: {
 			opacity: visible ? 1 : 0,
-			transition: `x ${FOCUS_TRANSITION_MS}ms ease, y ${FOCUS_TRANSITION_MS}ms ease, width ${FOCUS_TRANSITION_MS}ms ease, height ${FOCUS_TRANSITION_MS}ms ease, opacity ${FOCUS_TRANSITION_MS}ms ease`
+			transition: reducedMotion ? `opacity ${FOCUS_TRANSITION_MS}ms ease` : `x ${FOCUS_TRANSITION_MS}ms ease, y ${FOCUS_TRANSITION_MS}ms ease, width ${FOCUS_TRANSITION_MS}ms ease, height ${FOCUS_TRANSITION_MS}ms ease, opacity ${FOCUS_TRANSITION_MS}ms ease`
 		}
 	});
 }
@@ -150,7 +152,7 @@ function CategoryTicks({ ticks, xScale, height, formatCategory }) {
 			x: x + xScale.bandwidth() / 2,
 			y: height - PADDING_BOTTOM + 16,
 			textAnchor: "middle",
-			fill: "var(--gray-a11)",
+			fill: "var(--neutral-a11)",
 			fontSize: 10,
 			children: formatCategory(category)
 		}, `tick-${String(category)}`);
@@ -161,6 +163,7 @@ function defaultFormatTotal(value) {
 }
 function BarChart({ data, series, lines, getCategory, categories, categoryTicks, formatCategory = (category) => String(category), formatTooltipCategory = formatCategory, highlightedCategory, showHighlightLine = false, referenceLine, title, yAxisUnit, height = DEFAULT_HEIGHT, renderTotal, formatTotal = defaultFormatTotal, formatValue, className }) {
 	const containerRef = useRef(null);
+	const reducedMotion = useReducedMotion();
 	const [width, setWidth] = useState(0);
 	const [hoveredCategory, setHoveredCategory] = useState(null);
 	const [trailingHoverLabel, setTrailingHoverLabel] = useState(null);
@@ -399,7 +402,7 @@ function BarChart({ data, series, lines, getCategory, categories, categoryTicks,
 						left: tooltipPos.left,
 						top: tooltipPos.top,
 						opacity: tooltipActive ? 1 : 0,
-						transition: "left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out"
+						transition: reducedMotion ? "opacity 140ms ease-out" : "left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out"
 					},
 					children: focusCategory !== null && /* @__PURE__ */ jsx(ChartTooltipCard, {
 						label: formatTooltipCategory(focusCategory),
@@ -414,7 +417,7 @@ function BarChart({ data, series, lines, getCategory, categories, categoryTicks,
 							x2: Y_AXIS_GUTTER,
 							y1: PADDING_TOP,
 							y2: height - PADDING_BOTTOM,
-							stroke: "var(--gray-a6)",
+							stroke: "var(--neutral-a6)",
 							strokeWidth: 1
 						}),
 						yTicks.map((tick, index) => {
@@ -425,13 +428,13 @@ function BarChart({ data, series, lines, getCategory, categories, categoryTicks,
 								x2: Y_AXIS_GUTTER,
 								y1: y,
 								y2: y,
-								stroke: "var(--gray-a8)",
+								stroke: "var(--neutral-a8)",
 								strokeWidth: 1
 							}), !hideTickLabel && /* @__PURE__ */ jsx("text", {
 								x: Y_AXIS_GUTTER - 7,
 								y: y + 3,
 								textAnchor: "end",
-								fill: "var(--gray-a11)",
+								fill: "var(--neutral-a11)",
 								fontSize: 10,
 								children: formatYAxisTick(tick)
 							})] }, `y-tick-${tick}`);
@@ -440,7 +443,7 @@ function BarChart({ data, series, lines, getCategory, categories, categoryTicks,
 							x: 0,
 							y: PADDING_TOP - 6,
 							textAnchor: "start",
-							fill: "var(--gray-a11)",
+							fill: "var(--neutral-a11)",
 							fontSize: 10,
 							fontWeight: 600,
 							children: yAxisUnit
@@ -460,7 +463,7 @@ function BarChart({ data, series, lines, getCategory, categories, categoryTicks,
 							x2: width,
 							y1: yScale(0),
 							y2: yScale(0),
-							stroke: "var(--gray-a5)",
+							stroke: "var(--neutral-a5)",
 							strokeWidth: 1
 						}),
 						/* @__PURE__ */ jsxs(Group, { children: [
@@ -478,7 +481,7 @@ function BarChart({ data, series, lines, getCategory, categories, categoryTicks,
 								x2: width,
 								y1: yScale(referenceLine.value),
 								y2: yScale(referenceLine.value),
-								stroke: referenceLine.color ?? "var(--gray-a11)",
+								stroke: referenceLine.color ?? "var(--neutral-a11)",
 								strokeWidth: 1.5,
 								pointerEvents: "none"
 							}),

package/dist/components/bar-chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"bar-chart.js","names":[],"sources":["../../src/components/bar-chart.tsx"],"sourcesContent":["import { localPoint } from '@visx/event'\nimport { Group } from '@visx/group'\nimport { scaleBand, scaleLinear, scaleOrdinal } from '@visx/scale'\nimport { BarStack } from '@visx/shape'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { buildYAxisScale, formatYAxisTick } from '../utils/chart-scale'\nimport { cn } from '../utils/cn'\nimport { localeNumberFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend } from './series-legend'\nimport { SectionTitle } from './typography'\n\nconst defaultTotalFormat = localeNumberFormat()\n\nexport type BarChartCategory = string | number\n\nexport interface BarChartSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  hoverFill?: string\n  getValue: (datum: TDatum) => number\n}\n\nexport interface BarChartLineSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  /** `null` gaps break the line (e.g. hours without a reading). */\n  getValue: (datum: TDatum) => number | null\n  /** Own y-domain for this line (e.g. `[0, 100]` for a percentage). Defaults to the bar scale. */\n  domain?: [number, number]\n  /** Start hidden; the user can enable the line from the legend. */\n  hiddenByDefault?: boolean\n  /** Formats this line's value in the hover tooltip. Defaults to `formatValue`. */\n  formatValue?: (value: number) => string\n  strokeDasharray?: string\n}\n\nexport interface BarChartProps<TDatum> {\n  data: TDatum[]\n  series: BarChartSeries<TDatum>[]\n  /** Line overlays drawn on top of the bars, toggleable from the legend. */\n  lines?: BarChartLineSeries<TDatum>[]\n  getCategory: (datum: TDatum) => BarChartCategory\n  /** Full ordered set of categories on the x-axis. Defaults to `data.map(getCategory)`. */\n  categories?: BarChartCategory[]\n  /** Subset of categories that should render an x-axis label. Defaults to every category. */\n  categoryTicks?: BarChartCategory[]\n  formatCategory?: (category: BarChartCategory) => string\n  /** Formats the hovered category in the tooltip header. Defaults to `formatCategory`. */\n  formatTooltipCategory?: (category: BarChartCategory) => string\n  highlightedCategory?: BarChartCategory\n  showHighlightLine?: boolean\n  /**\n   * Horizontal reference line drawn across the plot at a given y-value.\n   * Useful for thresholds (e.g. price ceiling).\n   */\n  referenceLine?: { value: number; label?: string; color?: string }\n  title?: string\n  yAxisUnit?: string\n  height?: number\n  /**\n   * Override how the total value (sum of focused or all categories) is\n   * rendered. `animated` is false while a bar is focused (hover), so an\n   * animated total can snap between hovered buckets instead of re-firing a\n   * tween on every bar the pointer crosses.\n   */\n  renderTotal?: (value: number, animated: boolean) => React.ReactNode\n  /** Format function used when `renderTotal` is not provided. */\n  formatTotal?: (value: number) => string\n  /** Formats per-series values in the hover tooltip. Defaults to `formatTotal`. */\n  formatValue?: (value: number) => string\n  className?: string\n}\n\ninterface StackDatum {\n  __category: BarChartCategory\n  __values: Record<string, number>\n}\n\ninterface BarStackLayerProps<TDatum> {\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  seriesByKey: Map<string, BarChartSeries<TDatum>>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n  colorScale: ReturnType<typeof scaleOrdinal<string, string>>\n}\n\ninterface CategoryTicksProps {\n  ticks: BarChartCategory[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  formatCategory: (category: BarChartCategory) => string\n}\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst HOVER_FADE_MS = 200\nconst FOCUS_TRANSITION_MS = 180\nconst DEFAULT_HEIGHT = 220\nconst BAR_RADIUS = 2\nconst Y_AXIS_GUTTER = 34\n\nfunction buildBarPath(\n  x: number,\n  y: number,\n  width: number,\n  height: number,\n  radius: number,\n  roundTop: boolean,\n  roundBottom: boolean,\n) {\n  const r = Math.max(0, Math.min(radius, width / 2, height / 2))\n\n  if (r === 0 || (!roundTop && !roundBottom)) {\n    return `M ${x} ${y} H ${x + width} V ${y + height} H ${x} Z`\n  }\n\n  const tl = roundTop ? r : 0\n  const tr = roundTop ? r : 0\n  const br = roundBottom ? r : 0\n  const bl = roundBottom ? r : 0\n\n  return [\n    `M ${x + tl} ${y}`,\n    `H ${x + width - tr}`,\n    tr > 0\n      ? `Q ${x + width} ${y} ${x + width} ${y + tr}`\n      : `L ${x + width} ${y}`,\n    `V ${y + height - br}`,\n    br > 0\n      ? `Q ${x + width} ${y + height} ${x + width - br} ${y + height}`\n      : `L ${x + width} ${y + height}`,\n    `H ${x + bl}`,\n    bl > 0\n      ? `Q ${x} ${y + height} ${x} ${y + height - bl}`\n      : `L ${x} ${y + height}`,\n    `V ${y + tl}`,\n    tl > 0 ? `Q ${x} ${y} ${x + tl} ${y}` : `L ${x} ${y}`,\n    'Z',\n  ].join(' ')\n}\n\nfunction BarStackLayer<TDatum>({\n  stackData,\n  series,\n  seriesByKey,\n  xScale,\n  yScale,\n  colorScale,\n}: BarStackLayerProps<TDatum>) {\n  return (\n    <BarStack<StackDatum, string>\n      data={stackData}\n      keys={series.map((entry) => entry.key)}\n      x={(record) => record.__category}\n      value={(record, key) => record.__values[key] ?? 0}\n      xScale={xScale}\n      yScale={yScale}\n      color={colorScale}\n      offset=\"diverging\"\n    >\n      {(barStacks) =>\n        barStacks.map((barStack) =>\n          barStack.bars.map((bar) => {\n            const values = bar.bar.data.__values\n            const segmentValue = values[barStack.key] ?? 0\n\n            if (segmentValue === 0) {\n              return null\n            }\n\n            const seriesEntry = seriesByKey.get(barStack.key)\n            const strokeColor = seriesEntry?.color ?? bar.color\n            const fillColor = strokeColor\n\n            // Positive segments stack up from the baseline, negatives down.\n            // Round only the outermost corner of each side of the axis.\n            const positiveKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) > 0)\n            const negativeKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) < 0)\n            const roundTop =\n              segmentValue > 0 &&\n              positiveKeys[positiveKeys.length - 1] === barStack.key\n            const roundBottom =\n              segmentValue > 0\n                ? positiveKeys[0] === barStack.key\n                : negativeKeys[negativeKeys.length - 1] === barStack.key\n\n            // visx returns a signed height for below-baseline bars; normalize\n            // to a top-left origin with a positive height for the path.\n            const top = bar.height < 0 ? bar.y + bar.height : bar.y\n            const barHeight = Math.abs(bar.height)\n\n            return (\n              <path\n                key={`bar-${barStack.index}-${bar.index}`}\n                d={buildBarPath(\n                  bar.x,\n                  top,\n                  bar.width,\n                  Math.max(0, barHeight),\n                  BAR_RADIUS,\n                  roundTop,\n                  roundBottom,\n                )}\n                fill={fillColor}\n                stroke={strokeColor}\n                strokeWidth={1}\n                style={{ transition: 'fill 180ms ease' }}\n              />\n            )\n          }),\n        )\n      }\n    </BarStack>\n  )\n}\n\ninterface FocusBorderProps<TDatum> {\n  category: BarChartCategory\n  visible: boolean\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n}\n\nfunction FocusBorder<TDatum>({\n  category,\n  visible,\n  stackData,\n  series,\n  xScale,\n  yScale,\n}: FocusBorderProps<TDatum>) {\n  const x = xScale(category)\n  const datum = stackData.find((entry) => entry.__category === category)\n\n  if (x === undefined || !datum) {\n    return null\n  }\n\n  const hasAnyValue = series.some(\n    (entry) => (datum.__values[entry.key] ?? 0) !== 0,\n  )\n\n  if (!hasAnyValue) {\n    return null\n  }\n\n  const topY = PADDING_TOP\n  // Extend past the baseline to cover any below-axis (feed-in) segment.\n  const negativeSum = series.reduce(\n    (sum, entry) => sum + Math.min(0, datum.__values[entry.key] ?? 0),\n    0,\n  )\n  const bottomY = yScale(negativeSum)\n  const borderPaddingX = 4\n  const borderPaddingY = 3\n  const borderXRaw = x - borderPaddingX\n  const borderY = topY - borderPaddingY\n  const borderWidthRaw = xScale.bandwidth() + borderPaddingX * 2\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n  const borderX = Math.max(minX, borderXRaw)\n  const borderRight = Math.min(maxX, borderXRaw + borderWidthRaw)\n  const borderWidth = Math.max(0, borderRight - borderX)\n  const borderHeight = Math.max(1, bottomY - topY + borderPaddingY * 2)\n\n  if (borderWidth <= 0) {\n    return null\n  }\n\n  return (\n    <rect\n      x={borderX}\n      y={borderY}\n      width={borderWidth}\n      height={borderHeight}\n      rx={6}\n      fill=\"var(--spark-a2)\"\n      stroke=\"var(--spark-a9)\"\n      strokeWidth={2}\n      pointerEvents=\"none\"\n      style={{\n        opacity: visible ? 1 : 0,\n        transition: `x ${FOCUS_TRANSITION_MS}ms ease, y ${FOCUS_TRANSITION_MS}ms ease, width ${FOCUS_TRANSITION_MS}ms ease, height ${FOCUS_TRANSITION_MS}ms ease, opacity ${FOCUS_TRANSITION_MS}ms ease`,\n      }}\n    />\n  )\n}\n\ninterface InteractionLayerProps {\n  xDomain: BarChartCategory[]\n  activeCategories: Set<BarChartCategory>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  onHoverChange: (category: BarChartCategory | null) => void\n}\n\nfunction InteractionLayer({\n  xDomain,\n  activeCategories,\n  xScale,\n  height,\n  onHoverChange,\n}: InteractionLayerProps) {\n  const bandwidth = xScale.bandwidth()\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n\n  // A single overlay that maps the pointer to the nearest category with data,\n  // so there are no dead zones between/around bars to break the hover.\n  const handleMove = (\n    event: React.MouseEvent<SVGRectElement> | React.TouchEvent<SVGRectElement>,\n  ) => {\n    const point = localPoint(event)\n    if (!point) return\n\n    let nearest: BarChartCategory | null = null\n    let best = Infinity\n    for (const category of xDomain) {\n      if (!activeCategories.has(category)) continue\n      const x = xScale(category)\n      if (x === undefined) continue\n      const distance = Math.abs(x + bandwidth / 2 - point.x)\n      if (distance < best) {\n        best = distance\n        nearest = category\n      }\n    }\n\n    if (nearest !== null) onHoverChange(nearest)\n  }\n\n  return (\n    <rect\n      x={minX}\n      y={PADDING_TOP}\n      width={Math.max(0, maxX - minX)}\n      height={height - PADDING_TOP - PADDING_BOTTOM}\n      fill=\"transparent\"\n      onMouseMove={handleMove}\n      onMouseLeave={() => onHoverChange(null)}\n      onTouchMove={handleMove}\n      onTouchEnd={() => onHoverChange(null)}\n    />\n  )\n}\n\nfunction CategoryTicks({\n  ticks,\n  xScale,\n  height,\n  formatCategory,\n}: CategoryTicksProps) {\n  return (\n    <>\n      {ticks.map((category) => {\n        const x = xScale(category)\n\n        if (x === undefined) {\n          return null\n        }\n\n        return (\n          <text\n            key={`tick-${String(category)}`}\n            x={x + xScale.bandwidth() / 2}\n            y={height - PADDING_BOTTOM + 16}\n            textAnchor=\"middle\"\n            fill=\"var(--gray-a11)\"\n            fontSize={10}\n          >\n            {formatCategory(category)}\n          </text>\n        )\n      })}\n    </>\n  )\n}\n\nfunction defaultFormatTotal(value: number) {\n  return defaultTotalFormat.format(value)\n}\n\nexport function BarChart<TDatum>({\n  data,\n  series,\n  lines,\n  getCategory,\n  categories,\n  categoryTicks,\n  formatCategory = (category) => String(category),\n  formatTooltipCategory = formatCategory,\n  highlightedCategory,\n  showHighlightLine = false,\n  referenceLine,\n  title,\n  yAxisUnit,\n  height = DEFAULT_HEIGHT,\n  renderTotal,\n  formatTotal = defaultFormatTotal,\n  formatValue,\n  className,\n}: BarChartProps<TDatum>): React.ReactElement {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [width, setWidth] = useState(0)\n  const [hoveredCategory, setHoveredCategory] =\n    useState<BarChartCategory | null>(null)\n  const [trailingHoverLabel, setTrailingHoverLabel] = useState<string | null>(\n    null,\n  )\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () =>\n      new Set(\n        (lines ?? [])\n          .filter((line) => line.hiddenByDefault)\n          .map((line) => line.key),\n      ),\n  )\n\n  const toggleSeries = useCallback((id: string) => {\n    setHiddenSeries((prev) => {\n      const next = new Set(prev)\n      if (next.has(id)) {\n        next.delete(id)\n      } else {\n        next.add(id)\n      }\n      return next\n    })\n  }, [])\n\n  useEffect(() => {\n    const element = containerRef.current\n\n    if (!element) {\n      return\n    }\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n\n      if (!entry) {\n        return\n      }\n\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n\n    return () => {\n      resizeObserver.disconnect()\n    }\n  }, [])\n\n  const seriesByKey = useMemo(() => {\n    const map = new Map<string, BarChartSeries<TDatum>>()\n\n    for (const entry of series) {\n      map.set(entry.key, entry)\n    }\n\n    return map\n  }, [series])\n\n  const stackData = useMemo<StackDatum[]>(\n    () =>\n      data.map((datum) => {\n        const values: Record<string, number> = {}\n\n        for (const entry of series) {\n          values[entry.key] = hiddenSeries.has(entry.key)\n            ? 0\n            : entry.getValue(datum)\n        }\n\n        return { __category: getCategory(datum), __values: values }\n      }),\n    [data, getCategory, series, hiddenSeries],\n  )\n\n  const yMax = useMemo(\n    () =>\n      Math.max(\n        1,\n        referenceLine?.value ?? 0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.max(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [referenceLine, series, stackData],\n  )\n\n  // Most negative stack sum across buckets (0 when nothing dips below the axis).\n  const yMin = useMemo(\n    () =>\n      Math.min(\n        0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.min(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [series, stackData],\n  )\n\n  const xDomain = useMemo(\n    () => categories ?? stackData.map((record) => record.__category),\n    [categories, stackData],\n  )\n\n  const xScale = useMemo(\n    () =>\n      scaleBand<BarChartCategory>({\n        domain: xDomain,\n        range: [Y_AXIS_GUTTER, Math.max(Y_AXIS_GUTTER, width)],\n        padding: 0.32,\n      }),\n    [xDomain, width],\n  )\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [yMin, yMax],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [height, yMax, yMin],\n  )\n\n  const colorScale = useMemo(\n    () =>\n      scaleOrdinal<string, string>({\n        domain: series.map((entry) => entry.key),\n        range: series.map((entry) => entry.color),\n      }),\n    [series],\n  )\n\n  const linePaths = useMemo(() => {\n    if (!lines || width === 0) {\n      return []\n    }\n\n    return lines\n      .filter((line) => !hiddenSeries.has(line.key))\n      .map((line) => {\n        const lineScale = line.domain\n          ? scaleLinear<number>({\n              domain: line.domain,\n              range: [height - PADDING_BOTTOM, PADDING_TOP],\n            })\n          : yScale\n        const segments: string[] = []\n        let previous: { x: number; y: number } | null = null\n\n        for (const datum of data) {\n          const x = xScale(getCategory(datum))\n          const value = line.getValue(datum)\n\n          if (x === undefined || value === null || !Number.isFinite(value)) {\n            previous = null\n            continue\n          }\n\n          const point = {\n            x: x + xScale.bandwidth() / 2,\n            y: lineScale(value),\n          }\n          segments.push(\n            previous === null\n              ? `M ${point.x} ${point.y}`\n              : `L ${point.x} ${point.y}`,\n          )\n          previous = point\n        }\n\n        return {\n          key: line.key,\n          d: segments.join(' '),\n          color: line.color,\n          strokeDasharray: line.strokeDasharray ?? '5 4',\n        }\n      })\n      .filter((path) => path.d !== '')\n  }, [lines, hiddenSeries, data, getCategory, xScale, yScale, height, width])\n\n  const stackCategorySet = useMemo(\n    () => new Set(stackData.map((record) => record.__category)),\n    [stackData],\n  )\n\n  const lastFocusCategoryRef = useRef<BarChartCategory | null>(null)\n  if (hoveredCategory !== null) {\n    lastFocusCategoryRef.current = hoveredCategory\n  }\n  const focusCategory = lastFocusCategoryRef.current\n\n  const focused = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (stackData.find((record) => record.__category === hoveredCategory) ??\n          null),\n    [hoveredCategory, stackData],\n  )\n\n  // Below-baseline segments (feed-in) are context, not part of the headline\n  // sum, so the total counts only the positive stack (energy consumed).\n  const totalValue = useMemo(() => {\n    if (focused) {\n      return series.reduce(\n        (sum, entry) => sum + Math.max(0, focused.__values[entry.key] ?? 0),\n        0,\n      )\n    }\n\n    return stackData.reduce(\n      (sum, record) =>\n        sum +\n        series.reduce(\n          (s, entry) => s + Math.max(0, record.__values[entry.key] ?? 0),\n          0,\n        ),\n      0,\n    )\n  }, [focused, series, stackData])\n\n  const hoverLabel = focused ? formatTooltipCategory(focused.__category) : null\n\n  useEffect(() => {\n    if (hoverLabel) {\n      setTrailingHoverLabel(hoverLabel)\n      return\n    }\n\n    const timeoutId = window.setTimeout(() => {\n      setTrailingHoverLabel(null)\n    }, HOVER_FADE_MS)\n\n    return () => {\n      window.clearTimeout(timeoutId)\n    }\n  }, [hoverLabel])\n\n  const ticks = categoryTicks ?? xDomain\n  const yTicks = useMemo(() => buildYAxisScale(yMin, yMax).ticks, [yMin, yMax])\n  const highlightX = useMemo(() => {\n    if (!showHighlightLine || highlightedCategory === undefined) {\n      return null\n    }\n\n    const x = xScale(highlightedCategory)\n\n    if (x === undefined) {\n      return null\n    }\n\n    return x + xScale.bandwidth() / 2\n  }, [highlightedCategory, showHighlightLine, xScale])\n\n  const focusedDatum = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (data.find((datum) => getCategory(datum) === hoveredCategory) ??\n          null),\n    [hoveredCategory, data, getCategory],\n  )\n\n  // The bars don't depend on hover state, so memoize the layer: hovering\n  // across bars must not re-render (and re-stack) every bar path each move.\n  const barStackLayer = useMemo(\n    () => (\n      <BarStackLayer\n        stackData={stackData}\n        series={series}\n        seriesByKey={seriesByKey}\n        xScale={xScale}\n        yScale={yScale}\n        colorScale={colorScale}\n      />\n    ),\n    [stackData, series, seriesByKey, xScale, yScale, colorScale],\n  )\n\n  const fmtTooltipValue = formatValue ?? formatTotal\n  const tooltipRows: ChartTooltipRow[] = focused\n    ? [\n        ...series\n          .filter((entry) => (focused.__values[entry.key] ?? 0) !== 0)\n          .map((entry) => ({\n            key: entry.key,\n            label: entry.label,\n            color: entry.color,\n            value: fmtTooltipValue(Math.abs(focused.__values[entry.key] ?? 0)),\n          })),\n        ...(lines ?? [])\n          .filter((line) => !hiddenSeries.has(line.key))\n          .flatMap((line) => {\n            const value =\n              focusedDatum === null ? null : line.getValue(focusedDatum)\n\n            if (value === null || !Number.isFinite(value)) {\n              return []\n            }\n\n            return [\n              {\n                key: line.key,\n                label: line.label,\n                color: line.color,\n                value: (line.formatValue ?? fmtTooltipValue)(value),\n              },\n            ]\n          }),\n      ]\n    : []\n  const tooltipActive = tooltipRows.length > 0\n  const anchorX =\n    focusCategory !== null\n      ? (xScale(focusCategory) ?? 0) + xScale.bandwidth() / 2\n      : 0\n  const anchorY = yScale(totalValue)\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX,\n    anchorY,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col', className)}>\n      <div className=\"flex items-baseline justify-between\">\n        {title && <SectionTitle>{title}</SectionTitle>}\n        <span className=\"tabular-nums\">\n          {renderTotal ? (\n            renderTotal(totalValue, focused === null)\n          ) : (\n            <span className=\"text-base font-bold text-gray tabular-nums\">\n              {formatTotal(totalValue)}\n            </span>\n          )}\n        </span>\n      </div>\n\n      <div className=\"flex min-h-5 items-baseline justify-between gap-4\">\n        <SeriesLegend\n          items={[\n            ...series.map((entry) => ({\n              id: entry.key,\n              label: entry.label,\n              color: entry.color,\n            })),\n            ...(lines ?? []).map((line) => ({\n              id: line.key,\n              label: line.label,\n              color: line.color,\n              marker: 'dashed-line' as const,\n            })),\n          ]}\n          hiddenIds={hiddenSeries}\n          onToggle={toggleSeries}\n          className=\"gap-y-1\"\n        />\n        <span\n          className={cn(\n            'text-xs text-gray-light transition-opacity duration-200',\n            hoverLabel ? 'opacity-100' : 'opacity-0',\n          )}\n        >\n          {trailingHoverLabel ?? ' '}\n        </span>\n      </div>\n\n      <div\n        ref={containerRef}\n        className=\"relative mt-2 w-full\"\n        style={{ height }}\n      >\n        <div\n          ref={tooltipRef}\n          className=\"pointer-events-none absolute z-10\"\n          style={{\n            left: tooltipPos.left,\n            top: tooltipPos.top,\n            opacity: tooltipActive ? 1 : 0,\n            transition:\n              'left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out',\n          }}\n        >\n          {focusCategory !== null && (\n            <ChartTooltipCard\n              label={formatTooltipCategory(focusCategory)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={Y_AXIS_GUTTER}\n              y1={PADDING_TOP}\n              y2={height - PADDING_BOTTOM}\n              stroke=\"var(--gray-a6)\"\n              strokeWidth={1}\n            />\n\n            {yTicks.map((tick, index) => {\n              const y = yScale(tick)\n              const hideTickLabel =\n                yAxisUnit !== undefined && index === yTicks.length - 1\n\n              return (\n                <g key={`y-tick-${tick}`}>\n                  {!hideTickLabel && (\n                    <line\n                      x1={Y_AXIS_GUTTER - 4}\n                      x2={Y_AXIS_GUTTER}\n                      y1={y}\n                      y2={y}\n                      stroke=\"var(--gray-a8)\"\n                      strokeWidth={1}\n                    />\n                  )}\n                  {!hideTickLabel && (\n                    <text\n                      x={Y_AXIS_GUTTER - 7}\n                      y={y + 3}\n                      textAnchor=\"end\"\n                      fill=\"var(--gray-a11)\"\n                      fontSize={10}\n                    >\n                      {formatYAxisTick(tick)}\n                    </text>\n                  )}\n                </g>\n              )\n            })}\n\n            {yAxisUnit && (\n              <text\n                x={0}\n                y={PADDING_TOP - 6}\n                textAnchor=\"start\"\n                fill=\"var(--gray-a11)\"\n                fontSize={10}\n                fontWeight={600}\n              >\n                {yAxisUnit}\n              </text>\n            )}\n\n            {highlightX !== null && (\n              <line\n                x1={highlightX}\n                x2={highlightX}\n                y1={PADDING_TOP}\n                y2={height - PADDING_BOTTOM}\n                stroke=\"var(--spark-a9)\"\n                strokeWidth={1.5}\n                strokeDasharray=\"5 4\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={width}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--gray-a5)\"\n              strokeWidth={1}\n            />\n\n            <Group>\n              {focusCategory !== null && (\n                <FocusBorder\n                  category={focusCategory}\n                  visible={hoveredCategory !== null}\n                  stackData={stackData}\n                  series={series}\n                  xScale={xScale}\n                  yScale={yScale}\n                />\n              )}\n              {barStackLayer}\n\n              {referenceLine && (\n                <line\n                  x1={Y_AXIS_GUTTER}\n                  x2={width}\n                  y1={yScale(referenceLine.value)}\n                  y2={yScale(referenceLine.value)}\n                  stroke={referenceLine.color ?? 'var(--gray-a11)'}\n                  strokeWidth={1.5}\n                  pointerEvents=\"none\"\n                />\n              )}\n\n              {linePaths.map((path) => (\n                <path\n                  key={`line-${path.key}`}\n                  d={path.d}\n                  fill=\"none\"\n                  stroke={path.color}\n                  strokeWidth={1.5}\n                  strokeDasharray={path.strokeDasharray}\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  pointerEvents=\"none\"\n                />\n              ))}\n            </Group>\n\n            <InteractionLayer\n              xDomain={xDomain}\n              activeCategories={stackCategorySet}\n              xScale={xScale}\n              height={height}\n              onHoverChange={setHoveredCategory}\n            />\n\n            <CategoryTicks\n              ticks={ticks}\n              xScale={xScale}\n              height={height}\n              formatCategory={formatCategory}\n            />\n          </svg>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"bar-chart.js","names":[],"sources":["../../src/components/bar-chart.tsx"],"sourcesContent":["import { localPoint } from '@visx/event'\nimport { Group } from '@visx/group'\nimport { scaleBand, scaleLinear, scaleOrdinal } from '@visx/scale'\nimport { BarStack } from '@visx/shape'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { buildYAxisScale, formatYAxisTick } from '../utils/chart-scale'\nimport { cn } from '../utils/cn'\nimport { localeNumberFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend } from './series-legend'\nimport { SectionTitle } from './typography'\n\nconst defaultTotalFormat = localeNumberFormat()\n\nexport type BarChartCategory = string | number\n\nexport interface BarChartSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  hoverFill?: string\n  getValue: (datum: TDatum) => number\n}\n\nexport interface BarChartLineSeries<TDatum> {\n  key: string\n  label: string\n  color: string\n  /** `null` gaps break the line (e.g. hours without a reading). */\n  getValue: (datum: TDatum) => number | null\n  /** Own y-domain for this line (e.g. `[0, 100]` for a percentage). Defaults to the bar scale. */\n  domain?: [number, number]\n  /** Start hidden; the user can enable the line from the legend. */\n  hiddenByDefault?: boolean\n  /** Formats this line's value in the hover tooltip. Defaults to `formatValue`. */\n  formatValue?: (value: number) => string\n  strokeDasharray?: string\n}\n\nexport interface BarChartProps<TDatum> {\n  data: TDatum[]\n  series: BarChartSeries<TDatum>[]\n  /** Line overlays drawn on top of the bars, toggleable from the legend. */\n  lines?: BarChartLineSeries<TDatum>[]\n  getCategory: (datum: TDatum) => BarChartCategory\n  /** Full ordered set of categories on the x-axis. Defaults to `data.map(getCategory)`. */\n  categories?: BarChartCategory[]\n  /** Subset of categories that should render an x-axis label. Defaults to every category. */\n  categoryTicks?: BarChartCategory[]\n  formatCategory?: (category: BarChartCategory) => string\n  /** Formats the hovered category in the tooltip header. Defaults to `formatCategory`. */\n  formatTooltipCategory?: (category: BarChartCategory) => string\n  highlightedCategory?: BarChartCategory\n  showHighlightLine?: boolean\n  /**\n   * Horizontal reference line drawn across the plot at a given y-value.\n   * Useful for thresholds (e.g. price ceiling).\n   */\n  referenceLine?: { value: number; label?: string; color?: string }\n  title?: string\n  yAxisUnit?: string\n  height?: number\n  /**\n   * Override how the total value (sum of focused or all categories) is\n   * rendered. `animated` is false while a bar is focused (hover), so an\n   * animated total can snap between hovered buckets instead of re-firing a\n   * tween on every bar the pointer crosses.\n   */\n  renderTotal?: (value: number, animated: boolean) => React.ReactNode\n  /** Format function used when `renderTotal` is not provided. */\n  formatTotal?: (value: number) => string\n  /** Formats per-series values in the hover tooltip. Defaults to `formatTotal`. */\n  formatValue?: (value: number) => string\n  className?: string\n}\n\ninterface StackDatum {\n  __category: BarChartCategory\n  __values: Record<string, number>\n}\n\ninterface BarStackLayerProps<TDatum> {\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  seriesByKey: Map<string, BarChartSeries<TDatum>>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n  colorScale: ReturnType<typeof scaleOrdinal<string, string>>\n}\n\ninterface CategoryTicksProps {\n  ticks: BarChartCategory[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  formatCategory: (category: BarChartCategory) => string\n}\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst HOVER_FADE_MS = 200\nconst FOCUS_TRANSITION_MS = 180\nconst DEFAULT_HEIGHT = 220\nconst BAR_RADIUS = 2\nconst Y_AXIS_GUTTER = 34\n\nfunction buildBarPath(\n  x: number,\n  y: number,\n  width: number,\n  height: number,\n  radius: number,\n  roundTop: boolean,\n  roundBottom: boolean,\n) {\n  const r = Math.max(0, Math.min(radius, width / 2, height / 2))\n\n  if (r === 0 || (!roundTop && !roundBottom)) {\n    return `M ${x} ${y} H ${x + width} V ${y + height} H ${x} Z`\n  }\n\n  const tl = roundTop ? r : 0\n  const tr = roundTop ? r : 0\n  const br = roundBottom ? r : 0\n  const bl = roundBottom ? r : 0\n\n  return [\n    `M ${x + tl} ${y}`,\n    `H ${x + width - tr}`,\n    tr > 0\n      ? `Q ${x + width} ${y} ${x + width} ${y + tr}`\n      : `L ${x + width} ${y}`,\n    `V ${y + height - br}`,\n    br > 0\n      ? `Q ${x + width} ${y + height} ${x + width - br} ${y + height}`\n      : `L ${x + width} ${y + height}`,\n    `H ${x + bl}`,\n    bl > 0\n      ? `Q ${x} ${y + height} ${x} ${y + height - bl}`\n      : `L ${x} ${y + height}`,\n    `V ${y + tl}`,\n    tl > 0 ? `Q ${x} ${y} ${x + tl} ${y}` : `L ${x} ${y}`,\n    'Z',\n  ].join(' ')\n}\n\nfunction BarStackLayer<TDatum>({\n  stackData,\n  series,\n  seriesByKey,\n  xScale,\n  yScale,\n  colorScale,\n}: BarStackLayerProps<TDatum>) {\n  return (\n    <BarStack<StackDatum, string>\n      data={stackData}\n      keys={series.map((entry) => entry.key)}\n      x={(record) => record.__category}\n      value={(record, key) => record.__values[key] ?? 0}\n      xScale={xScale}\n      yScale={yScale}\n      color={colorScale}\n      offset=\"diverging\"\n    >\n      {(barStacks) =>\n        barStacks.map((barStack) =>\n          barStack.bars.map((bar) => {\n            const values = bar.bar.data.__values\n            const segmentValue = values[barStack.key] ?? 0\n\n            if (segmentValue === 0) {\n              return null\n            }\n\n            const seriesEntry = seriesByKey.get(barStack.key)\n            const strokeColor = seriesEntry?.color ?? bar.color\n            const fillColor = strokeColor\n\n            // Positive segments stack up from the baseline, negatives down.\n            // Round only the outermost corner of each side of the axis.\n            const positiveKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) > 0)\n            const negativeKeys = series\n              .map((entry) => entry.key)\n              .filter((key) => (values[key] ?? 0) < 0)\n            const roundTop =\n              segmentValue > 0 &&\n              positiveKeys[positiveKeys.length - 1] === barStack.key\n            const roundBottom =\n              segmentValue > 0\n                ? positiveKeys[0] === barStack.key\n                : negativeKeys[negativeKeys.length - 1] === barStack.key\n\n            // visx returns a signed height for below-baseline bars; normalize\n            // to a top-left origin with a positive height for the path.\n            const top = bar.height < 0 ? bar.y + bar.height : bar.y\n            const barHeight = Math.abs(bar.height)\n\n            return (\n              <path\n                key={`bar-${barStack.index}-${bar.index}`}\n                d={buildBarPath(\n                  bar.x,\n                  top,\n                  bar.width,\n                  Math.max(0, barHeight),\n                  BAR_RADIUS,\n                  roundTop,\n                  roundBottom,\n                )}\n                fill={fillColor}\n                stroke={strokeColor}\n                strokeWidth={1}\n                style={{ transition: 'fill 180ms ease' }}\n              />\n            )\n          }),\n        )\n      }\n    </BarStack>\n  )\n}\n\ninterface FocusBorderProps<TDatum> {\n  category: BarChartCategory\n  visible: boolean\n  stackData: StackDatum[]\n  series: BarChartSeries<TDatum>[]\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  yScale: ReturnType<typeof scaleLinear<number>>\n}\n\nfunction FocusBorder<TDatum>({\n  category,\n  visible,\n  stackData,\n  series,\n  xScale,\n  yScale,\n}: FocusBorderProps<TDatum>) {\n  const reducedMotion = useReducedMotion()\n  const x = xScale(category)\n  const datum = stackData.find((entry) => entry.__category === category)\n\n  if (x === undefined || !datum) {\n    return null\n  }\n\n  const hasAnyValue = series.some(\n    (entry) => (datum.__values[entry.key] ?? 0) !== 0,\n  )\n\n  if (!hasAnyValue) {\n    return null\n  }\n\n  const topY = PADDING_TOP\n  // Extend past the baseline to cover any below-axis (feed-in) segment.\n  const negativeSum = series.reduce(\n    (sum, entry) => sum + Math.min(0, datum.__values[entry.key] ?? 0),\n    0,\n  )\n  const bottomY = yScale(negativeSum)\n  const borderPaddingX = 4\n  const borderPaddingY = 3\n  const borderXRaw = x - borderPaddingX\n  const borderY = topY - borderPaddingY\n  const borderWidthRaw = xScale.bandwidth() + borderPaddingX * 2\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n  const borderX = Math.max(minX, borderXRaw)\n  const borderRight = Math.min(maxX, borderXRaw + borderWidthRaw)\n  const borderWidth = Math.max(0, borderRight - borderX)\n  const borderHeight = Math.max(1, bottomY - topY + borderPaddingY * 2)\n\n  if (borderWidth <= 0) {\n    return null\n  }\n\n  return (\n    <rect\n      x={borderX}\n      y={borderY}\n      width={borderWidth}\n      height={borderHeight}\n      rx={6}\n      fill=\"var(--spark-a2)\"\n      stroke=\"var(--spark-a9)\"\n      strokeWidth={2}\n      pointerEvents=\"none\"\n      style={{\n        opacity: visible ? 1 : 0,\n        transition: reducedMotion\n          ? `opacity ${FOCUS_TRANSITION_MS}ms ease`\n          : `x ${FOCUS_TRANSITION_MS}ms ease, y ${FOCUS_TRANSITION_MS}ms ease, width ${FOCUS_TRANSITION_MS}ms ease, height ${FOCUS_TRANSITION_MS}ms ease, opacity ${FOCUS_TRANSITION_MS}ms ease`,\n      }}\n    />\n  )\n}\n\ninterface InteractionLayerProps {\n  xDomain: BarChartCategory[]\n  activeCategories: Set<BarChartCategory>\n  xScale: ReturnType<typeof scaleBand<BarChartCategory>>\n  height: number\n  onHoverChange: (category: BarChartCategory | null) => void\n}\n\nfunction InteractionLayer({\n  xDomain,\n  activeCategories,\n  xScale,\n  height,\n  onHoverChange,\n}: InteractionLayerProps) {\n  const bandwidth = xScale.bandwidth()\n  const [rangeStart, rangeEnd] = xScale.range()\n  const minX = Math.min(rangeStart, rangeEnd)\n  const maxX = Math.max(rangeStart, rangeEnd)\n\n  // A single overlay that maps the pointer to the nearest category with data,\n  // so there are no dead zones between/around bars to break the hover.\n  const handleMove = (\n    event: React.MouseEvent<SVGRectElement> | React.TouchEvent<SVGRectElement>,\n  ) => {\n    const point = localPoint(event)\n    if (!point) return\n\n    let nearest: BarChartCategory | null = null\n    let best = Infinity\n    for (const category of xDomain) {\n      if (!activeCategories.has(category)) continue\n      const x = xScale(category)\n      if (x === undefined) continue\n      const distance = Math.abs(x + bandwidth / 2 - point.x)\n      if (distance < best) {\n        best = distance\n        nearest = category\n      }\n    }\n\n    if (nearest !== null) onHoverChange(nearest)\n  }\n\n  return (\n    <rect\n      x={minX}\n      y={PADDING_TOP}\n      width={Math.max(0, maxX - minX)}\n      height={height - PADDING_TOP - PADDING_BOTTOM}\n      fill=\"transparent\"\n      onMouseMove={handleMove}\n      onMouseLeave={() => onHoverChange(null)}\n      onTouchMove={handleMove}\n      onTouchEnd={() => onHoverChange(null)}\n    />\n  )\n}\n\nfunction CategoryTicks({\n  ticks,\n  xScale,\n  height,\n  formatCategory,\n}: CategoryTicksProps) {\n  return (\n    <>\n      {ticks.map((category) => {\n        const x = xScale(category)\n\n        if (x === undefined) {\n          return null\n        }\n\n        return (\n          <text\n            key={`tick-${String(category)}`}\n            x={x + xScale.bandwidth() / 2}\n            y={height - PADDING_BOTTOM + 16}\n            textAnchor=\"middle\"\n            fill=\"var(--neutral-a11)\"\n            fontSize={10}\n          >\n            {formatCategory(category)}\n          </text>\n        )\n      })}\n    </>\n  )\n}\n\nfunction defaultFormatTotal(value: number) {\n  return defaultTotalFormat.format(value)\n}\n\nexport function BarChart<TDatum>({\n  data,\n  series,\n  lines,\n  getCategory,\n  categories,\n  categoryTicks,\n  formatCategory = (category) => String(category),\n  formatTooltipCategory = formatCategory,\n  highlightedCategory,\n  showHighlightLine = false,\n  referenceLine,\n  title,\n  yAxisUnit,\n  height = DEFAULT_HEIGHT,\n  renderTotal,\n  formatTotal = defaultFormatTotal,\n  formatValue,\n  className,\n}: BarChartProps<TDatum>): React.ReactElement {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [width, setWidth] = useState(0)\n  const [hoveredCategory, setHoveredCategory] =\n    useState<BarChartCategory | null>(null)\n  const [trailingHoverLabel, setTrailingHoverLabel] = useState<string | null>(\n    null,\n  )\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () =>\n      new Set(\n        (lines ?? [])\n          .filter((line) => line.hiddenByDefault)\n          .map((line) => line.key),\n      ),\n  )\n\n  const toggleSeries = useCallback((id: string) => {\n    setHiddenSeries((prev) => {\n      const next = new Set(prev)\n      if (next.has(id)) {\n        next.delete(id)\n      } else {\n        next.add(id)\n      }\n      return next\n    })\n  }, [])\n\n  useEffect(() => {\n    const element = containerRef.current\n\n    if (!element) {\n      return\n    }\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n\n      if (!entry) {\n        return\n      }\n\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n\n    return () => {\n      resizeObserver.disconnect()\n    }\n  }, [])\n\n  const seriesByKey = useMemo(() => {\n    const map = new Map<string, BarChartSeries<TDatum>>()\n\n    for (const entry of series) {\n      map.set(entry.key, entry)\n    }\n\n    return map\n  }, [series])\n\n  const stackData = useMemo<StackDatum[]>(\n    () =>\n      data.map((datum) => {\n        const values: Record<string, number> = {}\n\n        for (const entry of series) {\n          values[entry.key] = hiddenSeries.has(entry.key)\n            ? 0\n            : entry.getValue(datum)\n        }\n\n        return { __category: getCategory(datum), __values: values }\n      }),\n    [data, getCategory, series, hiddenSeries],\n  )\n\n  const yMax = useMemo(\n    () =>\n      Math.max(\n        1,\n        referenceLine?.value ?? 0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.max(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [referenceLine, series, stackData],\n  )\n\n  // Most negative stack sum across buckets (0 when nothing dips below the axis).\n  const yMin = useMemo(\n    () =>\n      Math.min(\n        0,\n        ...stackData.map((record) =>\n          series.reduce(\n            (sum, entry) => sum + Math.min(0, record.__values[entry.key] ?? 0),\n            0,\n          ),\n        ),\n      ),\n    [series, stackData],\n  )\n\n  const xDomain = useMemo(\n    () => categories ?? stackData.map((record) => record.__category),\n    [categories, stackData],\n  )\n\n  const xScale = useMemo(\n    () =>\n      scaleBand<BarChartCategory>({\n        domain: xDomain,\n        range: [Y_AXIS_GUTTER, Math.max(Y_AXIS_GUTTER, width)],\n        padding: 0.32,\n      }),\n    [xDomain, width],\n  )\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [yMin, yMax],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [height, yMax, yMin],\n  )\n\n  const colorScale = useMemo(\n    () =>\n      scaleOrdinal<string, string>({\n        domain: series.map((entry) => entry.key),\n        range: series.map((entry) => entry.color),\n      }),\n    [series],\n  )\n\n  const linePaths = useMemo(() => {\n    if (!lines || width === 0) {\n      return []\n    }\n\n    return lines\n      .filter((line) => !hiddenSeries.has(line.key))\n      .map((line) => {\n        const lineScale = line.domain\n          ? scaleLinear<number>({\n              domain: line.domain,\n              range: [height - PADDING_BOTTOM, PADDING_TOP],\n            })\n          : yScale\n        const segments: string[] = []\n        let previous: { x: number; y: number } | null = null\n\n        for (const datum of data) {\n          const x = xScale(getCategory(datum))\n          const value = line.getValue(datum)\n\n          if (x === undefined || value === null || !Number.isFinite(value)) {\n            previous = null\n            continue\n          }\n\n          const point = {\n            x: x + xScale.bandwidth() / 2,\n            y: lineScale(value),\n          }\n          segments.push(\n            previous === null\n              ? `M ${point.x} ${point.y}`\n              : `L ${point.x} ${point.y}`,\n          )\n          previous = point\n        }\n\n        return {\n          key: line.key,\n          d: segments.join(' '),\n          color: line.color,\n          strokeDasharray: line.strokeDasharray ?? '5 4',\n        }\n      })\n      .filter((path) => path.d !== '')\n  }, [lines, hiddenSeries, data, getCategory, xScale, yScale, height, width])\n\n  const stackCategorySet = useMemo(\n    () => new Set(stackData.map((record) => record.__category)),\n    [stackData],\n  )\n\n  const lastFocusCategoryRef = useRef<BarChartCategory | null>(null)\n  if (hoveredCategory !== null) {\n    lastFocusCategoryRef.current = hoveredCategory\n  }\n  const focusCategory = lastFocusCategoryRef.current\n\n  const focused = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (stackData.find((record) => record.__category === hoveredCategory) ??\n          null),\n    [hoveredCategory, stackData],\n  )\n\n  // Below-baseline segments (feed-in) are context, not part of the headline\n  // sum, so the total counts only the positive stack (energy consumed).\n  const totalValue = useMemo(() => {\n    if (focused) {\n      return series.reduce(\n        (sum, entry) => sum + Math.max(0, focused.__values[entry.key] ?? 0),\n        0,\n      )\n    }\n\n    return stackData.reduce(\n      (sum, record) =>\n        sum +\n        series.reduce(\n          (s, entry) => s + Math.max(0, record.__values[entry.key] ?? 0),\n          0,\n        ),\n      0,\n    )\n  }, [focused, series, stackData])\n\n  const hoverLabel = focused ? formatTooltipCategory(focused.__category) : null\n\n  useEffect(() => {\n    if (hoverLabel) {\n      setTrailingHoverLabel(hoverLabel)\n      return\n    }\n\n    const timeoutId = window.setTimeout(() => {\n      setTrailingHoverLabel(null)\n    }, HOVER_FADE_MS)\n\n    return () => {\n      window.clearTimeout(timeoutId)\n    }\n  }, [hoverLabel])\n\n  const ticks = categoryTicks ?? xDomain\n  const yTicks = useMemo(() => buildYAxisScale(yMin, yMax).ticks, [yMin, yMax])\n  const highlightX = useMemo(() => {\n    if (!showHighlightLine || highlightedCategory === undefined) {\n      return null\n    }\n\n    const x = xScale(highlightedCategory)\n\n    if (x === undefined) {\n      return null\n    }\n\n    return x + xScale.bandwidth() / 2\n  }, [highlightedCategory, showHighlightLine, xScale])\n\n  const focusedDatum = useMemo(\n    () =>\n      hoveredCategory === null\n        ? null\n        : (data.find((datum) => getCategory(datum) === hoveredCategory) ??\n          null),\n    [hoveredCategory, data, getCategory],\n  )\n\n  // The bars don't depend on hover state, so memoize the layer: hovering\n  // across bars must not re-render (and re-stack) every bar path each move.\n  const barStackLayer = useMemo(\n    () => (\n      <BarStackLayer\n        stackData={stackData}\n        series={series}\n        seriesByKey={seriesByKey}\n        xScale={xScale}\n        yScale={yScale}\n        colorScale={colorScale}\n      />\n    ),\n    [stackData, series, seriesByKey, xScale, yScale, colorScale],\n  )\n\n  const fmtTooltipValue = formatValue ?? formatTotal\n  const tooltipRows: ChartTooltipRow[] = focused\n    ? [\n        ...series\n          .filter((entry) => (focused.__values[entry.key] ?? 0) !== 0)\n          .map((entry) => ({\n            key: entry.key,\n            label: entry.label,\n            color: entry.color,\n            value: fmtTooltipValue(Math.abs(focused.__values[entry.key] ?? 0)),\n          })),\n        ...(lines ?? [])\n          .filter((line) => !hiddenSeries.has(line.key))\n          .flatMap((line) => {\n            const value =\n              focusedDatum === null ? null : line.getValue(focusedDatum)\n\n            if (value === null || !Number.isFinite(value)) {\n              return []\n            }\n\n            return [\n              {\n                key: line.key,\n                label: line.label,\n                color: line.color,\n                value: (line.formatValue ?? fmtTooltipValue)(value),\n              },\n            ]\n          }),\n      ]\n    : []\n  const tooltipActive = tooltipRows.length > 0\n  const anchorX =\n    focusCategory !== null\n      ? (xScale(focusCategory) ?? 0) + xScale.bandwidth() / 2\n      : 0\n  const anchorY = yScale(totalValue)\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX,\n    anchorY,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col', className)}>\n      <div className=\"flex items-baseline justify-between\">\n        {title && <SectionTitle>{title}</SectionTitle>}\n        <span className=\"tabular-nums\">\n          {renderTotal ? (\n            renderTotal(totalValue, focused === null)\n          ) : (\n            <span className=\"text-base font-bold text-gray tabular-nums\">\n              {formatTotal(totalValue)}\n            </span>\n          )}\n        </span>\n      </div>\n\n      <div className=\"flex min-h-5 items-baseline justify-between gap-4\">\n        <SeriesLegend\n          items={[\n            ...series.map((entry) => ({\n              id: entry.key,\n              label: entry.label,\n              color: entry.color,\n            })),\n            ...(lines ?? []).map((line) => ({\n              id: line.key,\n              label: line.label,\n              color: line.color,\n              marker: 'dashed-line' as const,\n            })),\n          ]}\n          hiddenIds={hiddenSeries}\n          onToggle={toggleSeries}\n          className=\"gap-y-1\"\n        />\n        <span\n          className={cn(\n            'text-xs text-gray-light transition-opacity duration-200',\n            hoverLabel ? 'opacity-100' : 'opacity-0',\n          )}\n        >\n          {trailingHoverLabel ?? ' '}\n        </span>\n      </div>\n\n      <div\n        ref={containerRef}\n        className=\"relative mt-2 w-full\"\n        style={{ height }}\n      >\n        <div\n          ref={tooltipRef}\n          className=\"pointer-events-none absolute z-10\"\n          style={{\n            left: tooltipPos.left,\n            top: tooltipPos.top,\n            opacity: tooltipActive ? 1 : 0,\n            transition: reducedMotion\n              ? 'opacity 140ms ease-out'\n              : 'left 140ms ease-out, top 140ms ease-out, opacity 140ms ease-out',\n          }}\n        >\n          {focusCategory !== null && (\n            <ChartTooltipCard\n              label={formatTooltipCategory(focusCategory)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={Y_AXIS_GUTTER}\n              y1={PADDING_TOP}\n              y2={height - PADDING_BOTTOM}\n              stroke=\"var(--neutral-a6)\"\n              strokeWidth={1}\n            />\n\n            {yTicks.map((tick, index) => {\n              const y = yScale(tick)\n              const hideTickLabel =\n                yAxisUnit !== undefined && index === yTicks.length - 1\n\n              return (\n                <g key={`y-tick-${tick}`}>\n                  {!hideTickLabel && (\n                    <line\n                      x1={Y_AXIS_GUTTER - 4}\n                      x2={Y_AXIS_GUTTER}\n                      y1={y}\n                      y2={y}\n                      stroke=\"var(--neutral-a8)\"\n                      strokeWidth={1}\n                    />\n                  )}\n                  {!hideTickLabel && (\n                    <text\n                      x={Y_AXIS_GUTTER - 7}\n                      y={y + 3}\n                      textAnchor=\"end\"\n                      fill=\"var(--neutral-a11)\"\n                      fontSize={10}\n                    >\n                      {formatYAxisTick(tick)}\n                    </text>\n                  )}\n                </g>\n              )\n            })}\n\n            {yAxisUnit && (\n              <text\n                x={0}\n                y={PADDING_TOP - 6}\n                textAnchor=\"start\"\n                fill=\"var(--neutral-a11)\"\n                fontSize={10}\n                fontWeight={600}\n              >\n                {yAxisUnit}\n              </text>\n            )}\n\n            {highlightX !== null && (\n              <line\n                x1={highlightX}\n                x2={highlightX}\n                y1={PADDING_TOP}\n                y2={height - PADDING_BOTTOM}\n                stroke=\"var(--spark-a9)\"\n                strokeWidth={1.5}\n                strokeDasharray=\"5 4\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <line\n              x1={Y_AXIS_GUTTER}\n              x2={width}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--neutral-a5)\"\n              strokeWidth={1}\n            />\n\n            <Group>\n              {focusCategory !== null && (\n                <FocusBorder\n                  category={focusCategory}\n                  visible={hoveredCategory !== null}\n                  stackData={stackData}\n                  series={series}\n                  xScale={xScale}\n                  yScale={yScale}\n                />\n              )}\n              {barStackLayer}\n\n              {referenceLine && (\n                <line\n                  x1={Y_AXIS_GUTTER}\n                  x2={width}\n                  y1={yScale(referenceLine.value)}\n                  y2={yScale(referenceLine.value)}\n                  stroke={referenceLine.color ?? 'var(--neutral-a11)'}\n                  strokeWidth={1.5}\n                  pointerEvents=\"none\"\n                />\n              )}\n\n              {linePaths.map((path) => (\n                <path\n                  key={`line-${path.key}`}\n                  d={path.d}\n                  fill=\"none\"\n                  stroke={path.color}\n                  strokeWidth={1.5}\n                  strokeDasharray={path.strokeDasharray}\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  pointerEvents=\"none\"\n                />\n              ))}\n            </Group>\n\n            <InteractionLayer\n              xDomain={xDomain}\n              activeCategories={stackCategorySet}\n              xScale={xScale}\n              height={height}\n              onHoverChange={setHoveredCategory}\n            />\n\n            <CategoryTicks\n              ticks={ticks}\n              xScale={xScale}\n              height={height}\n              formatCategory={formatCategory}\n            />\n          </svg>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/battery-progress-row.cjs

@@ -6,7 +6,6 @@ const require_components_badge = require("./badge.cjs");
 const require_components_progress = require("./progress.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
-let class_variance_authority = require("class-variance-authority");
 let cnfast = require("cnfast");
 //#region src/components/battery-progress-row.tsx
 const BatteryProgressRowContext = (0, react.createContext)(null);
@@ -59,23 +58,18 @@ const BatteryProgressRowHeader = ({ className, ...rest }) => {
 		...rest
 	});
 };
-const stateBadgeToneVariants = (0, class_variance_authority.cva)("w-fit", {
-	variants: { tone: {
-		success: "bg-base-success-soft text-success",
-		warning: "bg-base-warning-soft text-warning",
-		error: "bg-base-error-soft text-error",
-		accent: "bg-base-accent-soft text-accent",
-		neutral: "bg-base-gray-soft text-gray-light"
-	} },
-	defaultVariants: { tone: "neutral" }
-});
-const BatteryProgressRowStateBadge = ({ className, children, tone, ...rest }) => {
+const toneToBadgeColor = {
+	success: "success",
+	warning: "warning",
+	error: "danger",
+	accent: "accent",
+	neutral: "neutral"
+};
+const BatteryProgressRowStateBadge = ({ className, children, tone = "neutral", ...rest }) => {
 	if (children === null || children === void 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_badge.Badge, {
-		className: stateBadgeToneVariants({
-			tone,
-			className
-		}),
+		color: toneToBadgeColor[tone],
+		className: (0, cnfast.cn)("w-fit", className),
 		...rest,
 		children
 	});

package/dist/components/battery-progress-row.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"battery-progress-row.cjs","names":["MaterialSymbol","Badge","Progress"],"sources":["../../src/components/battery-progress-row.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority'\nimport { createContext, useContext } from 'react'\nimport {\n  MaterialSymbol,\n  type MaterialSymbolIconName,\n} from '../icons/material-symbol'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\nimport { Badge } from './badge'\nimport { Progress } from './progress'\n\ninterface BatteryProgressRowContextValue {\n  soc: number\n}\n\nconst BatteryProgressRowContext =\n  createContext<BatteryProgressRowContextValue | null>(null)\n\nfunction useBatteryProgressRowContext() {\n  const context = useContext(BatteryProgressRowContext)\n  if (!context) {\n    throw new Error(\n      'BatteryProgressRow.* must be rendered inside <BatteryProgressRow>',\n    )\n  }\n  return context\n}\n\nconst BatteryProgressRow = ({\n  className,\n  soc,\n  children,\n  ...rest\n}: React.ComponentProps<'div'> & { soc: number }) => {\n  return (\n    <BatteryProgressRowContext.Provider value={{ soc }}>\n      <div className={cn('flex items-center gap-3', className)} {...rest}>\n        {children}\n      </div>\n    </BatteryProgressRowContext.Provider>\n  )\n}\n\n/**\n * Battery icon. Auto-selects its variant from the row's `soc`.\n *\n * @param className - Optional className to apply to the icon to further style it\n * @param icon - The icon to render (defaults to auto-selecting based on the row's `soc`)\n * @param ...rest - Additional props to pass to the span\n * @returns A React component that renders a battery icon\n */\nconst BatteryProgressRowIcon = ({\n  className,\n  icon: overrideIcon,\n  ...rest\n}: React.ComponentProps<'span'> & { icon?: MaterialSymbolIconName }) => {\n  const { soc } = useBatteryProgressRowContext()\n  const clampedSoc = Math.min(Math.max(soc, 0), 100)\n  const batteryLevel = Math.min(Math.floor(clampedSoc / (100 / 7)), 6)\n  const iconName: MaterialSymbolIconName =\n    clampedSoc === 100\n      ? 'battery_full'\n      : (`battery_${batteryLevel}_bar` as MaterialSymbolIconName)\n\n  return (\n    <span\n      className={cn(\n        'flex size-10 shrink-0 items-center justify-center rounded-xl bg-base-success-soft text-success',\n        className,\n      )}\n      {...rest}\n    >\n      <MaterialSymbol className=\"text-[18px]\" name={overrideIcon ?? iconName} />\n    </span>\n  )\n}\n\nconst BatteryProgressRowContent = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex min-w-0 flex-1 flex-col gap-1.5', className)}\n      {...rest}\n    />\n  )\n}\n\nconst BatteryProgressRowHeader = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex items-center justify-between gap-2', className)}\n      {...rest}\n    />\n  )\n}\n\nconst stateBadgeToneVariants = cva('w-fit', {\n  variants: {\n    tone: {\n      success: 'bg-base-success-soft text-success',\n      warning: 'bg-base-warning-soft text-warning',\n      error: 'bg-base-error-soft text-error',\n      accent: 'bg-base-accent-soft text-accent',\n      neutral: 'bg-base-gray-soft text-gray-light',\n    },\n  },\n  defaultVariants: {\n    tone: 'neutral',\n  },\n})\n\nconst BatteryProgressRowStateBadge = ({\n  className,\n  children,\n  tone,\n  ...rest\n}: React.ComponentProps<'span'> & { tone?: Tone }) => {\n  if (children === null || children === undefined) return null\n  return (\n    <Badge className={stateBadgeToneVariants({ tone, className })} {...rest}>\n      {children}\n    </Badge>\n  )\n}\n\nconst BatteryProgressRowChargingPower = ({\n  className,\n  children,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  if (children === null || children === undefined) return null\n  return (\n    <span\n      className={cn(\n        'ml-auto text-lg leading-tight font-bold text-gray tabular-nums',\n        className,\n      )}\n      {...rest}\n    >\n      {children}\n    </span>\n  )\n}\n\n/**\n * Linear progress bar bound to the row's `soc`.\n */\nconst BatteryProgressRowProgressBar = ({\n  className,\n  ...rest\n}: Omit<React.ComponentProps<typeof Progress>, 'value' | 'max'>) => {\n  const { soc } = useBatteryProgressRowContext()\n  return <Progress className={className} max={100} value={soc} {...rest} />\n}\n\nconst BatteryProgressRowFooter = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn(\n        'flex justify-between text-xs text-gray-light tabular-nums',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\nconst BatteryProgressRowMinSoc = ({\n  className,\n  children,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  if (children === null || children === undefined) return null\n  return (\n    <span className={cn(className)} {...rest}>\n      {children}\n    </span>\n  )\n}\n\n/**\n * Current state-of-charge label, rendered as `{soc}%`. Reads from context.\n */\nconst BatteryProgressRowSoc = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  const { soc } = useBatteryProgressRowContext()\n  return (\n    <span className={cn(className)} {...rest}>\n      {`${soc}%`}\n    </span>\n  )\n}\n\nexport {\n  BatteryProgressRow,\n  BatteryProgressRowIcon,\n  BatteryProgressRowContent,\n  BatteryProgressRowHeader,\n  BatteryProgressRowStateBadge,\n  BatteryProgressRowChargingPower,\n  BatteryProgressRowProgressBar,\n  BatteryProgressRowFooter,\n  BatteryProgressRowMinSoc,\n  BatteryProgressRowSoc,\n}\n"],"mappings":"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"}
+{"version":3,"file":"battery-progress-row.cjs","names":["MaterialSymbol","Badge","Progress"],"sources":["../../src/components/battery-progress-row.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport {\n  MaterialSymbol,\n  type MaterialSymbolIconName,\n} from '../icons/material-symbol'\nimport type { Tone } from '../lib/tones'\nimport { cn } from '../utils/cn'\nimport { Badge, type SparkBadgeColor } from './badge'\nimport { Progress } from './progress'\n\ninterface BatteryProgressRowContextValue {\n  soc: number\n}\n\nconst BatteryProgressRowContext =\n  createContext<BatteryProgressRowContextValue | null>(null)\n\nfunction useBatteryProgressRowContext() {\n  const context = useContext(BatteryProgressRowContext)\n  if (!context) {\n    throw new Error(\n      'BatteryProgressRow.* must be rendered inside <BatteryProgressRow>',\n    )\n  }\n  return context\n}\n\nconst BatteryProgressRow = ({\n  className,\n  soc,\n  children,\n  ...rest\n}: React.ComponentProps<'div'> & { soc: number }) => {\n  return (\n    <BatteryProgressRowContext.Provider value={{ soc }}>\n      <div className={cn('flex items-center gap-3', className)} {...rest}>\n        {children}\n      </div>\n    </BatteryProgressRowContext.Provider>\n  )\n}\n\n/**\n * Battery icon. Auto-selects its variant from the row's `soc`.\n *\n * @param className - Optional className to apply to the icon to further style it\n * @param icon - The icon to render (defaults to auto-selecting based on the row's `soc`)\n * @param ...rest - Additional props to pass to the span\n * @returns A React component that renders a battery icon\n */\nconst BatteryProgressRowIcon = ({\n  className,\n  icon: overrideIcon,\n  ...rest\n}: React.ComponentProps<'span'> & { icon?: MaterialSymbolIconName }) => {\n  const { soc } = useBatteryProgressRowContext()\n  const clampedSoc = Math.min(Math.max(soc, 0), 100)\n  const batteryLevel = Math.min(Math.floor(clampedSoc / (100 / 7)), 6)\n  const iconName: MaterialSymbolIconName =\n    clampedSoc === 100\n      ? 'battery_full'\n      : (`battery_${batteryLevel}_bar` as MaterialSymbolIconName)\n\n  return (\n    <span\n      className={cn(\n        'flex size-10 shrink-0 items-center justify-center rounded-xl bg-base-success-soft text-success',\n        className,\n      )}\n      {...rest}\n    >\n      <MaterialSymbol className=\"text-[18px]\" name={overrideIcon ?? iconName} />\n    </span>\n  )\n}\n\nconst BatteryProgressRowContent = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex min-w-0 flex-1 flex-col gap-1.5', className)}\n      {...rest}\n    />\n  )\n}\n\nconst BatteryProgressRowHeader = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn('flex items-center justify-between gap-2', className)}\n      {...rest}\n    />\n  )\n}\n\nconst toneToBadgeColor: Record<Tone, SparkBadgeColor> = {\n  success: 'success',\n  warning: 'warning',\n  error: 'danger',\n  accent: 'accent',\n  neutral: 'neutral',\n}\n\nconst BatteryProgressRowStateBadge = ({\n  className,\n  children,\n  tone = 'neutral',\n  ...rest\n}: Omit<React.ComponentProps<'span'>, 'color'> & { tone?: Tone }) => {\n  if (children === null || children === undefined) return null\n  return (\n    <Badge\n      color={toneToBadgeColor[tone]}\n      className={cn('w-fit', className)}\n      {...rest}\n    >\n      {children}\n    </Badge>\n  )\n}\n\nconst BatteryProgressRowChargingPower = ({\n  className,\n  children,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  if (children === null || children === undefined) return null\n  return (\n    <span\n      className={cn(\n        'ml-auto text-lg leading-tight font-bold text-gray tabular-nums',\n        className,\n      )}\n      {...rest}\n    >\n      {children}\n    </span>\n  )\n}\n\n/**\n * Linear progress bar bound to the row's `soc`.\n */\nconst BatteryProgressRowProgressBar = ({\n  className,\n  ...rest\n}: Omit<React.ComponentProps<typeof Progress>, 'value' | 'max'>) => {\n  const { soc } = useBatteryProgressRowContext()\n  return <Progress className={className} max={100} value={soc} {...rest} />\n}\n\nconst BatteryProgressRowFooter = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      className={cn(\n        'flex justify-between text-xs text-gray-light tabular-nums',\n        className,\n      )}\n      {...rest}\n    />\n  )\n}\n\nconst BatteryProgressRowMinSoc = ({\n  className,\n  children,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  if (children === null || children === undefined) return null\n  return (\n    <span className={cn(className)} {...rest}>\n      {children}\n    </span>\n  )\n}\n\n/**\n * Current state-of-charge label, rendered as `{soc}%`. Reads from context.\n */\nconst BatteryProgressRowSoc = ({\n  className,\n  ...rest\n}: React.ComponentProps<'span'>) => {\n  const { soc } = useBatteryProgressRowContext()\n  return (\n    <span className={cn(className)} {...rest}>\n      {`${soc}%`}\n    </span>\n  )\n}\n\nexport {\n  BatteryProgressRow,\n  BatteryProgressRowIcon,\n  BatteryProgressRowContent,\n  BatteryProgressRowHeader,\n  BatteryProgressRowStateBadge,\n  BatteryProgressRowChargingPower,\n  BatteryProgressRowProgressBar,\n  BatteryProgressRowFooter,\n  BatteryProgressRowMinSoc,\n  BatteryProgressRowSoc,\n}\n"],"mappings":"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"}

package/dist/components/battery-progress-row.d.cts

@@ -42,7 +42,7 @@ declare const BatteryProgressRowStateBadge: ({
   children,
   tone,
   ...rest
-}: React.ComponentProps<"span"> & {
+}: Omit<React.ComponentProps<"span">, "color"> & {
   tone?: Tone;
 }) => _$react_jsx_runtime0.JSX.Element | null;
 declare const BatteryProgressRowChargingPower: ({

package/dist/components/battery-progress-row.d.ts

@@ -1,7 +1,7 @@
 "use client";
 
 import { MaterialSymbolIconName } from "../icons/material-symbol.js";
-import { t as Tone } from "../tones-DyCkL71h.js";
+import { t as Tone } from "../tones-PXJGlSpe.js";
 import { Progress } from "./progress.js";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -42,7 +42,7 @@ declare const BatteryProgressRowStateBadge: ({
   children,
   tone,
   ...rest
-}: React.ComponentProps<"span"> & {
+}: Omit<React.ComponentProps<"span">, "color"> & {
   tone?: Tone;
 }) => _$react_jsx_runtime0.JSX.Element | null;
 declare const BatteryProgressRowChargingPower: ({