@acronis-platform/ui-react 3.0.0 → 4.0.0

package/dist/components/ui/confidence-cone/confidence-cone.js.map

@@ -1 +1 @@
-{"version":3,"file":"confidence-cone.js","sources":["../../../../src/components/ui/confidence-cone/confidence-cone.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  Area,\n  CartesianGrid,\n  ComposedChart,\n  Line,\n  ReferenceArea,\n  ReferenceLine,\n  Text,\n  XAxis,\n  YAxis,\n} from 'recharts';\n\nimport { cn } from '@/lib/utils';\nimport {\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n  resolveAxisDomain,\n  resolveAnimation,\n  resolveRotatedTickAnchor,\n  resolveXAxisHeight,\n  resolveXAxisTitle,\n  resolveYAxisTitle,\n  CHART_LABEL_FONT_SIZE,\n  type ChartConfig,\n  type ChartLegendContentProps,\n  type ChartTooltipContentProps,\n  type CartesianChartProps,\n  type ChartAnimationProps,\n} from '../chart';\n\n// A forecast confidence-cone: a solid line over the known/actual period, a\n// dashed line over the forecast period, and a shaded band (the \"cone\") between\n// a lower and upper bound that typically widens with the horizon — visualizing\n// growing uncertainty. Built on the shared Chart primitives; no new tokens\n// (series colors are caller-supplied via `config`). The whole metric renders in\n// one hue — actual and forecast differ by line style, not color — so the cone\n// band and the forecast line both reuse the actual series' color.\n\n// Each series' band is a synthetic `[lower, upper]` range field per row that a\n// recharts <Area> shades; kept out of the tooltip/legend (see the filters\n// below). One band per series, so the key carries the series' actual key — the\n// whole `__cone` prefix is reserved.\nconst BAND_PREFIX = '__cone';\nconst bandKeyFor = (actualKey: string) => `${BAND_PREFIX}:${actualKey}`;\n\n/**\n * Drop every synthetic cone-band range series from a recharts tooltip/legend\n * payload, keeping the real actual/forecast series (and their order). Applied to\n * both the default tooltip and any caller-supplied `tooltipContent`, so no band\n * surfaces regardless of which path renders or how many series are plotted.\n */\nexport function dropConeBand<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined\n): T[] | undefined {\n  return payload?.filter(\n    (item) =>\n      !(typeof item.dataKey === 'string' && item.dataKey.startsWith(BAND_PREFIX))\n  );\n}\n\n/**\n * Reduce a legend payload to the metrics the chart plots — one entry per series.\n * A series' actual, forecast and cone are three recharts series painting a\n * single metric in a single hue, so the legend names each metric once, with its\n * actual series' swatch, instead of listing line styles as separate series.\n */\nexport function keepMetricSeries<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined,\n  actualKeys: readonly string[]\n): T[] | undefined {\n  return payload?.filter(\n    (item) => typeof item.dataKey === 'string' && actualKeys.includes(item.dataKey)\n  );\n}\n\n/**\n * Wrap a caller-supplied `tooltipContent` so the synthetic cone band is stripped\n * from the payload before it renders, while preserving recharts' own mount\n * semantics — a function is mounted via `createElement` (its own component\n * identity + hook state), an element via `cloneElement`. This mirrors what the\n * pass-through charts get by handing `content` straight to recharts, so a\n * function-form tooltip keeps its state across re-renders here too. The returned\n * component is a stable content type (memoize it on `tooltipContent`).\n */\ntype TooltipContentType = NonNullable<\n  React.ComponentProps<typeof ChartTooltip>['content']\n>;\ntype TooltipContentFn = Extract<TooltipContentType, (...args: never[]) => unknown>;\ntype TooltipRenderProps = Parameters<TooltipContentFn>[0];\n\nexport function createConeTooltip(tooltipContent: TooltipContentType) {\n  return function ConeTooltip(props: TooltipRenderProps) {\n    const merged = {\n      ...props,\n      payload: dropConeBand(props.payload),\n    } as TooltipRenderProps;\n    return typeof tooltipContent === 'function'\n      ? React.createElement(\n          tooltipContent as React.FunctionComponent<TooltipRenderProps>,\n          merged\n        )\n      : React.cloneElement(tooltipContent, merged);\n  };\n}\n\n/**\n * One plotted metric: its actual / forecast columns and, optionally, the two\n * bound columns that shade its cone. Omit `lowerKey`/`upperKey` for a band-less\n * metric — a solid line handing off to a bare dashed projection.\n */\nexport interface ConfidenceConeSeries {\n  /** Field for the known/actual values — drawn as a solid line with a filled area. */\n  actualKey: string;\n  /** Field for the projected values — drawn as a dashed line. */\n  forecastKey: string;\n  /** Field for the cone's lower bound. Omit (with `upperKey`) for no cone. */\n  lowerKey?: string;\n  /** Field for the cone's upper bound. Omit (with `lowerKey`) for no cone. */\n  upperKey?: string;\n}\n\n/**\n * The x values of the projected period — every row carrying a forecast value for\n * at least one series, in data order. The first is the hand-off point (where the\n * shaded region and divider start); the whole set drives the forecast tick\n * styling, matched by value so tick `interval` can't skew it the way a tick\n * index would. Exported for unit tests; not part of the package's public API.\n */\nexport function forecastPeriodX(\n  data: ReadonlyArray<Record<string, string | number | null | undefined>>,\n  series: readonly ConfidenceConeSeries[],\n  xKey: string\n): Array<string | number | null | undefined> {\n  return data\n    .filter((row) => series.some(({ forecastKey }) => typeof row[forecastKey] === 'number'))\n    .map((row) => row[xKey]);\n}\n\n/**\n * Build the X-axis tick renderer that sets the projected columns apart: italic,\n * in the metric's hue. Styled inline rather than through the `fill` attribute\n * recharts hands every tick, so the accent survives the class-based tick color\n * a chart theme may apply. A custom tick owns its own text, so the caller's\n * `xTickFormatter` is applied here — recharts only applies it to default ticks.\n * Exported for unit tests; not part of the package's public API.\n */\nexport function createForecastTick(\n  forecastX: ReadonlySet<string | number | null | undefined>,\n  color: string,\n  tickFormatter?: CartesianChartProps['xTickFormatter']\n) {\n  return function ForecastTick({\n    payload,\n    index,\n    ...tickProps\n  }: {\n    payload?: { value?: string | number };\n    index?: number;\n  }) {\n    const value = payload?.value;\n    return (\n      <Text\n        {...tickProps}\n        style={\n          value != null && forecastX.has(value)\n            ? { fontStyle: 'italic', fill: color }\n            : undefined\n        }\n      >\n        {tickFormatter && value != null ? tickFormatter(value, index) : value}\n      </Text>\n    );\n  };\n}\n\n/** A dashed horizontal threshold on the value axis. */\nexport interface ConfidenceConeReferenceLine {\n  /** Position on the value (Y) axis. */\n  value: number;\n  /** Optional caption rendered at the line's right end. */\n  label?: string;\n}\n\n/**\n * Every prop except the one-form-or-the-other requirement `ConfidenceConeProps`\n * layers on below. Exported so the stories can type their `Meta` on a single\n * object shape — Storybook can't split a union's required args between `meta.args`\n * and a story's. Not re-exported from `index.ts`; not part of the public API.\n */\nexport interface ConfidenceConeBaseProps\n  extends Omit<React.ComponentProps<'div'>, 'children'>,\n    CartesianChartProps,\n    ChartAnimationProps {\n  /**\n   * Row-per-point data — the shared x dimension plus each series' actual /\n   * forecast / bound fields. Rows are naturally sparse (a point has either an\n   * actual or a forecast + bounds), so missing fields are allowed. Avoid fields\n   * starting with `__cone` — that prefix is reserved for the internal\n   * prediction-band series.\n   */\n  data: ReadonlyArray<Record<string, string | number | null | undefined>>;\n  /**\n   * Per-series map of `label` / `color` for the actual + forecast lines\n   * (imported from the shared `Chart` primitives). Colors are caller-supplied —\n   * reference an existing semantic `--ui-*` token; there is no chart palette tier\n   * yet. Each metric renders in one hue: its cone band and forecast line both\n   * reuse its actual series' color — actual and forecast differ by line style,\n   * not hue.\n   */\n  config: ChartConfig;\n  /** Category / time axis key (the shared dimension across rows). */\n  xKey: string;\n  /**\n   * Plot several metrics against one shared axis — each with its own actual /\n   * forecast / bound fields and its own hue (from `config[actualKey]`). Takes\n   * precedence over the single-series `actualKey`/`forecastKey`/`lowerKey`/\n   * `upperKey` shorthand below; pass one form or the other, not both. One of the\n   * two forms is required.\n   */\n  series?: readonly ConfidenceConeSeries[];\n  /**\n   * Single-series shorthand — field for the known/actual values, drawn as a\n   * solid line with a filled area. Required (with `forecastKey`) unless `series`\n   * is set, which supersedes it.\n   */\n  actualKey?: string;\n  /**\n   * Single-series shorthand — field for the projected values, drawn as a dashed\n   * line. Required (with `actualKey`) unless `series` is set, which supersedes\n   * it.\n   */\n  forecastKey?: string;\n  /** Field for the cone's lower bound. Omit (with `upperKey`) for no cone. */\n  lowerKey?: string;\n  /** Field for the cone's upper bound. Omit (with `lowerKey`) for no cone. */\n  upperKey?: string;\n  /**\n   * How the known/actual period is drawn: a filled `area` under the line (the\n   * default), or a bare `line` — for a chart where the cone is the only shaded\n   * region, or where several metrics' fills would muddy each other.\n   */\n  actualType?: 'area' | 'line';\n  /** Stroke width of the actual + forecast lines. */\n  strokeWidth?: number;\n  /**\n   * Mark each data point: a filled dot on the observed values, a hollow one on\n   * the projection — so a point reads as measured or predicted at a glance.\n   */\n  showDots?: boolean;\n  /**\n   * Italicize the X-axis ticks over the forecast period and paint them in the\n   * first series' hue, so the projected columns read as projected even when the\n   * shaded region is off.\n   */\n  styleForecastTicks?: boolean;\n  /**\n   * One or more dashed horizontal thresholds on the value axis — e.g. a target\n   * or a capacity limit. Pass a single object or an array to draw several.\n   */\n  referenceLine?: ConfidenceConeReferenceLine | ConfidenceConeReferenceLine[];\n  /**\n   * Set off the forecast period from the actuals with a dashed divider at the\n   * hand-off point (the first row with a forecast value) and a subtle shaded\n   * band over the forecast region.\n   */\n  showForecastRegion?: boolean;\n  showLegend?: boolean;\n}\n\n/**\n * Which columns to plot has to be spelled out one way or the other: the `series`\n * array, or the flat `actualKey` + `forecastKey` shorthand. Expressed as a union\n * so a chart with neither is a compile error rather than a silent plot of axes\n * and nothing else. Both forms together stay legal — `series` wins (see\n * `plotted`), which is what the multi-series stories rely on to clear the args\n * table.\n */\nexport type ConfidenceConeProps = ConfidenceConeBaseProps &\n  (\n    | { series: readonly ConfidenceConeSeries[] }\n    | { actualKey: string; forecastKey: string }\n  );\n\nconst ConfidenceCone = React.forwardRef<HTMLDivElement, ConfidenceConeProps>(\n  (\n    {\n      className,\n      config,\n      data,\n      xKey,\n      series,\n      actualKey,\n      forecastKey,\n      lowerKey,\n      upperKey,\n      xAxisLabel,\n      yAxisLabel,\n      yUnit,\n      actualType = 'area',\n      strokeWidth = 2,\n      showDots = false,\n      styleForecastTicks = false,\n      referenceLine,\n      showForecastRegion = true,\n      showGrid = true,\n      showTooltip = true,\n      showLegend = true,\n      showXAxis = true,\n      showYAxis = true,\n      xTickFormatter,\n      yTickFormatter,\n      xAxisAngle,\n      xAxisInterval,\n      yAxisTickCount,\n      yAxisDomain,\n      gridDashed,\n      gridHorizontal,\n      gridVertical,\n      tooltipContent,\n      animate,\n      animationDuration,\n      animationBegin,\n      animationEasing,\n      ...props\n    },\n    ref\n  ) => {\n    // The flat *Key props are the single-series shorthand for `series`.\n    const plotted = React.useMemo<readonly ConfidenceConeSeries[]>(() => {\n      if (series?.length) return series;\n      if (!actualKey || !forecastKey) return [];\n      return [{ actualKey, forecastKey, lowerKey, upperKey }];\n    }, [series, actualKey, forecastKey, lowerKey, upperKey]);\n\n    const animation = resolveAnimation({\n      animate,\n      animationDuration,\n      animationBegin,\n      animationEasing,\n    });\n    // Memoized so recharts sees a stable content type across renders — a fresh\n    // wrapper each render would remount the caller's tooltip and reset its state.\n    const customTooltip = React.useMemo(\n      () => (tooltipContent ? createConeTooltip(tooltipContent) : undefined),\n      [tooltipContent]\n    );\n\n    const xAxisTitle = resolveXAxisTitle(xAxisLabel);\n    const yAxisTitle = resolveYAxisTitle(yAxisLabel);\n\n    const yDomain = resolveAxisDomain(yAxisDomain);\n\n    // One hue per metric. Each cone and forecast line already paints with its own\n    // series' actual color; re-pointing that series' forecast key's `--color-*`\n    // at it too means nothing downstream — a custom tooltip, a caller's\n    // `var(--color-<forecastKey>)` — can reintroduce a second color.\n    const seriesConfig = React.useMemo(() => {\n      let next: ChartConfig | undefined;\n      for (const { actualKey: aKey, forecastKey: fKey } of plotted) {\n        const actual = config[aKey];\n        const forecast = config[fKey];\n        if (!actual || !forecast) continue;\n        next ??= { ...config };\n        next[fKey] = {\n          label: forecast.label,\n          icon: forecast.icon,\n          ...(actual.theme ? { theme: actual.theme } : { color: actual.color }),\n        };\n      }\n      return next ?? config;\n    }, [config, plotted]);\n\n    const xAxisHeight = resolveXAxisHeight(xAxisLabel, xAxisAngle);\n\n    // Augment each row with one `[lower, upper]` band tuple per coned series for\n    // its Area to shade. Rows missing a numeric bound are left un-coned (the\n    // band breaks there); a series without bounds gets no band at all.\n    const chartData = data.map((row) => {\n      const next: Record<string, unknown> = { ...row };\n      for (const { actualKey: aKey, lowerKey: lKey, upperKey: uKey } of plotted) {\n        if (!lKey || !uKey) continue;\n        const lower = row[lKey];\n        const upper = row[uKey];\n        next[bandKeyFor(aKey)] =\n          typeof lower === 'number' && typeof upper === 'number'\n            ? [lower, upper]\n            : undefined;\n      }\n      return next;\n    });\n\n    const forecastX = forecastPeriodX(data, plotted, xKey);\n    // Set the projected period off from the actuals with a shaded band + a\n    // divider at the hand-off.\n    const forecastStart = showForecastRegion ? forecastX[0] : undefined;\n    const lastX = data[data.length - 1]?.[xKey];\n\n    const renderForecastTick = createForecastTick(\n      new Set(forecastX),\n      `var(--color-${plotted[0]?.actualKey})`,\n      xTickFormatter\n    );\n\n    const referenceLines = referenceLine\n      ? Array.isArray(referenceLine)\n        ? referenceLine\n        : [referenceLine]\n      : [];\n\n    // Everything from here to the `return` is lifted out of the returned tree\n    // only to keep it readable as a flat list of chart children. Nothing in\n    // recharts forces the `render*` helpers to be plain functions: axes and\n    // series register themselves with the chart's store, and `<Cell>` is the\n    // only child still looked up by element type — a component wrapper renders\n    // fine (see AreaChart's `AreaFillGradients`). They stay functions because\n    // they are declared inside the render body, where a component would get a\n    // fresh element type on every render and remount its subtree.\n\n    const renderAxes = () => (\n      <>\n        <XAxis\n          dataKey={xKey}\n          type=\"category\"\n          hide={!showXAxis}\n          tickLine={false}\n          axisLine={false}\n          tickMargin={8}\n          tickFormatter={xTickFormatter}\n          tick={styleForecastTicks ? renderForecastTick : undefined}\n          angle={xAxisAngle}\n          interval={xAxisInterval}\n          textAnchor={resolveRotatedTickAnchor(xAxisAngle)}\n          height={xAxisHeight}\n          label={xAxisTitle}\n        />\n        <YAxis\n          type=\"number\"\n          hide={!showYAxis}\n          tickLine={false}\n          axisLine={false}\n          unit={yUnit}\n          tickFormatter={yTickFormatter}\n          tickCount={yAxisTickCount}\n          domain={yDomain}\n          width={yAxisLabel ? 72 : undefined}\n          label={yAxisTitle}\n        />\n      </>\n    );\n\n    // Set the forecast region off from the actuals (behind everything).\n    const renderForecastRegion = () => (\n      <>\n        {forecastStart != null && lastX != null && (\n          <ReferenceArea\n            x1={forecastStart}\n            x2={lastX}\n            fill=\"var(--ui-background-surface-secondary)\"\n            fillOpacity={0.5}\n            ifOverflow=\"extendDomain\"\n          />\n        )}\n        {forecastStart != null && (\n          <ReferenceLine\n            x={forecastStart}\n            stroke=\"var(--ui-border-on-surface-border)\"\n            strokeDasharray=\"4 4\"\n          />\n        )}\n      </>\n    );\n\n    const renderThreshold = (\n      threshold: ConfidenceConeReferenceLine,\n      index: number\n    ) => (\n      <ReferenceLine\n        key={`${threshold.label ?? 'threshold'}-${index}`}\n        y={threshold.value}\n        stroke=\"var(--ui-text-on-surface-secondary)\"\n        strokeDasharray=\"4 4\"\n        // extendDomain so a threshold beyond the data max stays visible.\n        ifOverflow=\"extendDomain\"\n        label={\n          threshold.label\n            ? {\n                value: threshold.label,\n                position: 'insideTopRight',\n                fill: 'var(--ui-text-on-surface-secondary)',\n                fontSize: CHART_LABEL_FONT_SIZE,\n              }\n            : undefined\n        }\n      />\n    );\n\n    const renderTooltip = () =>\n      customTooltip ? (\n        // Strips the synthetic band before the caller's tooltip sees it — the\n        // `__cone` series feeds the Area, not the tooltip.\n        <ChartTooltip content={customTooltip} />\n      ) : (\n        <ChartTooltip\n          content={(tp) => (\n            <ChartTooltipContent\n              active={tp.active}\n              label={tp.label}\n              // The synthetic band feeds the Area, not the tooltip.\n              payload={\n                dropConeBand(tp.payload) as ChartTooltipContentProps['payload']\n              }\n            />\n          )}\n        />\n      );\n\n    const renderLegend = () => (\n      <ChartLegend\n        content={(lp) => (\n          <ChartLegendContent\n            verticalAlign={lp.verticalAlign}\n            payload={\n              keepMetricSeries(\n                lp.payload,\n                plotted.map((s) => s.actualKey)\n              ) as ChartLegendContentProps['payload']\n            }\n          />\n        )}\n      />\n    );\n\n    // One color per metric — actual and forecast differ by line style, not hue\n    // — so a cone reuses its series' actual color.\n    const renderConeBand = ({\n      actualKey: aKey,\n      lowerKey: lKey,\n      upperKey: uKey,\n    }: ConfidenceConeSeries) =>\n      lKey && uKey ? (\n        <Area\n          key={bandKeyFor(aKey)}\n          // The band paints in the same hue, at the same opacity, as the\n          // actual series' own area, so nothing on the rendered path tells\n          // the two apart. recharts forwards `data-*` onto the path it\n          // draws; the tests select the band through this.\n          data-slot=\"confidence-cone-band\"\n          dataKey={bandKeyFor(aKey)}\n          type=\"monotone\"\n          stroke=\"none\"\n          fill={`var(--color-${aKey})`}\n          fillOpacity={0.15}\n          connectNulls={false}\n          dot={false}\n          activeDot={false}\n          {...animation}\n          legendType=\"none\"\n          tooltipType=\"none\"\n        />\n      ) : null;\n\n    const renderActualMark = ({ actualKey: aKey }: ConfidenceConeSeries) => {\n      // An area and a line take the same props here; only the region under the\n      // curve (and the mark recharts draws) differ. A `Line` gets no fill at\n      // all — `fillOpacity: 0` would also erase its dots.\n      const ActualMark = actualType === 'line' ? Line : Area;\n      const areaFill =\n        actualType === 'line'\n          ? undefined\n          : { fill: `var(--color-${aKey})`, fillOpacity: 0.15 };\n      // Observed points read as measured: LineChart's dot geometry (r 3, 2px\n      // ring) filled with the metric hue. The ring is that same hue, so the\n      // mark is solid — and wide enough against the 2px line not to read as a\n      // mere thickening of it. `fillOpacity: 1` is load-bearing: recharts\n      // merges the parent mark's own presentation props into every dot it\n      // draws, so an `<Area>`'s 0.15 would otherwise wash the dot out to a halo.\n      const dot = showDots\n        ? {\n            r: 3,\n            fill: `var(--color-${aKey})`,\n            fillOpacity: 1,\n            stroke: `var(--color-${aKey})`,\n            strokeWidth: 2,\n          }\n        : false;\n      return (\n        <ActualMark\n          key={aKey}\n          dataKey={aKey}\n          type=\"monotone\"\n          stroke={`var(--color-${aKey})`}\n          strokeWidth={strokeWidth}\n          {...areaFill}\n          dot={dot}\n          activeDot={showDots ? { r: 5 } : false}\n          connectNulls\n          {...animation}\n          // The legend names the metric once, so it carries the swatch that\n          // stands for the whole series rather than the actual line's style.\n          legendType=\"rect\"\n        />\n      );\n    };\n\n    const renderForecastLine = ({\n      actualKey: aKey,\n      forecastKey: fKey,\n    }: ConfidenceConeSeries) => {\n      // Projected points read as predicted: the same LineChart dot, inverted —\n      // the metric's hue as the ring, the surface color as the fill, so the\n      // dashed line doesn't show through the middle. (LineChart leaves the fill\n      // to recharts, whose `Line` defaults it to `#fff`; the token is that same\n      // white in the light theme and also holds up in the dark one.)\n      // `strokeDasharray: 'none'` is load-bearing: recharts merges the parent\n      // mark's presentation props into every dot, so this line's `5 5` would\n      // otherwise break each dot's ring into two arcs.\n      const dot = showDots\n        ? {\n            r: 3,\n            fill: 'var(--ui-background-surface-primary)',\n            stroke: `var(--color-${aKey})`,\n            strokeWidth: 2,\n            strokeDasharray: 'none',\n          }\n        : false;\n      return (\n        <Line\n          key={fKey}\n          dataKey={fKey}\n          type=\"monotone\"\n          stroke={`var(--color-${aKey})`}\n          strokeWidth={strokeWidth}\n          strokeDasharray=\"5 5\"\n          dot={dot}\n          // Paired with `dot` the way every other chart does it — left unset,\n          // the projection would keep recharts' default active dot while the\n          // actuals had none (and a different radius when on).\n          activeDot={showDots ? { r: 5 } : false}\n          connectNulls\n          {...animation}\n        />\n      );\n    };\n\n    return (\n      <div ref={ref} className={cn(className)} {...props}>\n        <ChartContainer\n          config={seriesConfig}\n          className=\"size-full [&_.recharts-label]:fill-foreground\"\n        >\n          <ComposedChart data={chartData as readonly unknown[]}>\n            {showGrid && (\n              <CartesianGrid\n                horizontal={gridHorizontal ?? true}\n                vertical={gridVertical ?? false}\n                strokeDasharray={gridDashed ? '3 3' : undefined}\n              />\n            )}\n            {renderAxes()}\n            {renderForecastRegion()}\n            {referenceLines.map(renderThreshold)}\n            {showTooltip && renderTooltip()}\n            {showLegend && renderLegend()}\n            {/* Every cone renders before any line, so the lines draw on top of\n                all of them. */}\n            {plotted.map(renderConeBand)}\n            {plotted.map(renderActualMark)}\n            {plotted.map(renderForecastLine)}\n          </ComposedChart>\n        </ChartContainer>\n      </div>\n    );\n  }\n);\nConfidenceCone.displayName = 'ConfidenceCone';\n\nexport { ConfidenceCone };\n"],"names":["BAND_PREFIX","bandKeyFor","actualKey","dropConeBand","payload","item","keepMetricSeries","actualKeys","createConeTooltip","tooltipContent","props","merged","React","forecastPeriodX","data","series","xKey","row","forecastKey","createForecastTick","forecastX","color","tickFormatter","index","tickProps","value","jsx","Text","ConfidenceCone","className","config","lowerKey","upperKey","xAxisLabel","yAxisLabel","yUnit","actualType","strokeWidth","showDots","styleForecastTicks","referenceLine","showForecastRegion","showGrid","showTooltip","showLegend","showXAxis","showYAxis","xTickFormatter","yTickFormatter","xAxisAngle","xAxisInterval","yAxisTickCount","yAxisDomain","gridDashed","gridHorizontal","gridVertical","animate","animationDuration","animationBegin","animationEasing","ref","plotted","animation","resolveAnimation","customTooltip","xAxisTitle","resolveXAxisTitle","yAxisTitle","resolveYAxisTitle","yDomain","resolveAxisDomain","seriesConfig","next","aKey","fKey","actual","forecast","xAxisHeight","resolveXAxisHeight","chartData","lKey","uKey","lower","upper","forecastStart","lastX","_a","renderForecastTick","_b","referenceLines","renderAxes","jsxs","Fragment","XAxis","resolveRotatedTickAnchor","YAxis","renderForecastRegion","ReferenceArea","ReferenceLine","renderThreshold","threshold","CHART_LABEL_FONT_SIZE","renderTooltip","ChartTooltip","tp","ChartTooltipContent","renderLegend","ChartLegend","lp","ChartLegendContent","s","renderConeBand","Area","renderActualMark","ActualMark","Line","areaFill","dot","renderForecastLine","cn","ChartContainer","ComposedChart","CartesianGrid"],"mappings":"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"}
+{"version":3,"file":"confidence-cone.js","sources":["../../../../src/components/ui/confidence-cone/confidence-cone.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  Area,\n  CartesianGrid,\n  ComposedChart,\n  Line,\n  ReferenceArea,\n  ReferenceLine,\n  Text,\n  XAxis,\n  YAxis,\n} from 'recharts';\n\nimport { cn } from '@/lib/utils';\nimport {\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n  resolveAxisDomain,\n  resolveAnimation,\n  resolveRotatedTickAnchor,\n  resolveXAxisHeight,\n  resolveXAxisTitle,\n  resolveYAxisTitle,\n  CHART_LABEL_FONT_SIZE,\n  type ChartConfig,\n  type ChartPalette,\n  type ChartLegendContentProps,\n  type ChartTooltipContentProps,\n  type CartesianChartProps,\n  type ChartAnimationProps,\n} from '../chart';\n\n// A forecast confidence-cone: a solid line over the known/actual period, a\n// dashed line over the forecast period, and a shaded band (the \"cone\") between\n// a lower and upper bound that typically widens with the horizon — visualizing\n// growing uncertainty. Built on the shared Chart primitives; no new tokens\n// (series colors are caller-supplied via `config`). The whole metric renders in\n// one hue — actual and forecast differ by line style, not color — so the cone\n// band and the forecast line both reuse the actual series' color.\n\n// Each series' band is a synthetic `[lower, upper]` range field per row that a\n// recharts <Area> shades; kept out of the tooltip/legend (see the filters\n// below). One band per series, so the key carries the series' actual key — the\n// whole `__cone` prefix is reserved.\nconst BAND_PREFIX = '__cone';\nconst bandKeyFor = (actualKey: string) => `${BAND_PREFIX}:${actualKey}`;\n\n/**\n * Drop every synthetic cone-band range series from a recharts tooltip/legend\n * payload, keeping the real actual/forecast series (and their order). Applied to\n * both the default tooltip and any caller-supplied `tooltipContent`, so no band\n * surfaces regardless of which path renders or how many series are plotted.\n */\nexport function dropConeBand<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined\n): T[] | undefined {\n  return payload?.filter(\n    (item) =>\n      !(\n        typeof item.dataKey === 'string' && item.dataKey.startsWith(BAND_PREFIX)\n      )\n  );\n}\n\n/**\n * Reduce a legend payload to the metrics the chart plots — one entry per series.\n * A series' actual, forecast and cone are three recharts series painting a\n * single metric in a single hue, so the legend names each metric once, with its\n * actual series' swatch, instead of listing line styles as separate series.\n */\nexport function keepMetricSeries<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined,\n  actualKeys: readonly string[]\n): T[] | undefined {\n  return payload?.filter(\n    (item) =>\n      typeof item.dataKey === 'string' && actualKeys.includes(item.dataKey)\n  );\n}\n\n/**\n * Wrap a caller-supplied `tooltipContent` so the synthetic cone band is stripped\n * from the payload before it renders, while preserving recharts' own mount\n * semantics — a function is mounted via `createElement` (its own component\n * identity + hook state), an element via `cloneElement`. This mirrors what the\n * pass-through charts get by handing `content` straight to recharts, so a\n * function-form tooltip keeps its state across re-renders here too. The returned\n * component is a stable content type (memoize it on `tooltipContent`).\n */\ntype TooltipContentType = NonNullable<\n  React.ComponentProps<typeof ChartTooltip>['content']\n>;\ntype TooltipContentFn = Extract<\n  TooltipContentType,\n  (...args: never[]) => unknown\n>;\ntype TooltipRenderProps = Parameters<TooltipContentFn>[0];\n\nexport function createConeTooltip(tooltipContent: TooltipContentType) {\n  return function ConeTooltip(props: TooltipRenderProps) {\n    const merged = {\n      ...props,\n      payload: dropConeBand(props.payload),\n    } as TooltipRenderProps;\n    return typeof tooltipContent === 'function'\n      ? React.createElement(\n          tooltipContent as React.FunctionComponent<TooltipRenderProps>,\n          merged\n        )\n      : React.cloneElement(tooltipContent, merged);\n  };\n}\n\n/**\n * One plotted metric: its actual / forecast columns and, optionally, the two\n * bound columns that shade its cone. Omit `lowerKey`/`upperKey` for a band-less\n * metric — a solid line handing off to a bare dashed projection.\n */\nexport interface ConfidenceConeSeries {\n  /** Field for the known/actual values — drawn as a solid line with a filled area. */\n  actualKey: string;\n  /** Field for the projected values — drawn as a dashed line. */\n  forecastKey: string;\n  /** Field for the cone's lower bound. Omit (with `upperKey`) for no cone. */\n  lowerKey?: string;\n  /** Field for the cone's upper bound. Omit (with `lowerKey`) for no cone. */\n  upperKey?: string;\n}\n\n/**\n * The x values of the projected period — every row carrying a forecast value for\n * at least one series, in data order. The first is the hand-off point (where the\n * shaded region and divider start); the whole set drives the forecast tick\n * styling, matched by value so tick `interval` can't skew it the way a tick\n * index would. Exported for unit tests; not part of the package's public API.\n */\nexport function forecastPeriodX(\n  data: ReadonlyArray<Record<string, string | number | null | undefined>>,\n  series: readonly ConfidenceConeSeries[],\n  xKey: string\n): Array<string | number | null | undefined> {\n  return data\n    .filter((row) =>\n      series.some(({ forecastKey }) => typeof row[forecastKey] === 'number')\n    )\n    .map((row) => row[xKey]);\n}\n\n/**\n * Build the X-axis tick renderer that sets the projected columns apart: italic,\n * in the metric's hue. Styled inline rather than through the `fill` attribute\n * recharts hands every tick, so the accent survives the class-based tick color\n * a chart theme may apply. A custom tick owns its own text, so the caller's\n * `xTickFormatter` is applied here — recharts only applies it to default ticks.\n * Exported for unit tests; not part of the package's public API.\n */\nexport function createForecastTick(\n  forecastX: ReadonlySet<string | number | null | undefined>,\n  color: string,\n  tickFormatter?: CartesianChartProps['xTickFormatter']\n) {\n  return function ForecastTick({\n    payload,\n    index,\n    ...tickProps\n  }: {\n    payload?: { value?: string | number };\n    index?: number;\n  }) {\n    const value = payload?.value;\n    return (\n      <Text\n        {...tickProps}\n        style={\n          value != null && forecastX.has(value)\n            ? { fontStyle: 'italic', fill: color }\n            : undefined\n        }\n      >\n        {tickFormatter && value != null ? tickFormatter(value, index) : value}\n      </Text>\n    );\n  };\n}\n\n/** A dashed horizontal threshold on the value axis. */\nexport interface ConfidenceConeReferenceLine {\n  /** Position on the value (Y) axis. */\n  value: number;\n  /** Optional caption rendered at the line's right end. */\n  label?: string;\n}\n\n/**\n * Every prop except the one-form-or-the-other requirement `ConfidenceConeProps`\n * layers on below. Exported so the stories can type their `Meta` on a single\n * object shape — Storybook can't split a union's required args between `meta.args`\n * and a story's. Not re-exported from `index.ts`; not part of the public API.\n */\nexport interface ConfidenceConeBaseProps\n  extends\n    Omit<React.ComponentProps<'div'>, 'children'>,\n    CartesianChartProps,\n    ChartAnimationProps {\n  /**\n   * The dataviz palette this chart's series are painted from. Series that\n   * state no `color` of their own take a stop of it. See `ChartPalette`.\n   */\n  palette?: ChartPalette;\n  /**\n   * Row-per-point data — the shared x dimension plus each series' actual /\n   * forecast / bound fields. Rows are naturally sparse (a point has either an\n   * actual or a forecast + bounds), so missing fields are allowed. Avoid fields\n   * starting with `__cone` — that prefix is reserved for the internal\n   * prediction-band series.\n   */\n  data: ReadonlyArray<Record<string, string | number | null | undefined>>;\n  /**\n   * Per-series map of `label` / `icon` / `tone` for the actual + forecast lines\n   * (imported from the shared `Chart` primitives). Series take their colour from\n   * the container's `palette`; each entry maps a key to a `label` and an optional\n   * `tone`. Each metric renders in one hue: its cone band and forecast line both\n   * reuse its actual series' color — actual and forecast differ by line style,\n   * not hue.\n   */\n  config: ChartConfig;\n  /** Category / time axis key (the shared dimension across rows). */\n  xKey: string;\n  /**\n   * Plot several metrics against one shared axis — each with its own actual /\n   * forecast / bound fields and its own hue (from `config[actualKey]`). Takes\n   * precedence over the single-series `actualKey`/`forecastKey`/`lowerKey`/\n   * `upperKey` shorthand below; pass one form or the other, not both. One of the\n   * two forms is required.\n   */\n  series?: readonly ConfidenceConeSeries[];\n  /**\n   * Single-series shorthand — field for the known/actual values, drawn as a\n   * solid line with a filled area. Required (with `forecastKey`) unless `series`\n   * is set, which supersedes it.\n   */\n  actualKey?: string;\n  /**\n   * Single-series shorthand — field for the projected values, drawn as a dashed\n   * line. Required (with `actualKey`) unless `series` is set, which supersedes\n   * it.\n   */\n  forecastKey?: string;\n  /** Field for the cone's lower bound. Omit (with `upperKey`) for no cone. */\n  lowerKey?: string;\n  /** Field for the cone's upper bound. Omit (with `lowerKey`) for no cone. */\n  upperKey?: string;\n  /**\n   * How the known/actual period is drawn: a filled `area` under the line (the\n   * default), or a bare `line` — for a chart where the cone is the only shaded\n   * region, or where several metrics' fills would muddy each other.\n   */\n  actualType?: 'area' | 'line';\n  /** Stroke width of the actual + forecast lines. */\n  strokeWidth?: number;\n  /**\n   * Mark each data point: a filled dot on the observed values, a hollow one on\n   * the projection — so a point reads as measured or predicted at a glance.\n   */\n  showDots?: boolean;\n  /**\n   * Italicize the X-axis ticks over the forecast period and paint them in the\n   * first series' hue, so the projected columns read as projected even when the\n   * shaded region is off.\n   */\n  styleForecastTicks?: boolean;\n  /**\n   * One or more dashed horizontal thresholds on the value axis — e.g. a target\n   * or a capacity limit. Pass a single object or an array to draw several.\n   */\n  referenceLine?: ConfidenceConeReferenceLine | ConfidenceConeReferenceLine[];\n  /**\n   * Set off the forecast period from the actuals with a dashed divider at the\n   * hand-off point (the first row with a forecast value) and a subtle shaded\n   * band over the forecast region.\n   */\n  showForecastRegion?: boolean;\n  showLegend?: boolean;\n}\n\n/**\n * Which columns to plot has to be spelled out one way or the other: the `series`\n * array, or the flat `actualKey` + `forecastKey` shorthand. Expressed as a union\n * so a chart with neither is a compile error rather than a silent plot of axes\n * and nothing else. Both forms together stay legal — `series` wins (see\n * `plotted`), which is what the multi-series stories rely on to clear the args\n * table.\n */\nexport type ConfidenceConeProps = ConfidenceConeBaseProps &\n  (\n    | { series: readonly ConfidenceConeSeries[] }\n    | { actualKey: string; forecastKey: string }\n  );\n\nconst ConfidenceCone = React.forwardRef<HTMLDivElement, ConfidenceConeProps>(\n  (\n    {\n      className,\n      config,\n      palette,\n      data,\n      xKey,\n      series,\n      actualKey,\n      forecastKey,\n      lowerKey,\n      upperKey,\n      xAxisLabel,\n      yAxisLabel,\n      yUnit,\n      actualType = 'area',\n      strokeWidth = 2,\n      showDots = false,\n      styleForecastTicks = false,\n      referenceLine,\n      showForecastRegion = true,\n      showGrid = true,\n      showTooltip = true,\n      showLegend = true,\n      showXAxis = true,\n      showYAxis = true,\n      xTickFormatter,\n      yTickFormatter,\n      xAxisAngle,\n      xAxisInterval,\n      yAxisTickCount,\n      yAxisDomain,\n      gridDashed,\n      gridHorizontal,\n      gridVertical,\n      tooltipContent,\n      animate,\n      animationDuration,\n      animationBegin,\n      animationEasing,\n      ...props\n    },\n    ref\n  ) => {\n    // The flat *Key props are the single-series shorthand for `series`.\n    const plotted = React.useMemo<readonly ConfidenceConeSeries[]>(() => {\n      if (series?.length) return series;\n      if (!actualKey || !forecastKey) return [];\n      return [{ actualKey, forecastKey, lowerKey, upperKey }];\n    }, [series, actualKey, forecastKey, lowerKey, upperKey]);\n\n    const animation = resolveAnimation({\n      animate,\n      animationDuration,\n      animationBegin,\n      animationEasing,\n    });\n    // Memoized so recharts sees a stable content type across renders — a fresh\n    // wrapper each render would remount the caller's tooltip and reset its state.\n    const customTooltip = React.useMemo(\n      () => (tooltipContent ? createConeTooltip(tooltipContent) : undefined),\n      [tooltipContent]\n    );\n\n    const xAxisTitle = resolveXAxisTitle(xAxisLabel);\n    const yAxisTitle = resolveYAxisTitle(yAxisLabel);\n\n    const yDomain = resolveAxisDomain(yAxisDomain);\n\n    // One hue per metric. Each cone and forecast line already paints with its own\n    // series' actual color; re-pointing that series' forecast key's `--color-*`\n    // at it too means nothing downstream — a custom tooltip, a caller's\n    // `var(--color-<forecastKey>)` — can reintroduce a second color.\n    const seriesConfig = React.useMemo(() => {\n      let next: ChartConfig | undefined;\n      for (const { actualKey: aKey, forecastKey: fKey } of plotted) {\n        const actual = config[aKey];\n        const forecast = config[fKey];\n        if (!actual || !forecast) continue;\n        next ??= { ...config };\n        next[fKey] = {\n          label: forecast.label,\n          icon: forecast.icon,\n          tone: { sameAs: aKey },\n        };\n      }\n      return next ?? config;\n    }, [config, plotted]);\n\n    const xAxisHeight = resolveXAxisHeight(xAxisLabel, xAxisAngle);\n\n    // Augment each row with one `[lower, upper]` band tuple per coned series for\n    // its Area to shade. Rows missing a numeric bound are left un-coned (the\n    // band breaks there); a series without bounds gets no band at all.\n    const chartData = data.map((row) => {\n      const next: Record<string, unknown> = { ...row };\n      for (const {\n        actualKey: aKey,\n        lowerKey: lKey,\n        upperKey: uKey,\n      } of plotted) {\n        if (!lKey || !uKey) continue;\n        const lower = row[lKey];\n        const upper = row[uKey];\n        next[bandKeyFor(aKey)] =\n          typeof lower === 'number' && typeof upper === 'number'\n            ? [lower, upper]\n            : undefined;\n      }\n      return next;\n    });\n\n    const forecastX = forecastPeriodX(data, plotted, xKey);\n    // Set the projected period off from the actuals with a shaded band + a\n    // divider at the hand-off.\n    const forecastStart = showForecastRegion ? forecastX[0] : undefined;\n    const lastX = data[data.length - 1]?.[xKey];\n\n    const renderForecastTick = createForecastTick(\n      new Set(forecastX),\n      `var(--color-${plotted[0]?.actualKey})`,\n      xTickFormatter\n    );\n\n    const referenceLines = referenceLine\n      ? Array.isArray(referenceLine)\n        ? referenceLine\n        : [referenceLine]\n      : [];\n\n    // Everything from here to the `return` is lifted out of the returned tree\n    // only to keep it readable as a flat list of chart children. Nothing in\n    // recharts forces the `render*` helpers to be plain functions: axes and\n    // series register themselves with the chart's store, and `<Cell>` is the\n    // only child still looked up by element type — a component wrapper renders\n    // fine (see AreaChart's `AreaFillGradients`). They stay functions because\n    // they are declared inside the render body, where a component would get a\n    // fresh element type on every render and remount its subtree.\n\n    const renderAxes = () => (\n      <>\n        <XAxis\n          dataKey={xKey}\n          type=\"category\"\n          hide={!showXAxis}\n          tickLine={false}\n          axisLine={false}\n          tickMargin={8}\n          tickFormatter={xTickFormatter}\n          tick={styleForecastTicks ? renderForecastTick : undefined}\n          angle={xAxisAngle}\n          interval={xAxisInterval}\n          textAnchor={resolveRotatedTickAnchor(xAxisAngle)}\n          height={xAxisHeight}\n          label={xAxisTitle}\n        />\n        <YAxis\n          type=\"number\"\n          hide={!showYAxis}\n          tickLine={false}\n          axisLine={false}\n          unit={yUnit}\n          tickFormatter={yTickFormatter}\n          tickCount={yAxisTickCount}\n          domain={yDomain}\n          width={yAxisLabel ? 72 : undefined}\n          label={yAxisTitle}\n        />\n      </>\n    );\n\n    // Set the forecast region off from the actuals (behind everything).\n    const renderForecastRegion = () => (\n      <>\n        {forecastStart != null && lastX != null && (\n          <ReferenceArea\n            x1={forecastStart}\n            x2={lastX}\n            fill=\"var(--ui-background-surface-secondary)\"\n            fillOpacity={0.5}\n            ifOverflow=\"extendDomain\"\n          />\n        )}\n        {forecastStart != null && (\n          <ReferenceLine\n            x={forecastStart}\n            stroke=\"var(--ui-border-on-surface-border)\"\n            strokeDasharray=\"4 4\"\n          />\n        )}\n      </>\n    );\n\n    const renderThreshold = (\n      threshold: ConfidenceConeReferenceLine,\n      index: number\n    ) => (\n      <ReferenceLine\n        key={`${threshold.label ?? 'threshold'}-${index}`}\n        y={threshold.value}\n        stroke=\"var(--ui-text-on-surface-secondary)\"\n        strokeDasharray=\"4 4\"\n        // extendDomain so a threshold beyond the data max stays visible.\n        ifOverflow=\"extendDomain\"\n        label={\n          threshold.label\n            ? {\n                value: threshold.label,\n                position: 'insideTopRight',\n                fill: 'var(--ui-text-on-surface-secondary)',\n                fontSize: CHART_LABEL_FONT_SIZE,\n              }\n            : undefined\n        }\n      />\n    );\n\n    const renderTooltip = () =>\n      customTooltip ? (\n        // Strips the synthetic band before the caller's tooltip sees it — the\n        // `__cone` series feeds the Area, not the tooltip.\n        <ChartTooltip content={customTooltip} />\n      ) : (\n        <ChartTooltip\n          content={(tp) => (\n            <ChartTooltipContent\n              active={tp.active}\n              label={tp.label}\n              // The synthetic band feeds the Area, not the tooltip.\n              payload={\n                dropConeBand(tp.payload) as ChartTooltipContentProps['payload']\n              }\n            />\n          )}\n        />\n      );\n\n    const renderLegend = () => (\n      <ChartLegend\n        content={(lp) => (\n          <ChartLegendContent\n            verticalAlign={lp.verticalAlign}\n            payload={\n              keepMetricSeries(\n                lp.payload,\n                plotted.map((s) => s.actualKey)\n              ) as ChartLegendContentProps['payload']\n            }\n          />\n        )}\n      />\n    );\n\n    // One color per metric — actual and forecast differ by line style, not hue\n    // — so a cone reuses its series' actual color.\n    const renderConeBand = ({\n      actualKey: aKey,\n      lowerKey: lKey,\n      upperKey: uKey,\n    }: ConfidenceConeSeries) =>\n      lKey && uKey ? (\n        <Area\n          key={bandKeyFor(aKey)}\n          // The band paints in the same hue, at the same opacity, as the\n          // actual series' own area, so nothing on the rendered path tells\n          // the two apart. recharts forwards `data-*` onto the path it\n          // draws; the tests select the band through this.\n          data-slot=\"confidence-cone-band\"\n          dataKey={bandKeyFor(aKey)}\n          type=\"monotone\"\n          stroke=\"none\"\n          fill={`var(--color-${aKey})`}\n          fillOpacity={0.15}\n          connectNulls={false}\n          dot={false}\n          activeDot={false}\n          {...animation}\n          legendType=\"none\"\n          tooltipType=\"none\"\n        />\n      ) : null;\n\n    const renderActualMark = ({ actualKey: aKey }: ConfidenceConeSeries) => {\n      // An area and a line take the same props here; only the region under the\n      // curve (and the mark recharts draws) differ. A `Line` gets no fill at\n      // all — `fillOpacity: 0` would also erase its dots.\n      const ActualMark = actualType === 'line' ? Line : Area;\n      const areaFill =\n        actualType === 'line'\n          ? undefined\n          : { fill: `var(--color-${aKey})`, fillOpacity: 0.15 };\n      // Observed points read as measured: LineChart's dot geometry (r 3, 2px\n      // ring) filled with the metric hue. The ring is that same hue, so the\n      // mark is solid — and wide enough against the 2px line not to read as a\n      // mere thickening of it. `fillOpacity: 1` is load-bearing: recharts\n      // merges the parent mark's own presentation props into every dot it\n      // draws, so an `<Area>`'s 0.15 would otherwise wash the dot out to a halo.\n      const dot = showDots\n        ? {\n            r: 3,\n            fill: `var(--color-${aKey})`,\n            fillOpacity: 1,\n            stroke: `var(--color-${aKey})`,\n            strokeWidth: 2,\n          }\n        : false;\n      return (\n        <ActualMark\n          key={aKey}\n          dataKey={aKey}\n          type=\"monotone\"\n          stroke={`var(--color-${aKey})`}\n          strokeWidth={strokeWidth}\n          {...areaFill}\n          dot={dot}\n          activeDot={showDots ? { r: 5 } : false}\n          connectNulls\n          {...animation}\n          // The legend names the metric once, so it carries the swatch that\n          // stands for the whole series rather than the actual line's style.\n          legendType=\"rect\"\n        />\n      );\n    };\n\n    const renderForecastLine = ({\n      actualKey: aKey,\n      forecastKey: fKey,\n    }: ConfidenceConeSeries) => {\n      // Projected points read as predicted: the same LineChart dot, inverted —\n      // the metric's hue as the ring, the surface color as the fill, so the\n      // dashed line doesn't show through the middle. (LineChart leaves the fill\n      // to recharts, whose `Line` defaults it to `#fff`; the token is that same\n      // white in the light theme and also holds up in the dark one.)\n      // `strokeDasharray: 'none'` is load-bearing: recharts merges the parent\n      // mark's presentation props into every dot, so this line's `5 5` would\n      // otherwise break each dot's ring into two arcs.\n      const dot = showDots\n        ? {\n            r: 3,\n            fill: 'var(--ui-background-surface-primary)',\n            stroke: `var(--color-${aKey})`,\n            strokeWidth: 2,\n            strokeDasharray: 'none',\n          }\n        : false;\n      return (\n        <Line\n          key={fKey}\n          dataKey={fKey}\n          type=\"monotone\"\n          stroke={`var(--color-${aKey})`}\n          strokeWidth={strokeWidth}\n          strokeDasharray=\"5 5\"\n          dot={dot}\n          // Paired with `dot` the way every other chart does it — left unset,\n          // the projection would keep recharts' default active dot while the\n          // actuals had none (and a different radius when on).\n          activeDot={showDots ? { r: 5 } : false}\n          connectNulls\n          {...animation}\n        />\n      );\n    };\n\n    return (\n      <div ref={ref} className={cn(className)} {...props}>\n        <ChartContainer\n          config={seriesConfig}\n          palette={palette}\n          className=\"size-full [&_.recharts-label]:fill-foreground\"\n        >\n          <ComposedChart data={chartData as readonly unknown[]}>\n            {showGrid && (\n              <CartesianGrid\n                horizontal={gridHorizontal ?? true}\n                vertical={gridVertical ?? false}\n                strokeDasharray={gridDashed ? '3 3' : undefined}\n              />\n            )}\n            {renderAxes()}\n            {renderForecastRegion()}\n            {referenceLines.map(renderThreshold)}\n            {showTooltip && renderTooltip()}\n            {showLegend && renderLegend()}\n            {/* Every cone renders before any line, so the lines draw on top of\n                all of them. */}\n            {plotted.map(renderConeBand)}\n            {plotted.map(renderActualMark)}\n            {plotted.map(renderForecastLine)}\n          </ComposedChart>\n        </ChartContainer>\n      </div>\n    );\n  }\n);\nConfidenceCone.displayName = 'ConfidenceCone';\n\nexport { ConfidenceCone };\n"],"names":["BAND_PREFIX","bandKeyFor","actualKey","dropConeBand","payload","item","keepMetricSeries","actualKeys","createConeTooltip","tooltipContent","props","merged","React","forecastPeriodX","data","series","xKey","row","forecastKey","createForecastTick","forecastX","color","tickFormatter","index","tickProps","value","jsx","Text","ConfidenceCone","className","config","palette","lowerKey","upperKey","xAxisLabel","yAxisLabel","yUnit","actualType","strokeWidth","showDots","styleForecastTicks","referenceLine","showForecastRegion","showGrid","showTooltip","showLegend","showXAxis","showYAxis","xTickFormatter","yTickFormatter","xAxisAngle","xAxisInterval","yAxisTickCount","yAxisDomain","gridDashed","gridHorizontal","gridVertical","animate","animationDuration","animationBegin","animationEasing","ref","plotted","animation","resolveAnimation","customTooltip","xAxisTitle","resolveXAxisTitle","yAxisTitle","resolveYAxisTitle","yDomain","resolveAxisDomain","seriesConfig","next","aKey","fKey","actual","forecast","xAxisHeight","resolveXAxisHeight","chartData","lKey","uKey","lower","upper","forecastStart","lastX","_a","renderForecastTick","_b","referenceLines","renderAxes","jsxs","Fragment","XAxis","resolveRotatedTickAnchor","YAxis","renderForecastRegion","ReferenceArea","ReferenceLine","renderThreshold","threshold","CHART_LABEL_FONT_SIZE","renderTooltip","ChartTooltip","tp","ChartTooltipContent","renderLegend","ChartLegend","lp","ChartLegendContent","s","renderConeBand","Area","renderActualMark","ActualMark","Line","areaFill","dot","renderForecastLine","cn","ChartContainer","ComposedChart","CartesianGrid"],"mappings":"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"}

