{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "route-line",
  "type": "registry:component",
  "title": "Route line",
  "description": "One route, stop by stop, done and to come. Sample data: one van's route, depot at 07:30 to depot at 11:40, now at Elm Park.",
  "registryDependencies": [
    "@chartory/core",
    "@chartory/plot-metro"
  ],
  "files": [
    {
      "path": "registry/chartory/components/route-line.tsx",
      "type": "registry:component",
      "target": "components/chartory/route-line.tsx",
      "content": "// SPDX-License-Identifier: MIT · Copyright (c) 2026 BEY AGENCY LTD · Chartory, usechartory.com\n// Route line (Chartory chart 057): sizes xs | s | m | l, laid out again from the data at each\n// size; collection \"hearth\" (default) or \"signal\" (with @chartory/signal, Code and Complete). Data in the type's shape (default: the sample). Docs:\n// https://usechartory.com/docs/charts/route-line\nimport { ChartView, type ChartViewProps } from \"@/lib/chartory/charts/chart-view\"\nimport { registerChart } from \"@/lib/chartory/charts/defs\"\nimport { data as sample } from \"@/lib/chartory/charts/types/057-route-line/data\"\nimport { def } from \"@/lib/chartory/charts/types/057-route-line/layout\"\n\nregisterChart(def, sample)\n\nexport type RouteLineData = typeof sample\nexport type RouteLineProps = Omit<ChartViewProps, \"def\" | \"data\" | \"states\"> & {\n  /** the data to draw (default: the sample) */\n  data?: RouteLineData\n  /** further data states: the chart morphs to them (update) or ticks through them (live, with interval) */\n  states?: RouteLineData[]\n}\n\nexport function RouteLine(props: RouteLineProps) {\n  return <ChartView def={def} {...props} />\n}\n"
    },
    {
      "path": "registry/chartory/charts/types/057-route-line/data.ts",
      "type": "registry:lib",
      "target": "lib/chartory/charts/types/057-route-line/data.ts",
      "content": "// SPDX-License-Identifier: MIT · Copyright (c) 2026 BEY AGENCY LTD · Chartory, usechartory.com\n// 057 Route progress · sample data (Figma chart/057, from the Figma definition, seeded values expanded).\nimport type { MetroData } from \"../../plots/metro\";\n\nexport const data: MetroData = {\n  stops: [\n    { name: \"Depot\", eta: \"07:30\", state: \"done\" },\n    { name: \"Alder St\", eta: \"07:52\", state: \"done\" },\n    { name: \"Bay Rd\", eta: \"08:10\", state: \"done\" },\n    { name: \"Cole Sq\", eta: \"08:31\", state: \"done\" },\n    { name: \"Dock 4\", eta: \"08:58\", state: \"done\" },\n    { name: \"Elm Park\", eta: \"NOW\", state: \"now\" },\n    { name: \"Fern Hill\", eta: \"09:46\", state: \"next\" },\n    { name: \"Gate 9\", eta: \"10:05\", state: \"next\" },\n    { name: \"Harbor\", eta: \"10:28\", state: \"next\" },\n    { name: \"Iris Ave\", eta: \"10:51\", state: \"next\" },\n    { name: \"Juniper\", eta: \"11:14\", state: \"next\" },\n    { name: \"Depot\", eta: \"11:40\", state: \"next\" }\n  ]\n};\n"
    },
    {
      "path": "registry/chartory/charts/types/057-route-line/layout.ts",
      "type": "registry:lib",
      "target": "lib/chartory/charts/types/057-route-line/layout.ts",
      "content": "// SPDX-License-Identifier: MIT · Copyright (c) 2026 BEY AGENCY LTD · Chartory, usechartory.com\n// 057 Route line (Figma chart/057, \"Route progress\"): C.metro, 12 stops on two rows, the van at Elm Park.\nimport type { ChartDef, TooltipSpec } from \"../../core/shell\";\nimport { metro } from \"../../plots/metro\";\nimport { data } from \"./data\";\n\nconst done = data.stops.filter((s) => s.state === \"done\").length;\nconst state = { done: \"Delivered\", now: \"Current stop\", next: \"Planned\" };\n\nconst later = (t: string, m: number) => { const [h, mm] = t.split(\":\").map(Number), v = h * 60 + mm + m; return String(Math.floor(v / 60)).padStart(2, \"0\") + \":\" + String(v % 60).padStart(2, \"0\"); };\n\n// tooltip: one stop (group = stop index): name, time and status\nconst tip = (o: typeof data, g: number): TooltipSpec | null => {\n  const s = o.stops[g];\n  if (!s) return null;\n  return { kind: \"value\", text: s.state === \"now\" ? s.name + \" · Now\" : s.name + \" · \" + s.eta + \" · \" + state[s.state] };\n};\n\nexport const def: ChartDef = {\n  no: 57,\n  slug: \"route-line\",\n  legend: [[\"data/primary\", \"Delivered\"], [\"data/track\", \"Planned\"]],\n  plot: (K, p, w, d) => metro(K, p, w, (d as typeof data | undefined) ?? data),\n  tip: (d, g) => tip(d as typeof data, g),\n  // a later reading of the same run: the planned stops' times slip by a few minutes (traffic), delivered ones stay\n  update: (d, step) => {\n    const o = d as typeof data;\n    return { ...o, stops: o.stops.map((s, i) => (s.state === \"next\" ? { ...s, eta: later(s.eta, Math.max(1, Math.round(4 + 3 * Math.sin(i * 1.3 + step * 2.1) + step))) } : s)) };\n  },\n  describe: {\n    title: \"Route progress\",\n    summary: `A delivery route of ${data.stops.length} stops from the depot at 07:30 back to the depot at 11:40: ${done} stops delivered, now at Elm Park, ${data.stops.filter((s) => s.state === \"next\").length} still planned.`,\n    table: { head: [\"Stop\", \"Time\", \"Status\"], rows: data.stops.map((s) => [s.name, s.eta === \"NOW\" ? \"Now\" : s.eta, state[s.state]]) },\n  },\n};\n"
    }
  ],
  "categories": [
    "charts",
    "space-and-place"
  ],
  "meta": {
    "access": "free",
    "no": 57,
    "family": "Space and place"
  }
}