import { describe, expect, it, vi } from 'vitest';

import { resolveTextStyleProps, resolveViewStyleProps } from './resolve-style-props';
import { m3Colors, m3Shape, spacing } from './proulr-theme';

vi.mock('react-native', () => ({
  Platform: {
    OS: 'web',
    select: (spec: Record<string, unknown>) => spec.default ?? spec.web ?? spec.ios ?? {},
  },
}));

describe('resolveViewStyleProps', () => {
  it('resolves snake_case StyleWire tokens', () => {
    const style = resolveViewStyleProps({
      background_color: 'surfaceContainerHigh',
      padding_horizontal: 'lg',
      padding_vertical: 'md',
      margin_top: 'sm',
      gap: 'md',
      border_radius: 'cornerExtraLarge',
      border_width: 1,
      border_color: 'outlineVariant',
      align_items: 'center',
      flex: 1,
    }) as Record<string, unknown>;

    expect(style.backgroundColor).toBe(m3Colors.surfaceContainerHigh);
    expect(style.paddingHorizontal).toBe(spacing.lg);
    expect(style.paddingVertical).toBe(spacing.md);
    expect(style.marginTop).toBe(spacing.sm);
    expect(style.gap).toBe(spacing.md);
    expect(style.borderRadius).toBe(m3Shape.cornerExtraLarge);
    expect(style.borderWidth).toBe(1);
    expect(style.borderColor).toBe(m3Colors.outlineVariant);
    expect(style.alignItems).toBe('center');
    expect(style.flex).toBe(1);
  });

  it('accepts camelCase aliases without dropping values', () => {
    const style = resolveViewStyleProps({
      backgroundColor: 'primaryContainer',
      paddingHorizontal: 'sm',
      alignItems: 'flex-end',
    } as Record<string, unknown>) as Record<string, unknown>;

    expect(style.backgroundColor).toBe(m3Colors.primaryContainer);
    expect(style.paddingHorizontal).toBe(spacing.sm);
    expect(style.alignItems).toBe('flex-end');
  });
});

describe('resolveTextStyleProps', () => {
  it('resolves color and text_align from snake_case wire', () => {
    const style = resolveTextStyleProps(
      { color: 'primary', text_align: 'center', typography: 'titleSmall' },
      'body',
    ) as Record<string, unknown>;

    expect(style.color).toBe(m3Colors.primary);
    expect(style.textAlign).toBe('center');
  });
});