wifi-densepose/ui/mobile/src/components/ThemedText.tsx

29 lines
853 B
TypeScript

import { ComponentPropsWithoutRef } from 'react';
import { StyleProp, Text, TextStyle } from 'react-native';
import { useTheme } from '../hooks/useTheme';
import { colors } from '../theme/colors';
import { typography } from '../theme/typography';
type TextPreset = keyof typeof typography;
type ColorKey = keyof typeof colors;
type ThemedTextProps = Omit<ComponentPropsWithoutRef<typeof Text>, 'style'> & {
preset?: TextPreset;
color?: ColorKey;
style?: StyleProp<TextStyle>;
};
export const ThemedText = ({
preset = 'bodyMd',
color = 'textPrimary',
style,
...props
}: ThemedTextProps) => {
const { colors, typography } = useTheme();
const presetStyle = (typography as Record<TextPreset, TextStyle>)[preset];
const colorStyle = { color: colors[color] };
return <Text {...props} style={[presetStyle, colorStyle, style]} />;
};