import { inputValueToFieldValue, normalizeFieldType, valueToInputText } from "../utils/fieldDefinitions";

export type FieldValueInputProps = {
  fieldType?: string;
  value: unknown;
  disabled?: boolean;
  placeholder?: string;
  className?: string;
  onChange: (value: unknown) => void;
};

export default function FieldValueInput({ fieldType = "string", value, disabled = false, placeholder, className, onChange }: FieldValueInputProps) {
  const normalizedType = normalizeFieldType(fieldType);
  const inputType = inputTypeForField(normalizedType);
  const step = normalizedType === "integer" ? "1" : normalizedType === "double" ? "any" : undefined;

  return (
    <input
      className={className}
      type={inputType}
      step={step}
      value={valueToInputText(value, normalizedType)}
      disabled={disabled}
      placeholder={placeholder}
      autoComplete={normalizedType === "password" ? "new-password" : undefined}
      onChange={(event) => onChange(inputValueToFieldValue(normalizedType, event.target.value))}
    />
  );
}

function inputTypeForField(fieldType: string): string {
  if (fieldType === "integer" || fieldType === "double") return "number";
  if (fieldType === "date") return "date";
  if (fieldType === "password") return "password";
  return "text";
}
