@refraction-ui/react 0.19.1 → 0.20.0

package/dist/react-charts.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../charts/src/scales.ts", "../../charts/src/data.ts", "../../charts/src/geometry.ts", "../../charts/src/chart.ts", "../../charts/src/axis.ts", "../../charts/src/colorblind.ts", "../../react-charts/src/chart-context.ts", "../../react-charts/src/chart.tsx", "../../react-charts/src/bars.tsx", "../../react-charts/src/line.tsx", "../../react-charts/src/circles.tsx", "../../react-charts/src/x-axis.tsx", "../../react-charts/src/y-axis.tsx", "../../react-charts/src/gradient.tsx", "../../react-charts/src/histogram.tsx", "../../react-charts/src/scatter-plot.tsx", "../../react-charts/src/pie-chart.tsx"],
+  "sourcesContent": ["// --- Linear Scale ---\n\nexport interface LinearScale {\n  (value: number): number\n  invert: (value: number) => number\n  ticks: (count?: number) => number[]\n  type: 'linear'\n  domain: [number, number]\n  range: [number, number]\n}\n\nexport function createLinearScale(\n  domain: [number, number],\n  range: [number, number],\n): LinearScale {\n  const [d0, d1] = domain\n  const [r0, r1] = range\n  const domainSpan = d1 - d0\n  const rangeSpan = r1 - r0\n\n  const scale = ((value: number): number => {\n    if (domainSpan === 0) return r0\n    return r0 + ((value - d0) / domainSpan) * rangeSpan\n  }) as LinearScale\n\n  scale.invert = (value: number): number => {\n    if (rangeSpan === 0) return d0\n    return d0 + ((value - r0) / rangeSpan) * domainSpan\n  }\n\n  scale.ticks = (count = 10): number[] => {\n    if (count <= 0) return []\n    const ticks: number[] = []\n    for (let i = 0; i < count; i++) {\n      ticks.push(d0 + (domainSpan * i) / (count - 1 || 1))\n    }\n    return ticks\n  }\n\n  scale.type = 'linear'\n  scale.domain = domain\n  scale.range = range\n\n  return scale\n}\n\n// --- Band Scale ---\n\nexport interface BandScale {\n  (value: string): number\n  bandwidth: () => number\n  type: 'band'\n  domain: string[]\n  range: [number, number]\n}\n\nexport function createBandScale(\n  domain: string[],\n  range: [number, number],\n  padding = 0,\n): BandScale {\n  const [r0, r1] = range\n  const rangeSpan = r1 - r0\n  const n = domain.length\n\n  // With padding: each step = bandwidth + paddingInner\n  // total = n * step - paddingInner (no padding after last band)\n  // paddingInner = step * padding\n  // step * n - step * padding = rangeSpan => step * (n - padding) = rangeSpan\n  let step = 0\n  let bw = 0\n\n  if (n > 0) {\n    if (n === 1) {\n      bw = rangeSpan\n      step = rangeSpan\n    } else {\n      step = n > 0 ? rangeSpan / (n - padding) : 0\n      bw = step * (1 - padding)\n    }\n  }\n\n  const indexMap = new Map<string, number>()\n  domain.forEach((d, i) => indexMap.set(d, i))\n\n  const scale = ((value: string): number => {\n    const idx = indexMap.get(value)\n    if (idx === undefined) return 0\n    return r0 + idx * step\n  }) as BandScale\n\n  scale.bandwidth = (): number => {\n    return Math.max(0, bw)\n  }\n\n  scale.type = 'band'\n  scale.domain = domain\n  scale.range = range\n\n  return scale\n}\n\n// --- Time Scale ---\n\nexport interface TimeScale {\n  (value: Date): number\n  invert: (value: number) => Date\n  ticks: (count?: number) => Date[]\n  type: 'time'\n  domain: [Date, Date]\n  range: [number, number]\n}\n\nexport function createTimeScale(\n  domain: [Date, Date],\n  range: [number, number],\n): TimeScale {\n  const [d0, d1] = domain\n  const [r0, r1] = range\n  const t0 = d0.getTime()\n  const t1 = d1.getTime()\n  const domainSpan = t1 - t0\n  const rangeSpan = r1 - r0\n\n  const scale = ((value: Date): number => {\n    if (domainSpan === 0) return r0\n    return r0 + ((value.getTime() - t0) / domainSpan) * rangeSpan\n  }) as TimeScale\n\n  scale.invert = (value: number): Date => {\n    if (rangeSpan === 0) return new Date(t0)\n    const t = t0 + ((value - r0) / rangeSpan) * domainSpan\n    return new Date(t)\n  }\n\n  scale.ticks = (count = 10): Date[] => {\n    if (count <= 0) return []\n    const ticks: Date[] = []\n    for (let i = 0; i < count; i++) {\n      const t = t0 + (domainSpan * i) / (count - 1 || 1)\n      ticks.push(new Date(t))\n    }\n    return ticks\n  }\n\n  scale.type = 'time'\n  scale.domain = domain\n  scale.range = range\n\n  return scale\n}\n", "export interface HistogramBin {\n  x0: number\n  x1: number\n  count: number\n}\n\nexport function computeExtent(data: number[]): [number, number] {\n  let min = data[0]\n  let max = data[0]\n  for (let i = 1; i < data.length; i++) {\n    if (data[i] < min) min = data[i]\n    if (data[i] > max) max = data[i]\n  }\n  return [min, max]\n}\n\nexport function computeMean(data: number[]): number {\n  let sum = 0\n  for (let i = 0; i < data.length; i++) {\n    sum += data[i]\n  }\n  return sum / data.length\n}\n\nexport function computeHistogramBins(\n  data: number[],\n  binCount?: number,\n): HistogramBin[] {\n  const count = binCount ?? Math.ceil(Math.sqrt(data.length))\n  const [min, max] = computeExtent(data)\n  const span = max - min\n\n  // Handle case where all values are the same\n  if (span === 0) {\n    const bins: HistogramBin[] = []\n    for (let i = 0; i < count; i++) {\n      bins.push({ x0: min, x1: max, count: 0 })\n    }\n    // Put all items in the first bin\n    bins[0].count = data.length\n    return bins\n  }\n\n  const binWidth = span / count\n  const bins: HistogramBin[] = []\n  for (let i = 0; i < count; i++) {\n    bins.push({\n      x0: min + i * binWidth,\n      x1: min + (i + 1) * binWidth,\n      count: 0,\n    })\n  }\n\n  for (const value of data) {\n    let idx = Math.floor((value - min) / binWidth)\n    // Values at the max boundary go into the last bin\n    if (idx >= count) idx = count - 1\n    bins[idx].count++\n  }\n\n  return bins\n}\n\nexport function normalizeData<T>(\n  data: T[],\n  accessor: string | ((d: T) => unknown),\n): unknown[] {\n  if (typeof accessor === 'string') {\n    return data.map((d) => (d as Record<string, unknown>)[accessor])\n  }\n  return data.map(accessor)\n}\n", "export interface Point {\n  x: number\n  y: number\n}\n\nexport function linePath(points: Point[]): string {\n  if (points.length === 0) return ''\n  let d = `M${points[0].x},${points[0].y}`\n  for (let i = 1; i < points.length; i++) {\n    d += `L${points[i].x},${points[i].y}`\n  }\n  return d\n}\n\nexport function areaPath(points: Point[], baseline: number): string {\n  if (points.length === 0) return ''\n  // Forward path along points\n  let d = `M${points[0].x},${points[0].y}`\n  for (let i = 1; i < points.length; i++) {\n    d += `L${points[i].x},${points[i].y}`\n  }\n  // Drop down to baseline, go back to start, close\n  const last = points[points.length - 1]\n  const first = points[0]\n  d += `L${last.x},${baseline}`\n  d += `L${first.x},${baseline}`\n  d += 'Z'\n  return d\n}\n\nexport function arcPath(\n  cx: number,\n  cy: number,\n  radius: number,\n  startAngle: number,\n  endAngle: number,\n): string {\n  const x1 = cx + radius * Math.cos(startAngle)\n  const y1 = cy + radius * Math.sin(startAngle)\n  const x2 = cx + radius * Math.cos(endAngle)\n  const y2 = cy + radius * Math.sin(endAngle)\n\n  const largeArcFlag = endAngle - startAngle > Math.PI ? 1 : 0\n\n  // Round to avoid floating point noise in path string\n  const r = (n: number) => Math.round(n * 1e6) / 1e6\n\n  let d = `M${r(x1)},${r(y1)}`\n  d += `A${radius},${radius} 0 ${largeArcFlag} 1 ${r(x2)},${r(y2)}`\n  d += `L${cx},${cy}`\n  d += 'Z'\n\n  return d\n}\n", "export interface Margin {\n  top: number\n  right: number\n  bottom: number\n  left: number\n}\n\nexport interface Dimensions {\n  width: number\n  height: number\n  margin: Margin\n  boundedWidth: number\n  boundedHeight: number\n}\n\nexport interface ChartConfig {\n  width?: number\n  height?: number\n  margin?: Partial<Margin>\n  data?: unknown[]\n}\n\nexport interface ChartAPI {\n  dimensions: Dimensions\n  scales: Record<string, unknown>\n  updateDimensions: (partial: Partial<ChartConfig>) => void\n}\n\nconst DEFAULT_MARGIN: Margin = {\n  top: 40,\n  right: 30,\n  bottom: 40,\n  left: 75,\n}\n\nconst DEFAULT_WIDTH = 600\nconst DEFAULT_HEIGHT = 400\n\nexport function combineDimensions(partial: Partial<ChartConfig>): Dimensions {\n  const width = partial.width ?? DEFAULT_WIDTH\n  const height = partial.height ?? DEFAULT_HEIGHT\n  const margin: Margin = {\n    ...DEFAULT_MARGIN,\n    ...(partial.margin ?? {}),\n  }\n  const boundedWidth = Math.max(0, width - margin.left - margin.right)\n  const boundedHeight = Math.max(0, height - margin.top - margin.bottom)\n\n  return { width, height, margin, boundedWidth, boundedHeight }\n}\n\nexport function createChart(config: ChartConfig): ChartAPI {\n  let dimensions = combineDimensions(config)\n  const scales: Record<string, unknown> = {}\n\n  return {\n    get dimensions() {\n      return dimensions\n    },\n    scales,\n    updateDimensions(partial: Partial<ChartConfig>) {\n      const merged: Partial<ChartConfig> = {\n        width: partial.width ?? dimensions.width,\n        height: partial.height ?? dimensions.height,\n        margin: {\n          ...dimensions.margin,\n          ...(partial.margin ?? {}),\n        },\n      }\n      dimensions = combineDimensions(merged)\n    },\n  }\n}\n", "import type { LinearScale, BandScale, TimeScale } from './scales.js'\n\ntype AnyScale = LinearScale | BandScale | TimeScale\n\nexport function generateTicks(\n  scale: AnyScale,\n  count?: number,\n): (number | string | Date)[] {\n  if (scale.type === 'band') {\n    return scale.domain\n  }\n  if (scale.type === 'time') {\n    return scale.ticks(count)\n  }\n  // linear\n  return scale.ticks(count)\n}\n\nexport function formatTick(\n  value: number | string | Date,\n  type: 'number' | 'date' | 'string',\n): string {\n  if (type === 'string') {\n    return String(value)\n  }\n\n  if (type === 'date') {\n    if (value instanceof Date) {\n      return value.toISOString().split('T')[0]\n    }\n    return String(value)\n  }\n\n  // type === 'number'\n  const num = value as number\n  if (!Number.isFinite(num)) return String(num)\n\n  // Check if integer\n  if (Number.isInteger(num)) {\n    // Format with locale separators for large numbers\n    return num.toLocaleString('en-US', { maximumFractionDigits: 0 })\n  }\n\n  // Decimal: show up to 2 decimal places, strip trailing zeros\n  const formatted = num.toLocaleString('en-US', {\n    minimumFractionDigits: 0,\n    maximumFractionDigits: 2,\n  })\n  return formatted\n}\n", "/**\n * Colorblind-safe color palettes for charts.\n * Based on Wong (2011) \"Points of view: Color blindness\" — Nature Methods.\n * These 8 colors are distinguishable by people with all types of color vision deficiency.\n */\nexport const COLORBLIND_SAFE_PALETTE = [\n  '#0072B2', // blue\n  '#E69F00', // orange\n  '#009E73', // green (blue-tinted, safe for protanopia/deuteranopia)\n  '#F0E442', // yellow\n  '#56B4E9', // sky blue\n  '#D55E00', // vermillion (not red — distinguishable from green)\n  '#CC79A7', // pink\n  '#000000', // black\n] as const\n\n/** Convert hex to HSL string for CSS variables */\nexport function hexToHSL(hex: string): string {\n  // Remove # prefix\n  const h = hex.replace(/^#/, '')\n\n  const r = parseInt(h.substring(0, 2), 16) / 255\n  const g = parseInt(h.substring(2, 4), 16) / 255\n  const b = parseInt(h.substring(4, 6), 16) / 255\n\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  const l = (max + min) / 2\n\n  if (max === min) {\n    // Achromatic\n    return `0 0% ${Math.round(l * 100)}%`\n  }\n\n  const d = max - min\n  const s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n\n  let hue: number\n  if (max === r) {\n    hue = ((g - b) / d + (g < b ? 6 : 0)) / 6\n  } else if (max === g) {\n    hue = ((b - r) / d + 2) / 6\n  } else {\n    hue = ((r - g) / d + 4) / 6\n  }\n\n  return `${Math.round(hue * 360)} ${Math.round(s * 100)}% ${Math.round(l * 100)}%`\n}\n\n/** Get a colorblind-safe color by index (wraps around) */\nexport function getChartColor(index: number): string {\n  return COLORBLIND_SAFE_PALETTE[index % COLORBLIND_SAFE_PALETTE.length]\n}\n\n/**\n * Pattern fills for charts — when color alone isn't enough.\n * Returns SVG pattern definitions that can be used as fill.\n */\nexport type PatternType = 'solid' | 'diagonal' | 'dots' | 'crosshatch' | 'horizontal' | 'vertical' | 'zigzag' | 'checker'\n\nexport function getPatternDef(type: PatternType, color: string, id: string): string {\n  const size = 8\n\n  switch (type) {\n    case 'solid':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\"/></pattern>`\n\n    case 'diagonal':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\" opacity=\"0.3\"/><line x1=\"0\" y1=\"${size}\" x2=\"${size}\" y2=\"0\" stroke=\"${color}\" stroke-width=\"1.5\"/></pattern>`\n\n    case 'dots':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\" opacity=\"0.3\"/><circle cx=\"${size / 2}\" cy=\"${size / 2}\" r=\"1.5\" fill=\"${color}\"/></pattern>`\n\n    case 'crosshatch':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\" opacity=\"0.3\"/><line x1=\"0\" y1=\"0\" x2=\"${size}\" y2=\"${size}\" stroke=\"${color}\" stroke-width=\"1\"/><line x1=\"${size}\" y1=\"0\" x2=\"0\" y2=\"${size}\" stroke=\"${color}\" stroke-width=\"1\"/></pattern>`\n\n    case 'horizontal':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\" opacity=\"0.3\"/><line x1=\"0\" y1=\"${size / 2}\" x2=\"${size}\" y2=\"${size / 2}\" stroke=\"${color}\" stroke-width=\"1.5\"/></pattern>`\n\n    case 'vertical':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\" opacity=\"0.3\"/><line x1=\"${size / 2}\" y1=\"0\" x2=\"${size / 2}\" y2=\"${size}\" stroke=\"${color}\" stroke-width=\"1.5\"/></pattern>`\n\n    case 'zigzag':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\" opacity=\"0.3\"/><polyline points=\"0,${size} ${size / 2},0 ${size},${size}\" fill=\"none\" stroke=\"${color}\" stroke-width=\"1.5\"/></pattern>`\n\n    case 'checker':\n      return `<pattern id=\"${id}\" width=\"${size}\" height=\"${size}\" patternUnits=\"userSpaceOnUse\"><rect width=\"${size}\" height=\"${size}\" fill=\"${color}\" opacity=\"0.3\"/><rect width=\"${size / 2}\" height=\"${size / 2}\" fill=\"${color}\"/><rect x=\"${size / 2}\" y=\"${size / 2}\" width=\"${size / 2}\" height=\"${size / 2}\" fill=\"${color}\"/></pattern>`\n  }\n}\n\nexport const PATTERNS: PatternType[] = [\n  'solid',\n  'diagonal',\n  'dots',\n  'crosshatch',\n  'horizontal',\n  'vertical',\n  'zigzag',\n  'checker',\n]\n", "import { createContext, useContext } from 'react'\nimport { devWarn } from '@refraction-ui/shared'\nimport type { Dimensions, Margin } from '@refraction-ui/charts'\n\nexport interface ChartContextValue {\n  dimensions: Dimensions\n  /**\n   * Internal marker: `true` only on the context *default* (i.e. no `<Chart>`\n   * provider above this consumer). `<Chart>` always supplies a value without\n   * this flag. Used purely to detect the silent-default footgun — never read\n   * for rendering, and stripped from the public type surface.\n   *\n   * @internal\n   */\n  __isDefault?: boolean\n}\n\nconst DEFAULT_MARGIN: Margin = { top: 40, right: 30, bottom: 40, left: 75 }\n\nexport const ChartContext = createContext<ChartContextValue>({\n  __isDefault: true,\n  dimensions: {\n    width: 600,\n    height: 400,\n    margin: DEFAULT_MARGIN,\n    boundedWidth: 600 - DEFAULT_MARGIN.left - DEFAULT_MARGIN.right,\n    boundedHeight: 400 - DEFAULT_MARGIN.top - DEFAULT_MARGIN.bottom,\n  },\n})\n\n/**\n * Read the chart context for a sub-chart (`Bars`, `Line`, `Circles`, …).\n *\n * Footgun seam (epic #254 / #256, policy: `silent-default-context`): when a\n * sub-chart is rendered without a `<Chart>` ancestor it silently falls back to\n * a 600x400 default and renders visibly wrong (wrong scale, clipped, or\n * zero-sized) with no error. There is no throw today and adding one would be a\n * breaking change, so per `docs/instrumentation/policy.md` a dev-only\n * `devWarn` is the *only* signal. Stripped in production, warn-once.\n *\n * Behaviour is unchanged: the default dimensions are still returned.\n */\nexport function useChartContext(): ChartContextValue {\n  const ctx = useContext(ChartContext)\n  if (ctx.__isDefault) {\n    devWarn(\n      'react-charts/no-chart-provider',\n      'A chart sub-component (Bars/Line/Circles/…) was rendered without a <Chart> ancestor. ' +\n        'It is silently falling back to default 600x400 dimensions and will render with the ' +\n        'wrong scale. Wrap it in <Chart>…</Chart>.',\n    )\n  }\n  return ctx\n}\n", "import * as React from 'react'\nimport { combineDimensions } from '@refraction-ui/charts'\nimport type { Margin } from '@refraction-ui/charts'\nimport { ChartContext } from './chart-context.js'\n\nexport interface ChartProps {\n  width?: number\n  height?: number\n  margin?: Partial<Margin>\n  children?: React.ReactNode\n  className?: string\n}\n\nexport function Chart({\n  width = 600,\n  height = 400,\n  margin,\n  children,\n  className,\n}: ChartProps) {\n  const dimensions = combineDimensions({ width, height, margin })\n\n  return (\n    <svg width={width} height={height} className={className}>\n      <ChartContext.Provider value={{ dimensions }}>\n        <g transform={`translate(${dimensions.margin.left},${dimensions.margin.top})`}>\n          {children}\n        </g>\n      </ChartContext.Provider>\n    </svg>\n  )\n}\n", "import * as React from 'react'\nimport { createBandScale, createLinearScale, computeExtent } from '@refraction-ui/charts'\nimport { useChartContext } from './chart-context.js'\n\nexport interface BarsProps<T = unknown> {\n  data: T[]\n  x: (d: T) => string\n  y: (d: T) => number\n  fill?: string\n  className?: string\n}\n\nexport function Bars<T>({ data, x, y, fill = 'currentColor', className }: BarsProps<T>) {\n  const { dimensions } = useChartContext()\n  const { boundedWidth, boundedHeight } = dimensions\n\n  const labels = data.map(x)\n  const values = data.map(y)\n  const [, maxVal] = computeExtent(values)\n\n  const xScale = createBandScale(labels, [0, boundedWidth], 0.1)\n  const yScale = createLinearScale([0, maxVal], [boundedHeight, 0])\n\n  return (\n    <g className={className}>\n      {data.map((d, i) => {\n        const label = labels[i]\n        const value = values[i]\n        const barX = xScale(label)\n        const barY = yScale(value)\n        const barHeight = boundedHeight - barY\n        const barWidth = xScale.bandwidth()\n\n        return (\n          <rect\n            key={i}\n            x={barX}\n            y={barY}\n            width={barWidth}\n            height={barHeight}\n            fill={fill}\n          />\n        )\n      })}\n    </g>\n  )\n}\n", "import * as React from 'react'\nimport { createLinearScale, computeExtent, linePath } from '@refraction-ui/charts'\nimport { useChartContext } from './chart-context.js'\n\nexport interface LineProps<T = unknown> {\n  data: T[]\n  x: (d: T) => number\n  y: (d: T) => number\n  stroke?: string\n  strokeWidth?: number\n  fill?: string\n  className?: string\n}\n\nexport function Line<T>({\n  data,\n  x,\n  y,\n  stroke = 'currentColor',\n  strokeWidth = 2,\n  fill = 'none',\n  className,\n}: LineProps<T>) {\n  const { dimensions } = useChartContext()\n  const { boundedWidth, boundedHeight } = dimensions\n\n  const xValues = data.map(x)\n  const yValues = data.map(y)\n  const [xMin, xMax] = computeExtent(xValues)\n  const [yMin, yMax] = computeExtent(yValues)\n\n  const xScale = createLinearScale([xMin, xMax], [0, boundedWidth])\n  const yScale = createLinearScale([yMin, yMax], [boundedHeight, 0])\n\n  const points = data.map((d) => ({\n    x: xScale(x(d)),\n    y: yScale(y(d)),\n  }))\n\n  const d = linePath(points)\n\n  return (\n    <path\n      className={className}\n      d={d}\n      stroke={stroke}\n      strokeWidth={strokeWidth}\n      fill={fill}\n    />\n  )\n}\n", "import * as React from 'react'\nimport { createLinearScale, computeExtent } from '@refraction-ui/charts'\nimport { useChartContext } from './chart-context.js'\n\nexport interface CirclesProps<T = unknown> {\n  data: T[]\n  cx: (d: T) => number\n  cy: (d: T) => number\n  r?: number\n  fill?: string\n  className?: string\n}\n\nexport function Circles<T>({\n  data,\n  cx,\n  cy,\n  r = 4,\n  fill = 'currentColor',\n  className,\n}: CirclesProps<T>) {\n  const { dimensions } = useChartContext()\n  const { boundedWidth, boundedHeight } = dimensions\n\n  const xValues = data.map(cx)\n  const yValues = data.map(cy)\n  const [xMin, xMax] = computeExtent(xValues)\n  const [yMin, yMax] = computeExtent(yValues)\n\n  const xScale = createLinearScale([xMin, xMax], [0, boundedWidth])\n  const yScale = createLinearScale([yMin, yMax], [boundedHeight, 0])\n\n  return (\n    <g className={className}>\n      {data.map((d, i) => (\n        <circle\n          key={i}\n          cx={xScale(cx(d))}\n          cy={yScale(cy(d))}\n          r={r}\n          fill={fill}\n        />\n      ))}\n    </g>\n  )\n}\n", "import * as React from 'react'\n\nexport interface XAxisProps {\n  ticks: (number | string)[]\n  scale: (value: number | string) => number\n  height: number\n  tickSize?: number\n  className?: string\n}\n\nexport function XAxis({\n  ticks,\n  scale,\n  height,\n  tickSize = 6,\n  className,\n}: XAxisProps) {\n  return (\n    <g className={className} transform={`translate(0,${height})`}>\n      {ticks.map((tick, i) => {\n        const x = scale(tick)\n        return (\n          <g key={i} transform={`translate(${x},0)`}>\n            <line y2={tickSize} stroke=\"currentColor\" />\n            <text\n              y={tickSize + 9}\n              textAnchor=\"middle\"\n              fontSize={12}\n              fill=\"currentColor\"\n            >\n              {String(tick)}\n            </text>\n          </g>\n        )\n      })}\n    </g>\n  )\n}\n", "import * as React from 'react'\n\nexport interface YAxisProps {\n  ticks: (number | string)[]\n  scale: (value: number | string) => number\n  tickSize?: number\n  className?: string\n}\n\nexport function YAxis({\n  ticks,\n  scale,\n  tickSize = 6,\n  className,\n}: YAxisProps) {\n  return (\n    <g className={className}>\n      {ticks.map((tick, i) => {\n        const y = scale(tick)\n        return (\n          <g key={i} transform={`translate(0,${y})`}>\n            <line x2={-tickSize} stroke=\"currentColor\" />\n            <text\n              x={-tickSize - 4}\n              dy=\"0.32em\"\n              textAnchor=\"end\"\n              fontSize={12}\n              fill=\"currentColor\"\n            >\n              {String(tick)}\n            </text>\n          </g>\n        )\n      })}\n    </g>\n  )\n}\n", "import * as React from 'react'\n\nexport interface GradientProps {\n  id: string\n  from: string\n  to: string\n  direction?: 'vertical' | 'horizontal'\n  className?: string\n}\n\nexport function Gradient({\n  id,\n  from,\n  to,\n  direction = 'vertical',\n  className,\n}: GradientProps) {\n  const isVertical = direction === 'vertical'\n\n  return (\n    <defs className={className}>\n      <linearGradient\n        id={id}\n        x1=\"0\"\n        y1=\"0\"\n        x2={isVertical ? '0' : '1'}\n        y2={isVertical ? '1' : '0'}\n      >\n        <stop offset=\"0%\" stopColor={from} />\n        <stop offset=\"100%\" stopColor={to} />\n      </linearGradient>\n    </defs>\n  )\n}\n", "import * as React from 'react'\nimport {\n  computeHistogramBins,\n  createLinearScale,\n  createBandScale,\n  combineDimensions,\n  formatTick,\n} from '@refraction-ui/charts'\nimport type { Margin } from '@refraction-ui/charts'\n\nexport interface HistogramProps {\n  data: number[]\n  width?: number\n  height?: number\n  bins?: number\n  fill?: string\n  margin?: Partial<Margin>\n  className?: string\n}\n\nexport function Histogram({\n  data,\n  width = 600,\n  height = 400,\n  bins: binCount = 10,\n  fill = 'steelblue',\n  margin,\n  className,\n}: HistogramProps) {\n  const dimensions = combineDimensions({ width, height, margin })\n  const { boundedWidth, boundedHeight } = dimensions\n\n  const histBins = computeHistogramBins(data, binCount)\n  const maxCount = Math.max(...histBins.map((b) => b.count))\n\n  const labels = histBins.map((b) => `${formatTick(b.x0, 'number')}-${formatTick(b.x1, 'number')}`)\n  const xScale = createBandScale(labels, [0, boundedWidth], 0.05)\n  const yScale = createLinearScale([0, maxCount], [boundedHeight, 0])\n\n  const yTicks = yScale.ticks(5)\n\n  return (\n    <svg width={width} height={height} className={className}>\n      <g transform={`translate(${dimensions.margin.left},${dimensions.margin.top})`}>\n        {histBins.map((bin, i) => {\n          const label = labels[i]\n          const barX = xScale(label)\n          const barY = yScale(bin.count)\n          const barHeight = boundedHeight - barY\n          const barWidth = xScale.bandwidth()\n          return (\n            <rect\n              key={i}\n              x={barX}\n              y={barY}\n              width={barWidth}\n              height={barHeight}\n              fill={fill}\n            />\n          )\n        })}\n        {/* X Axis */}\n        <g transform={`translate(0,${boundedHeight})`}>\n          {labels.map((label, i) => {\n            const x = xScale(label) + xScale.bandwidth() / 2\n            return (\n              <g key={i} transform={`translate(${x},0)`}>\n                <line y2={6} stroke=\"currentColor\" />\n                <text y={18} textAnchor=\"middle\" fontSize={10} fill=\"currentColor\">\n                  {label}\n                </text>\n              </g>\n            )\n          })}\n        </g>\n        {/* Y Axis */}\n        <g>\n          {yTicks.map((tick, i) => {\n            const y = yScale(tick)\n            return (\n              <g key={i} transform={`translate(0,${y})`}>\n                <line x2={-6} stroke=\"currentColor\" />\n                <text x={-9} dy=\"0.32em\" textAnchor=\"end\" fontSize={10} fill=\"currentColor\">\n                  {formatTick(tick, 'number')}\n                </text>\n              </g>\n            )\n          })}\n        </g>\n      </g>\n    </svg>\n  )\n}\n", "import * as React from 'react'\nimport {\n  createLinearScale,\n  computeExtent,\n  combineDimensions,\n  formatTick,\n} from '@refraction-ui/charts'\nimport type { Margin } from '@refraction-ui/charts'\n\nexport interface ScatterPlotProps<T = unknown> {\n  data: T[]\n  x: (d: T) => number\n  y: (d: T) => number\n  width?: number\n  height?: number\n  r?: number\n  fill?: string\n  margin?: Partial<Margin>\n  className?: string\n}\n\nexport function ScatterPlot<T>({\n  data,\n  x,\n  y,\n  width = 600,\n  height = 400,\n  r = 4,\n  fill = 'steelblue',\n  margin,\n  className,\n}: ScatterPlotProps<T>) {\n  const dimensions = combineDimensions({ width, height, margin })\n  const { boundedWidth, boundedHeight } = dimensions\n\n  const xValues = data.map(x)\n  const yValues = data.map(y)\n  const [xMin, xMax] = computeExtent(xValues)\n  const [yMin, yMax] = computeExtent(yValues)\n\n  const xScale = createLinearScale([xMin, xMax], [0, boundedWidth])\n  const yScale = createLinearScale([yMin, yMax], [boundedHeight, 0])\n\n  const xTicks = xScale.ticks(5)\n  const yTicks = yScale.ticks(5)\n\n  return (\n    <svg width={width} height={height} className={className}>\n      <g transform={`translate(${dimensions.margin.left},${dimensions.margin.top})`}>\n        {data.map((d, i) => (\n          <circle\n            key={i}\n            cx={xScale(x(d))}\n            cy={yScale(y(d))}\n            r={r}\n            fill={fill}\n          />\n        ))}\n        {/* X Axis */}\n        <g transform={`translate(0,${boundedHeight})`}>\n          {xTicks.map((tick, i) => {\n            const px = xScale(tick)\n            return (\n              <g key={i} transform={`translate(${px},0)`}>\n                <line y2={6} stroke=\"currentColor\" />\n                <text y={18} textAnchor=\"middle\" fontSize={10} fill=\"currentColor\">\n                  {formatTick(tick, 'number')}\n                </text>\n              </g>\n            )\n          })}\n        </g>\n        {/* Y Axis */}\n        <g>\n          {yTicks.map((tick, i) => {\n            const py = yScale(tick)\n            return (\n              <g key={i} transform={`translate(0,${py})`}>\n                <line x2={-6} stroke=\"currentColor\" />\n                <text x={-9} dy=\"0.32em\" textAnchor=\"end\" fontSize={10} fill=\"currentColor\">\n                  {formatTick(tick, 'number')}\n                </text>\n              </g>\n            )\n          })}\n        </g>\n      </g>\n    </svg>\n  )\n}\n", "import * as React from 'react'\nimport { arcPath } from '@refraction-ui/charts'\n\nconst DEFAULT_COLORS = [\n  '#4e79a7', '#f28e2b', '#e15759', '#76b7b2',\n  '#59a14f', '#edc948', '#b07aa1', '#ff9da7',\n  '#9c755f', '#bab0ac',\n]\n\nexport interface PieChartProps<T = unknown> {\n  data: T[]\n  value: (d: T) => number\n  width?: number\n  height?: number\n  colors?: string[]\n  className?: string\n}\n\nexport function PieChart<T>({\n  data,\n  value,\n  width = 300,\n  height = 300,\n  colors = DEFAULT_COLORS,\n  className,\n}: PieChartProps<T>) {\n  const cx = width / 2\n  const cy = height / 2\n  const radius = Math.min(cx, cy) - 10\n\n  const values = data.map(value)\n  const total = values.reduce((sum, v) => sum + v, 0)\n\n  let currentAngle = -Math.PI / 2\n\n  const arcs = data.map((_, i) => {\n    const sliceAngle = (values[i] / total) * Math.PI * 2\n    const startAngle = currentAngle\n    const endAngle = currentAngle + sliceAngle\n    currentAngle = endAngle\n    return { startAngle, endAngle, color: colors[i % colors.length] }\n  })\n\n  return (\n    <svg width={width} height={height} className={className}>\n      {arcs.map((arc, i) => (\n        <path\n          key={i}\n          d={arcPath(cx, cy, radius, arc.startAngle, arc.endAngle)}\n          fill={arc.color}\n        />\n      ))}\n    </svg>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["bins", "DEFAULT_MARGIN", "jsx", "computeExtent", "createLinearScale", "d", "jsxs", "combineDimensions", "createBandScale", "formatTick"]
+}

