Why not implement this as a directive ?

[lionel-bijaoui]

Since all this does is add a new type of event, I think it is better suited to be a directive (v-resize for example) instead of a component. That way, you can attach it to any element in the page with less visual clutter.

<div v-resize @resize="resize"><div>

At first, I though it would be impossible since you need the additional elements (<div @scroll="scroll"><div></div></div><div @scroll="scroll"><div></div></div>) but this script seem to work on any element and create the additional element needed without modifying/breaking the original element.

Why this choice ? Am I missing something ? Thank you.

[FranckFreiburger]

I agree that it could be very convenient to have a directive. resize-sensor needs to add an element inside the container you are watching for resizing. This mean that all element are not suitable for this operation. For example, <img v-resize> will fail (same for canvas, hr, br, ...).

[lionel-bijaoui]

Well, maybe add a warning for the edge cases ? They could still do something like that:

<div>
    <div v-resize @resize="resize"><div>
    <img>
</div>

Well, that was just my two cents, good luck for the future 👍