@epilot/spark-ui 0.20.1 → 0.20.2

package/dist/components/power-history-chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"power-history-chart.js","names":["React","valueFormat"],"sources":["../../src/components/power-history-chart.tsx"],"sourcesContent":["import { curveMonotoneX } from '@visx/curve'\nimport { localPoint } from '@visx/event'\nimport { scaleLinear } from '@visx/scale'\nimport { Area, LinePath } from '@visx/shape'\nimport { useTooltip } from '@visx/tooltip'\nimport { bisector } from '@visx/vendor/d3-array'\nimport * as React from 'react'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { useAnimatedChartDomain, useChartZoom } from '../hooks/use-chart-zoom'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { NARROW_NBSP } from '../utils/chars'\nimport {\n  buildYAxisScale,\n  formatYAxisTick,\n  measureYAxisGutter,\n} from '../utils/chart-scale'\nimport { buildTimeTicks } from '../utils/chart-time-ticks'\nimport type { TimeDomain } from '../utils/chart-zoom'\nimport { cn } from '../utils/cn'\nimport { twoDecimalFormat as valueFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  ChartZoomResetButton,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend, type SeriesLegendItem } from './series-legend'\nimport { SectionTitle } from './typography'\n\nexport interface PowerHistoryPoint {\n  /** Epoch milliseconds. */\n  t: number\n  solar: number\n  /** Signed: positive = import, negative = feed-in. */\n  grid: number\n  /** Signed: positive = discharge, negative = charge. */\n  battery: number\n  consumption: number\n}\n\nexport interface PowerHistoryChartProps {\n  data: PowerHistoryPoint[]\n  /** Axis/tooltip unit, e.g. \"kW\". */\n  unit: string\n  formatX: (t: number) => string\n  /** Tooltip time formatter. Defaults to `formatX`; use to keep the tooltip's\n   * full clock time when the axis ticks are compact (hour-only). */\n  formatTooltipX?: (t: number) => string\n  formatValue?: (value: number) => string\n  labels: {\n    solar: string\n    grid: string\n    battery: string\n    consumption: string\n  }\n  /** Series to drop entirely (no legend entry, area, or tooltip row). */\n  omitSeries?: readonly PowerHistorySeriesKey[]\n  /** Epoch ms to mark with the current-time dashed line (omit to hide). */\n  highlightAt?: number\n  title?: string\n  className?: string\n  height?: number\n  zoomable?: boolean\n  zoomResetLabel?: string\n  zoomDomain?: TimeDomain | null\n  onZoomDomainChange?: (domain: TimeDomain | null) => void\n}\n\nconst AREA_KEYS = ['solar', 'grid', 'battery'] as const\n\n// All toggleable series, in legend order. The areas (solar/grid/battery) plus\n// the consumption overlay line.\nconst SERIES_KEYS = ['solar', 'grid', 'battery', 'consumption'] as const\nexport type PowerHistorySeriesKey = (typeof SERIES_KEYS)[number]\ntype SeriesKey = PowerHistorySeriesKey\n\nconst SERIES_COLORS = {\n  solar: 'var(--orange-a9)',\n  grid: 'var(--blue-9)',\n  battery: 'var(--green-a9)',\n  consumption: 'var(--neutral-12)',\n} as const\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst PADDING_RIGHT = 8\nconst X_TICK_COUNT = 6\nconst DEFAULT_HEIGHT = 260\nconst DETAILED_X_AXIS_THRESHOLD = 6 * 60 * 60 * 1000\n\nconst tBisector = bisector<PowerHistoryPoint, number>((d) => d.t)\n\nfunction touchDistance(a: React.Touch, b: React.Touch): number {\n  return Math.hypot(a.clientX - b.clientX, a.clientY - b.clientY)\n}\n\nfunction touchMidpoint(\n  a: React.Touch,\n  b: React.Touch,\n): {\n  clientX: number\n  clientY: number\n} {\n  return {\n    clientX: (a.clientX + b.clientX) / 2,\n    clientY: (a.clientY + b.clientY) / 2,\n  }\n}\n\n/**\n * Diverging \"power sources\" area chart over a continuous time axis: solar\n * (orange), grid (blue) and battery (green) areas around a zero baseline, with\n * consumption overlaid as a line. Negative values (grid feed-in, battery\n * charging) dip below zero. For instantaneous power (day view). A legend at the\n * top toggles each series on/off; the y-axis rescales to the visible ones. visx.\n */\nexport function PowerHistoryChart({\n  data,\n  unit,\n  formatX,\n  formatTooltipX,\n  formatValue,\n  labels,\n  omitSeries,\n  highlightAt,\n  title,\n  className,\n  height = DEFAULT_HEIGHT,\n  zoomable = false,\n  zoomResetLabel,\n  zoomDomain,\n  onZoomDomainChange,\n}: PowerHistoryChartProps) {\n  const plotClipId = React.useId()\n  const fmtTooltipX = formatTooltipX ?? formatX\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [width, setWidth] = useState(0)\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () => new Set(),\n  )\n  const omitted = useMemo(() => new Set<SeriesKey>(omitSeries), [omitSeries])\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  const isHidden = useCallback(\n    (key: SeriesKey) => omitted.has(key) || hiddenSeries.has(key),\n    [hiddenSeries, omitted],\n  )\n\n  const {\n    showTooltip,\n    hideTooltip,\n    tooltipData,\n    tooltipLeft,\n    tooltipTop,\n    tooltipOpen,\n  } = useTooltip<PowerHistoryPoint>()\n\n  useEffect(() => {\n    const element = containerRef.current\n    if (!element) return\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n      if (!entry) return\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n    return () => resizeObserver.disconnect()\n  }, [])\n\n  const fmtValue = (value: number) =>\n    formatValue\n      ? formatValue(value)\n      : `${valueFormat.format(value)}${NARROW_NBSP}${unit}`\n\n  const tMin = data.length ? (data[0]?.t ?? 0) : 0\n  const tMax = data.length ? (data[data.length - 1]?.t ?? 0) : 0\n  const fullDomain = useMemo((): TimeDomain | null => {\n    if (data.length === 0) return null\n    return [tMin, tMax]\n  }, [data.length, tMin, tMax])\n\n  const zoom = useChartZoom({\n    enabled: zoomable,\n    fullDomain,\n    zoomDomain,\n    onZoomDomainChange,\n  })\n\n  const viewMin = zoom.zoomWindow?.[0] ?? tMin\n  const viewMax = zoom.zoomWindow?.[1] ?? tMax\n\n  const visibleData = useMemo(\n    () => data.filter((d) => d.t >= viewMin && d.t <= viewMax),\n    [data, viewMin, viewMax],\n  )\n\n  const { yMin, yMax } = useMemo(() => {\n    let min = 0\n    let max = 0\n    for (const d of visibleData) {\n      if (!isHidden('solar')) max = Math.max(max, d.solar)\n      if (!isHidden('consumption')) max = Math.max(max, d.consumption)\n      if (!isHidden('grid')) {\n        max = Math.max(max, d.grid)\n        min = Math.min(min, d.grid)\n      }\n      if (!isHidden('battery')) {\n        max = Math.max(max, d.battery)\n        min = Math.min(min, d.battery)\n      }\n    }\n    return { yMin: min, yMax: max }\n  }, [visibleData, isHidden])\n\n  const {\n    ticks: yTicks,\n    min: lo,\n    max: hi,\n  } = useMemo(() => buildYAxisScale(yMin, yMax), [yMin, yMax])\n  const displayedYDomain = useAnimatedChartDomain([lo, hi], {\n    animateChanges: zoom.isPinching,\n    reducedMotion,\n  })\n\n  const gutter = useMemo(\n    () => measureYAxisGutter(yTicks, formatYAxisTick),\n    [yTicks],\n  )\n\n  const plotRight = Math.max(gutter, width - PADDING_RIGHT)\n\n  const xScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [viewMin, viewMax === viewMin ? viewMin + 1 : viewMax],\n        range: [gutter, plotRight],\n      }),\n    [viewMin, viewMax, plotRight, gutter],\n  )\n\n  const plotHeight = Math.max(0, height - PADDING_BOTTOM - PADDING_TOP)\n  const plotWidth = Math.max(0, plotRight - gutter)\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [\n          displayedYDomain[0],\n          displayedYDomain[1] === displayedYDomain[0]\n            ? displayedYDomain[0] + 1\n            : displayedYDomain[1],\n        ],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [displayedYDomain, height],\n  )\n\n  const xTicks = useMemo(\n    () => buildTimeTicks(viewMin, viewMax, X_TICK_COUNT),\n    [viewMin, viewMax],\n  )\n  const formatAxisX =\n    zoom.isZoomed && viewMax - viewMin <= DETAILED_X_AXIS_THRESHOLD\n      ? fmtTooltipX\n      : formatX\n\n  const domainXFromEvent = useCallback(\n    (\n      event:\n        | React.MouseEvent<SVGRectElement>\n        | React.PointerEvent<SVGRectElement>\n        | React.TouchEvent<SVGRectElement>,\n    ) => {\n      const point = localPoint(event)\n      if (!point) return null\n      return xScale.invert(point.x)\n    },\n    [xScale],\n  )\n\n  const handleTooltip = useCallback(\n    (\n      event:\n        | React.TouchEvent<SVGRectElement>\n        | React.MouseEvent<SVGRectElement>,\n    ) => {\n      if (zoom.isBrushing || zoom.isPanning) return\n      const point = localPoint(event)\n      if (!point || data.length === 0) return\n\n      const xMs = xScale.invert(point.x)\n      const index = tBisector.left(data, xMs, 1)\n      const d0 = data[index - 1]\n      const d1 = data[index]\n      if (!d0) return\n\n      const d = d1 && xMs - d0.t > d1.t - xMs ? d1 : d0\n      showTooltip({\n        tooltipData: d,\n        tooltipLeft: xScale(d.t),\n        tooltipTop: PADDING_TOP,\n      })\n    },\n    [data, showTooltip, xScale, zoom.isBrushing, zoom.isPanning],\n  )\n\n  const legendItems: SeriesLegendItem[] = SERIES_KEYS.filter(\n    (key) => !omitted.has(key),\n  ).map((key) => ({\n    id: key,\n    label: labels[key],\n    color: SERIES_COLORS[key],\n  }))\n\n  const tooltipRows: ChartTooltipRow[] = tooltipData\n    ? SERIES_KEYS.filter((key) => !isHidden(key)).map((key) => ({\n        key,\n        label: labels[key],\n        color: SERIES_COLORS[key],\n        value: fmtValue(tooltipData[key]),\n      }))\n    : []\n\n  const showHighlight =\n    highlightAt !== undefined &&\n    highlightAt >= viewMin &&\n    highlightAt <= viewMax\n\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX: tooltipLeft ?? 0,\n    anchorY: tooltipTop ?? PADDING_TOP,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n    placement: 'beside',\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col gap-2', className)}>\n      {title && <SectionTitle>{title}</SectionTitle>}\n      <SeriesLegend\n        items={legendItems}\n        hiddenIds={hiddenSeries}\n        onToggle={toggleSeries}\n      />\n      <span className=\"px-1 text-xs text-gray-light\">{unit}</span>\n      <div ref={containerRef} className=\"relative w-full\" style={{ height }}>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <defs>\n              {AREA_KEYS.map((key) => (\n                <linearGradient\n                  key={key}\n                  id={`power-history-fill-${key}`}\n                  x1=\"0\"\n                  y1=\"0\"\n                  x2=\"0\"\n                  y2=\"1\"\n                >\n                  <stop\n                    offset=\"0%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.35}\n                  />\n                  <stop\n                    offset=\"100%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.04}\n                  />\n                </linearGradient>\n              ))}\n              <clipPath id={plotClipId}>\n                <rect\n                  height={plotHeight}\n                  width={plotWidth}\n                  x={gutter}\n                  y={PADDING_TOP}\n                />\n              </clipPath>\n            </defs>\n\n            {yTicks.map((tick) => {\n              const y = yScale(tick)\n              return (\n                <g key={`y-tick-${tick}`}>\n                  <line\n                    x1={gutter}\n                    x2={plotRight}\n                    y1={y}\n                    y2={y}\n                    stroke=\"var(--neutral-a4)\"\n                    strokeWidth={1}\n                  />\n                  <text\n                    x={gutter - 7}\n                    y={y + 3}\n                    textAnchor=\"end\"\n                    fill=\"var(--neutral-a11)\"\n                    fontSize={10}\n                  >\n                    {formatYAxisTick(tick)}\n                  </text>\n                </g>\n              )\n            })}\n\n            <g clipPath={`url(#${plotClipId})`} data-testid=\"chart-plot-clip\">\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <Area<PowerHistoryPoint>\n                  key={`area-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y0={yScale(0)}\n                  y1={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  fill={`url(#power-history-fill-${key})`}\n                  stroke=\"transparent\"\n                />\n              ))}\n\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <LinePath<PowerHistoryPoint>\n                  key={`line-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS[key]}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              ))}\n\n              {!isHidden('consumption') && (\n                <LinePath<PowerHistoryPoint>\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d.consumption)}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS.consumption}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              )}\n            </g>\n\n            <line\n              x1={gutter}\n              x2={plotRight}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--neutral-a6)\"\n              strokeWidth={1}\n            />\n\n            {showHighlight && (\n              <line\n                x1={xScale(highlightAt)}\n                x2={xScale(highlightAt)}\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            {xTicks.map((tick, index) => (\n              <text\n                key={`x-tick-${tick}`}\n                x={xScale(tick)}\n                y={height - PADDING_BOTTOM + 16}\n                textAnchor={\n                  index === 0\n                    ? 'start'\n                    : index === xTicks.length - 1\n                      ? 'end'\n                      : 'middle'\n                }\n                fill=\"var(--neutral-a11)\"\n                fontSize={10}\n              >\n                {formatAxisX(tick)}\n              </text>\n            ))}\n\n            {tooltipOpen &&\n              tooltipData &&\n              !zoom.isBrushing &&\n              !zoom.isPanning && (\n                <>\n                  <line\n                    x1={xScale(tooltipData.t)}\n                    x2={xScale(tooltipData.t)}\n                    y1={PADDING_TOP}\n                    y2={height - PADDING_BOTTOM}\n                    stroke=\"var(--neutral-a6)\"\n                    strokeDasharray=\"4 4\"\n                    pointerEvents=\"none\"\n                  />\n                  {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                    <circle\n                      key={`dot-${key}`}\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData[key])}\n                      r={3.5}\n                      fill={SERIES_COLORS[key]}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  ))}\n                  {!isHidden('consumption') && (\n                    <circle\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData.consumption)}\n                      r={3.5}\n                      fill={SERIES_COLORS.consumption}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  )}\n                </>\n              )}\n\n            {zoom.brushBand && (\n              <rect\n                data-testid=\"chart-brush-band\"\n                x={Math.min(\n                  xScale(zoom.brushBand[0]),\n                  xScale(zoom.brushBand[1]),\n                )}\n                y={PADDING_TOP}\n                width={Math.abs(\n                  xScale(zoom.brushBand[1]) - xScale(zoom.brushBand[0]),\n                )}\n                height={plotHeight}\n                fill=\"var(--spark-a4)\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <rect\n              x={gutter}\n              y={PADDING_TOP}\n              width={plotWidth}\n              height={plotHeight}\n              fill=\"transparent\"\n              style={zoomable ? { touchAction: 'pan-y' } : undefined}\n              onMouseLeave={() => {\n                if (!zoom.isBrushing) hideTooltip()\n              }}\n              onMouseMove={(event) => {\n                if (zoom.isBrushing) {\n                  const domainX = domainXFromEvent(event)\n                  if (domainX != null) zoom.onPointerMove(domainX)\n                  return\n                }\n                handleTooltip(event)\n              }}\n              onPointerDown={(event) => {\n                if (!zoomable || event.pointerType === 'touch') return\n                if (event.button !== 0) return\n                const domainX = domainXFromEvent(event)\n                if (domainX == null) return\n                event.currentTarget.setPointerCapture?.(event.pointerId)\n                hideTooltip()\n                zoom.onPointerDown(domainX)\n              }}\n              onPointerMove={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerMove(domainX)\n              }}\n              onPointerUp={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerUp(domainX)\n                else zoom.onPointerCancel()\n              }}\n              onPointerCancel={() => {\n                zoom.onPointerCancel()\n              }}\n              onDoubleClick={() => {\n                if (zoomable) zoom.onDoubleClick()\n              }}\n              onTouchStart={(event) => {\n                if (!zoomable) return\n                if (event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchStart(touchDistance(a, b), midpoint)\n                  hideTooltip()\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanStart({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  hideTooltip()\n                }\n              }}\n              onTouchMove={(event) => {\n                if (zoomable && event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchMove(touchDistance(a, b), midpoint)\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanMove({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  return\n                }\n                if (event.touches.length === 1) handleTooltip(event)\n              }}\n              onTouchEnd={(event) => {\n                if (zoomable && event.touches.length < 2) zoom.onPinchEnd()\n                if (event.touches.length === 0) {\n                  if (zoomable) zoom.onPanEnd()\n                  if (zoomable) zoom.onTap()\n                  hideTooltip()\n                }\n              }}\n              onTouchCancel={() => {\n                zoom.onPinchEnd()\n                zoom.onPanEnd()\n              }}\n            />\n          </svg>\n        )}\n\n        {zoom.isZoomed && zoomResetLabel && (\n          <ChartZoomResetButton\n            label={zoomResetLabel}\n            onReset={zoom.resetZoom}\n          />\n        )}\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:\n              tooltipOpen && tooltipData && !zoom.isPanning && !zoom.isBrushing\n                ? 1\n                : 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          {tooltipData && (\n            <ChartTooltipCard\n              label={fmtTooltipX(tooltipData.t)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"power-history-chart.js","names":["React","valueFormat"],"sources":["../../src/components/power-history-chart.tsx"],"sourcesContent":["import { curveMonotoneX } from '@visx/curve'\nimport { localPoint } from '@visx/event'\nimport { scaleLinear } from '@visx/scale'\nimport { Area, LinePath } from '@visx/shape'\nimport { useTooltip } from '@visx/tooltip'\nimport { bisector } from '@visx/vendor/d3-array'\nimport * as React from 'react'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { useAnimatedChartDomain, useChartZoom } from '../hooks/use-chart-zoom'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { NARROW_NBSP } from '../utils/chars'\nimport {\n  buildYAxisScale,\n  formatYAxisTick,\n  measureYAxisGutter,\n} from '../utils/chart-scale'\nimport { buildTimeTicks } from '../utils/chart-time-ticks'\nimport type { TimeDomain } from '../utils/chart-zoom'\nimport { cn } from '../utils/cn'\nimport { twoDecimalFormat as valueFormat } from '../utils/format'\nimport {\n  ChartTooltipCard,\n  type ChartTooltipRow,\n  ChartZoomResetButton,\n  clampTooltipPosition,\n  useMeasuredSize,\n} from './chart'\nimport { SeriesLegend, type SeriesLegendItem } from './series-legend'\nimport { SectionTitle } from './typography'\n\nexport interface PowerHistoryPoint {\n  /** Epoch milliseconds. */\n  t: number\n  solar: number\n  /** Signed: positive = import, negative = feed-in. */\n  grid: number\n  /** Signed: positive = discharge, negative = charge. */\n  battery: number\n  consumption: number\n}\n\nexport interface PowerHistoryChartProps {\n  data: PowerHistoryPoint[]\n  /** Axis/tooltip unit, e.g. \"kW\". */\n  unit: string\n  formatX: (t: number) => string\n  /** Tooltip time formatter. Defaults to `formatX`; use to keep the tooltip's\n   * full clock time when the axis ticks are compact (hour-only). */\n  formatTooltipX?: (t: number) => string\n  formatValue?: (value: number) => string\n  labels: {\n    solar: string\n    grid: string\n    battery: string\n    consumption: string\n  }\n  /** Series to drop entirely (no legend entry, area, or tooltip row). */\n  omitSeries?: readonly PowerHistorySeriesKey[]\n  /** Epoch ms to mark with the current-time dashed line (omit to hide). */\n  highlightAt?: number\n  title?: string\n  className?: string\n  height?: number\n  zoomable?: boolean\n  zoomResetLabel?: string\n  zoomDomain?: TimeDomain | null\n  onZoomDomainChange?: (domain: TimeDomain | null) => void\n}\n\nconst AREA_KEYS = ['solar', 'grid', 'battery'] as const\n\n// All toggleable series, in legend order. The areas (solar/grid/battery) plus\n// the consumption overlay line.\nconst SERIES_KEYS = ['solar', 'grid', 'battery', 'consumption'] as const\nexport type PowerHistorySeriesKey = (typeof SERIES_KEYS)[number]\ntype SeriesKey = PowerHistorySeriesKey\n\nconst SERIES_COLORS = {\n  solar: 'var(--orange-a9)',\n  grid: 'var(--blue-9)',\n  battery: 'var(--green-a9)',\n  consumption: 'var(--neutral-12)',\n} as const\n\nconst PADDING_TOP = 20\nconst PADDING_BOTTOM = 28\nconst PADDING_RIGHT = 8\nconst X_TICK_COUNT = 6\nconst DEFAULT_HEIGHT = 260\nconst DETAILED_X_AXIS_THRESHOLD = 6 * 60 * 60 * 1000\n\nconst tBisector = bisector<PowerHistoryPoint, number>((d) => d.t)\n\nfunction touchDistance(a: React.Touch, b: React.Touch): number {\n  return Math.hypot(a.clientX - b.clientX, a.clientY - b.clientY)\n}\n\nfunction touchMidpoint(\n  a: React.Touch,\n  b: React.Touch,\n): {\n  clientX: number\n  clientY: number\n} {\n  return {\n    clientX: (a.clientX + b.clientX) / 2,\n    clientY: (a.clientY + b.clientY) / 2,\n  }\n}\n\n/**\n * Diverging \"power sources\" area chart over a continuous time axis: solar\n * (orange), grid (blue) and battery (green) areas around a zero baseline, with\n * consumption overlaid as a line. Negative values (grid feed-in, battery\n * charging) dip below zero. For instantaneous power (day view). A legend at the\n * top toggles each series on/off; the y-axis rescales to the visible ones. visx.\n */\n// oxlint-disable-next-line eslint/complexity -- pre-existing; split it before adding branches\nexport function PowerHistoryChart({\n  data,\n  unit,\n  formatX,\n  formatTooltipX,\n  formatValue,\n  labels,\n  omitSeries,\n  highlightAt,\n  title,\n  className,\n  height = DEFAULT_HEIGHT,\n  zoomable = false,\n  zoomResetLabel,\n  zoomDomain,\n  onZoomDomainChange,\n}: PowerHistoryChartProps) {\n  const plotClipId = React.useId()\n  const fmtTooltipX = formatTooltipX ?? formatX\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [width, setWidth] = useState(0)\n  const [hiddenSeries, setHiddenSeries] = useState<ReadonlySet<string>>(\n    () => new Set(),\n  )\n  const omitted = useMemo(() => new Set<SeriesKey>(omitSeries), [omitSeries])\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  const isHidden = useCallback(\n    (key: SeriesKey) => omitted.has(key) || hiddenSeries.has(key),\n    [hiddenSeries, omitted],\n  )\n\n  const {\n    showTooltip,\n    hideTooltip,\n    tooltipData,\n    tooltipLeft,\n    tooltipTop,\n    tooltipOpen,\n  } = useTooltip<PowerHistoryPoint>()\n\n  useEffect(() => {\n    const element = containerRef.current\n    if (!element) return\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      const entry = entries[0]\n      if (!entry) return\n      setWidth(entry.contentRect.width)\n    })\n\n    resizeObserver.observe(element)\n    return () => resizeObserver.disconnect()\n  }, [])\n\n  const fmtValue = (value: number) =>\n    formatValue\n      ? formatValue(value)\n      : `${valueFormat.format(value)}${NARROW_NBSP}${unit}`\n\n  const tMin = data.length ? (data[0]?.t ?? 0) : 0\n  const tMax = data.length ? (data[data.length - 1]?.t ?? 0) : 0\n  const fullDomain = useMemo((): TimeDomain | null => {\n    if (data.length === 0) return null\n    return [tMin, tMax]\n  }, [data.length, tMin, tMax])\n\n  const zoom = useChartZoom({\n    enabled: zoomable,\n    fullDomain,\n    zoomDomain,\n    onZoomDomainChange,\n  })\n\n  const viewMin = zoom.zoomWindow?.[0] ?? tMin\n  const viewMax = zoom.zoomWindow?.[1] ?? tMax\n\n  const visibleData = useMemo(\n    () => data.filter((d) => d.t >= viewMin && d.t <= viewMax),\n    [data, viewMin, viewMax],\n  )\n\n  const { yMin, yMax } = useMemo(() => {\n    let min = 0\n    let max = 0\n    for (const d of visibleData) {\n      if (!isHidden('solar')) max = Math.max(max, d.solar)\n      if (!isHidden('consumption')) max = Math.max(max, d.consumption)\n      if (!isHidden('grid')) {\n        max = Math.max(max, d.grid)\n        min = Math.min(min, d.grid)\n      }\n      if (!isHidden('battery')) {\n        max = Math.max(max, d.battery)\n        min = Math.min(min, d.battery)\n      }\n    }\n    return { yMin: min, yMax: max }\n  }, [visibleData, isHidden])\n\n  const {\n    ticks: yTicks,\n    min: lo,\n    max: hi,\n  } = useMemo(() => buildYAxisScale(yMin, yMax), [yMin, yMax])\n  const displayedYDomain = useAnimatedChartDomain([lo, hi], {\n    animateChanges: zoom.isPinching,\n    reducedMotion,\n  })\n\n  const gutter = useMemo(\n    () => measureYAxisGutter(yTicks, formatYAxisTick),\n    [yTicks],\n  )\n\n  const plotRight = Math.max(gutter, width - PADDING_RIGHT)\n\n  const xScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [viewMin, viewMax === viewMin ? viewMin + 1 : viewMax],\n        range: [gutter, plotRight],\n      }),\n    [viewMin, viewMax, plotRight, gutter],\n  )\n\n  const plotHeight = Math.max(0, height - PADDING_BOTTOM - PADDING_TOP)\n  const plotWidth = Math.max(0, plotRight - gutter)\n\n  const yScale = useMemo(\n    () =>\n      scaleLinear<number>({\n        domain: [\n          displayedYDomain[0],\n          displayedYDomain[1] === displayedYDomain[0]\n            ? displayedYDomain[0] + 1\n            : displayedYDomain[1],\n        ],\n        range: [height - PADDING_BOTTOM, PADDING_TOP],\n      }),\n    [displayedYDomain, height],\n  )\n\n  const xTicks = useMemo(\n    () => buildTimeTicks(viewMin, viewMax, X_TICK_COUNT),\n    [viewMin, viewMax],\n  )\n  const formatAxisX =\n    zoom.isZoomed && viewMax - viewMin <= DETAILED_X_AXIS_THRESHOLD\n      ? fmtTooltipX\n      : formatX\n\n  const domainXFromEvent = useCallback(\n    (\n      event:\n        | React.MouseEvent<SVGRectElement>\n        | React.PointerEvent<SVGRectElement>\n        | React.TouchEvent<SVGRectElement>,\n    ) => {\n      const point = localPoint(event)\n      if (!point) return null\n      return xScale.invert(point.x)\n    },\n    [xScale],\n  )\n\n  const handleTooltip = useCallback(\n    (\n      event:\n        | React.TouchEvent<SVGRectElement>\n        | React.MouseEvent<SVGRectElement>,\n    ) => {\n      if (zoom.isBrushing || zoom.isPanning) return\n      const point = localPoint(event)\n      if (!point || data.length === 0) return\n\n      const xMs = xScale.invert(point.x)\n      const index = tBisector.left(data, xMs, 1)\n      const d0 = data[index - 1]\n      const d1 = data[index]\n      if (!d0) return\n\n      const d = d1 && xMs - d0.t > d1.t - xMs ? d1 : d0\n      showTooltip({\n        tooltipData: d,\n        tooltipLeft: xScale(d.t),\n        tooltipTop: PADDING_TOP,\n      })\n    },\n    [data, showTooltip, xScale, zoom.isBrushing, zoom.isPanning],\n  )\n\n  const legendItems: SeriesLegendItem[] = SERIES_KEYS.filter(\n    (key) => !omitted.has(key),\n  ).map((key) => ({\n    id: key,\n    label: labels[key],\n    color: SERIES_COLORS[key],\n  }))\n\n  const tooltipRows: ChartTooltipRow[] = tooltipData\n    ? SERIES_KEYS.filter((key) => !isHidden(key)).map((key) => ({\n        key,\n        label: labels[key],\n        color: SERIES_COLORS[key],\n        value: fmtValue(tooltipData[key]),\n      }))\n    : []\n\n  const showHighlight =\n    highlightAt !== undefined &&\n    highlightAt >= viewMin &&\n    highlightAt <= viewMax\n\n  const [tooltipRef, tooltipSize] = useMeasuredSize<HTMLDivElement>()\n  const tooltipPos = clampTooltipPosition({\n    anchorX: tooltipLeft ?? 0,\n    anchorY: tooltipTop ?? PADDING_TOP,\n    width,\n    height,\n    tipWidth: tooltipSize.width,\n    tipHeight: tooltipSize.height,\n    placement: 'beside',\n  })\n\n  return (\n    <div className={cn('flex w-full flex-col gap-2', className)}>\n      {title && <SectionTitle>{title}</SectionTitle>}\n      <SeriesLegend\n        items={legendItems}\n        hiddenIds={hiddenSeries}\n        onToggle={toggleSeries}\n      />\n      <span className=\"px-1 text-xs text-gray-light\">{unit}</span>\n      <div ref={containerRef} className=\"relative w-full\" style={{ height }}>\n        {width > 0 && (\n          <svg width={width} height={height}>\n            <defs>\n              {AREA_KEYS.map((key) => (\n                <linearGradient\n                  key={key}\n                  id={`power-history-fill-${key}`}\n                  x1=\"0\"\n                  y1=\"0\"\n                  x2=\"0\"\n                  y2=\"1\"\n                >\n                  <stop\n                    offset=\"0%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.35}\n                  />\n                  <stop\n                    offset=\"100%\"\n                    stopColor={SERIES_COLORS[key]}\n                    stopOpacity={0.04}\n                  />\n                </linearGradient>\n              ))}\n              <clipPath id={plotClipId}>\n                <rect\n                  height={plotHeight}\n                  width={plotWidth}\n                  x={gutter}\n                  y={PADDING_TOP}\n                />\n              </clipPath>\n            </defs>\n\n            {yTicks.map((tick) => {\n              const y = yScale(tick)\n              return (\n                <g key={`y-tick-${tick}`}>\n                  <line\n                    x1={gutter}\n                    x2={plotRight}\n                    y1={y}\n                    y2={y}\n                    stroke=\"var(--neutral-a4)\"\n                    strokeWidth={1}\n                  />\n                  <text\n                    x={gutter - 7}\n                    y={y + 3}\n                    textAnchor=\"end\"\n                    fill=\"var(--neutral-a11)\"\n                    fontSize={10}\n                  >\n                    {formatYAxisTick(tick)}\n                  </text>\n                </g>\n              )\n            })}\n\n            <g clipPath={`url(#${plotClipId})`} data-testid=\"chart-plot-clip\">\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <Area<PowerHistoryPoint>\n                  key={`area-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y0={yScale(0)}\n                  y1={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  fill={`url(#power-history-fill-${key})`}\n                  stroke=\"transparent\"\n                />\n              ))}\n\n              {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                <LinePath<PowerHistoryPoint>\n                  key={`line-${key}`}\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d[key])}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS[key]}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              ))}\n\n              {!isHidden('consumption') && (\n                <LinePath<PowerHistoryPoint>\n                  data={data}\n                  x={(d) => xScale(d.t)}\n                  y={(d) => yScale(d.consumption)}\n                  curve={curveMonotoneX}\n                  stroke={SERIES_COLORS.consumption}\n                  strokeWidth={1.5}\n                  fill=\"none\"\n                />\n              )}\n            </g>\n\n            <line\n              x1={gutter}\n              x2={plotRight}\n              y1={yScale(0)}\n              y2={yScale(0)}\n              stroke=\"var(--neutral-a6)\"\n              strokeWidth={1}\n            />\n\n            {showHighlight && (\n              <line\n                x1={xScale(highlightAt)}\n                x2={xScale(highlightAt)}\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            {xTicks.map((tick, index) => (\n              <text\n                key={`x-tick-${tick}`}\n                x={xScale(tick)}\n                y={height - PADDING_BOTTOM + 16}\n                textAnchor={\n                  index === 0\n                    ? 'start'\n                    : index === xTicks.length - 1\n                      ? 'end'\n                      : 'middle'\n                }\n                fill=\"var(--neutral-a11)\"\n                fontSize={10}\n              >\n                {formatAxisX(tick)}\n              </text>\n            ))}\n\n            {tooltipOpen &&\n              tooltipData &&\n              !zoom.isBrushing &&\n              !zoom.isPanning && (\n                <>\n                  <line\n                    x1={xScale(tooltipData.t)}\n                    x2={xScale(tooltipData.t)}\n                    y1={PADDING_TOP}\n                    y2={height - PADDING_BOTTOM}\n                    stroke=\"var(--neutral-a6)\"\n                    strokeDasharray=\"4 4\"\n                    pointerEvents=\"none\"\n                  />\n                  {AREA_KEYS.filter((key) => !isHidden(key)).map((key) => (\n                    <circle\n                      key={`dot-${key}`}\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData[key])}\n                      r={3.5}\n                      fill={SERIES_COLORS[key]}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  ))}\n                  {!isHidden('consumption') && (\n                    <circle\n                      cx={xScale(tooltipData.t)}\n                      cy={yScale(tooltipData.consumption)}\n                      r={3.5}\n                      fill={SERIES_COLORS.consumption}\n                      stroke=\"white\"\n                      strokeWidth={1.5}\n                      pointerEvents=\"none\"\n                    />\n                  )}\n                </>\n              )}\n\n            {zoom.brushBand && (\n              <rect\n                data-testid=\"chart-brush-band\"\n                x={Math.min(\n                  xScale(zoom.brushBand[0]),\n                  xScale(zoom.brushBand[1]),\n                )}\n                y={PADDING_TOP}\n                width={Math.abs(\n                  xScale(zoom.brushBand[1]) - xScale(zoom.brushBand[0]),\n                )}\n                height={plotHeight}\n                fill=\"var(--spark-a4)\"\n                pointerEvents=\"none\"\n              />\n            )}\n\n            <rect\n              x={gutter}\n              y={PADDING_TOP}\n              width={plotWidth}\n              height={plotHeight}\n              fill=\"transparent\"\n              style={zoomable ? { touchAction: 'pan-y' } : undefined}\n              onMouseLeave={() => {\n                if (!zoom.isBrushing) hideTooltip()\n              }}\n              onMouseMove={(event) => {\n                if (zoom.isBrushing) {\n                  const domainX = domainXFromEvent(event)\n                  if (domainX != null) zoom.onPointerMove(domainX)\n                  return\n                }\n                handleTooltip(event)\n              }}\n              onPointerDown={(event) => {\n                if (!zoomable || event.pointerType === 'touch') return\n                if (event.button !== 0) return\n                const domainX = domainXFromEvent(event)\n                if (domainX == null) return\n                event.currentTarget.setPointerCapture?.(event.pointerId)\n                hideTooltip()\n                zoom.onPointerDown(domainX)\n              }}\n              onPointerMove={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerMove(domainX)\n              }}\n              onPointerUp={(event) => {\n                if (!zoomable) return\n                const domainX = domainXFromEvent(event)\n                if (domainX != null) zoom.onPointerUp(domainX)\n                else zoom.onPointerCancel()\n              }}\n              onPointerCancel={() => {\n                zoom.onPointerCancel()\n              }}\n              onDoubleClick={() => {\n                if (zoomable) zoom.onDoubleClick()\n              }}\n              onTouchStart={(event) => {\n                if (!zoomable) return\n                if (event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchStart(touchDistance(a, b), midpoint)\n                  hideTooltip()\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanStart({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  hideTooltip()\n                }\n              }}\n              onTouchMove={(event) => {\n                if (zoomable && event.touches.length === 2) {\n                  const [a, b] = [event.touches[0], event.touches[1]]\n                  if (!a || !b) return\n                  const point = localPoint(\n                    event.currentTarget,\n                    touchMidpoint(a, b) as MouseEvent,\n                  )\n                  if (!point) return\n                  const midpoint = Math.min(\n                    1,\n                    Math.max(0, (point.x - gutter) / plotWidth),\n                  )\n                  zoom.onPinchMove(touchDistance(a, b), midpoint)\n                  return\n                }\n                if (event.touches.length === 1 && zoom.isZoomed) {\n                  const point = localPoint(event)\n                  if (!point) return\n                  zoom.onPanMove({\n                    x: (point.x - gutter) / plotWidth,\n                    y: (point.y - PADDING_TOP) / plotHeight,\n                  })\n                  return\n                }\n                if (event.touches.length === 1) handleTooltip(event)\n              }}\n              onTouchEnd={(event) => {\n                if (zoomable && event.touches.length < 2) zoom.onPinchEnd()\n                if (event.touches.length === 0) {\n                  if (zoomable) zoom.onPanEnd()\n                  if (zoomable) zoom.onTap()\n                  hideTooltip()\n                }\n              }}\n              onTouchCancel={() => {\n                zoom.onPinchEnd()\n                zoom.onPanEnd()\n              }}\n            />\n          </svg>\n        )}\n\n        {zoom.isZoomed && zoomResetLabel && (\n          <ChartZoomResetButton\n            label={zoomResetLabel}\n            onReset={zoom.resetZoom}\n          />\n        )}\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:\n              tooltipOpen && tooltipData && !zoom.isPanning && !zoom.isBrushing\n                ? 1\n                : 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          {tooltipData && (\n            <ChartTooltipCard\n              label={fmtTooltipX(tooltipData.t)}\n              rows={tooltipRows}\n            />\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/power-network.cjs

@@ -7,7 +7,7 @@ const require_components_number_flow = require("./number-flow.cjs");
 let react = require("react");
 let _epilot_spark_icons = require("@epilot/spark-icons");
 let react_jsx_runtime = require("react/jsx-runtime");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/power-network.tsx
 const SOURCE_VARIANTS = {
 	grid: {
@@ -261,7 +261,7 @@ function PowerNetworkDiagram({ title, loading = false, className, children }) {
 		value: contextValue,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			ref: containerRef,
-			className: (0, cnfast.cn)("@container relative flex flex-col", className),
+			className: (0, cn.cn)("@container relative flex flex-col", className),
 			children: [
 				title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_typography.SectionTitle, { children: title }),
 				connectorPaths.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
@@ -313,13 +313,13 @@ function PowerNetworkDiagram({ title, loading = false, className, children }) {
 }
 function PowerNetworkSources({ className, children }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: (0, cnfast.cn)("flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]", className),
+		className: (0, cn.cn)("flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]", className),
 		children
 	});
 }
 function PowerNetworkDevices({ className, children }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: (0, cnfast.cn)("flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]", className),
+		className: (0, cn.cn)("flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]", className),
 		children
 	});
 }
