[pickers][TimePicker] minutesStep prop not reflecting in UI intervals

[Nithinmon-D]

Steps to reproduce

No response

Current behavior

Scenario 1:

• The picker shows time intervals in 5-minute increments instead of 1-minute increments.
• Manually entering the time using the arrow key and number keypad allows you to set the minutes in 1-minute increments (1, 2, 3, 4, etc.).

Scenario 2:

• The picker still shows time intervals in 5-minute increments, despite explicitly setting minutesStep to 1.
• Manually entering the time using the arrow key and number keypad works as expected, allowing you to set the minutes in 1-minute increments.

Expected behavior

• When rendering the TimePicker with the default settings, the minutesStep should be 1, so the picker should show time intervals in 1-minute increments when clicking on the picker icon.
• When rendering the TimePicker with minutesStep={1}, the picker should show time intervals in 1-minute increments when clicking on the picker icon.

Context

No response

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: TimePicker

Search keywords:

[arthurbalduini]

Hello @Nithinmon-D,
I couldn't reproduce the described behaviors. Could you please share an example or a video of the issue ?

[Nithinmon-D]

Hello @Nithinmon-D, I couldn't reproduce the described behaviors. Could you please share an example or a video of the issue ?

import * as React from 'react';
import { DemoContainer } from '@mui/x-date-pickers/internals/demo';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
import { TimePicker } from '@mui/x-date-pickers/TimePicker';

export default function BasicTimePicker() {
return (

<DemoContainer components={['TimePicker']}>



);
}

since the minuteStep is 1 the interval should be 1, 2, 3, .... but instead it is 0, 5, 10.....

[arthurbalduini]

Hello @Nithinmon-D,
Thanks for the details. If I understand your issue correctly, to achieve such behavior you must set the timeSteps prop to have the step interval you wish. In that case, you would set it like:

<TimePicker
  timeSteps={{ minutes: 1 }}
/>

Let us know if it doesn't solve your needs.

[Nithinmon-D]

Hello @Nithinmon-D, Thanks for the details. If I understand your issue correctly, to achieve such behavior you must set the timeSteps prop to have the step interval you wish. In that case, you would set it like:

<TimePicker
  timeSteps={{ minutes: 1 }}
/>

Let us know if it doesn't solve your needs.

tx its worked

[github-actions]

⚠️ This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

@Nithinmon-D: How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.

[LukasTy]

Given this confusion, I think that we should unify the behavior of minutesStep and timeSteps and deprecate/drop the minutesStep prop in favor of one option for similar/same thing.
I have added this idea to the v8 preparation issue.