{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "line-chart",
  "type": "registry:ui",
  "title": "Line Chart",
  "description": "Multi-series line chart on a single y-axis with a crosshair tooltip listing every series, one-tab-stop keyboard navigation with a live readout, an automatic toggleable legend that keeps series colors stable, legend hover dimming, a table view and reduced-motion-safe draw-in.",
  "dependencies": [],
  "devDependencies": [],
  "registryDependencies": [
    "https://components.dethink.co.uk/r/dethink-base.json",
    "https://components.dethink.co.uk/r/chart-core.json",
    "https://components.dethink.co.uk/r/chart.json"
  ],
  "files": [
    {
      "path": "packages/components/src/components/line-chart/line-chart.tsx",
      "type": "registry:file",
      "target": "~/components/dethink/components/line-chart/line-chart.tsx",
      "content": "import { forwardRef } from \"react\";\nimport { ChartLine } from \"../chart/chart\";\nimport {\n  CartesianChart,\n  valueAt,\n  type CartesianChartProps,\n  type ChartDatum,\n} from \"../chart/cartesian-chart\";\n\nexport type { ChartDatum };\n\nexport type LineChartProps = CartesianChartProps;\n\nexport const LineChart = forwardRef<HTMLDivElement, LineChartProps>(\n  ({ animate = true, curve = \"monotone\", data, ...props }, ref) => (\n    <CartesianChart\n      {...props}\n      ref={ref}\n      data={data}\n      kind=\"line\"\n      layout={(visible) => ({\n        domainValues: data.flatMap((datum) =>\n          visible.map((item) => valueAt(datum, item.key)),\n        ),\n        pointValue: (key, i) => valueAt(data[i], key),\n        render: ({ x, y, active, highlighted }) =>\n          visible.map((item) => (\n            <ChartLine\n              key={item.key}\n              data-series={item.key}\n              values={data.map((datum) => valueAt(datum, item.key))}\n              x={x}\n              y={y}\n              color={item.colorVar}\n              curve={curve}\n              animate={animate}\n              endMarker={active === undefined}\n              dimmed={highlighted !== undefined && highlighted !== item.key}\n            />\n          )),\n      })}\n    />\n  ),\n);\n\nLineChart.displayName = \"LineChart\";\n"
    },
    {
      "path": "packages/components/src/components/line-chart/index.ts",
      "type": "registry:file",
      "target": "~/components/dethink/components/line-chart/index.ts",
      "content": "export { LineChart, type ChartDatum, type LineChartProps } from \"./line-chart\";\n"
    }
  ]
}
