basalt-ui 1.26.0 → 1.28.0

package/src/theme-lab/derive-state.test.ts

@@ -1,71 +0,0 @@
-/**
- * `toDeriveOverride` — the store-to-override projection BOTH halves of the theme lab go through (the
- * `<style>` injection in `derive-controls.tsx` and the theme rebuild in `../provider/lab-theme.ts`).
- *
- * Worth its own file because `lab-theme.test.ts` builds a `DeriveOverride` by hand (its `at()`
- * helper) and never calls this function, so nothing there would catch either of its two jobs
- * regressing:
- *
- * 1. `applied: false` → `null`. This is the gate the whole "production path is untouched" claim rests
- *    on — every app that never mounts the panel reads `DEFAULT_STATE`, whose `applied` is false.
- * 2. The config carries EXACTLY the six color knobs. `resolveDeriveConfig` is a plain spread, so the
- *    obvious simplification — handing it the whole persisted state — would silently carry
- *    `applied`/`radius`/`density` into the config, and from there onto `theme.other.basaltDerive`
- *    (read by `BasaltBridge`) and into `buildPaletteData`'s memo key. It would not throw and nothing
- *    else in the suite would notice.
- *
- * The persisted-envelope validator is tested separately, in `derive-controls.test.ts`.
- */
-import { describe, expect, test } from 'bun:test'
-import { DEFAULT_STATE, toDeriveOverride } from './derive-state'
-import { DEFAULT_DERIVE_CONFIG } from '../tokens/derive'
-
-describe('the applied gate', () => {
-  test('DEFAULT_STATE (applied: false) yields no override — the production path', () => {
-    expect(toDeriveOverride(DEFAULT_STATE)).toBeNull()
-  })
-
-  test('a fully tuned state with applied: false still yields no override', () => {
-    const tuned = { ...DEFAULT_STATE, accent: '#ff0000', radius: -3, density: 2, applied: false }
-    expect(toDeriveOverride(tuned)).toBeNull()
-  })
-
-  test('applied: true yields an override carrying both levels verbatim', () => {
-    const override = toDeriveOverride({ ...DEFAULT_STATE, applied: true, radius: -2, density: 3 })
-    expect(override).not.toBeNull()
-    expect(override?.radiusLevel).toBe(-2)
-    expect(override?.densityLevel).toBe(3)
-  })
-})
-
-describe('the resolved config carries exactly the six derive knobs', () => {
-  const override = toDeriveOverride({
-    ...DEFAULT_STATE,
-    applied: true,
-    accent: '#ff0000',
-    neutral: 'stone',
-    radius: -2,
-    density: 1,
-  })
-
-  test('no state-only key leaks into the config', () => {
-    // Keyed off `DEFAULT_DERIVE_CONFIG` rather than an exported key list: adding a seventh knob to
-    // the config should extend this assertion automatically, not silently pass a stale list.
-    expect(Object.keys(override?.config ?? {}).sort()).toEqual(
-      Object.keys(DEFAULT_DERIVE_CONFIG).sort(),
-    )
-    expect(override?.config).not.toHaveProperty('applied')
-    expect(override?.config).not.toHaveProperty('radius')
-    expect(override?.config).not.toHaveProperty('density')
-  })
-
-  test('the tuned knobs are carried through', () => {
-    expect(override?.config.accent).toBe('#ff0000')
-    expect(override?.config.neutral).toBe('stone')
-  })
-
-  test('untouched knobs fall back to the shipped default per-knob', () => {
-    expect(override?.config.lightLevel).toBe(DEFAULT_DERIVE_CONFIG.lightLevel)
-    expect(override?.config.vibrancy).toBe(DEFAULT_DERIVE_CONFIG.vibrancy)
-  })
-})

package/src/theme-lab/theme-lab.test.ts

