agentic-mermaid 0.1.0 → 0.1.2

package/src/ascii/xychart.ts

@@ -1,919 +0,0 @@
-// ============================================================================
-// ASCII renderer — XY Chart
-//
-// Renders xychart / xychart-beta diagrams to ASCII/Unicode text art.
-// Uses the parsed XYChart type directly (not PositionedXYChart) since
-// pixel coordinates don't map to character grids.
-//
-// Bar charts: █ (Unicode) or # (ASCII) block characters.
-// Line charts: continuous staircase routing with rounded corners (╭╮╰╯│─).
-//
-// Multi-series support: each series gets a distinct color from a palette.
-// ============================================================================
-
-import { applyXYChartFrontmatterConfig, parseXYChart } from '../xychart/parser.ts'
-import type { XYChart } from '../xychart/types.ts'
-import type { MermaidFrontmatterMap } from '../mermaid-source.ts'
-import type { AsciiConfig, AsciiTheme, ColorMode, CharRole, Canvas, RoleCanvas } from './types.ts'
-import { colorizeText } from './ansi.ts'
-import { getSeriesColor, CHART_ACCENT_FALLBACK, isValidHex } from '../xychart/colors.ts'
-
-// ============================================================================
-// Constants
-// ============================================================================
-
-const PLOT_WIDTH = 60
-const PLOT_HEIGHT = 20
-
-// Unicode box-drawing characters
-const UNI = {
-  hLine: '─',
-  vLine: '│',
-  origin: '┼',
-  yTick: '┤',
-  xTick: '┬',
-  bar: '█',
-  grid: '·',
-  cornerTL: '╭',  // top-left: down+right
-  cornerTR: '╮',  // top-right: down+left
-  cornerBL: '╰',  // bottom-left: up+right
-  cornerBR: '╯',  // bottom-right: up+left
-} as const
-
-// ASCII fallback characters
-const ASC = {
-  hLine: '-',
-  vLine: '|',
-  origin: '+',
-  yTick: '+',
-  xTick: '+',
-  bar: '#',
-  grid: '.',
-  cornerTL: '+',
-  cornerTR: '+',
-  cornerBL: '+',
-  cornerBR: '+',
-} as const
-
-// ============================================================================
-// Multi-series color support
-// ============================================================================
-
-/** Per-cell hex color override canvas. Parallel to RoleCanvas. */
-type HexCanvas = (string | null)[][]
-
-/** Generate an array of hex colors, one per series. */
-function getSeriesColors(total: number, theme: AsciiTheme, palette?: string[]): string[] {
-  if (palette && palette.length > 0) {
-    const usable = palette.filter(isValidHex)
-    if (usable.length > 0) {
-      return Array.from({ length: total }, (_, i) => usable[i % usable.length]!)
-    }
-  }
-  const accent = theme.accent ?? CHART_ACCENT_FALLBACK
-  if (total <= 1) return [accent]
-  return Array.from({ length: total }, (_, i) => getSeriesColor(i, accent, theme.bg))
-}
-
-/** Map a CharRole to its hex color from the theme (for canvasToString fallback). */
-function roleToHex(role: CharRole, theme: AsciiTheme): string {
-  switch (role) {
-    case 'text': return theme.fg
-    case 'border': return theme.border
-    case 'line': return theme.line
-    case 'arrow': return theme.arrow
-    case 'corner': return theme.corner ?? theme.line
-    case 'junction': return theme.junction ?? theme.border
-    default: return theme.fg
-  }
-}
-
-// ============================================================================
-// Public API
-// ============================================================================
-
-export function renderXYChartAscii(
-  text: string,
-  config: AsciiConfig,
-  colorMode: ColorMode,
-  theme: AsciiTheme,
-  frontmatter: MermaidFrontmatterMap = {},
-): string {
-  const lines = text.split('\n').map(l => l.trim()).filter(l => l.length > 0 && !l.startsWith('%%'))
-  const chart = applyXYChartFrontmatterConfig(parseXYChart(lines), frontmatter)
-  const ch = config.useAscii ? ASC : UNI
-
-  if (chart.horizontal) {
-    return renderHorizontal(chart, ch, colorMode, theme)
-  }
-  return renderVertical(chart, ch, colorMode, theme)
-}
-
-// ============================================================================
-// Vertical chart layout + rendering
-// ============================================================================
-
-function renderVertical(
-  chart: XYChart,
-  ch: typeof UNI | typeof ASC,
-  colorMode: ColorMode,
-  theme: AsciiTheme,
-): string {
-  const dataCount = getDataCount(chart)
-  if (dataCount === 0) return ''
-
-  const yRange = chart.yAxis.range!
-  const yTicks = niceTickValues(yRange.min, yRange.max)
-  const yLabels = yTicks.map(v => formatTickValue(v))
-  const showYLabels = chart.config.yAxis?.showLabel !== false
-  const showXLabels = chart.config.xAxis?.showLabel !== false
-  const yGutter = showYLabels ? Math.max(...yLabels.map(l => l.length)) + 1 : 0
-
-  const plotW = Math.max(PLOT_WIDTH, dataCount * 6)
-  const plotH = PLOT_HEIGHT
-  const bandW = Math.floor(plotW / dataCount)
-  const catLabels = getCategoryLabels(chart, dataCount)
-
-  // Canvas dimensions
-  const hasTitle = !!chart.title && chart.config.showTitle !== false
-  const hasXTitle = !!chart.xAxis.title && chart.config.xAxis?.showTitle !== false
-  const hasLegend = chart.series.length > 1
-  const titleRow = hasTitle ? 0 : -1
-  const plotTop = (hasTitle ? 2 : 0) + (hasLegend ? 1 : 0)
-  const plotLeft = yGutter + 1 // +1 for axis character
-  const totalW = plotLeft + bandW * dataCount + 2
-  const xAxisRow = plotTop + plotH
-  const xLabelRow = showXLabels ? xAxisRow + 1 : -1
-  const xTitleRow = hasXTitle ? xAxisRow + (showXLabels ? 2 : 1) : -1
-  const totalH = xAxisRow + 1 + (showXLabels ? 1 : 0) + (hasXTitle ? 1 : 0)
-
-  // Create canvas
-  const canvas = createCanvas(totalW, totalH)
-  const roles = createRoleCanvas(totalW, totalH)
-  const hexColors = createHexCanvas(totalW, totalH)
-
-  // Series colors
-  const seriesColors = getSeriesColors(chart.series.length, theme, chart.theme.plotColorPalette)
-
-  // Scales
-  const valueToRow = (v: number): number => {
-    const t = (v - yRange.min) / (yRange.max - yRange.min || 1)
-    return Math.round(t * (plotH - 1))
-  }
-  const bandCenter = (i: number): number => plotLeft + Math.floor(bandW * (i + 0.5))
-
-  // 1. Title
-  if (hasTitle && titleRow >= 0) {
-    writeText(canvas, roles, titleRow, Math.floor(totalW / 2 - chart.title!.length / 2), chart.title!, 'text')
-  }
-
-  // 2. Legend
-  if (hasLegend) {
-    const legendRow = hasTitle ? 1 : 0
-    drawLegend(canvas, roles, hexColors, chart, legendRow, totalW, ch, seriesColors)
-  }
-
-  // 3. Y-axis line + ticks + labels
-  for (let row = 0; row < plotH; row++) {
-    const displayRow = plotTop + (plotH - 1 - row)
-    set(canvas, roles, displayRow, plotLeft - 1, ch.vLine, 'border')
-  }
-  // Origin
-  set(canvas, roles, xAxisRow, plotLeft - 1, ch.origin, 'border')
-
-  for (const tick of yTicks) {
-    const row = valueToRow(tick)
-    if (row < 0 || row >= plotH) continue
-    const displayRow = plotTop + (plotH - 1 - row)
-    const label = formatTickValue(tick)
-    // Tick mark on axis
-    set(canvas, roles, displayRow, plotLeft - 1, row === 0 ? ch.origin : ch.yTick, 'border')
-    // Label
-    if (showYLabels) {
-      const labelStart = yGutter - label.length
-      writeText(canvas, roles, displayRow, Math.max(0, labelStart), label, 'text')
-    }
-  }
-
-  // 4. X-axis line + ticks + labels
-  for (let c = plotLeft; c < plotLeft + bandW * dataCount; c++) {
-    set(canvas, roles, xAxisRow, c, ch.hLine, 'border')
-  }
-  for (let i = 0; i < dataCount; i++) {
-    const cx = bandCenter(i)
-    set(canvas, roles, xAxisRow, cx, ch.xTick, 'border')
-    if (showXLabels && xLabelRow >= 0) {
-      const label = catLabels[i]!
-      const labelStart = cx - Math.floor(label.length / 2)
-      writeText(canvas, roles, xLabelRow, Math.max(0, labelStart), label, 'text')
-    }
-  }
-
-  // 5. X-axis title
-  if (hasXTitle && xTitleRow >= 0) {
-    const title = chart.xAxis.title!
-    writeText(canvas, roles, xTitleRow, Math.floor(totalW / 2 - title.length / 2), title, 'text')
-  }
-
-  // 6. Grid lines (subtle horizontal dots at y-tick positions)
-  for (const tick of yTicks) {
-    const row = valueToRow(tick)
-    if (row < 0 || row >= plotH) continue
-    const displayRow = plotTop + (plotH - 1 - row)
-    for (let c = plotLeft; c < plotLeft + bandW * dataCount; c++) {
-      if (get(canvas, displayRow, c) === ' ') {
-        set(canvas, roles, displayRow, c, ch.grid, 'line')
-      }
-    }
-  }
-
-  // 7. Bars — track global series index for per-series colors
-  const barEntries: { data: number[]; globalIdx: number }[] = []
-  for (let si = 0; si < chart.series.length; si++) {
-    if (chart.series[si]!.type === 'bar') barEntries.push({ data: chart.series[si]!.data, globalIdx: si })
-  }
-
-  if (barEntries.length > 0) {
-    const barCount = barEntries.length
-    const usable = Math.max(1, bandW - 2)
-    const singleBarW = Math.max(1, Math.min(Math.floor(usable / barCount), 8))
-    const groupW = singleBarW * barCount + (barCount - 1)
-    const baseRow = valueToRow(Math.max(0, yRange.min))
-
-    for (let bIdx = 0; bIdx < barEntries.length; bIdx++) {
-      const entry = barEntries[bIdx]!
-      const hexColor = seriesColors[entry.globalIdx]!
-      for (let i = 0; i < entry.data.length; i++) {
-        const cx = bandCenter(i)
-        const groupLeft = cx - Math.floor(groupW / 2)
-        const bx = groupLeft + bIdx * (singleBarW + 1)
-        const valRow = valueToRow(entry.data[i]!)
-        const fromRow = Math.min(baseRow, valRow)
-        const toRow = Math.max(baseRow, valRow)
-
-        for (let row = fromRow; row <= toRow; row++) {
-          const displayRow = plotTop + (plotH - 1 - row)
-          for (let c = bx; c < bx + singleBarW; c++) {
-            set(canvas, roles, displayRow, c, ch.bar, 'arrow', hexColors, hexColor)
-          }
-        }
-
-        if (chart.config.showDataLabel) {
-          const label = formatTickValue(entry.data[i]!)
-          const topDisplayRow = plotTop + (plotH - 1 - toRow)
-          const bottomDisplayRow = plotTop + (plotH - 1 - fromRow)
-          const labelRow = entry.data[i]! >= 0
-            ? Math.max(plotTop, topDisplayRow - 1)
-            : Math.min(xAxisRow - 1, bottomDisplayRow + 1)
-          const labelCol = Math.max(plotLeft, cx - Math.floor(label.length / 2))
-          writeColoredText(canvas, roles, hexColors, labelRow, labelCol, label, 'text', hexColor)
-        }
-      }
-    }
-  }
-
-  // 8. Lines (staircase routing with rounded corners)
-  const lineEntries: { data: number[]; globalIdx: number }[] = []
-  for (let si = 0; si < chart.series.length; si++) {
-    if (chart.series[si]!.type === 'line') lineEntries.push({ data: chart.series[si]!.data, globalIdx: si })
-  }
-
-  for (let lineIdx = 0; lineIdx < lineEntries.length; lineIdx++) {
-    const entry = lineEntries[lineIdx]!
-    if (entry.data.length === 0) continue
-    const hexColor = seriesColors[entry.globalIdx]!
-    drawStaircaseLine(canvas, roles, entry.data, bandCenter, valueToRow, plotTop, plotH, plotLeft, bandW * dataCount, ch, hexColors, hexColor)
-  }
-
-  return canvasToString(canvas, roles, hexColors, colorMode, theme)
-}
-
-// ============================================================================
-// Horizontal chart layout + rendering
-// ============================================================================
-
-function renderHorizontal(
-  chart: XYChart,
-  ch: typeof UNI | typeof ASC,
-  colorMode: ColorMode,
-  theme: AsciiTheme,
-): string {
-  const dataCount = getDataCount(chart)
-  if (dataCount === 0) return ''
-
-  const yRange = chart.yAxis.range!
-  const valueTicks = niceTickValues(yRange.min, yRange.max)
-  const catLabels = getCategoryLabels(chart, dataCount)
-  const showCategoryLabels = chart.config.xAxis?.showLabel !== false
-  const showValueLabels = chart.config.yAxis?.showLabel !== false
-  const catGutter = showCategoryLabels ? Math.max(...catLabels.map(l => l.length)) + 1 : 0
-
-  const plotW = Math.max(PLOT_WIDTH, 40)
-  const bandH = Math.max(2, Math.floor(PLOT_HEIGHT / dataCount))
-  const plotH = bandH * dataCount
-
-  const hasTitle = !!chart.title && chart.config.showTitle !== false
-  const hasYTitle = !!chart.yAxis.title && chart.config.yAxis?.showTitle !== false
-  const hasLegend = chart.series.length > 1
-  const plotTop = (hasTitle ? 2 : 0) + (hasLegend ? 1 : 0)
-  const plotLeft = catGutter + 1
-  const dataLabelPad = chart.config.showDataLabel ? 12 : 2
-  const totalW = plotLeft + plotW + dataLabelPad
-  const totalH = plotTop + plotH + 1 + (showValueLabels ? 1 : 0) + (hasYTitle ? 1 : 0)
-  const xAxisRow = plotTop + plotH
-
-  const canvas = createCanvas(totalW, totalH)
-  const roles = createRoleCanvas(totalW, totalH)
-  const hexColors = createHexCanvas(totalW, totalH)
-
-  // Series colors
-  const seriesColors = getSeriesColors(chart.series.length, theme, chart.theme.plotColorPalette)
-
-  // Value scale (horizontal)
-  const valueToCol = (v: number): number => {
-    const t = (v - yRange.min) / (yRange.max - yRange.min || 1)
-    return plotLeft + Math.round(t * (plotW - 1))
-  }
-  const bandMid = (i: number): number => plotTop + Math.floor(bandH * (i + 0.5))
-
-  // Title
-  if (hasTitle) {
-    writeText(canvas, roles, 0, Math.floor(totalW / 2 - chart.title!.length / 2), chart.title!, 'text')
-  }
-
-  // Legend
-  if (hasLegend) {
-    const legendRow = hasTitle ? 1 : 0
-    drawLegend(canvas, roles, hexColors, chart, legendRow, totalW, ch, seriesColors)
-  }
-
-  // Y-axis (category axis on left)
-  for (let r = plotTop; r < plotTop + plotH; r++) {
-    set(canvas, roles, r, plotLeft - 1, ch.vLine, 'border')
-  }
-  set(canvas, roles, xAxisRow, plotLeft - 1, ch.origin, 'border')
-
-  for (let i = 0; i < dataCount; i++) {
-    const my = bandMid(i)
-    const label = catLabels[i]!
-    if (showCategoryLabels) {
-      const labelStart = catGutter - label.length
-      writeText(canvas, roles, my, Math.max(0, labelStart), label, 'text')
-    }
-  }
-
-  // X-axis (value axis on bottom)
-  for (let c = plotLeft; c < plotLeft + plotW; c++) {
-    set(canvas, roles, xAxisRow, c, ch.hLine, 'border')
-  }
-  for (const tick of valueTicks) {
-    const cx = valueToCol(tick)
-    if (cx < plotLeft || cx >= plotLeft + plotW) continue
-    set(canvas, roles, xAxisRow, cx, ch.xTick, 'border')
-    if (showValueLabels) {
-      const label = formatTickValue(tick)
-      writeText(canvas, roles, xAxisRow + 1, cx - Math.floor(label.length / 2), label, 'text')
-    }
-  }
-
-  // Y-axis title
-  if (hasYTitle) {
-    const title = chart.yAxis.title!
-    writeText(canvas, roles, totalH - 1, Math.floor(totalW / 2 - title.length / 2), title, 'text')
-  }
-
-  // Grid lines (vertical at value tick positions)
-  for (const tick of valueTicks) {
-    const cx = valueToCol(tick)
-    if (cx < plotLeft || cx >= plotLeft + plotW) continue
-    for (let r = plotTop; r < plotTop + plotH; r++) {
-      if (get(canvas, r, cx) === ' ') {
-        set(canvas, roles, r, cx, ch.grid, 'line')
-      }
-    }
-  }
-
-  // Bars (horizontal) — with per-series colors
-  const barEntries: { data: number[]; globalIdx: number }[] = []
-  for (let si = 0; si < chart.series.length; si++) {
-    if (chart.series[si]!.type === 'bar') barEntries.push({ data: chart.series[si]!.data, globalIdx: si })
-  }
-
-  if (barEntries.length > 0) {
-    const barCount = barEntries.length
-    const singleBarH = 1
-    const groupH = singleBarH * barCount + (barCount - 1)
-    const baseCol = valueToCol(Math.max(0, yRange.min))
-
-    for (let bIdx = 0; bIdx < barEntries.length; bIdx++) {
-      const entry = barEntries[bIdx]!
-      const hexColor = seriesColors[entry.globalIdx]!
-      for (let i = 0; i < entry.data.length; i++) {
-        const my = bandMid(i)
-        const groupTop = my - Math.floor(groupH / 2)
-        const by = groupTop + bIdx * (singleBarH + 1)
-        const valCol = valueToCol(entry.data[i]!)
-        const fromCol = Math.min(baseCol, valCol)
-        const toCol = Math.max(baseCol, valCol)
-
-        for (let r = by; r < by + singleBarH; r++) {
-          for (let c = fromCol; c <= toCol; c++) {
-            set(canvas, roles, r, c, ch.bar, 'arrow', hexColors, hexColor)
-          }
-        }
-
-        if (chart.config.showDataLabel) {
-          const label = formatTickValue(entry.data[i]!)
-          const labelCol = entry.data[i]! >= 0
-            ? Math.min(totalW - label.length, toCol + 2)
-            : Math.max(plotLeft, fromCol - label.length - 1)
-          writeColoredText(canvas, roles, hexColors, by, labelCol, label, 'text', hexColor)
-        }
-      }
-    }
-  }
-
-  // Lines (horizontal staircase: value on x, category on y) — with per-series colors
-  const lineEntries: { data: number[]; globalIdx: number }[] = []
-  for (let si = 0; si < chart.series.length; si++) {
-    if (chart.series[si]!.type === 'line') lineEntries.push({ data: chart.series[si]!.data, globalIdx: si })
-  }
-
-  for (let lineIdx = 0; lineIdx < lineEntries.length; lineIdx++) {
-    const entry = lineEntries[lineIdx]!
-    if (entry.data.length === 0) continue
-    const hexColor = seriesColors[entry.globalIdx]!
-    drawHorizontalStaircaseLine(canvas, roles, entry.data, bandMid, valueToCol, plotTop, plotH, plotLeft, plotW, ch, hexColors, hexColor)
-  }
-
-  return canvasToString(canvas, roles, hexColors, colorMode, theme)
-}
-
-// ============================================================================
-// Staircase line drawing — vertical charts
-//
-// Connects data points with flat segments (─) at each value's row,
-// vertical segments (│) between rows, and rounded corners (╭╮╰╯)
-// at transitions. The vertical step happens at the midpoint column
-// between adjacent data points.
-// ============================================================================
-
-function drawStaircaseLine(
-  canvas: Canvas,
-  roles: RoleCanvas,
-  data: number[],
-  bandCenter: (i: number) => number,
-  valueToRow: (v: number) => number,
-  plotTop: number,
-  plotH: number,
-  plotLeft: number,
-  plotTotalW: number,
-  ch: typeof UNI | typeof ASC,
-  hexCanvas?: HexCanvas,
-  hexColor?: string | null,
-): void {
-  if (data.length === 0) return
-
-  const points = data.map((v, i) => ({
-    col: bandCenter(i),
-    row: valueToRow(v),
-  }))
-
-  // Helper to draw on the canvas (row 0 = bottom, displayed inverted)
-  const drawAt = (col: number, row: number, char: string) => {
-    const displayRow = plotTop + (plotH - 1 - row)
-    if (displayRow >= 0 && col >= plotLeft && col < plotLeft + plotTotalW) {
-      set(canvas, roles, displayRow, col, char, 'arrow', hexCanvas, hexColor)
-    }
-  }
-
-  // Single point: just draw a flat segment
-  if (points.length === 1) {
-    drawAt(points[0]!.col, points[0]!.row, ch.hLine)
-    return
-  }
-
-  for (let i = 0; i < points.length - 1; i++) {
-    const p1 = points[i]!
-    const p2 = points[i + 1]!
-
-    if (p1.row === p2.row) {
-      // Flat: draw ─ across
-      for (let c = p1.col; c <= p2.col; c++) {
-        drawAt(c, p1.row, ch.hLine)
-      }
-      continue
-    }
-
-    const midCol = Math.round((p1.col + p2.col) / 2)
-    const goingUp = p2.row > p1.row
-
-    // 1. Flat at p1's row from p1.col to midCol-1
-    for (let c = p1.col; c < midCol; c++) {
-      drawAt(c, p1.row, ch.hLine)
-    }
-
-    // 2. Corner at (midCol, p1.row)
-    //    goingUp:   ─ from LEFT, │ going UP   → LEFT+TOP  = ╯ (cornerBR)
-    //    goingDown: ─ from LEFT, │ going DOWN  → LEFT+BOT  = ╮ (cornerTR)
-    if (goingUp) {
-      drawAt(midCol, p1.row, ch.cornerBR) // ╯
-    } else {
-      drawAt(midCol, p1.row, ch.cornerTR) // ╮
-    }
-
-    // 3. Vertical from p1.row to p2.row (exclusive of endpoints)
-    const minRow = Math.min(p1.row, p2.row)
-    const maxRow = Math.max(p1.row, p2.row)
-    for (let row = minRow + 1; row < maxRow; row++) {
-      drawAt(midCol, row, ch.vLine)
-    }
-
-    // 4. Corner at (midCol, p2.row)
-    //    goingUp:   │ from BOTTOM, ─ going RIGHT → BOT+RIGHT = ╭ (cornerTL)
-    //    goingDown: │ from TOP, ─ going RIGHT     → TOP+RIGHT = ╰ (cornerBL)
-    if (goingUp) {
-      drawAt(midCol, p2.row, ch.cornerTL) // ╭
-    } else {
-      drawAt(midCol, p2.row, ch.cornerBL) // ╰
-    }
-
-    // 5. Flat at p2's row from midCol+1 to p2.col
-    for (let c = midCol + 1; c <= p2.col; c++) {
-      drawAt(c, p2.row, ch.hLine)
-    }
-
-    // Leading flat for first segment (before p1.col)
-    if (i === 0) {
-      const leadStart = Math.max(plotLeft, p1.col - Math.floor((p2.col - p1.col) / 4))
-      for (let c = leadStart; c < p1.col; c++) {
-        drawAt(c, p1.row, ch.hLine)
-      }
-    }
-
-    // Trailing flat for last segment (after p2.col)
-    if (i === points.length - 2) {
-      const trailEnd = Math.min(plotLeft + plotTotalW - 1, p2.col + Math.floor((p2.col - p1.col) / 4))
-      for (let c = p2.col + 1; c <= trailEnd; c++) {
-        drawAt(c, p2.row, ch.hLine)
-      }
-    }
-  }
-}
-
-// ============================================================================
-// Staircase line drawing — horizontal charts
-//
-// Same staircase approach but with axes swapped:
-// data values map to columns (horizontal position) and categories map to
-// rows (vertical position). Flat segments are vertical (│), transitions
-// are horizontal (─), with the same rounded corners.
-// ============================================================================
-
-function drawHorizontalStaircaseLine(
-  canvas: Canvas,
-  roles: RoleCanvas,
-  data: number[],
-  bandMid: (i: number) => number,
-  valueToCol: (v: number) => number,
-  plotTop: number,
-  plotH: number,
-  plotLeft: number,
-  plotW: number,
-  ch: typeof UNI | typeof ASC,
-  hexCanvas?: HexCanvas,
-  hexColor?: string | null,
-): void {
-  if (data.length === 0) return
-
-  const points = data.map((v, i) => ({
-    row: bandMid(i),
-    col: valueToCol(v),
-  }))
-
-  const drawAt = (row: number, col: number, char: string) => {
-    if (row >= plotTop && row < plotTop + plotH && col >= plotLeft && col < plotLeft + plotW) {
-      set(canvas, roles, row, col, char, 'arrow', hexCanvas, hexColor)
-    }
-  }
-
-  if (points.length === 1) {
-    drawAt(points[0]!.row, points[0]!.col, ch.vLine)
-    return
-  }
-
-  for (let i = 0; i < points.length - 1; i++) {
-    const p1 = points[i]!
-    const p2 = points[i + 1]!
-
-    if (p1.col === p2.col) {
-      // Same value: draw │ down
-      for (let r = p1.row; r <= p2.row; r++) {
-        drawAt(r, p1.col, ch.vLine)
-      }
-      continue
-    }
-
-    const midRow = Math.round((p1.row + p2.row) / 2)
-    const goingRight = p2.col > p1.col
-
-    // 1. Vertical at p1's col from p1.row to midRow-1
-    for (let r = p1.row; r < midRow; r++) {
-      drawAt(r, p1.col, ch.vLine)
-    }
-
-    // 2. Corner at (midRow, p1.col)
-    //    goingRight: │ from TOP, ─ going RIGHT → TOP+RIGHT = ╰ (cornerBL)
-    //    goingLeft:  │ from TOP, ─ going LEFT  → TOP+LEFT  = ╯ (cornerBR)
-    if (goingRight) {
-      drawAt(midRow, p1.col, ch.cornerBL) // ╰
-    } else {
-      drawAt(midRow, p1.col, ch.cornerBR) // ╯
-    }
-
-    // 3. Horizontal from p1.col to p2.col (exclusive)
-    const minCol = Math.min(p1.col, p2.col)
-    const maxCol = Math.max(p1.col, p2.col)
-    for (let c = minCol + 1; c < maxCol; c++) {
-      drawAt(midRow, c, ch.hLine)
-    }
-
-    // 4. Corner at (midRow, p2.col)
-    //    goingRight: ─ from LEFT, │ going DOWN  → LEFT+BOT  = ╮ (cornerTR)
-    //    goingLeft:  ─ from RIGHT, │ going DOWN → RIGHT+BOT = ╭ (cornerTL)
-    if (goingRight) {
-      drawAt(midRow, p2.col, ch.cornerTR) // ╮
-    } else {
-      drawAt(midRow, p2.col, ch.cornerTL) // ╭
-    }
-
-    // 5. Vertical at p2's col from midRow+1 to p2.row
-    for (let r = midRow + 1; r <= p2.row; r++) {
-      drawAt(r, p2.col, ch.vLine)
-    }
-  }
-}
-
-// ============================================================================
-// Legend — shows series symbols with per-series colors
-// ============================================================================
-
-function drawLegend(
-  canvas: Canvas,
-  roles: RoleCanvas,
-  hexCanvas: HexCanvas,
-  chart: XYChart,
-  row: number,
-  totalW: number,
-  ch: typeof UNI | typeof ASC,
-  seriesColors: string[],
-): void {
-  // Build legend items with global series indices
-  type LegendItem = { symbol: string; label: string; globalIdx: number }
-  const items: LegendItem[] = []
-  let barIdx = 0, lineIdx = 0
-  for (let si = 0; si < chart.series.length; si++) {
-    const s = chart.series[si]!
-    if (s.type === 'bar') {
-      items.push({ symbol: ch.bar, label: `Bar ${barIdx + 1}`, globalIdx: si })
-      barIdx++
-    } else {
-      items.push({ symbol: ch.hLine, label: `Line ${lineIdx + 1}`, globalIdx: si })
-      lineIdx++
-    }
-  }
-
-  // Calculate total legend width: "symbol space label  symbol space label ..."
-  let totalLen = 0
-  for (let i = 0; i < items.length; i++) {
-    if (i > 0) totalLen += 2 // gap between items
-    totalLen += 1 + 1 + items[i]!.label.length // symbol + space + label
-  }
-
-  const startCol = Math.max(0, Math.floor(totalW / 2 - totalLen / 2))
-  let col = startCol
-
-  for (let i = 0; i < items.length; i++) {
-    if (i > 0) col += 2 // gap
-    const item = items[i]!
-    // Symbol with series-specific color
-    set(canvas, roles, row, col, item.symbol, 'arrow', hexCanvas, seriesColors[item.globalIdx])
-    col += 1
-    // Space (already ' ' from canvas init)
-    col += 1
-    // Label text
-    writeText(canvas, roles, row, col, item.label, 'text')
-    col += item.label.length
-  }
-}
-
-// ============================================================================
-// Canvas utilities
-// ============================================================================
-
-function createCanvas(width: number, height: number): Canvas {
-  return Array.from({ length: width }, () => Array.from({ length: height }, () => ' '))
-}
-
-function createRoleCanvas(width: number, height: number): RoleCanvas {
-  return Array.from({ length: width }, () => Array.from<CharRole | null>({ length: height }).fill(null))
-}
-
-function createHexCanvas(width: number, height: number): HexCanvas {
-  return Array.from({ length: width }, () => Array.from<string | null>({ length: height }).fill(null))
-}
-
-function set(
-  canvas: Canvas, roles: RoleCanvas, row: number, col: number,
-  char: string, role: CharRole,
-  hexCanvas?: HexCanvas, hex?: string | null,
-): void {
-  if (col >= 0 && col < canvas.length && row >= 0 && row < canvas[0]!.length) {
-    canvas[col]![row] = char
-    roles[col]![row] = role
-    if (hexCanvas && hex) hexCanvas[col]![row] = hex
-  }
-}
-
-function get(canvas: Canvas, row: number, col: number): string {
-  if (col >= 0 && col < canvas.length && row >= 0 && row < canvas[0]!.length) {
-    return canvas[col]![row]!
-  }
-  return ' '
-}
-
-function writeText(canvas: Canvas, roles: RoleCanvas, row: number, startCol: number, text: string, role: CharRole): void {
-  for (let i = 0; i < text.length; i++) {
-    set(canvas, roles, row, startCol + i, text[i]!, role)
-  }
-}
-
-function writeColoredText(
-  canvas: Canvas,
-  roles: RoleCanvas,
-  hexCanvas: HexCanvas,
-  row: number,
-  startCol: number,
-  text: string,
-  role: CharRole,
-  hex: string,
-): void {
-  for (let i = 0; i < text.length; i++) {
-    set(canvas, roles, row, startCol + i, text[i]!, role, hexCanvas, hex)
-  }
-}
-
-// ============================================================================
-// Canvas → string (with per-cell hex color support)
-// ============================================================================
-
-function canvasToString(
-  canvas: Canvas,
-  roles: RoleCanvas,
-  hexCanvas: HexCanvas,
-  colorMode: ColorMode,
-  theme: AsciiTheme,
-): string {
-  if (canvas.length === 0) return ''
-  const height = canvas[0]!.length
-  const width = canvas.length
-  const lines: string[] = []
-
-  for (let row = 0; row < height; row++) {
-    const chars: string[] = []
-    const rowRoles: (CharRole | null)[] = []
-    const rowHex: (string | null)[] = []
-    for (let col = 0; col < width; col++) {
-      chars.push(canvas[col]![row]!)
-      rowRoles.push(roles[col]![row]!)
-      rowHex.push(hexCanvas[col]![row]!)
-    }
-    // Trim trailing spaces
-    let end = chars.length - 1
-    while (end >= 0 && chars[end] === ' ') end--
-    if (end < 0) {
-      lines.push('')
-    } else {
-      lines.push(colorizeRow(
-        chars.slice(0, end + 1),
-        rowRoles.slice(0, end + 1),
-        rowHex.slice(0, end + 1),
-        theme,
-        colorMode,
-      ))
-    }
-  }
-
-  // Trim trailing empty lines
-  while (lines.length > 0 && lines[lines.length - 1] === '') {
-    lines.pop()
-  }
-
-  return lines.join('\n')
-}
-
-/**
- * Colorize a row of characters, using hex color overrides where available
- * and falling back to role-based theme colors otherwise.
- * Groups consecutive same-color characters for efficient escape sequences.
- */
-function colorizeRow(
-  chars: string[],
-  roles: (CharRole | null)[],
-  hexOverrides: (string | null)[],
-  theme: AsciiTheme,
-  mode: ColorMode,
-): string {
-  if (mode === 'none') return chars.join('')
-
-  let result = ''
-  let currentColor: string | null = null
-  let buffer = ''
-
-  for (let i = 0; i < chars.length; i++) {
-    const char = chars[i]!
-
-    if (char === ' ') {
-      // Flush buffer before whitespace
-      if (buffer.length > 0) {
-        result += currentColor ? colorizeText(buffer, currentColor, mode) : buffer
-        buffer = ''
-        currentColor = null
-      }
-      result += ' '
-      continue
-    }
-
-    // Effective color: hex override > role-based > null
-    const hexOvr = hexOverrides[i] ?? null
-    const roleVal = roles[i] ?? null
-    const color = hexOvr ?? (roleVal ? roleToHex(roleVal, theme) : null)
-
-    if (color === currentColor) {
-      buffer += char
-    } else {
-      // Flush previous group
-      if (buffer.length > 0) {
-        result += currentColor ? colorizeText(buffer, currentColor, mode) : buffer
-      }
-      buffer = char
-      currentColor = color
-    }
-  }
-
-  // Flush remaining
-  if (buffer.length > 0) {
-    result += currentColor ? colorizeText(buffer, currentColor, mode) : buffer
-  }
-
-  return result
-}
-
-// ============================================================================
-// Helpers (chart-level)
-// ============================================================================
-
-function getDataCount(chart: XYChart): number {
-  if (chart.xAxis.categories) return chart.xAxis.categories.length
-  for (const s of chart.series) {
-    if (s.data.length > 0) return s.data.length
-  }
-  return 0
-}
-
-function getCategoryLabels(chart: XYChart, count: number): string[] {
-  if (chart.xAxis.categories) return chart.xAxis.categories
-  if (chart.xAxis.range) {
-    const { min, max } = chart.xAxis.range
-    const step = count > 1 ? (max - min) / (count - 1) : 0
-    return Array.from({ length: count }, (_, i) => formatTickValue(min + step * i))
-  }
-  return Array.from({ length: count }, (_, i) => String(i + 1))
-}
-
-/** Generate nice tick values for a numeric range. */
-function niceTickValues(min: number, max: number): number[] {
-  const range = max - min
-  if (range <= 0) return [min]
-
-  const rawInterval = range / 6
-  const magnitude = Math.pow(10, Math.floor(Math.log10(rawInterval)))
-  const residual = rawInterval / magnitude
-  let niceInterval: number
-  if (residual <= 1.5) niceInterval = magnitude
-  else if (residual <= 3) niceInterval = 2 * magnitude
-  else if (residual <= 7) niceInterval = 5 * magnitude
-  else niceInterval = 10 * magnitude
-
-  const start = Math.ceil(min / niceInterval) * niceInterval
-  const ticks: number[] = []
-  for (let v = start; v <= max + niceInterval * 0.001; v += niceInterval) {
-    ticks.push(Math.round(v * 1e10) / 1e10)
-  }
-  return ticks
-}
-
-function formatTickValue(v: number): string {
-  if (Number.isInteger(v)) return String(v)
-  return v.toFixed(Math.abs(v) < 10 ? 1 : 0)
-}