import React from 'react';
import { Text as ReactNativeText } from 'react-native';

import { resolveTextColor, resolveTextStyles } from '../../../../internal/resolvers';
import type { TextProps } from '../../../../types/typography';
import { useTheme } from '../../../theme/runtime';

/*** Renders body text using Surface semantic typography. */
export function Text({
  children,
  i18nKey,
  variant = 'body',
  emphasis = 'default',
  color,
  align,
  weight,
  italic = false,
  numberOfLines,
  testID,
  style,
}: TextProps) {
  const { theme } = useTheme();
  const content = children ?? i18nKey ?? null;

  return (
    <ReactNativeText
      numberOfLines={numberOfLines}
      testID={testID}
      style={[
        resolveTextStyles(theme, { align, italic, variant, weight }),
        { color: resolveTextColor(theme, emphasis, color) },
        style,
      ]}
    >
      {content}
    </ReactNativeText>
  );
}