40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import type { DateInput } from "@mantine/dates";
|
|
import type { ComponentProps } from "react";
|
|
|
|
import { bankDateInputValue } from "../model/form-validation";
|
|
import { bankDateSchema } from "../model/form.schema";
|
|
|
|
type DateField = {
|
|
onBlur: () => void;
|
|
onChange: (value: string) => void;
|
|
value: string;
|
|
};
|
|
|
|
function bankDateField(field: DateField) {
|
|
const dateParser: ComponentProps<typeof DateInput>["dateParser"] = (value) => {
|
|
const parsed = bankDateInputValue(value);
|
|
|
|
return bankDateSchema.safeParse(parsed).success ? parsed : null;
|
|
};
|
|
|
|
const onBlur: ComponentProps<typeof DateInput>["onBlur"] = (event) => {
|
|
field.onChange(bankDateInputValue(event.currentTarget.value));
|
|
field.onBlur();
|
|
};
|
|
|
|
const onInput: ComponentProps<typeof DateInput>["onInput"] = event =>
|
|
field.onChange(bankDateInputValue(event.currentTarget.value));
|
|
|
|
return {
|
|
dateParser,
|
|
onBlur,
|
|
onChange: (value: null | string) => field.onChange(value ?? ""),
|
|
onInput,
|
|
value: bankDateSchema.safeParse(field.value).success
|
|
? field.value
|
|
: undefined,
|
|
};
|
|
}
|
|
|
|
export { bankDateField };
|