By default MUI date time picker gets rendered like this:

  <LocalizationProvider dateAdapter={AdapterDateFns}>
    <DatePicker
      views={["month", "year"]}
      renderInput={(params) => <TextField {...params} />}
      label="Month & year"
      onChange={() => {}}
    />
  </LocalizationProvider>

I want it to look like normal label when it loses focus (say to emulate "View mode"):

And when one clicks on it, it should look like what is shown in first image (say to emulate "edit mode").

How we can achieve this?

PS1: here is the link to codesandbox

PS2: can someone let me know where we can find mui lab on unpkg? I was not able to find it here. Wanted to embed the whole code here itself as in this answer.