[Feature Request] v-slider reliable slideStop event

[drhouse82]

Problem to solve

I'm using v-slider in two ways: live-updating a value when dragging and triggering some actions when the slide is finished. In other words, the dragging is used for something like a preview and the mouseUp serves as confirmation.

In vuetify 2.6, there is the "end" event in v-slider.
In vuetify 3.0.0 beta 13, to my understanding, this is so far missing.
I use vuetify 3 and I use the mouseup instead.

https://codepen.io/drhouse82/pen/KKRbpoJ?editors=1010
In the codepen you see a slider that is updating a first textfield on drag and a second textfield only upon mouseup. The issue is that this only works when the mouseup is taking place on the slider component. In the example, mouseup works as long as it is inside the red square, which is the surrounding the v-app tag. If I drag the slider and move the mouse outside the red rectangle and release the mouse button there, the event does never fire.

In my actual project, I wrapped the slider into a component "AdvancedSlider" and inside AdvancedSlider I register @mouseup on the slider and then emit "slideStop" to access it outside of the AdvancedSlider.
The big issue is: in this scenario the mouse needs to stay inside the AdvancedSlider COMPONENT, otherwise the mouseup event is not called. So, as soon as I move the mouse away from the slider area during dragging, the event will not fire. That makes it pretty unusable, because the user would need to know he really needs to stay on the slider track for it to work properly.

Proposed solution

Come up with a "end" or "slideStop" event that fires even if the mouse is dragged outside the component area during handle dragging.

[drhouse82]

For me, it seems I can get the desired behavior by implementing a slideStop event in the encapsulating Component like this:

function slideStop(){emit('slideStop')};

const emit = defineEmits([
    "slideStop"
]);

onMounted(()=>{
    window.addEventListener('mouseup',slideStop);
})
onUnmounted(()=>{
    window.removeEventListener('mouseup',slideStop);
})

[KaelWD]

Duplicate of #15675