add an top resizer to modify the start of events

[Onatcer]

Hi thank you for the amazing work with this library.

I'm currently looking into using it for solidtime. For that use case it would be beneficial to have a resizer on the top as well so i figured i'll make a PR for that.

The current state of the PR enables both the top and bottom resizer by default when {resize: true} is set.

addresses #47

[Onatcer]

@antoniandre I pulled the main branch in this again. there is one bug in this branch still and i struggle to understand why it happens, maybe you have a pointer for me:

When using the Top Resizer, it always triggers event-delayed-click in the end, which the bottom resizer does not. The events after dragging for the Bottom resizer are: cell-mouseup, event-resize-end, cell-click. For the Top one they are: event-mouseup, event-resize-end, event-click, event-delayed-click.

When i look at the events cell.vue the target element for the mouseup seems to be .vuecal__cell-events for the bottom resizer (

vue-cal/src/vue-cal/components/cell.vue

Line 382 in dfbdcd0

if ((e.target || e.e?.target).closest?.('.vuecal__event')) return

). So my guess is i have to make sure the .vuecal__cell-events overlays the resizer so it revieves the mouseup event.

The .vuecal__cell-events in Cell.vue relies on $slots['cell-events'] && cellEvents.length which appears to be false for me in both scenarios. So, yeah, I'm a bit out of ideas. If you could provide any pointers on where I would need to look to fix this behavior, it would be greatly appreciated.

[reitowo]

Nice work!