import { StyleSheet, Text as RNText, View, TextProps as RNTextProps, PixelRatio } from 'react-native'
import React from 'react'

interface TextProps extends RNTextProps {
    /**
     * The type of the text.
     * Can be one of: "regular", "h1", "h2", "h3", "h4", "h5", "h6".
     */
    type: "regular" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6"

    /**
     * The text content to be rendered.
     */
    children: React.ReactNode
}

/**
 * Renders swit-byte Text component.
 *
 * @param {TextProps} props - The props for the Text component.
 * @param {string} props.type - The type of the text. Can be one of: "regular", "h1", "h2", "h3", "h4", "h5", "h6".
 * @param {string} props.children - The text content to be rendered.
 * @returns {JSX.Element} The rendered Text component.
 */
export function Text(props: TextProps) {
    const baseFontSize = PixelRatio.getFontScale() * 16;

    const fontSize = props.type === "h1" ? baseFontSize * 2 : props.type === "h2" ? baseFontSize * 1.5 : props.type === "h3" ? baseFontSize * 1.17 : props.type === "h4" ? baseFontSize : props.type === "h5" ? baseFontSize * 0.83 : props.type === "h6" ? baseFontSize * 0.67 : baseFontSize;

    return (
        <RNText style={
            {
                fontSize: fontSize,
                lineHeight: fontSize * 1.1,
                fontWeight: props.type.startsWith("h") ? "bold" : "normal"
            }
        }>{props.children}</RNText>
    )
}

const styles = StyleSheet.create({})