import {StyleProp, Text, TextStyle, TouchableOpacity, ViewStyle} from 'react-native'
import React from 'react'
import {Utils} from 'tuya-panel-kit'

const cx = Utils.RatioUtils.convertX

interface TextButtonProps {
  text: string,
  onPress: () => void,
  style?: StyleProp<ViewStyle>
  textStyle?: StyleProp<TextStyle>
}

export default function TextButton(props: TextButtonProps) {
  return (
    <TouchableOpacity
      style={[{
        justifyContent: 'center',
        alignItems: 'center',
        alignSelf: 'center',
        paddingVertical: cx(8),
        paddingHorizontal: cx(12),
      }, props.style]}
      onPress={props.onPress}>
      <Text style={[{
        color: '#f60',
        fontSize: cx(14),
        fontFamily: 'helvetica_neue_lt_std_roman',
      }, props.textStyle]}>{props.text}</Text>
    </TouchableOpacity>
  )
}