import type { VariantProps } from "@shopify/restyle";
import type { Theme } from "@themes/Theme";
import { TextInput } from "react-native";
import type { TextInputProps } from "react-native";
import Box from "./bases/Box";
import Text from "./bases/Text";

type Props = TextInputProps &
	VariantProps<Theme, "textVariants", "textVariants"> & {
		label: string;
	};

const Input = ({ label, textVariants, ...rest }: Props) => {
	return (
		<Box>
			<Text variant={textVariants}>{label}</Text>
			<Box backgroundColor={"lightGray"} height={50} borderRadius={10} my={"m"} p={"s"}>
				<TextInput style={{ height: "100%", width: "100%" }} {...rest} />
			</Box>
		</Box>
	);
};

export default Input;