import React, {FC, ReactNode} from 'react';
import {TouchableOpacityProps, TextStyle} from 'react-native';
import {StyledButton, Label} from '@styles/components/button';

export interface IProps extends TouchableOpacityProps {
  title?: string;
  disabled?: boolean;
  variant?: 'contained' | 'text';
  labelNode?: ReactNode;
  labelStyles?: TextStyle;
}

const Field: FC<IProps> = ({title, labelNode, labelStyles, ...rest}) => (
  <StyledButton disabled={rest?.disabled} {...rest}>
    {labelNode ? (
      labelNode
    ) : (
      <Label variant={rest?.variant} style={labelStyles}>
        {title}
      </Label>
    )}
  </StyledButton>
);

Field.defaultProps = {
  variant: 'contained',
};

export default Field;