37 lines
1.3 KiB
TypeScript
37 lines
1.3 KiB
TypeScript
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";
|
|
}
|