import { describe, expect, test } from 'vitest';
import { emit } from './tokens-to-css.js';

const sample = {
  colors: {
    dark:  { obsidian: '#000', parchment: '#FFF' },
    light: { obsidian: '#FFF', parchment: '#000' },
    flat:  { accent: '#4A6B5C', 'on-action': '#E8E4D8' }
  },
  radii: { sm: '4px' },
  fontStacks: {
    display: "'Fraunces', serif",
    body:    "'Inter', sans-serif",
    mono:    "'JetBrains Mono', monospace"
  }
};

describe('tokens-to-css emit()', () => {
  test('emits :root block with dark and flat tokens', () => {
    const css = emit(sample);
    expect(css).toMatch(/:root \{[\s\S]*--fs-obsidian: #000;[\s\S]*--fs-parchment: #FFF;[\s\S]*--fs-accent: #4A6B5C;[\s\S]*--fs-on-action: #E8E4D8;[\s\S]*\}/);
  });

  test('emits [data-theme="light"] block with light tokens only', () => {
    const css = emit(sample);
    expect(css).toMatch(/\[data-theme="light"\] \{[\s\S]*--fs-obsidian: #FFF;[\s\S]*--fs-parchment: #000;[\s\S]*\}/);
  });

  test('flat tokens are not duplicated into the light block', () => {
    const css = emit(sample);
    const match = css.match(/\[data-theme="light"\] \{([\s\S]*?)\}/);
    expect(match).not.toBeNull();
    const lightBlock = match[1];
    expect(lightBlock).not.toContain('--fs-accent');
    expect(lightBlock).not.toContain('--fs-on-action');
  });

  test('preserves radii and font stacks in :root', () => {
    const css = emit(sample);
    expect(css).toContain('--fs-radius-sm: 4px;');
    expect(css).toContain("--fs-font-display: 'Fraunces', serif;");
  });
});