diff --git a/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.tsx b/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.tsx index 5b05d53e6c3..4b1d6e653c0 100644 --- a/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.tsx +++ b/packages/vuetify/src/labs/VTimePicker/VTimePickerClock.tsx @@ -102,6 +102,8 @@ export const VTimePickerClock = genericComponent()({ } function wheel (e: WheelEvent) { + if (!props.scrollable || props.disabled) return + e.preventDefault() const delta = Math.sign(-e.deltaY || 1) @@ -196,6 +198,8 @@ export const VTimePickerClock = genericComponent()({ } function onMouseDown (e: MouseEvent | TouchEvent) { + if (props.disabled) return + e.preventDefault() window.addEventListener('mousemove', onDragMove) @@ -233,7 +237,7 @@ export const VTimePickerClock = genericComponent()({ ]} onMousedown={ onMouseDown } onTouchstart={ onMouseDown } - onWheel={ (e: WheelEvent) => (props.scrollable && wheel(e)) } + onWheel={ wheel } ref={ clockRef } >
diff --git a/packages/vuetify/src/labs/VTimePicker/VTimePickerControls.tsx b/packages/vuetify/src/labs/VTimePicker/VTimePickerControls.tsx index 9e25f7557b0..6d862e0a4ec 100644 --- a/packages/vuetify/src/labs/VTimePicker/VTimePickerControls.tsx +++ b/packages/vuetify/src/labs/VTimePicker/VTimePickerControls.tsx @@ -59,6 +59,7 @@ export const VTimePickerControls = genericComponent()({ emit('update:selecting', SelectingTimes.Minute) } @@ -113,6 +115,7 @@ export const VTimePickerControls = genericComponent()({ 'v-time-picker-controls__time__btn__active': props.selecting === 3, 'v-time-picker-controls__time--with-seconds__btn': props.useSeconds, }} + disabled={ props.disabled } text={ props.second == null ? '--' : pad(props.second) } /> ) @@ -133,8 +136,9 @@ export const VTimePickerControls = genericComponent()({ 'v-time-picker-controls__ampm__btn': true, 'v-time-picker-controls__ampm__btn__active': props.period === 'am', }} + disabled={ props.disabled } text={ t('$vuetify.timePicker.am') } - variant="tonal" + variant={ props.disabled && props.period === 'am' ? 'elevated' : 'tonal' } onClick={ () => props.period !== 'am' ? emit('update:period', 'am') : null } /> @@ -146,8 +150,9 @@ export const VTimePickerControls = genericComponent()({ 'v-time-picker-controls__ampm__btn': true, 'v-time-picker-controls__ampm__btn__active': props.period === 'pm', }} + disabled={ props.disabled } text={ t('$vuetify.timePicker.pm') } - variant="tonal" + variant={ props.disabled && props.period === 'pm' ? 'elevated' : 'tonal' } onClick={ () => props.period !== 'pm' ? emit('update:period', 'pm') : null } />