package/dist/components/ui/funnel-chart/funnel-chart.js

@@ -1,11 +1,11 @@
-import { jsx as c, jsxs as B } from "react/jsx-runtime";
-import * as A from "react";
-import { cva as ur } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { FunnelChart as fr, Funnel as dr, Cell as mr, LabelList as V } from "recharts";
-import { cn as vr } from "../../../lib/utils.js";
-import { resolveAnimation as hr, resolveLabelFillClass as O } from "../chart/chart-format.js";
-import { ChartContainer as pr, ChartTooltip as br, ChartTooltipContent as Lr, ChartLegend as Cr, ChartLegendContent as Ar } from "../chart/chart.js";
-const Nr = ur("", {
+import { jsx as c, jsxs as V } from "react/jsx-runtime";
+import * as N from "react";
+import { cva as fr } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { FunnelChart as dr, Funnel as mr, Cell as vr, LabelList as O } from "recharts";
+import { cn as hr } from "../../../lib/utils.js";
+import { resolveAnimation as pr, resolveLabelFillClass as R } from "../chart/chart-format.js";
+import { ChartContainer as br, ChartTooltip as Lr, ChartTooltipContent as Cr, ChartLegend as Ar, ChartLegendContent as Nr } from "../chart/chart.js";
+const _r = fr("", {
   variants: {
     lastShape: {
       triangle: "",
@@ -15,12 +15,12 @@ const Nr = ur("", {
   defaultVariants: {
     lastShape: "triangle"
   }
-}), R = {
+}), D = {
   right: "right",
   left: "left",
   inside: "center"
 };
-function _r(r) {
+function Er(r) {
   switch (r) {
     case "right":
       return "left";
@@ -30,152 +30,153 @@ function _r(r) {
       return "right";
   }
 }
-const D = "__stageLabel", G = "__stageValueLabel", Er = 45, Tr = {
+const G = "__stageLabel", j = "__stageValueLabel", Tr = 45, $r = {
   stroke: "var(--ui-border-on-surface-border-active)",
   strokeWidth: 2
-}, U = 96, j = {
+}, W = 96, H = {
   top: 8,
-  right: U,
+  right: W,
   bottom: 8,
   left: 24
-}, $r = "75%";
-function Ir(r) {
+}, Ir = "75%";
+function gr(r) {
   return r.includes("-");
 }
-function gr(r) {
+function Fr(r) {
   const { showLabels: e, labelPosition: t, labelFormat: o } = r;
-  return e && t === "right" && Ir(o) ? $r : void 0;
+  return e && t === "right" && gr(o) ? Ir : void 0;
 }
-function Fr(r) {
-  const { showLabels: e, labelPosition: t, showValueLabels: o, valuePosition: n } = r;
+function xr(r) {
+  const { showLabels: e, labelPosition: t, showValueLabels: o, valuePosition: u } = r;
   return {
-    ...j,
-    left: (e ? t : void 0) === "left" || (o ? n : void 0) === "left" ? U : j.left
+    ...H,
+    left: (e ? t : void 0) === "left" || (o ? u : void 0) === "left" ? W : H.left
   };
 }
-const xr = (r) => {
+const Mr = (r) => {
   const e = typeof r == "number" ? r : Number(r);
   return Number.isFinite(e) ? `${(e * 100).toFixed(1)}%` : String(r);
 };
-function H(r) {
+function U(r) {
   const {
     name: e,
     value: t,
     base: o,
-    format: n,
-    formatter: d,
-    percentFormatter: b = xr
-  } = r, u = d ? d(t) : String(t), v = typeof t == "number" ? t : Number(t), a = o > 0 && Number.isFinite(v) ? b(v / o) : "";
-  switch (n) {
+    format: u,
+    formatter: n,
+    percentFormatter: m = Mr
+  } = r, v = n ? n(t) : String(t), h = typeof t == "number" ? t : Number(t), l = o > 0 && Number.isFinite(h) ? m(h / o) : "";
+  switch (u) {
     case "name":
       return e;
     case "value":
-      return u;
+      return v;
     case "percent":
-      return a;
+      return l;
     case "name-value":
-      return `${e}: ${u}`;
+      return `${e}: ${v}`;
     case "name-percent":
-      return a ? `${e}: ${a}` : e;
+      return l ? `${e}: ${l}` : e;
     case "value-percent":
-      return a ? `${u} (${a})` : u;
+      return l ? `${v} (${l})` : v;
   }
 }
-function Mr(r, e, t) {
+function Pr(r, e, t) {
   if (t <= 1) return r;
-  const o = 100 - (100 - Er) * e / (t - 1);
+  const o = 100 - (100 - Tr) * e / (t - 1);
   return `color-mix(in oklab, ${r} ${o.toFixed(1)}%, var(--ui-background-surface-primary))`;
 }
-const Pr = A.forwardRef(
+const kr = N.forwardRef(
   ({
     className: r,
     config: e,
-    data: t,
-    dataKey: o,
+    palette: t,
+    data: o,
+    dataKey: u,
     nameKey: n,
-    lastShape: d = "triangle",
-    reversed: b = !1,
-    showLabels: u = !0,
-    labelFormat: v = "name",
-    labelPosition: a = "right",
-    showValueLabels: N = !1,
-    valuePosition: W,
-    labelFill: L,
-    labelFormatter: _,
-    percentFormatter: E,
-    showLegend: Y = !1,
-    legendPos: T = "bottom",
-    colorMode: $ = "palette",
-    gradientColor: I,
-    stageSettings: i,
-    showActiveShape: z = !1,
-    stroke: X,
-    strokeWidth: g,
-    funnelWidth: q,
-    margin: w,
-    showTooltip: y = !0,
-    tooltipContent: J,
-    animate: Q,
-    animationDuration: Z,
-    animationBegin: K,
-    animationEasing: rr,
-    ...er
-  }, tr) => {
-    const nr = hr({
-      animate: Q,
-      animationDuration: Z,
-      animationBegin: K,
-      animationEasing: rr
-    }), C = A.useMemo(() => {
-      var P;
-      const l = t.filter(
+    lastShape: m = "triangle",
+    reversed: v = !1,
+    showLabels: h = !0,
+    labelFormat: l = "name",
+    labelPosition: L = "right",
+    showValueLabels: _ = !1,
+    valuePosition: Y,
+    labelFill: C,
+    labelFormatter: E,
+    percentFormatter: T,
+    showLegend: z = !1,
+    legendPos: $ = "bottom",
+    colorMode: I = "palette",
+    gradientColor: g,
+    stageSettings: a,
+    showActiveShape: X = !1,
+    stroke: q,
+    strokeWidth: F,
+    funnelWidth: w,
+    margin: y,
+    showTooltip: J = !0,
+    tooltipContent: Q,
+    animate: Z,
+    animationDuration: K,
+    animationBegin: rr,
+    animationEasing: er,
+    ...tr
+  }, nr) => {
+    const or = pr({
+      animate: Z,
+      animationDuration: K,
+      animationBegin: rr,
+      animationEasing: er
+    }), A = N.useMemo(() => {
+      var k;
+      const i = o.filter(
         (f) => {
-          var p;
-          return !((p = i == null ? void 0 : i[String(f[n])]) != null && p.hidden);
+          var b;
+          return !((b = a == null ? void 0 : a[String(f[n])]) != null && b.hidden);
         }
-      ), s = l.length ? String(l[0][n]) : void 0, h = I ?? (s === void 0 ? void 0 : ((P = i == null ? void 0 : i[s]) == null ? void 0 : P.color) ?? `var(--color-${s})`), sr = l.reduce((f, p) => {
-        const m = Number(p[o]);
-        return Number.isFinite(m) && m > f ? m : f;
+      ), s = i.length ? String(i[0][n]) : void 0, p = g ?? (s === void 0 ? void 0 : ((k = a == null ? void 0 : a[s]) == null ? void 0 : k.color) ?? `var(--color-${s})`), cr = i.reduce((f, b) => {
+        const d = Number(b[u]);
+        return Number.isFinite(d) && d > f ? d : f;
       }, 0);
-      return l.map((f, p) => {
-        var S;
-        const m = String(f[n]), cr = ((S = i == null ? void 0 : i[m]) == null ? void 0 : S.color) ?? ($ === "gradient" && h ? Mr(h, p, l.length) : `var(--color-${m})`), k = {
-          name: m,
-          value: f[o],
-          base: sr,
-          formatter: _,
-          percentFormatter: E
+      return i.map((f, b) => {
+        var B;
+        const d = String(f[n]), ur = ((B = a == null ? void 0 : a[d]) == null ? void 0 : B.color) ?? (I === "gradient" && p ? Pr(p, b, i.length) : `var(--color-${d})`), S = {
+          name: d,
+          value: f[u],
+          base: cr,
+          formatter: E,
+          percentFormatter: T
         };
         return {
           ...f,
-          fill: cr,
-          [D]: H({
-            ...k,
-            format: v
+          fill: ur,
+          [G]: U({
+            ...S,
+            format: l
           }),
-          [G]: H({
-            ...k,
+          [j]: U({
+            ...S,
             format: "value"
           })
         };
       });
     }, [
-      $,
-      t,
-      o,
       I,
-      v,
-      _,
-      n,
+      o,
+      u,
+      g,
+      l,
       E,
-      i
-    ]), or = A.useMemo(() => {
-      const l = /* @__PURE__ */ new Set();
-      return C.flatMap((s) => {
-        const h = String(s[n]);
-        return l.has(h) ? [] : (l.add(h), [
+      n,
+      T,
+      a
+    ]), ar = N.useMemo(() => {
+      const i = /* @__PURE__ */ new Set();
+      return A.flatMap((s) => {
+        const p = String(s[n]);
+        return i.has(p) ? [] : (i.add(p), [
           {
-            value: h,
+            value: p,
             dataKey: n,
             type: "rect",
             color: String(s.fill),
@@ -183,80 +184,80 @@ const Pr = A.forwardRef(
           }
         ]);
       });
-    }, [n, C]), F = W ?? _r(a), x = R[a], M = R[F], ar = {
-      ...Fr({
-        showLabels: u,
-        labelPosition: a,
-        showValueLabels: N,
-        valuePosition: F
+    }, [n, A]), x = Y ?? Er(L), M = D[L], P = D[x], ir = {
+      ...xr({
+        showLabels: h,
+        labelPosition: L,
+        showValueLabels: _,
+        valuePosition: x
       }),
-      ...w
-    }, ir = q ?? gr({ showLabels: u, labelPosition: a, labelFormat: v }), lr = X ?? (g != null ? "var(--ui-border-on-surface-border)" : void 0);
+      ...y
+    }, lr = w ?? Fr({ showLabels: h, labelPosition: L, labelFormat: l }), sr = q ?? (F != null ? "var(--ui-border-on-surface-border)" : void 0);
     return /* @__PURE__ */ c(
       "div",
       {
-        ref: tr,
-        "data-last-shape": d,
-        className: vr(Nr({ lastShape: d }), r),
-        ...er,
-        children: /* @__PURE__ */ c(pr, { config: e, className: "size-full", children: /* @__PURE__ */ B(fr, { margin: ar, children: [
-          y && /* @__PURE__ */ c(
-            br,
+        ref: nr,
+        "data-last-shape": m,
+        className: hr(_r({ lastShape: m }), r),
+        ...tr,
+        children: /* @__PURE__ */ c(br, { config: e, palette: t, className: "size-full", children: /* @__PURE__ */ V(dr, { margin: ir, children: [
+          J && /* @__PURE__ */ c(
+            Lr,
             {
-              content: J ?? /* @__PURE__ */ c(Lr, { nameKey: n, hideLabel: !0 })
+              content: Q ?? /* @__PURE__ */ c(Cr, { nameKey: n, hideLabel: !0 })
             }
           ),
-          Y && /* @__PURE__ */ c(
-            Cr,
+          z && /* @__PURE__ */ c(
+            Ar,
             {
-              verticalAlign: T,
+              verticalAlign: $,
               content: () => /* @__PURE__ */ c(
-                Ar,
+                Nr,
                 {
-                  payload: or,
-                  verticalAlign: T,
+                  payload: ar,
+                  verticalAlign: $,
                   nameKey: n
                 }
               )
             }
           ),
-          /* @__PURE__ */ B(
-            dr,
+          /* @__PURE__ */ V(
+            mr,
             {
-              dataKey: o,
+              dataKey: u,
               nameKey: n,
-              data: C,
-              lastShapeType: d ?? "triangle",
-              reversed: b,
-              width: ir,
-              stroke: lr,
-              strokeWidth: g,
-              activeShape: z ? Tr : void 0,
-              ...nr,
+              data: A,
+              lastShapeType: m ?? "triangle",
+              reversed: v,
+              width: lr,
+              stroke: sr,
+              strokeWidth: F,
+              activeShape: X ? $r : void 0,
+              ...or,
               children: [
-                C.map((l, s) => (
+                A.map((i, s) => (
                   // Keyed by index, not the name: two stages could share a nameKey
                   // value, which would collide as a React key. Same-named stages
                   // intentionally share a color/config entry via `--color-<name>`.
-                  /* @__PURE__ */ c(mr, { fill: String(l.fill) }, s)
+                  /* @__PURE__ */ c(vr, { fill: String(i.fill) }, s)
                 )),
-                u && /* @__PURE__ */ c(
-                  V,
+                h && /* @__PURE__ */ c(
+                  O,
                   {
-                    position: x,
-                    dataKey: D,
-                    className: L ? void 0 : O(x),
-                    fill: L,
+                    position: M,
+                    dataKey: G,
+                    className: C ? void 0 : R(M),
+                    fill: C,
                     stroke: "none"
                   }
                 ),
-                N && /* @__PURE__ */ c(
-                  V,
+                _ && /* @__PURE__ */ c(
+                  O,
                   {
-                    position: M,
-                    dataKey: G,
-                    className: L ? void 0 : O(M),
-                    fill: L,
+                    position: P,
+                    dataKey: j,
+                    className: C ? void 0 : R(P),
+                    fill: C,
                     stroke: "none"
                   }
                 )
@@ -268,14 +269,14 @@ const Pr = A.forwardRef(
     );
   }
 );
-Pr.displayName = "FunnelChart";
+kr.displayName = "FunnelChart";
 export {
-  Pr as FunnelChart,
-  Fr as funnelChartLabelMargin,
-  gr as funnelChartLabelReserve,
-  H as funnelChartLabelText,
-  _r as funnelChartOppositeSide,
-  xr as funnelChartPercent,
-  Nr as funnelChartVariants
+  kr as FunnelChart,
+  xr as funnelChartLabelMargin,
+  Fr as funnelChartLabelReserve,
+  U as funnelChartLabelText,
+  Er as funnelChartOppositeSide,
+  Mr as funnelChartPercent,
+  _r as funnelChartVariants
 };
 //# sourceMappingURL=funnel-chart.js.map