import { Text as PdfText } from '@react-pdf/renderer';
import type { ReactNode } from 'react';

import { PDF_TOKENS } from './tokens';

/**
 * Brand-kit wrapper around @react-pdf/renderer's SVG `<Text>`. Exists because
 * the renderer accepts `fontSize`/`fontFamily`/`fontWeight` as presentation
 * attributes at runtime but the published types only declare the SVG-spec
 * subset. Wrapping here keeps the casts isolated to one file.
 */
export interface SvgLabelProps {
  x: number;
  y: number;
  fontSize?: number;
  fontFamily?: string;
  fontWeight?: string | number;
  fill?: string;
  textAnchor?: 'start' | 'middle' | 'end';
  transform?: string;
  opacity?: number | string;
  children: ReactNode;
}

export function SvgLabel({
  x,
  y,
  fontSize = PDF_TOKENS.sizes.caption,
  fontFamily = PDF_TOKENS.fonts.sans,
  fontWeight,
  fill = PDF_TOKENS.colors.text,
  textAnchor = 'start',
  transform,
  opacity,
  children,
}: SvgLabelProps) {
  // Runtime accepts these as presentation attrs; types omit them. Cast scoped here.
  const props = {
    x,
    y,
    fontSize,
    fontFamily,
    fontWeight,
    fill,
    textAnchor,
    transform,
    opacity,
  } as unknown as { x: number; y: number; fill: string };
  return <PdfText {...props}>{children}</PdfText>;
}