If I click outside of the DateTimePicker popup onAccept is fired

[drmax24]

If I click outside of the DateTimePicker popup
onAccept is fired

I want onAccept to be fired only if I press OK. As far as I understand this should be an expected behavior.
If I add a cancel button though and if I click cancel then onAccept is not fired which is good.

import dayjs from "dayjs";
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { DateTimePicker as BaseDateTimePicker } from "@mui/x-date-pickers/DateTimePicker";
import "dayjs/locale/de";
import { useState } from "react";
import { DateTimePickerSlotsComponentsProps } from "@mui/x-date-pickers/DateTimePicker/DateTimePicker.types";

export const DateTimePicker = ({
    label,
    value,
    onChange,
    onAccept,
    minDateTime,
    disablePast = true,
    slotProps: slotProps,
}: {
    label: string;
    value: string | undefined;
    onChange?: (value: dayjs.Dayjs | null) => void;
    onAccept?: (value: dayjs.Dayjs | null) => void;
    required?: boolean;
    minDateTime?: string | null;
    disablePast?: boolean;
    slotProps?: DateTimePickerSlotsComponentsProps<dayjs.Dayjs>;
}) => {
    const [tempDate, setTempDate] = useState(value ? dayjs(value) : null);

    const mergedSlotProps = {
        ...{
            toolbar: {
                hidden: true,
            },
            textField: {
                sx: {
                    "& .MuiInputBase-input": {
                        padding: "8px",
                    },
                },
            },
        },
        ...slotProps,
    };

    return (
        <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="de">
            <BaseDateTimePicker
                label={label}
                defaultValue={tempDate}
                onChange={onChange}
                onAccept={(newValue) => {
                    if (newValue) {
                        setTempDate(newValue);
                        onAccept?.(newValue);
                    }
                }}
                ampm={false}
                disablePast={disablePast}
                minDateTime={minDateTime ? dayjs(minDateTime) : undefined}
                slotProps={mergedSlotProps}
            />
        </LocalizationProvider>
    );
};

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

Expected Behavior 🤔

Your Environment 🌎

| Tech | Version |
"@mui/x-date-pickers@^6":
version "6.20.2"
"@mui/[email protected]":
version "5.16.7"
next@^13.1.3:
version "13.1.6"

Search keywords:

[michelengelen]

Duplicate of #15646