import { TextInput, type TextInputProps, type ViewStyle } from "react-native";
import { useTheme } from "../theme";

interface InputProps extends TextInputProps {
  error?: string;
}

export function Input({ error, style, ...props }: InputProps) {
  const theme = useTheme();

  return (
    <TextInput
      accessible
      accessibilityLabel={props.placeholder || "Внесете текст"}
      accessibilityRole="none"
      placeholderTextColor={theme.colors.textTertiary}
      style={[
        {
          backgroundColor: theme.colors.surface,
          borderColor: error ? theme.colors.error : theme.colors.border,
          borderWidth: 1,
          borderRadius: theme.radius.md,
          paddingVertical: 12,
          paddingHorizontal: theme.spacing.md,
          fontSize: 16,
          color: theme.colors.text,
        },
        error && { borderColor: theme.colors.error },
        typeof style === "object" ? style : undefined,
      ]}
      {...props}
    />
  );
}