@@ -1,46 +0,0 @@
-/**
- * The theme-lab wiring gate.
- *
- * The lab is a list of `--vx-*` var names it writes onto `<html>`. Nothing structurally connects
- * that list to the vars the palette actually EMITS, or to the chrome that reads them — so it can
- * drift silently into tuning dead variables, or into tuning live ones that no component consumes.
- * Both failure modes look identical to the user: "the theme lab does nothing".
- *
- * `COLOR_GROUPS` is now a structural-token inspector ONLY (identity/color tuning moved to
- * `DeriveControls`) — this test ties the remaining vars to `buildPaletteCss`'s actual output, so a
- * var in `COLOR_GROUPS` that is secretly DERIVED (and would drift the moment the derive config
- * changes) never sneaks back in undetected.
- */
-import { describe, expect, test } from 'bun:test'
-import { buildPaletteCss } from '../tokens'
-import { AREA_BOTTOM_VAR, AREA_TOP_VAR, COLOR_GROUPS } from './index'
-
-const css = buildPaletteCss()
-const TUNABLES = COLOR_GROUPS.flatMap((g) => g.items.map((i) => i.var))
-
-describe('every tunable var is really emitted by the palette', () => {
-  // A var in COLOR_GROUPS that buildPaletteCss never declares is a dead knob: the ColorInput shows
-  // an empty swatch and writing it changes nothing.
-  for (const name of [...TUNABLES, AREA_TOP_VAR, AREA_BOTTOM_VAR]) {
-    test(name, () => {
-      expect(css).toContain(`${name}:`)
-    })
-  }
-})
-
-describe('tunables are OPAQUE — ColorInput (format="hex") has no alpha channel', () => {
-  // A translucent token (`--vx-divider`, `--vx-grid`, `--vx-good`: `color-mix(… , transparent)`)
-  // would be silently flattened to a solid color on first edit. Opaque `color-mix()`es are fine —
-  // `readVar` resolves them through a probe element, so they display and edit correctly.
-  for (const name of TUNABLES) {
-    test(name, () => {
-      const declaration = css.match(new RegExp(`${name}:\\s*([^;]+);`))?.[1]?.trim() ?? ''
-      expect(declaration).not.toContain('transparent')
-      expect(declaration).not.toMatch(/^rgba\(/)
-    })
-  }
-})
-
-test('no duplicate tunables across groups', () => {
-  expect(new Set(TUNABLES).size).toBe(TUNABLES.length)
-})

package/src/tokens/build-fonts-css.test.ts

@@ -1,52 +0,0 @@
-/**
- * `buildFontsCss` — the pure CSS-building half of the `{ fonts }` option (see
- * `../theme/fonts-option.test.ts` for the `theme.other.basaltFonts` round-trip this consumes).
- * `BasaltBridge` calls this directly to append `--basalt-font-*` declarations to the same injected
- * `<style>` as the palette CSS. A DOM harness now exists (`tests/setup/dom.ts`, preloaded via the
- * root `bunfig.toml`), but this pure function needs no render at all — it's the testable seam on
- * its own, so this suite calls it directly rather than mounting anything.
- */
-import { describe, expect, test } from 'bun:test'
-import { buildFontsCss } from './index'
-
-describe('buildFontsCss', () => {
-  test('returns empty string when fonts is undefined', () => {
-    expect(buildFontsCss(undefined)).toBe('')
-  })
-
-  test('returns empty string when fonts is an empty object', () => {
-    expect(buildFontsCss({})).toBe('')
-  })
-
-  test('emits a --basalt-font-sans declaration for a provided sans value', () => {
-    const css = buildFontsCss({ sans: 'Inter, sans-serif' })
-    expect(css).toContain('--basalt-font-sans: Inter, sans-serif;')
-  })
-
-  test('emits declarations only for the provided keys, omitting the rest', () => {
-    const css = buildFontsCss({ sans: 'Inter, sans-serif' })
-    expect(css).not.toContain('--basalt-font-head')
-    expect(css).not.toContain('--basalt-font-mono')
-  })
-
-  test('emits all three declarations under one :root block when all three are provided', () => {
-    const css = buildFontsCss({
-      sans: 'Inter, sans-serif',
-      head: 'Poppins, sans-serif',
-      mono: 'Fira Code, monospace',
-    })
-    expect(css).toContain(':root {')
-    expect(css).toContain('--basalt-font-sans: Inter, sans-serif;')
-    expect(css).toContain('--basalt-font-head: Poppins, sans-serif;')
-    expect(css).toContain('--basalt-font-mono: Fira Code, monospace;')
-  })
-
-  test('throws on values that could break out of the emitted declaration', () => {
-    expect(() => buildFontsCss({ sans: 'Inter; } body { color: red' })).toThrow(
-      /Invalid fonts.sans/,
-    )
-    expect(() => buildFontsCss({ head: 'Poppins }' })).toThrow(/Invalid fonts.head/)
-    expect(() => buildFontsCss({ mono: 'Fira /* x */ Code' })).toThrow(/Invalid fonts.mono/)
-    expect(() => buildFontsCss({ sans: "'Segoe UI', system-ui, sans-serif" })).not.toThrow()
-  })
-})

package/src/tokens/build-radius-css.test.ts

@@ -1,25 +0,0 @@
-/**
- * `buildRadiusCss` — the pure CSS-building half of the `{ radius }` option (see
- * `../theme/radius-option.test.ts` for the `theme.other.basaltRadius` round-trip this consumes).
- * `BasaltBridge` calls this directly to append overriding `--vx-radius-*` declarations to the same
- * injected `<style>` as the palette CSS; mirrors `build-fonts-css.test.ts`.
- */
-import { describe, expect, test } from 'bun:test'
-import { deriveRadius } from './palette'
-import { buildRadiusCss } from './index'
-
-describe('buildRadiusCss', () => {
-  test('returns empty string when radius is undefined', () => {
-    expect(buildRadiusCss(undefined)).toBe('')
-  })
-
-  test('emits all five overriding declarations under one :root block', () => {
-    const css = buildRadiusCss(deriveRadius(2))
-    expect(css).toContain(':root {')
-    expect(css).toContain('--vx-radius-card: 9px;')
-    expect(css).toContain('--vx-radius-ctrl: 8px;')
-    expect(css).toContain('--vx-radius-tight: 7px;')
-    expect(css).toContain('--vx-radius-fine: 6px;')
-    expect(css).toContain('--vx-radius-floating: 10px;')
-  })
-})

package/src/tokens/chart-margin.test.ts

@@ -1,39 +0,0 @@
-import { describe, expect, test } from 'bun:test'
-import { chartMargin, VX } from './index'
-
-describe('chartMargin', () => {
-  test('a bare call deep-equals VX.margin', () => {
-    expect(chartMargin()).toEqual(VX.margin)
-  })
-
-  test('{ rightAxis: true } widens right to the right-axis minimum', () => {
-    expect(chartMargin({ rightAxis: true })).toEqual({
-      ...VX.margin,
-      right: 40,
-    })
-  })
-
-  test('{ rightAxis: false } (or omitted) leaves right at VX.margin.right', () => {
-    expect(chartMargin({ rightAxis: false })).toEqual(VX.margin)
-  })
-
-  test('an explicit right overrides the rightAxis-widened value', () => {
-    expect(chartMargin({ rightAxis: true, right: 12 })).toEqual({
-      ...VX.margin,
-      right: 12,
-    })
-  })
-
-  test('explicit sides override their VX.margin defaults independently', () => {
-    expect(chartMargin({ top: 1, left: 2 })).toEqual({
-      top: 1,
-      right: VX.margin.right,
-      bottom: VX.margin.bottom,
-      left: 2,
-    })
-  })
-
-  test('returns a new object each call', () => {
-    expect(chartMargin()).not.toBe(chartMargin())
-  })
-})

package/src/tokens/density.test.ts

@@ -1,259 +0,0 @@
-/**
- * `deriveSpacing` — the spacing analog of `deriveRadius`. Locks the law (a `1 + 0.1 * level`
- * multiplier, over a narrower `[-3, 3]` range than `deriveRadius`'s `[-5, 5]` — see `deriveSpacing`'s
- * own JSDoc in `palette.ts` for why — applied to every density-tracking anchor/scale-stop/one-off,
- * rounded and floored at 1, plus the row line-height's own additive law) at a handful of levels,
- * plus the throw-and-propagate
- * validation and `buildDensityCss`'s CSS output. `theme/spacing.test.ts` separately locks that
- * `SPACE`/`SPACE_SCALE`/`SPACE_STEP`/`ROW_LINE_HEIGHT` equal `deriveSpacing(0)`'s output
- * byte-for-byte — this file is the law itself (and the CSS builder), not the shipped-identity
- * snapshot. Lives in `tokens/` (a sibling to `derive-radius.test.ts`/`build-radius-css.test.ts`,
- * merged into one file here) rather than extending `theme/spacing.test.ts`: that file's own doc
- * comment scopes it strictly to "the rendered output must stay byte-identical to the numbers
- * shipped" — the LAW at non-zero levels is a different concern, same split radius already made.
- */
-import { describe, expect, test } from 'bun:test'
-import { buildDensityCss, VX } from './index'
-import { deriveSpacing, scaleSpace } from './palette'
-
-// The "deriveSpacing(0) matches SPACE/SPACE_SCALE/SPACE_STEP/ROW_LINE_HEIGHT byte-for-byte" check
-// used to live here as its own test — deleted, not merely renamed: `SPACE`/`SPACE_SCALE`/
-// `SPACE_STEP`/`ROW_LINE_HEIGHT` (`palette.ts`) are DEFINED as `DEFAULT_SPACE_VALUES = deriveSpacing(0)`
-// and its destructured fields, so `expect(deriveSpacing(0)).toEqual({ anchors: SPACE, ... })` compared
-// `deriveSpacing(0)` against itself — no source-level change could ever fail it. The real level-0
-// acceptance gate (a hardcoded literal table, not a derived comparison) lives in
-// `theme/spacing.test.ts`.
-describe('deriveSpacing(0) reproduces the shipped identity exactly', () => {
-  test('a non-integer base (proseInlineCodeInsetY: 1.5) survives untouched at level 0', () => {
-    // The naive `Math.round(1.5 * 1)` rounds half-up to 2 — `deriveSpacing` must special-case
-    // level 0 to skip rounding entirely, or this silently regresses the byte-identical gate.
-    expect(deriveSpacing(0).step.proseInlineCodeInsetY).toBe(1.5)
-  })
-})
-
-describe('VX chart geometry at level 0 (single-sourced from SPACE_STEP)', () => {
-  // Locks the shipped identity so a future SPACE_STEP edit can't silently move chart geometry —
-  // `VX.dotR`/`VX.legendGap`/`VX.margin` (`tokens/index.ts`) read straight off `SPACE_STEP`, which
-  // is itself `deriveSpacing(0).step` (see the top describe block above).
-  test('dotR is 5', () => expect(VX.dotR).toBe(5))
-  test('legendGap is 22', () => expect(VX.legendGap).toBe(22))
-  test('margin is { top: 12, right: 16, bottom: 30, left: 44 }', () => {
-    expect(VX.margin).toEqual({ top: 12, right: 16, bottom: 30, left: 44 })
-  })
-})
-
-describe('a positive level scales anchors/scale/step by the multiplier, rounded', () => {
-  test('level +2: a 10px anchor -> 12, a 6px anchor -> 7', () => {
-    const result = deriveSpacing(2)
-    expect(result.anchors.rowInsetX).toBe(12)
-    expect(result.anchors.rowInsetY).toBe(7)
-  })
-
-  test('level +3 (the new endpoint — reproduces the old ±5 envelope, 0.1 * 3 === 0.06 * 5): the same two land at 13 / 8, and a 2px one-off lands at 3', () => {
-    const result = deriveSpacing(3)
-    expect(result.anchors.rowInsetX).toBe(13)
-    expect(result.anchors.rowInsetY).toBe(8)
-    expect(result.step.proseQuoteInsetY).toBe(3)
-  })
-
-  test('a scale stop moves independently of the anchor stack rhythm', () => {
-    const result = deriveSpacing(3)
-    expect(result.scale.xs).toBe(14)
-    expect(result.scale.md).toBe(23)
-    // scale.md (23) diverges from anchors.stackLg (20, rebuilt from the shared stack unit) — the two
-    // groups scale by different laws (independently-rounded stops vs one shared unit) and, since the
-    // component-roominess retune moved the scale off the stack rhythm, no longer even coincide at
-    // level 0. That the two can be read apart at all is the point this locks.
-    expect(result.anchors.stackLg).toBe(20)
-  })
-})
-
-describe('a negative level scales down, floored at 1 for any base >= 1', () => {
-  test('level -3 (the new endpoint): a 10px anchor -> 7, a 6px anchor -> 4', () => {
-    const result = deriveSpacing(-3)
-    expect(result.anchors.rowInsetX).toBe(7)
-    expect(result.anchors.rowInsetY).toBe(4)
-  })
-
-  test('level -3: a 2px one-off lands at 1, not 0 (the floor)', () => {
-    expect(deriveSpacing(-3).step.proseQuoteInsetY).toBe(1)
-  })
-
-  test("scaleSpace's unconditional floor actually engages for a sub-1 base — the property `deriveSpacing`'s own [-3, 3] range/bases can never exercise", () => {
-    // Every real `SPACE_ANCHORS_BASE`/`SPACE_SCALE_BASE`/`SPACE_STEP_BASE` value is an integer >= 1,
-    // and the shallowest multiplier `deriveSpacing` ever passes (0.7, at level -3) still keeps
-    // `round(v * 0.7) >= 1` for any `v >= 1` — so looping `deriveSpacing(-3)`'s own output (the old
-    // form of this test) can NEVER fail regardless of whether the floor exists at all. Drive
-    // `scaleSpace` directly with a sub-1 base instead (as its own JSDoc names this test for) to
-    // exercise the actual clamp: without it, `round(0.5 * 0.7) = round(0.35) = 0`.
-    expect(scaleSpace(0.5, -3, 0.7)).toBe(1)
-    // A future base as small as `0.1` collapses even further without the floor — confirms the clamp
-    // holds regardless of how far below 1 a hypothetical base sits, not just at the one boundary case.
-    expect(scaleSpace(0.1, -3, 0.7)).toBe(1)
-  })
-})
-
-describe('the input-height anchor scales with density', () => {
-  test('level -3/0/+3: 29 / 42 / 55', () => {
-    expect(deriveSpacing(-3).anchors.inputHeight).toBe(29)
-    expect(deriveSpacing(0).anchors.inputHeight).toBe(42)
-    expect(deriveSpacing(3).anchors.inputHeight).toBe(55)
-  })
-})
-
-// The "controlHeight tracks inputHeight at every level" cross-level check used to live here as its
-// own describe block — deleted, not merely renamed: both keys read the literal same
-// `CONTROL_HEIGHT_BASE` and are scaled by the SAME deterministic `scaleSpace` call, so
-// `controlHeight === inputHeight` is true BY CONSTRUCTION and can never fail regardless of what the
-// multiplier law actually computes. `theme/density-relations.test.ts`'s "Fix 1" describe block
-// replaced this exact form with one that asserts each key against its own hardcoded expected value
-// (29 / 34 / 38 / 42 / 46 / 50 / 55 across the full level range) — that version bites on a change to
-// `CONTROL_HEIGHT_BASE`, the multiplier law, OR a divergence between the two keys, none of which the
-// by-construction equality could catch. Not re-duplicated.
-
-// The 4px-stack-rhythm cross-level relation (2:1 pairs, exact multiples of stackXs) is covered by
-// `theme/density-relations.test.ts`'s "Fix 2" describe block — that version asserts the DOCUMENTED
-// exact multiples (2x/3x/4x/6x of stackXs), which subsumes and is strictly stronger than the
-// `% === 0` divisibility form this file used to duplicate here (any value that IS `stackXs * N`
-// trivially divides `stackXs`, so the weaker form added no independent coverage). Not re-duplicated.
-
-describe('rowLineHeight follows its own additive law, not the multiplier', () => {
-  test('level -3/0/+3: 1.25 / 1.35 / 1.45', () => {
-    expect(deriveSpacing(-3).rowLineHeight).toBe(1.25)
-    expect(deriveSpacing(0).rowLineHeight).toBe(1.35)
-    expect(deriveSpacing(3).rowLineHeight).toBe(1.45)
-  })
-})
-
-describe('stickyHeaderClearance derives from the AppShell header, not an independent base', () => {
-  test('level -3/0/+3: 43 / 60 / 77 — appShellHeaderHeight + anchors.stackMd at each level', () => {
-    const low = deriveSpacing(-3)
-    const zero = deriveSpacing(0)
-    const high = deriveSpacing(3)
-    expect(low.step.stickyHeaderClearance).toBe(43)
-    expect(low.step.stickyHeaderClearance).toBe(low.step.appShellHeaderHeight + low.anchors.stackMd)
-    expect(zero.step.stickyHeaderClearance).toBe(60)
-    expect(high.step.stickyHeaderClearance).toBe(77)
-    expect(high.step.stickyHeaderClearance).toBe(
-      high.step.appShellHeaderHeight + high.anchors.stackMd,
-    )
-  })
-
-  test('every level: the clearance exceeds the header it exists to clear, exactly by anchors.stackMd', () => {
-    for (let level = -3; level <= 3; level++) {
-      const { step, anchors } = deriveSpacing(level)
-      expect(step.stickyHeaderClearance - step.appShellHeaderHeight).toBe(anchors.stackMd)
-    }
-  })
-})
-
-describe('deriveSpacing rejects a malformed level', () => {
-  test('a non-integer throws', () => {
-    expect(() => deriveSpacing(1.5)).toThrow()
-  })
-
-  test('below -3 throws', () => {
-    expect(() => deriveSpacing(-4)).toThrow()
-  })
-
-  test('above 3 throws', () => {
-    expect(() => deriveSpacing(4)).toThrow()
-  })
-
-  test('the old ±5 endpoints are now out of range too', () => {
-    expect(() => deriveSpacing(-5)).toThrow()
-    expect(() => deriveSpacing(5)).toThrow()
-  })
-
-  test('NaN throws', () => {
-    expect(() => deriveSpacing(Number.NaN)).toThrow()
-  })
-})
-
-/** `SpaceValues` key → the `--vx-` suffix `spaceDecls` emits for it (`rowInsetX` → `space-row-inset-x`). */
-const kebab = (key: string): string =>
-  `space-${key.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase()}`
-
-describe('buildDensityCss', () => {
-  test('returns empty string when space is undefined', () => {
-    expect(buildDensityCss(undefined)).toBe('')
-  })
-
-  test('emits every anchor/one-off declaration under one :root block, at the retuned level', () => {
-    const css = buildDensityCss(deriveSpacing(3))
-    expect(css).toContain(':root {')
-    expect(css).toContain('--vx-space-row-inset-x: 13px;')
-    expect(css).toContain('--vx-space-row-inset-y: 8px;')
-    expect(css).toContain('--vx-space-row-line-height: 1.45;')
-    // REM, not px — see the input-height describe block below for why.
-    expect(css).toContain('--vx-space-input-height: 3.4375rem;')
-    expect(css).toContain('--vx-space-control-height: 3.4375rem;')
-    // 77, not the anchor/scale/step multiplier result for an 84px base — it is DERIVED (the header
-    // plus anchors.stackMd), see the dedicated describe block above.
-    expect(css).toContain('--vx-space-sticky-header-clearance: 77px;')
-    // JS-number-only constants (Timeline's bulletSize, VX chart geometry, Progress's size) have no
-    // CSS var to override — see `spaceDecls`'s doc in `tokens/index.ts`.
-    expect(css).not.toContain('--vx-space-timeline-bullet')
-    expect(css).not.toContain('--vx-space-chart-legend-gap')
-    expect(css).not.toContain('--vx-space-progress-bar-size')
-  })
-
-  // The spot-checks above lock VALUES; this locks the declaration SET. Without it, `spaceDecls`
-  // could silently drop a var the migrated CSS modules consume — density would stop applying there
-  // and every value-assertion above would still pass. Derived from the `SpaceValues` keys rather
-  // than a hand-listed 104-name snapshot, so a newly added anchor/one-off has to be either emitted
-  // or explicitly declared JS-number-only here.
-  test('emits exactly one var per SpaceValues key, minus the documented JS-number-only reads', () => {
-    const space = deriveSpacing(0)
-    const emitted = new Set(
-      [...buildDensityCss(space).matchAll(/--vx-(space-[a-z0-9-]+):/g)].map((m) => m[1] as string),
-    )
-    // Read straight off the resolved `SpaceValues` as a JS number instead of through a var — each
-    // has zero `var()` consumers, so a declaration would be dead weight. See `spaceDecls`'s doc in
-    // `tokens/index.ts` for why, and `deriveSpacing`'s JSDoc for the runtime gap the chart six have.
-    const jsNumberOnly = [
-      'space-timeline-bullet', // Timeline defaultProps.bulletSize
-      'space-progress-bar-size', // Progress defaultProps.size
-      'space-table-header-height', // Table.extend styles.th height
-      'space-table-row-height', // Table.extend styles.td height
-      'space-sidebar-account-menu-width', // Menu width prop
-      'space-sidebar-settings-menu-width', // Menu width prop
-      'space-app-shell-header-height', // AppShell header/navbar props
-      'space-app-shell-navbar-width',
-      'space-app-shell-navbar-rail-width',
-      'space-mobile-nav-bar-height', // AppShell footer.height prop
-      'space-mobile-nav-menu-width', // Menu width prop
-      'space-chart-legend-gap', // VX.legendGap / VX.margin / VX.dotR — visx SVG props
-      'space-chart-margin-top',
-      'space-chart-margin-right',
-      'space-chart-margin-right-axis',
-      'space-chart-margin-bottom',
-      'space-chart-margin-left',
-      'space-chart-dot-r',
-    ]
-
-    // `space.scale.*` (the generic Mantine scale) resolves through `--mantine-spacing-*`, not a
-    // `--vx-space-*` var, so it is not part of this contract at all.
-    const expected = [
-      ...Object.keys(space.anchors).map(kebab),
-      ...Object.keys(space.step).map(kebab),
-      'space-row-line-height',
-    ].filter((name) => !jsNumberOnly.includes(name))
-
-    expect([...emitted].toSorted()).toEqual(expected.toSorted())
-  })
-})
-
-describe('the input-height var is emitted in REM, never a flat px', () => {
-  test("level 0 emits exactly 2.625rem — Mantine's own --input-height-md value", () => {
-    expect(buildDensityCss(deriveSpacing(0))).toContain('--vx-space-input-height: 2.625rem;')
-    expect(buildDensityCss(deriveSpacing(0))).not.toContain('--vx-space-input-height: 42px;')
-  })
-
-  test('a retuned level still emits rem, computed from the scaled px anchor', () => {
-    // inputHeight scales like every other anchor (42 -> 55 at level +3, the new endpoint), then
-    // converts to rem — the LAW stays px-denominated; only the CSS emission is rem, per `pxRem`.
-    expect(deriveSpacing(3).anchors.inputHeight).toBe(55)
-    expect(buildDensityCss(deriveSpacing(3))).toContain('--vx-space-input-height: 3.4375rem;')
-  })
-})

package/src/tokens/derive-radius.test.ts

@@ -1,62 +0,0 @@
-/**
- * `deriveRadius` — the radius analog of `deriveTokens`'s color knobs. Locks the law
- * (`docs/DESIGN-SPEC.md` §4) at a handful of levels, plus the throw-and-propagate validation.
- * `theme/radius.test.ts` separately locks that `RADIUS`/`RADIUS_STEP` equal `deriveRadius(0)`'s
- * output byte-for-byte — this file is the law itself, not the shipped-identity snapshot.
- */
-import { describe, expect, test } from 'bun:test'
-import { deriveRadius, RADIUS, RADIUS_STEP } from './palette'
-
-describe('deriveRadius(0) reproduces the shipped identity', () => {
-  test('matches RADIUS/RADIUS_STEP exactly', () => {
-    expect(deriveRadius(0)).toEqual({
-      card: RADIUS.card,
-      ctrl: RADIUS.ctrl,
-      floating: RADIUS_STEP.floating,
-      tight: RADIUS_STEP.tight,
-      fine: RADIUS_STEP.fine,
-    })
-  })
-
-  test('card 7, ctrl 6, floating 8, tight 5, fine 4', () => {
-    expect(deriveRadius(0)).toEqual({ card: 7, ctrl: 6, floating: 8, tight: 5, fine: 4 })
-  })
-})
-
-describe('a positive level scales every anchor and its offsets', () => {
-  test('level +2: card 9, ctrl 8, floating 10, tight 7, fine 6', () => {
-    expect(deriveRadius(2)).toEqual({ card: 9, ctrl: 8, floating: 10, tight: 7, fine: 6 })
-  })
-
-  test('level +5: card 12, ctrl 11, floating 13, tight 10, fine 9', () => {
-    expect(deriveRadius(5)).toEqual({ card: 12, ctrl: 11, floating: 13, tight: 10, fine: 9 })
-  })
-})
-
-describe('a negative level clamps at zero instead of going negative', () => {
-  test('level -5: card 2, ctrl 1, floating 3, tight 0, fine clamps to 0', () => {
-    expect(deriveRadius(-5)).toEqual({ card: 2, ctrl: 1, floating: 3, tight: 0, fine: 0 })
-  })
-
-  test('level -2: card 5, ctrl 4, floating 6, tight 3, fine 2 (no clamp needed yet)', () => {
-    expect(deriveRadius(-2)).toEqual({ card: 5, ctrl: 4, floating: 6, tight: 3, fine: 2 })
-  })
-})
-
-describe('deriveRadius rejects a malformed level', () => {
-  test('a non-integer throws', () => {
-    expect(() => deriveRadius(1.5)).toThrow()
-  })
-
-  test('below -5 throws', () => {
-    expect(() => deriveRadius(-6)).toThrow()
-  })
-
-  test('above 5 throws', () => {
-    expect(() => deriveRadius(6)).toThrow()
-  })
-
-  test('NaN throws', () => {
-    expect(() => deriveRadius(Number.NaN)).toThrow()
-  })
-})

package/src/tokens/derive.test.ts

@@ -1,30 +0,0 @@
-/**
- * `derive.ts`'s fill-page contrast clamp — the law that an accent fill shifted off the band centre
- * by `accentBrightness` must still clear `FILL_PAGE_CONTRAST_MIN` (3.0:1) against BOTH derived page
- * backgrounds, never just the label-vs-fill floor. See the law comment above `FILL_LUMINANCE` in
- * `derive.ts`.
- */
-import { describe, expect, test } from 'bun:test'
-import { contrastRatio } from './hct'
-import { DEFAULT_DERIVE_CONFIG, deriveTokens } from './derive'
-
-const FILL_PAGE_CONTRAST_MIN = 3.0
-
-describe('the fill-page contrast clamp', () => {
-  test('the default config (accentBrightness 0) is a no-op — accentFill hex is unchanged', () => {
-    expect(deriveTokens(DEFAULT_DERIVE_CONFIG).accentFill.light).toBe('#4374a6')
-  })
-
-  for (const accentBrightness of [5, -5]) {
-    test(`accentBrightness ${accentBrightness} at the default seed clears 3.0:1 vs both derived page backgrounds`, () => {
-      const data = deriveTokens({ ...DEFAULT_DERIVE_CONFIG, accentBrightness })
-      const fill = data.accentFill.light
-      expect(contrastRatio(fill, data.surface.bg.light)).toBeGreaterThanOrEqual(
-        FILL_PAGE_CONTRAST_MIN,
-      )
-      expect(contrastRatio(fill, data.surface.bg.dark)).toBeGreaterThanOrEqual(
-        FILL_PAGE_CONTRAST_MIN,
-      )
-    })
-  }
-})