crazycharge-app/component/global/normal_input.tsx

import React from "react";
import { TextInput, StyleSheet, StyleProp, ViewStyle, KeyboardTypeOptions } from "react-native";

interface NormalInputProps {
	placeholder: string;
	extendedStyle?: StyleProp<ViewStyle>;
	onChangeText: (text: string) => void;
	type?: KeyboardTypeOptions;
	secureTextEntry?: boolean;
	value?: string;
	textContentType?: "oneTimeCode";
}

const NormalInput: React.FC<NormalInputProps> = ({
	placeholder,
	extendedStyle,
	type,
	onChangeText,
	secureTextEntry = false,
	value,
	textContentType,
}) => {
	return (
		<TextInput
			style={[styles.textInput, extendedStyle]}
			placeholder={placeholder}
			placeholderTextColor={"#888888"}
			secureTextEntry={secureTextEntry}
			keyboardType={type ? type : "default"}
			value={value}
			onChangeText={(value) => onChangeText(value)}
			textContentType={textContentType}
		/>
	);
};

const styles = StyleSheet.create({
	textInput: {
		maxWidth: "100%",
		fontSize: 16,
		borderWidth: 1,
		padding: 20,
		borderRadius: 12,
		borderColor: "#bbbbbb",
	},
});

export default NormalInput;