You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
30 lines
1.2 KiB
30 lines
1.2 KiB
import React, {Component} from "react";
|
|
import {View, Text, TouchableOpacity, Image} from "react-native";
|
|
import {AntDesign, FontAwesome6} from "@expo/vector-icons";
|
|
import {AntDesignIconNames} from "./Icons";
|
|
|
|
interface CheckButtonProps {
|
|
label: string;
|
|
value: boolean;
|
|
onChange: () => void;
|
|
icon: AntDesignIconNames | string;
|
|
}
|
|
|
|
const CheckButton: React.FC<CheckButtonProps> = ({ label, value, onChange, icon }) => {
|
|
let AwesomIconList = ["weight-scale", "beer"];
|
|
return (
|
|
<TouchableOpacity onPress={onChange} className={`p-5 m-5 rounded-3xl ${value ? 'bg-orange-600 border-4 border-orange-300' : 'bg-gray-300 border-4 border-gray-300'} flex-row items-center`}>
|
|
<View className="mr-2.5">
|
|
{AwesomIconList.includes(icon) ? (
|
|
<FontAwesome6 name={icon} size={30} color={value ? "white" : "black"}/>
|
|
) : (
|
|
<AntDesign name={icon ?? "arrowleft"} size={30} color={value ? "white" : "black"}/>
|
|
)}
|
|
</View>
|
|
|
|
<Text className={`${value ? 'text-white' : 'text-black'} flex-1`}>{label}</Text>
|
|
</TouchableOpacity>
|
|
);
|
|
};
|
|
|
|
export default CheckButton; |