51 lines
1.2 KiB
TypeScript
51 lines
1.2 KiB
TypeScript
|
|
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>;
|
||
|
|
}
|