nej-react-utils/Form/Core/DateTimeField.js
2026-08-25 13:27:50 +02:00

32 lines
934 B
JavaScript

import tw, { styled } from "twin.macro";
import "styled-components/macro";
import dayjs from "dayjs";
import utc from "dayjs/plugin/utc";
import { DateTimePicker } from '@mantine/dates';
import '@mantine/dates/styles.css';
dayjs.extend(utc);
import { useField } from "@shared/nej-react-components/Parts/Input";
export default function DateTimeField(props) {
const [{onChange, value, ...field}, meta, helpers] = useField(props);
const parsedDate = dayjs(value);
const isValid = value && parsedDate.isValid();
const displayDate = isValid ? parsedDate.toDate() : null;
const {value: _x, onChange: _y, ...restProps} = props;
return <DateTimePicker
value={displayDate}
onChange={(val)=>{
const outDate = val && dayjs(val).isValid() ? dayjs(val).format("YYYY-MM-DDTHH:mm:ss") : null;
onChange({ target: { value: outDate, name: field.name } });
}}
{...field}
{...restProps}
/>;
}