package/dist/react-checkbox.js

@@ -0,0 +1,156 @@
+import {
+  Keys,
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-checkbox/dist/index.js
+import * as React from "react";
+
+// ../checkbox/dist/index.js
+function createCheckbox(props = {}) {
+  const { checked = false, disabled = false } = props;
+  const isInteractive = !disabled;
+  const ariaProps = {
+    role: "checkbox",
+    "aria-checked": checked === "indeterminate" ? "mixed" : checked
+  };
+  if (disabled) {
+    ariaProps["aria-disabled"] = true;
+  }
+  const dataAttributes = {};
+  if (checked === "indeterminate") {
+    dataAttributes["data-state"] = "indeterminate";
+  } else if (checked) {
+    dataAttributes["data-state"] = "checked";
+  } else {
+    dataAttributes["data-state"] = "unchecked";
+  }
+  if (disabled) {
+    dataAttributes["data-disabled"] = "";
+  }
+  const keyboardHandlers = {};
+  if (!isInteractive) {
+    keyboardHandlers[Keys.Space] = (e) => e.preventDefault();
+  }
+  return {
+    ariaProps,
+    keyboardHandlers,
+    isInteractive,
+    dataAttributes,
+    state: { checked, disabled }
+  };
+}
+var checkIconPath = "M20 6L9 17l-5-5";
+var indeterminateIconPath = "M5 12h14";
+var checkboxTokens = {
+  name: "checkbox",
+  tokens: {
+    bg: { variable: "--rfr-checkbox-bg", fallback: "hsl(var(--background))" },
+    "bg-checked": { variable: "--rfr-checkbox-bg-checked", fallback: "hsl(var(--primary))" },
+    fg: { variable: "--rfr-checkbox-fg", fallback: "hsl(var(--primary-foreground))" },
+    border: { variable: "--rfr-checkbox-border", fallback: "hsl(var(--primary))" },
+    ring: { variable: "--rfr-checkbox-ring", fallback: "hsl(var(--ring))" }
+  }
+};
+var checkboxVariants = cva({
+  base: "peer shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+  variants: {
+    checked: {
+      true: "bg-primary text-primary-foreground",
+      false: "bg-background",
+      indeterminate: "bg-primary text-primary-foreground"
+    },
+    size: {
+      sm: "h-3.5 w-3.5",
+      default: "h-4 w-4",
+      lg: "h-5 w-5"
+    }
+  },
+  defaultVariants: {
+    checked: "false",
+    size: "default"
+  }
+});
+
+// ../react-checkbox/dist/index.js
+import { jsxs, jsx } from "react/jsx-runtime";
+var Checkbox = React.forwardRef(
+  function Checkbox2({ checked = false, onCheckedChange, disabled = false, size = "default", className, ...props }, ref) {
+    const api = createCheckbox({ checked, disabled });
+    const checkedVariant = checked === "indeterminate" ? "indeterminate" : checked ? "true" : "false";
+    const handleClick = () => {
+      if (api.isInteractive) {
+        if (checked === "indeterminate") {
+          onCheckedChange?.(true);
+        } else {
+          onCheckedChange?.(!checked);
+        }
+      }
+    };
+    const handleKeyDown = (e) => {
+      if (e.key === " ") {
+        e.preventDefault();
+        if (api.isInteractive) {
+          if (checked === "indeterminate") {
+            onCheckedChange?.(true);
+          } else {
+            onCheckedChange?.(!checked);
+          }
+        }
+      }
+    };
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: cn(checkboxVariants({ checked: checkedVariant, size }), className),
+        onClick: handleClick,
+        onKeyDown: handleKeyDown,
+        disabled,
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          checked === true && /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: "h-full w-full",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "3",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              "aria-hidden": "true",
+              children: /* @__PURE__ */ jsx("path", { d: checkIconPath })
+            }
+          ),
+          checked === "indeterminate" && /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: "h-full w-full",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "3",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              "aria-hidden": "true",
+              children: /* @__PURE__ */ jsx("path", { d: indeterminateIconPath })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+export {
+  Checkbox,
+  checkIconPath,
+  checkboxTokens,
+  checkboxVariants,
+  indeterminateIconPath
+};
+//# sourceMappingURL=react-checkbox.js.map

