import { Pressable, Text, StyleSheet } from 'react-native';
import { Colors, Spacing } from '../constants/theme';

type PrimaryButtonProps = {
  title: string;
  onPress?: () => void;
};

export default function PrimaryButton({
  title,
  onPress,
}: PrimaryButtonProps) {

  const theme = Colors.light;

  return (
    <Pressable
      style={[styles.button, { backgroundColor: theme.backgroundElement }]}
      onPress={onPress}
    >
      <Text style={[styles.text, { color: theme.text }]}>
        {title}
      </Text>
    </Pressable>
  );
}

const styles = StyleSheet.create({
  button: {
    padding: Spacing.three,
    borderRadius: 12,
    alignItems: 'center',
    justifyContent: 'center',
  },
  text: {
    fontSize: 16,
    fontWeight: '600',
  },
});