@teknim/rjsf-mantine/lib/widgets/DateTime/DateTimeInput.js

Mantine theme, fields and widgets for react-jsonschema-form

import { jsx as _jsx } from "react/jsx-runtime";
import { useCallback } from 'react';
import { ariaDescribedByIds, labelValue, } from '@rjsf/utils';
import dayjs from 'dayjs';
import { DateInput } from '@mantine/dates';
const dateParser = (input, format) => {
    if (!input) {
        return null;
    }
    const d = dayjs(input, format);
    return d.isValid() ? d.toDate() : null;
};
const dateFormat = (date, format) => {
    if (!date) {
        return '';
    }
    return dayjs(date).format(format || 'YYYY-MM-DD');
};
export default function DateTimeInput(props) {
    var _a;
    const { id, name, value, placeholder, required, disabled, readonly, autofocus, label, hideLabel, rawErrors, options, onChange, onBlur, onFocus, valueFormat, displayFormat, } = props;
    const emptyValue = (_a = options === null || options === void 0 ? void 0 : options.emptyValue) !== null && _a !== void 0 ? _a : '';
    const handleChange = useCallback((nextValue) => {
        onChange(dateFormat(nextValue, valueFormat));
    }, [onChange, emptyValue]);
    const handleBlur = () => onBlur && onBlur(id, value);
    const handleFocus = () => onFocus && onFocus(id, value);
    return (_jsx(DateInput, { id: id, name: name, value: dateParser(value, valueFormat), dateParser: (v) => dateParser(v, displayFormat), placeholder: placeholder || undefined, required: required, disabled: disabled || readonly, autoFocus: autofocus, label: labelValue(label || undefined, hideLabel, false), onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, error: rawErrors && rawErrors.length > 0 ? rawErrors.join('\n') : undefined, ...options, "aria-describedby": ariaDescribedByIds(id), popoverProps: { withinPortal: false }, classNames: typeof (options === null || options === void 0 ? void 0 : options.classNames) === 'object' ? options.classNames : undefined, valueFormat: displayFormat }));
}
//# sourceMappingURL=DateTimeInput.js.map