package/dist/react-checkbox.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../checkbox/src/checkbox.ts", "../../checkbox/src/checkbox.styles.ts", "../../react-checkbox/src/checkbox.tsx"],
+  "sourcesContent": ["import type { AccessibilityProps, KeyboardHandlerMap } from '@refraction-ui/shared'\nimport { Keys } from '@refraction-ui/shared'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport interface CheckboxProps {\n  checked?: CheckedState\n  disabled?: boolean\n  required?: boolean\n  name?: string\n  value?: string\n}\n\nexport interface CheckboxAPI {\n  /** ARIA attributes to spread on the element */\n  ariaProps: Partial<AccessibilityProps>\n  /** Keyboard handlers to attach */\n  keyboardHandlers: KeyboardHandlerMap\n  /** Whether interaction should be blocked */\n  isInteractive: boolean\n  /** Data attributes for CSS styling hooks */\n  dataAttributes: Record<string, string>\n  /** Current state */\n  state: {\n    checked: CheckedState\n    disabled: boolean\n  }\n}\n\nexport function createCheckbox(props: CheckboxProps = {}): CheckboxAPI {\n  const { checked = false, disabled = false } = props\n  const isInteractive = !disabled\n\n  const ariaProps: Partial<AccessibilityProps> = {\n    role: 'checkbox',\n    'aria-checked': checked === 'indeterminate' ? 'mixed' : checked,\n  }\n\n  if (disabled) {\n    ariaProps['aria-disabled'] = true\n  }\n\n  const dataAttributes: Record<string, string> = {}\n  if (checked === 'indeterminate') {\n    dataAttributes['data-state'] = 'indeterminate'\n  } else if (checked) {\n    dataAttributes['data-state'] = 'checked'\n  } else {\n    dataAttributes['data-state'] = 'unchecked'\n  }\n  if (disabled) {\n    dataAttributes['data-disabled'] = ''\n  }\n\n  const keyboardHandlers: KeyboardHandlerMap = {}\n  if (!isInteractive) {\n    keyboardHandlers[Keys.Space] = (e) => e.preventDefault()\n  }\n\n  return {\n    ariaProps,\n    keyboardHandlers,\n    isInteractive,\n    dataAttributes,\n    state: { checked, disabled },\n  }\n}\n\n/** SVG path data for the check icon */\nexport const checkIconPath = 'M20 6L9 17l-5-5'\n\n/** SVG path data for the indeterminate/minus icon */\nexport const indeterminateIconPath = 'M5 12h14'\n", "import { cva } from '@refraction-ui/shared'\nimport type { TokenContract } from '@refraction-ui/shared'\n\nexport const checkboxTokens: TokenContract = {\n  name: 'checkbox',\n  tokens: {\n    bg: { variable: '--rfr-checkbox-bg', fallback: 'hsl(var(--background))' },\n    'bg-checked': { variable: '--rfr-checkbox-bg-checked', fallback: 'hsl(var(--primary))' },\n    fg: { variable: '--rfr-checkbox-fg', fallback: 'hsl(var(--primary-foreground))' },\n    border: { variable: '--rfr-checkbox-border', fallback: 'hsl(var(--primary))' },\n    ring: { variable: '--rfr-checkbox-ring', fallback: 'hsl(var(--ring))' },\n  },\n}\n\nexport const checkboxVariants = cva({\n  base: 'peer shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',\n  variants: {\n    checked: {\n      true: 'bg-primary text-primary-foreground',\n      false: 'bg-background',\n      indeterminate: 'bg-primary text-primary-foreground',\n    },\n    size: {\n      sm: 'h-3.5 w-3.5',\n      default: 'h-4 w-4',\n      lg: 'h-5 w-5',\n    },\n  },\n  defaultVariants: {\n    checked: 'false',\n    size: 'default',\n  },\n})\n", "import * as React from 'react'\nimport {\n  createCheckbox,\n  checkboxVariants,\n  checkIconPath,\n  indeterminateIconPath,\n  type CheckedState,\n} from '@refraction-ui/checkbox'\nimport { cn } from '@refraction-ui/shared'\n\nexport interface CheckboxProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange'> {\n  checked?: CheckedState\n  onCheckedChange?: (checked: CheckedState) => void\n  disabled?: boolean\n  size?: 'sm' | 'default' | 'lg'\n}\n\n/**\n * Checkbox component -- renders a styled checkbox with check/indeterminate icons.\n *\n * Uses the headless @refraction-ui/checkbox core for state, ARIA, and keyboard handling.\n */\nexport const Checkbox = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n  function Checkbox({ checked = false, onCheckedChange, disabled = false, size = 'default', className, ...props }, ref) {\n    const api = createCheckbox({ checked, disabled })\n\n    const checkedVariant = checked === 'indeterminate' ? 'indeterminate' : checked ? 'true' : 'false'\n\n    const handleClick = () => {\n      if (api.isInteractive) {\n        if (checked === 'indeterminate') {\n          onCheckedChange?.(true)\n        } else {\n          onCheckedChange?.(!checked)\n        }\n      }\n    }\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (e.key === ' ') {\n        e.preventDefault()\n        if (api.isInteractive) {\n          if (checked === 'indeterminate') {\n            onCheckedChange?.(true)\n          } else {\n            onCheckedChange?.(!checked)\n          }\n        }\n      }\n    }\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(checkboxVariants({ checked: checkedVariant, size }), className)}\n        onClick={handleClick}\n        onKeyDown={handleKeyDown}\n        disabled={disabled}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      >\n        {checked === true && (\n          <svg\n            className=\"h-full w-full\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"3\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <path d={checkIconPath} />\n          </svg>\n        )}\n        {checked === 'indeterminate' && (\n          <svg\n            className=\"h-full w-full\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"3\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <path d={indeterminateIconPath} />\n          </svg>\n        )}\n      </button>\n    )\n  },\n)\n"],
+  "mappings": "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",
+  "names": ["Checkbox"]
+}

