basalt-ui 1.26.0 → 1.28.0

package/src/charts/kinds/ZonedLine.test.tsx

@@ -1,147 +0,0 @@
-/**
- * `ZonedLine` — the `strokeOpacity` wiring: `primary.strokeOpacity ?? 1`. SSR harness (no hover
- * needed), same pattern as `CartesianChart.test.tsx`'s `nice` assertions.
- */
-import { fireEvent, render, screen } from '@testing-library/react'
-import { describe, expect, test } from 'bun:test'
-import { renderToStaticMarkup } from 'react-dom/server'
-import { ChartCursorScope } from '../cursor/scope'
-import { CartesianChart } from '../primitives/CartesianChart'
-import { ZonedLine } from './ZonedLine'
-import type { ChartSeries } from '../series'
-
-type Row = { date: string; v: number }
-
-const rows: Row[] = [
-  { date: '2026-08-01', v: 10 },
-  { date: '2026-08-02', v: 12 },
-]
-
-describe('ZonedLine — series.strokeOpacity dims the plotted stroke', () => {
-  test('the line path carries the configured stroke-opacity attribute', () => {
-    const series: ChartSeries<Row>[] = [
-      {
-        key: 'v',
-        label: 'V',
-        color: '#654321',
-        mark: 'line',
-        getValue: (d) => d.v,
-        strokeOpacity: 0.5,
-      },
-    ]
-
-    const html = renderToStaticMarkup(
-      <ZonedLine<Row> data={rows} chartId="zl-opacity" getX={(d) => d.date} series={series} />,
-    )
-
-    expect(html).toContain('stroke="#654321"')
-    expect(html).toContain('stroke-opacity="0.5"')
-  })
-})
-
-describe('ZonedLine — formatX', () => {
-  test('a custom formatX renders on the bottom axis instead of the default DD.MM', () => {
-    const series: ChartSeries<Row>[] = [
-      { key: 'v', label: 'V', color: '#111', mark: 'line', getValue: (d) => d.v },
-    ]
-    const html = renderToStaticMarkup(
-      <ZonedLine<Row>
-        data={rows}
-        chartId="zl-formatx"
-        getX={(d) => d.date}
-        series={series}
-        formatX={(key) => `X:${key}`}
-      />,
-    )
-    expect(html).toContain('X:2026-08-01')
-    expect(html).not.toContain('>01.08<')
-  })
-})
-
-describe('ZonedLine — tooltip.formatHeader', () => {
-  test('overrides the tooltip header date text', async () => {
-    const series: ChartSeries<Row>[] = [
-      { key: 'v', label: 'V', color: '#111', mark: 'line', getValue: (d) => d.v },
-    ]
-    render(
-      <ZonedLine<Row>
-        data={rows}
-        chartId="zl-formatheader"
-        getX={(d) => d.date}
-        series={series}
-        tooltip={{ formatHeader: (key) => `hdr:${key}` }}
-      />,
-    )
-
-    const slider = screen.getByRole('slider')
-    fireEvent.keyDown(slider, { key: 'ArrowRight' })
-
-    expect(await screen.findByText('hdr:2026-08-01')).toBeTruthy()
-  })
-})
-
-describe('ZonedLine — cursorResolution threads through to sibling resolution', () => {
-  // Daily calendar Aug 01–14 (a plain CartesianChart driver) alongside a ZonedLine sibling folded
-  // into 2 weekly buckets keyed by each week's leading day (Aug 01, Aug 08) — parity with
-  // `Bars.test.tsx`'s equivalent block. Proves the prop reaches THIS kind, not just
-  // `CartesianChart` (a kind dropping the forward would silently fall back to 'nearest').
-  const dailyRows: Row[] = Array.from({ length: 14 }, (_, i) => ({
-    date: `2026-08-${String(i + 1).padStart(2, '0')}`,
-    v: i,
-  }))
-  const foldedRows: Row[] = [
-    { date: '2026-08-01', v: 0 },
-    { date: '2026-08-08', v: 1 },
-  ]
-  const dailySeries: ChartSeries<Row>[] = [
-    { key: 'v', label: 'V', color: '#111', mark: 'line', getValue: (d) => d.v },
-  ]
-  const foldedSeries: ChartSeries<Row>[] = [
-    { key: 'v', label: 'V', color: '#111', mark: 'line', getValue: (d) => d.v },
-  ]
-
-  function renderPair(cursorResolution?: 'leading') {
-    render(
-      <ChartCursorScope>
-        <CartesianChart<Row>
-          data={dailyRows}
-          chartId="zl-daily"
-          getX={(d) => d.date}
-          series={dailySeries}
-          ariaLabel="Daily"
-        >
-          {() => null}
-        </CartesianChart>
-        <ZonedLine<Row>
-          data={foldedRows}
-          chartId="zl-folded"
-          getX={(d) => d.date}
-          series={foldedSeries}
-          ariaLabel="Folded"
-          {...(cursorResolution !== undefined && { cursorResolution })}
-        />
-      </ChartCursorScope>,
-    )
-  }
-
-  // Drives the daily chart to Aug 05 — the back half of the Aug 01–07 bucket (midpoint Aug 04) —
-  // via 5 keyboard ArrowRights from an unfocused slider (1st press lands on index 0).
-  function driveDailyToAug05() {
-    const dailySlider = screen.getByRole('slider', { name: 'Daily' })
-    for (let i = 0; i < 5; i++) fireEvent.keyDown(dailySlider, { key: 'ArrowRight' })
-  }
-
-  test("cursorResolution='leading' resolves the back-half day to the bucket it's INSIDE, not the following one", () => {
-    renderPair('leading')
-    driveDailyToAug05()
-    const foldedSlider = screen.getByRole('slider', { name: 'Folded' })
-    expect(foldedSlider.getAttribute('aria-valuetext')).toBe('01.08')
-  })
-
-  test("without the prop (default 'nearest'), the same daily hover lands on the FOLLOWING bucket instead", () => {
-    renderPair()
-    driveDailyToAug05()
-    const foldedSlider = screen.getByRole('slider', { name: 'Folded' })
-    expect(foldedSlider.getAttribute('aria-valuetext')).toBe('08.08')
-  })
-})

