El comportamiento predeterminado de ClockPicker cuando se usa el componente TimePicker de Material-ui es:

1. ClockPicker muestra la vista de horas.
2. El usuario hace clic en un número de hora.
3. Al subir el mouse, ClockPicker captura ese valor y lo envía a través de su prop onChange y luego la vista de ClockPicker se cambia a la vista de minutos.
4. El usuario hace clic en un minuto.
5. Al subir el mouse, ClockPicker captura ese valor y lo envía a través de su prop onChange y luego el componente ClockPicker está oculto

Debido a que necesito tener más control sobre cuándo se muestra ClockPicker, no puedo usar el componente TimePicker sino el propio ClockPicker y cuando usa ClockPicker directamente, no se cierra automáticamente cuando los usuarios seleccionan un minuto, así que básicamente me gustaría volver a implementar ese comportamiento.

Inicialmente incluyo este código en el complemento onChange del componente ClockPicker:

 <ClockPicker onChange = { (newDate) => { if (date.getMinutes() !== newDate?.getMinutes()) { setDisplay(false) } }} />

date aquí es el objeto de fecha actual y newDate es el nuevo objeto de fecha que envía onChange prop a través de la devolución de llamada.

Básicamente, esto verifica cuándo un usuario cambia el valor de los minutos y oculta el componente en consecuencia.

El problema es que la devolución de llamada onChange se activa inmediatamente cuando el usuario presiona el mousedown sobre un número de minuto y no quiero eso, quiero que se mouseup solo cuando el usuario presiona el mouse, ¿cómo puedo lograr este comportamiento? desafortunadamente, ClockPicker no acepta la propiedad onMouseUp.