@acronis-platform/ui-react 0.60.0 → 0.61.0

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

@@ -1 +1 @@
-{"version":3,"file":"bar-chart.js","sources":["../../../../src/components/ui/bar-chart/bar-chart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  Bar,\n  BarChart as RechartsBarChart,\n  CartesianGrid,\n  ReferenceLine,\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  type ChartConfig,\n  type CartesianChartProps,\n} from '../chart';\n\n// A typed recharts composition over the shared `Chart` primitives. The two CVA\n// axes are the design's Bar-chart variant set (B2): `orientation` (which way the\n// bars grow) and `layout` (grouped side-by-side vs stacked). The classes stay\n// empty because the recharts SVG — not CSS — draws the bars: the same two props\n// drive recharts' `layout` prop, the axis roles, the `stackId`, and the corner\n// radius below. CVA is kept so the variant set is a first-class, spec-conformant\n// part of the API (matched against ui-spec's api.yaml enums) and exposed via\n// `VariantProps`; the resolved values are also mirrored onto `data-orientation`\n// / `data-layout` for styling hooks and tests.\nconst barChartVariants = cva('', {\n  variants: {\n    orientation: {\n      vertical: '',\n      horizontal: '',\n    },\n    layout: {\n      grouped: '',\n      stacked: '',\n    },\n  },\n  defaultVariants: {\n    orientation: 'vertical',\n    layout: 'grouped',\n  },\n});\n\nexport interface BarChartReferenceLine {\n  /** Fixed position on the value axis. Takes precedence over `average`. */\n  value?: number;\n  /**\n   * Draw the line at the mean of one series (a `dataKeys` entry) or, when\n   * `true`, of every plotted series' values.\n   */\n  average?: boolean | string;\n  /** Optional caption rendered alongside the line. */\n  label?: string;\n}\n\n/**\n * Resolve a `referenceLine` config to a position on the value axis: a fixed\n * `value` wins; otherwise the mean of the requested series (a single `dataKeys`\n * entry, or all of them when `average` is `true`). Returns `undefined` when\n * there is nothing to draw (no config, or no numeric values to average).\n * Exported for unit tests; not part of the package's public API.\n */\nexport function barChartReferenceValue(\n  referenceLine: BarChartReferenceLine | undefined,\n  data: ReadonlyArray<Record<string, string | number>>,\n  dataKeys: string[]\n): number | undefined {\n  if (!referenceLine) return undefined;\n  if (typeof referenceLine.value === 'number') return referenceLine.value;\n  if (!referenceLine.average) return undefined;\n\n  const keys =\n    typeof referenceLine.average === 'string'\n      ? [referenceLine.average]\n      : dataKeys;\n  const nums = data.flatMap((row) =>\n    keys\n      .map((key) => row[key])\n      .filter((value): value is number => typeof value === 'number')\n  );\n  if (nums.length === 0) return undefined;\n  return nums.reduce((sum, n) => sum + n, 0) / nums.length;\n}\n\nexport interface BarChartProps\n  extends Omit<React.ComponentProps<'div'>, 'children'>,\n    VariantProps<typeof barChartVariants>,\n    CartesianChartProps {\n  /** Row-per-category data. Each object holds the category key + one numeric field per series. */\n  data: ReadonlyArray<Record<string, string | number>>;\n  /**\n   * Per-series map of `label` / `color` (imported from the shared `Chart`\n   * primitives). Series colors are caller-supplied — reference an existing\n   * semantic `--ui-*` token; there is no chart palette tier yet.\n   */\n  config: ChartConfig;\n  /** Series to plot — one `<Bar>` per key. Each must exist in `config` and in every data row. */\n  dataKeys: string[];\n  /** Category axis key (the shared dimension across rows, e.g. `\"month\"`). */\n  xKey: string;\n  /**\n   * One or more dashed reference/average lines on the value axis (Y for vertical\n   * bars, X for horizontal). Each is driven by a fixed `value` or a computed\n   * series `average`. Pass a single object or an array to draw several at once.\n   */\n  referenceLine?: BarChartReferenceLine | BarChartReferenceLine[];\n  /** Unit suffix on X-axis tick values (recharts `unit`) — applies when the X axis is numeric (`orientation=\"horizontal\"`). */\n  xUnit?: string;\n  /** Corner radius applied to the growing end of each bar. */\n  barRadius?: number;\n  showLegend?: boolean;\n}\n\nconst BarChart = React.forwardRef<HTMLDivElement, BarChartProps>(\n  (\n    {\n      className,\n      config,\n      data,\n      dataKeys,\n      xKey,\n      referenceLine,\n      xAxisLabel,\n      yAxisLabel,\n      xUnit,\n      yUnit,\n      orientation = 'vertical',\n      layout = 'grouped',\n      barRadius = 4,\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      ...props\n    },\n    ref\n  ) => {\n    // Our `orientation` is bar-direction; recharts' `layout` is the opposite axis.\n    const rechartsLayout = orientation === 'horizontal' ? 'vertical' : 'horizontal';\n    const isStacked = layout === 'stacked';\n\n    const referenceLines = referenceLine\n      ? Array.isArray(referenceLine)\n        ? referenceLine\n        : [referenceLine]\n      : [];\n\n    // Axis titles: the X title sits below the ticks; the Y title is rotated in\n    // the left gutter. Passed to recharts' native `label` (themed via the\n    // `.recharts-label` fill selector on the container).\n    const xAxisTitle = xAxisLabel\n      ? { value: xAxisLabel, position: 'insideBottom' as const, offset: 0 }\n      : undefined;\n    const yAxisTitle = yAxisLabel\n      ? {\n          value: yAxisLabel,\n          angle: -90,\n          position: 'insideLeft' as const,\n          style: { textAnchor: 'middle' as const },\n        }\n      : undefined;\n\n    const yDomain = resolveAxisDomain(yAxisDomain);\n\n    // Room for the X tick row: recharts' default 30, plus a rotated tick row\n    // (+20) and/or the axis title (+18). Additive — both can be present at once,\n    // which the old label-or-angle ternary under-allocated.\n    const xAxisHeight =\n      xAxisLabel || xAxisAngle != null\n        ? 30 + (xAxisAngle != null ? 20 : 0) + (xAxisLabel ? 18 : 0)\n        : undefined;\n\n    // Round only the growing end: top for vertical bars, right for horizontal.\n    const endRadius: [number, number, number, number] =\n      orientation === 'horizontal'\n        ? [0, barRadius, barRadius, 0]\n        : [barRadius, barRadius, 0, 0];\n\n    return (\n      <div\n        ref={ref}\n        data-orientation={orientation}\n        data-layout={layout}\n        className={cn(barChartVariants({ orientation, layout }), className)}\n        {...props}\n      >\n        <ChartContainer\n          config={config}\n          className=\"size-full [&_.recharts-label]:fill-foreground\"\n        >\n          <RechartsBarChart data={data as readonly unknown[]} layout={rechartsLayout}>\n            {showGrid && (\n              <CartesianGrid\n                horizontal={gridHorizontal ?? orientation === 'vertical'}\n                vertical={gridVertical ?? orientation === 'horizontal'}\n                strokeDasharray={gridDashed ? '3 3' : undefined}\n              />\n            )}\n            {orientation === 'horizontal' ? (\n              <>\n                {/* Horizontal bars put the values on X, so the value-axis\n                    props (tickCount/domain) belong here — recharts ignores both\n                    on the category axis. */}\n                <XAxis\n                  type=\"number\"\n                  hide={!showXAxis}\n                  tickLine={false}\n                  axisLine={false}\n                  unit={xUnit}\n                  tickFormatter={xTickFormatter}\n                  angle={xAxisAngle}\n                  interval={xAxisInterval}\n                  textAnchor={\n                    xAxisAngle != null ? (xAxisAngle < 0 ? 'end' : 'start') : undefined\n                  }\n                  tickCount={yAxisTickCount}\n                  domain={yDomain}\n                  height={xAxisHeight}\n                  label={xAxisTitle}\n                />\n                <YAxis\n                  dataKey={xKey}\n                  type=\"category\"\n                  hide={!showYAxis}\n                  tickLine={false}\n                  axisLine={false}\n                  tickFormatter={yTickFormatter}\n                  width={yAxisLabel ? 96 : 80}\n                  label={yAxisTitle}\n                />\n              </>\n            ) : (\n              <>\n                <XAxis\n                  dataKey={xKey}\n                  type=\"category\"\n                  hide={!showXAxis}\n                  tickLine={false}\n                  axisLine={false}\n                  tickFormatter={xTickFormatter}\n                  angle={xAxisAngle}\n                  interval={xAxisInterval}\n                  textAnchor={\n                    xAxisAngle != null ? (xAxisAngle < 0 ? 'end' : 'start') : undefined\n                  }\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            {showTooltip && (\n              <ChartTooltip content={tooltipContent ?? <ChartTooltipContent />} />\n            )}\n            {showLegend && <ChartLegend content={<ChartLegendContent />} />}\n            {dataKeys.map((key, index) => {\n              // In a stack only the last segment's end is rounded; grouped bars\n              // each round their own end.\n              const rounded = isStacked ? index === dataKeys.length - 1 : true;\n              return (\n                <Bar\n                  key={key}\n                  dataKey={key}\n                  fill={`var(--color-${key})`}\n                  stackId={isStacked ? 'a' : undefined}\n                  radius={barRadius > 0 && rounded ? endRadius : undefined}\n                  isAnimationActive={false}\n                />\n              );\n            })}\n            {referenceLines.map((ref, index) => {\n              const value = barChartReferenceValue(ref, data, dataKeys);\n              if (value === undefined) return null;\n              return (\n                <ReferenceLine\n                  key={`${ref.label ?? 'ref'}-${index}`}\n                  // Draw on the value axis: Y for vertical bars, X for horizontal.\n                  {...(orientation === 'horizontal' ? { x: value } : { y: value })}\n                  stroke=\"var(--ui-text-on-surface-secondary)\"\n                  strokeDasharray=\"4 4\"\n                  // extendDomain so a target beyond the data max stays visible.\n                  ifOverflow=\"extendDomain\"\n                  label={\n                    ref.label\n                      ? {\n                          value: ref.label,\n                          // Sit the caption at the top of the line: above the\n                          // right end of a horizontal line (vertical bars), or\n                          // above the top of a vertical line (horizontal bars).\n                          position:\n                            orientation === 'horizontal'\n                              ? 'top'\n                              : 'insideTopRight',\n                          fill: 'var(--ui-text-on-surface-secondary)',\n                          fontSize: 12,\n                        }\n                      : undefined\n                  }\n                />\n              );\n            })}\n          </RechartsBarChart>\n        </ChartContainer>\n      </div>\n    );\n  }\n);\nBarChart.displayName = 'BarChart';\n\nexport { BarChart, barChartVariants };\n"],"names":["barChartVariants","cva","barChartReferenceValue","referenceLine","data","dataKeys","keys","nums","row","key","value","sum","n","BarChart","React","className","config","xKey","xAxisLabel","yAxisLabel","xUnit","yUnit","orientation","layout","barRadius","showGrid","showTooltip","showLegend","showXAxis","showYAxis","xTickFormatter","yTickFormatter","xAxisAngle","xAxisInterval","yAxisTickCount","yAxisDomain","gridDashed","gridHorizontal","gridVertical","tooltipContent","props","ref","rechartsLayout","isStacked","referenceLines","xAxisTitle","yAxisTitle","yDomain","resolveAxisDomain","xAxisHeight","endRadius","jsx","cn","ChartContainer","jsxs","RechartsBarChart","CartesianGrid","Fragment","XAxis","YAxis","ChartTooltip","ChartTooltipContent","ChartLegend","ChartLegendContent","index","rounded","Bar","ReferenceLine"],"mappings":"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"}
+{"version":3,"file":"bar-chart.js","sources":["../../../../src/components/ui/bar-chart/bar-chart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  Bar,\n  BarChart as RechartsBarChart,\n  Brush,\n  CartesianGrid,\n  Cell,\n  LabelList,\n  ReferenceArea,\n  ReferenceLine,\n  Rectangle,\n  Text,\n  XAxis,\n  YAxis,\n} from 'recharts';\n\nimport type { BarShapeProps } from 'recharts/types/cartesian/Bar';\n\nimport { cn } from '@/lib/utils';\nimport {\n  CHART_LABEL_FONT_SIZE,\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n  resolveAnimation,\n  resolveAxisDomain,\n  resolveBrushProps,\n  resolveCartesianLabelPosition,\n  resolveCategoryRange,\n  resolveChartReferenceValue,\n  resolveLabelFillClass,\n  resolveReferenceLineProps,\n  resolveRotatedTickAnchor,\n  resolveXAxisHeight,\n  resolveXAxisTitle,\n  resolveYAxisTitle,\n  toLabelFormatter,\n  toReferenceLineList,\n  type ChartConfig,\n  type ChartReferenceLine,\n  type ChartLegendContentProps,\n  type ChartTooltipContentProps,\n  type CartesianChartProps,\n  type ChartAnimationProps,\n  type ChartBrushProps,\n  type ChartCategoryRange,\n  type ChartDataLabelProps,\n  type CartesianLabelPosition,\n} from '../chart';\n\n// A typed recharts composition over the shared `Chart` primitives. The two CVA\n// axes are the design's Bar-chart variant set (B2): `orientation` (which way the\n// bars grow) and `layout` (grouped side-by-side vs stacked). The classes stay\n// empty because the recharts SVG — not CSS — draws the bars: the same two props\n// drive recharts' `layout` prop, the axis roles, the `stackId`, and the corner\n// radius below. CVA is kept so the variant set is a first-class, spec-conformant\n// part of the API (matched against ui-spec's api.yaml enums) and exposed via\n// `VariantProps`; the resolved values are also mirrored onto `data-orientation`\n// / `data-layout` for styling hooks and tests.\nconst barChartVariants = cva('', {\n  variants: {\n    orientation: {\n      vertical: '',\n      horizontal: '',\n    },\n    layout: {\n      grouped: '',\n      stacked: '',\n    },\n  },\n  defaultVariants: {\n    orientation: 'vertical',\n    layout: 'grouped',\n  },\n});\n\n/**\n * How a bar is painted. `rounded` rounds the growing end by `barRadius`; `pill`\n * rounds every corner to a capsule; `gradient` fades the series color down the\n * bar; `pattern` fills it with diagonal hatching in the series color (a\n * colorblind-safe way to set a subset of bars apart).\n */\nexport type BarChartBarShape = 'rounded' | 'pill' | 'gradient' | 'pattern';\n\n/**\n * Style override for one series over a range of categories — e.g. \"the forecast\n * tail from September onward reads translucent and dashed\". Anything left unset\n * keeps the series' normal painting.\n */\nexport interface BarChartBarSettings extends ChartCategoryRange {\n  /** Fill for the matched bars. Defaults to the series color. */\n  fill?: string;\n  /** Fill opacity for the matched bars. */\n  opacity?: number;\n  /** Outline the matched bars with a dashed stroke in the series color. */\n  dashed?: boolean;\n  /** Shape for the matched bars, overriding the chart's `barShape`. */\n  shape?: BarChartBarShape;\n  /**\n   * Track behind the matched bars: `true` fills the plot height, while a data\n   * field name caps it at that row's value — the headroom between a projection\n   * and its upper bound. A capped track stacks on its bar, so it needs the\n   * default `layout=\"grouped\"`; under `layout=\"stacked\"` it is ignored.\n   */\n  background?: boolean | string;\n}\n\n/** A shaded band behind a range of categories. */\nexport interface BarChartReferenceArea extends ChartCategoryRange {\n  /** Caption above the band. */\n  label?: string;\n  /**\n   * Mark the category ticks under the band — accent color, italic — so the\n   * highlighted range reads on the axis too. On by default.\n   */\n  highlightTicks?: boolean;\n  /**\n   * Draw a dashed rule at the band's leading edge — the hand-off into a\n   * forecast. Off by default.\n   */\n  divider?: boolean;\n}\n\n// Reserved field prefix for the synthetic headroom series a capped track\n// stacks onto its bar. It must never surface in the tooltip or the legend.\nconst HEADROOM_FIELD_PREFIX = '__headroom_';\n\n/**\n * Drop the synthetic headroom series from a recharts tooltip/legend payload,\n * keeping the real series (and their order). `legendType`/`tooltipType=\"none\"`\n * are set on those bars too, but recharts still lists them, so this filter is\n * what actually keeps them out — hence it's unit-tested.\n */\nexport function dropHeadroomSeries<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined,\n  dataKeys?: string[]\n): T[] | undefined {\n  const real = payload?.filter(\n    (item) => !String(item.dataKey).startsWith(HEADROOM_FIELD_PREFIX)\n  );\n  // recharts sorts the legend payload alphabetically by series name by default\n  // (its `itemSorter: 'value'`), so passing `dataKeys` puts the entries back in\n  // the order the caller declared them.\n  return dataKeys\n    ? real?.slice().sort(\n        (a, b) =>\n          dataKeys.indexOf(String(a.dataKey)) -\n          dataKeys.indexOf(String(b.dataKey))\n      )\n    : real;\n}\n\n/**\n * Swap a paint-server fill back to the series color for the chrome. A\n * `gradient` / `pattern` bar fills from `url(#…)`, which paints SVG but means\n * nothing as a CSS background — the legend swatch and the tooltip dot would\n * render blank — so they fall back to the series' own `--color-<key>`.\n */\nexport function withSeriesColor<T extends { dataKey?: unknown; color?: string }>(\n  payload: readonly T[] | undefined\n): T[] | undefined {\n  return payload?.map((item) =>\n    item.color?.startsWith('url(')\n      ? { ...item, color: `var(--color-${String(item.dataKey)})` }\n      : item\n  );\n}\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\ntype LegendContentType = NonNullable<\n  React.ComponentProps<typeof ChartLegend>['content']\n>;\ntype LegendContentFn = Extract<LegendContentType, (...args: never[]) => unknown>;\ntype LegendRenderProps = Parameters<LegendContentFn>[0];\n\n/**\n * Tooltip content that normalizes recharts' payload before anything renders it:\n * the synthetic headroom series stripped, the rows put back in `dataKeys` order,\n * and paint-server fills swapped back to the series color. Falls through to a\n * caller-supplied `content`, preserving recharts' own mount semantics — a\n * function via `createElement` (its own component identity + hook state), an\n * element via `cloneElement`.\n *\n * This is a component rather than a per-render wrapper factory on purpose:\n * recharts renders `content` by cloning the element it is given\n * (`Tooltip.js:27-28`), so a stable module-level type here means the subtree is\n * never remounted, whatever the caller passes.\n */\nexport function NormalizedTooltipContent({\n  content,\n  dataKeys,\n  ...props\n}: Partial<TooltipRenderProps> & {\n  content?: TooltipContentType;\n  dataKeys?: string[];\n}) {\n  const merged = {\n    ...props,\n    payload: withSeriesColor(dropHeadroomSeries(props.payload, dataKeys)),\n  } as TooltipRenderProps;\n\n  if (!content) {\n    return <ChartTooltipContent {...(merged as ChartTooltipContentProps)} />;\n  }\n  return typeof content === 'function'\n    ? React.createElement(\n        content as React.FunctionComponent<TooltipRenderProps>,\n        merged\n      )\n    : React.cloneElement(content, merged);\n}\n\n/**\n * Legend content over the same normalization. Ordering is the reason this\n * applies unconditionally: recharts sorts legend entries alphabetically by\n * series name by default (`itemSorter: 'value'`), so without putting them back\n * in `dataKeys` order the legend would silently reorder itself depending on\n * which bar-styling props happen to be set.\n */\nexport function NormalizedLegendContent({\n  dataKeys,\n  ...props\n}: Partial<LegendRenderProps> & { dataKeys: string[] }) {\n  return (\n    <ChartLegendContent\n      verticalAlign={props.verticalAlign}\n      payload={\n        withSeriesColor(\n          dropHeadroomSeries(props.payload, dataKeys)\n        ) as ChartLegendContentProps['payload']\n      }\n    />\n  );\n}\n\n/** Paint overrides recharts spreads over a bar to mark it as the active one. */\ninterface BarPaintOverride {\n  fill?: string;\n  fillOpacity?: number;\n}\n\n/**\n * Draw a bar, optionally over its full-height track (recharts hands a custom\n * `<Bar shape>` the track geometry alongside the bar's). Only geometry and\n * paint props are forwarded — recharts also passes the whole data entry, and\n * spreading that onto an SVG node would leak data fields into the DOM.\n *\n * `paint` is how the active bar keeps its track: recharts swaps a custom\n * `shape` out for the `activeBar` option while a bar is hovered\n * (`Bar.js` `BarRectangleWithActiveState`), so the active option has to be a\n * shape of its own that redraws the track and applies the highlight itself.\n */\nfunction renderBarWithTrack({\n  bar,\n  track,\n  trackFill,\n  paint,\n}: {\n  bar: Omit<BarShapeProps, 'background' | 'index'>;\n  track?: BarShapeProps['background'];\n  trackFill: string;\n  paint?: BarPaintOverride;\n}) {\n  return (\n    <>\n      {track && (\n        <Rectangle\n          className=\"recharts-bar-background-rectangle\"\n          x={track.x ?? undefined}\n          y={track.y ?? undefined}\n          width={track.width ?? undefined}\n          height={track.height ?? undefined}\n          fill={trackFill}\n        />\n      )}\n      <Rectangle\n        x={bar.x ?? undefined}\n        y={bar.y ?? undefined}\n        width={bar.width ?? undefined}\n        height={bar.height ?? undefined}\n        radius={bar.radius}\n        fill={paint?.fill ?? bar.fill}\n        fillOpacity={paint?.fillOpacity ?? bar.fillOpacity}\n        stroke={bar.stroke}\n        strokeWidth={bar.strokeWidth}\n        strokeDasharray={bar.strokeDasharray}\n      />\n    </>\n  );\n}\n\n/**\n * Build the `<Bar shape>` that draws a range-scoped track. recharts' own\n * `background` is all-or-nothing per series, so the track is drawn per row and\n * hidden where the range doesn't apply.\n */\nexport function createTrackShape({\n  inRange,\n  trackFill,\n  paint,\n}: {\n  inRange: (row: number) => boolean;\n  trackFill: string;\n  paint?: BarPaintOverride;\n}) {\n  return ({ background: track, index: row, ...bar }: BarShapeProps) =>\n    renderBarWithTrack({\n      bar,\n      track: inRange(row) ? track : undefined,\n      trackFill,\n      paint,\n    });\n}\n\n/**\n * The `shape` / `activeBar` pair one series' `<Bar>` is given.\n *\n * They resolve together because recharts swaps a custom `shape` out for the\n * `activeBar` option while a bar is hovered: a range-scoped track has to be\n * redrawn by the active option too, or the track blinks out under the cursor.\n */\nfunction resolveBarShapes({\n  rangeBackground,\n  inRange,\n  trackFill,\n  activeBarOption,\n}: {\n  /**\n   * recharts takes one `background` per series, so a range-scoped one is drawn\n   * per row by a custom shape instead: hidden where it doesn't apply.\n   */\n  rangeBackground: boolean;\n  inRange: (row: number) => boolean;\n  trackFill: string;\n  activeBarOption: BarPaintOverride | false;\n}) {\n  if (!rangeBackground) {\n    return { shape: undefined, activeBar: activeBarOption };\n  }\n  return {\n    shape: createTrackShape({ inRange, trackFill }),\n    activeBar: activeBarOption\n      ? createTrackShape({ inRange, trackFill, paint: activeBarOption })\n      : activeBarOption,\n  };\n}\n\n/**\n * Draw a highlight band plus a dashed rule on its leading edge: the left edge\n * for vertical bars (the category axis runs along X), the top edge otherwise.\n *\n * The band's own paint comes from the props recharts hands the shape — a\n * `<ReferenceArea shape>` still receives the element's `fill`/`fillOpacity`\n * (`ReferenceArea.js` `renderRect`), so hardcoding them here would quietly\n * ignore whatever the caller set.\n */\nfunction renderBandWithDivider({\n  band,\n  vertical,\n}: {\n  band: {\n    x?: number;\n    y?: number;\n    width?: number;\n    height?: number;\n    fill?: string;\n    fillOpacity?: number;\n  };\n  vertical: boolean;\n}) {\n  const { x = 0, y = 0, width = 0, height = 0, fill, fillOpacity } = band;\n  return (\n    <>\n      <Rectangle\n        className=\"recharts-reference-area-rect\"\n        x={x}\n        y={y}\n        width={width}\n        height={height}\n        fill={fill}\n        fillOpacity={fillOpacity}\n      />\n      <line\n        x1={x}\n        y1={y}\n        x2={vertical ? x : x + width}\n        y2={vertical ? y + height : y}\n        stroke=\"var(--ui-border-on-surface-border)\"\n        strokeDasharray=\"4 4\"\n      />\n    </>\n  );\n}\n\n/**\n * The `<ReferenceArea shape>` for a band, or `undefined` so recharts draws its\n * own rect. A custom shape is only needed for the leading-edge rule: a\n * `ReferenceLine` would sit on the tick's centre, and only the band knows where\n * its own edge is.\n */\nfunction resolveBandShape({\n  divider,\n  vertical,\n}: {\n  divider: boolean | undefined;\n  vertical: boolean;\n}) {\n  if (!divider) return undefined;\n  return (band: { x?: number; y?: number; width?: number; height?: number }) =>\n    renderBandWithDivider({ band, vertical });\n}\n\n/**\n * A band's caption as recharts' native `label`. `'insideTop'` is asserted\n * because, read outside the JSX attribute, it would widen to `string` and stop\n * matching recharts' `Position` union.\n */\nfunction resolveBandLabel(label: string | undefined) {\n  return label\n    ? {\n        value: label,\n        position: 'insideTop' as const,\n        fill: 'var(--ui-text-on-surface-secondary)',\n        fontSize: 12,\n      }\n    : undefined;\n}\n\n/**\n * The `<defs>` a `gradient` / `pattern` bar fills from — one paint server per\n * series, since each is painted in that series' own color. Ids are namespaced\n * by the chart instance so two charts on a page can't collide.\n *\n * Safe to render as a component: unlike `Bar`'s cells, the chart renders its\n * children straight through rather than looking them up by type.\n */\nfunction BarPaintServers({\n  id,\n  dataKeys,\n  shapes,\n  horizontal,\n}: {\n  id: string;\n  dataKeys: string[];\n  shapes: ReadonlySet<BarChartBarShape>;\n  /** Bars grow along X, so a gradient runs left-to-right instead of top-down. */\n  horizontal: boolean;\n}) {\n  const hasGradient = shapes.has('gradient');\n  const hasPattern = shapes.has('pattern');\n  if (!hasGradient && !hasPattern) return null;\n\n  return (\n    <defs>\n      {dataKeys.map((key) => (\n        <React.Fragment key={key}>\n          {hasGradient && (\n            <linearGradient\n              id={`${id}-gradient-${key}`}\n              x1=\"0\"\n              y1=\"0\"\n              x2={horizontal ? '1' : '0'}\n              y2={horizontal ? '0' : '1'}\n            >\n              <stop\n                offset=\"0%\"\n                stopColor={`var(--color-${key})`}\n                stopOpacity={1}\n              />\n              <stop\n                offset=\"100%\"\n                stopColor={`var(--color-${key})`}\n                stopOpacity={0.35}\n              />\n            </linearGradient>\n          )}\n          {hasPattern && (\n            <pattern\n              id={`${id}-pattern-${key}`}\n              patternUnits=\"userSpaceOnUse\"\n              width={6}\n              height={6}\n              patternTransform=\"rotate(45)\"\n            >\n              <rect\n                width={6}\n                height={6}\n                fill={`var(--color-${key})`}\n                fillOpacity={0.25}\n              />\n              <line\n                x1={0}\n                y1={0}\n                x2={0}\n                y2={6}\n                stroke={`var(--color-${key})`}\n                strokeWidth={3}\n              />\n            </pattern>\n          )}\n        </React.Fragment>\n      ))}\n    </defs>\n  );\n}\n\n/** Corner radius as recharts' `Rectangle` takes it: one value or a 4-tuple. */\ntype BarRadius = number | [number, number, number, number] | undefined;\n\ninterface RangeCellsOptions {\n  data: ReadonlyArray<Record<string, string | number>>;\n  /** `data` plus the synthetic headroom fields, if any were added. */\n  chartData: ReadonlyArray<Record<string, string | number>>;\n  xKey: string;\n  seriesKey: string;\n  settings: BarChartBarSettings;\n  /** Inclusive row bounds the settings apply to. */\n  range: [number, number];\n  headroomKey: string | undefined;\n  barShape: BarChartBarShape;\n  rounded: boolean;\n  fillOf: (key: string, shape: BarChartBarShape) => string;\n  radiusFor: (shape: BarChartBarShape, rounded: boolean) => BarRadius;\n}\n\n/**\n * The `<Cell>` list that applies a series' `barSettings` over its range: the\n * matched rows take the override fill/opacity/dash/shape, the rest keep the\n * series' normal painting.\n *\n * A plain function returning the elements, deliberately not a component:\n * `Bar` discovers its cells with `findAllByType(props.children, Cell)`\n * (recharts `Bar.js`), which matches each direct child on its own display\n * name. Wrapping these in a component would make that lookup find nothing and\n * silently drop every per-range style — no error, just unstyled bars.\n * Returning an array keeps them direct children, since recharts' `toArray`\n * flattens arrays and unwraps fragments.\n */\nfunction rangeCells({\n  data,\n  chartData,\n  xKey,\n  seriesKey,\n  settings,\n  range,\n  headroomKey,\n  barShape,\n  rounded,\n  fillOf,\n  radiusFor,\n}: RangeCellsOptions) {\n  const { fill, opacity, dashed } = settings;\n\n  return data.map((row, rowIndex) => {\n    const on = rowIndex >= range[0] && rowIndex <= range[1];\n    const shape = (on && settings.shape) || barShape;\n    // Only a row that actually carries headroom gives up its rounded end — a\n    // row in range whose upper bound is missing, or no higher than its value,\n    // keeps it.\n    const stacksHeadroom =\n      headroomKey !== undefined &&\n      Number(\n        (chartData[rowIndex] as Record<string, unknown>)?.[\n          `${HEADROOM_FIELD_PREFIX}${seriesKey}`\n        ]\n      ) > 0;\n\n    return (\n      <Cell\n        key={`${seriesKey}-${String(row[xKey])}-${rowIndex}`}\n        fill={\n          on ? (fill ?? fillOf(seriesKey, shape)) : fillOf(seriesKey, barShape)\n        }\n        fillOpacity={on ? opacity : undefined}\n        stroke={on && dashed ? `var(--color-${seriesKey})` : undefined}\n        strokeWidth={on && dashed ? 1 : undefined}\n        strokeDasharray={on && dashed ? '4 3' : undefined}\n        // Cell types `radius` as the SVG attribute, but it feeds recharts'\n        // Rectangle, which takes the 4-tuple. A bar with headroom stacked on it\n        // hands the rounded end to that segment instead.\n        radius={\n          (stacksHeadroom ? undefined : radiusFor(shape, rounded)) as\n            | number\n            | undefined\n        }\n      />\n    );\n  });\n}\n\nexport interface BarChartProps\n  extends Omit<React.ComponentProps<'div'>, 'children'>,\n    VariantProps<typeof barChartVariants>,\n    CartesianChartProps,\n    ChartAnimationProps,\n    ChartBrushProps,\n    ChartDataLabelProps {\n  /** Row-per-category data. Each object holds the category key + one numeric field per series. */\n  data: ReadonlyArray<Record<string, string | number>>;\n  /**\n   * Per-series map of `label` / `color` (imported from the shared `Chart`\n   * primitives). Series colors are caller-supplied — reference an existing\n   * semantic `--ui-*` token; there is no chart palette tier yet.\n   */\n  config: ChartConfig;\n  /** Series to plot — one `<Bar>` per key. Each must exist in `config` and in every data row. */\n  dataKeys: string[];\n  /** Category axis key (the shared dimension across rows, e.g. `\"month\"`). */\n  xKey: string;\n  /**\n   * One or more dashed reference/average lines on the value axis (Y for vertical\n   * bars, X for horizontal). Each is driven by a fixed `value` or a computed\n   * series `average`. Pass a single object or an array to draw several at once.\n   */\n  referenceLine?: ChartReferenceLine | ChartReferenceLine[];\n  /**\n   * One or more shaded bands behind a range of categories — e.g. a forecast\n   * period. Pass a single object or an array to draw several.\n   */\n  referenceArea?: BarChartReferenceArea | BarChartReferenceArea[];\n  /**\n   * Per-series style override for a range of categories, keyed by `dataKeys`\n   * entry. Bars outside a series' range — and series with no entry — render\n   * normally.\n   */\n  barSettings?: Record<string, BarChartBarSettings>;\n  /** Unit suffix on X-axis tick values (recharts `unit`) — applies when the X axis is numeric (`orientation=\"horizontal\"`). */\n  xUnit?: string;\n  /** Corner radius applied to the growing end of each bar. */\n  barRadius?: number;\n  /** How every bar is painted. Per-range overrides come from `barSettings`. */\n  barShape?: BarChartBarShape;\n  /** Fixed bar thickness, in px. Unset, recharts sizes bars from the available width. */\n  barSize?: number;\n  /** Upper bound on the computed bar thickness, in px. */\n  maxBarSize?: number;\n  /** Gap between bars of the same category, in px or a percentage string. */\n  barGap?: number | string;\n  /** Gap between category groups, in px or a percentage string. */\n  barCategoryGap?: number | string;\n  /**\n   * Minimum rendered length for a bar, in px, so a tiny value stays visible. A\n   * value of exactly `0` still renders nothing — a floor on it would read as a\n   * small positive.\n   */\n  minPointSize?: number;\n  /** Draw a full-height track behind every bar. */\n  showBackground?: boolean;\n  /** Fill for the track background. Defaults to the secondary surface. */\n  backgroundFill?: string;\n  /** Highlight the hovered bar. */\n  showActiveBar?: boolean;\n  /** Painting of the hovered bar when `showActiveBar` is on. */\n  activeBar?: {\n    /** Fill for the hovered bar. Defaults to the series color. */\n    fill?: string;\n    /** Fill opacity for the hovered bar. */\n    opacity?: number;\n  };\n  showLegend?: boolean;\n  /**\n   * Position of the value labels when `showLabels` is on. Defaults to the growing\n   * end — `top` for vertical bars, `right` for horizontal.\n   */\n  labelPosition?: CartesianLabelPosition;\n}\n\nconst BarChart = React.forwardRef<HTMLDivElement, BarChartProps>(\n  (\n    {\n      className,\n      config,\n      data,\n      dataKeys,\n      xKey,\n      referenceLine,\n      referenceArea,\n      barSettings,\n      xAxisLabel,\n      yAxisLabel,\n      xUnit,\n      yUnit,\n      orientation = 'vertical',\n      layout = 'grouped',\n      barRadius = 4,\n      barShape = 'rounded',\n      barSize,\n      maxBarSize,\n      barGap,\n      barCategoryGap,\n      minPointSize,\n      showBackground = false,\n      backgroundFill = 'var(--ui-background-surface-secondary)',\n      showActiveBar = false,\n      activeBar,\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      showLabels = false,\n      labelPosition,\n      labelFormatter,\n      showBrush = false,\n      brushHeight,\n      brushAriaLabel,\n      ...props\n    },\n    ref\n  ) => {\n    const animation = resolveAnimation({\n      animate,\n      animationDuration,\n      animationBegin,\n      animationEasing,\n    });\n    // Our `orientation` is bar-direction; recharts' `layout` is the opposite axis.\n    const rechartsLayout = orientation === 'horizontal' ? 'vertical' : 'horizontal';\n    const isStacked = layout === 'stacked';\n    // Labels sit at the growing end of the bar: above vertical bars, to the\n    // right of horizontal ones — or centred in the segment when stacked.\n    const barLabelPosition = resolveCartesianLabelPosition({\n      labelPosition,\n      isStacked,\n      growingEnd: orientation === 'horizontal' ? 'right' : 'top',\n    });\n\n    const referenceLines = toReferenceLineList(referenceLine);\n\n    // Bands + the per-series overrides resolved to inclusive row indices once,\n    // so the Cells below are a lookup rather than a search per bar.\n    const referenceAreas = (\n      referenceArea\n        ? Array.isArray(referenceArea)\n          ? referenceArea\n          : [referenceArea]\n        : []\n    )\n      .map((area) => ({ area, range: resolveCategoryRange(area, data, xKey) }))\n      .filter(\n        (entry): entry is { area: BarChartReferenceArea; range: [number, number] } =>\n          entry.range !== undefined\n      );\n\n    const settingsByKey = new Map(\n      dataKeys.flatMap((key) => {\n        const settings = barSettings?.[key];\n        const range = settings\n          ? resolveCategoryRange(settings, data, xKey)\n          : undefined;\n        return settings && range ? [[key, { settings, range }] as const] : [];\n      })\n    );\n\n    // A capped track is drawn as a synthetic remainder (upper bound minus the\n    // bar's own value) stacked on the bar, so recharts scales and animates it\n    // rather than us guessing the axis scale from a mid-animation geometry.\n    const headroomKeys = new Map(\n      isStacked\n        ? []\n        : Array.from(settingsByKey, ([key, entry]) =>\n            typeof entry.settings.background === 'string'\n              ? ([key, entry.settings.background] as const)\n              : undefined\n          ).filter((pair): pair is readonly [string, string] => pair !== undefined)\n    );\n\n    const chartData = headroomKeys.size\n      ? data.map((row, rowIndex) => {\n          const extra: Record<string, number> = {};\n          headroomKeys.forEach((upperKey, key) => {\n            const entry = settingsByKey.get(key);\n            if (!entry) return;\n            const [start, end] = entry.range;\n            if (rowIndex < start || rowIndex > end) return;\n            const value = row[key];\n            const upper = row[upperKey];\n            if (typeof value !== 'number' || typeof upper !== 'number') return;\n            extra[`${HEADROOM_FIELD_PREFIX}${key}`] = Math.max(0, upper - value);\n          });\n          return { ...row, ...extra };\n        })\n      : data;\n\n    // The ticks under a band pick up the accent styling unless the band opts\n    // out. Resolved to the categories' own values rather than kept as row\n    // indices, because neither index a tick carries can be trusted here: the\n    // `index` prop is a position in the list recharts actually renders, which\n    // a numeric `interval` (and the default `preserveEnd`, dropping labels that\n    // don't fit) has already filtered, and `payload.index` is relative to the\n    // slice a `showBrush` selection leaves. The value survives both.\n    const highlightedValues = new Set(\n      referenceAreas\n        .filter(({ area }) => area.highlightTicks !== false)\n        .flatMap(({ range }) =>\n          data.slice(range[0], range[1] + 1).map((row) => row[xKey])\n        )\n    );\n\n    // recharts places the tick and hands the element its final geometry; we\n    // reuse its own <Text> so angle/anchor behavior is unchanged and only add\n    // the accent styling for the highlighted range. The formatter still takes\n    // the rendered position, since that is what recharts passes its own\n    // `tickFormatter`.\n    const categoryTick = highlightedValues.size\n      ? ({\n          payload,\n          index,\n          ...tickProps\n        }: {\n          payload: { value: string | number };\n          index: number;\n        }) => {\n          const formatter =\n            orientation === 'horizontal' ? yTickFormatter : xTickFormatter;\n          const value = formatter\n            ? formatter(payload.value as never, index)\n            : payload.value;\n          return (\n            <Text\n              {...tickProps}\n              className={cn(\n                'fill-muted-foreground',\n                highlightedValues.has(payload.value) && 'fill-primary italic'\n              )}\n              fontSize={12}\n            >\n              {value}\n            </Text>\n          );\n        }\n      : undefined;\n\n    // recharts spreads this over the bar's own props, so an explicitly\n    // `undefined` fill would wipe the series color (an unfilled path paints\n    // black). Only set what the caller asked for, and dim by default so\n    // `showActiveBar` alone is visible.\n    const activeBarOption = showActiveBar\n      ? {\n          ...(activeBar?.fill !== undefined ? { fill: activeBar.fill } : {}),\n          fillOpacity: activeBar?.opacity ?? 0.85,\n        }\n      : false;\n\n    // `gradient` and `pattern` paint from an SVG def, so the ids have to be\n    // unique per chart instance — same guard the shared container applies.\n    const defsId = `bar-${React.useId().replace(/:/g, '')}`;\n    const usedShapes = new Set<BarChartBarShape>([barShape]);\n    settingsByKey.forEach(({ settings }) => {\n      if (settings.shape) usedShapes.add(settings.shape);\n    });\n    // recharts applies a flat minPointSize to zeroes too, which would draw a\n    // sliver where there is nothing to show. For a grouped bar it hands the\n    // callback the row's own value, but inside a stack it hands the running\n    // total, so a zero segment riding on a non-zero stack would slip through —\n    // there the value is read back off the row instead. That read uses the\n    // index recharts counts from the *displayed* slice, so a stacked chart\n    // whose brush has been dragged off its full range falls back to flooring\n    // the zero; the plain (unbrushed) stack, which is what the prop is for, is\n    // exact.\n    const minPointSizeFor = (key: string) =>\n      minPointSize === undefined\n        ? undefined\n        : (top: number | undefined | null, row: number) => {\n            const own = isStacked ? chartData[row]?.[key] : top;\n            return typeof own === 'number' && own !== 0 ? minPointSize : 0;\n          };\n\n    const fillOf = (key: string, shape: BarChartBarShape) =>\n      shape === 'gradient'\n        ? `url(#${defsId}-gradient-${key})`\n        : shape === 'pattern'\n          ? `url(#${defsId}-pattern-${key})`\n          : `var(--color-${key})`;\n\n    // Axis titles: the X title sits below the ticks; the Y title is rotated in\n    // the left gutter. Passed to recharts' native `label` (themed via the\n    // `.recharts-label` fill selector on the container).\n    const xAxisTitle = resolveXAxisTitle(xAxisLabel);\n    const yAxisTitle = resolveYAxisTitle(yAxisLabel);\n\n    const yDomain = resolveAxisDomain(yAxisDomain);\n\n    const xAxisHeight = resolveXAxisHeight(xAxisLabel, xAxisAngle);\n\n    // Round only the growing end: top for vertical bars, right for horizontal.\n    const endRadius: [number, number, number, number] =\n      orientation === 'horizontal'\n        ? [0, barRadius, barRadius, 0]\n        : [barRadius, barRadius, 0, 0];\n    // A pill rounds every corner; recharts clamps the radius to half the bar's\n    // shorter side, so an oversized number gives a true capsule at any width.\n    const radiusFor = (shape: BarChartBarShape, rounded: boolean) =>\n      shape === 'pill'\n        ? 9999\n        : barRadius > 0 && rounded\n          ? endRadius\n          : undefined;\n\n    // Both take the normalization unconditionally: gating it on \"is a\n    // headroom/paint-server series in play\" is what let the legend's ordering\n    // drift between otherwise identical charts. The helpers are no-ops when\n    // there is nothing to strip or recolor.\n    const tooltipElement = (\n      <NormalizedTooltipContent content={tooltipContent} dataKeys={dataKeys} />\n    );\n    const legendElement = <NormalizedLegendContent dataKeys={dataKeys} />;\n\n    // The long chart children are lifted into these renderers so the returned\n    // tree reads as a flat list. They are plain functions, not components:\n    // recharts looks some of its children up by element type (see `rangeCells`\n    // above), so what they return has to stay a *direct* child — an array or a\n    // fragment is flattened, a component wrapper would not be.\n\n    // `orientation` decides which axis is numeric, and with it which axis the\n    // value props (unit/tickCount/domain) and the category props (dataKey/tick)\n    // belong to — recharts ignores each set on the other axis. Both branches\n    // stay spelled out because what differs is the prop *set*, not a couple of\n    // values: folding them into one shared props object would trade a readable\n    // fork for a merge whose per-axis prop list has to be re-derived by eye.\n    const renderAxes = () =>\n      orientation === 'horizontal' ? (\n        <>\n          {/* Horizontal bars put the values on X, so the value-axis props\n              (tickCount/domain) belong here — recharts ignores both on the\n              category axis. */}\n          <XAxis\n            type=\"number\"\n            hide={!showXAxis}\n            tickLine={false}\n            axisLine={false}\n            unit={xUnit}\n            tickFormatter={xTickFormatter}\n            angle={xAxisAngle}\n            interval={xAxisInterval}\n            textAnchor={resolveRotatedTickAnchor(xAxisAngle)}\n            tickCount={yAxisTickCount}\n            domain={yDomain}\n            height={xAxisHeight}\n            label={xAxisTitle}\n          />\n          <YAxis\n            dataKey={xKey}\n            type=\"category\"\n            hide={!showYAxis}\n            tickLine={false}\n            axisLine={false}\n            tick={categoryTick}\n            tickFormatter={yTickFormatter}\n            width={yAxisLabel ? 96 : 80}\n            label={yAxisTitle}\n          />\n        </>\n      ) : (\n        <>\n          <XAxis\n            dataKey={xKey}\n            type=\"category\"\n            hide={!showXAxis}\n            tickLine={false}\n            axisLine={false}\n            tick={categoryTick}\n            tickFormatter={xTickFormatter}\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    const renderSeries = () =>\n      dataKeys.map((key, index) => {\n        // In a stack only the last segment's end is rounded; grouped bars\n        // each round their own end.\n        const rounded = isStacked ? index === dataKeys.length - 1 : true;\n        const entry = settingsByKey.get(key);\n        const inRange = (row: number) =>\n          entry !== undefined && row >= entry.range[0] && row <= entry.range[1];\n        const headroomKey = headroomKeys.get(key);\n        const { shape, activeBar: activeBarShape } = resolveBarShapes({\n          rangeBackground: entry?.settings.background === true,\n          inRange,\n          trackFill: backgroundFill,\n          activeBarOption,\n        });\n        const cells =\n          entry &&\n          rangeCells({\n            data,\n            chartData,\n            xKey,\n            seriesKey: key,\n            settings: entry.settings,\n            range: entry.range,\n            headroomKey,\n            barShape,\n            rounded,\n            fillOf,\n            radiusFor,\n          });\n        const labels = showLabels && (\n          <LabelList\n            dataKey={key}\n            position={barLabelPosition}\n            formatter={toLabelFormatter(labelFormatter)}\n            className={resolveLabelFillClass(barLabelPosition)}\n            fontSize={CHART_LABEL_FONT_SIZE}\n          />\n        );\n        return (\n          <React.Fragment key={key}>\n            <Bar\n              dataKey={key}\n              fill={fillOf(key, barShape)}\n              // Its own stack, so the headroom sits on this series' bar\n              // while the series stay side by side.\n              stackId={isStacked ? 'a' : headroomKey ? key : undefined}\n              radius={radiusFor(barShape, rounded)}\n              minPointSize={minPointSizeFor(key)}\n              background={showBackground ? { fill: backgroundFill } : undefined}\n              shape={shape}\n              activeBar={activeBarShape}\n              {...animation}\n            >\n              {cells}\n              {labels}\n            </Bar>\n            {headroomKey && (\n              <Bar\n                dataKey={`${HEADROOM_FIELD_PREFIX}${key}`}\n                stackId={key}\n                fill={`var(--color-${key})`}\n                fillOpacity={0.25}\n                radius={radiusFor(barShape, true)}\n                // Decoration for the bar below it — never its own row in the\n                // tooltip or entry in the legend.\n                legendType=\"none\"\n                tooltipType=\"none\"\n                {...animation}\n              />\n            )}\n          </React.Fragment>\n        );\n      });\n\n    const renderReferenceAreas = () =>\n      referenceAreas.map(({ area, range }, index) => {\n        const [start, end] = range;\n        // Bands run along the category axis: X for vertical bars, Y for\n        // horizontal ones.\n        const bounds =\n          orientation === 'horizontal'\n            ? { y1: data[start]?.[xKey], y2: data[end]?.[xKey] }\n            : { x1: data[start]?.[xKey], x2: data[end]?.[xKey] };\n        return (\n          <ReferenceArea\n            key={`${area.label ?? 'area'}-${index}`}\n            {...bounds}\n            fill=\"var(--ui-background-surface-secondary)\"\n            fillOpacity={0.6}\n            ifOverflow=\"extendDomain\"\n            shape={resolveBandShape({\n              divider: area.divider,\n              vertical: orientation !== 'horizontal',\n            })}\n            label={resolveBandLabel(area.label)}\n          />\n        );\n      });\n\n    const renderReferenceLines = () =>\n      referenceLines.map((ref, index) => {\n        const value = resolveChartReferenceValue(ref, data, dataKeys);\n        if (value === undefined) return null;\n        return (\n          <ReferenceLine\n            key={`${ref.label ?? 'ref'}-${index}`}\n            // Draw on the value axis: Y for vertical bars, X for horizontal.\n            {...(orientation === 'horizontal' ? { x: value } : { y: value })}\n            // By default the caption sits at the top of the line: above the\n            // right end of a horizontal line (vertical bars), or above the\n            // top of a vertical line (horizontal bars).\n            {...resolveReferenceLineProps(\n              ref.label,\n              ref.labelPosition ??\n                (orientation === 'horizontal' ? 'top' : 'insideTopRight')\n            )}\n          />\n        );\n      });\n\n    return (\n      <div\n        ref={ref}\n        data-orientation={orientation}\n        data-layout={layout}\n        className={cn(barChartVariants({ orientation, layout }), className)}\n        {...props}\n      >\n        <ChartContainer\n          config={config}\n          className=\"size-full [&_.recharts-label]:fill-foreground\"\n        >\n          <RechartsBarChart\n            data={chartData as readonly unknown[]}\n            layout={rechartsLayout}\n            barSize={barSize}\n            maxBarSize={maxBarSize}\n            barGap={barGap}\n            barCategoryGap={barCategoryGap}\n          >\n            <BarPaintServers\n              id={defsId}\n              dataKeys={dataKeys}\n              shapes={usedShapes}\n              horizontal={orientation === 'horizontal'}\n            />\n            {showGrid && (\n              <CartesianGrid\n                horizontal={gridHorizontal ?? orientation === 'vertical'}\n                vertical={gridVertical ?? orientation === 'horizontal'}\n                strokeDasharray={gridDashed ? '3 3' : undefined}\n              />\n            )}\n            {renderAxes()}\n            {showTooltip && <ChartTooltip content={tooltipElement} />}\n            {showLegend && <ChartLegend content={legendElement} />}\n            {renderSeries()}\n            {renderReferenceAreas()}\n            {renderReferenceLines()}\n            {showBrush && (\n              <Brush\n                dataKey={xKey}\n                // The brush slices rows by index, so its captions come from\n                // whichever axis holds the categories — Y for horizontal bars.\n                tickFormatter={\n                  orientation === 'horizontal' ? yTickFormatter : xTickFormatter\n                }\n                {...resolveBrushProps({ brushHeight, brushAriaLabel })}\n              />\n            )}\n          </RechartsBarChart>\n        </ChartContainer>\n      </div>\n    );\n  }\n);\nBarChart.displayName = 'BarChart';\n\nexport { BarChart, barChartVariants };\n"],"names":["barChartVariants","cva","HEADROOM_FIELD_PREFIX","dropHeadroomSeries","payload","dataKeys","real","item","a","b","withSeriesColor","_a","NormalizedTooltipContent","content","props","merged","React","jsx","ChartTooltipContent","NormalizedLegendContent","ChartLegendContent","renderBarWithTrack","bar","track","trackFill","paint","jsxs","Fragment","Rectangle","createTrackShape","inRange","row","resolveBarShapes","rangeBackground","activeBarOption","renderBandWithDivider","band","vertical","x","y","width","height","fill","fillOpacity","resolveBandShape","divider","resolveBandLabel","label","BarPaintServers","id","shapes","horizontal","hasGradient","hasPattern","key","rangeCells","data","chartData","xKey","seriesKey","settings","range","headroomKey","barShape","rounded","fillOf","radiusFor","opacity","dashed","rowIndex","on","shape","stacksHeadroom","Cell","BarChart","className","config","referenceLine","referenceArea","barSettings","xAxisLabel","yAxisLabel","xUnit","yUnit","orientation","layout","barRadius","barSize","maxBarSize","barGap","barCategoryGap","minPointSize","showBackground","backgroundFill","showActiveBar","activeBar","showGrid","showTooltip","showLegend","showXAxis","showYAxis","xTickFormatter","yTickFormatter","xAxisAngle","xAxisInterval","yAxisTickCount","yAxisDomain","gridDashed","gridHorizontal","gridVertical","tooltipContent","animate","animationDuration","animationBegin","animationEasing","showLabels","labelPosition","labelFormatter","showBrush","brushHeight","brushAriaLabel","ref","animation","resolveAnimation","rechartsLayout","isStacked","barLabelPosition","resolveCartesianLabelPosition","referenceLines","toReferenceLineList","referenceAreas","area","resolveCategoryRange","entry","settingsByKey","headroomKeys","pair","extra","upperKey","start","end","value","upper","highlightedValues","categoryTick","index","tickProps","formatter","Text","cn","defsId","usedShapes","minPointSizeFor","top","own","xAxisTitle","resolveXAxisTitle","yAxisTitle","resolveYAxisTitle","yDomain","resolveAxisDomain","xAxisHeight","resolveXAxisHeight","endRadius","tooltipElement","legendElement","renderAxes","XAxis","resolveRotatedTickAnchor","YAxis","renderSeries","activeBarShape","cells","labels","LabelList","toLabelFormatter","resolveLabelFillClass","CHART_LABEL_FONT_SIZE","Bar","renderReferenceAreas","bounds","_b","_c","_d","ReferenceArea","renderReferenceLines","resolveChartReferenceValue","ReferenceLine","resolveReferenceLineProps","ChartContainer","RechartsBarChart","CartesianGrid","ChartTooltip","ChartLegend","Brush","resolveBrushProps"],"mappings":"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"}