package/dist/react-checklist.js

@@ -0,0 +1,168 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-checklist/dist/index.js
+import * as React from "react";
+
+// ../checklist/dist/index.js
+function createChecklist() {
+  return {
+    ariaProps: { role: "list" },
+    dataAttributes: { "data-component": "checklist" }
+  };
+}
+function checklistProgress(items) {
+  const total = items.length;
+  const completed = items.filter((item) => item.checked).length;
+  const fraction = total === 0 ? 0 : completed / total;
+  return { completed, total, fraction };
+}
+function toggleChecklistItem(items, id) {
+  return items.map(
+    (item) => item.id === id ? { ...item, checked: !item.checked } : item
+  );
+}
+var checklistContainerClass = "flex flex-col gap-2";
+var checklistListClass = "flex flex-col gap-1";
+var checklistItemVariants = cva({
+  base: [
+    "flex items-start gap-3 rounded-md px-2 py-2 text-left",
+    "transition-colors hover:bg-accent",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ].join(" "),
+  variants: {
+    checked: {
+      true: "text-muted-foreground",
+      false: "text-foreground"
+    }
+  },
+  defaultVariants: {
+    checked: "false"
+  }
+});
+var checklistBoxVariants = cva({
+  base: [
+    "mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded",
+    "border transition-colors"
+  ].join(" "),
+  variants: {
+    checked: {
+      true: "border-primary bg-primary text-primary-foreground",
+      false: "border-input bg-background"
+    }
+  },
+  defaultVariants: {
+    checked: "false"
+  }
+});
+var checklistLabelWrapClass = "flex flex-col gap-0.5 min-w-0";
+var checklistLabelVariants = cva({
+  base: "text-sm font-medium leading-none transition-colors",
+  variants: {
+    checked: {
+      true: "line-through text-muted-foreground",
+      false: "text-foreground"
+    }
+  },
+  defaultVariants: {
+    checked: "false"
+  }
+});
+var checklistDescriptionClass = "text-xs text-muted-foreground";
+var checklistProgressClass = "text-xs text-muted-foreground tabular-nums";
+
+// ../react-checklist/dist/index.js
+import { jsxs, jsx } from "react/jsx-runtime";
+var Checklist = React.forwardRef(
+  function Checklist2({
+    items: itemsProp,
+    defaultItems,
+    onChange,
+    onItemToggle,
+    showProgress = false,
+    className,
+    ...props
+  }, ref) {
+    const isControlled = itemsProp !== void 0;
+    const [internal, setInternal] = React.useState(
+      defaultItems ?? []
+    );
+    const items = isControlled ? itemsProp : internal;
+    const handleToggle = React.useCallback(
+      (id) => {
+        const next = toggleChecklistItem(items, id);
+        if (!isControlled) setInternal(next);
+        onChange?.(next);
+        onItemToggle?.(id);
+      },
+      [items, isControlled, onChange, onItemToggle]
+    );
+    const { ariaProps, dataAttributes } = createChecklist();
+    const progress = showProgress ? checklistProgress(items) : null;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(checklistContainerClass, className),
+        ...dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("ul", { className: checklistListClass, ...ariaProps, children: items.map((item) => {
+            const checked = Boolean(item.checked);
+            return /* @__PURE__ */ jsx("li", { role: "presentation", children: /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                role: "checkbox",
+                "aria-checked": checked,
+                "data-state": checked ? "checked" : "unchecked",
+                className: checklistItemVariants({ checked: checked ? "true" : "false" }),
+                onClick: () => handleToggle(item.id),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      className: checklistBoxVariants({ checked: checked ? "true" : "false" }),
+                      children: checked && /* @__PURE__ */ jsx(
+                        "svg",
+                        {
+                          viewBox: "0 0 12 12",
+                          fill: "none",
+                          className: "h-3 w-3",
+                          "aria-hidden": "true",
+                          children: /* @__PURE__ */ jsx(
+                            "path",
+                            {
+                              d: "M2 6l3 3 5-5",
+                              stroke: "currentColor",
+                              strokeWidth: "1.5",
+                              strokeLinecap: "round",
+                              strokeLinejoin: "round"
+                            }
+                          )
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("span", { className: checklistLabelWrapClass, children: [
+                    /* @__PURE__ */ jsx("span", { className: checklistLabelVariants({ checked: checked ? "true" : "false" }), children: item.label }),
+                    item.description && /* @__PURE__ */ jsx("span", { className: checklistDescriptionClass, children: item.description })
+                  ] })
+                ]
+              }
+            ) }, item.id);
+          }) }),
+          progress !== null && /* @__PURE__ */ jsx("p", { className: checklistProgressClass, children: `${progress.completed}/${progress.total} completed` })
+        ]
+      }
+    );
+  }
+);
+export {
+  Checklist
+};
+//# sourceMappingURL=react-checklist.js.map

