import React from "react";
import { Text, TextProps } from "react-native";
import { TextUtils } from "../../utils";

interface Props extends TextProps {
  onRef?: React.LegacyRef<Text>;
}

const ScalableText: React.FC<Props> = ({
  accessibilityLabel,
  children,
  onRef,
  style,
  ...props
}) => {
  const texUtils = TextUtils.getTextStyle(style);
  return (
    <Text
      ref={onRef}
      accessibilityLabel={accessibilityLabel}
      style={[
        style,
        {
          fontSize: texUtils.scaledFontSize,
          lineHeight: texUtils.scaledLineHeight,
        },
      ]}
      {...props}
    >
      {children}
    </Text>
  );
};

export default ScalableText;