import React, {useState} from 'react';
import {View, StyleSheet, Text} from 'react-native';
import CheckBox from '@react-native-community/checkbox';
import {BLACK, PRIMERY} from '../color';

export default function Checkbox({value, onValueChange, text}) {
  return (
    <View style={styles.checkboxContainer}>
      <CheckBox
        disabled={false}
        value={value}
        onValueChange={onValueChange}
        tintColors={{true: PRIMERY}}
      />
      <Text numberOfLines={2} style={styles.checkText}>
        {text}
      </Text>
    </View>
  );
}

const styles = StyleSheet.create({
  checkboxContainer: {
    flexDirection: 'row',
    marginBottom: 10,
    alignItems: 'center',
    width: '100%',
  },
  checkText: {
    fontSize: 13,
    color: BLACK,
    width: '95%',
  },
});