package/dist/react-checklist.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../checklist/src/checklist.ts", "../../checklist/src/checklist.styles.ts", "../../react-checklist/src/checklist.tsx"],
+  "sourcesContent": ["/** A single item in a checklist. */\nexport interface ChecklistItemData {\n  /** Unique identifier for this item. */\n  id: string\n  /** Display label for the item. */\n  label: string\n  /** Whether the item is completed. */\n  checked?: boolean\n  /** Optional additional description text. */\n  description?: string\n}\n\nexport interface ChecklistAPI {\n  /** ARIA attributes to spread on the list container (`role=\"list\"`). */\n  ariaProps: { role: 'list' }\n  /** Data attributes for styling hooks. */\n  dataAttributes: Record<string, string>\n}\n\n/**\n * Build the framework-agnostic container props for a checklist.\n *\n * Returns `role=\"list\"` plus a `data-component` attribute. Adapters spread\n * these onto their container element.\n */\nexport function createChecklist(): ChecklistAPI {\n  return {\n    ariaProps: { role: 'list' },\n    dataAttributes: { 'data-component': 'checklist' },\n  }\n}\n\n/**\n * Compute progress statistics for a checklist.\n *\n * Pure function — does not mutate the array.\n */\nexport function checklistProgress(items: ChecklistItemData[]): {\n  completed: number\n  total: number\n  fraction: number\n} {\n  const total = items.length\n  const completed = items.filter((item) => item.checked).length\n  const fraction = total === 0 ? 0 : completed / total\n  return { completed, total, fraction }\n}\n\n/**\n * Toggle a single item's `checked` state by id.\n *\n * Pure — returns a new array; the original is not mutated.\n * Items whose id does not match are returned unchanged (same reference).\n */\nexport function toggleChecklistItem(\n  items: ChecklistItemData[],\n  id: string,\n): ChecklistItemData[] {\n  return items.map((item) =>\n    item.id === id ? { ...item, checked: !item.checked } : item,\n  )\n}\n", "import { cva } from '@refraction-ui/shared'\n\n/** Outer container that wraps the list and optional progress summary. */\nexport const checklistContainerClass = 'flex flex-col gap-2'\n\n/** The `role=\"list\"` element holding all item rows. */\nexport const checklistListClass = 'flex flex-col gap-1'\n\n/**\n * A single item row — a button with checkbox semantics.\n *\n * The `checked` variant applies muted text and a line-through on the label\n * to communicate completion without relying solely on the checkbox visual.\n */\nexport const checklistItemVariants = cva({\n  base: [\n    'flex items-start gap-3 rounded-md px-2 py-2 text-left',\n    'transition-colors hover:bg-accent',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',\n    'disabled:pointer-events-none disabled:opacity-50',\n  ].join(' '),\n  variants: {\n    checked: {\n      true: 'text-muted-foreground',\n      false: 'text-foreground',\n    },\n  },\n  defaultVariants: {\n    checked: 'false',\n  },\n})\n\n/**\n * The visual checkbox box (the square indicator beside the label).\n *\n * The `checked` variant fills the box with the primary colour and shows a\n * checkmark via a border trick; the unchecked state shows an empty border.\n */\nexport const checklistBoxVariants = cva({\n  base: [\n    'mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded',\n    'border transition-colors',\n  ].join(' '),\n  variants: {\n    checked: {\n      true: 'border-primary bg-primary text-primary-foreground',\n      false: 'border-input bg-background',\n    },\n  },\n  defaultVariants: {\n    checked: 'false',\n  },\n})\n\n/** Wrapper for label + optional description text. */\nexport const checklistLabelWrapClass = 'flex flex-col gap-0.5 min-w-0'\n\n/** The item's primary label. Strikethrough is applied when the item is checked. */\nexport const checklistLabelVariants = cva({\n  base: 'text-sm font-medium leading-none transition-colors',\n  variants: {\n    checked: {\n      true: 'line-through text-muted-foreground',\n      false: 'text-foreground',\n    },\n  },\n  defaultVariants: {\n    checked: 'false',\n  },\n})\n\n/** Optional description — always in muted text, smaller than the label. */\nexport const checklistDescriptionClass = 'text-xs text-muted-foreground'\n\n/** Progress summary line shown below the list when `showProgress` is true. */\nexport const checklistProgressClass = 'text-xs text-muted-foreground tabular-nums'\n", "import * as React from 'react'\nimport {\n  createChecklist,\n  checklistProgress,\n  toggleChecklistItem,\n  checklistContainerClass,\n  checklistListClass,\n  checklistItemVariants,\n  checklistBoxVariants,\n  checklistLabelWrapClass,\n  checklistLabelVariants,\n  checklistDescriptionClass,\n  checklistProgressClass,\n  type ChecklistItemData,\n} from '@refraction-ui/checklist'\nimport { cn } from '@refraction-ui/shared'\n\nexport type { ChecklistItemData }\n\nexport interface ChecklistProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  /** Controlled list of items. */\n  items?: ChecklistItemData[]\n  /** Initial items for uncontrolled usage. */\n  defaultItems?: ChecklistItemData[]\n  /** Called when an item is toggled, with the updated items array. */\n  onChange?: (items: ChecklistItemData[]) => void\n  /** Called with the id of the item that was toggled. */\n  onItemToggle?: (id: string) => void\n  /** Show a \"{completed}/{total}\" progress summary below the list. */\n  showProgress?: boolean\n}\n\n/**\n * Checklist — an interactive task list with optional progress summary.\n *\n * Supports controlled (`items`) and uncontrolled (`defaultItems`) usage.\n * Each item renders as a `role=\"checkbox\"` button; clicking toggles its\n * checked state. Completed items receive muted + strikethrough styling.\n * Logic and styles come from the headless `@refraction-ui/checklist` core.\n */\nexport const Checklist = React.forwardRef<HTMLDivElement, ChecklistProps>(\n  function Checklist(\n    {\n      items: itemsProp,\n      defaultItems,\n      onChange,\n      onItemToggle,\n      showProgress = false,\n      className,\n      ...props\n    },\n    ref,\n  ) {\n    const isControlled = itemsProp !== undefined\n    const [internal, setInternal] = React.useState<ChecklistItemData[]>(\n      defaultItems ?? [],\n    )\n    const items = isControlled ? itemsProp : internal\n\n    const handleToggle = React.useCallback(\n      (id: string) => {\n        const next = toggleChecklistItem(items, id)\n        if (!isControlled) setInternal(next)\n        onChange?.(next)\n        onItemToggle?.(id)\n      },\n      [items, isControlled, onChange, onItemToggle],\n    )\n\n    const { ariaProps, dataAttributes } = createChecklist()\n    const progress = showProgress ? checklistProgress(items) : null\n\n    return (\n      <div\n        ref={ref}\n        className={cn(checklistContainerClass, className)}\n        {...dataAttributes}\n        {...props}\n      >\n        <ul className={checklistListClass} {...ariaProps}>\n          {items.map((item) => {\n            const checked = Boolean(item.checked)\n            return (\n              <li key={item.id} role=\"presentation\">\n                <button\n                  type=\"button\"\n                  role=\"checkbox\"\n                  aria-checked={checked}\n                  data-state={checked ? 'checked' : 'unchecked'}\n                  className={checklistItemVariants({ checked: checked ? 'true' : 'false' })}\n                  onClick={() => handleToggle(item.id)}\n                >\n                  <span\n                    aria-hidden=\"true\"\n                    className={checklistBoxVariants({ checked: checked ? 'true' : 'false' })}\n                  >\n                    {checked && (\n                      <svg\n                        viewBox=\"0 0 12 12\"\n                        fill=\"none\"\n                        className=\"h-3 w-3\"\n                        aria-hidden=\"true\"\n                      >\n                        <path\n                          d=\"M2 6l3 3 5-5\"\n                          stroke=\"currentColor\"\n                          strokeWidth=\"1.5\"\n                          strokeLinecap=\"round\"\n                          strokeLinejoin=\"round\"\n                        />\n                      </svg>\n                    )}\n                  </span>\n                  <span className={checklistLabelWrapClass}>\n                    <span className={checklistLabelVariants({ checked: checked ? 'true' : 'false' })}>\n                      {item.label}\n                    </span>\n                    {item.description && (\n                      <span className={checklistDescriptionClass}>\n                        {item.description}\n                      </span>\n                    )}\n                  </span>\n                </button>\n              </li>\n            )\n          })}\n        </ul>\n        {progress !== null && (\n          <p className={checklistProgressClass}>\n            {`${progress.completed}/${progress.total} completed`}\n          </p>\n        )}\n      </div>\n    )\n  },\n)\n"],
+  "mappings": "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",
+  "names": ["Checklist"]
+}