@@ -356,14 +356,14 @@ function PowerSource({ id: idProp, watts, icon, variant = "neutral", className,
 	const RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
 	const ringDash = clampedProgress != null ? clampedProgress / 100 * RING_CIRCUMFERENCE : 0;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, cnfast.cn)("flex flex-col items-center justify-center gap-1 transition-opacity duration-500", !isColored && "opacity-45", className),
+		className: (0, cn.cn)("flex flex-col items-center justify-center gap-1 transition-opacity duration-500", !isColored && "opacity-45", className),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_number_flow, {
 			value: Math.abs(watts),
 			suffix: "W",
 			className: "mt-1 text-sm leading-none font-medium"
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			ref: setElement,
-			className: (0, cnfast.cn)("relative flex aspect-square items-center justify-center rounded-full border p-4 shadow-sm", isColored ? variantStyles.activeClassName : "border-gray bg-gray-a3 shadow-gray-a4 saturate-0"),
+			className: (0, cn.cn)("relative flex aspect-square items-center justify-center rounded-full border p-4 shadow-sm", isColored ? variantStyles.activeClassName : "border-gray bg-gray-a3 shadow-gray-a4 saturate-0"),
 			children: [showRing && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
 				className: "pointer-events-none absolute inset-0 size-full -rotate-90",
 				viewBox: "0 0 100 100",
@@ -417,7 +417,7 @@ function PowerDevice({ id: idProp, watts, icon, className }) {
 	}, [unregister, id]);
 	if (loading) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DeviceSkeleton, { anchorRef: setElement });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, cnfast.cn)("flex flex-col items-center justify-center gap-1", className),
