I want show a digital time picker or duration picker (only m,s). My project theme is in material UI, nextjs so i used materialUI config to implement this but it shows analog clock always. Below is my code and pic of UI. Tell me where I am wrong:

     <Grid item xs={12} lg={6} sm={12}>
        <FormLabel>Time Duration</FormLabel>
              <LocalizationProvider dateAdapter={AdapterDayjs}>
                
                <TimePicker
                  views={['minutes', 'seconds']}
                  openTo="minutes"
                  format="mm:ss"
                  value={formik.values.duration}
                  onChange={(newValue) => {
                    formik.setFieldValue('duration', newValue);
                    console.log(newValue);
                  }}
                  renderInput={(params) => (
                    <CustomTextField
                      {...params}
                      fullWidth
                      sx={{
                        '& .MuiSvgIcon-root': {
                          width: '18px',
                          height: '18px',
                        },
                        '& .MuiFormHelperText-root': {
                          display: 'none',
                        },
                      }}
                    />
                  )}
                />
              </LocalizationProvider>
            </Grid>

I tried material UI basic time picker but it always shows analogue clock. I want it that dropdown or digital clock