package/dist/react-code-block.js

@@ -0,0 +1,78 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-code-block/dist/index.js
+import * as React from "react";
+
+// ../code-block/dist/index.js
+function createCodeBlock() {
+  return { dataAttributes: { "data-slot": "code-block" } };
+}
+function createCodeBlockHeader() {
+  return { dataAttributes: { "data-slot": "code-block-header" } };
+}
+function createCodeBlockContent() {
+  return { dataAttributes: { "data-slot": "code-block-content" } };
+}
+var codeBlockVariants = cva({
+  base: "relative overflow-hidden rounded-lg border bg-zinc-950 text-zinc-50 dark:bg-zinc-900"
+});
+var codeBlockHeaderVariants = cva({
+  base: "flex items-center justify-between border-b border-zinc-800 bg-zinc-900/50 px-4 py-2 text-xs text-zinc-400"
+});
+var codeBlockContentVariants = cva({
+  base: "overflow-x-auto p-4 text-sm font-mono leading-relaxed"
+});
+
+// ../react-code-block/dist/index.js
+import { jsx } from "react/jsx-runtime";
+var CodeBlock = React.forwardRef(
+  function CodeBlock2({ className, ...props }, ref) {
+    const api = createCodeBlock();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(codeBlockVariants(), className),
+        ...api.dataAttributes,
+        ...props
+      }
+    );
+  }
+);
+var CodeBlockHeader = React.forwardRef(
+  function CodeBlockHeader2({ className, ...props }, ref) {
+    const api = createCodeBlockHeader();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(codeBlockHeaderVariants(), className),
+        ...api.dataAttributes,
+        ...props
+      }
+    );
+  }
+);
+var CodeBlockContent = React.forwardRef(
+  function CodeBlockContent2({ className, ...props }, ref) {
+    const api = createCodeBlockContent();
+    return /* @__PURE__ */ jsx(
+      "pre",
+      {
+        ref,
+        className: cn(codeBlockContentVariants(), className),
+        ...api.dataAttributes,
+        ...props
+      }
+    );
+  }
+);
+export {
+  CodeBlock,
+  CodeBlockContent,
+  CodeBlockHeader
+};
+//# sourceMappingURL=react-code-block.js.map