+		className: (0, cn.cn)("flex flex-col items-center justify-center gap-1", className),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			ref: setElement,
 			className: "flex aspect-square items-center justify-center rounded-full border border-gray bg-gray-a1 p-4",
@@ -511,7 +511,7 @@ function HomeSection({ anchorRef, autarky, className, watts }) {
 	}, [targetAutarky, reducedMotion]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		ref: anchorRef,
-		className: (0, cnfast.cn)("relative mx-auto size-[78px]", className),
+		className: (0, cn.cn)("relative mx-auto size-[78px]", className),
 		children: [autarky != null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
 			className: "absolute inset-0 size-full -rotate-90",
 			viewBox: `0 0 ${nodeSize} ${nodeSize}`,
@@ -545,7 +545,7 @@ function HomeSection({ anchorRef, autarky, className, watts }) {
 function HomeSkeleton({ anchorRef, className }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		ref: anchorRef,
-		className: (0, cnfast.cn)("mx-auto size-[78px] animate-pulse rounded-full border border-gray motion-reduce:animate-none", className)
+		className: (0, cn.cn)("mx-auto size-[78px] animate-pulse rounded-full border border-gray motion-reduce:animate-none", className)
 	});
 }
 //#endregion

package/dist/components/power-network.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"power-network.cjs","names":["useReducedMotion","SectionTitle","NumberFlow","Skeleton","Home"],"sources":["../../src/components/power-network.tsx"],"sourcesContent":["import { Home } from '@epilot/spark-icons'\nimport {\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { cn } from '../utils/cn'\nimport NumberFlow from './number-flow'\nimport { Skeleton } from './skeleton'\nimport { SectionTitle } from './typography'\n\n// --- Variants -----------------------------------------------------------\n\nexport type PowerSourceVariant = 'grid' | 'solar' | 'battery' | 'neutral'\n\ninterface SourceVariantStyles {\n  activeClassName: string\n  flowStroke: string\n  initialDashGap: number\n}\n\nconst SOURCE_VARIANTS: Record<PowerSourceVariant, SourceVariantStyles> = {\n  grid: {\n    activeClassName: 'border-blue-a9 bg-blue-a1 shadow-blue-a4',\n    flowStroke: 'var(--blue-11)',\n    initialDashGap: 10,\n  },\n  solar: {\n    activeClassName: 'border-orange-a9 bg-orange-a1 shadow-orange-a3',\n    flowStroke: 'var(--orange-a9)',\n    initialDashGap: 5,\n  },\n  battery: {\n    activeClassName: 'border-green-a9 bg-green-a1 shadow-green-a3',\n    flowStroke: 'var(--green-a9)',\n    initialDashGap: 7,\n  },\n  neutral: {\n    activeClassName: 'border-gray-a9 bg-gray-a1 shadow-gray-a3',\n    flowStroke: 'var(--neutral-a9)',\n    initialDashGap: 9,\n  },\n}\n\nconst DEVICE_FLOW_STROKE = 'var(--neutral-a9)'\nconst DEVICE_INITIAL_DASH_GAP = 9\n\n// Drawn under every connector and revealed when nothing flows, so a 0 W node\n// still reads as wired up and online rather than disconnected.\nconst IDLE_STROKE = 'var(--neutral-a6)'\nconst SKELETON_STROKE = 'var(--neutral-a6)'\nconst STROKE_WIDTH = 2\nconst STRAIGHT_TOLERANCE_PX = 3\nconst SOURCE_HOME_OFFSET_STEP_PX = 10\nconst DEVICE_HOME_OFFSET_STEP_PX = 10\n\n// --- Flow animation parameters ------------------------------------------\n\nconst FLOW_DASH_SOLID = 1\nconst FLOW_GAP_MAX = 14\nconst FLOW_GAP_MIN = 5\nconst FLOW_SPEED_MIN = 10\nconst FLOW_SPEED_MAX = 56\nconst FLOW_SMOOTHING = 5.5\n\ninterface FlowVisual {\n  gap: number\n  speed: number\n  opacity: number\n}\n\ninterface FlowAnimationState extends FlowVisual {\n  offset: number\n}\n\n// --- Context ------------------------------------------------------------\n\ntype NodeKind = 'source' | 'device' | 'home'\n\ninterface RegisteredNode {\n  id: string\n  kind: NodeKind\n  variant?: PowerSourceVariant\n  watts: number\n  element: HTMLDivElement | null\n}\n\ninterface PowerNetworkContextValue {\n  loading: boolean\n  register: (node: RegisteredNode) => void\n  unregister: (id: string) => void\n  totalSourceWatts: number\n}\n\nconst PowerNetworkContext = createContext<PowerNetworkContextValue | null>(null)\n\nfunction usePowerNetwork(): PowerNetworkContextValue {\n  const ctx = useContext(PowerNetworkContext)\n  if (!ctx) {\n    throw new Error(\n      'Power network sub-components must be used inside <PowerNetworkDiagram>.',\n    )\n  }\n  return ctx\n}\n\n// --- Geometry helpers ---------------------------------------------------\n\ninterface Point {\n  x: number\n  y: number\n}\n\nfunction anchorTop(rect: DOMRect, containerRect: DOMRect): Point {\n  return {\n    x: rect.left + rect.width / 2 - containerRect.left,\n    y: rect.top - containerRect.top,\n  }\n}\n\nfunction anchorBottom(rect: DOMRect, containerRect: DOMRect): Point {\n  return {\n    x: rect.left + rect.width / 2 - containerRect.left,\n    y: rect.bottom - containerRect.top,\n  }\n}\n\nfunction buildAdaptivePath(from: Point, to: Point): string {\n  if (Math.abs(from.x - to.x) < STRAIGHT_TOLERANCE_PX) {\n    return `M ${from.x} ${from.y} L ${to.x} ${to.y}`\n  }\n  const dy = to.y - from.y\n  const c1y = from.y + dy * 0.56\n  const c2y = to.y - dy * 0.58\n  return `M ${from.x} ${from.y} C ${from.x} ${c1y} ${to.x} ${c2y} ${to.x} ${to.y}`\n}\n\n// --- PowerNetworkDiagram ------------------------------------------------\n\nexport interface PowerNetworkDiagramProps {\n  title?: string\n  loading?: boolean\n  className?: string\n  children?: ReactNode\n}\n\ninterface ConnectorPath {\n  id: string\n  d: string\n  kind: NodeKind\n  variant?: PowerSourceVariant\n  reversed: boolean\n}\n\nfunction connectorPathsEqual(a: ConnectorPath[], b: ConnectorPath[]): boolean {\n  if (a.length !== b.length) return false\n  for (let i = 0; i < a.length; i++) {\n    const ap = a[i]\n    const bp = b[i]\n    if (!ap || !bp) return false\n    if (\n      ap.id !== bp.id ||\n      ap.d !== bp.d ||\n      ap.variant !== bp.variant ||\n      ap.kind !== bp.kind ||\n      ap.reversed !== bp.reversed\n    ) {\n      return false\n    }\n  }\n  return true\n}\n\nexport function PowerNetworkDiagram({\n  title,\n  loading = false,\n  className,\n  children,\n}: PowerNetworkDiagramProps): ReactElement {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [nodes, setNodes] = useState<Map<string, RegisteredNode>>(\n    () => new Map(),\n  )\n  const [connectorPaths, setConnectorPaths] = useState<ConnectorPath[]>([])\n  const connectorPathsRef = useRef<ConnectorPath[]>([])\n  const flowPathRefs = useRef<Record<string, SVGPathElement | null>>({})\n  const idlePathRefs = useRef<Record<string, SVGPathElement | null>>({})\n  const currentFlowVisualsRef = useRef<Record<string, FlowAnimationState>>({})\n  const targetFlowVisualsRef = useRef<Record<string, FlowVisual>>({})\n\n  const register = useCallback((node: RegisteredNode) => {\n    setNodes((prev) => {\n      const existing = prev.get(node.id)\n      if (\n        existing &&\n        existing.kind === node.kind &&\n        existing.variant === node.variant &&\n        existing.watts === node.watts &&\n        existing.element === node.element\n      ) {\n        return prev\n      }\n      const next = new Map(prev)\n      next.set(node.id, node)\n      return next\n    })\n  }, [])\n\n  const unregister = useCallback((id: string) => {\n    setNodes((prev) => {\n      if (!prev.has(id)) return prev\n      const next = new Map(prev)\n      next.delete(id)\n      return next\n    })\n  }, [])\n\n  const totalSourceWatts = useMemo(() => {\n    let total = 0\n    for (const node of nodes.values()) {\n      if (node.kind === 'source') total += node.watts\n    }\n    return total\n  }, [nodes])\n\n  useEffect(() => {\n    const container = containerRef.current\n    if (!container) return\n\n    let homeNode: RegisteredNode | undefined\n    const sources: RegisteredNode[] = []\n    const devices: RegisteredNode[] = []\n    for (const node of nodes.values()) {\n      if (node.kind === 'home') {\n        homeNode = node\n      } else if (node.element) {\n        if (node.kind === 'source') sources.push(node)\n        else devices.push(node)\n      }\n    }\n\n    const updatePaths = () => {\n      if (!homeNode || !homeNode.element) {\n        setConnectorPaths((prev) => (prev.length === 0 ? prev : []))\n        return\n      }\n      const containerRect = container.getBoundingClientRect()\n      const homeRect = homeNode.element.getBoundingClientRect()\n      const homeTop = anchorTop(homeRect, containerRect)\n      const homeBottom = anchorBottom(homeRect, containerRect)\n      const next: ConnectorPath[] = []\n\n      const sourceCount = sources.length\n      const deviceCount = devices.length\n\n      sources.forEach((source, index) => {\n        if (!source.element) return\n        const from = anchorBottom(\n          source.element.getBoundingClientRect(),\n          containerRect,\n        )\n        const offsetX =\n          SOURCE_HOME_OFFSET_STEP_PX * (index - (sourceCount - 1) / 2)\n        const to = { x: homeTop.x + offsetX, y: homeTop.y }\n        next.push({\n          id: source.id,\n          d: buildAdaptivePath(from, to),\n          kind: 'source',\n          variant: source.variant,\n          reversed: source.watts < 0,\n        })\n      })\n\n      devices.forEach((device, index) => {\n        if (!device.element) return\n        const to = anchorTop(\n          device.element.getBoundingClientRect(),\n          containerRect,\n        )\n        const offsetX =\n          DEVICE_HOME_OFFSET_STEP_PX * (index - (deviceCount - 1) / 2)\n        const from = { x: homeBottom.x + offsetX, y: homeBottom.y }\n        next.push({\n          id: device.id,\n          d: buildAdaptivePath(from, to),\n          kind: 'device',\n          reversed: false,\n        })\n      })\n\n      setConnectorPaths((prev) =>\n        connectorPathsEqual(prev, next) ? prev : next,\n      )\n    }\n\n    updatePaths()\n\n    const resizeObserver = new ResizeObserver(updatePaths)\n    resizeObserver.observe(container)\n    for (const node of nodes.values()) {\n      if (node.element) resizeObserver.observe(node.element)\n    }\n    window.addEventListener('resize', updatePaths)\n\n    return () => {\n      resizeObserver.disconnect()\n      window.removeEventListener('resize', updatePaths)\n    }\n  }, [nodes])\n\n  useEffect(() => {\n    connectorPathsRef.current = connectorPaths\n  }, [connectorPaths])\n\n  useEffect(() => {\n    const targets: Record<string, FlowVisual> = {}\n    const homeWatts = totalSourceWatts\n    for (const node of nodes.values()) {\n      if (node.kind === 'home') continue\n      const watts = node.watts\n      const relative =\n        homeWatts > 0\n          ? Math.max(0, Math.min(1, Math.abs(watts) / homeWatts))\n          : 0\n      targets[node.id] = {\n        gap: FLOW_GAP_MAX - (FLOW_GAP_MAX - FLOW_GAP_MIN) * relative,\n        speed: FLOW_SPEED_MIN + (FLOW_SPEED_MAX - FLOW_SPEED_MIN) * relative,\n        opacity: Math.abs(watts) > 0 ? 1 : 0,\n      }\n    }\n    targetFlowVisualsRef.current = targets\n  }, [nodes, totalSourceWatts])\n\n  useEffect(() => {\n    if (loading || reducedMotion) return\n    let frameId = 0\n    let lastFrameTime = performance.now()\n\n    const animate = (now: number) => {\n      const deltaSeconds = Math.max(0.001, (now - lastFrameTime) / 1000)\n      lastFrameTime = now\n      const smoothing = 1 - Math.exp(-FLOW_SMOOTHING * deltaSeconds)\n\n      for (const connectorPath of connectorPathsRef.current) {\n        const id = connectorPath.id\n        const target = targetFlowVisualsRef.current[id]\n        const pathElement = flowPathRefs.current[id]\n        if (!target || !pathElement) continue\n\n        const current = currentFlowVisualsRef.current[id] ?? {\n          gap: target.gap,\n          offset: 0,\n          speed: target.speed,\n          opacity: target.opacity,\n        }\n\n        current.gap += (target.gap - current.gap) * smoothing\n        current.speed += (target.speed - current.speed) * smoothing\n        current.opacity += (target.opacity - current.opacity) * smoothing\n\n        const dashCycle = FLOW_DASH_SOLID + Math.max(0.001, current.gap)\n        const direction = connectorPath.reversed ? 1 : -1\n        const nextOffset =\n          current.offset + direction * current.speed * deltaSeconds\n        const wrappedOffset = ((nextOffset % dashCycle) + dashCycle) % dashCycle\n        current.offset = wrappedOffset - dashCycle\n\n        pathElement.setAttribute(\n          'stroke-dasharray',\n          `${FLOW_DASH_SOLID} ${current.gap.toFixed(3)}`,\n        )\n        pathElement.setAttribute('stroke-dashoffset', current.offset.toFixed(3))\n        pathElement.setAttribute('opacity', current.opacity.toFixed(3))\n        idlePathRefs.current[id]?.setAttribute(\n          'opacity',\n          (1 - current.opacity).toFixed(3),\n        )\n\n        currentFlowVisualsRef.current[id] = current\n      }\n\n      frameId = window.requestAnimationFrame(animate)\n    }\n\n    frameId = window.requestAnimationFrame(animate)\n    return () => window.cancelAnimationFrame(frameId)\n  }, [loading, reducedMotion])\n\n  // Reduced motion: freeze the marching dashes but keep the dash gap tracking\n  // live magnitude, and let opacity fade in/out via the CSS transition on each\n  // flow path (see the flow <path> style below).\n  useEffect(() => {\n    if (loading || !reducedMotion) return\n    for (const connectorPath of connectorPathsRef.current) {\n      const target = targetFlowVisualsRef.current[connectorPath.id]\n      const pathElement = flowPathRefs.current[connectorPath.id]\n      if (!target || !pathElement) continue\n      pathElement.setAttribute(\n        'stroke-dasharray',\n        `${FLOW_DASH_SOLID} ${target.gap.toFixed(3)}`,\n      )\n      pathElement.setAttribute('stroke-dashoffset', '0')\n      pathElement.setAttribute('opacity', target.opacity.toFixed(3))\n      idlePathRefs.current[connectorPath.id]?.setAttribute(\n        'opacity',\n        (1 - target.opacity).toFixed(3),\n      )\n    }\n  }, [loading, reducedMotion, nodes, totalSourceWatts])\n\n  const contextValue = useMemo<PowerNetworkContextValue>(\n    () => ({ loading, register, unregister, totalSourceWatts }),\n    [loading, register, unregister, totalSourceWatts],\n  )\n\n  return (\n    <PowerNetworkContext.Provider value={contextValue}>\n      <div\n        ref={containerRef}\n        className={cn('@container relative flex flex-col', className)}\n      >\n        {title && <SectionTitle>{title}</SectionTitle>}\n        {connectorPaths.length > 0 && (\n          <svg className=\"pointer-events-none absolute inset-0 size-full\">\n            {connectorPaths.map((path) => {\n              if (loading) {\n                return (\n                  <path\n                    key={path.id}\n                    d={path.d}\n                    fill=\"none\"\n                    stroke={SKELETON_STROKE}\n                    strokeWidth={STROKE_WIDTH}\n                    strokeLinecap=\"round\"\n                  />\n                )\n              }\n\n              const flowStroke =\n                path.kind === 'source' && path.variant\n                  ? SOURCE_VARIANTS[path.variant].flowStroke\n                  : DEVICE_FLOW_STROKE\n              const initialDashGap =\n                path.kind === 'source' && path.variant\n                  ? SOURCE_VARIANTS[path.variant].initialDashGap\n                  : DEVICE_INITIAL_DASH_GAP\n\n              return (\n                <g key={path.id}>\n                  <path\n                    d={path.d}\n                    fill=\"none\"\n                    stroke={IDLE_STROKE}\n                    strokeWidth={STROKE_WIDTH}\n                    strokeLinecap=\"round\"\n                    ref={(el) => {\n                      idlePathRefs.current[path.id] = el\n                    }}\n                    opacity={1}\n                    style={\n                      reducedMotion\n                        ? { transition: 'opacity 300ms ease' }\n                        : undefined\n                    }\n                  />\n                  <path\n                    d={path.d}\n                    fill=\"none\"\n                    stroke={flowStroke}\n                    strokeWidth={STROKE_WIDTH}\n                    strokeLinecap=\"round\"\n                    ref={(el) => {\n                      flowPathRefs.current[path.id] = el\n                    }}\n                    strokeDasharray={`${FLOW_DASH_SOLID} ${initialDashGap}`}\n                    strokeDashoffset={0}\n                    opacity={0}\n                    style={\n                      reducedMotion\n                        ? { transition: 'opacity 300ms ease' }\n                        : undefined\n                    }\n                  />\n                </g>\n              )\n            })}\n          </svg>\n        )}\n        <div className=\"flex flex-col gap-y-14\">{children}</div>\n      </div>\n    </PowerNetworkContext.Provider>\n  )\n}\n\n// --- Row containers -----------------------------------------------------\n\nexport interface PowerNetworkRowProps {\n  className?: string\n  children?: ReactNode\n}\n\nexport function PowerNetworkSources({\n  className,\n  children,\n}: PowerNetworkRowProps): ReactElement {\n  return (\n    <div\n      className={cn(\n        'flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]',\n        className,\n      )}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport function PowerNetworkDevices({\n  className,\n  children,\n}: PowerNetworkRowProps): ReactElement {\n  return (\n    <div\n      className={cn(\n        'flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]',\n        className,\n      )}\n    >\n      {children}\n    </div>\n  )\n}\n\n// --- PowerSource --------------------------------------------------------\n\nexport interface PowerSourceProps {\n  id?: string\n  watts: number\n  icon: ReactNode\n  variant?: PowerSourceVariant\n  className?: string\n  /**\n   * Optional 0–100 progress (e.g. battery SoC). When set, a thin colored arc\n   * is drawn around the icon circle as a non-intrusive indicator.\n   */\n  progress?: number\n  /** Keeps the variant colors at 0 W, for a source that is online but idle. */\n  standby?: boolean\n}\n\nexport function PowerSource({\n  id: idProp,\n  watts,\n  icon,\n  variant = 'neutral',\n  className,\n  progress,\n  standby = false,\n}: PowerSourceProps): ReactElement {\n  const autoId = useId()\n  const id = idProp ?? autoId\n  const { register, unregister, loading } = usePowerNetwork()\n  const [element, setElement] = useState<HTMLDivElement | null>(null)\n\n  useEffect(() => {\n    if (!element) return\n    register({ id, kind: 'source', variant, watts, element })\n  }, [element, register, id, variant, watts])\n\n  useEffect(() => {\n    return () => unregister(id)\n  }, [unregister, id])\n\n  if (loading) {\n    return <SourceSkeleton anchorRef={setElement} />\n  }\n\n  const isActive = watts !== 0\n  const isColored = isActive || standby\n  const variantStyles = SOURCE_VARIANTS[variant]\n  const clampedProgress =\n    progress == null ? null : Math.max(0, Math.min(100, progress))\n  const showRing = clampedProgress != null\n  const RING_RADIUS = 48\n  const RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS\n  const ringDash =\n    clampedProgress != null ? (clampedProgress / 100) * RING_CIRCUMFERENCE : 0\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-center justify-center gap-1 transition-opacity duration-500',\n        !isColored && 'opacity-45',\n        className,\n      )}\n    >\n      <NumberFlow\n        value={Math.abs(watts)}\n        suffix=\"W\"\n        className=\"mt-1 text-sm leading-none font-medium\"\n      />\n      <div\n        ref={setElement}\n        className={cn(\n          'relative flex aspect-square items-center justify-center rounded-full border p-4 shadow-sm',\n          isColored\n            ? variantStyles.activeClassName\n            : 'border-gray bg-gray-a3 shadow-gray-a4 saturate-0',\n        )}\n      >\n        {showRing && (\n          <svg\n            className=\"pointer-events-none absolute inset-0 size-full -rotate-90\"\n            viewBox=\"0 0 100 100\"\n            aria-hidden=\"true\"\n          >\n            <circle\n              cx=\"50\"\n              cy=\"50\"\n              r={RING_RADIUS}\n              fill=\"none\"\n              stroke={variantStyles.flowStroke}\n              strokeWidth=\"4\"\n              strokeLinecap=\"round\"\n              strokeDasharray={`${ringDash} ${RING_CIRCUMFERENCE}`}\n              opacity={isColored ? 1 : 0.5}\n            />\n          </svg>\n        )}\n        {icon}\n      </div>\n    </div>\n  )\n}\n\nfunction SourceSkeleton({\n  anchorRef,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n}): ReactElement {\n  return (\n    <div className=\"flex flex-col items-center justify-center gap-1\">\n      <Skeleton className=\"h-3.5 w-10\" />\n      <div\n        ref={anchorRef}\n        className=\"flex aspect-square animate-pulse items-center justify-center rounded-full border border-gray bg-base-gray-soft p-4 motion-reduce:animate-none\"\n      >\n        <div className=\"size-7\" />\n      </div>\n    </div>\n  )\n}\n\n// --- PowerDevice --------------------------------------------------------\n\nexport interface PowerDeviceProps {\n  id?: string\n  watts: number\n  icon: ReactNode\n  className?: string\n}\n\nexport function PowerDevice({\n  id: idProp,\n  watts,\n  icon,\n  className,\n}: PowerDeviceProps): ReactElement {\n  const autoId = useId()\n  const id = idProp ?? autoId\n  const { register, unregister, loading } = usePowerNetwork()\n  const [element, setElement] = useState<HTMLDivElement | null>(null)\n\n  useEffect(() => {\n    if (!element) return\n    register({ id, kind: 'device', watts, element })\n  }, [element, register, id, watts])\n\n  useEffect(() => {\n    return () => unregister(id)\n  }, [unregister, id])\n\n  if (loading) {\n    return <DeviceSkeleton anchorRef={setElement} />\n  }\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-center justify-center gap-1',\n        className,\n      )}\n    >\n      <div\n        ref={setElement}\n        className=\"flex aspect-square items-center justify-center rounded-full border border-gray bg-gray-a1 p-4\"\n      >\n        {icon}\n      </div>\n      <NumberFlow\n        value={watts}\n        suffix=\"W\"\n        className=\"text-sm font-medium tabular-nums\"\n      />\n    </div>\n  )\n}\n\nfunction DeviceSkeleton({\n  anchorRef,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n}): ReactElement {\n  return (\n    <div className=\"flex flex-col items-center justify-center gap-1\">\n      <div\n        ref={anchorRef}\n        className=\"flex aspect-square animate-pulse items-center justify-center rounded-full border border-gray bg-base-gray-soft p-4 motion-reduce:animate-none\"\n      >\n        <div className=\"size-5\" />\n      </div>\n      <Skeleton className=\"h-3.5 w-10\" />\n    </div>\n  )\n}\n\n// --- PowerNetworkHome ---------------------------------------------------\n\nexport interface PowerNetworkHomeProps {\n  /** Override total power. Defaults to the sum of registered source watts. */\n  watts?: number\n  /** Self-sufficiency ratio in 0..1. Renders a green ring when provided. */\n  autarky?: number\n  className?: string\n}\n\nexport function PowerNetworkHome({\n  watts,\n  autarky,\n  className,\n}: PowerNetworkHomeProps): ReactElement {\n  const autoId = useId()\n  const { register, unregister, loading, totalSourceWatts } = usePowerNetwork()\n  const [element, setElement] = useState<HTMLDivElement | null>(null)\n  const effectiveWatts = watts ?? totalSourceWatts\n\n  useEffect(() => {\n    if (!element) return\n    register({ id: autoId, kind: 'home', watts: effectiveWatts, element })\n  }, [element, register, autoId, effectiveWatts])\n\n  useEffect(() => {\n    return () => unregister(autoId)\n  }, [unregister, autoId])\n\n  if (loading) {\n    return <HomeSkeleton anchorRef={setElement} className={className} />\n  }\n\n  return (\n    <HomeSection\n      anchorRef={setElement}\n      autarky={autarky ?? null}\n      watts={effectiveWatts}\n      className={className}\n    />\n  )\n}\n\nfunction HomeSection({\n  anchorRef,\n  autarky,\n  className,\n  watts,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n  autarky: number | null\n  className?: string\n  watts: number\n}): ReactElement {\n  const reducedMotion = useReducedMotion()\n  const targetAutarky =\n    autarky == null ? 0 : Math.max(0, Math.min(100, autarky * 100))\n  const [animatedAutarky, setAnimatedAutarky] = useState(targetAutarky)\n  const animatedAutarkyRef = useRef(animatedAutarky)\n  const nodeSize = 78\n  const ringStrokeWidth = 2\n  const radius = (nodeSize - ringStrokeWidth) / 2\n  const circumference = 2 * Math.PI * radius\n  const progressLength = (animatedAutarky / 100) * circumference\n\n  useEffect(() => {\n    animatedAutarkyRef.current = animatedAutarky\n  }, [animatedAutarky])\n\n  useEffect(() => {\n    if (reducedMotion) {\n      animatedAutarkyRef.current = targetAutarky\n      setAnimatedAutarky(targetAutarky)\n      return\n    }\n\n    let frameId = 0\n    let lastTime = performance.now()\n\n    const animate = (now: number) => {\n      const deltaSeconds = Math.max(0.001, (now - lastTime) / 1000)\n      lastTime = now\n      const smoothing = 1 - Math.exp(-7 * deltaSeconds)\n      const next =\n        animatedAutarkyRef.current +\n        (targetAutarky - animatedAutarkyRef.current) * smoothing\n\n      animatedAutarkyRef.current = next\n      setAnimatedAutarky(next)\n\n      if (Math.abs(targetAutarky - next) > 0.05) {\n        frameId = window.requestAnimationFrame(animate)\n      } else {\n        animatedAutarkyRef.current = targetAutarky\n        setAnimatedAutarky(targetAutarky)\n      }\n    }\n\n    frameId = window.requestAnimationFrame(animate)\n    return () => window.cancelAnimationFrame(frameId)\n  }, [targetAutarky, reducedMotion])\n\n  return (\n    <div\n      ref={anchorRef}\n      className={cn('relative mx-auto size-[78px]', className)}\n    >\n      {autarky != null && (\n        <svg\n          className=\"absolute inset-0 size-full -rotate-90\"\n          viewBox={`0 0 ${nodeSize} ${nodeSize}`}\n        >\n          <circle\n            cx={nodeSize / 2}\n            cy={nodeSize / 2}\n            r={radius}\n            fill=\"none\"\n            stroke=\"var(--neutral-a5)\"\n            strokeWidth={ringStrokeWidth}\n          />\n          {progressLength > 0 && (\n            <circle\n              cx={nodeSize / 2}\n              cy={nodeSize / 2}\n              r={radius}\n              fill=\"none\"\n              stroke=\"var(--green-a9)\"\n              strokeLinecap=\"round\"\n              strokeWidth={ringStrokeWidth}\n              strokeDasharray={`${progressLength} ${circumference}`}\n            />\n          )}\n        </svg>\n      )}\n      <div className=\"absolute inset-0 flex flex-col items-center justify-center rounded-full border border-gray-a5 shadow-sm shadow-gray-a1\">\n        <Home className=\"[--spark-icon-size:14px]\" />\n        <NumberFlow\n          value={watts}\n          suffix=\"W\"\n          className=\"mt-1 text-sm leading-none font-medium\"\n        />\n      </div>\n    </div>\n  )\n}\n\nfunction HomeSkeleton({\n  anchorRef,\n  className,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n  className?: string\n}): ReactElement {\n  return (\n    <div\n      ref={anchorRef}\n      className={cn(\n        'mx-auto size-[78px] animate-pulse rounded-full border border-gray motion-reduce:animate-none',\n        className,\n      )}\n    />\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"power-network.cjs","names":["useReducedMotion","SectionTitle","NumberFlow","Skeleton","Home"],"sources":["../../src/components/power-network.tsx"],"sourcesContent":["import { Home } from '@epilot/spark-icons'\nimport {\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { useReducedMotion } from '../hooks/use-reduced-motion'\nimport { cn } from '../utils/cn'\nimport NumberFlow from './number-flow'\nimport { Skeleton } from './skeleton'\nimport { SectionTitle } from './typography'\n\n// --- Variants -----------------------------------------------------------\n\nexport type PowerSourceVariant = 'grid' | 'solar' | 'battery' | 'neutral'\n\ninterface SourceVariantStyles {\n  activeClassName: string\n  flowStroke: string\n  initialDashGap: number\n}\n\nconst SOURCE_VARIANTS: Record<PowerSourceVariant, SourceVariantStyles> = {\n  grid: {\n    activeClassName: 'border-blue-a9 bg-blue-a1 shadow-blue-a4',\n    flowStroke: 'var(--blue-11)',\n    initialDashGap: 10,\n  },\n  solar: {\n    activeClassName: 'border-orange-a9 bg-orange-a1 shadow-orange-a3',\n    flowStroke: 'var(--orange-a9)',\n    initialDashGap: 5,\n  },\n  battery: {\n    activeClassName: 'border-green-a9 bg-green-a1 shadow-green-a3',\n    flowStroke: 'var(--green-a9)',\n    initialDashGap: 7,\n  },\n  neutral: {\n    activeClassName: 'border-gray-a9 bg-gray-a1 shadow-gray-a3',\n    flowStroke: 'var(--neutral-a9)',\n    initialDashGap: 9,\n  },\n}\n\nconst DEVICE_FLOW_STROKE = 'var(--neutral-a9)'\nconst DEVICE_INITIAL_DASH_GAP = 9\n\n// Drawn under every connector and revealed when nothing flows, so a 0 W node\n// still reads as wired up and online rather than disconnected.\nconst IDLE_STROKE = 'var(--neutral-a6)'\nconst SKELETON_STROKE = 'var(--neutral-a6)'\nconst STROKE_WIDTH = 2\nconst STRAIGHT_TOLERANCE_PX = 3\nconst SOURCE_HOME_OFFSET_STEP_PX = 10\nconst DEVICE_HOME_OFFSET_STEP_PX = 10\n\n// --- Flow animation parameters ------------------------------------------\n\nconst FLOW_DASH_SOLID = 1\nconst FLOW_GAP_MAX = 14\nconst FLOW_GAP_MIN = 5\nconst FLOW_SPEED_MIN = 10\nconst FLOW_SPEED_MAX = 56\nconst FLOW_SMOOTHING = 5.5\n\ninterface FlowVisual {\n  gap: number\n  speed: number\n  opacity: number\n}\n\ninterface FlowAnimationState extends FlowVisual {\n  offset: number\n}\n\n// --- Context ------------------------------------------------------------\n\ntype NodeKind = 'source' | 'device' | 'home'\n\ninterface RegisteredNode {\n  id: string\n  kind: NodeKind\n  variant?: PowerSourceVariant\n  watts: number\n  element: HTMLDivElement | null\n}\n\ninterface PowerNetworkContextValue {\n  loading: boolean\n  register: (node: RegisteredNode) => void\n  unregister: (id: string) => void\n  totalSourceWatts: number\n}\n\nconst PowerNetworkContext = createContext<PowerNetworkContextValue | null>(null)\n\nfunction usePowerNetwork(): PowerNetworkContextValue {\n  const ctx = useContext(PowerNetworkContext)\n  if (!ctx) {\n    throw new Error(\n      'Power network sub-components must be used inside <PowerNetworkDiagram>.',\n    )\n  }\n  return ctx\n}\n\n// --- Geometry helpers ---------------------------------------------------\n\ninterface Point {\n  x: number\n  y: number\n}\n\nfunction anchorTop(rect: DOMRect, containerRect: DOMRect): Point {\n  return {\n    x: rect.left + rect.width / 2 - containerRect.left,\n    y: rect.top - containerRect.top,\n  }\n}\n\nfunction anchorBottom(rect: DOMRect, containerRect: DOMRect): Point {\n  return {\n    x: rect.left + rect.width / 2 - containerRect.left,\n    y: rect.bottom - containerRect.top,\n  }\n}\n\nfunction buildAdaptivePath(from: Point, to: Point): string {\n  if (Math.abs(from.x - to.x) < STRAIGHT_TOLERANCE_PX) {\n    return `M ${from.x} ${from.y} L ${to.x} ${to.y}`\n  }\n  const dy = to.y - from.y\n  const c1y = from.y + dy * 0.56\n  const c2y = to.y - dy * 0.58\n  return `M ${from.x} ${from.y} C ${from.x} ${c1y} ${to.x} ${c2y} ${to.x} ${to.y}`\n}\n\n// --- PowerNetworkDiagram ------------------------------------------------\n\nexport interface PowerNetworkDiagramProps {\n  title?: string\n  loading?: boolean\n  className?: string\n  children?: ReactNode\n}\n\ninterface ConnectorPath {\n  id: string\n  d: string\n  kind: NodeKind\n  variant?: PowerSourceVariant\n  reversed: boolean\n}\n\nfunction connectorPathsEqual(a: ConnectorPath[], b: ConnectorPath[]): boolean {\n  if (a.length !== b.length) return false\n  for (let i = 0; i < a.length; i++) {\n    const ap = a[i]\n    const bp = b[i]\n    if (!ap || !bp) return false\n    if (\n      ap.id !== bp.id ||\n      ap.d !== bp.d ||\n      ap.variant !== bp.variant ||\n      ap.kind !== bp.kind ||\n      ap.reversed !== bp.reversed\n    ) {\n      return false\n    }\n  }\n  return true\n}\n\nexport function PowerNetworkDiagram({\n  title,\n  loading = false,\n  className,\n  children,\n}: PowerNetworkDiagramProps): ReactElement {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const reducedMotion = useReducedMotion()\n  const [nodes, setNodes] = useState<Map<string, RegisteredNode>>(\n    () => new Map(),\n  )\n  const [connectorPaths, setConnectorPaths] = useState<ConnectorPath[]>([])\n  const connectorPathsRef = useRef<ConnectorPath[]>([])\n  const flowPathRefs = useRef<Record<string, SVGPathElement | null>>({})\n  const idlePathRefs = useRef<Record<string, SVGPathElement | null>>({})\n  const currentFlowVisualsRef = useRef<Record<string, FlowAnimationState>>({})\n  const targetFlowVisualsRef = useRef<Record<string, FlowVisual>>({})\n\n  const register = useCallback((node: RegisteredNode) => {\n    setNodes((prev) => {\n      const existing = prev.get(node.id)\n      if (\n        existing &&\n        existing.kind === node.kind &&\n        existing.variant === node.variant &&\n        existing.watts === node.watts &&\n        existing.element === node.element\n      ) {\n        return prev\n      }\n      const next = new Map(prev)\n      next.set(node.id, node)\n      return next\n    })\n  }, [])\n\n  const unregister = useCallback((id: string) => {\n    setNodes((prev) => {\n      if (!prev.has(id)) return prev\n      const next = new Map(prev)\n      next.delete(id)\n      return next\n    })\n  }, [])\n\n  const totalSourceWatts = useMemo(() => {\n    let total = 0\n    for (const node of nodes.values()) {\n      if (node.kind === 'source') total += node.watts\n    }\n    return total\n  }, [nodes])\n\n  useEffect(() => {\n    const container = containerRef.current\n    if (!container) return\n\n    let homeNode: RegisteredNode | undefined\n    const sources: RegisteredNode[] = []\n    const devices: RegisteredNode[] = []\n    for (const node of nodes.values()) {\n      if (node.kind === 'home') {\n        homeNode = node\n      } else if (node.element) {\n        if (node.kind === 'source') sources.push(node)\n        else devices.push(node)\n      }\n    }\n\n    const updatePaths = () => {\n      if (!homeNode || !homeNode.element) {\n        setConnectorPaths((prev) => (prev.length === 0 ? prev : []))\n        return\n      }\n      const containerRect = container.getBoundingClientRect()\n      const homeRect = homeNode.element.getBoundingClientRect()\n      const homeTop = anchorTop(homeRect, containerRect)\n      const homeBottom = anchorBottom(homeRect, containerRect)\n      const next: ConnectorPath[] = []\n\n      const sourceCount = sources.length\n      const deviceCount = devices.length\n\n      sources.forEach((source, index) => {\n        if (!source.element) return\n        const from = anchorBottom(\n          source.element.getBoundingClientRect(),\n          containerRect,\n        )\n        const offsetX =\n          SOURCE_HOME_OFFSET_STEP_PX * (index - (sourceCount - 1) / 2)\n        const to = { x: homeTop.x + offsetX, y: homeTop.y }\n        next.push({\n          id: source.id,\n          d: buildAdaptivePath(from, to),\n          kind: 'source',\n          variant: source.variant,\n          reversed: source.watts < 0,\n        })\n      })\n\n      devices.forEach((device, index) => {\n        if (!device.element) return\n        const to = anchorTop(\n          device.element.getBoundingClientRect(),\n          containerRect,\n        )\n        const offsetX =\n          DEVICE_HOME_OFFSET_STEP_PX * (index - (deviceCount - 1) / 2)\n        const from = { x: homeBottom.x + offsetX, y: homeBottom.y }\n        next.push({\n          id: device.id,\n          d: buildAdaptivePath(from, to),\n          kind: 'device',\n          reversed: false,\n        })\n      })\n\n      setConnectorPaths((prev) =>\n        connectorPathsEqual(prev, next) ? prev : next,\n      )\n    }\n\n    updatePaths()\n\n    const resizeObserver = new ResizeObserver(updatePaths)\n    resizeObserver.observe(container)\n    for (const node of nodes.values()) {\n      if (node.element) resizeObserver.observe(node.element)\n    }\n    window.addEventListener('resize', updatePaths)\n\n    return () => {\n      resizeObserver.disconnect()\n      window.removeEventListener('resize', updatePaths)\n    }\n  }, [nodes])\n\n  useEffect(() => {\n    connectorPathsRef.current = connectorPaths\n  }, [connectorPaths])\n\n  useEffect(() => {\n    const targets: Record<string, FlowVisual> = {}\n    const homeWatts = totalSourceWatts\n    for (const node of nodes.values()) {\n      if (node.kind === 'home') continue\n      const watts = node.watts\n      const relative =\n        homeWatts > 0\n          ? Math.max(0, Math.min(1, Math.abs(watts) / homeWatts))\n          : 0\n      targets[node.id] = {\n        gap: FLOW_GAP_MAX - (FLOW_GAP_MAX - FLOW_GAP_MIN) * relative,\n        speed: FLOW_SPEED_MIN + (FLOW_SPEED_MAX - FLOW_SPEED_MIN) * relative,\n        opacity: Math.abs(watts) > 0 ? 1 : 0,\n      }\n    }\n    targetFlowVisualsRef.current = targets\n  }, [nodes, totalSourceWatts])\n\n  useEffect(() => {\n    if (loading || reducedMotion) return\n    let frameId = 0\n    let lastFrameTime = performance.now()\n\n    const animate = (now: number) => {\n      const deltaSeconds = Math.max(0.001, (now - lastFrameTime) / 1000)\n      lastFrameTime = now\n      const smoothing = 1 - Math.exp(-FLOW_SMOOTHING * deltaSeconds)\n\n      for (const connectorPath of connectorPathsRef.current) {\n        const id = connectorPath.id\n        const target = targetFlowVisualsRef.current[id]\n        const pathElement = flowPathRefs.current[id]\n        if (!target || !pathElement) continue\n\n        const current = currentFlowVisualsRef.current[id] ?? {\n          gap: target.gap,\n          offset: 0,\n          speed: target.speed,\n          opacity: target.opacity,\n        }\n\n        current.gap += (target.gap - current.gap) * smoothing\n        current.speed += (target.speed - current.speed) * smoothing\n        current.opacity += (target.opacity - current.opacity) * smoothing\n\n        const dashCycle = FLOW_DASH_SOLID + Math.max(0.001, current.gap)\n        const direction = connectorPath.reversed ? 1 : -1\n        const nextOffset =\n          current.offset + direction * current.speed * deltaSeconds\n        const wrappedOffset = ((nextOffset % dashCycle) + dashCycle) % dashCycle\n        current.offset = wrappedOffset - dashCycle\n\n        pathElement.setAttribute(\n          'stroke-dasharray',\n          `${FLOW_DASH_SOLID} ${current.gap.toFixed(3)}`,\n        )\n        pathElement.setAttribute('stroke-dashoffset', current.offset.toFixed(3))\n        pathElement.setAttribute('opacity', current.opacity.toFixed(3))\n        idlePathRefs.current[id]?.setAttribute(\n          'opacity',\n          (1 - current.opacity).toFixed(3),\n        )\n\n        currentFlowVisualsRef.current[id] = current\n      }\n\n      frameId = window.requestAnimationFrame(animate)\n    }\n\n    frameId = window.requestAnimationFrame(animate)\n    return () => window.cancelAnimationFrame(frameId)\n  }, [loading, reducedMotion])\n\n  // Reduced motion: freeze the marching dashes but keep the dash gap tracking\n  // live magnitude, and let opacity fade in/out via the CSS transition on each\n  // flow path (see the flow <path> style below).\n  useEffect(() => {\n    if (loading || !reducedMotion) return\n    for (const connectorPath of connectorPathsRef.current) {\n      const target = targetFlowVisualsRef.current[connectorPath.id]\n      const pathElement = flowPathRefs.current[connectorPath.id]\n      if (!target || !pathElement) continue\n      pathElement.setAttribute(\n        'stroke-dasharray',\n        `${FLOW_DASH_SOLID} ${target.gap.toFixed(3)}`,\n      )\n      pathElement.setAttribute('stroke-dashoffset', '0')\n      pathElement.setAttribute('opacity', target.opacity.toFixed(3))\n      idlePathRefs.current[connectorPath.id]?.setAttribute(\n        'opacity',\n        (1 - target.opacity).toFixed(3),\n      )\n    }\n  }, [loading, reducedMotion, nodes, totalSourceWatts])\n\n  const contextValue = useMemo<PowerNetworkContextValue>(\n    () => ({ loading, register, unregister, totalSourceWatts }),\n    [loading, register, unregister, totalSourceWatts],\n  )\n\n  return (\n    <PowerNetworkContext.Provider value={contextValue}>\n      <div\n        ref={containerRef}\n        className={cn('@container relative flex flex-col', className)}\n      >\n        {title && <SectionTitle>{title}</SectionTitle>}\n        {connectorPaths.length > 0 && (\n          <svg className=\"pointer-events-none absolute inset-0 size-full\">\n            {connectorPaths.map((path) => {\n              if (loading) {\n                return (\n                  <path\n                    key={path.id}\n                    d={path.d}\n                    fill=\"none\"\n                    stroke={SKELETON_STROKE}\n                    strokeWidth={STROKE_WIDTH}\n                    strokeLinecap=\"round\"\n                  />\n                )\n              }\n\n              const flowStroke =\n                path.kind === 'source' && path.variant\n                  ? SOURCE_VARIANTS[path.variant].flowStroke\n                  : DEVICE_FLOW_STROKE\n              const initialDashGap =\n                path.kind === 'source' && path.variant\n                  ? SOURCE_VARIANTS[path.variant].initialDashGap\n                  : DEVICE_INITIAL_DASH_GAP\n\n              return (\n                <g key={path.id}>\n                  <path\n                    d={path.d}\n                    fill=\"none\"\n                    stroke={IDLE_STROKE}\n                    strokeWidth={STROKE_WIDTH}\n                    strokeLinecap=\"round\"\n                    ref={(el) => {\n                      idlePathRefs.current[path.id] = el\n                    }}\n                    opacity={1}\n                    style={\n                      reducedMotion\n                        ? { transition: 'opacity 300ms ease' }\n                        : undefined\n                    }\n                  />\n                  <path\n                    d={path.d}\n                    fill=\"none\"\n                    stroke={flowStroke}\n                    strokeWidth={STROKE_WIDTH}\n                    strokeLinecap=\"round\"\n                    ref={(el) => {\n                      flowPathRefs.current[path.id] = el\n                    }}\n                    strokeDasharray={`${FLOW_DASH_SOLID} ${initialDashGap}`}\n                    strokeDashoffset={0}\n                    opacity={0}\n                    style={\n                      reducedMotion\n                        ? { transition: 'opacity 300ms ease' }\n                        : undefined\n                    }\n                  />\n                </g>\n              )\n            })}\n          </svg>\n        )}\n        <div className=\"flex flex-col gap-y-14\">{children}</div>\n      </div>\n    </PowerNetworkContext.Provider>\n  )\n}\n\n// --- Row containers -----------------------------------------------------\n\nexport interface PowerNetworkRowProps {\n  className?: string\n  children?: ReactNode\n}\n\nexport function PowerNetworkSources({\n  className,\n  children,\n}: PowerNetworkRowProps): ReactElement {\n  return (\n    <div\n      className={cn(\n        'flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]',\n        className,\n      )}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport function PowerNetworkDevices({\n  className,\n  children,\n}: PowerNetworkRowProps): ReactElement {\n  return (\n    <div\n      className={cn(\n        'flex items-center justify-center gap-[clamp(1.5rem,10cqw,4rem)]',\n        className,\n      )}\n    >\n      {children}\n    </div>\n  )\n}\n\n// --- PowerSource --------------------------------------------------------\n\nexport interface PowerSourceProps {\n  id?: string\n  watts: number\n  icon: ReactNode\n  variant?: PowerSourceVariant\n  className?: string\n  /**\n   * Optional 0–100 progress (e.g. battery SoC). When set, a thin colored arc\n   * is drawn around the icon circle as a non-intrusive indicator.\n   */\n  progress?: number\n  /** Keeps the variant colors at 0 W, for a source that is online but idle. */\n  standby?: boolean\n}\n\nexport function PowerSource({\n  id: idProp,\n  watts,\n  icon,\n  variant = 'neutral',\n  className,\n  progress,\n  standby = false,\n}: PowerSourceProps): ReactElement {\n  const autoId = useId()\n  const id = idProp ?? autoId\n  const { register, unregister, loading } = usePowerNetwork()\n  const [element, setElement] = useState<HTMLDivElement | null>(null)\n\n  useEffect(() => {\n    if (!element) return\n    register({ id, kind: 'source', variant, watts, element })\n  }, [element, register, id, variant, watts])\n\n  useEffect(() => {\n    return () => unregister(id)\n  }, [unregister, id])\n\n  if (loading) {\n    return <SourceSkeleton anchorRef={setElement} />\n  }\n\n  const isActive = watts !== 0\n  const isColored = isActive || standby\n  const variantStyles = SOURCE_VARIANTS[variant]\n  const clampedProgress =\n    progress == null ? null : Math.max(0, Math.min(100, progress))\n  const showRing = clampedProgress != null\n  const RING_RADIUS = 48\n  const RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS\n  const ringDash =\n    clampedProgress != null ? (clampedProgress / 100) * RING_CIRCUMFERENCE : 0\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-center justify-center gap-1 transition-opacity duration-500',\n        !isColored && 'opacity-45',\n        className,\n      )}\n    >\n      <NumberFlow\n        value={Math.abs(watts)}\n        suffix=\"W\"\n        className=\"mt-1 text-sm leading-none font-medium\"\n      />\n      <div\n        ref={setElement}\n        className={cn(\n          'relative flex aspect-square items-center justify-center rounded-full border p-4 shadow-sm',\n          isColored\n            ? variantStyles.activeClassName\n            : 'border-gray bg-gray-a3 shadow-gray-a4 saturate-0',\n        )}\n      >\n        {showRing && (\n          <svg\n            className=\"pointer-events-none absolute inset-0 size-full -rotate-90\"\n            viewBox=\"0 0 100 100\"\n            aria-hidden=\"true\"\n          >\n            <circle\n              cx=\"50\"\n              cy=\"50\"\n              r={RING_RADIUS}\n              fill=\"none\"\n              stroke={variantStyles.flowStroke}\n              strokeWidth=\"4\"\n              strokeLinecap=\"round\"\n              strokeDasharray={`${ringDash} ${RING_CIRCUMFERENCE}`}\n              opacity={isColored ? 1 : 0.5}\n            />\n          </svg>\n        )}\n        {icon}\n      </div>\n    </div>\n  )\n}\n\nfunction SourceSkeleton({\n  anchorRef,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n}): ReactElement {\n  return (\n    <div className=\"flex flex-col items-center justify-center gap-1\">\n      <Skeleton className=\"h-3.5 w-10\" />\n      <div\n        ref={anchorRef}\n        className=\"flex aspect-square animate-pulse items-center justify-center rounded-full border border-gray bg-base-gray-soft p-4 motion-reduce:animate-none\"\n      >\n        <div className=\"size-7\" />\n      </div>\n    </div>\n  )\n}\n\n// --- PowerDevice --------------------------------------------------------\n\nexport interface PowerDeviceProps {\n  id?: string\n  watts: number\n  icon: ReactNode\n  className?: string\n}\n\nexport function PowerDevice({\n  id: idProp,\n  watts,\n  icon,\n  className,\n}: PowerDeviceProps): ReactElement {\n  const autoId = useId()\n  const id = idProp ?? autoId\n  const { register, unregister, loading } = usePowerNetwork()\n  const [element, setElement] = useState<HTMLDivElement | null>(null)\n\n  useEffect(() => {\n    if (!element) return\n    register({ id, kind: 'device', watts, element })\n  }, [element, register, id, watts])\n\n  useEffect(() => {\n    return () => unregister(id)\n  }, [unregister, id])\n\n  if (loading) {\n    return <DeviceSkeleton anchorRef={setElement} />\n  }\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-center justify-center gap-1',\n        className,\n      )}\n    >\n      <div\n        ref={setElement}\n        className=\"flex aspect-square items-center justify-center rounded-full border border-gray bg-gray-a1 p-4\"\n      >\n        {icon}\n      </div>\n      <NumberFlow\n        value={watts}\n        suffix=\"W\"\n        className=\"text-sm font-medium tabular-nums\"\n      />\n    </div>\n  )\n}\n\nfunction DeviceSkeleton({\n  anchorRef,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n}): ReactElement {\n  return (\n    <div className=\"flex flex-col items-center justify-center gap-1\">\n      <div\n        ref={anchorRef}\n        className=\"flex aspect-square animate-pulse items-center justify-center rounded-full border border-gray bg-base-gray-soft p-4 motion-reduce:animate-none\"\n      >\n        <div className=\"size-5\" />\n      </div>\n      <Skeleton className=\"h-3.5 w-10\" />\n    </div>\n  )\n}\n\n// --- PowerNetworkHome ---------------------------------------------------\n\nexport interface PowerNetworkHomeProps {\n  /** Override total power. Defaults to the sum of registered source watts. */\n  watts?: number\n  /** Self-sufficiency ratio in 0..1. Renders a green ring when provided. */\n  autarky?: number\n  className?: string\n}\n\nexport function PowerNetworkHome({\n  watts,\n  autarky,\n  className,\n}: PowerNetworkHomeProps): ReactElement {\n  const autoId = useId()\n  const { register, unregister, loading, totalSourceWatts } = usePowerNetwork()\n  const [element, setElement] = useState<HTMLDivElement | null>(null)\n  const effectiveWatts = watts ?? totalSourceWatts\n\n  useEffect(() => {\n    if (!element) return\n    register({ id: autoId, kind: 'home', watts: effectiveWatts, element })\n  }, [element, register, autoId, effectiveWatts])\n\n  useEffect(() => {\n    return () => unregister(autoId)\n  }, [unregister, autoId])\n\n  if (loading) {\n    return <HomeSkeleton anchorRef={setElement} className={className} />\n  }\n\n  return (\n    <HomeSection\n      anchorRef={setElement}\n      autarky={autarky ?? null}\n      watts={effectiveWatts}\n      className={className}\n    />\n  )\n}\n\nfunction HomeSection({\n  anchorRef,\n  autarky,\n  className,\n  watts,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n  autarky: number | null\n  className?: string\n  watts: number\n}): ReactElement {\n  const reducedMotion = useReducedMotion()\n  const targetAutarky =\n    autarky == null ? 0 : Math.max(0, Math.min(100, autarky * 100))\n  const [animatedAutarky, setAnimatedAutarky] = useState(targetAutarky)\n  const animatedAutarkyRef = useRef(animatedAutarky)\n  const nodeSize = 78\n  const ringStrokeWidth = 2\n  const radius = (nodeSize - ringStrokeWidth) / 2\n  const circumference = 2 * Math.PI * radius\n  const progressLength = (animatedAutarky / 100) * circumference\n\n  useEffect(() => {\n    animatedAutarkyRef.current = animatedAutarky\n  }, [animatedAutarky])\n\n  useEffect(() => {\n    if (reducedMotion) {\n      animatedAutarkyRef.current = targetAutarky\n      setAnimatedAutarky(targetAutarky)\n      return\n    }\n\n    let frameId = 0\n    let lastTime = performance.now()\n\n    const animate = (now: number) => {\n      const deltaSeconds = Math.max(0.001, (now - lastTime) / 1000)\n      lastTime = now\n      const smoothing = 1 - Math.exp(-7 * deltaSeconds)\n      const next =\n        animatedAutarkyRef.current +\n        (targetAutarky - animatedAutarkyRef.current) * smoothing\n\n      animatedAutarkyRef.current = next\n      setAnimatedAutarky(next)\n\n      if (Math.abs(targetAutarky - next) > 0.05) {\n        frameId = window.requestAnimationFrame(animate)\n      } else {\n        animatedAutarkyRef.current = targetAutarky\n        setAnimatedAutarky(targetAutarky)\n      }\n    }\n\n    frameId = window.requestAnimationFrame(animate)\n    return () => window.cancelAnimationFrame(frameId)\n  }, [targetAutarky, reducedMotion])\n\n  return (\n    <div\n      ref={anchorRef}\n      className={cn('relative mx-auto size-[78px]', className)}\n    >\n      {autarky != null && (\n        <svg\n          className=\"absolute inset-0 size-full -rotate-90\"\n          viewBox={`0 0 ${nodeSize} ${nodeSize}`}\n        >\n          <circle\n            cx={nodeSize / 2}\n            cy={nodeSize / 2}\n            r={radius}\n            fill=\"none\"\n            stroke=\"var(--neutral-a5)\"\n            strokeWidth={ringStrokeWidth}\n          />\n          {progressLength > 0 && (\n            <circle\n              cx={nodeSize / 2}\n              cy={nodeSize / 2}\n              r={radius}\n              fill=\"none\"\n              stroke=\"var(--green-a9)\"\n              strokeLinecap=\"round\"\n              strokeWidth={ringStrokeWidth}\n              strokeDasharray={`${progressLength} ${circumference}`}\n            />\n          )}\n        </svg>\n      )}\n      <div className=\"absolute inset-0 flex flex-col items-center justify-center rounded-full border border-gray-a5 shadow-sm shadow-gray-a1\">\n        <Home className=\"[--spark-icon-size:14px]\" />\n        <NumberFlow\n          value={watts}\n          suffix=\"W\"\n          className=\"mt-1 text-sm leading-none font-medium\"\n        />\n      </div>\n    </div>\n  )\n}\n\nfunction HomeSkeleton({\n  anchorRef,\n  className,\n}: {\n  anchorRef: (element: HTMLDivElement | null) => void\n  className?: string\n}): ReactElement {\n  return (\n    <div\n      ref={anchorRef}\n      className={cn(\n        'mx-auto size-[78px] animate-pulse rounded-full border border-gray motion-reduce:animate-none',\n        className,\n      )}\n    />\n  )\n}\n"],"mappings":"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"}

package/dist/components/progress.cjs

@@ -4,7 +4,7 @@ const require_chunk = require("../chunk-DY84GLCh.cjs");
 let react = require("react");
 react = require_chunk.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/progress.tsx
 const sizeClasses = {
 	sm: "h-1",
@@ -17,12 +17,12 @@ const Progress = react.forwardRef(({ className, value, max = 100, size = "defaul
 		"aria-valuemax": max,
 		"aria-valuemin": 0,
 		"aria-valuenow": value,
-		className: (0, cnfast.cn)("w-full overflow-hidden rounded-full bg-gray-a4", sizeClasses[size], className),
+		className: (0, cn.cn)("w-full overflow-hidden rounded-full bg-gray-a4", sizeClasses[size], className),
 		ref,
 		role: "progressbar",
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300",
+			className: "h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300 motion-reduce:transition-none",
 			style: { width: `${percentage}%` }
 		})
 	});

package/dist/components/progress.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"progress.cjs","names":["React"],"sources":["../../src/components/progress.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Current value */\n  value: number\n  /** Maximum value. Default: 100 */\n  max?: number\n  /** Height variant */\n  size?: 'sm' | 'default' | 'lg'\n}\n\nconst sizeClasses = {\n  sm: 'h-1',\n  default: 'h-2',\n  lg: 'h-3',\n} as const\n\nconst Progress = React.forwardRef<HTMLDivElement, ProgressProps>(\n  ({ className, value, max = 100, size = 'default', ...props }, ref) => {\n    const percentage = Math.min(100, Math.max(0, (value / max) * 100))\n\n    return (\n      <div\n        aria-valuemax={max}\n        aria-valuemin={0}\n        aria-valuenow={value}\n        className={cn(\n          'w-full overflow-hidden rounded-full bg-gray-a4',\n          sizeClasses[size],\n          className,\n        )}\n        ref={ref}\n        role=\"progressbar\"\n        {...props}\n      >\n        <div\n          className=\"h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300\"\n          style={{ width: `${percentage}%` }}\n        />\n      </div>\n    )\n  },\n)\n\nProgress.displayName = 'Progress'\n\nexport { Progress }\n"],"mappings":";;;;;;;;AAYA,MAAM,cAAc;CAClB,IAAI;CACJ,SAAS;CACT,IAAI;AACN;AAEA,MAAM,WAAWA,MAAM,YACpB,EAAE,WAAW,OAAO,MAAM,KAAK,OAAO,WAAW,GAAG,SAAS,QAAQ;CACpE,MAAM,aAAa,KAAK,IAAI,KAAK,KAAK,IAAI,GAAI,QAAQ,MAAO,GAAG,CAAC;CAEjE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,YAAA,GAAA,OAAA,IACE,kDACA,YAAY,OACZ,SACF;EACK;EACL,MAAK;EACL,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAU;GACV,OAAO,EAAE,OAAO,GAAG,WAAW,GAAG;EAClC,CAAA;CACE,CAAA;AAET,CACF;AAEA,SAAS,cAAc"}
+{"version":3,"file":"progress.cjs","names":["React"],"sources":["../../src/components/progress.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Current value */\n  value: number\n  /** Maximum value. Default: 100 */\n  max?: number\n  /** Height variant */\n  size?: 'sm' | 'default' | 'lg'\n}\n\nconst sizeClasses = {\n  sm: 'h-1',\n  default: 'h-2',\n  lg: 'h-3',\n} as const\n\nconst Progress = React.forwardRef<HTMLDivElement, ProgressProps>(\n  ({ className, value, max = 100, size = 'default', ...props }, ref) => {\n    const percentage = Math.min(100, Math.max(0, (value / max) * 100))\n\n    return (\n      <div\n        aria-valuemax={max}\n        aria-valuemin={0}\n        aria-valuenow={value}\n        className={cn(\n          'w-full overflow-hidden rounded-full bg-gray-a4',\n          sizeClasses[size],\n          className,\n        )}\n        ref={ref}\n        role=\"progressbar\"\n        {...props}\n      >\n        <div\n          className=\"h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300 motion-reduce:transition-none\"\n          style={{ width: `${percentage}%` }}\n        />\n      </div>\n    )\n  },\n)\n\nProgress.displayName = 'Progress'\n\nexport { Progress }\n"],"mappings":";;;;;;;;AAYA,MAAM,cAAc;CAClB,IAAI;CACJ,SAAS;CACT,IAAI;AACN;AAEA,MAAM,WAAWA,MAAM,YACpB,EAAE,WAAW,OAAO,MAAM,KAAK,OAAO,WAAW,GAAG,SAAS,QAAQ;CACpE,MAAM,aAAa,KAAK,IAAI,KAAK,KAAK,IAAI,GAAI,QAAQ,MAAO,GAAG,CAAC;CAEjE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,YAAA,GAAA,GAAA,IACE,kDACA,YAAY,OACZ,SACF;EACK;EACL,MAAK;EACL,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,WAAU;GACV,OAAO,EAAE,OAAO,GAAG,WAAW,GAAG;EAClC,CAAA;CACE,CAAA;AAET,CACF;AAEA,SAAS,cAAc"}

package/dist/components/progress.js

@@ -19,7 +19,7 @@ const Progress = React$1.forwardRef(({ className, value, max = 100, size = "defa
 		role: "progressbar",
 		...props,
 		children: /* @__PURE__ */ jsx("div", {
-			className: "h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300",
+			className: "h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300 motion-reduce:transition-none",
 			style: { width: `${percentage}%` }
 		})
 	});

package/dist/components/progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress.js","names":["React"],"sources":["../../src/components/progress.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Current value */\n  value: number\n  /** Maximum value. Default: 100 */\n  max?: number\n  /** Height variant */\n  size?: 'sm' | 'default' | 'lg'\n}\n\nconst sizeClasses = {\n  sm: 'h-1',\n  default: 'h-2',\n  lg: 'h-3',\n} as const\n\nconst Progress = React.forwardRef<HTMLDivElement, ProgressProps>(\n  ({ className, value, max = 100, size = 'default', ...props }, ref) => {\n    const percentage = Math.min(100, Math.max(0, (value / max) * 100))\n\n    return (\n      <div\n        aria-valuemax={max}\n        aria-valuemin={0}\n        aria-valuenow={value}\n        className={cn(\n          'w-full overflow-hidden rounded-full bg-gray-a4',\n          sizeClasses[size],\n          className,\n        )}\n        ref={ref}\n        role=\"progressbar\"\n        {...props}\n      >\n        <div\n          className=\"h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300\"\n          style={{ width: `${percentage}%` }}\n        />\n      </div>\n    )\n  },\n)\n\nProgress.displayName = 'Progress'\n\nexport { Progress }\n"],"mappings":";;;;;AAYA,MAAM,cAAc;CAClB,IAAI;CACJ,SAAS;CACT,IAAI;AACN;AAEA,MAAM,WAAWA,QAAM,YACpB,EAAE,WAAW,OAAO,MAAM,KAAK,OAAO,WAAW,GAAG,SAAS,QAAQ;CACpE,MAAM,aAAa,KAAK,IAAI,KAAK,KAAK,IAAI,GAAI,QAAQ,MAAO,GAAG,CAAC;CAEjE,OACE,oBAAC,OAAD;EACE,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,WAAW,GACT,kDACA,YAAY,OACZ,SACF;EACK;EACL,MAAK;EACL,GAAI;YAEJ,oBAAC,OAAD;GACE,WAAU;GACV,OAAO,EAAE,OAAO,GAAG,WAAW,GAAG;EAClC,CAAA;CACE,CAAA;AAET,CACF;AAEA,SAAS,cAAc"}
+{"version":3,"file":"progress.js","names":["React"],"sources":["../../src/components/progress.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Current value */\n  value: number\n  /** Maximum value. Default: 100 */\n  max?: number\n  /** Height variant */\n  size?: 'sm' | 'default' | 'lg'\n}\n\nconst sizeClasses = {\n  sm: 'h-1',\n  default: 'h-2',\n  lg: 'h-3',\n} as const\n\nconst Progress = React.forwardRef<HTMLDivElement, ProgressProps>(\n  ({ className, value, max = 100, size = 'default', ...props }, ref) => {\n    const percentage = Math.min(100, Math.max(0, (value / max) * 100))\n\n    return (\n      <div\n        aria-valuemax={max}\n        aria-valuemin={0}\n        aria-valuenow={value}\n        className={cn(\n          'w-full overflow-hidden rounded-full bg-gray-a4',\n          sizeClasses[size],\n          className,\n        )}\n        ref={ref}\n        role=\"progressbar\"\n        {...props}\n      >\n        <div\n          className=\"h-full rounded-full bg-(--spark-style-bg,var(--color-primary)) transition-all duration-300 motion-reduce:transition-none\"\n          style={{ width: `${percentage}%` }}\n        />\n      </div>\n    )\n  },\n)\n\nProgress.displayName = 'Progress'\n\nexport { Progress }\n"],"mappings":";;;;;AAYA,MAAM,cAAc;CAClB,IAAI;CACJ,SAAS;CACT,IAAI;AACN;AAEA,MAAM,WAAWA,QAAM,YACpB,EAAE,WAAW,OAAO,MAAM,KAAK,OAAO,WAAW,GAAG,SAAS,QAAQ;CACpE,MAAM,aAAa,KAAK,IAAI,KAAK,KAAK,IAAI,GAAI,QAAQ,MAAO,GAAG,CAAC;CAEjE,OACE,oBAAC,OAAD;EACE,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,WAAW,GACT,kDACA,YAAY,OACZ,SACF;EACK;EACL,MAAK;EACL,GAAI;YAEJ,oBAAC,OAAD;GACE,WAAU;GACV,OAAO,EAAE,OAAO,GAAG,WAAW,GAAG;EAClC,CAAA;CACE,CAAA;AAET,CACF;AAEA,SAAS,cAAc"}

package/dist/components/radio-card-group.cjs

@@ -4,7 +4,7 @@ const require_chunk = require("../chunk-DY84GLCh.cjs");
 let react = require("react");
 react = require_chunk.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/radio-card-group.tsx
 const RadioCardGroupContext = react.createContext(void 0);
 const ARROW_STEP = {
@@ -57,7 +57,7 @@ const RadioCardGroup = react.forwardRef(({ value: valueProp, defaultValue, onVal
 			ref,
 			role: "radiogroup",
 			onKeyDown: handleKeyDown,
-			className: (0, cnfast.cn)("flex flex-col gap-[calc(var(--spark-layout-gap)*var(--radio-card-group-gap-steps,2))]", className),
+			className: (0, cn.cn)("flex flex-col gap-[calc(var(--spark-layout-gap)*var(--radio-card-group-gap-steps,2))]", className),
 			style: {
 				"--radio-card-group-gap-steps": gap,
 				...style
@@ -85,7 +85,7 @@ const RadioCardGroupItem = react.forwardRef(({ value, className, children, disab
 			onClick?.(event);
 			if (!event.defaultPrevented && !isDisabled) ctx.onValueChange(value);
 		},
-		className: (0, cnfast.cn)("h-12 w-full rounded-lg px-4 text-base font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", checked ? "border border-accent bg-base-accent-soft text-accent" : "border border-transparent bg-base-gray-soft text-gray hover:bg-gray-a3", className),
+		className: (0, cn.cn)("h-12 w-full rounded-lg px-4 text-base font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", checked ? "border border-accent bg-base-accent-soft text-accent" : "border border-transparent bg-base-gray-soft text-gray hover:bg-gray-a3", className),
 		...props,
 		children
 	});

package/dist/components/radio-card-group.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio-card-group.cjs","names":["React"],"sources":["../../src/components/radio-card-group.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\ninterface RadioCardGroupContextValue {\n  value: string | undefined\n  onValueChange: (value: string) => void\n  disabled?: boolean\n  name: string\n}\n\nconst RadioCardGroupContext = React.createContext<\n  RadioCardGroupContextValue | undefined\n>(undefined)\n\nconst ARROW_STEP: Record<string, 1 | -1> = {\n  ArrowDown: 1,\n  ArrowRight: 1,\n  ArrowUp: -1,\n  ArrowLeft: -1,\n}\n\ninterface RadioCardGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  value?: string\n  defaultValue?: string\n  onValueChange?: (value: string) => void\n  disabled?: boolean\n  /** Optional name used for ARIA grouping. Defaults to a generated id. */\n  name?: string\n  /** How many `--spark-layout-gap` units apart each card sits. */\n  gap?: number\n}\n\nconst RadioCardGroup = React.forwardRef<HTMLDivElement, RadioCardGroupProps>(\n  (\n    {\n      value: valueProp,\n      defaultValue,\n      onValueChange,\n      disabled,\n      name,\n      gap = 2,\n      className,\n      style,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const generatedName = React.useId()\n    const [internalValue, setInternalValue] = React.useState<\n      string | undefined\n    >(defaultValue)\n    const isControlled = valueProp !== undefined\n    const value = isControlled ? valueProp : internalValue\n\n    const handleValueChange = React.useCallback(\n      (next: string) => {\n        if (!isControlled) setInternalValue(next)\n        onValueChange?.(next)\n      },\n      [isControlled, onValueChange],\n    )\n\n    const ctx = React.useMemo<RadioCardGroupContextValue>(\n      () => ({\n        value,\n        onValueChange: handleValueChange,\n        disabled,\n        name: name ?? generatedName,\n      }),\n      [value, handleValueChange, disabled, name, generatedName],\n    )\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      const step = ARROW_STEP[event.key]\n      if (step === undefined && event.key !== 'Home' && event.key !== 'End')\n        return\n      const radios = [\n        ...event.currentTarget.querySelectorAll<HTMLButtonElement>(\n          '[role=\"radio\"]:not(:disabled)',\n        ),\n      ]\n      if (radios.length === 0) return\n      event.preventDefault()\n\n      let next = 0\n      if (event.key === 'End') {\n        next = radios.length - 1\n      } else if (step !== undefined) {\n        const current = radios.indexOf(\n          document.activeElement as HTMLButtonElement,\n        )\n        if (current !== -1) {\n          next = (current + step + radios.length) % radios.length\n        }\n      }\n      const target = radios[next]\n      if (!target) return\n      target.focus()\n      target.click()\n    }\n\n    return (\n      <RadioCardGroupContext.Provider value={ctx}>\n        {/* oxlint-disable-next-line jsx-a11y/interactive-supports-focus -- radiogroup is a composite: the tab stop belongs on the roving radios, not the container */}\n        <div\n          ref={ref}\n          role=\"radiogroup\"\n          onKeyDown={handleKeyDown}\n          className={cn(\n            'flex flex-col gap-[calc(var(--spark-layout-gap)*var(--radio-card-group-gap-steps,2))]',\n            className,\n          )}\n          style={\n            {\n              '--radio-card-group-gap-steps': gap,\n              ...style,\n            } as React.CSSProperties\n          }\n          {...props}\n        >\n          {children}\n        </div>\n      </RadioCardGroupContext.Provider>\n    )\n  },\n)\n\nRadioCardGroup.displayName = 'RadioCardGroup'\n\ninterface RadioCardGroupItemProps extends Omit<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  'value'\n> {\n  value: string\n}\n\nconst RadioCardGroupItem = React.forwardRef<\n  HTMLButtonElement,\n  RadioCardGroupItemProps\n>(({ value, className, children, disabled, onClick, ...props }, ref) => {\n  const ctx = React.useContext(RadioCardGroupContext)\n  if (!ctx) {\n    throw new Error('RadioCardGroupItem must be used within a RadioCardGroup')\n  }\n\n  const checked = ctx.value === value\n  const isDisabled = disabled ?? ctx.disabled\n\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      role=\"radio\"\n      aria-checked={checked}\n      data-state={checked ? 'checked' : 'unchecked'}\n      tabIndex={checked || ctx.value === undefined ? 0 : -1}\n      disabled={isDisabled}\n      onClick={(event) => {\n        onClick?.(event)\n        if (!event.defaultPrevented && !isDisabled) {\n          ctx.onValueChange(value)\n        }\n      }}\n      className={cn(\n        'h-12 w-full rounded-lg px-4 text-base font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n        checked\n          ? 'border border-accent bg-base-accent-soft text-accent'\n          : 'border border-transparent bg-base-gray-soft text-gray hover:bg-gray-a3',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </button>\n  )\n})\n\nRadioCardGroupItem.displayName = 'RadioCardGroupItem'\n\nexport { RadioCardGroup, RadioCardGroupItem }\nexport type { RadioCardGroupProps, RadioCardGroupItemProps }\n"],"mappings":";;;;;;;;AAUA,MAAM,wBAAwBA,MAAM,cAElC,KAAA,CAAS;AAEX,MAAM,aAAqC;CACzC,WAAW;CACX,YAAY;CACZ,SAAS;CACT,WAAW;AACb;AAaA,MAAM,iBAAiBA,MAAM,YAEzB,EACE,OAAO,WACP,cACA,eACA,UACA,MACA,MAAM,GACN,WACA,OACA,UACA,GAAG,SAEL,QACG;CACH,MAAM,gBAAgBA,MAAM,MAAM;CAClC,MAAM,CAAC,eAAe,oBAAoBA,MAAM,SAE9C,YAAY;CACd,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,QAAQ,eAAe,YAAY;CAEzC,MAAM,oBAAoBA,MAAM,aAC7B,SAAiB;EAChB,IAAI,CAAC,cAAc,iBAAiB,IAAI;EACxC,gBAAgB,IAAI;CACtB,GACA,CAAC,cAAc,aAAa,CAC9B;CAEA,MAAM,MAAMA,MAAM,eACT;EACL;EACA,eAAe;EACf;EACA,MAAM,QAAQ;CAChB,IACA;EAAC;EAAO;EAAmB;EAAU;EAAM;CAAa,CAC1D;CAEA,MAAM,iBAAiB,UAA+C;EACpE,MAAM,OAAO,WAAW,MAAM;EAC9B,IAAI,SAAS,KAAA,KAAa,MAAM,QAAQ,UAAU,MAAM,QAAQ,OAC9D;EACF,MAAM,SAAS,CACb,GAAG,MAAM,cAAc,iBACrB,iCACF,CACF;EACA,IAAI,OAAO,WAAW,GAAG;EACzB,MAAM,eAAe;EAErB,IAAI,OAAO;EACX,IAAI,MAAM,QAAQ,OAChB,OAAO,OAAO,SAAS;OAClB,IAAI,SAAS,KAAA,GAAW;GAC7B,MAAM,UAAU,OAAO,QACrB,SAAS,aACX;GACA,IAAI,YAAY,IACd,QAAQ,UAAU,OAAO,OAAO,UAAU,OAAO;EAErD;EACA,MAAM,SAAS,OAAO;EACtB,IAAI,CAAC,QAAQ;EACb,OAAO,MAAM;EACb,OAAO,MAAM;CACf;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAC,sBAAsB,UAAvB;EAAgC,OAAO;YAErC,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACO;GACL,MAAK;GACL,WAAW;GACX,YAAA,GAAA,OAAA,IACE,yFACA,SACF;GACA,OACE;IACE,gCAAgC;IAChC,GAAG;GACL;GAEF,GAAI;GAEH;EACE,CAAA;CACyB,CAAA;AAEpC,CACF;AAEA,eAAe,cAAc;AAS7B,MAAM,qBAAqBA,MAAM,YAG9B,EAAE,OAAO,WAAW,UAAU,UAAU,SAAS,GAAG,SAAS,QAAQ;CACtE,MAAM,MAAMA,MAAM,WAAW,qBAAqB;CAClD,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,yDAAyD;CAG3E,MAAM,UAAU,IAAI,UAAU;CAC9B,MAAM,aAAa,YAAY,IAAI;CAEnC,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;EACO;EACL,MAAK;EACL,MAAK;EACL,gBAAc;EACd,cAAY,UAAU,YAAY;EAClC,UAAU,WAAW,IAAI,UAAU,KAAA,IAAY,IAAI;EACnD,UAAU;EACV,UAAU,UAAU;GAClB,UAAU,KAAK;GACf,IAAI,CAAC,MAAM,oBAAoB,CAAC,YAC9B,IAAI,cAAc,KAAK;EAE3B;EACA,YAAA,GAAA,OAAA,IACE,qMACA,UACI,yDACA,0EACJ,SACF;EACA,GAAI;EAEH;CACK,CAAA;AAEZ,CAAC;AAED,mBAAmB,cAAc"}
+{"version":3,"file":"radio-card-group.cjs","names":["React"],"sources":["../../src/components/radio-card-group.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\ninterface RadioCardGroupContextValue {\n  value: string | undefined\n  onValueChange: (value: string) => void\n  disabled?: boolean\n  name: string\n}\n\nconst RadioCardGroupContext = React.createContext<\n  RadioCardGroupContextValue | undefined\n>(undefined)\n\nconst ARROW_STEP: Record<string, 1 | -1> = {\n  ArrowDown: 1,\n  ArrowRight: 1,\n  ArrowUp: -1,\n  ArrowLeft: -1,\n}\n\ninterface RadioCardGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  value?: string\n  defaultValue?: string\n  onValueChange?: (value: string) => void\n  disabled?: boolean\n  /** Optional name used for ARIA grouping. Defaults to a generated id. */\n  name?: string\n  /** How many `--spark-layout-gap` units apart each card sits. */\n  gap?: number\n}\n\nconst RadioCardGroup = React.forwardRef<HTMLDivElement, RadioCardGroupProps>(\n  (\n    {\n      value: valueProp,\n      defaultValue,\n      onValueChange,\n      disabled,\n      name,\n      gap = 2,\n      className,\n      style,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const generatedName = React.useId()\n    const [internalValue, setInternalValue] = React.useState<\n      string | undefined\n    >(defaultValue)\n    const isControlled = valueProp !== undefined\n    const value = isControlled ? valueProp : internalValue\n\n    const handleValueChange = React.useCallback(\n      (next: string) => {\n        if (!isControlled) setInternalValue(next)\n        onValueChange?.(next)\n      },\n      [isControlled, onValueChange],\n    )\n\n    const ctx = React.useMemo<RadioCardGroupContextValue>(\n      () => ({\n        value,\n        onValueChange: handleValueChange,\n        disabled,\n        name: name ?? generatedName,\n      }),\n      [value, handleValueChange, disabled, name, generatedName],\n    )\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      const step = ARROW_STEP[event.key]\n      if (step === undefined && event.key !== 'Home' && event.key !== 'End')\n        return\n      const radios = [\n        ...event.currentTarget.querySelectorAll<HTMLButtonElement>(\n          '[role=\"radio\"]:not(:disabled)',\n        ),\n      ]\n      if (radios.length === 0) return\n      event.preventDefault()\n\n      let next = 0\n      if (event.key === 'End') {\n        next = radios.length - 1\n      } else if (step !== undefined) {\n        const current = radios.indexOf(\n          document.activeElement as HTMLButtonElement,\n        )\n        if (current !== -1) {\n          next = (current + step + radios.length) % radios.length\n        }\n      }\n      const target = radios[next]\n      if (!target) return\n      target.focus()\n      target.click()\n    }\n\n    return (\n      <RadioCardGroupContext.Provider value={ctx}>\n        {/* oxlint-disable-next-line jsx-a11y/interactive-supports-focus -- radiogroup is a composite: the tab stop belongs on the roving radios, not the container */}\n        <div\n          ref={ref}\n          role=\"radiogroup\"\n          onKeyDown={handleKeyDown}\n          className={cn(\n            'flex flex-col gap-[calc(var(--spark-layout-gap)*var(--radio-card-group-gap-steps,2))]',\n            className,\n          )}\n          style={\n            {\n              '--radio-card-group-gap-steps': gap,\n              ...style,\n            } as React.CSSProperties\n          }\n          {...props}\n        >\n          {children}\n        </div>\n      </RadioCardGroupContext.Provider>\n    )\n  },\n)\n\nRadioCardGroup.displayName = 'RadioCardGroup'\n\ninterface RadioCardGroupItemProps extends Omit<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  'value'\n> {\n  value: string\n}\n\nconst RadioCardGroupItem = React.forwardRef<\n  HTMLButtonElement,\n  RadioCardGroupItemProps\n>(({ value, className, children, disabled, onClick, ...props }, ref) => {\n  const ctx = React.useContext(RadioCardGroupContext)\n  if (!ctx) {\n    throw new Error('RadioCardGroupItem must be used within a RadioCardGroup')\n  }\n\n  const checked = ctx.value === value\n  const isDisabled = disabled ?? ctx.disabled\n\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      role=\"radio\"\n      aria-checked={checked}\n      data-state={checked ? 'checked' : 'unchecked'}\n      tabIndex={checked || ctx.value === undefined ? 0 : -1}\n      disabled={isDisabled}\n      onClick={(event) => {\n        onClick?.(event)\n        if (!event.defaultPrevented && !isDisabled) {\n          ctx.onValueChange(value)\n        }\n      }}\n      className={cn(\n        'h-12 w-full rounded-lg px-4 text-base font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n        checked\n          ? 'border border-accent bg-base-accent-soft text-accent'\n          : 'border border-transparent bg-base-gray-soft text-gray hover:bg-gray-a3',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </button>\n  )\n})\n\nRadioCardGroupItem.displayName = 'RadioCardGroupItem'\n\nexport { RadioCardGroup, RadioCardGroupItem }\nexport type { RadioCardGroupProps, RadioCardGroupItemProps }\n"],"mappings":";;;;;;;;AAUA,MAAM,wBAAwBA,MAAM,cAElC,KAAA,CAAS;AAEX,MAAM,aAAqC;CACzC,WAAW;CACX,YAAY;CACZ,SAAS;CACT,WAAW;AACb;AAaA,MAAM,iBAAiBA,MAAM,YAEzB,EACE,OAAO,WACP,cACA,eACA,UACA,MACA,MAAM,GACN,WACA,OACA,UACA,GAAG,SAEL,QACG;CACH,MAAM,gBAAgBA,MAAM,MAAM;CAClC,MAAM,CAAC,eAAe,oBAAoBA,MAAM,SAE9C,YAAY;CACd,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,QAAQ,eAAe,YAAY;CAEzC,MAAM,oBAAoBA,MAAM,aAC7B,SAAiB;EAChB,IAAI,CAAC,cAAc,iBAAiB,IAAI;EACxC,gBAAgB,IAAI;CACtB,GACA,CAAC,cAAc,aAAa,CAC9B;CAEA,MAAM,MAAMA,MAAM,eACT;EACL;EACA,eAAe;EACf;EACA,MAAM,QAAQ;CAChB,IACA;EAAC;EAAO;EAAmB;EAAU;EAAM;CAAa,CAC1D;CAEA,MAAM,iBAAiB,UAA+C;EACpE,MAAM,OAAO,WAAW,MAAM;EAC9B,IAAI,SAAS,KAAA,KAAa,MAAM,QAAQ,UAAU,MAAM,QAAQ,OAC9D;EACF,MAAM,SAAS,CACb,GAAG,MAAM,cAAc,iBACrB,iCACF,CACF;EACA,IAAI,OAAO,WAAW,GAAG;EACzB,MAAM,eAAe;EAErB,IAAI,OAAO;EACX,IAAI,MAAM,QAAQ,OAChB,OAAO,OAAO,SAAS;OAClB,IAAI,SAAS,KAAA,GAAW;GAC7B,MAAM,UAAU,OAAO,QACrB,SAAS,aACX;GACA,IAAI,YAAY,IACd,QAAQ,UAAU,OAAO,OAAO,UAAU,OAAO;EAErD;EACA,MAAM,SAAS,OAAO;EACtB,IAAI,CAAC,QAAQ;EACb,OAAO,MAAM;EACb,OAAO,MAAM;CACf;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAC,sBAAsB,UAAvB;EAAgC,OAAO;YAErC,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACO;GACL,MAAK;GACL,WAAW;GACX,YAAA,GAAA,GAAA,IACE,yFACA,SACF;GACA,OACE;IACE,gCAAgC;IAChC,GAAG;GACL;GAEF,GAAI;GAEH;EACE,CAAA;CACyB,CAAA;AAEpC,CACF;AAEA,eAAe,cAAc;AAS7B,MAAM,qBAAqBA,MAAM,YAG9B,EAAE,OAAO,WAAW,UAAU,UAAU,SAAS,GAAG,SAAS,QAAQ;CACtE,MAAM,MAAMA,MAAM,WAAW,qBAAqB;CAClD,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,yDAAyD;CAG3E,MAAM,UAAU,IAAI,UAAU;CAC9B,MAAM,aAAa,YAAY,IAAI;CAEnC,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;EACO;EACL,MAAK;EACL,MAAK;EACL,gBAAc;EACd,cAAY,UAAU,YAAY;EAClC,UAAU,WAAW,IAAI,UAAU,KAAA,IAAY,IAAI;EACnD,UAAU;EACV,UAAU,UAAU;GAClB,UAAU,KAAK;GACf,IAAI,CAAC,MAAM,oBAAoB,CAAC,YAC9B,IAAI,cAAc,KAAK;EAE3B;EACA,YAAA,GAAA,GAAA,IACE,qMACA,UACI,yDACA,0EACJ,SACF;EACA,GAAI;EAEH;CACK,CAAA;AAEZ,CAAC;AAED,mBAAmB,cAAc"}

package/dist/components/radio.cjs

@@ -7,14 +7,14 @@ react = require_chunk.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
 let _base_ui_react_radio = require("@base-ui/react/radio");
 let _base_ui_react_radio_group = require("@base-ui/react/radio-group");
-let cnfast = require("cnfast");
+let cn = require("cn");
 //#region src/components/radio.tsx
 function RadioGroup({ className, styleVariant, color, gap = 3, style, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_radio_group.RadioGroup, {
 		"data-slot": "radio-group",
 		"data-style": styleVariant !== void 0 || color !== void 0 ? styleVariant ?? "solid" : void 0,
 		"data-accent-color": color ? require_lib_accent_colors.accentByColor[color] : void 0,
-		className: (0, cnfast.cn)("grid gap-[calc(var(--spark-layout-gap)*var(--radio-group-gap-steps,3))]", className),
+		className: (0, cn.cn)("grid gap-[calc(var(--spark-layout-gap)*var(--radio-group-gap-steps,3))]", className),
 		style: {
 			"--radio-group-gap-steps": gap,
 			...style
@@ -31,7 +31,7 @@ function Radio({ className, styleVariant, color, render, nativeButton, ...props
 		"data-accent-color": dataAccentColor,
 		nativeButton: nativeButton ?? render === void 0,
 		render: render ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {}),
-		className: (0, cnfast.cn)("peer touch-target relative my-2 inline-flex size-6 shrink-0 cursor-pointer items-center justify-center rounded-full border-2 p-0 transition-colors any-pointer-coarse:my-[calc((2.75rem-var(--spacing)*6)/2)]", "before:absolute before:top-1/2 before:left-1/2 before:size-10 before:-translate-x-1/2 before:-translate-y-1/2 before:content-['']", "focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden", "data-disabled:cursor-not-allowed data-disabled:opacity-50", "border-(--spark-style-idle-border,var(--color-accent-ui)) bg-base-accent-soft data-unchecked:border-(length:--spark-style-border-width,2px)", "data-checked:border-(--spark-radio-ring,var(--spark-9))", className),
+		className: (0, cn.cn)("peer touch-target relative my-2 inline-flex size-6 shrink-0 cursor-pointer items-center justify-center rounded-full border-2 p-0 transition-colors any-pointer-coarse:my-[calc((2.75rem-var(--spacing)*6)/2)]", "before:absolute before:top-1/2 before:left-1/2 before:size-10 before:-translate-x-1/2 before:-translate-y-1/2 before:content-['']", "focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden", "data-disabled:cursor-not-allowed data-disabled:opacity-50", "border-(--spark-style-idle-border,var(--color-accent-ui)) bg-base-accent-soft data-unchecked:border-(length:--spark-style-border-width,2px)", "data-checked:border-(--spark-radio-ring,var(--spark-9))", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_radio.Radio.Indicator, {
 			"data-slot": "radio-indicator",