package/src/charts/layout/auto-margin.test.ts

@@ -1,42 +0,0 @@
-import { describe, expect, test } from 'bun:test'
-import { VX } from '../../tokens'
-import { autoMargin } from './auto-margin'
-
-describe('autoMargin', () => {
-  test('never goes below the VX.margin floor', () => {
-    const m = autoMargin()
-    expect(m.top).toBe(VX.margin.top)
-    expect(m.right).toBeGreaterThanOrEqual(VX.margin.right)
-    expect(m.bottom).toBeGreaterThanOrEqual(VX.margin.bottom)
-    expect(m.left).toBeGreaterThanOrEqual(VX.margin.left)
-  })
-
-  test('a wide left label widens the left gutter', () => {
-    const narrow = autoMargin({ left: ['0', '5'] })
-    const wide = autoMargin({ left: ['0', '1,250,000'] })
-    expect(wide.left).toBeGreaterThan(narrow.left)
-  })
-
-  test('right-axis labels widen the right gutter past the floor', () => {
-    const m = autoMargin({ right: ['$1,000.00'] })
-    expect(m.right).toBeGreaterThan(VX.margin.right)
-  })
-
-  test('without a right axis, the right gutter still reserves half the widest x label', () => {
-    // The last x tick is centred on the plot's right edge, so half its label hangs past it.
-    const m = autoMargin({ bottom: ['2026-08-18T12:00'] })
-    expect(m.right).toBeGreaterThan(VX.margin.right)
-  })
-
-  test('rotated x labels deepen the bottom gutter', () => {
-    const flat = autoMargin({ bottom: ['a long category label'] })
-    const rotated = autoMargin({ bottom: ['a long category label'], rotate: 45 })
-    expect(rotated.bottom).toBeGreaterThan(flat.bottom)
-  })
-
-  test('an explicit override wins over measurement', () => {
-    const m = autoMargin({ left: ['1,250,000'], override: { left: 4, top: 0 } })
-    expect(m.left).toBe(4)
-    expect(m.top).toBe(0)
-  })
-})