package/dist/react-code-block.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../code-block/src/code-block.ts", "../../code-block/src/code-block.styles.ts", "../../react-code-block/src/code-block.tsx"],
+  "sourcesContent": ["export interface CodeBlockAPI {\n  dataAttributes: Record<string, string>\n}\n\nexport function createCodeBlock(): CodeBlockAPI {\n  return { dataAttributes: { 'data-slot': 'code-block' } }\n}\n\nexport function createCodeBlockHeader(): CodeBlockAPI {\n  return { dataAttributes: { 'data-slot': 'code-block-header' } }\n}\n\nexport function createCodeBlockContent(): CodeBlockAPI {\n  return { dataAttributes: { 'data-slot': 'code-block-content' } }\n}\n", "import { cva } from '@refraction-ui/shared'\n\nexport const codeBlockVariants = cva({\n  base: 'relative overflow-hidden rounded-lg border bg-zinc-950 text-zinc-50 dark:bg-zinc-900',\n})\n\nexport const codeBlockHeaderVariants = cva({\n  base: 'flex items-center justify-between border-b border-zinc-800 bg-zinc-900/50 px-4 py-2 text-xs text-zinc-400',\n})\n\nexport const codeBlockContentVariants = cva({\n  base: 'overflow-x-auto p-4 text-sm font-mono leading-relaxed',\n})\n", "import * as React from 'react'\nimport {\n  createCodeBlock,\n  createCodeBlockHeader,\n  createCodeBlockContent,\n  codeBlockVariants,\n  codeBlockHeaderVariants,\n  codeBlockContentVariants,\n} from '@refraction-ui/code-block'\nimport { cn } from '@refraction-ui/shared'\n\nexport const CodeBlock = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CodeBlock({ className, ...props }, ref) {\n    const api = createCodeBlock()\n    return (\n      <div\n        ref={ref}\n        className={cn(codeBlockVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CodeBlockHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CodeBlockHeader({ className, ...props }, ref) {\n    const api = createCodeBlockHeader()\n    return (\n      <div\n        ref={ref}\n        className={cn(codeBlockHeaderVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CodeBlockContent = React.forwardRef<HTMLPreElement, React.HTMLAttributes<HTMLPreElement>>(\n  function CodeBlockContent({ className, ...props }, ref) {\n    const api = createCodeBlockContent()\n    return (\n      <pre\n        ref={ref}\n        className={cn(codeBlockContentVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n"],
+  "mappings": ";;;;;;;;;AAIO,SAAS,kBAAgC;AAC9C,SAAO,EAAE,gBAAgB,EAAE,aAAa,aAAA,EAAa;AACvD;AAEO,SAAS,wBAAsC;AACpD,SAAO,EAAE,gBAAgB,EAAE,aAAa,oBAAA,EAAoB;AAC9D;AAEO,SAAS,yBAAuC;AACrD,SAAO,EAAE,gBAAgB,EAAE,aAAa,qBAAA,EAAqB;AAC/D;ACZO,IAAM,oBAAoB,IAAI;EACnC,MAAM;AACR,CAAC;AAEM,IAAM,0BAA0B,IAAI;EACzC,MAAM;AACR,CAAC;AAEM,IAAM,2BAA2B,IAAI;EAC1C,MAAM;AACR,CAAC;;;;ACDM,IAAM,YAAkB;EAC7B,SAASA,WAAU,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AAC/C,UAAM,MAAM,gBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,kBAAA,GAAqB,SAAS;QAC3C,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,kBAAwB;EACnC,SAASC,iBAAgB,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACrD,UAAM,MAAM,sBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,wBAAA,GAA2B,SAAS;QACjD,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,mBAAyB;EACpC,SAASC,kBAAiB,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACtD,UAAM,MAAM,uBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,yBAAA,GAA4B,SAAS;QAClD,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;",
+  "names": ["CodeBlock", "CodeBlockHeader", "CodeBlockContent"]
+}