package/dist/components/ui/category-bar/category-bar.js

@@ -1,10 +1,10 @@
-import { jsxs as r, jsx as l, Fragment as z } from "react/jsx-runtime";
-import * as b from "react";
-import { cva as I } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { cn as x } from "../../../lib/utils.js";
-import { ChartStyle as y } from "../chart/chart.js";
-import { Tooltip as B, TooltipTrigger as O, TooltipContent as S } from "../tooltip/tooltip.js";
-const q = (c) => c.toLocaleString(), F = I("flex w-full overflow-hidden rounded-full bg-input", {
+import { jsxs as l, jsx as a, Fragment as z } from "react/jsx-runtime";
+import * as N from "react";
+import { cva as B } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { cn as k } from "../../../lib/utils.js";
+import { ChartStyle as v } from "../chart/chart.js";
+import { Tooltip as S, TooltipTrigger as I, TooltipContent as O } from "../tooltip/tooltip.js";
+const q = (o) => o.toLocaleString(), F = B("flex w-full overflow-hidden rounded-full bg-input", {
   variants: {
     size: {
       sm: "h-1.5",
@@ -15,100 +15,121 @@ const q = (c) => c.toLocaleString(), F = I("flex w-full overflow-hidden rounded-
   defaultVariants: {
     size: "md"
   }
-}), R = b.forwardRef(
+});
+function R({
+  chartId: o,
+  config: n,
+  color: t,
+  label: d,
+  percent: m,
+  segmentKey: f,
+  value: u,
+  valueFormatter: s,
+  renderContent: c
+}) {
+  return /* @__PURE__ */ l(
+    O,
+    {
+      "data-chart": o,
+      className: k(
+        "border border-border bg-background text-foreground shadow-md",
+        !c && "flex items-center gap-2"
+      ),
+      children: [
+        /* @__PURE__ */ a(v, { id: o, config: n }),
+        c ? c({ key: f, value: u, label: d, percent: m, color: t }) : /* @__PURE__ */ l(z, { children: [
+          /* @__PURE__ */ a(
+            "span",
+            {
+              className: "size-2.5 shrink-0 rounded-full",
+              style: { backgroundColor: t }
+            }
+          ),
+          /* @__PURE__ */ a("span", { className: "font-semibold", children: d }),
+          /* @__PURE__ */ l("span", { className: "text-muted-foreground tabular-nums", children: [
+            s(u),
+            " · ",
+            m,
+            "%"
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+const V = N.forwardRef(
   ({
-    className: c,
+    className: o,
     data: n,
-    config: o,
-    size: g,
-    showLegend: k = !1,
-    showTooltip: v = !0,
-    tooltipContent: d,
-    valueFormatter: i = q,
-    defaultOpenIndex: N,
+    config: t,
+    size: d,
+    showLegend: m = !1,
+    showTooltip: f = !0,
+    tooltipContent: u,
+    valueFormatter: s = q,
+    defaultOpenIndex: c,
     "aria-label": w,
     ...C
   }, T) => {
-    const s = `chart-${b.useId().replace(/:/g, "")}`, f = n.reduce((e, a) => e + a.value, 0), u = (e) => {
-      var a;
-      return ((a = o[e]) == null ? void 0 : a.label) ?? e;
+    const p = `chart-${N.useId().replace(/:/g, "")}`, h = n.reduce((e, r) => e + r.value, 0), b = (e) => {
+      var r;
+      return ((r = t[e]) == null ? void 0 : r.label) ?? e;
     }, $ = (e) => {
-      var t;
-      const a = (t = o[e]) == null ? void 0 : t.label;
-      return typeof a == "string" || typeof a == "number" ? String(a) : e;
-    }, p = (e) => `var(--color-${e})`, m = (e) => f > 0 ? Math.round(e / f * 100) : 0, j = w ?? n.map((e) => `${$(e.key)} ${i(e.value)}`).join(", ");
-    return /* @__PURE__ */ r(
+      var i;
+      const r = (i = t[e]) == null ? void 0 : i.label;
+      return typeof r == "string" || typeof r == "number" ? String(r) : e;
+    }, x = (e) => `var(--color-${e})`, y = (e) => h > 0 ? Math.round(e / h * 100) : 0, j = w ?? n.map((e) => `${$(e.key)} ${s(e.value)}`).join(", ");
+    return /* @__PURE__ */ l(
       "div",
       {
         ref: T,
-        "data-chart": s,
-        className: x("flex w-full flex-col gap-3", c),
+        "data-chart": p,
+        className: k("flex w-full flex-col gap-3", o),
         ...C,
         children: [
-          /* @__PURE__ */ l(y, { id: s, config: o }),
-          /* @__PURE__ */ l("div", { className: F({ size: g }), role: "img", "aria-label": j, children: n.map((e, a) => {
-            const t = p(e.key), h = /* @__PURE__ */ l(
+          /* @__PURE__ */ a(v, { id: p, config: t }),
+          /* @__PURE__ */ a("div", { className: F({ size: d }), role: "img", "aria-label": j, children: n.map((e, r) => {
+            const i = x(e.key), g = /* @__PURE__ */ a(
               "div",
               {
                 className: "h-full min-w-0",
-                style: { flex: `${e.value} 0 0%`, backgroundColor: t }
+                style: { flex: `${e.value} 0 0%`, backgroundColor: i }
               },
               e.key
             );
-            return v ? /* @__PURE__ */ r(B, { defaultOpen: a === N, children: [
-              /* @__PURE__ */ l(O, { render: h }),
-              /* @__PURE__ */ r(
-                S,
+            return f ? /* @__PURE__ */ l(S, { defaultOpen: r === c, children: [
+              /* @__PURE__ */ a(I, { render: g }),
+              /* @__PURE__ */ a(
+                R,
                 {
-                  "data-chart": s,
-                  className: x(
-                    "border border-border bg-background text-foreground shadow-md",
-                    !d && "flex items-center gap-2"
-                  ),
-                  children: [
-                    /* @__PURE__ */ l(y, { id: s, config: o }),
-                    d ? d({
-                      key: e.key,
-                      value: e.value,
-                      label: u(e.key),
-                      percent: m(e.value),
-                      color: t
-                    }) : /* @__PURE__ */ r(z, { children: [
-                      /* @__PURE__ */ l(
-                        "span",
-                        {
-                          className: "size-2.5 shrink-0 rounded-full",
-                          style: { backgroundColor: t }
-                        }
-                      ),
-                      /* @__PURE__ */ l("span", { className: "font-semibold", children: u(e.key) }),
-                      /* @__PURE__ */ r("span", { className: "text-muted-foreground tabular-nums", children: [
-                        i(e.value),
-                        " · ",
-                        m(e.value),
-                        "%"
-                      ] })
-                    ] })
-                  ]
+                  chartId: p,
+                  config: t,
+                  color: i,
+                  label: b(e.key),
+                  percent: y(e.value),
+                  segmentKey: e.key,
+                  value: e.value,
+                  valueFormatter: s,
+                  renderContent: u
                 }
               )
-            ] }, e.key) : h;
+            ] }, e.key) : g;
           }) }),
-          k && /* @__PURE__ */ l("ul", { className: "flex flex-wrap justify-between gap-x-6 gap-y-3", children: n.map((e) => /* @__PURE__ */ r("li", { className: "flex flex-col gap-1.5", children: [
-            /* @__PURE__ */ r("span", { className: "flex items-center gap-1.5 text-sm leading-none text-muted-foreground", children: [
-              /* @__PURE__ */ l(
+          m && /* @__PURE__ */ a("ul", { className: "flex flex-wrap justify-between gap-x-6 gap-y-3", children: n.map((e) => /* @__PURE__ */ l("li", { className: "flex flex-col gap-1.5", children: [
+            /* @__PURE__ */ l("span", { className: "flex items-center gap-1.5 text-sm leading-none text-muted-foreground", children: [
+              /* @__PURE__ */ a(
                 "span",
                 {
-                  className: "size-2.5 shrink-0 rounded-full",
-                  style: { backgroundColor: p(e.key) }
+                  className: "size-2.5 shrink-0 rounded-sm",
+                  style: { backgroundColor: x(e.key) }
                 }
               ),
-              u(e.key)
+              b(e.key)
             ] }),
-            /* @__PURE__ */ r("span", { className: "flex items-baseline gap-1.5 leading-none tabular-nums", children: [
-              /* @__PURE__ */ l("span", { className: "text-base font-semibold text-foreground", children: i(e.value) }),
-              /* @__PURE__ */ r("span", { className: "text-sm text-muted-foreground", children: [
-                m(e.value),
+            /* @__PURE__ */ l("span", { className: "flex items-baseline gap-1.5 leading-none tabular-nums", children: [
+              /* @__PURE__ */ a("span", { className: "text-base font-semibold text-foreground", children: s(e.value) }),
+              /* @__PURE__ */ l("span", { className: "text-sm text-muted-foreground", children: [
+                y(e.value),
                 "%"
               ] })
             ] })
@@ -118,9 +139,9 @@ const q = (c) => c.toLocaleString(), F = I("flex w-full overflow-hidden rounded-
     );
   }
 );
-R.displayName = "CategoryBar";
+V.displayName = "CategoryBar";
 export {
-  R as CategoryBar,
+  V as CategoryBar,
   F as categoryBarVariants
 };
 //# sourceMappingURL=category-bar.js.map

package/dist/components/ui/category-bar/category-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"category-bar.js","sources":["../../../../src/components/ui/category-bar/category-bar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { ChartStyle, type ChartConfig } from '../chart';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../tooltip';\n\n// A category bar: a single horizontal bar split into proportional colored\n// segments — one part-to-whole across a handful of categories, in one row\n// (onboarding stages, certification status, a rating scale). Unlike `Meter`\n// (one value per row, stacked into a bar list), all segments share the same bar.\n// It's a plain flex composition, not a recharts chart: each segment's width is\n// `value / total`, so exact proportions and the count/% legend are direct DOM,\n// with no axes/grid to hide. Segment colors are caller-supplied via `config`\n// (existing semantic `--ui-*` tokens); there is no chart palette tier yet.\n//\n// Colors are consumed through the same `--color-<key>` bridge the recharts\n// charts use: `ChartStyle` emits one custom property per config entry, so a\n// `theme: { light, dark }` entry works as well as a flat `color` — reading\n// `config[key].color` directly would render a themed config colorless. The\n// tooltip is portaled out of the bar's DOM, so its popup carries its own\n// `data-chart` scope + `ChartStyle` to keep the bridge resolvable there.\n\nconst defaultFormat = (value: number) => value.toLocaleString();\n\n// Track height only — the flex/rounded/overflow chrome is static.\nconst categoryBarVariants = cva('flex w-full overflow-hidden rounded-full bg-input', {\n  variants: {\n    size: {\n      sm: 'h-1.5',\n      md: 'h-2.5',\n      lg: 'h-4',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\nexport interface CategoryBarSegment {\n  /** Key into `config` for this segment's label + color. */\n  key: string;\n  /** The segment's value — its width is this over the sum of all values. */\n  value: number;\n}\n\n/** The resolved segment passed to a custom `tooltipContent` renderer. */\nexport interface CategoryBarTooltipContext extends CategoryBarSegment {\n  /** Resolved `config` label (falls back to the key); may be any `ReactNode`. */\n  label: React.ReactNode;\n  /** Share of the total as a rounded percentage (0–100). */\n  percent: number;\n  /**\n   * CSS color reference for the segment — the `var(--color-<key>)` bridge, which\n   * resolves the config entry's `color` or its per-theme `theme` value. Usable\n   * anywhere a CSS color is (e.g. a `style` background); not a literal value.\n   */\n  color: string;\n}\n\nexport interface CategoryBarProps\n  extends Omit<React.ComponentProps<'div'>, 'children'>,\n    VariantProps<typeof categoryBarVariants> {\n  /** Ordered segments (left → right). Widths are proportional to `value`. */\n  data: ReadonlyArray<CategoryBarSegment>;\n  /** Maps each segment `key` to a `label` and `color` (an existing `--ui-*` token). */\n  config: ChartConfig;\n  /** Show the legend below the bar (color dot + label + value + %). */\n  showLegend?: boolean;\n  /** Show a hover tooltip per segment (dot + label + value + %). */\n  showTooltip?: boolean;\n  /**\n   * Custom tooltip content per segment — replaces the default (dot + label +\n   * `value · %`) inside the same card. Ignored when `showTooltip` is false.\n   */\n  tooltipContent?: (segment: CategoryBarTooltipContext) => React.ReactNode;\n  /** Format the numeric value (legend + tooltip). Defaults to `toLocaleString()`. */\n  valueFormatter?: (value: number) => string;\n  /** Render the tooltip for this segment index initially open (VR/testing). */\n  defaultOpenIndex?: number;\n  /**\n   * Accessible summary of the whole bar. Defaults to a `label value` list built\n   * from the data; pass a fuller sentence for screen readers if you have one.\n   */\n  'aria-label'?: string;\n}\n\nconst CategoryBar = React.forwardRef<HTMLDivElement, CategoryBarProps>(\n  (\n    {\n      className,\n      data,\n      config,\n      size,\n      showLegend = false,\n      showTooltip = true,\n      tooltipContent,\n      valueFormatter = defaultFormat,\n      defaultOpenIndex,\n      'aria-label': ariaLabel,\n      ...props\n    },\n    ref\n  ) => {\n    const uniqueId = React.useId();\n    const chartId = `chart-${uniqueId.replace(/:/g, '')}`;\n\n    const total = data.reduce((sum, seg) => sum + seg.value, 0);\n    const labelFor = (key: string): React.ReactNode => config[key]?.label ?? key;\n    // The aria-label has to be a plain string, so a rich (element) label can't\n    // be used there — fall back to the key rather than stringifying it into\n    // \"[object Object]\".\n    const labelTextFor = (key: string) => {\n      const label = config[key]?.label;\n      return typeof label === 'string' || typeof label === 'number'\n        ? String(label)\n        : key;\n    };\n    const colorOf = (key: string) => `var(--color-${key})`;\n    const pctOf = (value: number) =>\n      total > 0 ? Math.round((value / total) * 100) : 0;\n\n    // A locale-neutral fallback: \"<label> <value>\" pairs. Consumers can pass a\n    // fuller `aria-label` sentence.\n    const summary =\n      ariaLabel ??\n      data\n        .map((seg) => `${labelTextFor(seg.key)} ${valueFormatter(seg.value)}`)\n        .join(', ');\n\n    return (\n      <div\n        ref={ref}\n        data-chart={chartId}\n        className={cn('flex w-full flex-col gap-3', className)}\n        {...props}\n      >\n        <ChartStyle id={chartId} config={config} />\n        <div className={categoryBarVariants({ size })} role=\"img\" aria-label={summary}>\n          {data.map((seg, index) => {\n            const color = colorOf(seg.key);\n            // flex-grow proportional to value with a zero basis → widths are\n            // exactly value/total; a zero-value segment collapses.\n            const segment = (\n              <div\n                key={seg.key}\n                className=\"h-full min-w-0\"\n                style={{ flex: `${seg.value} 0 0%`, backgroundColor: color }}\n              />\n            );\n\n            if (!showTooltip) return segment;\n\n            return (\n              <Tooltip key={seg.key} defaultOpen={index === defaultOpenIndex}>\n                <TooltipTrigger render={segment} />\n                <TooltipContent\n                  // The popup is portaled out of the bar, so it needs its own\n                  // `data-chart` scope for the `--color-*` bridge to resolve.\n                  data-chart={chartId}\n                  className={cn(\n                    'border border-border bg-background text-foreground shadow-md',\n                    !tooltipContent && 'flex items-center gap-2'\n                  )}\n                >\n                  <ChartStyle id={chartId} config={config} />\n                  {tooltipContent ? (\n                    tooltipContent({\n                      key: seg.key,\n                      value: seg.value,\n                      label: labelFor(seg.key),\n                      percent: pctOf(seg.value),\n                      color,\n                    })\n                  ) : (\n                    <>\n                      <span\n                        className=\"size-2.5 shrink-0 rounded-full\"\n                        style={{ backgroundColor: color }}\n                      />\n                      <span className=\"font-semibold\">{labelFor(seg.key)}</span>\n                      <span className=\"text-muted-foreground tabular-nums\">\n                        {valueFormatter(seg.value)} · {pctOf(seg.value)}%\n                      </span>\n                    </>\n                  )}\n                </TooltipContent>\n              </Tooltip>\n            );\n          })}\n        </div>\n\n        {showLegend && (\n          <ul className=\"flex flex-wrap justify-between gap-x-6 gap-y-3\">\n            {data.map((seg) => (\n              <li key={seg.key} className=\"flex flex-col gap-1.5\">\n                <span className=\"flex items-center gap-1.5 text-sm leading-none text-muted-foreground\">\n                  <span\n                    className=\"size-2.5 shrink-0 rounded-full\"\n                    style={{ backgroundColor: colorOf(seg.key) }}\n                  />\n                  {labelFor(seg.key)}\n                </span>\n                <span className=\"flex items-baseline gap-1.5 leading-none tabular-nums\">\n                  <span className=\"text-base font-semibold text-foreground\">\n                    {valueFormatter(seg.value)}\n                  </span>\n                  <span className=\"text-sm text-muted-foreground\">\n                    {pctOf(seg.value)}%\n                  </span>\n                </span>\n              </li>\n            ))}\n          </ul>\n        )}\n      </div>\n    );\n  }\n);\nCategoryBar.displayName = 'CategoryBar';\n\nexport { CategoryBar, categoryBarVariants };\n"],"names":["defaultFormat","value","categoryBarVariants","cva","CategoryBar","React","className","data","config","size","showLegend","showTooltip","tooltipContent","valueFormatter","defaultOpenIndex","ariaLabel","props","ref","chartId","total","sum","seg","labelFor","key","_a","labelTextFor","label","colorOf","pctOf","summary","jsxs","cn","jsx","ChartStyle","index","color","segment","Tooltip","TooltipTrigger","TooltipContent","Fragment"],"mappings":"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"}
+{"version":3,"file":"category-bar.js","sources":["../../../../src/components/ui/category-bar/category-bar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { ChartStyle, type ChartConfig } from '../chart';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../tooltip';\n\n// A category bar: a single horizontal bar split into proportional colored\n// segments — one part-to-whole across a handful of categories, in one row\n// (onboarding stages, certification status, a rating scale). Unlike `Meter`\n// (one value per row, stacked into a bar list), all segments share the same bar.\n// It's a plain flex composition, not a recharts chart: each segment's width is\n// `value / total`, so exact proportions and the count/% legend are direct DOM,\n// with no axes/grid to hide. Segment colors are caller-supplied via `config`\n// (existing semantic `--ui-*` tokens); there is no chart palette tier yet.\n//\n// Colors are consumed through the same `--color-<key>` bridge the recharts\n// charts use: `ChartStyle` emits one custom property per config entry, so a\n// `theme: { light, dark }` entry works as well as a flat `color` — reading\n// `config[key].color` directly would render a themed config colorless. The\n// tooltip is portaled out of the bar's DOM, so its popup carries its own\n// `data-chart` scope + `ChartStyle` to keep the bridge resolvable there.\n\nconst defaultFormat = (value: number) => value.toLocaleString();\n\n// Track height only — the flex/rounded/overflow chrome is static.\nconst categoryBarVariants = cva('flex w-full overflow-hidden rounded-full bg-input', {\n  variants: {\n    size: {\n      sm: 'h-1.5',\n      md: 'h-2.5',\n      lg: 'h-4',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\nexport interface CategoryBarSegment {\n  /** Key into `config` for this segment's label + color. */\n  key: string;\n  /** The segment's value — its width is this over the sum of all values. */\n  value: number;\n}\n\n/** The resolved segment passed to a custom `tooltipContent` renderer. */\nexport interface CategoryBarTooltipContext extends CategoryBarSegment {\n  /** Resolved `config` label (falls back to the key); may be any `ReactNode`. */\n  label: React.ReactNode;\n  /** Share of the total as a rounded percentage (0–100). */\n  percent: number;\n  /**\n   * CSS color reference for the segment — the `var(--color-<key>)` bridge, which\n   * resolves the config entry's `color` or its per-theme `theme` value. Usable\n   * anywhere a CSS color is (e.g. a `style` background); not a literal value.\n   */\n  color: string;\n}\n\nexport interface CategoryBarProps\n  extends Omit<React.ComponentProps<'div'>, 'children'>,\n    VariantProps<typeof categoryBarVariants> {\n  /** Ordered segments (left → right). Widths are proportional to `value`. */\n  data: ReadonlyArray<CategoryBarSegment>;\n  /** Maps each segment `key` to a `label` and `color` (an existing `--ui-*` token). */\n  config: ChartConfig;\n  /** Show the legend below the bar (color dot + label + value + %). */\n  showLegend?: boolean;\n  /** Show a hover tooltip per segment (dot + label + value + %). */\n  showTooltip?: boolean;\n  /**\n   * Custom tooltip content per segment — replaces the default (dot + label +\n   * `value · %`) inside the same card. Ignored when `showTooltip` is false.\n   */\n  tooltipContent?: (segment: CategoryBarTooltipContext) => React.ReactNode;\n  /** Format the numeric value (legend + tooltip). Defaults to `toLocaleString()`. */\n  valueFormatter?: (value: number) => string;\n  /** Render the tooltip for this segment index initially open (VR/testing). */\n  defaultOpenIndex?: number;\n  /**\n   * Accessible summary of the whole bar. Defaults to a `label value` list built\n   * from the data; pass a fuller sentence for screen readers if you have one.\n   */\n  'aria-label'?: string;\n}\n\n/**\n * One segment's hover card.\n *\n * It re-declares `data-chart` and re-renders `ChartStyle` because the popup is\n * portaled out of the bar: outside that subtree the `--color-*` bridge the\n * swatch reads has nothing to resolve against.\n */\nfunction CategoryBarSegmentTooltip({\n  chartId,\n  config,\n  color,\n  label,\n  percent,\n  segmentKey,\n  value,\n  valueFormatter,\n  renderContent,\n}: {\n  chartId: string;\n  config: ChartConfig;\n  color: string;\n  label: React.ReactNode;\n  percent: number;\n  segmentKey: string;\n  value: number;\n  valueFormatter: (value: number) => string;\n  // Not named `render`: in this package that name is reserved for Base UI's\n  // polymorphic composition prop (see `<TooltipTrigger render={…} />` below).\n  renderContent?: (segment: CategoryBarTooltipContext) => React.ReactNode;\n}) {\n  return (\n    <TooltipContent\n      data-chart={chartId}\n      className={cn(\n        'border border-border bg-background text-foreground shadow-md',\n        !renderContent && 'flex items-center gap-2'\n      )}\n    >\n      <ChartStyle id={chartId} config={config} />\n      {renderContent ? (\n        renderContent({ key: segmentKey, value, label, percent, color })\n      ) : (\n        <>\n          <span\n            className=\"size-2.5 shrink-0 rounded-full\"\n            style={{ backgroundColor: color }}\n          />\n          <span className=\"font-semibold\">{label}</span>\n          <span className=\"text-muted-foreground tabular-nums\">\n            {valueFormatter(value)} · {percent}%\n          </span>\n        </>\n      )}\n    </TooltipContent>\n  );\n}\n\nconst CategoryBar = React.forwardRef<HTMLDivElement, CategoryBarProps>(\n  (\n    {\n      className,\n      data,\n      config,\n      size,\n      showLegend = false,\n      showTooltip = true,\n      tooltipContent,\n      valueFormatter = defaultFormat,\n      defaultOpenIndex,\n      'aria-label': ariaLabel,\n      ...props\n    },\n    ref\n  ) => {\n    const uniqueId = React.useId();\n    const chartId = `chart-${uniqueId.replace(/:/g, '')}`;\n\n    const total = data.reduce((sum, seg) => sum + seg.value, 0);\n    const labelFor = (key: string): React.ReactNode => config[key]?.label ?? key;\n    // The aria-label has to be a plain string, so a rich (element) label can't\n    // be used there — fall back to the key rather than stringifying it into\n    // \"[object Object]\".\n    const labelTextFor = (key: string) => {\n      const label = config[key]?.label;\n      return typeof label === 'string' || typeof label === 'number'\n        ? String(label)\n        : key;\n    };\n    const colorOf = (key: string) => `var(--color-${key})`;\n    const pctOf = (value: number) =>\n      total > 0 ? Math.round((value / total) * 100) : 0;\n\n    // A locale-neutral fallback: \"<label> <value>\" pairs. Consumers can pass a\n    // fuller `aria-label` sentence.\n    const summary =\n      ariaLabel ??\n      data\n        .map((seg) => `${labelTextFor(seg.key)} ${valueFormatter(seg.value)}`)\n        .join(', ');\n\n    return (\n      <div\n        ref={ref}\n        data-chart={chartId}\n        className={cn('flex w-full flex-col gap-3', className)}\n        {...props}\n      >\n        <ChartStyle id={chartId} config={config} />\n        <div className={categoryBarVariants({ size })} role=\"img\" aria-label={summary}>\n          {data.map((seg, index) => {\n            const color = colorOf(seg.key);\n            // flex-grow proportional to value with a zero basis → widths are\n            // exactly value/total; a zero-value segment collapses.\n            const segment = (\n              <div\n                key={seg.key}\n                className=\"h-full min-w-0\"\n                style={{ flex: `${seg.value} 0 0%`, backgroundColor: color }}\n              />\n            );\n\n            if (!showTooltip) return segment;\n\n            return (\n              <Tooltip key={seg.key} defaultOpen={index === defaultOpenIndex}>\n                <TooltipTrigger render={segment} />\n                <CategoryBarSegmentTooltip\n                  chartId={chartId}\n                  config={config}\n                  color={color}\n                  label={labelFor(seg.key)}\n                  percent={pctOf(seg.value)}\n                  segmentKey={seg.key}\n                  value={seg.value}\n                  valueFormatter={valueFormatter}\n                  renderContent={tooltipContent}\n                />\n              </Tooltip>\n            );\n          })}\n        </div>\n\n        {showLegend && (\n          <ul className=\"flex flex-wrap justify-between gap-x-6 gap-y-3\">\n            {data.map((seg) => (\n              <li key={seg.key} className=\"flex flex-col gap-1.5\">\n                <span className=\"flex items-center gap-1.5 text-sm leading-none text-muted-foreground\">\n                  <span\n                    className=\"size-2.5 shrink-0 rounded-sm\"\n                    style={{ backgroundColor: colorOf(seg.key) }}\n                  />\n                  {labelFor(seg.key)}\n                </span>\n                <span className=\"flex items-baseline gap-1.5 leading-none tabular-nums\">\n                  <span className=\"text-base font-semibold text-foreground\">\n                    {valueFormatter(seg.value)}\n                  </span>\n                  <span className=\"text-sm text-muted-foreground\">\n                    {pctOf(seg.value)}%\n                  </span>\n                </span>\n              </li>\n            ))}\n          </ul>\n        )}\n      </div>\n    );\n  }\n);\nCategoryBar.displayName = 'CategoryBar';\n\nexport { CategoryBar, categoryBarVariants };\n"],"names":["defaultFormat","value","categoryBarVariants","cva","CategoryBarSegmentTooltip","chartId","config","color","label","percent","segmentKey","valueFormatter","renderContent","jsxs","TooltipContent","cn","jsx","ChartStyle","Fragment","CategoryBar","React","className","data","size","showLegend","showTooltip","tooltipContent","defaultOpenIndex","ariaLabel","props","ref","total","sum","seg","labelFor","key","_a","labelTextFor","colorOf","pctOf","summary","index","segment","Tooltip","TooltipTrigger"],"mappings":"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"}